Skip to content

Related Document

1 Purpose

This template is by no means a complete example of how to set up a related document. There are many ways to construct these. However it is common to set a 'type' field on a document, use that type in the summaryNameRule and then filter in the component for the 'types' appTag.

2 Template Example

  "components": [
        {
            "componentName": "sc-static-html",
            "fullWidth": true,
            "name": "panelStyle",
            "html": "<style>.panel-A {background: #ffffff;border:0px} .panel-A > .panel-heading {font-size:1.25em;height:35px;line-height:16px; color:#ffffff ; background: #000000} </style>"
        },
        {
            "componentName": "sc-static-html",
            "fullWidth": true,
            "name": "panelTP",
            "label": "Templates",
            "wrapAction": "open",
            "wrapHtmlType": "wrap",
            "wrapClass": "panel-A"
        },
        {
           "componentName": "sc-text-box",
           "label": "My Type",
           "mandatory":true,
           "name": "typeField"
        },
        {
            "componentName": "sc-static-html",
            "wrapHtmlType": "wrap",
            "wrapAction": "close",
            "name": "panelTP"
        },
        {
           "name": "appTags",
           "componentName": "sc-static-value",
           "visible": false,
           "value": [
                "formbird",
                "support",
                "types"
            ]
        }
    ],
    "appTags": [
        "formbird",
        "support",
        "types"
    ],
    "formColor": "#1B132D",
    "summaryNameRule":"{{{typeField}}}"

The following sc-related-document component would be used on a second template:
   {
            "componentName": "sc-related-document",
            "label": "Related Documents",
            "name": "relatedTypes",
            "showDropDown": true,
            "filter": "{'query':{'bool':{'filter':[{'term':{'appTags':'types'}},{'term':{'systemHeader.systemType':'document'}}]}}}",
            "fullWidth": true
        },

3 Customization

The example provided may require the following fields to be changed (the list is not exhaustive, just a reminder to check some items)
1. Styling definition
2. name fields of the components
3. label fields of the components
4. search criteria for sc-related-document
5. appTags array
6. formColor
7. summaryNameRule field