@seafile/sdoc-editor 0.3.24 → 0.3.26-1

package/dist/basic-sdk/extension/plugins/chart/chart-components/common-settings/groupby-numeric-item.js

@@ -0,0 +1,108 @@
+import React, { Component } from 'react';
+import { withTranslation } from 'react-i18next';
+import ColumnSetting from './column-setting';
+import SummaryMethodSetting from './summary-method-setting';
+class GroupbyNumericItem extends Component {
+  constructor(props) {
+    super(props);
+    this.getSummaryColumn = columnKey => {
+      const {
+        columns
+      } = this.props;
+      return columns.find(item => item.key === columnKey);
+    };
+    this.onToggleExpand = () => {
+      this.setState({
+        isExpand: !this.state.isExpand
+      });
+    };
+    this.onSelectedColumnChanged = option => {
+      const column = option.value;
+      const {
+        groupbyNumericItem,
+        index
+      } = this.props;
+      const {
+        column_key
+      } = groupbyNumericItem;
+      if (column.key === column_key) return;
+      const setting = {
+        column_key: column.key
+      };
+      this.props.updateGroupBySetting(setting, index);
+    };
+    this.onDeleteNumericColumnItem = () => {
+      const {
+        index
+      } = this.props;
+      this.props.onDeleteNumericItem(index);
+    };
+    this.updateSetting = setting => {
+      const {
+        index
+      } = this.props;
+      this.props.updateGroupBySetting(setting, index);
+    };
+    this.state = {
+      isExpand: true
+    };
+  }
+  render() {
+    const {
+      index,
+      groupbyNumericItem
+    } = this.props;
+    const {
+      isExpand
+    } = this.state;
+    const itemIcon = "dtable-font dtable-icon-".concat(isExpand ? 'drop-down' : 'right-slide', " expand-icon");
+    const itemLabel = this.props.t('Numeric_column') + (index + 1);
+    const deleteIcon = 'dtable-font dtable-icon-fork-number delete-icon';
+    const summaryContentClass = "".concat(isExpand ? 'expanded' : 'collapsed', "-numeric-summary-content");
+    const {
+      column_key: summaryColumnKey,
+      summary_method: summaryMethod
+    } = groupbyNumericItem;
+    const summaryColumn = this.getSummaryColumn(summaryColumnKey);
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        paddingBottom: isExpand ? '14px' : '7px'
+      },
+      className: "numeric-summary-item"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "summary-item-info"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "item-title"
+    }, /*#__PURE__*/React.createElement("i", {
+      className: itemIcon,
+      onClick: this.onToggleExpand
+    }), /*#__PURE__*/React.createElement("label", {
+      className: "title"
+    }, itemLabel)), /*#__PURE__*/React.createElement("span", {
+      className: "item-control"
+    }, index !== 0 && /*#__PURE__*/React.createElement("i", {
+      className: deleteIcon,
+      onClick: this.onDeleteNumericColumnItem
+    }))), /*#__PURE__*/React.createElement("div", {
+      className: summaryContentClass
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "summary-filed-setting__column mt-1"
+    }, /*#__PURE__*/React.createElement(ColumnSetting, {
+      columns: this.props.columns,
+      activeColumnKey: summaryColumnKey,
+      specifiedColumnType: 'number',
+      onSelectedColumnChanged: this.onSelectedColumnChanged,
+      noOptionsMessage: () => {
+        return /*#__PURE__*/React.createElement("span", null, this.props.t('No_options'));
+      }
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "summary-filed-setting__summary_method mt-1"
+    }, /*#__PURE__*/React.createElement(SummaryMethodSetting, {
+      summaryColumn: summaryColumn,
+      settingKey: 'summary_method',
+      settingValue: summaryMethod,
+      updateSetting: this.updateSetting
+    }))));
+  }
+}
+export default withTranslation('sdoc-editor')(GroupbyNumericItem);

package/dist/basic-sdk/extension/plugins/chart/chart-components/common-settings/groupby-numeric-items.js

