dtable-statistic 4.2.2 → 4.3.0

package/es/components/popover/color-rules/rule-filters/filter.js

@@ -1,27 +1,22 @@
-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 from 'react';
 import intl from 'react-intl-universal';
 import { Select } from '../../../index';
 import NumberInput from './number-input';
 import { COLOR_RULE_FILTER_TYPE_MAP, EMPTY_PREDICATE } from '../../../../constants/color-rules';
-var INPUT_CMP_TYPE_MAP = {
+const INPUT_CMP_TYPE_MAP = {
   NUMBER: 'number'
 };
-var Filter = /*#__PURE__*/function (_React$Component) {
-  _inherits(Filter, _React$Component);
-  var _super = _createSuper(Filter);
-  function Filter(_props) {
-    var _this;
-    _classCallCheck(this, Filter);
-    _this = _super.call(this, _props);
-    _this.initSelectOptions = function (props) {
-      var filter = props.filter;
-      var _this$props$getFilter = _this.props.getFilterConfigByType(filter.filter_type),
-        filterPredicateList = _this$props$getFilter.filterPredicateList;
-      _this.predicateOptions = filterPredicateList ? filterPredicateList.map(function (predicate) {
+class Filter extends React.Component {
+  constructor(_props) {
+    super(_props);
+    this.initSelectOptions = props => {
+      const {
+        filter
+      } = props;
+      const {
+        filterPredicateList
+      } = this.props.getFilterConfigByType(filter.filter_type);
+      this.predicateOptions = filterPredicateList ? filterPredicateList.map(predicate => {
         if (EMPTY_PREDICATE.includes(predicate)) {
           return null;
         }
@@ -33,63 +28,73 @@ var Filter = /*#__PURE__*/function (_React$Component) {
         };
       }).filter(Boolean) : [];
     };
-    _this.onDeleteFilter = function (event) {
+    this.onDeleteFilter = event => {
       event.nativeEvent.stopImmediatePropagation();
-      var index = _this.props.index;
-      _this.props.deleteFilter(index);
+      const {
+        index
+      } = this.props;
+      this.props.deleteFilter(index);
     };
-    _this.onSelectConjunction = function (filterConjunction) {
-      if (filterConjunction === _this.props.filterConjunction) {
+    this.onSelectConjunction = filterConjunction => {
+      if (filterConjunction === this.props.filterConjunction) {
         return;
       }
-      _this.props.modifyConjunction(filterConjunction);
+      this.props.modifyConjunction(filterConjunction);
     };
-    _this.onSelectFilterBy = function (filterType) {
-      var _this$props = _this.props,
-        index = _this$props.index,
-        filter = _this$props.filter;
+    this.onSelectFilterBy = filterType => {
+      const {
+        index,
+        filter
+      } = this.props;
       if (filter.filter_type === filterType) return;
-      var _this$props$getFilter2 = _this.props.getFilterConfigByType(filter.filter_type),
-        filterPredicateList = _this$props$getFilter2.filterPredicateList;
+      const {
+        filterPredicateList
+      } = this.props.getFilterConfigByType(filter.filter_type);
       if (!filterPredicateList) return;
-      var updatedFilter = Object.assign({}, filter, {
+      const updatedFilter = Object.assign({}, filter, {
         filter_type: filterType,
         filter_predicate: filterPredicateList[0]
       });
-      _this.props.updateFilter(index, updatedFilter);
+      this.props.updateFilter(index, updatedFilter);
     };
-    _this.onSelectPredicate = function (predicate) {
-      var _this$props2 = _this.props,
-        index = _this$props2.index,
-        filter = _this$props2.filter;
+    this.onSelectPredicate = predicate => {
+      const {
+        index,
+        filter
+      } = this.props;
       if (filter.filter_predicate === predicate) {
         return;
       }
-      var updatedFilter = Object.assign({}, filter, {
+      const updatedFilter = Object.assign({}, filter, {
         filter_predicate: predicate
       });
-      _this.props.updateFilter(index, updatedFilter);
+      this.props.updateFilter(index, updatedFilter);
     };
-    _this.onNumberFilterTermChanged = function (newFilterTerm) {
-      var _this$props3 = _this.props,
-        index = _this$props3.index,
-        filter = _this$props3.filter;
+    this.onNumberFilterTermChanged = newFilterTerm => {
+      const {
+        index,
+        filter
+      } = this.props;
       if (newFilterTerm === filter.filter_term) return;
-      var newFilter = Object.assign({}, filter, {
+      const newFilter = Object.assign({}, filter, {
         filter_term: newFilterTerm
       });
-      _this.props.updateFilter(index, newFilter);
+      this.props.updateFilter(index, newFilter);
     };
-    _this.getInputComponent = function (type) {
-      var filter = _this.props.filter;
-      var filter_term = filter.filter_term;
+    this.getInputComponent = type => {
+      const {
+        filter
+      } = this.props;
+      const {
+        filter_term
+      } = filter;
       switch (type) {
         case INPUT_CMP_TYPE_MAP.NUMBER:
           {
-            var number = filter_term || filter_term == 0 ? filter_term : '';
+            const number = filter_term || filter_term == 0 ? filter_term : '';
             return /*#__PURE__*/React.createElement(NumberInput, {
               value: number,
-              onChange: _this.onNumberFilterTermChanged
+              onChange: this.onNumberFilterTermChanged
             });
           }
         default:
@@ -98,11 +103,12 @@ var Filter = /*#__PURE__*/function (_React$Component) {
           }
       }
     };
-    _this.renderConjunction = function () {
-      var _this$props4 = _this.props,
-        index = _this$props4.index,
-        filterConjunction = _this$props4.filterConjunction,
-        conjunctionOptions = _this$props4.conjunctionOptions;
+    this.renderConjunction = () => {
+      const {
+        index,
+        filterConjunction,
+        conjunctionOptions
+      } = this.props;
       switch (index) {
         case 0:
           {
@@ -110,13 +116,11 @@ var Filter = /*#__PURE__*/function (_React$Component) {
           }
         case 1:
           {
-            var selectedConjunction = conjunctionOptions.find(function (option) {
-              return option.value === filterConjunction;
-            });
+            const selectedConjunction = conjunctionOptions.find(option => option.value === filterConjunction);
             return /*#__PURE__*/React.createElement(Select, {
               value: selectedConjunction,
               options: conjunctionOptions,
-              onSelectOption: _this.onSelectConjunction
+              onSelectOption: this.onSelectConjunction
             });
           }
         default:
@@ -127,10 +131,14 @@ var Filter = /*#__PURE__*/function (_React$Component) {
           }
       }
     };
-    _this.renderFilterTerm = function () {
-      var filter = _this.props.filter;
-      var filter_type = filter.filter_type,
-        filter_predicate = filter.filter_predicate;
+    this.renderFilterTerm = () => {
+      const {
+        filter
+      } = this.props;
+      const {
+        filter_type,
+        filter_predicate
+      } = filter;
 
       // predicate is empty or not empty
       if (EMPTY_PREDICATE.includes(filter_predicate)) {
@@ -139,7 +147,7 @@ var Filter = /*#__PURE__*/function (_React$Component) {
       switch (filter_type) {
         case COLOR_RULE_FILTER_TYPE_MAP.NUMERIC_VALUE:
           {
-            return _this.getInputComponent(INPUT_CMP_TYPE_MAP.NUMBER);
+            return this.getInputComponent(INPUT_CMP_TYPE_MAP.NUMBER);
           }
         default:
           {
@@ -147,68 +155,60 @@ var Filter = /*#__PURE__*/function (_React$Component) {
           }
       }
     };
-    _this.initSelectOptions(_props);
-    return _this;
+    this.initSelectOptions(_props);
   }
-  _createClass(Filter, [{
-    key: "UNSAFE_componentWillReceiveProps",
-    value: function UNSAFE_componentWillReceiveProps(nextProps) {
-      var filter = this.props.filter;
-      if (nextProps.filter !== filter) {
-        this.initSelectOptions(nextProps);
-      }
-    }
-  }, {
-    key: "shouldComponentUpdate",
-    value: function shouldComponentUpdate(nextProps) {
-      var currentProps = this.props;
-      var shouldUpdated = nextProps.index !== currentProps.index || nextProps.filter !== currentProps.filter || nextProps.filterConjunction !== currentProps.filterConjunction;
-      return shouldUpdated;
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    const {
+      filter
+    } = this.props;
+    if (nextProps.filter !== filter) {
+      this.initSelectOptions(nextProps);
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props5 = this.props,
-        filterTypeOptions = _this$props5.filterTypeOptions,
-        filter = _this$props5.filter;
-      var filter_type = filter.filter_type,
-        filter_predicate = filter.filter_predicate;
-      var selectedFilterType = filterTypeOptions.find(function (option) {
-        return option.value === filter_type;
-      });
-      var selectedPredicate = this.predicateOptions.find(function (option) {
-        return option.value === filter_predicate;
-      });
-      return /*#__PURE__*/React.createElement("div", {
-        className: "filter-item"
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "delete-filter",
-        onClick: this.onDeleteFilter
-      }, /*#__PURE__*/React.createElement("i", {
-        className: "dtable-font dtable-icon-fork-number"
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "condition"
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "filter-conjunction"
-      }, this.renderConjunction()), /*#__PURE__*/React.createElement("div", {
-        className: "filter-container"
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "filter-column"
-      }, /*#__PURE__*/React.createElement(Select, {
-        value: selectedFilterType,
-        options: filterTypeOptions,
-        onSelectOption: this.onSelectFilterBy
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "filter-predicate ml-2"
-      }, /*#__PURE__*/React.createElement(Select, {
-        value: selectedPredicate,
-        options: this.predicateOptions,
-        onSelectOption: this.onSelectPredicate
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "filter-term ml-2"
-      }, this.renderFilterTerm()))));
-    }
-  }]);
-  return Filter;
-}(React.Component);
+  }
+  shouldComponentUpdate(nextProps) {
+    const currentProps = this.props;
+    const shouldUpdated = nextProps.index !== currentProps.index || nextProps.filter !== currentProps.filter || nextProps.filterConjunction !== currentProps.filterConjunction;
+    return shouldUpdated;
+  }
+  render() {
+    const {
+      filterTypeOptions,
+      filter
+    } = this.props;
+    const {
+      filter_type,
+      filter_predicate
+    } = filter;
+    const selectedFilterType = filterTypeOptions.find(option => option.value === filter_type);
+    const selectedPredicate = this.predicateOptions.find(option => option.value === filter_predicate);
+    return /*#__PURE__*/React.createElement("div", {
+      className: "filter-item"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "delete-filter",
+      onClick: this.onDeleteFilter
+    }, /*#__PURE__*/React.createElement("i", {
+      className: "dtable-font dtable-icon-fork-number"
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "condition"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "filter-conjunction"
+    }, this.renderConjunction()), /*#__PURE__*/React.createElement("div", {
+      className: "filter-container"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "filter-column"
+    }, /*#__PURE__*/React.createElement(Select, {
+      value: selectedFilterType,
+      options: filterTypeOptions,
+      onSelectOption: this.onSelectFilterBy
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "filter-predicate ml-2"
+    }, /*#__PURE__*/React.createElement(Select, {
+      value: selectedPredicate,
+      options: this.predicateOptions,
+      onSelectOption: this.onSelectPredicate
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "filter-term ml-2"
+    }, this.renderFilterTerm()))));
+  }
+}
 export default Filter;

package/es/components/popover/color-rules/rule-filters/index.js

@@ -1,23 +1,14 @@
-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 classnames from 'classnames';
 import intl from 'react-intl-universal';
 import Filter from './filter';
 import { DISPLAY_COLOR_RULE_FILTER_TYPE } from '../../../../constants/color-rules';
 import './index.css';
-var RuleFilters = /*#__PURE__*/function (_Component) {
-  _inherits(RuleFilters, _Component);
-  var _super = _createSuper(RuleFilters);
-  function RuleFilters(props) {
-    var _this;
-    _classCallCheck(this, RuleFilters);
-    _this = _super.call(this, props);
-    _this.generateConjunctionOptions = function () {
-      _this.conjunctionOptions = [{
+class RuleFilters extends Component {
+  constructor(props) {
+    super(props);
+    this.generateConjunctionOptions = () => {
+      this.conjunctionOptions = [{
         value: 'And',
         label: /*#__PURE__*/React.createElement("span", {
           className: "select-option-name"
@@ -29,9 +20,11 @@ var RuleFilters = /*#__PURE__*/function (_Component) {
         }, intl.get('Or'))
       }];
     };
-    _this.generateFilterTypeOptions = function (_ref) {
-      var filterTypes = _ref.filterTypes;
-      _this.filterTypeOptions = filterTypes.map(function (filterType) {
+    this.generateFilterTypeOptions = _ref => {
+      let {
+        filterTypes
+      } = _ref;
+      this.filterTypeOptions = filterTypes.map(filterType => {
         return {
           value: filterType,
           label: /*#__PURE__*/React.createElement("span", {
@@ -40,58 +33,57 @@ var RuleFilters = /*#__PURE__*/function (_Component) {
         };
       });
     };
-    _this.deleteFilter = function (index) {
-      var filters = _this.props.filters;
-      var updatedFilters = _toConsumableArray(filters);
+    this.deleteFilter = index => {
+      const {
+        filters
+      } = this.props;
+      let updatedFilters = [...filters];
       updatedFilters.splice(index, 1);
-      _this.props.updateFilters(updatedFilters);
+      this.props.updateFilters(updatedFilters);
     };
-    _this.updateFilter = function (index, updatedFilter) {
-      var filters = _this.props.filters;
-      var updatedFilters = _toConsumableArray(filters);
+    this.updateFilter = (index, updatedFilter) => {
+      const {
+        filters
+      } = this.props;
+      let updatedFilters = [...filters];
       updatedFilters[index] = updatedFilter;
-      _this.props.updateFilters(updatedFilters);
+      this.props.updateFilters(updatedFilters);
     };
-    _this.renderFilter = function (filter, index) {
-      var filterConjunction = _this.props.filterConjunction;
+    this.renderFilter = (filter, index) => {
+      const {
+        filterConjunction
+      } = this.props;
       return /*#__PURE__*/React.createElement(Filter, {
         key: index,
         index: index,
         filter: filter,
         filterConjunction: filterConjunction,
-        conjunctionOptions: _this.conjunctionOptions,
-        filterTypeOptions: _this.filterTypeOptions,
-        getFilterConfigByType: _this.props.getFilterConfigByType,
-        modifyConjunction: _this.props.modifyConjunction,
-        deleteFilter: _this.deleteFilter,
-        updateFilter: _this.updateFilter
+        conjunctionOptions: this.conjunctionOptions,
+        filterTypeOptions: this.filterTypeOptions,
+        getFilterConfigByType: this.props.getFilterConfigByType,
+        modifyConjunction: this.props.modifyConjunction,
+        deleteFilter: this.deleteFilter,
+        updateFilter: this.updateFilter
       });
     };
-    _this.generateConjunctionOptions();
-    _this.generateFilterTypeOptions(props);
-    return _this;
+    this.generateConjunctionOptions();
+    this.generateFilterTypeOptions(props);
   }
-  _createClass(RuleFilters, [{
-    key: "UNSAFE_componentWillReceiveProps",
-    value: function UNSAFE_componentWillReceiveProps(nextProps) {
-      if (nextProps.filterTypes !== this.props.filterTypes) {
-        this.generateFilterTypeOptions(nextProps);
-      }
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    if (nextProps.filterTypes !== this.props.filterTypes) {
+      this.generateFilterTypeOptions(nextProps);
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      var _this$props = this.props,
-        filters = _this$props.filters,
-        className = _this$props.className;
-      return /*#__PURE__*/React.createElement("div", {
-        className: classnames('statistic-color-rule-filters', className)
-      }, filters.map(function (filter, index) {
-        return _this2.renderFilter(filter, index);
-      }));
-    }
-  }]);
-  return RuleFilters;
-}(Component);
+  }
+  render() {
+    const {
+      filters,
+      className
+    } = this.props;
+    return /*#__PURE__*/React.createElement("div", {
+      className: classnames('statistic-color-rule-filters', className)
+    }, filters.map((filter, index) => {
+      return this.renderFilter(filter, index);
+    }));
+  }
+}
 export default RuleFilters;

package/es/components/popover/color-rules/rule-filters/number-input.js

@@ -1,23 +1,17 @@
-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";
 /**
  * support type number with format
  */
 import React, { Component } from 'react';
 import { DEFAULT_NUMBER_FORMAT, formatStringToNumber, getNumberDisplayString, replaceNumberNotAllowInput } from 'dtable-store';
-var NumberInput = /*#__PURE__*/function (_Component) {
-  _inherits(NumberInput, _Component);
-  var _super = _createSuper(NumberInput);
-  function NumberInput(props) {
-    var _this;
-    _classCallCheck(this, NumberInput);
-    _this = _super.call(this, props);
-    _this.getInitValue = function () {
-      var value = _this.props.value;
-      var numericValue = null;
-      var valueType = typeof value;
+class NumberInput extends Component {
+  constructor(props) {
+    super(props);
+    this.getInitValue = () => {
+      const {
+        value
+      } = this.props;
+      let numericValue = null;
+      const valueType = typeof value;
       if (valueType === 'number') {
         numericValue = value;
       } else if (valueType === 'string') {
@@ -28,56 +22,47 @@ var NumberInput = /*#__PURE__*/function (_Component) {
       }
       return getNumberDisplayString(numericValue, {}) || '';
     };
-    _this.onChange = function (evt) {
-      var value = replaceNumberNotAllowInput(evt.target.value.trim(), DEFAULT_NUMBER_FORMAT, null);
-      _this.setState({
-        value: value
-      }, function () {
-        _this.props.onChange(formatStringToNumber(value, {}));
+    this.onChange = evt => {
+      const value = replaceNumberNotAllowInput(evt.target.value.trim(), DEFAULT_NUMBER_FORMAT, null);
+      this.setState({
+        value
+      }, () => {
+        this.props.onChange(formatStringToNumber(value, {}));
       });
     };
-    _this.onPaste = function (evt) {
+    this.onPaste = evt => {
       evt.stopPropagation();
     };
-    _this.state = {
-      value: _this.getInitValue()
+    this.state = {
+      value: this.getInitValue()
     };
-    return _this;
   }
-  _createClass(NumberInput, [{
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
-      if (this.props.value !== prevProps.value) {
-        this.setState({
-          value: this.getInitValue()
-        });
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      var _this$props = this.props,
-        placeholder = _this$props.placeholder,
-        disabled = _this$props.disabled,
-        autoFocus = _this$props.autoFocus;
-      return /*#__PURE__*/React.createElement("input", {
-        ref: function ref(_ref) {
-          return _this2.input = _ref;
-        },
-        type: "text",
-        className: "form-control",
-        value: this.state.value,
-        onChange: this.onChange,
-        onPaste: this.onPaste,
-        placeholder: placeholder || '',
-        autoFocus: autoFocus,
-        disabled: disabled
+  componentDidUpdate(prevProps) {
+    if (this.props.value !== prevProps.value) {
+      this.setState({
+        value: this.getInitValue()
       });
     }
-  }]);
-  return NumberInput;
-}(Component);
+  }
+  render() {
+    const {
+      placeholder,
+      disabled,
+      autoFocus
+    } = this.props;
+    return /*#__PURE__*/React.createElement("input", {
+      ref: ref => this.input = ref,
+      type: "text",
+      className: "form-control",
+      value: this.state.value,
+      onChange: this.onChange,
+      onPaste: this.onPaste,
+      placeholder: placeholder || '',
+      autoFocus: autoFocus,
+      disabled: disabled
+    });
+  }
+}
 NumberInput.defaultProps = {
   autoFocus: false,
   disabled: false