Page Comparison

...

It Works based on the Current Route URL and previous Route URL

File Details

https://github.com/egovernments/frontend/blob/54832d3e7c2f2e61def248432b927e8d13ed09camaster/web/dss-dashboard/src/Breadcrumbs.js

Drill through options in tables and charts

...

Here chart id is used for the subsequent call to fetch the next table along with the applied/selected filters.

File Details

https://github.com/egovernments/frontend/blob/54832d3e7c2f2e61def248432b927e8d13ed09camaster/web/dss-dashboard/src/components/Charts/TableChart.js

Drill throughs in piecharts :

It is Similar to Dilldown in tables, here Drill through in piecharts are based on the drillDownChartId field in the parent piechart

File Details,

https://github.com/egovernments/frontend/blob/54832d3e7c2f2e61def248432b927e8d13ed09camaster/web/dss-dashboard/src/components/Charts/DonutChart.js

Comparison Indicators in Tables

...

For Comparing with previous year data in every table data, the same request object will be used by changing the time range to the previous year/month/week.

File Details

https://github.com/egovernments/frontend/blob/54832d3e7c2f2e61def248432b927e8d13ed09camaster/web/dss-dashboard/src/components/Charts/TableChart.js

The following Method along with parameters is used to fetch the previous year data.

...

after receiving last year data it is compared with current year data and will be shown insight data will be shown, comparison logic is present in uiTable.js

https://github.com/egovernments/frontend/blob/d3b89b4603e4cc98d6102e5fe0a683dae19c7f28master/web/dss-dashboard/src/components/common/UiTable/UiTable.js

TimeFilter

The current time component is not very intuitive and user friendly. So New library react-date-range was used to enhance the time filter.

...

API Call Role Action mapping: