Tab

The tab component provides means to show the sub-resources(properties of type Array; For details on property types refer Meta Data (OpenAPI) specification in the HTTP API guide) of an object.

JSON Template

{
  "tabs": [{
    "sequence": 1,
    "tabResource": {
      "listResource": "{the name of the list property that is displayed by the tab}",
      "header": {
        "headerResource": "The list property to which listResource belongs to; applicable only for the hierarchical list in combination with results component",
        "properties": [{
          ...
        }]
      }
    },
    "actions":[
      "add"
    ],
    "quickSearch": {
    },
    "advancedSearch": {
    },
    "sort": {
    },
    "results": {
    },
    "table": {
    ...
    },
    "pagination":{
      "pageSize":""
    }
  }]
}

Every tab can be configured using the following setting options:

tabResource (mandatory)

sequence (mandatory)

actions(optional)

• add; applicable only when results component is use.

quick search component (optional)

advanced search component (optional)

sort component (optional)

results component or table component

• mandatory; one and only one of them should be specified

pagination (optional)

Tab Resource

The tabResource setting consists of 1) listResource and 2) header.

The listResource setting specifies the sub-resource (list) that must be shown in the tab. It is the anchor point, all other properties within the other components - sort, search, advanced search, and results; are defined relative to it.

The tab supports hierarchical list - a sub-resource up-to two level deep, i.e sub-resource of a sub-resource of an object - configuration when results component is used. For example, claim line message on the claim object can be configured in the tab on a page that has a parent resource as 'Claim'. When the listResource is a hierarchical list, the records are shown grouped by the header level sub-resource and therefore the header element must be specified when a hierarchical list is referenced in the tab. The headerResource specifies the 'parent' list to which the listResource belongs to. The header properties are use for grouping. For more details on grouping refer UI Specifics Results Component.

Quick Search, Advanced Search, and Sort Components

The quick search, advanced search, and sort components are placed next to each other and are left aligned.

Search and Advanced Search - In the case of a hierarchical list, when a search is performed, only the records that match the search condition(s) are shown. For Example, If claim line message list is shown in the tab and a search is performed on the message code, All the claim lines that have claim line messages which satisfy the search condition are shown. Also, when the claim line is expanded, the claim line messages which satisfies the search condition(s) are only shown, even though the claim line could possibly have other messages.

For a hierarchical list, the objects within the list are sorted within the top level (header) property.

Actions

Action 'Add; is shown at the same level as search and sort components, and is right aligned. Note that the action 'Add' on details in case of tab with table is driven by table component configuration.

Pagination

This component supports pagination and is used to display the list; a maximum of rows (number of parents in case of hierarchical list) as prescribed by the property pageSize are displayed.

UI Specifics - Results Component With Hierarchical List

When a listResource is a hierarchical list, the records are shown grouped by the header level resource. A collapsible header is displayed as the \{singular name of the header resource} \{ property values, comma separate}. This header is shown for every top-level record, irrespective of whether there are child records or not. When there are no child records within a nested list a message 'There is no \{child resource singular name} to display' is shown below the headed.

The headers are sorted by the header properties ascending in the order of the sequence.

Actions

For a hierarchical list, the action add requires the user to select the top level resource first, for this a checkbox is displayed whenever the action add is set to true. When 'Add' action is performed, the new record gets attached to the selected top-level record(s). If user has not selected any top-level resource, a message 'Please select atleast one {0}' , where 0 is top level (tab) object singular name.

Pagination

For a hierarchical list, when pagination and action 'add' both are applicable, a check box is displayed above the first result to enable selection of records:

1. All the visible records - 'Select All Visible'

2. All the records -'Select All'

Examples

Tab displaying list resource using results component

"tabs": [{
  "sequence": 1,
  "tabResource": {
    "listResource": "claimLineList"
  },
  results": {
    ...
    set1:{
      "properties":[
        { "name":startDate",
          "sequence":1
        }
       ...
      ]
    }
   }
 },
 "pagination":{
    "pageSize":"4"
 }
...
}

Tab displaying hierarchical list (sub resource of a sub resource) using results component

The tab resource is defined as :

"tabs": [{
  "sequence": 1,
  "tabResource": {
    "listResource": "claimLineMessageList",
    "header": {
      "headerResource":"claimLineList",
      "properties": [
        { "name":"code",
          "sequence": 1
        },
        { "name":"",
          "sequence": 2
        }
      ]
    }
  },
  "actions":[
    "add"
  ],
  results": {
    set1:{
      "properties":[ // this is relative to claimLineMessageList
        { "name":"severity",
          "sequence":1
        }
      ...
      ]
    }
  }
},
...
}