dtable-statistic 4.4.24-alpha.9 → 5.0.0

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

@@ -0,0 +1,142 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
+var _baseSettings = _interopRequireDefault(require("../public-setting/base-settings"));
+var _horizontalBarChartStyle = _interopRequireDefault(require("./style-setting/horizontal-bar-chart-style"));
+var _groupbySettings = _interopRequireDefault(require("./groupby-settings"));
+var _summarySettings = _interopRequireDefault(require("./summary-settings"));
+var _dataSortSetting = _interopRequireDefault(require("../public-setting/data-sort-setting"));
+var _constants = require("../../../constants");
+class BarSettings extends _react.Component {
+  constructor() {
+    super(...arguments);
+    this.onSelectGroupbyColumn = (type, groupbyColumnKey, groupbyDateGranularity, groupbyGeolocationGranularity) => {
+      let 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 = (type, dateGranularity) => {
+      let updated = {
+        vertical_axis_date_granularity: dateGranularity
+      };
+      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
+    };
+    this.onSelectGroupbyGeolocationGranularity = (type, geolocationGranularity) => {
+      let updated = {
+        vertical_axis_geolocation_granularity: geolocationGranularity
+      };
+      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
+    };
+    this.updatedSummaryType = (summaryType, summaryColumnKey, summaryMethod) => {
+      let {
+        statItem
+      } = this.props;
+      let 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 = summaryColumnKey => {
+      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
+        horizontal_axis_column_key: summaryColumnKey
+      }));
+    };
+    this.updateSummaryMethod = summaryMethod => {
+      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
+        horizontal_axis_summary_method: summaryMethod
+      }));
+    };
+  }
+  render() {
+    let {
+      getTables,
+      getViews,
+      eventBus,
+      statItem,
+      labelColorConfigs,
+      selectedTable,
+      generalColumnsOptions,
+      numericColumnsOptions,
+      dateGranularityOptions,
+      geolocationGranularityOptions,
+      renderIncludeEmpty,
+      settingType
+    } = this.props;
+    let {
+      table_id: selectedTableId,
+      view_id: selectedViewId,
+      vertical_axis_column_key,
+      vertical_axis_date_granularity,
+      vertical_axis_geolocation_granularity,
+      horizontal_axis_summary_type,
+      horizontal_axis_column_key,
+      horizontal_axis_summary_method
+    } = statItem || {};
+    if (settingType === 'style') {
+      return /*#__PURE__*/_react.default.createElement(_horizontalBarChartStyle.default, {
+        statItem: statItem,
+        labelColorConfigs: labelColorConfigs,
+        eventBus: eventBus,
+        getTableById: this.props.getTableById,
+        updateStatItem: this.props.updateStatItem
+      });
+    }
+    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_baseSettings.default, {
+      statItem: statItem,
+      selectedTableId: selectedTableId,
+      selectedViewId: selectedViewId,
+      getTables: getTables,
+      getViews: getViews,
+      getTableById: this.props.getTableById,
+      getConvertedChart: this.props.getConvertedChart,
+      updateStatItem: this.props.updateStatItem
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: "statistic-chart-parameter-divider"
+    }), /*#__PURE__*/_react.default.createElement(_groupbySettings.default, {
+      selectedTable: selectedTable,
+      columnsOptions: generalColumnsOptions,
+      dateGranularityOptions: dateGranularityOptions,
+      geolocationGranularityOptions: geolocationGranularityOptions,
+      label: _reactIntlUniversal.default.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, _constants.GROUPBY_TYPE.ROW),
+      onSelectGroupbyDateGranularity: this.onSelectGroupbyDateGranularity.bind(this, _constants.GROUPBY_TYPE.ROW),
+      onSelectGroupbyGeolocationGranularity: this.onSelectGroupbyGeolocationGranularity.bind(this, _constants.GROUPBY_TYPE.ROW),
+      renderIncludeEmpty: renderIncludeEmpty
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: "statistic-chart-parameter-divider"
+    }), /*#__PURE__*/_react.default.createElement(_summarySettings.default, {
+      statItem: statItem,
+      label: _reactIntlUniversal.default.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.default.createElement("div", {
+      className: "statistic-chart-parameter-divider"
+    }), /*#__PURE__*/_react.default.createElement(_dataSortSetting.default, {
+      statItem: statItem,
+      updateStatItem: this.props.updateStatItem
+    }));
+  }
+}
+var _default = exports.default = BarSettings;

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

