dtable-statistic 5.0.10-alpha.3 → 5.0.10-alpha.5

package/es/components/dialog/chart-edit-dialog.js

@@ -10,6 +10,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
 var _seaChart = require("sea-chart");
 var _reactstrap = require("reactstrap");
+var _constants = require("../../constants");
 class ChartEditDialog extends _react.Component {
   constructor(props) {
     super(props);
@@ -51,10 +52,12 @@ class ChartEditDialog extends _react.Component {
     }
   }
   render() {
+    var _window, _window$app, _window$app$state;
     const {
       api,
       colorThemeName,
-      theme
+      theme,
+      eventBus
     } = this.props;
     const {
       chart
@@ -80,12 +83,16 @@ class ChartEditDialog extends _react.Component {
       chart: chart,
       config: window.dtable,
       api: api,
+      dtableStoreValue: this.value,
       tables: this.value.tables,
       collaborators: this.value.collaborators,
+      departments: ((_window = window) === null || _window === void 0 ? void 0 : (_window$app = _window.app) === null || _window$app === void 0 ? void 0 : (_window$app$state = _window$app.state) === null || _window$app$state === void 0 ? void 0 : _window$app$state.departments) || [],
       dataSources: "view",
       theme: theme,
       chartColorTheme: colorThemeName,
       isCalculateByView: true,
+      integratedEventTypes: _constants.CommonEventTypes,
+      integratedEventBus: eventBus,
       onChange: this.onSettingChange
     })))));
   }

package/es/components/dialog/enlarged-chart-dialog.js

@@ -27,7 +27,6 @@ class EnlargeChartDialog extends _react.Component {
         colorThemeName,
         statItem,
         getTableById,
-        toggleStatisticRecordsDialog,
         api,
         value
       } = this.props;
@@ -36,8 +35,7 @@ class EnlargeChartDialog extends _react.Component {
         statItem,
         api,
         value,
-        getTableById,
-        toggleStatisticRecordsDialog
+        getTableById
       };
       return /*#__PURE__*/_react.default.createElement("div", {
         className: "view-wrapper",

package/es/constants/index.js

@@ -12,7 +12,7 @@ Object.defineProperty(exports, "KeyCodes", {
     return _keyCodes.default;
   }
 });
-exports.THEME_NAME_MAP = exports.SUMMARY_TYPE = exports.SUMMARY_METHOD_MAP = exports.SUMMARY_METHOD = exports.STAT_TYPE = exports.STATISTICS_COUNT_TYPE = void 0;
+exports.THEME_NAME_MAP = exports.SUMMARY_TYPE = exports.SUMMARY_METHOD_MAP = exports.SUMMARY_METHOD = exports.STATISTICS_COUNT_TYPE = void 0;
 var _keyCodes = _interopRequireDefault(require("./key-codes"));
 var CommonEventTypes = _interopRequireWildcard(require("./event-types"));
 exports.CommonEventTypes = CommonEventTypes;
@@ -29,37 +29,6 @@ const DASHBOARD_ACTION_TYPE = exports.DASHBOARD_ACTION_TYPE = {
   MOVE_CHART_TO_VIEW: 'move_chart_to_view',
   DELETE_CHART: 'delete_chart'
 };
-const STAT_TYPE = exports.STAT_TYPE = {
-  MAP: 'map',
-  MAP_BUBBLE: 'map_bubble',
-  HEAT_MAP: 'heat_map',
-  WORLD_MAP: 'world_map',
-  WORLD_MAP_BUBBLE: 'world_map_bubble',
-  MIRROR: 'mirror',
-  BAR: 'chart_bar',
-  BAR_GROUP: 'chart_bar_group',
-  BAR_STACK: 'chart_bar_stack',
-  LINE: 'chart_line',
-  GROUP_LINE: 'chart_group_line',
-  PIE: 'chart_pie',
-  RING: 'chart_ring',
-  SCATTER: 'scatter_chart',
-  BASIC_NUMBER_CARD: 'basic_number_card',
-  HORIZONTAL_BAR: 'horizontal_bar',
-  HORIZONTAL_GROUP_BAR: 'horizontal_group_bar',
-  STACKED_HORIZONTAL_BAR: 'stacked_horizontal_bar',
-  COMBINATION_CHART: 'combination_chart',
-  TREND_CHART: 'trend_chart',
-  AREA_CHART: 'area_chart',
-  AREA_GROUP_CHART: 'area_group_chart',
-  COMPARE_BAR: 'compare_bar',
-  COMPLETENESS_CHART: 'completeness_chart',
-  DASHBOARD: 'dashboard',
-  GROUP_COMPLETENESS_CHART: 'group_completeness_chart',
-  TREEMAP: 'treemap',
-  PIVOT_TABLE: 'pivot_table',
-  CUSTOM_BAR: 'custom_bar'
-};
 const SUMMARY_TYPE = exports.SUMMARY_TYPE = {
   COUNT: 'count',
   ADVANCED: 'advanced'

package/es/dashboard.js

@@ -66,11 +66,6 @@ class DashBoard extends _react.Component {
         selectedDashboardIdx
       });
     };
