sea-chart 0.0.84 → 0.0.85-alpha.0

package/dist/settings/table-settings/data-settings.js

@@ -506,6 +506,7 @@ const DataSettings = _ref => {
     tables: tables,
     className: "selected-x-axis",
     label: intl.get('Row_grouping_field'),
+    isRenderNoUsed: false,
     selectedTableId: table_id,
     selectedColumnKey: groupby_column_key,
     selectedDateGranularity: groupby_date_granularity,
@@ -524,6 +525,7 @@ const DataSettings = _ref => {
     tables: tables,
     className: "selected-x-axis",
     label: intl.get('Column_grouping_field'),
+    isRenderNoUsed: true,
     selectedTableId: table_id,
     selectedColumnKey: column_groupby_column_key,
     selectedDateGranularity: column_groupby_date_granularity,

package/dist/settings/widgets/group-by.js

@@ -84,8 +84,8 @@ class GroupBy extends Component {
     };
     this.getColumnOptions = columns => {
       const {
-        chart,
-        type
+        type,
+        isRenderNoUsed
       } = this.props;
       let newColumns = columns.map(column => {
         return {
@@ -104,7 +104,7 @@ class GroupBy extends Component {
       } else if (type === CHART_TYPE.SCATTER) {
         newColumns = newColumns.filter(column => NUMBERIC_COLUMN_TYPE.includes(column.value.type));
       }
-      if ((chart === null || chart === void 0 ? void 0 : chart.config.type) === CHART_TYPE.TABLE) {
+      if (isRenderNoUsed) {
         newColumns.unshift({
           value: {
             key: '',

package/dist/utils/chart-utils/base-utils.js

@@ -165,9 +165,11 @@ BaseUtils.getSummaryColumn = (table, chart) => {
     case CHART_TYPE.LINE:
     case CHART_TYPE.LINE_GROUP:
     case CHART_TYPE.AREA:
+    case CHART_TYPE.AREA_GROUP:
     case CHART_TYPE.HORIZONTAL_BAR:
     case CHART_TYPE.STACKED_HORIZONTAL_BAR:
     case CHART_TYPE.HORIZONTAL_GROUP_BAR:
+    case CHART_TYPE.BAR_STACK:
       {
         return getTableColumnByKey(table, y_axis_summary_column_key);
       }
@@ -308,6 +310,14 @@ BaseUtils.getSummaryValue = (_ref, currentValue, nextValue) => {
     if (currentValue === null && nextValue === null) return null;
     if (currentValue === null) return nextValue;
     if (nextValue === null) return currentValue;
+    if (currentValue && nextValue) {
+      if (summaryMethod === 'MAX') {
+        return Math.max(currentValue, nextValue);
+      }
+      if (summaryMethod === 'MIN') {
+        return Math.min(currentValue, nextValue);
+      }
+    }
   }
   return (currentValue - 0 || 0) + (nextValue - 0 || 0);
 };

package/dist/utils/chart-utils/original-data-utils/combination-calculator.js

@@ -253,6 +253,7 @@ async function calculator(chart, value, _ref) {
         results.push({
           name: key,
           value_left: value,
+          group_name: summaryColumn.column_name,
           color: leftSummaryColumn[columnKey].color,
           value_right: value2,
           formatted_value_left: formattedValueLeft,

package/dist/utils/chart-utils/original-data-utils/pivot-table-calculator.js

@@ -5,6 +5,8 @@ import { isArrayCellValue } from '../../cell-value-utils';
 import { getFormattedLabel, isValidRow } from '../../row-utils';
 import BaseUtils from '../base-utils';
 import { summaryMethodColumn2SqlColumn } from '../../sql/column-2-sql-column';
+
+// one
 async function calculateOneDimensionTable(chart, value, _ref) {
   let {
     getViewRows,
@@ -56,7 +58,7 @@ async function calculateOneDimensionTable(chart, value, _ref) {
       }
     }
   });
-  const summary_columns_option_keys = Array.isArray(summary_columns) ? summary_columns.map(option => option.key) : [];
+  const summary_columns_option_keys = Array.isArray(summary_columns) ? summary_columns.map(option => option.column_key) : [];
   const statisticColumnKeys = [summary_column_key, ...summary_columns_option_keys];
   const validStatisticColumnKeys = statisticColumnKeys;
   let statisticColumns = validStatisticColumnKeys.map(key => {
@@ -70,7 +72,7 @@ async function calculateOneDimensionTable(chart, value, _ref) {
   }
   Array.isArray(summary_columns) && summary_columns.forEach((option, index) => {
     if (statisticColumns[index + 1]) {
-      statisticColumns[index + 1].method = option.method;
+      statisticColumns[index + 1].method = option.summary_method;
     }
   });
   const {
@@ -205,6 +207,8 @@ function getOneDimensionTotal(columns, summary_type, formula_rows) {
     pivot_columns_total
   };
 }
+
+// two
 async function calculateTwoDimensionTable(chart, value, _ref2) {
   let {
     getViewRows,
@@ -239,34 +243,7 @@ async function calculateTwoDimensionTable(chart, value, _ref2) {
   const summaryColumn = getTableColumnByKey(table, summary_column_key);
   const statRows = await getViewRows(view, table);
   const formulaRows = await getTableFormulaResults(table, statRows);
-  const pivot_summary_multiple_columns = [];
-  Array.isArray(summary_columns) && summary_columns.forEach(item => {
-    const column = getTableColumnByKey(table, item.column_key);
-    if (column && isNumericColumn(column)) {
-      pivot_summary_multiple_columns.push({
-        key: item.column_key,
-        type: column.type,
-        data: column.data,
-        method: item.summary_method,
-        column_name: column.name
-      });
-    }
-  });
-
-  // [{key: null}, {key: cell_value}, {key: cell_value}, ...]
   let pivot_columns = [];
-
-  //  [
-  //    {
-  //      name: '',
-  //      cells: {
-  //        [key1]: {rows: [], total: ''},
-  //        [key2]: {rows: [], total: ''},
-  //        [key3]: {rows: [], total: ''},
-  //      }
-  //    },
-  //    ...
-  //  ]
   let pivot_rows = [];
   statRows.forEach(row => {
     const {
@@ -329,9 +306,10 @@ async function calculateTwoDimensionTable(chart, value, _ref2) {
     pivot_columns,
     pivot_columns_total: new_pivot_columns_total,
     pivot_table_total,
-    pivot_summary_multiple_columns,
     formulaRows,
-    dimensions: TABLE_DIMENSIONS.TWO
+    dimensions: TABLE_DIMENSIONS.TWO,
+    summary_columns: [summaryColumn, ...(summary_columns === null || summary_columns === void 0 ? void 0 : summary_columns.map(item => getTableColumnByKey(table, item.column_key)))],
+    isSingleNumericColumn: !summary_columns.length ? 'true' : 'false'
   };
 }
 function updateTwoDimensionColumns(value, pivot_columns, column, row, formulaRow, isIncludeEmpty, dateGranularity, geolocationGranularity, isRowGroupbyColumnDataAsAnArray) {
@@ -434,7 +412,7 @@ function updateTwoDimensionRows(pivot_rows, pivot_columns, index, name, row, isC
               const nextValue = row[current === null || current === void 0 ? void 0 : current.column.key];
               const currentValue = Object.values(cells[key].total).find(item => item[2] === columnKey)[1];
               const computedValue = BaseUtils.getSummaryValue({
-                summaryMethod: current.summary_method,
+                summaryMethod: current.summary_method.toUpperCase(),
                 summaryColumn: current.column
               }, currentValue, nextValue);
               const columnName = current.column.name;
@@ -528,21 +506,6 @@ function updateTwoDimensionRows(pivot_rows, pivot_columns, index, name, row, isC
     total
   });
 }
-function isSameName(prevName, currName) {
-  if (isNumber(prevName) && isNumber(currName)) {
-    return prevName === currName;
-  }
-  if (!prevName && !currName) {
-    return prevName === null && currName === null || prevName === undefined && currName === undefined || isNaN(prevName) && isNaN(currName);
-  }
-  return prevName === currName;
-}
-function isSameGroup(isColumnDataAsAnArray, source, target) {
-  if (isColumnDataAsAnArray) {
-    return (!source || source.length === 0) && !target || source && source.includes(target);
-  }
-  return source === null && target === null || source === undefined && target === undefined || source === target;
-}
 function getTwoDimensionTotal(summaryColumn, summary_type, summary_method, formula_rows) {
   let pivot_rows = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : [];
   let pivot_columns = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : [];
@@ -619,6 +582,23 @@ function getTwoDimensionTotal(summaryColumn, summary_type, summary_method, formu
     pivot_table_total
   };
 }
+
+// utils
+function isSameName(prevName, currName) {
+  if (isNumber(prevName) && isNumber(currName)) {
+    return prevName === currName;
+  }
+  if (!prevName && !currName) {
+    return prevName === null && currName === null || prevName === undefined && currName === undefined || isNaN(prevName) && isNaN(currName);
+  }
+  return prevName === currName;
+}
+function isSameGroup(isColumnDataAsAnArray, source, target) {
+  if (isColumnDataAsAnArray) {
+    return (!source || source.length === 0) && !target || source && source.includes(target);
+  }
+  return source === null && target === null || source === undefined && target === undefined || source === target;
+}
 function getTotal(summary_column, summary_type, summary_method) {
   let rows = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
   let formula_rows = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
@@ -654,6 +634,7 @@ function getTotal(summary_column, summary_type, summary_method) {
           total++;
         }
       });
+      total = getTotalByType(oldTotal, total);
       return total;
     }
     if (summary_column && isDateColumn(summary_column)) {
@@ -711,22 +692,10 @@ function getTotal(summary_column, summary_type, summary_method) {
               }
             });
             if (summary_method === 'Sum') {
-              if (Array.isArray(oldTotal)) {
-                const newTotal = JSON.parse(JSON.stringify(oldTotal));
-                newTotal[0][1] = Number.parseFloat(sum.toFixed(8));
-                total = newTotal;
-              } else {
-                total = Number.parseFloat(sum.toFixed(8));
-              }
+              total = getTotalByType(oldTotal, Number.parseFloat(sum.toFixed(8)));
             } else if (summary_method === 'Mean') {
-              if (Array.isArray(oldTotal)) {
-                const newTotal = JSON.parse(JSON.stringify(oldTotal));
-                const val = validNumbersCount === 0 ? 0 : Number.parseFloat((sum / validNumbersCount).toFixed(8));
-                newTotal[0][1] = val;
-                total = newTotal;
-              } else {
-                total = validNumbersCount === 0 ? 0 : Number.parseFloat((sum / validNumbersCount).toFixed(8));
-              }
+              const val = validNumbersCount === 0 ? 0 : Number.parseFloat((sum / validNumbersCount).toFixed(8));
+              total = getTotalByType(oldTotal, val);
             }
             break;
           }
@@ -759,15 +728,15 @@ function getTotal(summary_column, summary_type, summary_method) {
                 let formulaRow = formula_rows[result._id];
                 if (formulaRow) {
                   if (formulaRow[summary_column_key] && typeof formulaRow[summary_column_key] === 'object') {
-                    total = formulaRow[summary_column_key][0];
+                    total = getTotalByType(oldTotal, formulaRow[summary_column_key][0]);
                   } else {
-                    total = formulaRow[summary_column_key];
+                    getTotalByType(oldTotal, formulaRow[summary_column_key]);
                   }
                 } else {
-                  total = null;
+                  total = getTotalByType(oldTotal, null);
                 }
               } else {
-                total = result[summary_column_key];
+                total = getTotalByType(oldTotal, result[summary_column_key]);
               }
             }
             break;
@@ -781,7 +750,7 @@ function getTotal(summary_column, summary_type, summary_method) {
   }
   // formula_rows result can be '#VALUE!'
   if (total === '#VALUE!') {
-    total = 0;
+    total = getTotalByType(oldTotal, 0);
   }
   return total || 0;
 }
@@ -831,6 +800,18 @@ function getDateMaxOrMinTotal(dateArr, type) {
   dateIndex = list.indexOf(dateValue);
   return dateArr[dateIndex];
 }
+function getTotalByType(oldTotal, value) {
+  let newTotal = '';
+  if (Array.isArray(oldTotal)) {
+    newTotal = JSON.parse(JSON.stringify(oldTotal));
+    newTotal[0][1] = value;
+  } else {
+    newTotal = value;
+  }
+  return newTotal;
+}
+
+// index
 function calculator(chart, value, _ref3) {
   let {
     getViewRows,

package/dist/utils/chart-utils/original-data-utils/trend-calculator.js

@@ -78,23 +78,27 @@ async function calculator(chart, value, _ref) {
       }
     }
   }
+
+  // normal case
+  const res = Math.abs(currentValues - previousValues) / previousValues;
+  let result = Number.parseFloat(res * 100).toFixed(2) + '%';
+
+  // set result to 0 when currentValues is 0
   if (!currentValues) {
-    return {
-      latest: null,
-      previous: previousValues || null
-    };
+    result = '--';
+    currentValues = 0;
   }
+
+  // set result to -- when previousValues is 0
   if (!previousValues) {
-    return {
-      latest: currentValues,
-      previous: null
-    };
+    result = '--';
+    previousValues = 0;
   }
   return {
     latest: currentValues,
     previous: previousValues,
-    result: Math.abs(previousValues - currentValues) / previousValues,
-    type: currentValues > previousValues ? 'up' : 'down'
+    result,
+    type: currentValues >= previousValues ? 'up' : 'down'
   };
 }
 export default calculator;

package/dist/utils/chart-utils/sql-statistics-utils.js

@@ -1425,11 +1425,27 @@ SQLStatisticsUtils.trendMapChartSQLResult2JavaScript = (chart, sqlRows, chartSQL
       }
     }
   }
+
+  // normal case
+  const res = Math.abs(compareValue - comparedValue) / comparedValue;
+  let result = Number.parseFloat(res * 100).toFixed(2) + '%';
+
+  // set result to 0 when compareValue is 0
+  if (!compareValue) {
+    result = '--';
+    compareValue = 0;
+  }
+
+  // set result to -- when comparedValue is 0
+  if (!comparedValue) {
+    result = '--';
+    comparedValue = 0;
+  }
   return {
     latest: compareValue,
     previous: comparedValue,
-    result: Math.abs(compareValue - comparedValue) / comparedValue,
-    type: compareValue > comparedValue ? 'up' : 'down'
+    result,
+    type: compareValue >= comparedValue ? 'up' : 'down'
   };
 };
 SQLStatisticsUtils.sqlResult2JavaScript = (chart, sqlRows, chartSQLMap, columnMap, tables, params) => {
@@ -1818,7 +1834,8 @@ SQLStatisticsUtils.calculateChart = (chart, value, callback, sqlRows) => {
       groupbyColumn,
       columnGroupbyColumn,
       summaryColumn,
-      chartTableColumns
+      chartTableColumns,
+      summaryColumnsWithMethod
     });
     return;
   }
@@ -1841,7 +1858,8 @@ SQLStatisticsUtils.calculateChart = (chart, value, callback, sqlRows) => {
     groupbyColumn,
     columnGroupbyColumn,
     summaryColumn,
-    chartTableColumns
+    chartTableColumns,
+    summaryColumnsWithMethod
   });
 };
 SQLStatisticsUtils.calculateStaticChart = (chart, value, statisticalResult, callback) => {

package/dist/utils/row-record-utils.js

@@ -1,8 +1,7 @@
 import _ButtonFormatter from "dtable-ui-component/lib/ButtonFormatter";
 import _RateFormatter from "dtable-ui-component/lib/RateFormatter";
 import React from 'react';
-import { CellType, FORMULA_RESULT_TYPE, getNumberDisplayString, getDateDisplayString, getCellValueStringResult, isNumber, isDateColumn } from 'dtable-utils';
-import { LinksUtils } from 'dtable-store';
+import { CellType, FORMULA_RESULT_TYPE, getNumberDisplayString, getDateDisplayString, getCellValueStringResult, isNumber, isDateColumn, isValidLink } from 'dtable-utils';
 import dayjs from 'dayjs';
 import cellFormatterFactory from '../components/cell-factory/cell-formatter-factory';
 import SimpleCellFormatter from '../components/cell-factory/SimpleCellFormatter';
@@ -200,7 +199,7 @@ export const getFormattedCell = function (column, row) {
         const {
           data
         } = column;
-        if (!LinksUtils.isValidLink(data)) break;
+        if (!isValidLink(data)) break;
 
         // is default view: row data can get from formula row
         // is archive view: row data can get form rowdata

package/dist/utils/sql/chart-data-sql.js

@@ -502,10 +502,6 @@ class ChartDataSQL {
       const groupby_include_empty_cells = this.chart['groupby_include_empty_cells'] || false;
       let summary_method = this.chart['summary_method'] || '';
       const summary_columns = this.chart['summary_columns'] || [];
-      if (!summary_method) {
-        this.error = 'Summary_method_is_not_valid';
-        return '';
-      }
       const groupby_column = this._get_column_by_key(groupby_column_key);
       if (!groupby_column) {
         this.error = 'Group_by_column_not_found';

package/dist/utils/trend-utils.js

@@ -1,7 +1,7 @@
 import dayjs from 'dayjs';
 import quarterOfYear from 'dayjs/plugin/quarterOfYear';
-import { BaseUtils } from './chart-utils';
 import { CHART_SUMMARY_TYPE } from '../constants';
+import { BaseUtils } from './chart-utils';
 dayjs.extend(quarterOfYear);
 export function getCompareDate(dateGranularity) {
   const currentDate = dayjs();

package/dist/view/wrapper/area.js

@@ -138,7 +138,7 @@ class Area extends ChartComponent {
         stroke: 0,
         fillOpacity: 1,
         opacity: y_axis_show_value ? 1 : 0
-      });
+      }).tooltip(false);
       const area = this.chart.area().position('name*value').animate({
         appear: {
           animation: 'fadeIn',

package/dist/view/wrapper/bar-group.js

@@ -156,9 +156,6 @@ class BarGroup extends ChartComponent {
           easing: 'easeLinear'
         }
       }).label(y_axis_show_value ? 'value' : false, {
-        content: data => {
-          return data.value;
-        },
         style: {
           fontSize: BaseUtils.getLabelFontSize(label_font_size),
           fill: theme.labelColor,

package/dist/view/wrapper/basic-number-card.js

@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { isNumber } from 'dtable-utils';
-// import { Chart } from '../../utils/custom-g2';
-import { BaseUtils, isFunction } from '../../utils';
+import { BaseUtils } from '../../utils';
 import intl from '../../intl';
 import { BASIC_NUMBER_CARD_CALCULATION_METHOD, EMPTY_NAME, CHART_THEME_COLOR } from '../../constants';
 class BasicNumericCard extends Component {

package/dist/view/wrapper/combination.js

@@ -268,12 +268,6 @@ class Combination extends ChartComponent {
         stroke: 0,
         fillOpacity: 1
       }).label(display_data ? 'value_right' : false, {
-        content: data => {
-          if (this.currentName) {
-            return data.name === this.currentName ? data.value_right : '';
-          }
-          return data.value_right;
-        },
         style: {
           fontSize: BaseUtils.getLabelFontSize(label_font_size),
           fill: theme.labelColor,

package/dist/view/wrapper/horizontal-bar-group.js

@@ -25,7 +25,7 @@ class HorizontalBarGroup extends HorizontalComponent {
         display_data
       } = chart.config;
       this.chartTopPadding = display_data ? 17 : 0;
-      const appendPadding = [this.chartTopPadding, 0, 0, 0];
+      const appendPadding = [this.chartTopPadding, 30, 0, 0];
       this.initChart(this.container, {
         appendPadding
       });
@@ -108,9 +108,6 @@ class HorizontalBarGroup extends HorizontalComponent {
           easing: 'easeLinear'
         }
       }).label(display_data ? 'value' : false, {
-        content: data => {
-          return data.value;
-        },
         style: {
           fontSize: BaseUtils.getLabelFontSize(label_font_size),
           fill: theme.labelColor,

package/dist/view/wrapper/index.js

@@ -58,6 +58,7 @@ const Wrapper = _ref => {
       groupbyColumn,
       columnGroupbyColumn,
       summaryColumn,
+      summaryColumnsWithMethod,
       chartTableColumns
     } = data;
     const {
@@ -73,6 +74,7 @@ const Wrapper = _ref => {
       groupbyColumn,
       columnGroupbyColumn,
       summaryColumn,
+      summaryColumnsWithMethod,
       globalTheme,
       chartColorTheme,
       toggleRecords: toggleStatisticRecordsDialog
@@ -85,8 +87,7 @@ const Wrapper = _ref => {
             summaryColumns: summary_columns,
             columnGroupbyColumn: columnGroupbyColumn,
             summaryMethod: summary_method,
-            chartTableColumns: chartTableColumns,
-            isCalculateByView: isCalculateByView
+            chartTableColumns: chartTableColumns
           }));
         }
       case CHART_TYPE.COMBINATION:

package/dist/view/wrapper/line-group.js

@@ -108,7 +108,7 @@ class LineGroup extends ChartComponent {
         stroke: 0,
         fillOpacity: 1,
         opacity: y_axis_show_value ? 1 : 0
-      });
+      }).tooltip(false);
 
       // this.chart.on('tooltip:show', () => {
       //   if (line.styleOption.cfg.opacity === 0.3) return;

package/dist/view/wrapper/line.js

@@ -110,7 +110,7 @@ class Line extends ChartComponent {
         stroke: 0,
         fillOpacity: 1,
         opacity: y_axis_show_value ? 1 : 0
-      });
+      }).tooltip(false);
 
       // this.chart.on('tooltip:show', () => {
       //   if (line.styleOption.cfg.opacity === 0.3) return;

package/dist/view/wrapper/table/index.css

@@ -18,7 +18,7 @@
 
 .sea-chart-pivot-table th,
 .sea-chart-pivot-table td {
-  padding: 10px;
+  padding: 5px;
   border-right: 1px solid #ccc;
   border-left: 1px solid #ccc;
   border-bottom: none;
@@ -30,6 +30,8 @@
   text-overflow: ellipsis;
   white-space: nowrap;
   text-align: center;
+  height: 32px;
+  max-height: 32px;
 }
 
 .sea-chart-pivot-table .column-title,
@@ -161,9 +163,11 @@
 
 .sea-chart-pivot-table .pivot-table-header-summary-columns-container > div,
 .sea-chart-pivot-table .pivot-cells-container > div {
-  flex:1;
-  padding: 10px;
-  
+  height: 100%;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
 
 .sea-chart-pivot-table .pivot-table-header-summary-columns-container > div:not(:first-child), 

package/dist/view/wrapper/table/one-dimension-table-no-numeric-columns.js

@@ -1,8 +1,9 @@
 import React, { PureComponent } from 'react';
 import classnames from 'classnames';
+import { getTableById } from 'dtable-utils';
 import { BaseUtils, ObjectUtils } from '../../../utils';
 import intl from '../../../intl';
-import { CHART_THEME_COLOR } from '../../../constants';
+import { CHART_THEME_COLOR, CHART_SUMMARY_TYPE } from '../../../constants';
 import PivotTableDisplayName from './pivot-table-display-name';
 class OneDimensionTableNoNumericColumns extends PureComponent {
   constructor() {
@@ -14,11 +15,15 @@ class OneDimensionTableNoNumericColumns extends PureComponent {
         chart
       } = this.props;
       const {
-        display_total = true
+        display_total = true,
+        table_id,
+        summary_type
       } = chart.config;
       const {
         name: groupName
       } = groupbyColumn;
+      const isCount = summary_type === CHART_SUMMARY_TYPE.COUNT;
+      const columnName = isCount ? intl.get('Amount') : this.getColumnName();
       const {
         rowIdx: selectRowIdx,
         cellIdx: selectedCellIdx
@@ -28,12 +33,35 @@ class OneDimensionTableNoNumericColumns extends PureComponent {
         className: "seatable-table-header-sm"
       }, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("th", {
         className: "pivot-table-header"
-      }, groupName), display_total && /*#__PURE__*/React.createElement("th", {
+      }, groupName), /*#__PURE__*/React.createElement("th", {
+        className: classnames('pivot-table-header', {
+          'selected-pivot-cell-top': isSelectedTotalCellBottom
+        })
+      }, /*#__PURE__*/React.createElement("div", null, columnName)), display_total && /*#__PURE__*/React.createElement("th", {
         className: classnames('pivot-table-header', {
           'selected-pivot-cell-top': isSelectedTotalCellBottom
         })
       }, /*#__PURE__*/React.createElement("div", null, intl.get('Total')))));
     };
+    this.getColumnName = () => {
+      const {
+        tables,
+        result,
+        chart
+      } = this.props;
+      const {
+        pivot_columns
+      } = result;
+      const {
+        table_id
+      } = chart.config;
+      if (Array.isArray(pivot_columns) && pivot_columns.length !== 0) {
+        const table = getTableById(tables, table_id);
+        const column = table === null || table === void 0 ? void 0 : table.columns.find(item => item.key === pivot_columns[0].key);
+        return (column === null || column === void 0 ? void 0 : column.name) || '';
+      }
+      return '';
+    };
     this.toggleRecords = (cell, selectedCell) => {
       if (window.isMobile) return;
       const {
@@ -81,7 +109,6 @@ class OneDimensionTableNoNumericColumns extends PureComponent {
       let pivotColumnCells = [];
       const isSelectRowTotalCellRight = selectRowIdx === pivotRowsLen && selectedCellIdx === 0;
       const isSelectTotal = selectRowIdx === pivotRowsLen && selectedCellIdx === 0;
-      // eslint-disable-next-line
       const total = ObjectUtils.hasOwnProperty(pivot_columns_total, 'total') ? pivot_columns_total['total'] : 0;
       const summaryDisplayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, total);
       const isValidSummaryDisplayValue = BaseUtils.isValidValue(summaryDisplayValue, display_empty);
@@ -108,6 +135,18 @@ class OneDimensionTableNoNumericColumns extends PureComponent {
           column: groupbyColumn,
           rowData: rowItem,
           globalTheme: globalTheme
+        })), /*#__PURE__*/React.createElement("td", {
+          className: classnames('pivot-cell', {
+            'pivot-empty-cell': !isValidTotalDisplayValue,
+            'selected-pivot-cell': isSelectedTotalCell,
+            'selected-pivot-cell-top': isSelectedTotalCellTop,
+            'selected-pivot-cell-left': isSelectedTotalCellLeft
+          }),
+          total: totalDisplayValue
+        }, isValidTotalDisplayValue ? totalDisplayValue : /*#__PURE__*/React.createElement("i", null), /*#__PURE__*/React.createElement("span", {
+          className: classnames({
+            'selected-pivot-cell-border': isSelectedTotalCell
+          })
         })), display_total && /*#__PURE__*/React.createElement("td", {
           className: classnames('pivot-cell', {
             'pivot-empty-cell': !isValidTotalDisplayValue,
@@ -134,6 +173,16 @@ class OneDimensionTableNoNumericColumns extends PureComponent {
           'selected-pivot-cell-left': isSelectRowTotalCellRight
         })
       }, /*#__PURE__*/React.createElement("div", null, intl.get('Total'))), /*#__PURE__*/React.createElement("td", {
+        className: classnames('pivot-cell pivot-table-total', {
+          'pivot-empty-cell': !isValidSummaryDisplayValue,
+          'selected-pivot-cell': isSelectTotal
+        }),
+        title: isValidSummaryDisplayValue ? summaryDisplayValue : ''
+      }, isValidSummaryDisplayValue ? summaryDisplayValue : /*#__PURE__*/React.createElement("i", null), /*#__PURE__*/React.createElement("span", {
+        className: classnames({
+          'selected-pivot-cell-border': isSelectTotal
+        })
+      })), /*#__PURE__*/React.createElement("td", {
         className: classnames('pivot-cell pivot-table-total', {
           'pivot-empty-cell': !isValidSummaryDisplayValue,
           'selected-pivot-cell': isSelectTotal

package/dist/view/wrapper/table/two-dimension-table.js

@@ -132,9 +132,9 @@ class TwoDimensionTable extends PureComponent {
     };
     this.renderEmpty = (summaryColumns, cellIdx) => {
       if (summaryColumns && (summaryColumns === null || summaryColumns === void 0 ? void 0 : summaryColumns.length) !== 0) {
-        return summaryColumns === null || summaryColumns === void 0 ? void 0 : summaryColumns.map(() => {
+        return summaryColumns.map(item => {
           return /*#__PURE__*/React.createElement("div", {
-            key: "table-cell-".concat(cellIdx),
+            key: "table-cell-".concat(item.key),
             className: classnames('pivot-cell', {
               'pivot-empty-cell': true
             })

package/dist/view/wrapper/trend.js

@@ -81,19 +81,7 @@ class Trend extends Component {
         color = '#34aa95';
         icon = '\u2191';
       }
-      let resultText = "".concat(Number.parseFloat(result * 100).toFixed(2), "%•").concat(conjunctions).concat(previous);
-      if (!previous) {
-        resultText = intl.get('Can_not_compare_with_{var}').replace('{var}', intl.get(conjunctions));
-      }
-      if (!previous) {
-        return /*#__PURE__*/React.createElement("span", {
-          style: {
-            fontSize: "".concat(labelFontSize, "px")
-          }
-        }, resultText);
-      }
       if (labelFontSize <= 12) {
-        if (!result && result !== 0) return '';
         return /*#__PURE__*/React.createElement("span", {
           style: {
             fontSize: "".concat(labelFontSize, "px"),
@@ -116,7 +104,7 @@ class Trend extends Component {
           style: {
             color: "".concat(color)
           }
-        }, result || result === 0 ? Number.parseFloat(result * 100).toFixed(2) : '', "%"));
+        }, result));
       }
       const resultContent = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
         style: {
@@ -131,7 +119,7 @@ class Trend extends Component {
           whiteSpace: 'nowrap',
           marginRight: '16px'
         }
-      }, !result && result !== 0 ? '' : /*#__PURE__*/React.createElement("i", {
+      }, /*#__PURE__*/React.createElement("i", {
         style: {
           flexShrink: '0',
           flexBasis: 'auto',
@@ -151,7 +139,7 @@ class Trend extends Component {
           color: color,
           marginRight: '0px'
         }
-      }, result || result === 0 ? Number.parseFloat(result * 100).toFixed(2) + '%' : '')), /*#__PURE__*/React.createElement("span", {
+      }, result)), /*#__PURE__*/React.createElement("span", {
         style: {
           color: labelFontColor,
           fontWeight: labelFontWeight,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sea-chart",
-  "version": "0.0.84",
+  "version": "0.0.85-alpha.0",
   "main": "./dist/index.js",
   "dependencies": {
     "@antv/data-set": "0.11.8",
@@ -8,7 +8,6 @@
     "@seafile/seafile-calendar": "^0.0.24",
     "classnames": "^2.3.2",
     "dayjs": "1.10.7",
-    "dtable-store": "^4.3.18",
     "is-hotkey": "0.2.0",
     "lodash-es": "^4.17.21",
     "rc-slider": "^10.5.0",
@@ -100,6 +99,7 @@
     "css-minimizer-webpack-plugin": "5.0.1",
     "dotenv": "6.2.0",
     "dotenv-expand": "5.1.0",
+    "dtable-store": "~4.3.18",
     "ejs": "3.1.8",
     "eslint": "^6.8.0",
     "eslint-config-react-app": "^5.0.2",