@@ -0,0 +1,87 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import React, { Component } from 'react';
+import { withTranslation } from 'react-i18next';
+import GroupbyNumericItem from './groupby-numeric-item';
+import DtableUtils from '../../chart-utils/common-utils/dtable-utils';
+const SETTING_KEY = 'column_groupby_numeric_columns';
+class GroupbyNumericItems extends Component {
+  constructor() {
+    super(...arguments);
+    this.getNumericColumns = () => {
+      const {
+        columns
+      } = this.props;
+      if (!columns || columns.length === 0) return [];
+      return columns.filter(column => {
+        return DtableUtils.isNumericColumn(column);
+      });
+    };
+    this.onAddNumericColumn = () => {
+      const item = {
+        column_key: '',
+        summary_method: ''
+      };
+      const {
+        groupbyNumericItems
+      } = this.props;
+      let newItems = [];
+      if (groupbyNumericItems && Array.isArray(groupbyNumericItems)) {
+        newItems = groupbyNumericItems.concat(item);
+      } else {
+        newItems = [item];
+      }
+      this.props.updateSetting({
+        [SETTING_KEY]: newItems
+      });
+    };
+    this.onDeleteNumericItem = index => {
+      const {
+        groupbyNumericItems
+      } = this.props;
+      const newItems = groupbyNumericItems.filter((item, idx) => idx !== index - 1);
+      this.props.updateSetting({
+        [SETTING_KEY]: newItems
+      });
+    };
+    this.updateGroupBySetting = (setting, index) => {
+      const {
+        groupbyNumericItems
+      } = this.props;
+      const newItems = groupbyNumericItems.map((item, idx) => {
+        if (idx === index - 1) {
+          item = _objectSpread(_objectSpread({}, item), setting);
+        }
+        return item;
+      });
+      this.props.updateSetting({
+        [SETTING_KEY]: newItems
+      });
+    };
+  }
+  render() {
+    const {
+      groupbyNumericItems = []
+    } = this.props;
+    const numericColumns = this.getNumericColumns();
+    return /*#__PURE__*/React.createElement("div", {
+      className: "numeric-summary-item-wrapper"
+    }, groupbyNumericItems && Array.isArray(groupbyNumericItems) && groupbyNumericItems.length > 0 && groupbyNumericItems.map((item, index) => {
+      return /*#__PURE__*/React.createElement(GroupbyNumericItem, {
+        key: index,
+        index: index + 1,
+        columns: this.props.columns,
+        groupbyNumericItem: item,
+        onDeleteNumericItem: this.onDeleteNumericItem,
+        updateGroupBySetting: this.updateGroupBySetting
+      });
+    }), numericColumns.length > 0 && /*#__PURE__*/React.createElement("div", {
+      className: "operation-control",
+      onClick: this.onAddNumericColumn
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "dtable-font dtable-icon-add-table add-icon"
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "add-description"
+    }, this.props.t('Add_new_numeric_column'))));
+  }
+}
+export default withTranslation('sdoc-editor')(GroupbyNumericItems);

package/dist/basic-sdk/extension/plugins/chart/chart-components/common-settings/include-empty-setting.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { withTranslation } from 'react-i18next';
+import ToggleSetting from '../toggle-setting';
+class IncludeEmptySetting extends React.Component {
+  constructor() {
+    super(...arguments);
+    this.onToggleIncludeEmpty = () => {
+      const {
+        settingValue,
+        settingKey
+      } = this.props;
+      const setting = {
+        [settingKey]: !settingValue
+      };
+      this.props.updateSetting(setting);
+    };
+  }
+  render() {
+    const {
+      settingValue
+    } = this.props;
+    return /*#__PURE__*/React.createElement("div", {
+      className: "mt-1"
+    }, /*#__PURE__*/React.createElement(ToggleSetting, {
+      label: this.props.t('Including_empty_cell'),
+      isChecked: settingValue,
+      handleToggleChange: this.onToggleIncludeEmpty
+    }));
+  }
+}
+IncludeEmptySetting.defaultProps = {
+  settingKey: 'x_axis_include_empty',
+  settingValue: false
+};
+export default withTranslation('sdoc-editor')(IncludeEmptySetting);

package/dist/basic-sdk/extension/plugins/chart/chart-components/common-settings/summary-field-setting.js

