Schedule
The component displays data in a schedule formal, organizing the view into day, week, workweek (Monday to Friday), month and agenda formats.
How to Create
In the New Component Popup screen, select the
Schedule
type and clickNext
(Step 1).Enter the Component Name and specify the name to be displayed on the screen (either
Symbolic String
orCustom Name
), then select the Business Object you have created and click Next.Choose the fields of the Business Object that will be displayed in the list. The fields shown are those included in the Business Object selected earlier, with CALS System Fields being selected by default.
Applicable List of Component Attributes
- Tab Pane Id: When the screen is composed of a Tab Component and the corresponding component is placed at the bottom, then Panel Id value of the Tab Component is registered and used to connect to the Tab.
- SQL Log Active: Component에 The component stores the SQL statements executed by the registered Lambda Serice(Load, Save, Delete) and saves the log values until the specified time(SQL Log Active End Time)
- Views: This attribute is unique to the calendar component. When each item (day, week, workweek, month, agenda) is checked, a selectable view appears at the top right of the schedule screen, allowing the screen to be configured according to the checked formats.
- Current View: Specifies the initial screen displayed when showing the Schedule Component. It allows you to set the view selected from the Views section.
- Data Format: This attribute exists only in the Schedule Component. The default value is
yyyy-MM-dd
, displaying dates in the format1970-09-30
, and it can be customized. - Draggable: : Determines whether calendar data can be dragged. The default value is
false
. When set totrue
, you can register actions using thecell-drag
service to enable dragging actions. - Resizable: Determines whether calendar data can be resized. The default value is
false
, When set totrue
after registering thecell-drag
service, cells can be resized. - Category: This property allows you to specify the color of cells based on calendar data. The sub-property
Field
selects the field that determines the color, and Ref Code specifies the common code to associate with that field. Actual colors are defined inStyle - Category Color
. - Collapse Disable: The component's content collapsing feature has a default value of N/A, allowing the user to open and close the screen. If changed to
YES
, the collapsing feature is disabled. - Default Collapse State: When the Collapse Disabled attribute is active (Collapse Disabled =
FALSE
), users can collapse or expand the component's screen. The Default Collapse State attribute can be used to specify the default state, with the default value being N/A (Open), meaning the component is displayed in an expanded state. If set to Close, the component will be displayed in a collapsed state by default. - Display Full Size Fixed: This setting determines whether the component is displayed in full size on the screen. Typically,
Display Full Size Fixed
is used when there is only a single component on the screen. - Style – Size: Set the size of the component. Set the height in pixels and percent.
- Style – Category Color: This attribute, which exists only in the Schedule component, allows you to specify colors for each category. The color assignment is based on the code values from the Common Code.
- Style – Outline: This setting configures the outer border or outlibe type, of the component's list. If you set the type to
Folder
, the border of the list will change to a folder icon shape.
- Available Controls
- ToolbarButton: A button control within the Toolbar Component.
- ScheduleItem: A control used in the Schedule Component, representing each calendar item displayed on the screen.
ScheduleOtem
has aData Key
property through which you can specify values such as Id, Subject, Start Time, End Time, Description, Step, Manager, and Type. These values determine the position of data within the calendar.
Available List of Services
Name | Platform | Description |
---|---|---|
load | Common | Event that occurs when data loading |
cell-click | Web | The service corresponds to the deletion button icon on the detailed popup that appears upon clicking when data is registered in the calendar. |
cell-dbclick | Web | The service primarily connects to entering and editing new data when double-clicking on the calendar box. |
cell-drag | Web | The service connects to saving date data by allowing registered data to be repositioned using DragDrop for location changes. |
Cell-click: Connect delete lambda to the service connected to the trash can icon in the picture below.
[Image1. Connected icon to Cell-click]
[Image2. Cell-click's service]
Specify the calendar component as the component for deleting data within the calendar.
Specify sysIds as the selectData parameter for the Delete lambda.
Use the fixedDataSelect with componentId to specify the calendar componentId for data requery after deletion.
Cell-dbclick: Double-click on a calendar box connect primarily to entering and editing new data. It also links to the edit icon as shown in [Figure 1]. Thus, double-click and edit icon are simultaneously applied.
[Image1. Connected icon to cell-dbclick]
[Image2. Service of cell-dbclick in calendar component]
① Register the Show Popup Action.
② Register the URL of the input form component for creating or editing in the Path.
[Figure 3. controlId parameter of calendar cell-dbclick]
③ To bind data to the editing popup, the sys_id of the calendar component is stored and passed as the parameter key.
[Image3. Load service information for new calendar popup form component.]
④ In the Check Action, the parameters registered in the path of the cell-dbclick service from the calendar component are received as urlParams to perform input validation.
⑤ If thre is a passed urlParam value, the key value of urlParamSelect for loading data in the component is queried based on the SYS ID of the component.
[Image4. Add Component-Interface Action to the load of the popup Form Component]
⑥ Add Component-Interface to specify the start date, time, end time and time of the clicked point on the popup screen of the calendar.
⑦ Source Type: Set Source Type as
urlParam
and configure the Source Value with the following six values.- schedule_start_datetime
- schedule_start_date
- schedule_start_time
- schedule_end_datetime
- schedule_end_date
- schedule_end_time
⑧ Target Type: After setting controlId, specify the Control will receive the entered Source Value of the popup Form Component.
WARNING
The source value that can be specified varies depending on the type of target control.
- vQSText: date, datetime, time and others
- vQSDatePicker: date, datetime
- vQSDateTimePicker: date, datetime
- vQSTimeSelect: time
Cell-Drag: When dragging and dropping data in the calendar, implement a service to automatically save by updating the values of start-time and end-time to the datetime of the moved position.
[Image1. Cell-drag service]
Register a Save Action to allow the changed values to be saved.
Specify the controlId as the sysId, which is the data key for the Save Action.