dtable-statistic 4.0.2-test-2

package/es/stat-editor/stat-settings/basic-chart-settings/horizontal-bar-settings.js

@@ -0,0 +1,145 @@
+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, Fragment } from 'react';
+import intl from 'react-intl-universal';
+import BaseSettings from '../public-setting/base-settings';
+import HorizontalBarChartStyle from './style-setting/horizontal-bar-chart-style';
+import GroupbySettings from './groupby-settings';
+import SummarySettings from './summary-settings';
+import DataSort from '../public-setting/data-sort-setting';
+import { GROUPBY_TYPE } from '../../../constants';
+var BarSettings = /*#__PURE__*/function (_Component) {
+  _inherits(BarSettings, _Component);
+  var _super = _createSuper(BarSettings);
+  function BarSettings() {
+    var _this;
+    _classCallCheck(this, BarSettings);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _this.onSelectGroupbyColumn = function (type, groupbyColumnKey, groupbyDateGranularity, groupbyGeolocationGranularity) {
+      var updated = {
+        vertical_axis_column_key: groupbyColumnKey,
+        vertical_axis_date_granularity: groupbyDateGranularity,
+        vertical_axis_geolocation_granularity: groupbyGeolocationGranularity
+      };
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, updated));
+    };
+    _this.onSelectGroupbyDateGranularity = function (type, dateGranularity) {
+      var updated = {
+        vertical_axis_date_granularity: dateGranularity
+      };
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, updated));
+    };
+    _this.onSelectGroupbyGeolocationGranularity = function (type, geolocationGranularity) {
+      var updated = {
+        vertical_axis_geolocation_granularity: geolocationGranularity
+      };
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, updated));
+    };
+    _this.updatedSummaryType = function (summaryType, summaryColumnKey, summaryMethod) {
+      var statItem = _this.props.statItem;
+      var updated = {
+        horizontal_axis_summary_type: summaryType,
+        horizontal_axis_column_key: summaryColumnKey,
+        horizontal_axis_summary_method: summaryMethod
+      };
+      _this.props.updateStatItem(Object.assign({}, statItem, updated));
+    };
+    _this.updateSummaryColumn = function (summaryColumnKey) {
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, {
+        horizontal_axis_column_key: summaryColumnKey
+      }));
+    };
+    _this.updateSummaryMethod = function (summaryMethod) {
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, {
+        horizontal_axis_summary_method: summaryMethod
+      }));
+    };
+    return _this;
+  }
+  _createClass(BarSettings, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        getTables = _this$props.getTables,
+        getViews = _this$props.getViews,
+        eventBus = _this$props.eventBus,
+        statItem = _this$props.statItem,
+        labelColorConfigs = _this$props.labelColorConfigs,
+        selectedTable = _this$props.selectedTable,
+        generalColumnsOptions = _this$props.generalColumnsOptions,
+        numericColumnsOptions = _this$props.numericColumnsOptions,
+        dateGranularityOptions = _this$props.dateGranularityOptions,
+        geolocationGranularityOptions = _this$props.geolocationGranularityOptions,
+        renderIncludeEmpty = _this$props.renderIncludeEmpty,
+        settingType = _this$props.settingType;
+      var _ref = statItem || {},
+        selectedTableId = _ref.table_id,
+        selectedViewId = _ref.view_id,
+        vertical_axis_column_key = _ref.vertical_axis_column_key,
+        vertical_axis_date_granularity = _ref.vertical_axis_date_granularity,
+        vertical_axis_geolocation_granularity = _ref.vertical_axis_geolocation_granularity,
+        horizontal_axis_summary_type = _ref.horizontal_axis_summary_type,
+        horizontal_axis_column_key = _ref.horizontal_axis_column_key,
+        horizontal_axis_summary_method = _ref.horizontal_axis_summary_method;
+      if (settingType === 'style') {
+        return /*#__PURE__*/React.createElement(HorizontalBarChartStyle, {
+          statItem: statItem,
+          labelColorConfigs: labelColorConfigs,
+          eventBus: eventBus,
+          getTableById: this.props.getTableById,
+          updateStatItem: this.props.updateStatItem
+        });
+      }
+      return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(BaseSettings, {
+        statItem: statItem,
+        selectedTableId: selectedTableId,
+        selectedViewId: selectedViewId,
+        getTables: getTables,
+        getViews: getViews,
+        getTableById: this.props.getTableById,
+        updateStatItem: this.props.updateStatItem
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "statistic-chart-parameter-divider"
+      }), /*#__PURE__*/React.createElement(GroupbySettings, {
+        selectedTable: selectedTable,
+        columnsOptions: generalColumnsOptions,
+        dateGranularityOptions: dateGranularityOptions,
+        geolocationGranularityOptions: geolocationGranularityOptions,
+        label: intl.get('Vertical_axis'),
+        groupbyColumnKey: vertical_axis_column_key,
+        groupbyDateGranularity: vertical_axis_date_granularity,
+        groupbyGeolocationGranularity: vertical_axis_geolocation_granularity,
+        getSelectedColumnOption: this.props.getSelectedColumnOption,
+        onSelectGroupbyColumn: this.onSelectGroupbyColumn.bind(this, GROUPBY_TYPE.ROW),
+        onSelectGroupbyDateGranularity: this.onSelectGroupbyDateGranularity.bind(this, GROUPBY_TYPE.ROW),
+        onSelectGroupbyGeolocationGranularity: this.onSelectGroupbyGeolocationGranularity.bind(this, GROUPBY_TYPE.ROW),
+        renderIncludeEmpty: renderIncludeEmpty
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "statistic-chart-parameter-divider"
+      }), /*#__PURE__*/React.createElement(SummarySettings, {
+        statItem: statItem,
+        label: intl.get('Horizontal_axis'),
+        numericColumnsOptions: numericColumnsOptions,
+        summaryType: horizontal_axis_summary_type,
+        summaryColumnKey: horizontal_axis_column_key,
+        summaryMethod: horizontal_axis_summary_method,
+        getSelectedColumnOption: this.props.getSelectedColumnOption,
+        onChangeSummaryType: this.updatedSummaryType,
+        onSelectNumericColumn: this.updateSummaryColumn,
+        onSelectSummaryMethod: this.updateSummaryMethod
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "statistic-chart-parameter-divider"
+      }), /*#__PURE__*/React.createElement(DataSort, {
+        statItem: statItem,
+        updateStatItem: this.props.updateStatItem
+      }));
+    }
+  }]);
+  return BarSettings;
+}(Component);
+export default BarSettings;

package/es/stat-editor/stat-settings/basic-chart-settings/horizontal-group-chart-settings.js

@@ -0,0 +1,153 @@
+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, Fragment } from 'react';
+import intl from 'react-intl-universal';
+import BaseSettings from '../public-setting/base-settings';
+import HorizontalBarChartStyle from './style-setting/horizontal-bar-chart-style';
+import GroupbySettings from './groupby-settings';
+import HorizontalAxisGroupSettings from './horizontal-axis-group-settings';
+import DataSort from '../public-setting/data-sort-setting';
+import { GROUPBY_TYPE, STAT_TYPE } from '../../../constants';
+var HorizontalGroupBarChartSettings = /*#__PURE__*/function (_Component) {
+  _inherits(HorizontalGroupBarChartSettings, _Component);
+  var _super = _createSuper(HorizontalGroupBarChartSettings);
+  function HorizontalGroupBarChartSettings() {
+    var _this;
+    _classCallCheck(this, HorizontalGroupBarChartSettings);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _this.onSelectGroupbyColumn = function (type, groupbyColumnKey, groupbyDateGranularity, groupbyGeolocationGranularity) {
+      var updated = {
+        vertical_axis_column_key: groupbyColumnKey,
+        vertical_axis_date_granularity: groupbyDateGranularity,
+        vertical_axis_geolocation_granularity: groupbyGeolocationGranularity
+      };
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, updated));
+    };
+    _this.onSelectGroupbyDateGranularity = function (type, dateGranularity) {
+      var updated = {
+        vertical_axis_date_granularity: dateGranularity
+      };
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, updated));
+    };
+    _this.onSelectGroupbyGeolocationGranularity = function (type, geolocationGranularity) {
+      var updated = {
+        vertical_axis_geolocation_granularity: geolocationGranularity
+      };
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, updated));
+    };
+    _this.updatedSummaryType = function (summaryType, summaryColumnKey, summaryMethod) {
+      var statItem = _this.props.statItem;
+      var updated = {
+        horizontal_axis_summary_type: summaryType,
+        horizontal_axis_column_key: summaryColumnKey,
+        horizontal_axis_summary_method: summaryMethod
+      };
+      _this.props.updateStatItem(Object.assign({}, statItem, updated));
+    };
+    _this.updateSummaryColumn = function (summaryColumnKey) {
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, {
+        horizontal_axis_column_key: summaryColumnKey
+      }));
+    };
+    _this.updateSummaryMethod = function (summaryMethod) {
+      _this.props.updateStatItem(Object.assign({}, _this.props.statItem, {
+        horizontal_axis_summary_method: summaryMethod
+      }));
+    };
+    return _this;
+  }
+  _createClass(HorizontalGroupBarChartSettings, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        getTables = _this$props.getTables,
+        getViews = _this$props.getViews,
+        eventBus = _this$props.eventBus,
+        statItem = _this$props.statItem,
+        labelColorConfigs = _this$props.labelColorConfigs,
+        selectedTable = _this$props.selectedTable,
+        generalColumnsOptions = _this$props.generalColumnsOptions,
+        numericColumnsOptions = _this$props.numericColumnsOptions,
+        dateGranularityOptions = _this$props.dateGranularityOptions,
+        geolocationGranularityOptions = _this$props.geolocationGranularityOptions,
+        renderIncludeEmpty = _this$props.renderIncludeEmpty,
+        settingType = _this$props.settingType,
+        columnGroupbyColumnsOptions = _this$props.columnGroupbyColumnsOptions;
+      var _ref = statItem || {},
+        selectedTableId = _ref.table_id,
+        selectedViewId = _ref.view_id,
+        vertical_axis_column_key = _ref.vertical_axis_column_key,
+        vertical_axis_date_granularity = _ref.vertical_axis_date_granularity,
+        vertical_axis_geolocation_granularity = _ref.vertical_axis_geolocation_granularity,
+        horizontal_axis_summary_type = _ref.horizontal_axis_summary_type,
+        horizontal_axis_column_key = _ref.horizontal_axis_column_key,
+        horizontal_axis_summary_method = _ref.horizontal_axis_summary_method;
+      if (settingType === 'style') {
+        return /*#__PURE__*/React.createElement(HorizontalBarChartStyle, {
+          statItem: statItem,
+          labelColorConfigs: labelColorConfigs,
+          eventBus: eventBus,
+          getTableById: this.props.getTableById,
+          updateStatItem: this.props.updateStatItem
+        });
+      }
+      return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(BaseSettings, {
+        statItem: statItem,
+        selectedTableId: selectedTableId,
+        selectedViewId: selectedViewId,
+        getTables: getTables,
+        getViews: getViews,
+        getTableById: this.props.getTableById,
+        updateStatItem: this.props.updateStatItem
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "statistic-chart-parameter-divider"
+      }), /*#__PURE__*/React.createElement(GroupbySettings, {
+        selectedTable: selectedTable,
+        columnsOptions: generalColumnsOptions,
+        dateGranularityOptions: dateGranularityOptions,
+        geolocationGranularityOptions: geolocationGranularityOptions,
+        label: intl.get('Vertical_axis'),
+        groupbyColumnKey: vertical_axis_column_key,
+        groupbyDateGranularity: vertical_axis_date_granularity,
+        groupbyGeolocationGranularity: vertical_axis_geolocation_granularity,
+        getSelectedColumnOption: this.props.getSelectedColumnOption,
+        onSelectGroupbyColumn: this.onSelectGroupbyColumn.bind(this, GROUPBY_TYPE.ROW),
+        onSelectGroupbyDateGranularity: this.onSelectGroupbyDateGranularity.bind(this, GROUPBY_TYPE.ROW),
+        onSelectGroupbyGeolocationGranularity: this.onSelectGroupbyGeolocationGranularity.bind(this, GROUPBY_TYPE.ROW),
+        renderIncludeEmpty: renderIncludeEmpty
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "statistic-chart-parameter-divider"
+      }), /*#__PURE__*/React.createElement(HorizontalAxisGroupSettings, {
+        label: intl.get('Horizontal_axis'),
+        statItem: statItem,
+        selectedTable: selectedTable,
+        summaryType: horizontal_axis_summary_type,
+        summaryColumnKey: horizontal_axis_column_key,
+        summaryMethod: horizontal_axis_summary_method,
+        columnGroupbyColumnsOptions: columnGroupbyColumnsOptions,
+        dateGranularityOptions: dateGranularityOptions,
+        geolocationGranularityOptions: geolocationGranularityOptions,
+        numericColumnsOptions: numericColumnsOptions,
+        getSelectedColumnOption: this.props.getSelectedColumnOption,
+        onChangeColumnGroupbyType: this.updateColumnGroupbys,
+        onSelectGroupbyColumn: this.onSelectGroupbyColumn.bind(this, GROUPBY_TYPE.COLUMN),
+        onSelectGroupbyDateGranularity: this.onSelectGroupbyDateGranularity.bind(this, GROUPBY_TYPE.COLUMN),
+        onSelectGroupbyGeolocationGranularity: this.onSelectGroupbyGeolocationGranularity.bind(this, GROUPBY_TYPE.COLUMN),
+        updatedColumnGroupbyNumericColumns: this.updatedColumnGroupbyNumericColumns,
+        updateStatItem: this.props.updateStatItem
+      }), statItem.type == STAT_TYPE.STACKED_HORIZONTAL_BAR && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+        className: "statistic-chart-parameter-divider"
+      }), /*#__PURE__*/React.createElement(DataSort, {
+        statItem: statItem,
+        updateStatItem: this.props.updateStatItem
+      })));
+    }
+  }]);
+  return HorizontalGroupBarChartSettings;
+}(Component);
+export default HorizontalGroupBarChartSettings;