dtable-statistic 4.2.1 → 4.3.0

package/es/dashboard.js

@@ -1,9 +1,3 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Component } from 'react';
 import intl from 'react-intl-universal';
 import { TableUtils, Views } from 'dtable-store';
@@ -22,15 +16,11 @@ import './locale';
 import './assets/css/dashboard.css';
 import './assets/css/theme.css';
 import './assets/css/dialog.css';
-var DashBoard = /*#__PURE__*/function (_Component) {
-  _inherits(DashBoard, _Component);
-  var _super = _createSuper(DashBoard);
-  function DashBoard(props) {
-    var _this;
-    _classCallCheck(this, DashBoard);
-    _this = _super.call(this, props);
-    _this.loadSvg = function () {
-      var importAll = function importAll(requireContext) {
+class DashBoard extends Component {
+  constructor(props) {
+    super(props);
+    this.loadSvg = () => {
+      const importAll = requireContext => {
         requireContext.keys().forEach(requireContext);
       };
       try {
@@ -40,471 +30,491 @@ var DashBoard = /*#__PURE__*/function (_Component) {
         console.log(error);
       }
     };
-    _this.onLocalDTableChanged = function (value) {
-      if (_this.updatingLocalStatistics) {
+    this.onLocalDTableChanged = value => {
+      if (this.updatingLocalStatistics) {
         // it's unnecessary to notify data changed during update statistics
-        _this.value = value;
-        _this.updatingLocalStatistics = false;
+        this.value = value;
+        this.updatingLocalStatistics = false;
         return;
       }
-      _this.onDTableChanged({
-        value: value
+      this.onDTableChanged({
+        value
       });
     };
-    _this.onServerDTableChanged = function (value) {
-      _this.onDTableChanged({
-        value: value
+    this.onServerDTableChanged = value => {
+      this.onDTableChanged({
+        value
       });
     };
-    _this.onDTableChanged = function (_ref) {
-      var value = _ref.value;
-      _this.value = value;
-      _this.disabledUpdateLayout = true;
-      var _this$initDashboard = _this.initDashboard(),
-        statistics = _this$initDashboard.statistics,
-        selectedDashboardIdx = _this$initDashboard.selectedDashboardIdx;
-      _this.setState({
-        statistics: statistics,
-        selectedDashboardIdx: selectedDashboardIdx
+    this.onDTableChanged = _ref => {
+      let {
+        value
+      } = _ref;
+      this.value = value;
+      this.disabledUpdateLayout = true;
+      const {
+        statistics,
+        selectedDashboardIdx
+      } = this.initDashboard();
+      this.setState({
+        statistics,
+        selectedDashboardIdx
       });
     };
-    _this.refreshCharts = function () {
-      _this.setState({
+    this.refreshCharts = () => {
+      this.setState({
         dtableChangedTime: Date.now()
       });
     };
-    _this.initDashboard = function () {
-      var _window$dtable = window.dtable,
-        username = _window$dtable.username,
-        userId = _window$dtable.userId;
-      var value = _this.value;
-      _this.chartCalculator = new ChartCalculator({
-        username: username,
-        userId: userId,
-        value: value,
-        statisticThreadManager: _this.statisticThreadManager
-      });
-      _this.dashboardService = new DashBoardService({
-        value: value,
-        defaultDashboardName: _this.defaultDashboardName,
-        chartCalculator: _this.chartCalculator,
-        chartService: _this.chartService,
-        updateStatistics: _this.props.updateStatistics,
-        deletePluginSettings: _this.props.deletePluginSettings
-      });
-      _this.initLabelColorConfigs();
-      var statistics = _this.dashboardService.getStatistics();
-      var validStatistics = _this.dashboardService.getValidStatistics(statistics);
-      var selectedDashboardIdx = _this.getSelectedDashboardIdxFromLocal(KEY_SELECTED_DASHBOARD) || 0;
+    this.initDashboard = () => {
+      const {
+        username,
+        userId
+      } = window.dtable;
+      const value = this.value;
+      this.chartCalculator = new ChartCalculator({
+        username,
+        userId,
+        value,
+        statisticThreadManager: this.statisticThreadManager
+      });
+      this.dashboardService = new DashBoardService({
+        value,
+        defaultDashboardName: this.defaultDashboardName,
+        chartCalculator: this.chartCalculator,
+        chartService: this.chartService,
+        updateStatistics: this.props.updateStatistics,
+        deletePluginSettings: this.props.deletePluginSettings
+      });
+      this.initLabelColorConfigs();
+      const statistics = this.dashboardService.getStatistics();
+      const validStatistics = this.dashboardService.getValidStatistics(statistics);
+      let selectedDashboardIdx = this.getSelectedDashboardIdxFromLocal(KEY_SELECTED_DASHBOARD) || 0;
       if (!statistics[selectedDashboardIdx]) {
         selectedDashboardIdx = 0;
       }
       return {
         statistics: validStatistics,
-        selectedDashboardIdx: selectedDashboardIdx
+        selectedDashboardIdx
       };
     };
-    _this.initLabelColorConfigs = function () {
-      var systemCustomColors = window.dtable.customColors || [];
-      var baseSettings = _this.value && _this.value.settings;
-      var baseCustomColors = baseSettings && baseSettings.custom_colors || [];
-      _this.labelColorConfigs = [].concat(_toConsumableArray(LABEL_COLORS.map(function (color) {
-        return {
-          color: color.toUpperCase(),
-          text_color: '#fff'
-        };
-      })), _toConsumableArray(systemCustomColors.map(function (customColor) {
-        return _objectSpread(_objectSpread({}, customColor), {}, {
-          color: customColor.color.toUpperCase()
-        });
-      })), _toConsumableArray(baseCustomColors.map(function (customColor) {
-        return {
-          color: customColor.COLOR.toUpperCase(),
-          text_color: customColor.TEXT_COLOR,
-          border_color: customColor.BORDER_COLOR
-        };
-      })));
-    };
-    _this.clearCalculations = function () {
-      _this.statisticThreadManager.clearQueue();
-      _this.statisticThreadManager.terminateWorkers();
-    };
-    _this.getSelectedDashboardIdxFromLocal = function (key) {
-      var dtableUuid = window.dtable.dtableUuid;
-      var selectedViewIdsString = window.localStorage.getItem(key);
-      var selectedViewIds = selectedViewIdsString ? JSON.parse(selectedViewIdsString) : {};
+    this.initLabelColorConfigs = () => {
+      const systemCustomColors = window.dtable.customColors || [];
+      const baseSettings = this.value && this.value.settings;
+      const baseCustomColors = baseSettings && baseSettings.custom_colors || [];
+      this.labelColorConfigs = [...LABEL_COLORS.map(color => ({
+        color: color.toUpperCase(),
+        text_color: '#fff'
+      })), ...systemCustomColors.map(customColor => ({
+        ...customColor,
+        color: customColor.color.toUpperCase()
+      })), ...baseCustomColors.map(customColor => ({
+        color: customColor.COLOR.toUpperCase(),
+        text_color: customColor.TEXT_COLOR,
+        border_color: customColor.BORDER_COLOR
+      }))];
+    };
+    this.clearCalculations = () => {
+      this.statisticThreadManager.clearQueue();
+      this.statisticThreadManager.terminateWorkers();
+    };
+    this.getSelectedDashboardIdxFromLocal = key => {
+      const {
+        dtableUuid
+      } = window.dtable;
+      const selectedViewIdsString = window.localStorage.getItem(key);
+      const selectedViewIds = selectedViewIdsString ? JSON.parse(selectedViewIdsString) : {};
       return selectedViewIds[dtableUuid];
     };
-    _this.setSelectedDashboardIdx = function (index) {
-      var dtableUuid = window.dtable.dtableUuid;
-      var selectedViewIdsString = window.localStorage.getItem(KEY_SELECTED_DASHBOARD);
-      var selectedViewIds = selectedViewIdsString ? JSON.parse(selectedViewIdsString) : {};
+    this.setSelectedDashboardIdx = index => {
+      const {
+        dtableUuid
+      } = window.dtable;
+      const selectedViewIdsString = window.localStorage.getItem(KEY_SELECTED_DASHBOARD);
+      let selectedViewIds = selectedViewIdsString ? JSON.parse(selectedViewIdsString) : {};
       selectedViewIds[dtableUuid] = index;
       localStorage.setItem(KEY_SELECTED_DASHBOARD, JSON.stringify(selectedViewIds));
     };
-    _this.getActiveTable = function () {
-      var activeTableIdx = _this.props.activeTableIdx;
-      return TableUtils.getTableByIndex(_this.value.tables, activeTableIdx);
-    };
-    _this.getActiveView = function () {
-      var activeViewId = _this.props.activeViewId;
-      var selectedTable = _this.getActiveTable();
+    this.getActiveTable = () => {
+      const {
+        activeTableIdx
+      } = this.props;
+      return TableUtils.getTableByIndex(this.value.tables, activeTableIdx);
+    };
+    this.getActiveView = () => {
+      const {
+        activeViewId
+      } = this.props;
+      const selectedTable = this.getActiveTable();
       if (!activeViewId) return selectedTable.views[0];
       return Views.getViewById(selectedTable.views, activeViewId);
     };
-    _this.getInitChart = function (_ref2) {
-      var chartType = _ref2.chartType,
-        dashboard = _ref2.dashboard,
-        activeTable = _ref2.activeTable,
-        activeView = _ref2.activeView;
-      return _this.chartService.getInitChart({
+    this.getInitChart = _ref2 => {
+      let {
+        chartType,
+        dashboard,
+        activeTable,
+        activeView
+      } = _ref2;
+      return this.chartService.getInitChart({
         type: chartType,
-        dashboard: dashboard,
-        activeTable: activeTable,
-        activeView: activeView
-      });
-    };
-    _this.getConvertedChart = function (_ref3) {
-      var originalStatistic = _ref3.originalStatistic,
-        targetStatisticType = _ref3.targetStatisticType,
-        activeTable = _ref3.activeTable;
-      return _this.chartService.getConvertedChart({
-        originalStatistic: originalStatistic,
-        targetStatisticType: targetStatisticType,
-        activeTable: activeTable
-      });
-    };
-    _this.selectDashboard = function (selectedDashboardIdx) {
-      _this.disabledUpdateLayout = true;
-      _this.setSelectedDashboardIdx(selectedDashboardIdx);
-      _this.clearCalculations();
-      _this.setState({
-        selectedDashboardIdx: selectedDashboardIdx
+        dashboard,
+        activeTable,
+        activeView
+      });
+    };
+    this.getConvertedChart = _ref3 => {
+      let {
+        originalStatistic,
+        targetStatisticType,
+        activeTable
+      } = _ref3;
+      return this.chartService.getConvertedChart({
+        originalStatistic,
+        targetStatisticType,
+        activeTable
+      });
+    };
+    this.selectDashboard = selectedDashboardIdx => {
+      this.disabledUpdateLayout = true;
+      this.setSelectedDashboardIdx(selectedDashboardIdx);
+      this.clearCalculations();
+      this.setState({
+        selectedDashboardIdx
       });
     };
-    _this.modifyColorTheme = function (colorThemeName) {
-      var updatedStatistics = _this.dashboardService.update({
+    this.modifyColorTheme = colorThemeName => {
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.MODIFY_COLOR_THEME,
         payload: {
-          colorThemeName: colorThemeName
+          colorThemeName
         }
       });
-      _this.updateStatistics({
+      this.updateStatistics({
         statistics: updatedStatistics
       });
     };
-    _this.addDashboard = function (name, callback) {
-      var statistics = _this.state.statistics;
-      var dashboard = new StatisticDashBoard({
+    this.addDashboard = (name, callback) => {
+      const {
+        statistics
+      } = this.state;
+      const dashboard = new StatisticDashBoard({
         _id: generatorUniqueId(statistics),
         stat_items: [],
-        name: name
+        name
       });
-      var updatedStatistics = _this.dashboardService.update({
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.ADD_DASHBOARD,
         payload: {
-          dashboard: dashboard
+          dashboard
         }
       });
-      _this.clearCalculations();
-      var selectedDashboardIdx = updatedStatistics.length - 1;
-      _this.setSelectedDashboardIdx(selectedDashboardIdx);
-      _this.updateStatistics({
+      this.clearCalculations();
+      const selectedDashboardIdx = updatedStatistics.length - 1;
+      this.setSelectedDashboardIdx(selectedDashboardIdx);
+      this.updateStatistics({
         statistics: updatedStatistics,
-        selectedDashboardIdx: selectedDashboardIdx
-      }, function () {
+        selectedDashboardIdx
+      }, () => {
         callback && callback();
       });
     };
-    _this.renameDashboard = function (name) {
-      var selectedDashboardIdx = _this.state.selectedDashboardIdx;
-      var updatedStatistics = _this.dashboardService.update({
+    this.renameDashboard = name => {
+      const {
+        selectedDashboardIdx
+      } = this.state;
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.RENAME_DASHBOARD,
         payload: {
           index: selectedDashboardIdx,
-          name: name
+          name
         }
       });
-      _this.updateStatistics({
+      this.updateStatistics({
         statistics: updatedStatistics
       });
     };
-    _this.deleteDashboard = function (index) {
-      var _this$state = _this.state,
-        statistics = _this$state.statistics,
-        selectedDashboardIdx = _this$state.selectedDashboardIdx;
-      var nextSelectedDashboardIdx = selectedDashboardIdx;
+    this.deleteDashboard = index => {
+      const {
+        statistics,
+        selectedDashboardIdx
+      } = this.state;
+      let nextSelectedDashboardIdx = selectedDashboardIdx;
       if (index === statistics.length - 1) {
         nextSelectedDashboardIdx--;
       }
-      var updatedStatistics = _this.dashboardService.update({
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.DELETE_DASHBOARD,
         payload: {
-          index: index
+          index
         }
       });
-      _this.setSelectedDashboardIdx(nextSelectedDashboardIdx);
-      _this.clearCalculations();
-      _this.updateStatistics({
+      this.setSelectedDashboardIdx(nextSelectedDashboardIdx);
+      this.clearCalculations();
+      this.updateStatistics({
         statistics: updatedStatistics,
         selectedDashboardIdx: nextSelectedDashboardIdx
       });
     };
-    _this.moveDashboard = function (draggedDashboardId, targetBoardId, relativePosition) {
-      var updatedStatistics = _this.dashboardService.update({
+    this.moveDashboard = (draggedDashboardId, targetBoardId, relativePosition) => {
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.MOVE_DASHBOARD,
         payload: {
-          draggedDashboardId: draggedDashboardId,
-          targetBoardId: targetBoardId,
-          relativePosition: relativePosition
+          draggedDashboardId,
+          targetBoardId,
+          relativePosition
         }
       });
-      var selectedDashboardIdx = updatedStatistics.findIndex(function (statistic) {
-        return statistic._id === draggedDashboardId;
-      });
-      _this.setSelectedDashboardIdx(selectedDashboardIdx);
-      _this.updateStatistics({
+      const selectedDashboardIdx = updatedStatistics.findIndex(statistic => statistic._id === draggedDashboardId);
+      this.setSelectedDashboardIdx(selectedDashboardIdx);
+      this.updateStatistics({
         statistics: updatedStatistics,
-        selectedDashboardIdx: selectedDashboardIdx
+        selectedDashboardIdx
       });
     };
-    _this.modifyDashboardLayout = function (layout) {
+    this.modifyDashboardLayout = layout => {
       // prevent unexpected refresh.
-      if (_this.isInitDashboard) {
-        _this.isInitDashboard = false;
+      if (this.isInitDashboard) {
+        this.isInitDashboard = false;
         return;
       }
-      if (_this.disabledUpdateLayout) {
-        _this.disabledUpdateLayout = false;
+      if (this.disabledUpdateLayout) {
+        this.disabledUpdateLayout = false;
         return;
       }
-      var updatedStatistics = _this.dashboardService.update({
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.MODIFY_DASHBOARD_LAYOUT,
         payload: {
-          index: _this.state.selectedDashboardIdx,
-          layout: layout
+          index: this.state.selectedDashboardIdx,
+          layout
         }
       });
-      _this.updateStatistics({
+      this.updateStatistics({
         statistics: updatedStatistics
       });
     };
-    _this.copyChart = function (chartId) {
-      var _this$state2 = _this.state,
-        statistics = _this$state2.statistics,
-        selectedDashboardIdx = _this$state2.selectedDashboardIdx;
-      var dashboard = statistics[selectedDashboardIdx];
-      var fromChart = dashboard && dashboard.stat_items.find(function (chart) {
-        return chart._id === chartId;
-      });
+    this.copyChart = chartId => {
+      const {
+        statistics,
+        selectedDashboardIdx
+      } = this.state;
+      const dashboard = statistics[selectedDashboardIdx];
+      const fromChart = dashboard && dashboard.stat_items.find(chart => chart._id === chartId);
       if (!fromChart) return;
-      var newChart = _this.chartService.getCopiedChart({
-        dashboard: dashboard,
+      const newChart = this.chartService.getCopiedChart({
+        dashboard,
         originalStatItem: fromChart
       });
-      _this.addChart(newChart);
+      this.addChart(newChart);
     };
-    _this.moveChartToView = function (chartId, viewId) {
-      _this.disabledUpdateLayout = true;
-      var updatedStatistics = _this.dashboardService.update({
+    this.moveChartToView = (chartId, viewId) => {
+      this.disabledUpdateLayout = true;
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.MOVE_CHART_TO_VIEW,
         payload: {
-          index: _this.state.selectedDashboardIdx,
+          index: this.state.selectedDashboardIdx,
           chart_id: chartId,
           target_view_id: viewId
         }
       });
-      _this.updateStatistics({
+      this.updateStatistics({
         statistics: updatedStatistics
       });
     };
-    _this.deleteChart = function (chartId) {
-      _this.disabledUpdateLayout = true;
-      var updatedStatistics = _this.dashboardService.update({
+    this.deleteChart = chartId => {
+      this.disabledUpdateLayout = true;
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.DELETE_CHART,
         payload: {
-          index: _this.state.selectedDashboardIdx,
+          index: this.state.selectedDashboardIdx,
           chart_id: chartId
         }
       });
-      _this.updateStatistics({
+      this.updateStatistics({
         statistics: updatedStatistics
       });
     };
-    _this.addChart = function (chart) {
-      if (!_this.chartCalculator.isValidChart(chart)) {
+    this.addChart = chart => {
+      if (!this.chartCalculator.isValidChart(chart)) {
         return;
       }
-      _this.disabledUpdateLayout = true;
-      var updatedStatistics = _this.dashboardService.update({
+      this.disabledUpdateLayout = true;
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.ADD_CHART,
         payload: {
-          index: _this.state.selectedDashboardIdx,
-          chart: chart
+          index: this.state.selectedDashboardIdx,
+          chart
         }
       });
-      _this.updateStatistics({
+      this.updateStatistics({
         statistics: updatedStatistics
-      }, function () {
+      }, () => {
         // make the copied stat item display in the view
         document.getElementById(chart._id).scrollIntoView(true);
       });
     };
-    _this.modifyChart = function (chart) {
-      var updatedStatistics = _this.dashboardService.update({
+    this.modifyChart = chart => {
+      const updatedStatistics = this.dashboardService.update({
         action: DASHBOARD_ACTION_TYPE.MODIFY_CHART,
         payload: {
-          index: _this.state.selectedDashboardIdx,
-          chart: chart
+          index: this.state.selectedDashboardIdx,
+          chart
         }
       });
-      _this.updateStatistics({
+      this.updateStatistics({
         statistics: updatedStatistics
       });
     };
-    _this.updateStatistics = function (updates, callback) {
-      var statistics = updates.statistics;
-      _this.updatingLocalStatistics = true;
-      var validUpdates = _objectSpread({}, updates);
+    this.updateStatistics = (updates, callback) => {
+      const {
+        statistics
+      } = updates;
+      this.updatingLocalStatistics = true;
+      let validUpdates = {
+        ...updates
+      };
       if (hasOwnProperty(updates, 'statistics')) {
-        validUpdates.statistics = _this.dashboardService.getValidStatistics(statistics);
+        validUpdates.statistics = this.dashboardService.getValidStatistics(statistics);
       }
-      _this.setState(validUpdates, function () {
+      this.setState(validUpdates, () => {
         callback && callback();
-        _this.props.updateStatistics(statistics);
+        this.props.updateStatistics(statistics);
       });
     };
-    _this.getTableById = function (tableId) {
-      return TableUtils.getTableById(_this.value.tables, tableId);
+    this.getTableById = tableId => {
+      return TableUtils.getTableById(this.value.tables, tableId);
     };
-    _this.getTables = function () {
-      return _this.value.tables;
+    this.getTables = () => {
+      return this.value.tables;
     };
-    _this.getViews = function (table) {
+    this.getViews = table => {
       return table.views;
     };
-    _this.getValue = function () {
-      return _this.value;
+    this.getValue = () => {
+      return this.value;
     };
-    _this.isTableReadOnly = function () {
+    this.isTableReadOnly = () => {
       if (window.dtable.modulePermission) {
         return window.dtable.modulePermission.isTableReadOnly;
       }
-      var permission = window.dtable.permission || '';
+      const permission = window.dtable.permission || '';
       return permission === 'r' || permission.slice(0, 2) === 'c-';
     };
-    _this.queryMapJson = function (_ref4, callback) {
-      var map_level = _ref4.map_level,
-        map_location = _ref4.map_location;
-      _this.mapJsonService.queryMapJson({
-        map_level: map_level,
-        map_location: map_location
+    this.queryMapJson = (_ref4, callback) => {
+      let {
+        map_level,
+        map_location
+      } = _ref4;
+      this.mapJsonService.queryMapJson({
+        map_level,
+        map_location
       }, callback);
     };
-    var mediaUrl = window.dtable.mediaUrl;
-    var _value = props.value;
-    var defaultChartTitle = intl.get('Untitled');
-    _this.defaultDashboardName = intl.get('Default_dashboard');
-    _this.value = _value;
-    _this.chartService = new ChartService({
-      defaultChartTitle: defaultChartTitle
+    const {
+      mediaUrl
+    } = window.dtable;
+    const {
+      value: _value
+    } = props;
+    const defaultChartTitle = intl.get('Untitled');
+    this.defaultDashboardName = intl.get('Default_dashboard');
+    this.value = _value;
+    this.chartService = new ChartService({
+      defaultChartTitle
     });
-    _this.statisticThreadManager = new ThreadManager((navigator.hardwareConcurrency || 4) - 1);
-    _this.mapJsonService = new MapJsonService({
-      mediaUrl: mediaUrl
+    this.statisticThreadManager = new ThreadManager((navigator.hardwareConcurrency || 4) - 1);
+    this.mapJsonService = new MapJsonService({
+      mediaUrl
     });
-    var _this$initDashboard2 = _this.initDashboard(),
-      _statistics = _this$initDashboard2.statistics,
-      _selectedDashboardIdx = _this$initDashboard2.selectedDashboardIdx;
-    _this.state = {
+    const {
+      statistics: _statistics,
+      selectedDashboardIdx: _selectedDashboardIdx
+    } = this.initDashboard();
+    this.state = {
       statistics: _statistics,
       selectedDashboardIdx: _selectedDashboardIdx,
       dtableChangedTime: null
     };
-    _this.isInitDashboard = true;
-    _this.updatingLocalStatistics = false;
-    _this.disabledUpdateLayout = false;
-    _this.loadSvg();
-    return _this;
+    this.isInitDashboard = true;
+    this.updatingLocalStatistics = false;
+    this.disabledUpdateLayout = false;
+    this.loadSvg();
   }
-  _createClass(DashBoard, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var eventBus = this.props.eventBus;
-      this.unsubscribeLocalDtableChanged = eventBus.subscribe('local-dtable-changed', this.onLocalDTableChanged);
-      this.unsubscribeRemoteDtableChange = eventBus.subscribe('remote-dtable-changed', this.onServerDTableChanged);
-      this.unsubscribeRefreshCharts = eventBus.subscribe(CommonEventTypes.REFRESH_CHARTS, this.refreshCharts);
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.unsubscribeLocalDtableChanged();
-      this.unsubscribeRemoteDtableChange();
-      this.unsubscribeRefreshCharts();
-      this.clearCalculations();
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var eventBus = this.props.eventBus;
-      var _this$state3 = this.state,
-        statistics = _this$state3.statistics,
-        selectedDashboardIdx = _this$state3.selectedDashboardIdx,
-        dtableChangedTime = _this$state3.dtableChangedTime,
-        editingChart = _this$state3.editingChart;
-      var isTableReadOnly = this.isTableReadOnly();
-      var colorThemeName = this.dashboardService.getColorThemeName();
-      return isMobile ? /*#__PURE__*/React.createElement(MobileDashboard, {
-        isTableReadOnly: isTableReadOnly,
-        colorThemeName: colorThemeName,
-        dtableChangedTime: dtableChangedTime,
-        statistics: statistics,
-        selectedDashboardIdx: selectedDashboardIdx,
-        chartCalculator: this.chartCalculator,
-        labelColorConfigs: this.labelColorConfigs,
-        eventBus: eventBus,
-        onCloseDashboard: this.props.onCloseStatistic,
-        selectDashboard: this.selectDashboard,
-        addDashboard: this.addDashboard,
-        renameDashboard: this.renameDashboard,
-        deleteDashboard: this.deleteDashboard,
-        getTableById: this.getTableById,
-        queryMapJson: this.queryMapJson
-      }) : /*#__PURE__*/React.createElement(DesktopDashboard, {
-        isTableReadOnly: isTableReadOnly,
-        colorThemeName: colorThemeName,
-        dtableChangedTime: dtableChangedTime,
-        statistics: statistics,
-        editingChart: editingChart,
-        selectedDashboardIdx: selectedDashboardIdx,
-        chartCalculator: this.chartCalculator,
-        labelColorConfigs: this.labelColorConfigs,
-        eventBus: eventBus,
-        getActiveTable: this.getActiveTable,
-        getActiveView: this.getActiveView,
-        onCloseDashboard: this.props.onCloseStatistic,
-        selectDashboard: this.selectDashboard,
-        modifyColorTheme: this.modifyColorTheme,
-        addDashboard: this.addDashboard,
-        renameDashboard: this.renameDashboard,
-        deleteDashboard: this.deleteDashboard,
-        moveDashboard: this.moveDashboard,
-        getTableById: this.getTableById,
-        getTables: this.getTables,
-        getViews: this.getViews,
-        getValue: this.getValue,
-        queryMapJson: this.queryMapJson,
-        getInitChart: this.getInitChart,
-        getConvertedChart: this.getConvertedChart,
-        copyChart: this.copyChart,
-        moveChartToView: this.moveChartToView,
-        deleteChart: this.deleteChart,
-        modifyDashboardLayout: this.modifyDashboardLayout,
-        addChart: this.addChart,
-        modifyChart: this.modifyChart
-      });
-    }
-  }]);
-  return DashBoard;
-}(Component);
+  componentDidMount() {
+    const {
+      eventBus
+    } = this.props;
+    this.unsubscribeLocalDtableChanged = eventBus.subscribe('local-dtable-changed', this.onLocalDTableChanged);
+    this.unsubscribeRemoteDtableChange = eventBus.subscribe('remote-dtable-changed', this.onServerDTableChanged);
+    this.unsubscribeRefreshCharts = eventBus.subscribe(CommonEventTypes.REFRESH_CHARTS, this.refreshCharts);
+  }
+  componentWillUnmount() {
+    this.unsubscribeLocalDtableChanged();
+    this.unsubscribeRemoteDtableChange();
+    this.unsubscribeRefreshCharts();
+    this.clearCalculations();
+  }
+  render() {
+    const {
+      eventBus
+    } = this.props;
+    const {
+      statistics,
+      selectedDashboardIdx,
+      dtableChangedTime,
+      editingChart
+    } = this.state;
+    const isTableReadOnly = this.isTableReadOnly();
+    const colorThemeName = this.dashboardService.getColorThemeName();
+    return isMobile ? /*#__PURE__*/React.createElement(MobileDashboard, {
+      isTableReadOnly: isTableReadOnly,
+      colorThemeName: colorThemeName,
+      dtableChangedTime: dtableChangedTime,
+      statistics: statistics,
+      selectedDashboardIdx: selectedDashboardIdx,
+      chartCalculator: this.chartCalculator,
+      labelColorConfigs: this.labelColorConfigs,
+      eventBus: eventBus,
+      onCloseDashboard: this.props.onCloseStatistic,
+      selectDashboard: this.selectDashboard,
+      addDashboard: this.addDashboard,
+      renameDashboard: this.renameDashboard,
+      deleteDashboard: this.deleteDashboard,
+      getTableById: this.getTableById,
+      queryMapJson: this.queryMapJson
+    }) : /*#__PURE__*/React.createElement(DesktopDashboard, {
+      isTableReadOnly: isTableReadOnly,
+      colorThemeName: colorThemeName,
+      dtableChangedTime: dtableChangedTime,
+      statistics: statistics,
+      editingChart: editingChart,
+      selectedDashboardIdx: selectedDashboardIdx,
+      chartCalculator: this.chartCalculator,
+      labelColorConfigs: this.labelColorConfigs,
+      eventBus: eventBus,
+      getActiveTable: this.getActiveTable,
+      getActiveView: this.getActiveView,
+      onCloseDashboard: this.props.onCloseStatistic,
+      selectDashboard: this.selectDashboard,
+      modifyColorTheme: this.modifyColorTheme,
+      addDashboard: this.addDashboard,
+      renameDashboard: this.renameDashboard,
+      deleteDashboard: this.deleteDashboard,
+      moveDashboard: this.moveDashboard,
+      getTableById: this.getTableById,
+      getTables: this.getTables,
+      getViews: this.getViews,
+      getValue: this.getValue,
+      queryMapJson: this.queryMapJson,
+      getInitChart: this.getInitChart,
+      getConvertedChart: this.getConvertedChart,
+      copyChart: this.copyChart,
+      moveChartToView: this.moveChartToView,
+      deleteChart: this.deleteChart,
+      modifyDashboardLayout: this.modifyDashboardLayout,
+      addChart: this.addChart,
+      modifyChart: this.modifyChart
+    });
+  }
+}
 export default DashBoard;