@datarailsshared/dr_renderer 1.2.355 → 1.2.357

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datarailsshared/dr_renderer",
-  "version": "1.2.355",
+  "version": "1.2.357",
   "description": "DataRails charts and tables renderer",
   "keywords": [
     "datarails",

package/src/highcharts_renderer.js

@@ -21,6 +21,9 @@ const CHART_COLORS = {
     LABEL: '#cfd7dd',
     LABEL_SECOND: '#85889c',
     DRILL_UP_FILL: '#eef3f6',
+    DRILL_BUTTON_COLOR_FILL: 'white',
+    DRILL_BUTTON_COLOR: '#6D6E6F',
+    DRILL_BUTTON_COLOR_HOVER: '#333333',
     PLOT_BORDER: '#606063',
     MINOR_GRID_LINE: '#505053',
     TICK_COLOR: '#666',
@@ -61,6 +64,7 @@ const CHART_TYPES = {
 
 const HIGHCHARTS_CONSTANTS = {
     delimer: ' , ',
+    DRILL_BUTTON_FONT_SIZE: '14px',
     MAX_ROWS_FOR_AUTO_REFRESH: 100000,
     MAX_ROWS_FOR_SHOW_RESULTS: 10000,
     DR_OTHERS_KEY: 'DR_Others',
@@ -1036,8 +1040,9 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     chartOptions.yAxis && chartOptions.yAxis.title && (chartOptions.yAxis.title.text || chartOptions.yAxis.title.autoylabel) ? -60 : -40;
                 const y = isPieChart ? 27 :
                     chartOptions.xAxis && chartOptions.xAxis.title && (chartOptions.xAxis.title.text || chartOptions.xAxis.title.autoxlabel) ? 65 : 43;
+                chartOptions.chart.spacingBottom = 30;
                 chartOptions.drilldown.breadcrumbs = {
-                    formatter: () => '< Back',
+                    formatter: () => 'Back',
                     showFullPath: false,
                     position: {
                         align: 'left',
@@ -1046,23 +1051,21 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                         y: y,
                     },
                     floating: true,
+                    position:  { align: 'left', x: 12, y: 6, verticalAlign: 'bottom' },
+                    relativeTo: 'spacingBox',
                     buttonTheme: {
-                        fill: 'white',
-                        color: CHART_COLORS.LABEL_SECOND,
-                        'stroke-width': 1,
-                        stroke: CHART_COLORS.LABEL_SECOND,
-                        r: 3,
-                        padding: 3,
+                        fill: CHART_COLORS.DRILL_BUTTON_COLOR_FILL,
+                        style: {
+                            fontSize: HIGHCHARTS_CONSTANTS.DRILL_BUTTON_FONT_SIZE,
+                            color: CHART_COLORS.DRILL_BUTTON_COLOR,
+                        },
                         states: {
                             hover: {
-                                fill: CHART_COLORS.DRILL_UP_FILL,
-                                stroke: CHART_COLORS.LABEL_SECOND,
-                                color: CHART_COLORS.LABEL_SECOND
-                            },
-                            select: {
-                                stroke: CHART_COLORS.LABEL_SECOND,
-                                fill: CHART_COLORS.DRILL_UP_FILL,
-                                color: CHART_COLORS.LABEL_SECOND
+                                fill: CHART_COLORS.DRILL_BUTTON_COLOR_FILL,
+                                style: {
+                                    fontSize: HIGHCHARTS_CONSTANTS.DRILL_BUTTON_FONT_SIZE,
+                                    color: CHART_COLORS.DRILL_BUTTON_COLOR_HOVER,
+                                }
                             }
                         }
                     },
@@ -1507,7 +1510,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                 totalSeries.color = colors[i];
             }
 
-        if (!lodash.isEmpty(pivotData.colTotals)) {
+
             col_n_keys.forEach(columnKey => {
                 let key = columnKey;
                 let totalKey = columnKey;
@@ -1518,18 +1521,6 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                 const value = pivotData.colTotals[totalKey] ? pivotData.colTotals[totalKey].value() : 0;
                 totalSeries.data.push({name: lodash.unescape(key), y: value});
             });
-        } else {
-            lodash.forEach(row_n_keys, (rowKey, index) => {
-                let key = rowKey;
-                let totalKey = rowKey;
-                if (lodash.isArray(rowKey)) {
-                    key = col_n_keys[index];
-                    totalKey = totalKey.join(highchartsRenderer.delimer);
-                }
-                const value = pivotData.rowTotals[totalKey] ? pivotData.rowTotals[totalKey].value() : 0;
-                totalSeries.data.push({name: lodash.unescape(key), y: value});
-            });
-        }
 
             chart_series.push(totalSeries);
         }
@@ -8999,6 +8990,8 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             res = highchartsRenderer.addTotalsToWalkthroughRowData(widget_obj, res);
         }
 
+        res = highchartsRenderer.fixIncompatibleCalculatedValuesTotals(widget_obj, res);
+
         let pivot = {};
 
         let templateNoData = lodash.find(templates, {id: widget_obj.template_id});
@@ -9508,6 +9501,73 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
         }));
     }
 
