Skip to main content

(2) Define the User Interface

- Support Ticket Tutorial -

With a simple data foundation complete, it is time to fill the Ticket Entity pages that were established above: Create Page, Detail Page and List Page.

7. Define the Ticket List Page

The Ticket List Page will be a simple list of Support Tickets, with the User, the Time Created and the Severity.

  • In the sidebar, click UI. In the UI side panel, locate the Entity Pages subsection
  • Double-click Ticket List
  • On the Ticket List overview, the Columns tab will show by default
  • Entity detail column is added by default to create a link to the Ticket Detail page
  • Click the (+) Add Column
  • Select the additional columns that will appear: Created By, Created Date and TicketSeverity
  • Click Close
  • In the Created date row, click the checkbox in the Default column for sorting column and choose Descending from the dropdown
    • Tickets will be sorted from the most recent
  • Save changes: Ctrl + S

8. Define the Ticket Create Page

The Ticket Create page will define how new tickets will be created.

  • In the Entity Pages subsection, double-click Ticket Create
  • In the center of the page, click Add View. Click Create Empty View for Ticket
  • In the layout editor add Data Fields. Click Title, TicketSeverity and Description
  • Click OK

Set the Layout so that it can be shared on the Ticket Detail page.

  • In the Layout section, click More in the top-right corner of the view
  • Click Make Shared
  • Click Ctrl + S

9. Define the Ticket Detail Page

The Ticket Detail page will serve as the repository for the Support Tickets. It will use the shared view that was established on the Ticket Create page.

  • In the Entity Pages subsection, double-click Ticket Detail
  • In the center of the page: Click Add View
  • Click Add Shared View for Entity Ticket
  • Save changes: Ctrl + S

10. Application Menu

The User Interface now needs links to create and access tickets.

  • In the UI side panel, locate the Application Menu button at the top
  • Click Application Menu
  • Click (+) Add Menu Item
  • Set Menu Item Action to List page
  • Set List page to Ticket list
  • Click OK
     
  • Click (+) Add Menu Item again
  • Set Menu Item Action to Entity create page
  • Set Entity Page to Ticket create
  • Change the Menu Item Icon to (+) Create
  • Click OK
  • Save changes: Ctrl + S