Skip to end of metadata
Go to start of metadata

You are viewing an old version of this content. View the current version.

Compare with Current View Version History

« Previous Version 15 Next »

Overview

  • Calendar is a graph that shows the current date and the current day of the week. Frequently, the overall year is divided into months, weeks, and days.

Configurations of a calendar component

Models

  • Model is the connection between the field and the event. A model needs to be bound when a user performs any action in an event.

  • In a calendar, only multi-record models are working. So you need to create a multi-record model.

    • Create a Multirecord model.

      • Goto Model tab.

      • Click the + icon.

        • A new blank model screen opens.

          • Enter information and save it.

        • Return to layout page

    • In the basic config, Click the + icon.

      • A new blank add model screen opens.

        • Enter information and save it.

  • Click the Run & Preview.

    • The calendar layout is open.

  • Click the Calendar icon.

    • The calendar view is open.

  • Click the Month dropdown.

    • There are 3 different options to display in the month dropdown

      • Month

      • Week

      • Day

Workflows

  • Workflow is basically a container that automates certain actions based on particular criteria. If the criteria are met, the actions get executed. When they are not met, records will get saved but no action will get executed.

  • There are multiple actions in the workflow

    • Eg: Push, Pop, Toaster, show spinner, etc.

Note: Workflow has to be created for New action.

  • Go to the Workflow tab.

  • Click the + icon.

    • A new blank workflow screen opens.

      • Enter information and save it.

  • Drag and drop the Push model.

    • Enter information and save it.

  • Return to the layout page.

    • Go to the Events tab.

    • In the New Action dropdown, click Workflow.

      • Create Workflow action, click Save.

  • Click the Run & Preview.

New

  • Click New.

    • Enter information and save it.

  • The record is shown in the calendar.

Refresh

  • Reload any previously saved information by using Refresh.

    • Click Refresh.

      • All the information has been loaded into the calendar.

How to Configure:

  1. Goto Components tab

  2. Search and select the component

  3. Drag and drop the component in the layout. You can also select the drop zone in a layout and then click on the component it will add in place of the drop zone

Following are the common configurations of components on the layout:

  • UI:

    • Component Size: The user can modify the size of the component in the layout as per grid size

    • Padding Location: Defines the position of the padding for a component. The padding creates extra space within a component.

      • Around: Creates padding around the component

      • Top: Creates padding at the top of the component

      • Left: Creates padding at the left side of the component

      • Bottom: Creates padding at the bottom of the component

      • Right: Creates padding at the right side of the component

      • Horizontal: Creates padding horizontally

      • Vertical: Creates padding vertically

    • Padding Size: The padding size of the component can be set to:

      • None

      • xxx-small

      • xx-small

      • x-small

      • Small

      • Medium

      • Large

      • x-large

      • xx-large

    • Style: Styles described how fields should be rendered in preview mode. Users need to create one cdn link from the CSS tab on the layout designer page for use styles

    • Classes: Classes are used to apply unique styling and formatting to the fields in preview mode. Users need to create one cdn link from the CSS tab on the layout designer page for using classes

    • Margin Location: Defines the position of the margin for a component. margin creates extra space around a component.

      • Around: Margin gets added around the component

      • Top: Margin gets added at the top of the component

      • Left: Margin gets added at the left side of the component

      • Bottom: Margin gets added at the bottom of the component

      • Right: Margin gets added at the right side of the component

      • Horizontal: Margin gets added horizontally

      • Vertical: Margin gets added vertically

    • Margin Size: The margin size of the view can be set to:

      • None

      • xxx-small

      • xx-small

      • x-small

      • Small

      • Medium

      • Large

      • x-large

      • xx-large

    • Visibility:

      • Never: The field cannot be visible

      • Always: The field will be always visible

      • Conditional: Depending on the visibility criteria, the field can be set as visible or not

    • Read-only:

      • Never: The field cannot be read-only

      • Always: The field will be always read-only

      • Conditional: Depending on the read-only criteria, the field can be set as read-only or not 

    • Disable:

      • Never: The field cannot be disabled

      • Always: The field will be always disabled

      • Conditional: Depending on the disability criteria, the field can be set as disabled or not

    • New Section:

      • Layout item Label: This field show the name of the components with the count of its usage e.g: if you are adding the section for third time in a layout then it will display with label of Section 3

  • No labels