@@ -0,0 +1,64 @@
+import React from 'react';
+import { withTranslation } from 'react-i18next';
+import ColumnSetting from './column-setting';
+import SummaryMethodSetting from './summary-method-setting';
+class SummaryFieldSetting extends React.Component {
+  constructor() {
+    super(...arguments);
+    this.getSummaryColumn = () => {
+      const {
+        summaryColumnKey,
+        columns
+      } = this.props;
+      return columns.find(column => column.key === summaryColumnKey);
+    };
+    this.onSelectedColumnChanged = option => {
+      const {
+        key: columnKey
+      } = option.value;
+      const {
+        summaryColumnSettingKey
+      } = this.props;
+      const newSetting = {
+        [summaryColumnSettingKey]: columnKey
+      };
+      this.props.updateSetting(newSetting);
+    };
+    this.updateSetting = setting => {
+      this.props.updateSetting(setting);
+    };
+  }
+  render() {
+    const {
+      summaryColumnKey,
+      summaryMethod,
+      summaryMethodSettingKey,
+      specifiedColumnType
+    } = this.props;
+    const summaryColumn = this.getSummaryColumn();
+    return /*#__PURE__*/React.createElement("div", {
+      className: "summary-filed-setting"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "summary-filed-setting__column mt-14"
+    }, /*#__PURE__*/React.createElement("label", null, this.props.t('Numeric_column')), /*#__PURE__*/React.createElement(ColumnSetting, {
+      columns: this.props.columns,
+      activeColumnKey: summaryColumnKey,
+      specifiedColumnType: specifiedColumnType,
+      onSelectedColumnChanged: this.onSelectedColumnChanged,
+      noOptionsMessage: () => {
+        return /*#__PURE__*/React.createElement("span", null, this.props.t('No_options'));
+      }
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "summary-filed-setting__summary_method mt-14"
+    }, /*#__PURE__*/React.createElement(SummaryMethodSetting, {
+      summaryColumn: summaryColumn,
+      settingKey: summaryMethodSettingKey,
+      settingValue: summaryMethod,
+      updateSetting: this.updateSetting
+    })));
+  }
+}
+SummaryFieldSetting.defaultProps = {
+  specifiedColumnType: 'number'
+};
+export default withTranslation('sdoc-editor')(SummaryFieldSetting);

package/dist/basic-sdk/extension/plugins/chart/chart-components/common-settings/summary-method-setting.js

@@ -0,0 +1,61 @@
+import React, { Component } from 'react';
+import { withTranslation } from 'react-i18next';
+import DTableSelect from './dtable-select-setting';
+import { STATISTICS_COUNT_SHOW } from '../../constants';
+import { DATE_COLUMN_TYPES } from '../../constants/special-column-types';
+import { SUMMARY_METHOD, DATE_COLUMN_SUMMARY_METHOD } from '../../constants/summary-constants';
+class SummaryMethodSetting extends Component {
+  constructor(props) {
+    super(props);
+    this.getSummaryMethodsOptions = () => {
+      return SUMMARY_METHOD.map(method => {
+        return {
+          value: method,
+          label: /*#__PURE__*/React.createElement("span", {
+            className: 'select-module select-module-name'
+          }, this.props.t(STATISTICS_COUNT_SHOW[method]))
+        };
+      });
+    };
+    this.getActiveMethodOption = (method, summaryMethodsOptions) => {
+      return summaryMethodsOptions.find(m => m.value === method) || summaryMethodsOptions[0];
+    };
+    this.onSelectSummaryMethod = summaryMethodOption => {
+      const {
+        settingKey,
+        settingValue: summaryMethod
+      } = this.props;
+      const newSummaryMethod = summaryMethodOption.value;
+      if (newSummaryMethod === summaryMethod) return;
+      const newSetting = {
+        [settingKey]: newSummaryMethod
+      };
+      this.props.updateSetting(newSetting);
+    };
+    this.summaryMethodsOptions = this.getSummaryMethodsOptions();
+  }
+  render() {
+    const {
+      summaryColumn,
+      settingValue: summaryMethod
+    } = this.props;
+    const activeMethodOption = this.getActiveMethodOption(summaryMethod, this.summaryMethodsOptions);
+    let summaryMethodOptions = this.summaryMethodsOptions;
+    if (activeMethodOption && summaryColumn && DATE_COLUMN_TYPES.includes(summaryColumn.type)) {
+      summaryMethodOptions = summaryMethodOptions.filter(option => {
+        return DATE_COLUMN_SUMMARY_METHOD.includes(option.value);
+      });
+    }
+    return /*#__PURE__*/React.createElement("div", {
+      className: "filed-summary_method"
+    }, /*#__PURE__*/React.createElement("label", null, this.props.t('Summary_method')), /*#__PURE__*/React.createElement(DTableSelect, {
+      value: activeMethodOption,
+      onChange: this.onSelectSummaryMethod,
+      options: summaryMethodOptions
+    }));
+  }
+}
+SummaryMethodSetting.defaultProps = {
+  settingKey: 'y_axis_summary_method'
+};
+export default withTranslation('sdoc-editor')(SummaryMethodSetting);

