Skip to content

3. Screens ​

3.1 Navigation first ​

Leave Management
 |- Dashboard
 |- Leave Requests
 |- Leave Types
 |- Leave Balance
 |- Calendar
 '- Reports

Create the menu with icons, routes and permissions, and the application and module that own it. Visibility per role means an employee never sees Leave Types. See Menus and navigation.

3.2 Pages ​

Page kinds and what to use:

KindBuilt from
Listdata table block with search, filter, paging, and a "New" button
Detaila form plus related tables in tabs
DashboardKPI cards and charts (Dashboards)
Calendara calendar block bound to approved requests
Wizardthe page's Wizard steps
Settingsforms for policies

The structure is always page, row, column, item (block). Design the phone layout first, then tablet and desktop. Use visibility expressions ("show Approve only to managers") and a theme. Full detail: Page Designer.

3.3 Forms ​

The Leave Request form: Employee (defaulted to the signed-in user, read-only for employees), Leave type (select), From, To, Days (calculated from the dates), Reason, Attachment, Submit.

Configure required fields, validation, dependent fields (reason required for unpaid leave), defaults, calculated fields, conditional visibility and the submit action. See Form Designer.

3.4 Connect the UI to data ​

Block -> page data source -> provider -> REST path -> entity -> database
ConceptSet it up
Entity bindingthe page's data source name equals a provider's name; the provider's base path is the entity's records API
Queryfilters and sort on the table, or a data service for counts
Paginationon by default, never unbounded
Dynamic parametersa page variable feeds a filter (statusFilter)
Loading and error statesshown by the table block; set empty-state text
Refreshan action after save that reloads the table

If a table is empty, the three names do not line up: see Data providers.

Next: Behaviour.