dtable-ui-component 7.0.13 → 7.0.15

package/lib/DTableFiltersPopover/widgets/filter-group.js

@@ -21,8 +21,12 @@ class FilterGroup extends _react.Component {
   constructor() {
     super(...arguments);
     this.onSelectGroupConjunction = conjunctionOption => {
-      const filterConjunction = this.props.filterConjunction;
-      const newConjunction = conjunctionOption.filterConjunction;
+      const {
+        filterConjunction
+      } = this.props;
+      const {
+        filterConjunction: newConjunction
+      } = conjunctionOption;
       if (newConjunction === filterConjunction) {
         return;
       }
@@ -30,17 +34,22 @@ class FilterGroup extends _react.Component {
     };
     this.deleteFilterGroup = event => {
       event.nativeEvent.stopImmediatePropagation();
-      const index = this.props.index;
+      const {
+        index
+      } = this.props;
       this.props.deleteFilterGroup(index);
     };
     this.modifyConjunctionInGroup = new_filter_conjunction => {
-      const index = this.props.index;
+      const {
+        index
+      } = this.props;
       this.props.modifyConjunctionInGroup(index, new_filter_conjunction);
     };
     this.addFilterIntoGroup = () => {
-      const _this$props = this.props,
-        columns = _this$props.columns,
-        index = _this$props.index;
+      const {
+        columns,
+        index
+      } = this.props;
       const newFilter = (0, _utils.getDefaultFilter)(columns);
       if (!newFilter) {
         return;
@@ -48,18 +57,23 @@ class FilterGroup extends _react.Component {
       this.props.addFilterIntoGroup(index, newFilter);
     };
     this.deleteFilterInGroup = filter_index => {
-      const index = this.props.index;
+      const {
+        index
+      } = this.props;
       this.props.deleteFilterInGroup(index, filter_index);
     };
     this.updateFilterInGroup = (filter_index, new_filter) => {
-      const index = this.props.index;
+      const {
+        index
+      } = this.props;
       this.props.updateFilterInGroup(index, filter_index, new_filter);
     };
     this.renderConjunction = () => {
-      const _this$props2 = this.props,
-        index = _this$props2.index,
-        filterConjunction = _this$props2.filterConjunction,
-        conjunctionOptions = _this$props2.conjunctionOptions;
+      const {
+        index,
+        filterConjunction,
+        conjunctionOptions
+      } = this.props;
       switch (index) {
         case 0:
           {
@@ -84,29 +98,35 @@ class FilterGroup extends _react.Component {
       }
     };
     this.renderGroupFilters = () => {
-      const _this$props3 = this.props,
-        columns = _this$props3.columns,
-        conjunctionOptions = _this$props3.conjunctionOptions,
-        columnOptions = _this$props3.columnOptions,
-        filter = _this$props3.filter,
-        groupIndex = _this$props3.index,
-        collaborators = _this$props3.collaborators,
-        lang = _this$props3.lang,
-        userDepartmentIdsMap = _this$props3.userDepartmentIdsMap,
-        departments = _this$props3.departments,
-        firstDayOfWeek = _this$props3.firstDayOfWeek,
-        readOnly = _this$props3.readOnly;
-      const subFilters = filter.filters,
-        filter_conjunction = filter.filter_conjunction;
+      const {
+        columns,
+        conjunctionOptions,
+        columnOptions,
+        filter,
+        index: groupIndex,
+        collaborators,
+        lang,
+        userDepartmentIdsMap,
+        departments,
+        firstDayOfWeek,
+        readOnly
+      } = this.props;
+      const {
+        filters: subFilters,
+        filter_conjunction
+      } = filter;
       const subFilterConjunction = _constants.SUPPORT_CONJUNCTIONS.includes(filter_conjunction) ? filter_conjunction : _dtableUtils.FILTER_CONJUNCTION_TYPE.AND;
       const subFiltersLength = Array.isArray(subFilters) ? subFilters.length : 0;
       if (subFiltersLength === 0) {
         return null;
       }
       return subFilters.map((currentFilter, subFilterIndex) => {
-        const sub_filter_column_key = currentFilter.column_key;
-        const _ValidateFilter$valid = _dtableUtils.ValidateFilter.validate(currentFilter, columns),
-          error_message = _ValidateFilter$valid.error_message;
+        const {
+          column_key: sub_filter_column_key
+        } = currentFilter;
+        const {
+          error_message
+        } = _dtableUtils.ValidateFilter.validate(currentFilter, columns);
         const filterColumn = columns.find(column => column.key === sub_filter_column_key) || {};
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_filterItem.default, {
           isInModal: this.props.isInModal,
@@ -126,17 +146,18 @@ class FilterGroup extends _react.Component {
           updateConjunction: this.modifyConjunctionInGroup,
           deleteFilter: this.deleteFilterInGroup,
           updateFilter: this.updateFilterInGroup
-        }, "filter-in-group-".concat(groupIndex, "-").concat(subFilterIndex));
+        }, `filter-in-group-${groupIndex}-${subFilterIndex}`);
       });
     };
   }
   render() {
-    const _this$props4 = this.props,
-      level = _this$props4.level,
-      index = _this$props4.index,
-      readOnly = _this$props4.readOnly;
+    const {
+      level,
+      index,
+      readOnly
+    } = this.props;
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _classnames.default)('filter-item', 'filter-group', "level-".concat(level)),
+      className: (0, _classnames.default)('filter-item', 'filter-group', `level-${level}`),
       children: [!readOnly && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "delete-filter seatable-icon-btn",
         onClick: this.deleteFilterGroup,

package/lib/DTableFiltersPopover/widgets/filter-item.js

@@ -32,16 +32,21 @@ class FilterItem extends _react.default.Component {
     super(_props);
     _this = this;
     this.initSelectOptions = props => {
-      const filter = props.filter,
-        filterColumn = props.filterColumn;
-      let _getColumnOptions = (0, _utils.getColumnOptions)(filterColumn),
-        filterPredicateList = _getColumnOptions.filterPredicateList,
-        filterTermModifierList = _getColumnOptions.filterTermModifierList;
+      const {
+        filter,
+        filterColumn
+      } = props;
+      let {
+        filterPredicateList,
+        filterTermModifierList
+      } = (0, _utils.getColumnOptions)(filterColumn);
       // The value of the calculation formula column does not exist in the shared view
       this.filterPredicateOptions = filterPredicateList ? filterPredicateList.map(predicate => {
         return _filterItemUtils.default.generatorPredicateOption(predicate);
       }).filter(item => item) : [];
-      const filter_predicate = filter.filter_predicate;
+      const {
+        filter_predicate
+      } = filter;
       if ((0, _dtableUtils.isDateColumn)(filterColumn)) {
         if (filter_predicate === _dtableUtils.FILTER_PREDICATE_TYPE.IS_WITHIN) {
           filterTermModifierList = _dtableUtils.filterTermModifierIsWithin;
@@ -53,7 +58,9 @@ class FilterItem extends _react.default.Component {
     };
     this.onDeleteFilter = event => {
       event.nativeEvent.stopImmediatePropagation();
-      const index = this.props.index;
+      const {
+        index
+      } = this.props;
       this.props.deleteFilter(index);
     };
     this.resetState = filter => {
@@ -62,17 +69,22 @@ class FilterItem extends _react.default.Component {
       });
     };
     this.onSelectConjunction = value => {
-      const filterConjunction = this.props.filterConjunction;
+      const {
+        filterConjunction
+      } = this.props;
       if (filterConjunction === value.filterConjunction) {
         return;
       }
       this.props.updateConjunction(value.filterConjunction);
     };
     this.onSelectColumn = value => {
-      const _this$props = this.props,
-        index = _this$props.index,
-        filter = _this$props.filter;
-      const column = value.column;
+      const {
+        index,
+        filter
+      } = this.props;
+      const {
+        column
+      } = value;
       if (column.key === filter.column_key) return;
       let newFilter = (0, _utils.getFilterByColumn)(column, filter);
       if (!newFilter) return;
@@ -80,11 +92,14 @@ class FilterItem extends _react.default.Component {
       this.props.updateFilter(index, newFilter);
     };
     this.onSelectPredicate = value => {
-      const _this$props2 = this.props,
-        index = _this$props2.index,
-        filter = _this$props2.filter,
-        filterColumn = _this$props2.filterColumn;
-      const filterPredicate = value.filterPredicate;
+      const {
+        index,
+        filter,
+        filterColumn
+      } = this.props;
+      const {
+        filterPredicate
+      } = value;
       if (filter.filter_predicate === filterPredicate) {
         return;
       }
@@ -93,10 +108,13 @@ class FilterItem extends _react.default.Component {
       this.props.updateFilter(index, newFilter);
     };
     this.onSelectTermModifier = value => {
-      const _this$props3 = this.props,
-        index = _this$props3.index,
-        filter = _this$props3.filter;
-      const filterTermModifier = value.filterTermModifier;
+      const {
+        index,
+        filter
+      } = this.props;
+      const {
+        filterTermModifier
+      } = value;
       const inputRangeLabel = [_dtableUtils.FILTER_TERM_MODIFIER_TYPE.EXACT_DATE, _dtableUtils.FILTER_TERM_MODIFIER_TYPE.NUMBER_OF_DAYS_AGO, _dtableUtils.FILTER_TERM_MODIFIER_TYPE.NUMBER_OF_DAYS_FROM_NOW, _dtableUtils.FILTER_TERM_MODIFIER_TYPE.THE_NEXT_NUMBERS_OF_DAYS, _dtableUtils.FILTER_TERM_MODIFIER_TYPE.THE_PAST_NUMBERS_OF_DAYS];
       if (filter.filter_term_modifier === filterTermModifier) {
         return;
@@ -113,10 +131,13 @@ class FilterItem extends _react.default.Component {
       this.props.updateFilter(index, newFilter);
     };
     this.onSelectSingle = value => {
-      const _this$props4 = this.props,
-        index = _this$props4.index,
-        filter = _this$props4.filter;
-      const option = value.columnOption;
+      const {
+        index,
+        filter
+      } = this.props;
+      const {
+        columnOption: option
+      } = value;
       if (filter.filter_term === option.id) {
         return;
       }
@@ -125,26 +146,31 @@ class FilterItem extends _react.default.Component {
       this.props.updateFilter(index, newFilter);
     };
     this.onSelectMultiple = value => {
-      const _this$props5 = this.props,
-        index = _this$props5.index,
-        filter = _this$props5.filter;
+      const {
+        index,
+        filter
+      } = this.props;
       let newFilter = (0, _utils.getUpdatedFilterBySelectMultiple)(filter, value);
       this.resetState(newFilter);
       this.props.updateFilter(index, newFilter);
     };
     this.onSelectCollaborator = _ref => {
-      let collaborator = _ref.columnOption;
-      const _this$props6 = this.props,
-        index = _this$props6.index,
-        filter = _this$props6.filter;
+      let {
+        columnOption: collaborator
+      } = _ref;
+      const {
+        index,
+        filter
+      } = this.props;
       let newFilter = (0, _utils.getUpdatedFilterByCollaborator)(filter, collaborator);
       this.resetState(newFilter);
       this.props.updateFilter(index, newFilter);
     };
     this.onSelectCreator = value => {
-      const _this$props7 = this.props,
-        index = _this$props7.index,
-        filter = _this$props7.filter;
+      const {
+        index,
+        filter
+      } = this.props;
       const collaborator = value && (value.columnOption || value.value || value);
       if (!collaborator || !collaborator.email) {
         return;
@@ -175,10 +201,13 @@ class FilterItem extends _react.default.Component {
       this.onFilterTermChanged(value);
     };
     this.onFilterTermChanged = newFilterTerm => {
-      const _this$props8 = this.props,
-        index = _this$props8.index,
-        filter = _this$props8.filter;
-      const filterTerm = this.state.filterTerm;
+      const {
+        index,
+        filter
+      } = this.props;
+      const {
+        filterTerm
+      } = this.state;
       if (newFilterTerm !== filterTerm) {
         this.setState({
           filterTerm: newFilterTerm
@@ -203,11 +232,14 @@ class FilterItem extends _react.default.Component {
       this.onFilterTermChanged(index);
     };
     this.getInputComponent = type => {
-      const _this$props9 = this.props,
-        filterColumn = _this$props9.filterColumn,
-        readOnly = _this$props9.readOnly,
-        isInModal = _this$props9.isInModal;
-      const filterTerm = this.state.filterTerm;
+      const {
+        filterColumn,
+        readOnly,
+        isInModal
+      } = this.props;
+      const {
+        filterTerm
+      } = this.state;
       if (type === _constants.INPUT_CMP_TYPE_MAP.TEXT) {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableSearchInput.default, {
           value: filterTerm,
@@ -250,12 +282,13 @@ class FilterItem extends _react.default.Component {
       }
     };
     this.renderConjunction = () => {
-      const _this$props0 = this.props,
-        index = _this$props0.index,
-        filterConjunction = _this$props0.filterConjunction,
-        conjunctionOptions = _this$props0.conjunctionOptions,
-        readOnly = _this$props0.readOnly,
-        isInModal = _this$props0.isInModal;
+      const {
+        index,
+        filterConjunction,
+        conjunctionOptions,
+        readOnly,
+        isInModal
+      } = this.props;
       switch (index) {
         case 0:
           {
@@ -284,10 +317,13 @@ class FilterItem extends _react.default.Component {
     this.renderMultipleSelectOption = function () {
       let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
       let filterTerm = arguments.length > 1 ? arguments[1] : undefined;
-      const _this$props1 = _this.props,
-        filter = _this$props1.filter,
-        readOnly = _this$props1.readOnly;
-      const filter_predicate = filter.filter_predicate;
+      const {
+        filter,
+        readOnly
+      } = _this.props;
+      const {
+        filter_predicate
+      } = filter;
       let isSupportMultipleSelect = false;
       // The first two options are used for single selection, and the last four options are used for multiple selection
       const supportMultipleSelectOptions = [_dtableUtils.FILTER_PREDICATE_TYPE.IS_ANY_OF, _dtableUtils.FILTER_PREDICATE_TYPE.IS_NONE_OF, _dtableUtils.FILTER_PREDICATE_TYPE.HAS_ANY_OF, _dtableUtils.FILTER_PREDICATE_TYPE.HAS_ALL_OF, _dtableUtils.FILTER_PREDICATE_TYPE.HAS_NONE_OF, _dtableUtils.FILTER_PREDICATE_TYPE.IS_EXACTLY];
@@ -346,19 +382,24 @@ class FilterItem extends _react.default.Component {
       });
     };
     this.renderFilterTerm = filterColumn => {
-      const _this$props10 = this.props,
-        index = _this$props10.index,
-        filter = _this$props10.filter,
-        collaborators = _this$props10.collaborators,
-        userDepartmentIdsMap = _this$props10.userDepartmentIdsMap,
-        departments = _this$props10.departments,
-        lang = _this$props10.lang,
-        firstDayOfWeek = _this$props10.firstDayOfWeek,
-        readOnly = _this$props10.readOnly;
-      const type = filterColumn.type;
-      const filter_term = filter.filter_term,
-        filter_predicate = filter.filter_predicate,
-        filter_term_modifier = filter.filter_term_modifier;
+      const {
+        index,
+        filter,
+        collaborators,
+        userDepartmentIdsMap,
+        departments,
+        lang,
+        firstDayOfWeek,
+        readOnly
+      } = this.props;
+      const {
+        type
+      } = filterColumn;
+      const {
+        filter_term,
+        filter_predicate,
+        filter_term_modifier
+      } = filter;
       // predicate is empty or not empty
       if (_constants.EMPTY_PREDICATE.includes(filter_predicate)) {
         return null;
@@ -415,9 +456,9 @@ class FilterItem extends _react.default.Component {
         case _dtableUtils.CellType.SINGLE_SELECT:
           {
             // get options
-            let _ref2 = filterColumn.data || {},
-              _ref2$options = _ref2.options,
-              options = _ref2$options === void 0 ? [] : _ref2$options;
+            let {
+              options = []
+            } = filterColumn.data || {};
             if ([_dtableUtils.FILTER_PREDICATE_TYPE.IS_ANY_OF, _dtableUtils.FILTER_PREDICATE_TYPE.IS_NONE_OF].includes(filter_predicate)) {
               return this.renderMultipleSelectOption(options, filter_term);
             }
@@ -460,9 +501,9 @@ class FilterItem extends _react.default.Component {
           }
         case _dtableUtils.CellType.MULTIPLE_SELECT:
           {
-            let _ref3 = filterColumn.data || {},
-              _ref3$options = _ref3.options,
-              options = _ref3$options === void 0 ? [] : _ref3$options;
+            let {
+              options = []
+            } = filterColumn.data || {};
             return this.renderMultipleSelectOption(options, filter_term);
           }
         case _dtableUtils.CellType.DEPARTMENT_SINGLE_SELECT:
@@ -521,8 +562,9 @@ class FilterItem extends _react.default.Component {
           }
         case _dtableUtils.CellType.RATE:
           {
-            let _ref4 = filterColumn.data || {},
-              rate_max_number = _ref4.rate_max_number;
+            let {
+              rate_max_number
+            } = filterColumn.data || {};
             let rateList = [];
             for (let i = 0; i < rate_max_number; i++) {
               let rateItem = /*#__PURE__*/(0, _jsxRuntime.jsx)(_rateItem.default, {
@@ -559,16 +601,19 @@ class FilterItem extends _react.default.Component {
       }
     };
     this.renderFormulaFilterTerm = (filterPredicate, filterTerm, index, filterColumn) => {
-      const _ref5 = filterColumn || {},
-        data = _ref5.data;
-      const _ref6 = data || {},
-        result_type = _ref6.result_type;
+      const {
+        data
+      } = filterColumn || {};
+      const {
+        result_type
+      } = data || {};
       if (filterPredicate === _dtableUtils.FILTER_PREDICATE_TYPE.IS_CURRENT_USER_ID) {
         return null;
       }
       if (result_type === _dtableUtils.FORMULA_RESULT_TYPE.NUMBER) {
-        const _ref7 = filterColumn.data || {},
-          format = _ref7.format;
+        const {
+          format
+        } = filterColumn.data || {};
         if (format === _dtableUtils.CellType.DURATION) {
           return this.getInputComponent(_constants.INPUT_CMP_TYPE_MAP.DURATION, filterColumn);
         }
@@ -586,15 +631,18 @@ class FilterItem extends _react.default.Component {
       return this.renderFilterTermByArrayType(filterPredicate, filterTerm, index, filterColumn);
     };
     this.renderFilterTermByArrayType = (filterPredicate, filterTerm, index, filterColumn) => {
-      const _this$props11 = this.props,
-        collaborators = _this$props11.collaborators,
-        departments = _this$props11.departments,
-        readOnly = _this$props11.readOnly;
-      const _ref8 = filterColumn || {},
-        data = _ref8.data;
-      const _ref9 = data || {},
-        array_type = _ref9.array_type,
-        array_data = _ref9.array_data;
+      const {
+        collaborators,
+        departments,
+        readOnly
+      } = this.props;
+      const {
+        data
+      } = filterColumn || {};
+      const {
+        array_type,
+        array_data
+      } = data || {};
       if (!array_type) {
         return null;
       }
@@ -603,9 +651,9 @@ class FilterItem extends _react.default.Component {
         data: array_data
       };
       if (array_type === _dtableUtils.CellType.SINGLE_SELECT || array_type === _dtableUtils.CellType.MULTIPLE_SELECT) {
-        let _ref0 = array_data || {},
-          _ref0$options = _ref0.options,
-          options = _ref0$options === void 0 ? [] : _ref0$options;
+        let {
+          options = []
+        } = array_data || {};
         return this.renderMultipleSelectOption(options, filterTerm);
       }
       if (array_type === _dtableUtils.CellType.DEPARTMENT_SINGLE_SELECT) {
@@ -637,7 +685,9 @@ class FilterItem extends _react.default.Component {
       return this.getInputComponent(_constants.INPUT_CMP_TYPE_MAP.TEXT);
     };
     this.isRenderErrorTips = () => {
-      const errMsg = this.props.errMsg;
+      const {
+        errMsg
+      } = this.props;
       return errMsg && errMsg !== _dtableUtils.FILTER_ERR_MSG.INCOMPLETE_FILTER;
     };
     this.renderErrorMessage = () => {
@@ -667,7 +717,9 @@ class FilterItem extends _react.default.Component {
     this.initSelectOptions(_props);
   }
   UNSAFE_componentWillReceiveProps(nextProps) {
-    const filter = this.props.filter;
+    const {
+      filter
+    } = this.props;
     if (nextProps.filter !== filter) {
       this.initSelectOptions(nextProps);
       this.setState({
@@ -681,15 +733,20 @@ class FilterItem extends _react.default.Component {
     return shouldUpdated;
   }
   render() {
-    const filterPredicateOptions = this.filterPredicateOptions,
-      filterTermModifierOptions = this.filterTermModifierOptions;
-    const _this$props12 = this.props,
-      filter = _this$props12.filter,
-      filterColumn = _this$props12.filterColumn,
-      filterColumnOptions = _this$props12.filterColumnOptions,
-      readOnly = _this$props12.readOnly;
-    const filter_predicate = filter.filter_predicate,
-      filter_term_modifier = filter.filter_term_modifier;
+    const {
+      filterPredicateOptions,
+      filterTermModifierOptions
+    } = this;
+    const {
+      filter,
+      filterColumn,
+      filterColumnOptions,
+      readOnly
+    } = this.props;
+    const {
+      filter_predicate,
+      filter_term_modifier
+    } = filter;
     const activeColumn = _filterItemUtils.default.generatorColumnOption(filterColumn);
     const activePredicate = _filterItemUtils.default.generatorPredicateOption(filter_predicate, true);
     let activeTermModifier = null;
@@ -699,7 +756,9 @@ class FilterItem extends _react.default.Component {
     } else if ((0, _columnUtils.isCheckboxColumn)(filterColumn)) {
       _isCheckboxColumn = true;
     }
-    const type = filterColumn.type;
+    const {
+      type
+    } = filterColumn;
     const computedColumnTypes = [_dtableUtils.CellType.FORMULA, _dtableUtils.CellType.LINK_FORMULA, _dtableUtils.CellType.LINK];
     const isContainPredicate = [_dtableUtils.FILTER_PREDICATE_TYPE.CONTAINS, _dtableUtils.FILTER_PREDICATE_TYPE.NOT_CONTAIN].includes(filter_predicate);
     const isRenderErrorTips = this.isRenderErrorTips();
@@ -735,7 +794,7 @@ class FilterItem extends _react.default.Component {
               isLocked: readOnly
             })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-            className: "filter-predicate ml-2 ".concat(_isCheckboxColumn ? 'filter-checkbox-predicate' : ''),
+            className: `filter-predicate ml-2 ${_isCheckboxColumn ? 'filter-checkbox-predicate' : ''}`,
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableCustomizeSelect.default, {
               value: activePredicate,
               options: filterPredicateOptions,