@@ -0,0 +1,150 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
+var _baseSettings = _interopRequireDefault(require("../public-setting/base-settings"));
+var _horizontalBarChartStyle = _interopRequireDefault(require("./style-setting/horizontal-bar-chart-style"));
+var _groupbySettings = _interopRequireDefault(require("./groupby-settings"));
+var _horizontalAxisGroupSettings = _interopRequireDefault(require("./horizontal-axis-group-settings"));
+var _dataSortSetting = _interopRequireDefault(require("../public-setting/data-sort-setting"));
+var _constants = require("../../../constants");
+class HorizontalGroupBarChartSettings extends _react.Component {
+  constructor() {
+    super(...arguments);
+    this.onSelectGroupbyColumn = (type, groupbyColumnKey, groupbyDateGranularity, groupbyGeolocationGranularity) => {
+      let 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 = (type, dateGranularity) => {
+      let updated = {
+        vertical_axis_date_granularity: dateGranularity
+      };
+      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
+    };
+    this.onSelectGroupbyGeolocationGranularity = (type, geolocationGranularity) => {
+      let updated = {
+        vertical_axis_geolocation_granularity: geolocationGranularity
+      };
+      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
+    };
+    this.updatedSummaryType = (summaryType, summaryColumnKey, summaryMethod) => {
+      let {
+        statItem
+      } = this.props;
+      let 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 = summaryColumnKey => {
+      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
+        horizontal_axis_column_key: summaryColumnKey
+      }));
+    };
+    this.updateSummaryMethod = summaryMethod => {
+      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
+        horizontal_axis_summary_method: summaryMethod
+      }));
+    };
+  }
+  render() {
+    let {
+      getTables,
+      getViews,
+      eventBus,
+      statItem,
+      labelColorConfigs,
+      selectedTable,
+      generalColumnsOptions,
+      numericColumnsOptions,
+      dateGranularityOptions,
+      geolocationGranularityOptions,
+      renderIncludeEmpty,
+      settingType,
+      columnGroupbyColumnsOptions
+    } = this.props;
+    let {
+      table_id: selectedTableId,
+      view_id: selectedViewId,
+      vertical_axis_column_key,
+      vertical_axis_date_granularity,
+      vertical_axis_geolocation_granularity,
+      horizontal_axis_summary_type,
+      horizontal_axis_column_key,
+      horizontal_axis_summary_method
+    } = statItem || {};
+    if (settingType === 'style') {
+      return /*#__PURE__*/_react.default.createElement(_horizontalBarChartStyle.default, {
+        statItem: statItem,
+        labelColorConfigs: labelColorConfigs,
+        eventBus: eventBus,
+        getTableById: this.props.getTableById,
+        updateStatItem: this.props.updateStatItem
+      });
+    }
+    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_baseSettings.default, {
+      statItem: statItem,
+      selectedTableId: selectedTableId,
+      selectedViewId: selectedViewId,
+      getTables: getTables,
+      getViews: getViews,
+      getTableById: this.props.getTableById,
+      getConvertedChart: this.props.getConvertedChart,
+      updateStatItem: this.props.updateStatItem
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: "statistic-chart-parameter-divider"
+    }), /*#__PURE__*/_react.default.createElement(_groupbySettings.default, {
+      selectedTable: selectedTable,
+      columnsOptions: generalColumnsOptions,
+      dateGranularityOptions: dateGranularityOptions,
+      geolocationGranularityOptions: geolocationGranularityOptions,
+      label: _reactIntlUniversal.default.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, _constants.GROUPBY_TYPE.ROW),
+      onSelectGroupbyDateGranularity: this.onSelectGroupbyDateGranularity.bind(this, _constants.GROUPBY_TYPE.ROW),
+      onSelectGroupbyGeolocationGranularity: this.onSelectGroupbyGeolocationGranularity.bind(this, _constants.GROUPBY_TYPE.ROW),
+      renderIncludeEmpty: renderIncludeEmpty
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: "statistic-chart-parameter-divider"
+    }), /*#__PURE__*/_react.default.createElement(_horizontalAxisGroupSettings.default, {
+      label: _reactIntlUniversal.default.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, _constants.GROUPBY_TYPE.COLUMN),
+      onSelectGroupbyDateGranularity: this.onSelectGroupbyDateGranularity.bind(this, _constants.GROUPBY_TYPE.COLUMN),
+      onSelectGroupbyGeolocationGranularity: this.onSelectGroupbyGeolocationGranularity.bind(this, _constants.GROUPBY_TYPE.COLUMN),
+      updatedColumnGroupbyNumericColumns: this.updatedColumnGroupbyNumericColumns,
+      updateStatItem: this.props.updateStatItem
+    }), statItem.type === _constants.STAT_TYPE.STACKED_HORIZONTAL_BAR && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+      className: "statistic-chart-parameter-divider"
+    }), /*#__PURE__*/_react.default.createElement(_dataSortSetting.default, {
+      statItem: statItem,
+      updateStatItem: this.props.updateStatItem
+    })));
+  }
+}
+var _default = exports.default = HorizontalGroupBarChartSettings;