<h1>Dashboard customization</h1>
<h2>Introduction</h2>
<p>There are many options for customizing the contract dashboard. With the current version, you can configure it on your own in a separate config file that is no longer overwritten by updates.</p>
<h2>Combination</h2>
<p>The dashboard configuration is compiled into the complete configuration object as follows:</p>
<ol>
<li>The dashboard uses the default settings of the JSON configuration file in the repository<br>
<span
style='font-style:italic'>Administration\Business Solutions\contract\ELOapps\Apps\sol.contract.apps.Dashboard\app\Dashboard.config.base.js </span> <br>
which contains all possible configuration values that are used as a basis and can be overwritten. This documentation will describe the possible changes.</li>
<li>The default Business Solutions settings are made in the <br>
<span
style='font-style:italic'>Administration/Business Solutions/contract/Configuration/sol.contract.dashboard.config </span>configuration.</li>
<li>Always customize your settings in the <br>
<span
style='font-style:italic'>Administration/Business Solutions </span><span
style='font-weight:bold;font-style:italic'>Custom</span><span style='font-style:
italic'>/contract/Configuration/sol.contract.dashboard.config</span> configuration. <br>
The values in this file overwrite the configuration from 2 and 1. If this path or the configuration does not exist, you can create it and import a new JSON configuration file.<br>
&nbsp;
{@img img1.png}</li>
<li>Finally, user settings (<span
style='font-style:italic'>ProfileOpts</span>) overwrite individual configuration settings so that users can keep their settings in the interface across sessions. </li>
</ol>
<p><span class="tag_important">The old configuration in <span
style='font-style:italic'>Administration\ELOapps\Configuration</span> is no longer used. When migrating to the new version, customizations in this configuration have to be migrated manually.</span>
The WF no longer has to be updated. All you have to do now is reload the dashboard.</p>
<h3>Changing the dashboard data path</h3>
<p>You can change the path that provides the dashboard with contract data. By default, this path is:</p>
<blockquote>
<p><span
style='font-style:italic'>ARCPATH[(E10E1000-E100-E100-E100-E10E10E10E00)]:/Business Solutions/contract/Dashboard-Data/</span></p>
</blockquote>
<p>To change the path, you should only change the configuration in the Business Solutions Custom folder instead of in the app or the original Business Solutions folder. Open (or create, if necessary) your configuration under</p>
<blockquote>
<p><span
style='font-style:italic'>Administration/Business Solutions Custom/contract/Configuration/sol.contract.dashboard.config </span></p>
</blockquote>
<p>and insert the following setting (change the path):</p>
<pre><code>{
   &quot;elo&quot;:{
      &quot;ix&quot;:{
         &quot;rootPath&quot;:&quot;ARCPATH[(E10E1000-E100-E100-E100-E10E10E10E00)]:/Business Solutions/contract/Configuration/Dashboard-Data/&quot;
      }
  }
}
</code></pre>
<p>Next, you have to refresh the dashboard in the Java Client or browser (right-click or F5).</p>
<h4>Assigning rights within the Dashboard-Data folder</h4>
<p>If you want to create custom dynamic folders, add new dynamic folders to</p>
<p><span
style='font-style:italic'>Administration\Business Solutions Custom\contract\Configuration\Dashboard-Data</span></p>
<p>You can assign different rights to specific search folders in order to show or hide these folders for certain users or groups. <span
style='font-weight:bold'>Of course, the user will only see the contracts the user has access to in the repository/found by the search.</span></p>
<p><span class="tag_important">First, with a restricted user, check the rights and whether the visibility of the dynamic folder in the dashboard is correct.</span></p>
<p><span class="tag_warning">The Dashboard-Data folder within the Business Solutions (not Custom) is <span
style='text-decoration:underline'>not</span> used for configuration. It is a dynamic folder that behaves differently than expected when configuring settings and security rules. A script works in the background that takes over the Custom area of the Dashboard-Data folder in the Business Solutions so that the <span
style='font-style:italic'>rootPath</span> in the dashboard configuration can be set to the indicated folder.</span></p>
<p><span class="tag_caution">The dashboard only works if the user has access to at least one search folder (normally <span
style='font-style:italic'>All contracts</span>) within the Dashboard-Data folder. Otherwise, a TypeError script error is shown. </span></p>
<p><span class="tag_important">The security settings for the Dashboard-Data folder have been configured so that the dashboard works straight away. Being able to find folders via the search function or open the dashboard as a restricted user does not mean the user can also see the contracts!</span></p>
<h3>Extending columns for the contract list</h3>
<p>The contract list can be extended with separate index fields by modifying the configuration file in the repository. Currently, map fields are not supported since they cause major performance issues when displaying high data volumes.</p>
<p>The column settings are available via the settings object in JSON in the configuration path <code>table.columns</code>.</p>
<p>This JSON object contains all column definitions. There are <span
style='font-weight:bold'>preset columns</span> that are always included and can only be modified (e.g. ContractNumber). <span
style='font-weight:bold'>Custom columns</span> can be added as well. The order of the keys (e.g. ContractNumber) also defines the order of the columns in the table. This order can be changed by the user in the interface.</p>
<h4>Preset columns</h4>
<p>Preset columns contain some fields that influence the behavior of a column. Columns are defined uniquely by the name within the <code>columns</code> object. Currently the following preset columns exist:</p>
<ul>
<li>ContractNumber</li>
<li>ContractName</li>
<li>ContractType</li>
<li>PartnerName</li>
<li>ContractDate</li>
<li>CompanyName</li>
<li>ContractStart</li>
<li>ContractEnd</li>
<li>ContractCashFlowLocalCurrency</li>
<li>ContractRiskClass</li>
<li>ContractStatus</li>
<li>NextReminderDate</li>
<li>NextPossibleTermination</li>
</ul>
<h4>Generating custom columns</h4>
<p>Custom columns can be inserted in the <code>columns</code> object at the location they are to be displayed in the list (the order of columns can be changed by the user, however). Each column is defined by an object (the column object), which is defined by a unique key.</p>
<p>Some columns can be created in two ways. The first way requires knowledge of <a
href="http://ui-grid.info/">AngularUI grid components</a>. The fields of the inserted object correspond to the fields of the UI grid column configuration object <code>columnDef</code>. Index fields are automatically requested by IX via the <code>field</code> property.</p>
<p>The second way simplifies the creation of custom columns. A child object <code>solSimple</code> is inserted in the column object. The object can contain the following properties:</p>
<table><thead><tr><td>'columnTitle' - optional</td><td>Optional text used to set the column heading. If this value is not defined, the column heading of the index key from the keywording form is used.</td></tr></thead><tbody><tr><td>columTitleLocale - optional</td><td>Like columnTitle, but expects a translation key from the <span
style='font-weight:bold;font-style:italic'> locale</span> file. </td></tr><tr><td>'fieldName' - mandatory</td><td>Defines the index key/group name that defines the keywording form field.</td></tr><tr><td>'type' - mandatory</td><td>Defines the content type for the list. The property can have the following values:<br /><span
style='font-style:italic'>'string': </span>The values of the sord are output unformatted<br /><span
style='font-style:italic'>'number': </span>The values of the contract are output formatted as a number The thousands separator may be used (user-dependent).<br /><span
style='font-style:italic'>'date': </span>The values of the contract are output formatted as a date according to the user's settings.<br /><span
style='font-style:italic'>'currency': </span>The values of the contract are output formatted as a currency.<br /><span
style='font-weight:bold'>NEW</span>: <span style='font-style:italic'>'currencyLocal': </span>The values of the invoice are output formatted as a currency. The currency of the invoice is used. If you specify this value, you have to set another property <span
style='font-style:italic'>currencyField</span> for the group field name containing the currency symbol name (z.B. CONTRACT_CURRENCY_CODE). </td></tr><tr><td>'allowAggregation' - optional</td><td>Defines whether aggregations (sum, minimum, maximum, average) of the values can be calculated. For grouped columns, an aggregated value is displayed in the column header. <br /><br />If this property is not defined<span
style='font-style:italic'> 'false'</span>  is applied by default unless the column type is  <span
style='font-style:italic'>'number'.</span></td></tr><tr><td>'allowGrouping' - optional</td><td>Defines whether the column can be grouped (via the column menu). <br /><br />If this property is not defined,<span
style='font-style:italic'> 'false'</span> is applied by default unless the column type is<span
style='font-style:italic'> 'string'</span> or<span style='font-style:italic'> 'date'.</span></td></tr><tr><td>'isSearchable' - optional</td><td>Defines whether the column can be searched by the user by default. The value is set to <span
style='font-style:italic'>'true'</span> by default. If the value is set to <span
style='font-style:italic'> 'false'</span>, the user can still search the column via the list setting (available via the list menu).</td></tr></tbody></table>