-    this.refreshCharts = () => {
-      this.setState({
-        dtableChangedTime: Date.now()
-      });
-    };
     this.initDashboard = () => {
       const value = this.value;
       this.dashboardService = new _dashboardService.default({
@@ -363,8 +358,7 @@ class DashBoard extends _react.Component {
     } = this.initDashboard();
     this.state = {
       statistics: _statistics,
-      selectedDashboardIdx: _selectedDashboardIdx,
-      dtableChangedTime: null
+      selectedDashboardIdx: _selectedDashboardIdx
     };
     this.isInitDashboard = true;
     this.updatingLocalStatistics = false;
@@ -377,12 +371,10 @@ class DashBoard extends _react.Component {
     } = this.props;
     this.unsubscribeLocalDtableChanged = eventBus.subscribe('local-dtable-changed', this.onLocalDTableChanged);
     this.unsubscribeRemoteDtableChange = eventBus.subscribe('remote-dtable-changed', this.onServerDTableChanged);
-    this.unsubscribeRefreshCharts = eventBus.subscribe(_constants.CommonEventTypes.REFRESH_CHARTS, this.refreshCharts);
   }
   componentWillUnmount() {
     this.unsubscribeLocalDtableChanged();
     this.unsubscribeRemoteDtableChange();
-    this.unsubscribeRefreshCharts();
   }
   render() {
     const {
@@ -390,15 +382,13 @@ class DashBoard extends _react.Component {
     } = this.props;
     const {
       statistics,
-      selectedDashboardIdx,
-      dtableChangedTime
+      selectedDashboardIdx
     } = this.state;
     const isTableReadOnly = this.isTableReadOnly();
     const colorThemeName = this.dashboardService.getColorThemeName();
     return _utils.isMobile ? /*#__PURE__*/_react.default.createElement(_mobileDashboard.default, {
       isTableReadOnly: isTableReadOnly,
       colorThemeName: colorThemeName,
-      dtableChangedTime: dtableChangedTime,
       statistics: statistics,
       selectedDashboardIdx: selectedDashboardIdx,
       eventBus: eventBus,
@@ -413,7 +403,6 @@ class DashBoard extends _react.Component {
     }) : /*#__PURE__*/_react.default.createElement(_desktopDashboard.default, {
       isTableReadOnly: isTableReadOnly,
       colorThemeName: colorThemeName,
-      dtableChangedTime: dtableChangedTime,
       statistics: statistics,
       selectedDashboardIdx: selectedDashboardIdx,
       eventBus: eventBus,

package/es/desktop-dashboard.js

@@ -15,7 +15,6 @@ var _tabs = _interopRequireDefault(require("./tabs"));
 var _statList = _interopRequireDefault(require("./stat-list"));
 var _colorThemeDialog = _interopRequireDefault(require("./components/dialog/color-theme-dialog"));
 var _chartEditDialog = _interopRequireDefault(require("./components/dialog/chart-edit-dialog"));
-var _statisticRecordDialog = _interopRequireDefault(require("./components/dialog/statistic-record-dialog"));
 var _dtableDbApi = _interopRequireDefault(require("./api/dtable-db-api"));
 var _chartService = _interopRequireDefault(require("./service/chart-service"));
 var _constants = require("./constants");
@@ -23,9 +22,7 @@ var _icon = _interopRequireDefault(require("./assets/images/icon.png"));
 const KEY_LOCAL_THEME_MODE = 'statistics-theme-mode';
 class DesktopDashboard extends _react.Component {
   constructor(props) {
-    var _this;
     super(props);
-    _this = this;
     this.onToggleColorThemeDialog = () => {
       this.setState({
         isShowColorThemeDialog: !this.state.isShowColorThemeDialog
@@ -95,28 +92,6 @@ class DesktopDashboard extends _react.Component {
       const uuidThemeModeMap = this.getThemeModeMap();
       return uuidThemeModeMap[dtableUuid];
     };
-    this.toggleStatisticRecordsDialog = function (statisticRecord, chart) {
-      let {
-        isColumn = false,
-        isCurrentView = false,
-        isRow = false
-      } = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-      if (_this.state.chartRecordsParams) {
-        _this.setState({
-          chartRecordsParams: null
-        });
-      } else {
-        _this.setState({
-          chartRecordsParams: {
-            statisticRecord,
-            chart,
-            isColumn,
-            isCurrentView,
-            isRow
-          }
-        });
-      }
-    };
     this.generateChart = chartType => {
       const {
         statistics,
@@ -150,8 +125,7 @@ class DesktopDashboard extends _react.Component {
       isShowChartEditDialog: false,
       isShowChartAddDialog: false,
       isShowColorThemeDialog: false,
-      editingChart: null,
-      chartRecordsParams: null
+      editingChart: null
     };
     this.api = {
       sqlQuery: this.sqlQuery,
@@ -165,10 +139,8 @@ class DesktopDashboard extends _react.Component {
   }
   render() {
     const {
-      getTableById,
       getValue,
       isTableReadOnly,
-      dtableChangedTime,
       colorThemeName,
       statistics,
       selectedDashboardIdx,
@@ -178,7 +150,6 @@ class DesktopDashboard extends _react.Component {
       theme,
       isFullScreen,
       editingChart,
-      chartRecordsParams,
       isShowChartAddDialog
     } = this.state;
     const darkMode = theme === _constants.THEME_NAME_MAP.DARK;
@@ -260,7 +231,6 @@ class DesktopDashboard extends _react.Component {
       className: "statistic-main"
     }, /*#__PURE__*/_react.default.createElement(_statList.default, {
       isTableReadOnly: isTableReadOnly,
-      dtableChangedTime: dtableChangedTime,
       theme: theme,
       colorThemeName: colorThemeName,
       statItems: statItems,
@@ -275,20 +245,19 @@ class DesktopDashboard extends _react.Component {
       deleteChart: this.props.deleteChart,
       modifyDashboardLayout: this.props.modifyDashboardLayout,
       onToggleEditChart: this.onToggleEditChart,
-      onCloseDashboard: this.props.onCloseDashboard,
-      toggleStatisticRecordsDialog: this.toggleStatisticRecordsDialog
+      onCloseDashboard: this.props.onCloseDashboard
     })), this.state.isShowChartEditDialog && /*#__PURE__*/_react.default.createElement(_chartEditDialog.default, {
       theme: theme,
       colorThemeName: colorThemeName,
       editingChart: editingChart,
+      eventBus: eventBus,
       api: this.api,
       getValue: getValue,
       statistics: statistics,
       selectedDashboardIdx: selectedDashboardIdx,
       addChart: this.props.addChart,
       modifyChart: this.props.modifyChart,
-      onToggleEditChart: this.onToggleEditChart,
-      toggleStatisticRecordsDialog: this.toggleStatisticRecordsDialog
+      onToggleEditChart: this.onToggleEditChart
     }), isShowChartAddDialog && /*#__PURE__*/_react.default.createElement(_seaChart.TypesDialog, {
       type: "",
       onToggle: this.onToggleAddChart,
@@ -297,12 +266,6 @@ class DesktopDashboard extends _react.Component {
       colorThemeName: colorThemeName,
       onToggleColorThemeDialog: this.onToggleColorThemeDialog,
       modifyColorTheme: this.props.modifyColorTheme
-    }), !!chartRecordsParams && /*#__PURE__*/_react.default.createElement(_statisticRecordDialog.default, {
-      eventBus: this.props.eventBus,
-      chartRecordsParams: chartRecordsParams,
-      getTableById: getTableById,
-      getValue: getValue,
-      toggleStatisticRecordsDialog: this.toggleStatisticRecordsDialog
     }));
   }
 }

package/es/mobile-dashboard.js

@@ -65,13 +65,13 @@ class MobileDashboard extends _react.Component {
     })))), /*#__PURE__*/_react.default.createElement("div", {
       className: _mobileDashboardModule.default['mobile-statistic-dashboard-wrapper']
     }, statItems.map(statItem => {
-      var _style_config$title, _style_config$title$t;
       const {
         _id,
-        type,
-        style_config = {}
+        type
       } = statItem.config;
-      const name = (style_config === null || style_config === void 0 ? void 0 : (_style_config$title = style_config.title) === null || _style_config$title === void 0 ? void 0 : (_style_config$title$t = _style_config$title.text) === null || _style_config$title$t === void 0 ? void 0 : _style_config$title$t.name) || '';
+      const {
+        name
+      } = statItem.style_config.title.text;
       const showStatName = !(type === _seaChart.CHART_TYPE.BASIC_NUMBER_CARD || type === _seaChart.CHART_TYPE.DASHBOARD);
       return /*#__PURE__*/_react.default.createElement("div", {
         key: "mobile-statistic-chart-".concat(_id),

package/es/stat-list/chart-preview.js

@@ -75,8 +75,8 @@ class ChartPreview extends _react.Component {
         colorThemeName,
         api,
         value,
-        getTableById,
-        toggleStatisticRecordsDialog
+        eventBus,
+        getTableById
       } = this.props;
       return /*#__PURE__*/_react.default.createElement(_statView.default, {
         ref: ref => this.chartView = ref,
@@ -85,8 +85,8 @@ class ChartPreview extends _react.Component {
         statItem: statItem,
         api: api,
         value: value,
-        getTableById: getTableById,
-        toggleStatisticRecordsDialog: toggleStatisticRecordsDialog
+        eventBus: eventBus,
+        getTableById: getTableById
       });
     };
     this.moveChartToView = viewId => {

package/es/stat-list/index.js

@@ -132,7 +132,7 @@ class StatList extends _react.Component {
 
         // refresh charts if has updates
         if (Array.isArray(rowIds) && rowIds.length > 0 || Array.isArray(newRows) && newRows.length > 0) {
-          this.props.eventBus.dispatch(_constants.CommonEventTypes.REFRESH_CHARTS);
+          _seaChart.EventBus.dispatch(_constants.CommonEventTypes.REFRESH_CHARTS);
         }
       }
       this.statisticalResult4Update = null;
@@ -168,7 +168,8 @@ class StatList extends _react.Component {
       theme,
       colorThemeName,
       statItems,
-      api
+      api,
+      eventBus
     } = this.props;
     const {
       layout,
@@ -206,6 +207,7 @@ class StatList extends _react.Component {
         colorThemeName: colorThemeName,
         statItem: item,
         api: api,
+        eventBus: eventBus,
         value: this.value,
         getOtherStatistics: this.props.getOtherStatistics,
         getTableById: this.props.getTableById,
@@ -225,8 +227,7 @@ class StatList extends _react.Component {
           } = _ref2;
           return this.showSelectTableDialog(index, statisticalResult);
         },
-        onToggleEditChart: this.props.onToggleEditChart,
-        toggleStatisticRecordsDialog: this.props.toggleStatisticRecordsDialog
+        onToggleEditChart: this.props.onToggleEditChart
       }));
     })), enlargedChart && /*#__PURE__*/_react.default.createElement(_enlargedChartDialog.default, {
       colorThemeName: colorThemeName,
@@ -234,8 +235,7 @@ class StatList extends _react.Component {
       api: api,
       value: this.value,
       getTableById: this.props.getTableById,
-      onEnlargeToggle: this.closeEnlargedChart,
-      toggleStatisticRecordsDialog: this.props.toggleStatisticRecordsDialog
+      onEnlargeToggle: this.closeEnlargedChart
     }), chartExport2Table && /*#__PURE__*/_react.default.createElement(_newTableDialog.default, {
       getTables: this.props.getTables,
       tableName: chartExport2Table.name,

package/es/stat-view/index.js

@@ -8,6 +8,7 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _seaChart = require("sea-chart");
 var _dtableUtils = require("dtable-utils");
+var _constants = require("../constants");
 class StatView extends _react.default.Component {
   constructor(props) {
     super(props);
@@ -40,12 +41,14 @@ class StatView extends _react.default.Component {
     this.viewRef = null;
   }
   render() {
+    var _window, _window$app, _window$app$state;
     const {
       statItem,
       api,
       value,
       theme,
-      colorThemeName
+      colorThemeName,
+      eventBus
     } = this.props;
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "statistic-chart-container"
@@ -53,12 +56,16 @@ class StatView extends _react.default.Component {
       chart: statItem,
       api: api,
       config: window.dtable,
+      dtableStoreValue: value,
       tables: value.tables,
       collaborators: value.collaborators,
+      departments: ((_window = window) === null || _window === void 0 ? void 0 : (_window$app = _window.app) === null || _window$app === void 0 ? void 0 : (_window$app$state = _window$app.state) === null || _window$app$state === void 0 ? void 0 : _window$app$state.departments) || [],
       hideTitle: true,
       globalTheme: theme,
       chartColorTheme: colorThemeName,
       isCalculateByView: true,
+      integratedEventTypes: _constants.CommonEventTypes,
+      integratedEventBus: eventBus,
       onViewRef: this.getViewRef
     }));
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-statistic",
-  "version": "5.0.10-alpha.3",
+  "version": "5.0.10-alpha.5",
   "description": "statistics",
   "main": "dist/dtable-statistic.js",
   "author": "seafile",
@@ -18,7 +18,7 @@
     "react-grid-layout": "^1.2.5",
     "react-intl-universal": "^2.4.8",
     "reactstrap": "8.9.0",
-    "sea-chart": "^0.0.56"
+    "sea-chart": "0.0.56-alpha.7"
   },
   "peerDependencies": {
     "dtable-ui-component": "~5.0.*",

package/es/components/dialog/statistic-record-dialog/index.css

@@ -1,120 +0,0 @@
-.statistic-records-dialog {
-  width: 800px;
-  max-width: 800px;
-  height: calc(100% - 56px);
-}
-
-.statistic-records-dialog .modal-content {
-  width: 100%;
-  height: 100%;
-}
-
-.statistic-records-dialog .search-header {
-  height: 46px;
-  line-height: 46px;
-  display: flex;
-  justify-content: space-between;
-  border-bottom: 1px solid #e9ecef;
-  align-items: center;
-  padding: 0 20px;
-  font-weight: 500;
-  font-size: 16px;
-}
-
-.statistic-records-dialog .no-search-result {
-  height: 100%;
-  width: 100%;
-  text-align: center;
-  background-position: 50% 140px;
-  background-size: 132px 132px;
-  line-height: 600px;
-  color: #aaa;
-}
-
-.statistic-records-dialog .search-input-container .close {
-  height: 24px !important;
-  width: 24px;
-  line-height: 24px;
-  position: absolute;
-  right: 14px;
-  top: 22px;
-  padding: 0;
-  margin: 0;
-}
-
-.statistic-records-dialog .search-input-container {
-  margin-top: 10px;
-  padding: 0 20px;
-  height: 48px;
-  position: relative;
-}
-
-.statistic-records-dialog .search-input-container .search-tables-input {
-  height: 38px;
-  line-height: 38px;
-  padding-left: 30px;
-  border-bottom: 0;
-  background: #f5f5f5;
-  border-radius: 3px;
-  border: 1px solid #dedede;
-}
-
-.statistic-records-dialog .search-input-container .search-tables-input:focus {
-  outline: none;
-  box-shadow: unset;
-}
-
-.statistic-records-dialog .search-input-container .header-search-icon {
-  line-height: 38px;
-  text-align: center;
-  color: #aaa;
-  margin-left: 11px;
-  position: absolute;
-  left: unset;
-}
-
-.statistic-records-dialog .search-input-container .clear-search-text {
-  display: inline-block;
-  position: absolute;
-  right: 30px;
-  top: 10px;
-  height: 12px;
-  width: 12px;
-  line-height: 12px;
-  color: #ccc;
-}
-
-.statistic-records-dialog .search-input-container .clear-search-text .dtable-font {
-  font-size: 12px;
-}
-
-.statistic-records-dialog .search-input-container .clear-search-text:hover {
-  cursor: pointer;
-}
-
-.statistic-records-dialog .statistic-records-container {
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  overflow-y: hidden;
-  background-color: #f8f8f8;
-  border-bottom-left-radius: 3px;
-  border-bottom-right-radius: 3px;
-}
-
-.statistic-records-dialog.statistic-records-container .records-list {
-  height: calc(100% - 47px);
-  width: fit-content;
-  min-width: 100%;
-  padding: 10px 20px;
-  overflow-y: auto;
-  margin-top: 3px;
-}
-
-.statistic-records-dialog .statistic-records-container .records-list .records-container {
-  height: auto;
-}
-
-.statistic-records-dialog .row-card-item-content .grid-cell-type-button .grid-cell-type-button-inner {
-  justify-content: flex-start;
-}

package/es/components/dialog/statistic-record-dialog/index.js

@@ -1,344 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _Loading2 = _interopRequireDefault(require("dtable-ui-component/lib/Loading"));
-var _DTableSearchInput2 = _interopRequireDefault(require("dtable-ui-component/lib/DTableSearchInput"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
-var _reactstrap = require("reactstrap");
-var _dtableUtils = require("dtable-utils");
-var _dtableDbApi = _interopRequireDefault(require("../../../api/dtable-db-api"));
-var _constants = require("../../../constants");
-require("./index.css");
-// import { searchRows } from '../../../utils';
-// import { getSqlString } from '../../../utils/sql-utils';
-class StatisticRecordDialog extends _react.default.Component {
-  constructor(props) {
-    super(props);
-    this.init = () => {
-      const {
-        chartRecordsParams
-      } = this.props;
-      if (!chartRecordsParams) return;
-      const {
-        statisticRecord,
-        chart,
-        isColumn,
-        isCurrentView,
-        isRow
-      } = chartRecordsParams || {};
-      const {
-        rows: records
-      } = statisticRecord;
-      const {
-        getTableById
-      } = this.props;
-      const {
-        table_id,
-        view_id
-      } = chart;
-      this.table = getTableById(table_id);
-      this.view = (0, _dtableUtils.getViewById)(this.table.views, view_id);
-      this.isArchiveView = (0, _dtableUtils.isArchiveView)(this.view);
-      this.unShowColumnKeyList = this.getUnShowColumnKeyList(this.view);
-      this.renderedColumns = this.getRenderedColumns(this.table);
-      // if (this.isArchiveView || !records) {
-      //   const { username, userId, userDepartmentIdsMap } = window.dtable || {};
-      //   const sqlString = getSqlString(chart, statisticRecord, { isColumn, isCurrentView, isRow, getTableById, username, userId, userDepartmentIdsMap });
-      //   dtableDbAPI.sqlQuery(sqlString).then(res => {
-      //     const { results: rows } = res.data;
-      //     this.processDrilledRows(rows);
-      //   });
-      //   return;
-      // }
-
-      this.processDrilledRows(records);
-    };
-    this.processDrilledRows = drilledRows => {
-      const {
-        statisticRecord
-      } = this.props.chartRecordsParams;
-      const {
-        name
-      } = statisticRecord;
-      const searchedRowsIds = this.getSearchedRows(drilledRows);
-      let idRowMap = {};
-      drilledRows.forEach(row => {
-        idRowMap[row._id] = row;
-      });
-      this.initComputedProperties(drilledRows);
-      this.setState({
-        loading: false,
-        title: name,
-        rows: drilledRows,
-        idRowMap,
-        searchedRowsIds
-      });
-    };
-    this.initComputedProperties = drilledRows => {
-      if (this.isArchiveView) {
-        const formulaColumns = (0, _dtableUtils.getFormulaColumnsContainLinks)(this.table);
-        if (formulaColumns.length === 0) return {};
-        let formulaRows = {};
-        drilledRows.forEach(row => {
-          const rowId = row._id;
-          formulaRows[rowId] = {};
-          formulaColumns.forEach(column => formulaRows[rowId][column.key] = row[column.key]);
-        });
-        this.formulaRows = formulaRows;
-        return;
-      }
-      const {
-        formulaRows
-      } = this.getTableViewFormulaRows();
-      this.formulaRows = formulaRows;
-    };
-    this.onSearch = searchVal => {
-      const {
-        rows
-      } = this.state;
-      const searchedRowsIds = this.getSearchedRows(rows, searchVal);
-      this.setState({
-        searchedRowsIds,
-        searchVal
-      });
-    };
-    this.clearTimer = () => {
-      if (this.timer) {
-        clearTimeout(this.timer);
-        this.timer = null;
-      }
-    };
-    this.clearSearch = () => {
-      const {
-        rows
-      } = this.state;
-      const searchedRowsIds = this.getSearchedRows(rows);
-      this.setState({
-        searchedRowsIds,
-        searchVal: ''
-      });
-    };
-    this.getSearchedRows = (rows, searchVal) => {
-      if (!Array.isArray(rows) || rows.length === 0) return [];
-      // if (searchVal) {
-      //   return searchRows(
-      //     rows,
-      //     getViewShownColumns(this.view, this.table.columns),
-      //     searchVal,
-      //     (row) => {
-      //       return row;
-      //     },
-      //   ).map((row) => row._id);
-      // }
-      return rows.map(row => row._id);
-    };
-    this.getRowsByIds = rowsIds => {
-      if (!Array.isArray(rowsIds) || rowsIds.length === 0) {
-        return [];
-      }
-      const {
-        idRowMap
-      } = this.state;
-      return rowsIds.map(rowId => idRowMap[rowId]).filter(Boolean);
-    };
-    this.toggle = () => {
-      if (this.valueChanged) {
-        this.props.eventBus.dispatch(_constants.CommonEventTypes.REFRESH_CHARTS);
-      }
-      this.props.toggleStatisticRecordsDialog();
-    };
-    this.expandRowUpdated = _ref => {
-      let {
-        table_id,
-        updatedRow
-      } = _ref;
-      // none-matched
-      if (table_id !== this.table._id) return;
-      const {
-        rows,
-        searchedRowsIds,
-        idRowMap,
-        searchVal
-      } = this.state;
-      let updatedSearchedRowsIds = searchedRowsIds;
-      let updatedRows = [...rows];
-      let updatedIdRowMap = idRowMap;
-      rows.forEach((row, index) => {
-        const rowId = row._id;
-        if (rowId === updatedRow._id) {
-          updatedRows[index] = updatedRow;
-          updatedIdRowMap[rowId] = updatedRow;
-        }
-      });
-      if (searchedRowsIds.length > 0) {
-        const searchedRows = this.getRowsByIds(searchedRowsIds);
-        updatedSearchedRowsIds = this.getSearchedRows(searchedRows, searchVal);
-      }
-      this.valueChanged = true;
-      this.setState({
-        rows: updatedRows,
-        idRowMap: updatedIdRowMap,
-        searchedRowsIds: updatedSearchedRowsIds
-      });
-    };
-    this.expandRowDeleted = _ref2 => {
-      let {
-        table_id,
-        row_id
-      } = _ref2;
-      // none-matched
-      if (table_id !== this.table._id) return;
-      const {
-        rows,
-        searchedRowsIds,
-        idRowMap
-      } = this.state;
-      let updatedSearchedRowsIds = searchedRowsIds;
-      let updatedIdRowMap = idRowMap;
-      const updatedRows = rows.filter(row => row._id !== row_id);
-      delete updatedIdRowMap[row_id];
-      if (searchedRowsIds.length > 0) {
-        updatedSearchedRowsIds = searchedRowsIds.filter(rowId => rowId !== row_id);
-      }
-      this.valueChanged = true;
-      this.setState({
-        rows: updatedRows,
-        idRowMap: updatedIdRowMap,
-        searchedRowsIds: updatedSearchedRowsIds
-      });
-    };
-    this.getUnShowColumnKeyList = view => {
-      const firstColumnKey = '0000';
-      const {
-        hidden_columns = []
-      } = view;
-      return [firstColumnKey, ...hidden_columns];
-    };
-    this.getRenderedColumns = table => {
-      const {
-        columns
-      } = table;
-      return columns.filter(column => !this.unShowColumnKeyList.includes(column.key));
-    };
-    this.getTableViewFormulaRows = () => {
-      const {
-        table,
-        view
-      } = this;
-      const value = this.props.getValue();
-      if (view.formula_rows && Object.keys(view.formula_rows).length > 0) {
-        return {
-          formulaRows: view.formula_rows
-        };
-      }
-      if (window.app && window.app.cacheFormulaResults) {
-        window.app.cacheFormulaResults(table.rows, {
-          targetViewId: view._id,
-          table,
-          value
-        });
-      }
-      return {
-        formulaRows: view.formula_rows
-      };
-    };
-    this.renderRowsCards = () => {
-      const {
-        searchedRowsIds
-      } = this.state;
-      const searchedRows = this.getRowsByIds(searchedRowsIds);
-      if (searchedRows.length === 0) return null;
-      if (!window.app || !window.app.renderRowsCards) return null;
-      return window.app.renderRowsCards({
-        table: this.table,
-        renderedColumns: this.renderedColumns,
-        unShowColumnKeyList: this.unShowColumnKeyList,
-        isShowRowCardHeader: true,
-        formulaRows: this.formulaRows,
-        columns: this.renderedColumns,
-        rows: searchedRows,
-        rowCardType: 'statistic'
-      });
-    };
-    this.state = {
-      loading: true,
-      title: '',
-      rows: [],
-      idRowMap: {},
-      searchVal: '',
-      searchedRowsIds: []
-    };
-    this.table = null;
-    this.view = null;
-    this.isArchiveView = false;
-    this.valueChanged = false;
-    this.renderedColumns = [];
-    this.formulaRows = null;
-    this.unShowColumnKeyList = null;
-  }
-  componentDidMount() {
-    this.unsubscribeExpandRowUpdated = this.props.eventBus.subscribe(_constants.CommonEventTypes.EXPAND_ROW_UPDATED, this.expandRowUpdated);
-    this.unsubscribeExpandRowDeleted = this.props.eventBus.subscribe(_constants.CommonEventTypes.EXPAND_ROW_DELETED, this.expandRowDeleted);
-    this.init();
-  }
-  componentWillUnmount() {
-    this.unsubscribeExpandRowUpdated();
-    this.unsubscribeExpandRowDeleted();
-  }
-  render() {
-    const {
-      loading,
-      title
-    } = this.state;
-    return /*#__PURE__*/_react.default.createElement(_reactstrap.Modal, {
-      isOpen: true,
-      autoFocus: false,
-      toggle: this.toggle,
-      className: "statistic-records-dialog",
-      zIndex: 1048
-    }, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-      className: "search-header"
-    }, /*#__PURE__*/_react.default.createElement("span", null, title), /*#__PURE__*/_react.default.createElement("button", {
-      type: "button",
-      className: "close",
-      "aria-label": "Close",
-      onClick: this.toggle
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      "aria-hidden": "true"
-    }, "\xD7"))), /*#__PURE__*/_react.default.createElement("div", {
-      className: "search-input-container"
-    }, /*#__PURE__*/_react.default.createElement("i", {
-      className: "header-search-icon dtable-font dtable-icon-search"
-    }), /*#__PURE__*/_react.default.createElement(_DTableSearchInput2.default, {
-      autoFocus: true,
-      isClearable: true,
-      className: "search-tables-input",
-      placeholder: _reactIntlUniversal.default.get('Search_records'),
-      onChange: this.onSearch,
-      clearValue: this.clearSearch,
-      components: {
-        ClearIndicator: props => {
-          return /*#__PURE__*/_react.default.createElement("span", {
-            className: "clear-search-text",
-            onClick: props.clearValue,
-            title: _reactIntlUniversal.default.get('Clear_search_text'),
-            "aria-label": _reactIntlUniversal.default.get('Clear_search_text')
-          }, /*#__PURE__*/_react.default.createElement("i", {
-            className: "dtable-font dtable-icon-x-"
-          }));
-        }
-      }
-    })), /*#__PURE__*/_react.default.createElement(_reactstrap.ModalBody, {
-      className: "statistic-records-container"
-    }, loading ? /*#__PURE__*/_react.default.createElement("div", {
-      className: "d-flex py-8"
-    }, /*#__PURE__*/_react.default.createElement(_Loading2.default, null)) : this.renderRowsCards())));
-  }
-}
-var _default = exports.default = StatisticRecordDialog;