Skip to main content
Version: 6.18

Entity sections

Entity sections are the tiles displayed on case, contact and resource pages in the Web Client. You can arrange the sections according to the users' needs in your business processes.

The grid allows you to arrange and group the section and define their display state for the following pages:

  • Case page
  • Case creation page
  • Person page
  • Company page
  • Resource page

The configuration is stored in the page customization attribute sectionsGrid of the respective page in JSON format.

By default, all sections are displayed in a single column and are expanded.

Available sections

The available sections depend on the respective page type.

PageAvailable sections
Case creation pageDetails, Contacts, Comment
Case pageDetails, Contacts, Related cases, Related resources, History, Attachments, Time booking, Calendar
Person pageDetails, Cases, Comments and attachments, Related resources, Related contacts, Calendar, History
Company pageDetails, Persons, Cases, Comments and attachments, Related contacts, Related resources, History, Calendar
Resource pageDetails, Comments and attachments, Related resources, Related contacts, Related cases, Calendar, History

Basic tasks

Defining the layout

Simple layouts can be defined on the Entity sections page. There is one tab for each supported page type.

Please proceed as follows to define a layout:

  1. Select the desired tab (e.g. Case page).
  2. Click New container to add one or several sections.
  3. Define the initial state of each section (Expanded, Collapsed or Hidden).
  4. Click Create to add the container to the grid.
  5. Drag-and-drop the container to the desired position.
  6. Optionally, you can use Span right / Span left to define how many columns the container should occupy.
  7. Save the layout by clicking Save layout.

Containers define both vertical order and horizontal positioning:

  • Containers placed next to each other create columns.
  • Containers placed below each other extend the page downward.
  • Adding multiple sections to one container means they share the same grid cell.

Multi-column layouts are only applied if the user's screen provides sufficient space. On small screens the layout automatically falls back to a single-column view.

info

Sections which are not configured explicitly are placed at the end of the grid.

All JSON validation messages are displayed in English.

warning

Layouts that depend on roles, queues or other conditions must be defined via script, see Working with scripts

The Time booking section is ignored until version 6.19.

Advanced tasks

Understanding the syntax of the JSON configuration

The JSON structure saved in the Section configuration field reflects the visual grid configuration. The following general principles apply when defining the layout configuration:

  • The configuration is stored as a JSON array.
  • Each entry represents one section.
  • sectionId identifies the section.
  • row defines the vertical position (starting with 1).
  • col defines the horizontal position (starting with 1).
  • Sections with identical row and col values share the same grid cell.
  • positionInCell defines the order inside a shared cell.
  • Valid states are expanded, collapsed and hidden.

Example:

[
{"sectionId":"details","row":1,"col":1,"state":"expanded"},
{"sectionId":"contacts","row":2,"col":1,"state":"expanded"},
{"sectionId":"related_cases","row":2,"col":2,"state":"expanded"},
{"sectionId":"history","row":3,"col":1,"state":"collapsed"}
]

In most cases, manual editing of the JSON is not required, as the layout editor generates the configuration automatically.

Working with scripts

If the layout should depend on dynamic conditions such as user roles, queues or business logic, it needs to be defined using a script of the type Page customization.

You can select a script in the Script field of the Script and raw data section. The script must return the layout configuration in the format described in Understanding the syntax of the JSON configuration.

If a script is defined, it overwrites the layout defined in the grid. If both a grid configuration and a script are defined, the script configuration takes precedence.

You can enable Execute with admin permissions if the script needs elevated access rights.

Example: Adapting the layout to the user's role

The following example shows how to return different layouts depending on a role:

def role = roleService.getById('consultant');
def engineer = engineerService.getById(engineer_id);

if (getRolesForEngineer(engineer).contains(role)) {
return [config:"""[
{sectionId:details,row:1,col:1,state:expanded},
{sectionId:history,row:2,col:1,state:expanded}
]"""]
} else {
return [config:"""[
{sectionId:details,row:1,col:1,state:expanded},
{sectionId:attachments,row:2,col:1,state:collapsed}
]"""]
}