<p>All named properties (<code>width</code>, <code>minWidth</code>, <code>visible</code> etc.) can be used outside of the <code>solSimple</code> object.</p>
<p>The following example shows how to insert a column for the contract example field. The corresponding JSON path is : &quot;table.columns&quot; (see also the example in the chapter &quot;Example configuration&quot; futher below):</p>
<pre><code>{ &quot;table&quot; : { &quot;columns&quot; : {
   &hellip;
   &quot;contractExample&quot; : {
     &quot;solSimple&quot; : {
       &quot;fieldName&quot; : &quot;CONTRACT_EXAMPLE&quot;,
       &quot;type&quot; : &quot;string&quot;
      },
     &quot;width&quot;: 100
   }
  &hellip;
}
</code></pre>
<p>The contract management dashboard also has another list that has to be configured separately in the calendar. It is configured in the same way as the main list.</p>
<pre><code>{ &quot;calendar&quot; : { &quot;dayTable&quot; : { &quot;columns&quot; : {
   &hellip;
   &quot;contractExample&quot; : {
     &quot;solSimple&quot; : {
       &quot;fieldName&quot; : &quot;CONTRACT_EXAMPLE&quot;,
       &quot;type&quot; : &quot;string&quot;
      },
     &quot;width&quot;: 100
   }
  &hellip;
}
</code></pre>
<p><span class="tag_important"><span
style='font-weight:bold'>Important!:</span> Only index fields can be inserted, as described above. Map fields are not supported for speed reasons. </span></p>
<p>In addition to the configuration of the contract lists, the index field names also have to be configured. Use the following template and add and replace the index field names as needed. </p>
<pre><code>  &quot;ix&quot; : {
     &quot;objKeysHash&quot; : {
      &quot;sordNames&quot; : {
        &quot;CONTRACT_EXAMPLE&quot; : &quot;O_CONTRACT_EXAMPLE&quot;
      },
      &quot;fieldNames&quot; : {
       &quot;O_CONTRACT_EXAMPLE&quot; : &quot;CONTRACT_EXAMPLE&quot;
      }
    }
  }
</code></pre>
<p><span class="tag_important">With the field names, pay attention to whether you created your index fields with or withut underscores. &quot;O_&quot; is always added to the field name with an underscore. If the contract list column in the dashboard displays the index field with a question mark (?CONTRACT_EXAMPLE) instead of the translated field name, either the ELO Indexserver was unable to find the index field name or the translation variable for the index field (ELO Administration Console) has not been entered to <span
style='font-style:italic'>Administration\Localization\custom</span> in the language files.</span></p>
<h4>Enabling search in new fields</h4>
<p>To be able to perform searches in ne fields, the figure has to be configured accordingly. Use the following template and add fields as needed. Since arrays are always overwritten completely on merge, all default fields also have to be entered. </p>
<pre><code>    &quot;filters&quot;:{
      &quot;activeFields&quot;:[
         &quot;O_CONTRACT_TYPE&quot;,
         &quot;O_PARTNER_NAME&quot;,
         &quot;O_CONTRACT_NO&quot;,
         &quot;O_CONTRACT_NAME&quot;,
         &quot;O_CONTRACT_DATE&quot;,
         &quot;O_COMPANY_NAME&quot;,
         &quot;O_CONTRACT_STATUS&quot;,
         &quot;O_CONTRACT_START&quot;,
         &quot;O_CONTRACT_END&quot;,
         &quot;O_CONTRACT_CASHFLOW_SUM_LOCAL_CURR&quot;,
         &quot;O_CONTRACT_RISK_CLASSIFICATION&quot;,
         &quot;O_AUTOMATIC_EXTENSION&quot;,
         &quot;O_NEXT_REMINDER_DATE&quot;,
         &quot;O_NEXT_POSSIBLE_TERMINATION&quot;,
         &quot;O_CONTRACT_EXAMPLE&quot;
      ]
    }
</code></pre>
<h4>Key overview</h4>
<table><thead><tr><td> Keys</td><td>Value type</td><td>Description</td><td>Default / example</td></tr></thead><tbody><tr><td>ix.dashboadDataPath</td><td>String</td><td>Defines the path for dashboard data. Contained folders are shown on the dashboard for selection.<br /></td><td>ARCPATH[(E10E1000-E100-E100-E100-E10E10E10E00)]:/Business Solutions Custom/contract/Configuration/Dashboard-Data/</td></tr><tr><td>ix.registeredCollectorFunctionConfig.objKeys</td><td>Array of strings</td><td>Defines all index field names (not map fields) to be displayed</td><td></td></tr><tr><td>ix.objKeysHash.sordNames<br />ix.objKeysHash.fieldNames</td><td>Array of strings</td><td>Defines mapping specifications for index fields for field names as returned by RF GetChildrenDataCollector. An O_ is added to the beginning of the field names to distinguish them from map fields.</td><td></td></tr><tr><td>table.columns</td><td>Array of column objects</td><td>Defines the columns to be shown in the table as well as their settings. </td><td></td></tr><tr><td>indicators.filterSetup</td><td>Object from filter objects</td><td>Defines filter objects that are to be shown as process filters on the dashboard. Each key name corresponds to the name of an entry in the dynamic keyword list (dynKWL) of the status (localizedKwls.config).<br />The order can be determined using the 'orderId' value or via the order of the elements in the dynKWL status.<br /><br />By default, all status elements are shown. To hide status elements, you have to insert them explicitly and set the 'visible' value to false.</td><td>Example:<br /><br />    &quot;D&quot;: {              <br />     &quot;active&quot;: true,             <br />     &quot;visible&quot;: true,               <br />     &quot;orderId&quot;: 3<br />    }<br /></td></tr></tbody></table>

<p><span class="tag_important">Changes to the configuration can now be effected by refreshing the dashboard. </span></p>
<h2>Inserting and customizing filters</h2>
<p>To insert new filters, edit the dashboard configuration and insert the following &quot;indicators&quot; section as shown in the example</p>
<pre><code>{
   &quot;indicators&quot;:{
      &quot;filterSetup&quot;:{
         &quot;X&quot;:{
         &quot;_$solWatchValues$_&quot; : [&quot;active&quot;], 
         &quot;active&quot; : true,  
&quot;visible&quot;: true,
&quot;orderId&quot; : 2
        },
      }
   }
}
</code></pre>
<p>Replace the X with the new key name from the extended dynamic keyword list. To change the order, you can change &quot;orderId&quot; to a value greater than 2 (element at the very left). Please note that orderId also applies to elements that are not visible (visible: false), so that two or more identical values could cause an invisible sort. The &quot;<em>$solWatchValues$</em>&quot; key indicates that changes to the filter status (active or inactive) by the user, that is &quot;active&quot; keys, should be saved to the profile options.</p>
<h2>Sample configuration</h2>
<p>You can insert the sample configuration in the dashboard configuration under the following path</p>
<p><span
style='font-style:italic'>Administration/Business Solutions </span><span
style='font-weight:bold;font-style:italic'>Custom</span><span style='font-style:
italic'>/contract/Configuration/sol.contract.dashboard.config</span></p>
<pre><code>{
   &quot;ix&quot;:{
      &quot;dashboardDataPath&quot;:&quot;ARCPATH[(E10E1000-E100-E100-E100-E10E10E10E00)]:/Business Solutions/contract/Configuration/Dashboard-Data/&quot;,
      &quot;objKeysHash&quot;:{
         &quot;sordNames&quot;:{
            &quot;EXAMPLE_FIELD&quot;:&quot;O_EXAMPLE_FIELD&quot;
         },
         &quot;fieldNames&quot;:{
            &quot;O_EXAMPLE_FIELD&quot;:&quot;EXAMPLE_FIELD&quot;
         }
      }
   },
   &quot;filters&quot;:{
      &quot;activeFields&quot;:[
         &quot;O_CONTRACT_TYPE&quot;,
         &quot;O_PARTNER_NAME&quot;,
         &quot;O_CONTRACT_NO&quot;,
         &quot;O_CONTRACT_NAME&quot;,
         &quot;O_CONTRACT_DATE&quot;,
         &quot;O_COMPANY_NAME&quot;,
         &quot;O_CONTRACT_STATUS&quot;,
         &quot;O_CONTRACT_START&quot;,
         &quot;O_CONTRACT_END&quot;,
         &quot;O_CONTRACT_CASHFLOW_SUM_LOCAL_CURR&quot;,
         &quot;O_CONTRACT_RISK_CLASSIFICATION&quot;,
         &quot;O_AUTOMATIC_EXTENSION&quot;,
         &quot;O_NEXT_REMINDER_DATE&quot;,
         &quot;O_NEXT_POSSIBLE_TERMINATION&quot;,
         &quot;O_CONTRACT_EXAMPLE&quot;
      ]
   },
   &quot;table&quot;:{
      &quot;columns&quot;:{
         &quot;ContractCashFlowLocalCurrency&quot;:{
            &quot;cellClass&quot;:&quot;currency-tablecell&quot;
         },
         &quot;contractExample&quot;:{
            &quot;solSimple&quot;:{
               &quot;fieldName&quot;:&quot;CONTRACT_EXAMPLE&quot;,
               &quot;type&quot;:&quot;string&quot;
            },
            &quot;width&quot;:100
         }
      }
   },
   &quot;indicators&quot;:{
      &quot;filterSetup&quot;:{
         &quot;X&quot;:{
            &quot;_$solWatchValues$_&quot;:[
               &quot;active&quot;
            ],
            &quot;active&quot;:true,
            &quot;visible&quot;:true,
            &quot;orderId&quot;:2
         }
      }
   }
}
</code></pre>
<h2>Enable CSV export</h2>
<p>You can enable CSV exports for tables by making the following entry. Simply set the property &quot;exportCsv&quot; to true. All other properties are optional and set as shown in the example by default. &quot;filename&quot; specifies the name of the exported file, while &quot;columnSeparator&quot; defines the column separator (; for Excel), and &quot;forExcel&quot;, when true, disables UTF-8 in the CSV file, as Microsoft Excel otherwise displays e.g. umlauts incorrectly.</p>
<pre><code>{
  &quot;table&quot;: {
    &amp;quot;exportCsv&amp;quot; : {
        &amp;quot;enable&amp;quot; : true,
        &amp;quot;filename&amp;quot; : &amp;quot;export_{USER}_{DATE}_{TIME}.csv&amp;quot;,
        &amp;quot;columnSeparator&amp;quot; : &amp;quot;;&amp;quot;,
        &amp;quot;forExcel&amp;quot; : true
      }
  }
}
</code></pre>
<p>In the example, the main table is extended, but all tables in the JSON config with the property &quot;columns&quot;, e.g. calendar.dayTable, can be customized. </p>