+    // We are receiving not correct format for subtotals from BE for now - so we modyfing the response
+    // in order to transform it to acceptable one. It is complex to fix currently on BE side.
+    // TODO: remove it when fixed on BE side
+    highchartsRenderer.fixIncompatibleCalculatedValuesTotals = function(widget, res) {
+
+        // if it is FE side calculation or empty response - just return unmodified
+        if (!highchartsRenderer.useTotalsCalculation || !lodash.get(res, 'length')) return res;
+
+        const calculatedValuesInValsCount = lodash.filter(
+            widget.calculated_values, calcVal => lodash.some(widget.vals, { field: calcVal.field })
+        ).length;
+
+        // do transformations only if widget has calculated in values
+        if (calculatedValuesInValsCount) {
+            const fieldWithDrValuesNames = lodash.reduce(
+                widget.calculated_values,
+                (fieldNames, calcVal) => {
+                    const fieldName = lodash.get(lodash.find(widget.vals, { field: calcVal.field }), 'name');
+                    return fieldName ? lodash.concat(fieldNames, [fieldName]) : fieldNames;
+                },
+                []
+            );
+
+            const existingRecords = [];
+            lodash.forEach(res, (record) => {
+
+                // example: replace record { Type: "Discount", City: "Brest", DR_Values: "Normal 1", Amount: 52585.14 }
+                // with { Type: "Discount", City: "Brest", DR_Values: "Normal 1", value: 52585.14 }
+                if (widget.vals.length > 1 && !widget.rows.length) {
+                    const valueFieldNameFound = lodash.find(fieldWithDrValuesNames, name => record[name]);
+                    if (valueFieldNameFound) {
+                        record.value = record[valueFieldNameFound];
+                        delete record[valueFieldNameFound];
+                    }
+                }
+
+                // in response from BE we have currently improper column subtotals:
+                // they returned with 'DR_Values' not empty - same as for regular cell values
+                // so we have two records with same column values and can't define which is subtotal
+                const isSameColValuesWasBefore = lodash.some(existingRecords, existingRecord =>
+                    lodash.every(
+                        lodash.concat(['DR_Values'], lodash.map(widget.cols, 'name')), fieldName => existingRecord[fieldName] === record[fieldName]
+                    )
+                );
+                const isNoRowValues = lodash.every(widget.rows, field => typeof record[field.name] === 'undefined');
+                const isSubtotal = isSameColValuesWasBefore && isNoRowValues;
+
+                // we need to remove DR_Values for response records which suppose to be subtotals
+                if (isSubtotal) {
+                    delete record.DR_Values;
+                }
+
+                existingRecords.push(record);
+            });
+
+            // Another BE issue - it is not returning correct subtotals for case we have more than one calculated values
+            // It is just not counting sum there. So we remove it in order not to show improper values
+            if ((calculatedValuesInValsCount > 1 || calculatedValuesInValsCount && widget.vals.length > 1) && !widget.rows.length) {
+                res = lodash.filter(res, record => {
+                    const isColsTotal = typeof record['DR_Values'] === 'undefined';
+                    return !isColsTotal;
+                })
+            }
+        }
+        return res;
+    }
+
     return highchartsRenderer;
 };