Creating a custom case page by using human services

Edit online
Draft comment:
This topic is shared by BAW, CP4BA. Last updated on 2025-03-13 12:15
You can customize your case pages by using client-side human services to meet the requirements of your case solution. Use custom layouts as templates to provide customized views for different roles, case types and activities.

Before you begin

Start with a case solution that has the required roles, case types, and properties. See Adding a solution.

About this task

A page contains the user interface elements that are required to complete an activity. Case Builder provides different default page layouts for an action, for example, Add Case that is widget-based and Add Case Default (Human Service) that is human service-based. Set your default page layouts to human service-based pages.

The new human service page is hosted in Case Client using the adapter pages. For more information, see Adapter pages. The case toolbar widget displays the toolbar, and the client-side human service viewer displays the human service, which you edit to create your custom page. After you create your case page, you can test it in the development environment, then deploy your case solution to a production environment.

In the Case Client, the case details human service adapter page includes a case widget and a client-side human service viewer stacked vertically.

Procedure

To create a custom human service case page layout:

  1. Open your case solution and case type.
  2. Under Case Type, there are links for three types of layout New Add Case layout, New Split Case layout and New Case Details layout.
    • For a custom add case layout, click New Add Case layout.
    • For a custom split case layout, click New Split Case layout
    • For a custom case details layout, click New Case Details layout.
    Note: When you use a custom Add Case client-side human service layout, the case is created in the context of the initiating user through the JavaScript API tw.system.createCase. However, if you call tw.system.createCase independently from a script or within a service call in a process, it runs in the context of the system user. As a result, the system user becomes the owner of the case.
  3. In the Views tab of your case solution, under Case Layouts, enter a name and define the layout for the new human service custom page.
    Notice that an adapter page is chosen by default. If you want to combine human service views with widgets, you can edit this adapter page.
  4. Click OK to save the new custom human service page.
    The new page is now listed in the Views tab. This page is an editable copy of the default page.
  5. Customize your new case layout as needed:
    1. Click the case layout name.
      The client-side human service editor opens in Workflow Designer.
    2. In the editor, click Coach and select from Edit Case Properties, Split Case or Case Details, depending on the type of layout you chose earlier.
    3. Customize the layout by moving, arranging and adding views as needed.
      See Case toolkit.
    4. Add the required case properties to the layout. All the case properties that you create are stored in the caseProperties content object. Under Drag a component to your page, click All views > Variables, then drag the required properties onto the drop zone in the layout.
  6. Deploy and run the case solution, which takes you to the Case Client.
    Note: You must be assigned to the role associated with the case solution to proceed. If not, request your administrator to assign you to the appropriate role.