Calendar

The calendar control is utilized to display items based on dates. Depending on the configuration, items shown in the calendar can be viewed, added, edited, and removed.

• The two first sections of the Calendar configuration are the same as that of the Data grid control. note that the Calendar does not support Row selection mode.

• Large Item Text In the mobile clients, there will not be a grid below the calendar; instead, there will be a list comprising large and small text. Click on an item in the list to view all grid columns in a grid item view.

• Small Item Text In the mobile clients, there will not be a grid below the calendar; instead, there will be a list comprising large and small text. Click on an item in the list to view all grid columns in a grid item view.

• Item Style Utilize a case statement to determine the color that the columns should have. Example:

  {case
      when Id = '1' then '#15A9E1'
      when Id = '2' then RGB(146,147,149)
      when Id = ‘3' then 'YELLOW'
      else '' 
  end}

  Colors: Set the color using the FlowScript RGB function followed by the RGB code or use a HEX code for the color. Additionally, you can use predefined colors from the fixed color palette: GREEN, RED, YELLOW, BLUE, and PURPLE.

• Condition To Hide Specify the condition that must be fulfilled for the control to be hidden. If left unspecified, the control will remain visible in the user step. Note that when controls are hidden, empty variables will be generated unless default values or pre-defined data exist.

• Blurbs Blurbs are displayed between the calendar and the table and can be used to visualize information to the user. For example, if the calendar is used for time reporting, a blurb can be used to visualize the total number of reported hours in the period. Blurbs are added and removed using the plus and minus buttons.

• Calendar start: Start date of the calendar, for example, 2024-05-05 or {now()-10}.

• Calendar end: End date of the calendar, for example, 2028-05-05 or {now()+10}.

• Unavailable days: An unavailable day will appear greyed out and will not be clickable. For example 2024-05-05, {now()-1} or enter multiple dates from a table, example {(selectedDay where status = 'Blocked').days}

• Selected date: This date will be selected by default when entering the user step with the calendar view, for example, 2024-05-05 or {now()-1}

• Read-only days: A read-only day will appear in red when selected, and it will not be possible to add, delete, or edit the data grid for those days. For example 2024-05-05, {now()-1} or enter multiple dates from a table, example {(selectedDay where status = 'Confirmed').days}

• Reloading behavior The control behavior at reloading, see User step reloading.

• Underlining Expression This is used to set a colored pill to be shown under the date. Utilize a case statement to determine the color that the columns should have based on a variable value.

• Starring Expression This is used to set a colored star shown at the top right of the date. Utilize a case statement to determine the color that the columns should have based on a variable value.