Detail Page Layout and Dynamic Tabs

For certain types of documents, you can change the look and behavior of their detail page.

Many document types have an out-of-the-box layout, so their detail page works fine without any layout configuration. This default layout can be changed, and you can re-configure it based on your needs - for example, add a tab with a dashboard with visualization of historical data for the specified customer.

But for Custom Forms, you define the Steps and Tabs for the detail page from scratch.

Figure 1. Model of the detail page layout

The detail page consists of Steps (sub-screens) and each Step can have multiple Tabs. Certain document types allow only one Step.

Each Tab can can hold one of the common predefined things like Workflow, Attachments, etc., but can also contain a custom dashboard with some visualizations.

Dynamic Tabs Availability in Pricefx Versions

from 8.1 (GodFather)
- Quotes
- Rebates
from 9.0 (Hurricane)
- Sales Compensation
- Custom Forms
from 10.0 (Beez Knees)
- Agreements & Promotions
from 11.1 (Paper Plane)
- Action Item

Layout Types

There are two layout types - DynamicTabs and DetailLayout. You cannot choose which one to use, because they’re predefined for each document type detail page.

Capability	DynamicTabs	DetailLayout

Capability	DynamicTabs	DetailLayout
Used in document types	Custom Form Standalone, Action Item	Quote, Rebates, Compensation, Agreements & Promotions
Supports Steps	yes	no
Supports Tabs	yes	yes
Tabs can be dynamically hidden	yes	no
Rendering	Usually, Steps are rendered horizontally and Tabs vertically. But you can select the layout type too.	Tabs are rendered horizontally.

Widgets

Each Tab is rendered using one Widget.

Widgets / Tab Types

The list of available widgets:

actions - List of "to do" actions.
attachments - List of attached documents. The user can add additional ones.
configurationWizards - Displays specified Configuration Wizard.
customForms - Displays specified "embedded" Custom Form.
dashboard - Displays specified dashboard.
details - Shows detail of the document.
documents - Shows 3 tabs (list of attachments, links to related quotes or other entities). In a Custom Form, until version 11.3, it renders as tab combining attachments and documents. Since version 12.0, the tab renders only documents - and for backwards compatibility you can use Advanced Property customFormUseMultiTabDocuments in migrated partitions to keep this old behavior.
externalApp - Uses iframe to show an external application.
header - Detail of the document (e.g. quote header)
items - List of the document items (e.g. list of quote line items)
messages - Messages (used as chat between the users cooperating on the document)
notes - Place, where users can write notes for the document.
records - Shows list of Rebate Records and Rebate Record Groups generated from the Rebate Agreement line items.
workflow - Shows workflow details - with list of approval workflow steps.
workflowHistory - Shows workflow history details.

When configuring the layout of the detail page, you can use only those widgets, which are supported by the type of document you’re configuring.

Here’s the overview of supported widgets by document types.

Widget	Quote	Agreements and Promotions	Rebate Agreements	Compensation Plan	Custom Form Standalone	Action Item

Widget	Quote	Agreements and Promotions	Rebate Agreements	Compensation Plan	Custom Form Standalone	Action Item
customForms	yes	yes	yes	yes	yes	yes
dashboard	yes	yes	yes	yes	yes	yes
messages	yes	yes	yes	yes	yes	yes
notes	yes	yes	yes	yes	yes	yes
documents	yes	yes	yes	yes	yes	yes
attachments	yes	yes	yes	yes	yes	yes
actions	yes	yes	yes	yes	yes	-
workflow	yes	yes	yes	yes	yes	-
workflowHistory	yes	yes	yes	yes	yes	-
header	yes	yes	yes	yes	-	-
items	yes	yes	yes	yes	-	-
externalApp	yes	yes	yes	yes	-	-
details	-	-	-	-	yes	yes
configurationWizards	-	-	-	-	yes	yes
records	-	-	yes	-	-	-

Some widgets can also have additional parameters, which influence their look and behavior.

details tab has the following parameters:
- "renderOutputsAs" : "inline" - to render the complex results not as a link, but directly it’s content. For example, instead of showing link to open a chart, it renders the chart right away in the results area.
  { "name" : "My CFO config", "tabs" : [ { "name" : "Details", "type" : "details", "parameters" : { "renderOutputsAs" : "inline" } } ] }

Configuration

The Steps and Tabs are defined as a JSON text, which is placed to the field configuration of the CompensationHeaderType, QuoteType, HeaderRebateType, ContractHeaderType, CustomFormType.

Syntax, all options and full description of this configuration is available in the provided JSON Schema:

download schema from version 6.0
download schema from version 9.1
download latest (or upcoming) schema version

Note, that Pricefx 9.x supports also the previous versions of the schemas, so you do not need to upgrade the configuration when moving to 9.x.

Samples

Quote detail page tabs sample configuration (using schema 6.0) - it still needs "default" step

{
  "default": {
    "name": "default",
    "tabs": {
      "header": {
        "name": "header",
        "type": "header"
      },
      "<items>": {
        "name": "items",
        "type": "items"
      },
      "<dashboard>": {
        "name": "<dashboard>",
        "type": "dashboard",
        "typeReference": "CustomerInsights_CustomerDetailView",
        "parameterMapping": {
          "Customer": "customerId",
          "Time Filter": "L12M"
        }

      }
    }
  }
}

Sample of dynamic condition for disableCheck and hiddenCheck

{
  "operator": "and",
  "criteria": [
    {
      "fieldName": "planStatus",
      "operator": "inSet",
      "value": [
        "DRAFT",
        "OFFER"
      ],
      "_constructor": "AdvancedCriteria"
    },
    {
      "operator": "or",
      "criteria": [
        {
          "fieldName": "planStatus",
          "operator": "inSet",
          "value": [
            "DRAFT",
            "OFFER"
          ],
          "_constructor": "AdvancedCriteria"
        },
        {
          "fieldName": "planStatus",
          "operator": "inSet",
          "value": [
            "DRAFT",
            "OFFER"
          ],
          "_constructor": "AdvancedCriteria"
        }
      ],
      "_constructor": "AdvancedCriteria"
    }
  ],
  "_constructor": "AdvancedCriteria"
}

Translation Keys

List of default translation keys, which you can use in the JSON tabs layout configuration:

sfdc_entity_tabs_header (sfdc_quotes_tabs_header)
sfdc_entity_tabs_items (sfdc_quotes_tabs_items)
sfdc_entity_tabs_attachments (sfdc_quotes_tabs_attachments)
dynamicTab_workflow (sfdc_entity_tabs_workflow)
sfdc_entity_tabs_workflowHistory (sfdc_quotes_tabs_workflowHistory)
dynamicTab_messages (sfdc_entity_tabs_messages)
main_rebateRecordsTitle
dynamicTab_actions
dynamicTab_notes
dynamicTab_dashboard (common_dashboard)
dynamicTab_documents

Configuration Engineer Knowledge Base