package/dist/basic-sdk/extension/plugins/chart/chart-components/common-settings/summary-type-setting.js

@@ -0,0 +1,74 @@
+import React from 'react';
+import { withTranslation } from 'react-i18next';
+import DTableSelect from './dtable-select-setting';
+import { STATISTICS_COUNT_SHOW } from '../../constants';
+import { GROUP_TYPES } from '../../constants/summary-constants';
+const GROUP_TYPES_CONFIG = [{
+  type: GROUP_TYPES.COUNT,
+  name: 'count',
+  explanation: 'Count_the_number_of_records_in_each_group'
+}, {
+  type: GROUP_TYPES.SINGLE_NUMERIC_COLUMN,
+  name: 'advanced',
+  explanation: 'Compute_the_sum_maximum_or_minimum_value_of_records_in_each_group_by_a_field'
+}, {
+  type: GROUP_TYPES.MULTIPLE_NUMERIC_COLUMN,
+  name: 'Summarize_multiple_fields',
+  explanation: 'Compute_the_sum_maximum_or_minimum_value_of_records_in_each_group_by_multiple_fields'
+}];
+class SummaryTypeSettings extends React.Component {
+  constructor(props) {
+    super(props);
+    this.getGroupTypeOptions = () => {
+      let groupTypes = GROUP_TYPES_CONFIG;
+      const {
+        supportSummaryTypes
+      } = this.props;
+      if (supportSummaryTypes && supportSummaryTypes.length > 0) {
+        groupTypes = GROUP_TYPES_CONFIG.filter(item => supportSummaryTypes.includes(item.type));
+      }
+      return groupTypes.map(item => {
+        return {
+          value: item.type,
+          label: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+            className: 'select-module select-module-name'
+          }, this.props.t(STATISTICS_COUNT_SHOW[item.name] || item.name)), /*#__PURE__*/React.createElement("div", {
+            className: "summary-type-explanation"
+          }, this.props.t(item.explanation)))
+        };
+      });
+    };
+    this.getActiveGroupTypeOption = () => {
+      const {
+        settingValue
+      } = this.props;
+      if (!settingValue) return null;
+      return this.groupTypeOptions.find(item => item.value === settingValue);
+    };
+    this.onChangeGroupType = option => {
+      const {
+        settingKey,
+        settingValue
+      } = this.props;
+      if (settingValue === option.value) return;
+      const newSetting = {
+        [settingKey]: option.value
+      };
+      this.props.updateSetting(newSetting);
+    };
+    this.groupTypeOptions = this.getGroupTypeOptions();
+  }
+  render() {
+    const activeValue = this.getActiveGroupTypeOption();
+    return /*#__PURE__*/React.createElement(DTableSelect, {
+      classNamePrefix: "chart-summary-types",
+      value: activeValue,
+      options: this.groupTypeOptions,
+      onChange: this.onChangeGroupType
+    });
+  }
+}
+SummaryTypeSettings.defaultProps = {
+  settingKey: 'y_axis_summary_type'
+};
+export default withTranslation('sdoc-editor')(SummaryTypeSettings);

package/dist/basic-sdk/extension/plugins/chart/chart-components/common-settings/x-axis-group-setting.js

