Step 3. Smart TreeTable UI for Hierarchies

[pavankumar_reddy90]

For space requirements this blog has been split in 4 parts:

Link	Content
Hierarchy evaluation using CDS Table Function	Hierarchy evaluation using CDS Table Function in S/4
Step 1 – Hierarchies in S/4 HANA  Analytics	Step 1 – Hierarchies in S/4 HANA  Analytics
Step 2 – Define the Analytical Query CDS View	Step 2 – Define the Analytical Query CDS View
This part	Step 3 – Smart Tree Table UI for Hierarchies

In continuation to previous blog define the analytical query using CDS here I will create a smart TreeTable UI for hierarchies display.

Define the main application view. For this, open view HierarchyView.view.xml, and replace its content by this code:

<mvc:View controllerName="ZHierarchy.controller.HierarchyView" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"

 xmlns:layout="sap.ui.layout" xmlns:table="sap.ui.table" xmlns:smarttable="sap.ui.comp.smarttable"

 xmlns:smartfilterbar="sap.ui.comp.smartfilterbar">

 <App>

  <pages>

   <Page title="{i18n>title}">

    <content>

     <VBox fitContainer="true">

      <smartfilterbar:SmartFilterBar id="SmartFilterBar" entitySet="ZEMH_C_EMPLOYEEQUERY3">

       <smartfilterbar:controlConfiguration>

        <smartfilterbar:ControlConfiguration key="CostCenter" index="1" groupId="_BASIC" />

          </smartfilterbar:controlConfiguration>           

      </smartfilterbar:SmartFilterBar>

      <smarttable:SmartTable id="smartTable_org_hier" smartFilterId="SmartFilterBar" visible="true" entitySet="ZEMH_C_EMPLOYEEQUERY3" class="sapFioriListReportSmartTable"

       header="Manager Employee Hierarchy"

       tableBindingPath="/ZEMH_C_EMPLOYEEQUERY3" beforeRebindTable="onBeforeRebindTable"

       enableAutoBinding="false" useVariantManagement="false" showVariantManagement="false" useTablePersonalisation="true">

       <table:TreeTable id="hierTable_org_hier" rootLevel="0"

         selectionMode="Single"

        visibleRowCount="20" visibleRowCountMode="Fixed">

       </table:TreeTable>

      </smarttable:SmartTable>

     </VBox>

    </content>

   </Page>

  </pages>

 </App>

</mvc:View>

Define a controller(HierarchyView.controller.js) for this view. It is needed, because currently this is the only way to specify certain control Parameters to the TreeTable binding . Replace its content by this code

sap.ui.define([

	"sap/ui/core/mvc/Controller"

], function(Controller) {

	"use strict";



	return Controller.extend("ZHierarchy.controller.HierarchyView", {

 onBeforeRebindTable: function(oEvent) { 

           var oBindingParams = oEvent.getParameter("bindingParams");

    

           oBindingParams.parameters.threshold = 50000;

           oBindingParams.parameters.countMode = 'Inline';

           oBindingParams.parameters.operationMode = 'Server';

           oBindingParams.parameters.numberOfExpandedLevels = 1;

       }

	});

});

Now development is done ready to run the application :



The application UI shows a filter bar with a costcenter field for data selection and a table below that will display matching employees in a tree. Press Go to fetch the entire hierarchy of manger employee.



From the settings button you can personalize the default attributes. Result shows employee's hierarchy with cost center and utilization measure , it has a Cost center smart filter as well.

Form the series of blogs you got to now step by step procedure of evaluating hierarchies in S/4 HANA analytics.

Below are the others blogs which you can refer for better understanding of hierarchies in S/4

Hierarchies in CDS VIews

How to consume a hierarchy in CDS view analytical query

How to build a custom hierarchy in ABAP CDS Views

Hope this series of blogs are helpful 🙂

Your suggestions, feedback, comments on this blog are most welcome.

 

[Former Member]

Hi Pavan,

1. I have a tree table inside smart table. im using local annotation file to create colums of the table. but it gives an error  saying "Neither navigation paths parameters, nor (complete/valid) tree hierarchy annotations where provided to the TreeBinding". How Can I bind Child properties using annotations


2. If i include colums in xml view file data is geting bind. But After filtering data (using smart filterbar) data is not get bind correctly

appreciate u can help. thanks

[former_member109557]

Hi,

We tried to display hierarchy using Hierarchy CDS views and it is fine in "Analysis Office" but the expansion of nodes are not working if the same is consumed in Fiori Elements List report.

The issue is detailed in (https://answers.sap.com/questions/581579/node-expand-not-working-in-hierarchy-cds-view-cons.html). Please can you let us know your comments.

Regards,

Vivek

 

[Raju]

Hierarchy _node id, _parent id, _level, _drillstate, _nodetext data is available in RSRT, Direct Launchpad URL, & Gateway client but for the same query we run in WebIDE only these data is missing do we need to do any setting in the system what is wrong here

 

[former_member704410]

Thanks for posting.

This kind of CDS with Analytical Anotation does work for Fiori KPIs?

Many Times a Simple CDS View with oData isnt enought for getting a Correct KPI (percent, ratios, etc)