@@ -0,0 +1,108 @@
+import React, { Component } from 'react';
+import IncludeEmptySetting from './include-empty-setting';
+import ColumnSetting from './column-setting';
+import DateGranularities from './date-granularities';
+import GeolocationGranlarities from './geolocation-granularities';
+import { DATE_COLUMN_TYPES, GEOLOCATION_COLUMN_OPTIONS } from '../../constants/special-column-types';
+import { DEFAULT_DATE_GRANULARITY } from '../../constants/date-constants';
+import { DEFAULT_GEOLOCATION_GRANULARITY_MAP } from '../../constants/geolocation-constants';
+import { GROUP_TYPES } from '../../constants/summary-constants';
+import { STAT_TYPE } from '../../constants';
+class XAxisGroupSettings extends Component {
+  constructor() {
+    super(...arguments);
+    this.getDefaultGeolocationGranularity = groupbyColumnKey => {
+      const groupbyColumn = this.getGroupbyColumn(groupbyColumnKey);
+      const {
+        geo_format
+      } = groupbyColumn.data || {};
+      return DEFAULT_GEOLOCATION_GRANULARITY_MAP[geo_format];
+    };
+    this.onSelectedColumnChanged = columnOption => {
+      const {
+        key,
+        type
+      } = columnOption.value;
+      const {
+        statItem
+      } = this.props;
+      let {
+        x_axis_column_key: groupbyColumnKey,
+        x_axis_date_granularity: groupbyDateGranularity,
+        x_axis_geolocation_granularity: groupbyGeolocationGranularity,
+        y_axis_summary_type: summaryType
+      } = statItem;
+      if (key !== 'Groupby_null') {
+        groupbyColumnKey = key;
+        if (type === 'date') {
+          groupbyDateGranularity = DEFAULT_DATE_GRANULARITY;
+        } else if (type === 'geolocation') {
+          groupbyGeolocationGranularity = this.getDefaultGeolocationGranularity(groupbyColumnKey);
+        }
+      } else {
+        groupbyColumnKey = null;
+        groupbyDateGranularity = null;
+        groupbyGeolocationGranularity = null;
+      }
+      summaryType = summaryType ? summaryType : GROUP_TYPES.COUNT;
+      const setting = {
+        x_axis_column_key: groupbyColumnKey,
+        x_axis_date_granularity: groupbyDateGranularity,
+        x_axis_geolocation_granularity: groupbyGeolocationGranularity,
+        y_axis_summary_type: summaryType
+      };
+      this.props.updateSetting(setting);
+    };
+    this.getGroupbyColumn = groupbyColumnKey => {
+      const {
+        columns
+      } = this.props;
+      if (!columns || columns.length === 0) return null;
+      const groupbyColumn = columns.find(column => column.key === groupbyColumnKey);
+      return groupbyColumn;
+    };
+    this.updateSetting = settingItem => {
+      this.props.updateSetting(settingItem);
+    };
+  }
+  render() {
+    const {
+      statItem,
+      columns,
+      renderIncludeEmpty
+    } = this.props;
+    const {
+      x_axis_column_key: groupbyColumnKey,
+      x_axis_date_granularity,
+      x_axis_geolocation_granularity,
+      x_axis_include_empty,
+      type
+    } = statItem;
+    const groupbyColumn = this.getGroupbyColumn(groupbyColumnKey);
+    const {
+      type: groupbyColumnType
+    } = groupbyColumn || {};
+    const isDateType = [STAT_TYPE.COMPARE_BAR].includes(type) ? 'date' : false;
+    return /*#__PURE__*/React.createElement("div", {
+      className: "sdoc-chart-setting-item"
+    }, /*#__PURE__*/React.createElement("label", null, this.props.label), /*#__PURE__*/React.createElement(ColumnSetting, {
+      columns: columns,
+      activeColumnKey: groupbyColumnKey,
+      onSelectedColumnChanged: this.onSelectedColumnChanged,
+      specifiedColumnType: isDateType || ''
+    }), DATE_COLUMN_TYPES.includes(groupbyColumnType) && /*#__PURE__*/React.createElement(DateGranularities, {
+      settingKey: 'x_axis_date_granularity',
+      settingValue: x_axis_date_granularity,
+      updateSetting: this.updateSetting
+    }), GEOLOCATION_COLUMN_OPTIONS.includes(groupbyColumnType) && /*#__PURE__*/React.createElement(GeolocationGranlarities, {
+      settingKey: 'x_axis_geolocation_granularity',
+      settingValue: x_axis_geolocation_granularity,
+      updateSetting: this.updateSetting
+    }), renderIncludeEmpty && /*#__PURE__*/React.createElement(IncludeEmptySetting, {
+      settingKey: 'x_axis_include_empty',
+      settingValue: x_axis_include_empty,
+      updateSetting: this.updateSetting
+    }));
+  }
+}
+export default XAxisGroupSettings;