linkmore-design 1.0.57 → 1.0.60

package/es/LmFilter/components/DateFilter.js

@@ -9,25 +9,34 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-require("antd/es/date-picker/style");
-
-var _datePicker = _interopRequireDefault(require("antd/es/date-picker"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
 
 var _react = _interopRequireWildcard(require("react"));
 
 var _linkmoreDesign = require("linkmore-design");
 
+var _moment = _interopRequireDefault(require("moment"));
+
 var _utils = require("../utils");
 
 var RangePicker = function RangePicker(_ref) {
-  var filterValue = _ref.filterValue,
-      setFilterValue = _ref.setFilterValue,
+  var instance = _ref.instance,
       onChange = _ref.onChange,
-      itemProps = _ref.itemProps,
-      visible = _ref.visible;
-  // 最近的时间段, 值为JSON转换后的字符串
+      itemProps = _ref.itemProps;
+  var filterValue = instance.filterValue,
+      setFilterValue = instance.setFilterValue,
+      visible = instance.visible,
+      setVisible = instance.setVisible;
+  var defaultValue = (0, _react.useMemo)(function () {
+    var nValue;
+
+    if ((0, _utils.getIsHas)(filterValue)) {
+      nValue = [(0, _moment.default)(filterValue[0]), (0, _moment.default)(filterValue[1])];
+    }
+
+    return nValue;
+  }, [filterValue]); // 最近的时间段, 值为JSON转换后的字符串
+
   var ranges = (0, _react.useMemo)(function () {
     return Object.entries((0, _utils.getRanges)()).map(function (item, i) {
       return {
@@ -60,7 +69,7 @@ var RangePicker = function RangePicker(_ref) {
       className: "filter_picker_header"
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "filter_picker_header_tip"
-    }, filterValue && "".concat(filterValue[0], " - ").concat(filterValue[1])), /*#__PURE__*/_react.default.createElement("div", {
+    }, defaultValue && "".concat(filterValue[0], " - ").concat(filterValue[1])), /*#__PURE__*/_react.default.createElement("div", {
       className: "filter_picker_header_operate"
     }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Radio.Group, {
       value: activeValue,
@@ -74,7 +83,7 @@ var RangePicker = function RangePicker(_ref) {
     })))), panelNode));
   };
 
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_datePicker.default.RangePicker, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.DatePicker.RangePicker, (0, _extends2.default)({
     picker: "date",
     separator: /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
       type: "lmweb-swap-right",
@@ -82,17 +91,17 @@ var RangePicker = function RangePicker(_ref) {
         color: 'var(--text-color)'
       }
     }),
-    placeholder: ['开始日期', '结束日期'],
-    style: {
-      width: 210
-    }
+    placeholder: ['开始日期', '结束日期']
   }, itemProps, {
+    value: defaultValue,
     onChange: handleOnChange,
     open: visible,
+    onOpenChange: function onOpenChange(vis) {
+      return setVisible(vis);
+    },
     panelRender: panelRender,
     dropdownClassName: "lm_filter_dropdown_picker",
-    bordered: false,
-    size: "small",
+    size: "middle",
     inputReadOnly: true
   })));
 }; // 日期范围选择器
@@ -103,11 +112,25 @@ var DatePickerFilter = function DatePickerFilter(_ref2) {
       itemProps = _ref2.item;
   var filterValue = instance.filterValue,
       setFilterValue = instance.setFilterValue,
-      visible = instance.visible;
-  var _itemProps$props = itemProps.props,
-      props = _itemProps$props === void 0 ? {
-    picker: 'date'
-  } : _itemProps$props; // 选中时间段的触发
+      visible = instance.visible,
+      setVisible = instance.setVisible;
+  var props = itemProps.props;
+
+  var _ref3 = props || {},
+      _ref3$picker = _ref3.picker,
+      picker = _ref3$picker === void 0 ? 'date' : _ref3$picker;
+
+  var defaultValue = (0, _react.useMemo)(function () {
+    var nValue; // 周/月/季/年 需要处理回显
+
+    if (picker !== 'date') return nValue;
+
+    if (filterValue) {
+      nValue = (0, _moment.default)(filterValue);
+    }
+
+    return nValue;
+  }, [filterValue]); // 选中时间段的触发
 
   var onChange = function onChange(dates, dateStrings) {
     setFilterValue((0, _utils.getIsHas)(dateStrings) ? dateStrings : null);
@@ -115,21 +138,22 @@ var DatePickerFilter = function DatePickerFilter(_ref2) {
 
   if (['range', 'rangePicker'].includes(itemProps.dateType || itemProps.datetype)) {
     return /*#__PURE__*/_react.default.createElement(RangePicker, {
-      filterValue: filterValue,
-      setFilterValue: setFilterValue,
+      instance: instance,
       onChange: onChange,
-      itemProps: props,
-      visible: visible
+      itemProps: props
     });
   }
 
-  return /*#__PURE__*/_react.default.createElement(_datePicker.default, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(_linkmoreDesign.DatePicker, (0, _extends2.default)({
     placeholder: "\u9009\u62E9\u65F6\u95F4"
   }, props, {
+    defaultValue: defaultValue,
     onChange: onChange,
     open: visible,
-    bordered: false,
-    size: "small",
+    onOpenChange: function onOpenChange(vis) {
+      return setVisible(vis);
+    },
+    size: "middle",
     inputReadOnly: true,
     dropdownClassName: "lm_filter_dropdown_picker"
   }));

package/es/LmFilter/components/DropdownFIlter.js

@@ -100,57 +100,86 @@ var getPlacehodler = function getPlacehodler(props) {
 
 
 var getLabel = function getLabel(filterValue, item) {
-  var _val;
+  var _data$find;
 
-  var val = filterValue;
-  var type = item.type; // 不存在筛选时
+  var type = item.type,
+      data = item.data; // 不存在筛选时
 
-  if (!(0, _utils.getIsHas)(val)) {
+  if (!(0, _utils.getIsHas)(filterValue)) {
     return getPlacehodler(item);
-  } // 存在筛选数据时
+  } // 存在筛选数据时 ⬇️
+  // 级联数据转换平级结构
 
 
-  if (Array.isArray(val)) {
+  if (['cascader'].includes(type)) {
+    var _item$props;
+
+    var nArr = (0, _utils.getFlatItem)((item === null || item === void 0 ? void 0 : (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.multiple) ? filterValue : [filterValue], data);
+    var labels = nArr.map(function (v) {
+      return v.label;
+    });
+
+    switch (labels.length) {
+      case 1:
+        return labels[0];
+
+      case 2:
+        return "".concat(labels[0], "\u3001").concat(labels[1]);
+
+      default:
+        return "".concat(labels[0], "\u3001+").concat(labels.length - 1, "...");
+    }
+  }
+
+  if (Array.isArray(filterValue)) {
+    var _data$filter;
+
     // 日期
     if (['date'].includes(type)) {
-      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, val[0], /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, filterValue[0], /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
         type: "lmweb-swap-right",
         style: {
           fontSize: 14,
           color: 'var(--text-color)'
         }
-      }), val[1]);
-    } // 级联数据转换平级结构
+      }), filterValue[1]);
+    } // 多选
 
 
-    if (['cascader'].includes(type)) {
-      var _filterValue$map;
+    var _labels = data === null || data === void 0 ? void 0 : (_data$filter = data.filter(function (v) {
+      return filterValue.includes(v.value);
+    })) === null || _data$filter === void 0 ? void 0 : _data$filter.map(function (v) {
+      return v.label;
+    });
 
-      val = (_filterValue$map = filterValue.map(function (v) {
-        return v[1] ? v[1] : v[0].children;
-      })) === null || _filterValue$map === void 0 ? void 0 : _filterValue$map.flat(2);
-    } // 多选
+    if (!_labels.length) {
+      _labels = filterValue;
+    }
 
+    ; // 受控模式未查找到显示的内容时展示
 
-    switch (val.length) {
+    switch (_labels.length) {
       case 1:
-        return val[0].label;
+        return _labels[0];
 
       case 2:
-        return "".concat(val[0].label, "\u3001").concat(val[1].label);
+        return "".concat(_labels[0], "\u3001").concat(_labels[1]);
 
       default:
-        return "".concat(val[0].label, "\u3001+").concat(val.length - 1, "...");
+        return "".concat(_labels[0], "\u3001+").concat(_labels.length - 1, "...");
     }
   } // 输入框
 
 
   if (['input', 'date'].includes(type)) {
-    return val;
-  } // 单选框
+    return filterValue;
+  } // 单选框 受控模式未查找到显示的内容时展示filterValue
 
 
-  return (_val = val) === null || _val === void 0 ? void 0 : _val.label;
+  var label = ((_data$find = data.find(function (v) {
+    return v.value === filterValue;
+  })) === null || _data$find === void 0 ? void 0 : _data$find.label) || filterValue;
+  return label;
 };
 /*
  * css样式控制

package/es/LmFilter/components/SelectFilter.js

@@ -53,7 +53,6 @@ var SelectFilter = function SelectFilter(_ref) {
 
   var handleFilter = function handleFilter() {
     var val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-    console.log('val', val);
     var serachValues = filters.filter(function (v) {
       return v.label.indexOf(val) > -1;
     });
@@ -63,7 +62,7 @@ var SelectFilter = function SelectFilter(_ref) {
 
   var onChange = function onChange(e, obj) {
     e.preventDefault();
-    setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue(obj);
+    setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue(obj.value);
   }; // 展开下拉时触发: 赋值 && 聚焦 && 重置显示内容
 
 
@@ -98,7 +97,7 @@ var SelectFilter = function SelectFilter(_ref) {
         resetProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
     return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, resetProps, {
       className: (0, _classnames.default)('filter_item', {
-        checked: item.value === (filterValue === null || filterValue === void 0 ? void 0 : filterValue.value)
+        checked: item.value === filterValue
       }),
       onClick: function onClick(e) {
         return onChange(e, item);

package/es/LmFilter/components/index.js

@@ -55,72 +55,16 @@ var FilterControl = /*#__PURE__*/_react.default.memo(function (props) {
   }),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       aliveValue = _useState2[0],
-      setAliveValue = _useState2[1]; // 单独使用时将值转换为行数据
+      setAliveValue = _useState2[1]; // 单独使用 检查是否受控模式
 
 
   var transformFilterValue = (0, _react.useMemo)(function () {
-    // 检查是否受控模式
-    var checkedValue = value || aliveValue;
-    var getOptions = (resetItem === null || resetItem === void 0 ? void 0 : resetItem.data) || [];
-    var nValue = checkedValue;
-
-    if (['select'].includes(resetItem.type)) {
-      nValue = getOptions === null || getOptions === void 0 ? void 0 : getOptions.find(function (v) {
-        return v.value === checkedValue;
-      });
-    }
-
-    if (['checkbox'].includes(resetItem.type)) {
-      nValue = (getOptions === null || getOptions === void 0 ? void 0 : getOptions.filter(function (v) {
-        return checkedValue.includes(v.value);
-      })) || [];
-    }
-
-    if (['cascader'].includes(resetItem.type)) {
-      // 查询值
-      // const getRow = (val, arr) => {
-      //   let nRow = '';
-      //   arr.forEach(item => {
-      //     nRow = item.value === val ? item : getRow(val, item.children);
-      //   })
-      //   return nRow;
-      // };
-      // checkedValue?.map(v => {
-      //   return Array.isArray(v) ? getRow(v) : getRow(v);
-      // })
-      return '';
-    }
-
-    return nValue;
-  }, [value, aliveValue, resetItem.data, resetItem.type]); // 单独使用时抛出选中的值: val => obj || Array
+    return value || aliveValue;
+  }, [value, aliveValue]); // 单独使用时抛出选中的值
 
   var handleChange = function handleChange(val) {
-    var nValue = val;
-
-    if (['cascader'].includes(resetItem.type)) {
-      var flatKeys = function flatKeys(arr) {
-        return arr.map(function (v) {
-          return v.value;
-        });
-      };
-
-      nValue = val.map(function (v) {
-        return Array.isArray(v) ? flatKeys(v) : v.value;
-      });
-    }
-
-    if (['select'].includes(resetItem.type)) {
-      nValue = val.value;
-    }
-
-    if (['checkbox'].includes(resetItem.type)) {
-      nValue = val.map(function (v) {
-        return v.value;
-      });
-    }
-
-    setAliveValue === null || setAliveValue === void 0 ? void 0 : setAliveValue(nValue);
-    onChange === null || onChange === void 0 ? void 0 : onChange(nValue);
+    setAliveValue === null || setAliveValue === void 0 ? void 0 : setAliveValue(val);
+    onChange === null || onChange === void 0 ? void 0 : onChange(val);
   }; // 重组instance
 
 

package/es/LmFilter/customFilter/index.js

@@ -9,8 +9,9 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var LmFilterCustom = function LmFilterCustom(e) {
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "LmFilterCustom");
+var LmFilterCustom = function LmFilterCustom(_ref) {
+  var instance = _ref.instance;
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
 };
 
 var _default = LmFilterCustom;

package/es/LmFilter/filterFns/index.js

@@ -18,9 +18,20 @@ var CoreOptions = function CoreOptions(_ref) {
   var state = _ref.state,
       dispatch = _ref.dispatch,
       props = _ref.props;
-  var onChange = props.onChange; // 设置筛选的值 item => Object || Array => [{label: '',  value: ''}, ...]
+  var onChange = props.onChange,
+      dataSource = props.dataSource; // 根据字段查找过滤的数据, 不存在时返回默认值
+
+  var getFilterValue = function getFilterValue(_ref2) {
+    var field = _ref2.field,
+        type = _ref2.type;
+    var defaultValue = (0, _utils.getValueForType)(type);
+    return state.basicFilter[field] || defaultValue;
+  }; // 设置筛选的值 item => String || Array => ['', '', ...]
+
 
   var setFilterValue = function setFilterValue(item, field) {
+    var _Object$entries;
+
     var basicFilter = (0, _objectSpread3.default)((0, _objectSpread3.default)({}, state.basicFilter), {}, (0, _defineProperty2.default)({}, field, item));
 
     if (!(0, _utils.getIsHas)(item)) {
@@ -32,40 +43,69 @@ var CoreOptions = function CoreOptions(_ref) {
       type: 'changeBasicFilter',
       basicFilter: basicFilter
     });
-
-    var formatVK = function formatVK() {
-      var obj = {};
-      Object.entries(basicFilter).forEach(function (item) {
-        if (Array.isArray(item[1])) {
-          obj[item[0]] = item[1].map(function (v) {
-            return v.value;
-          });
-          return;
-        }
-
-        obj[item[0]] = item[1].value;
-      });
-      return obj;
-    }; // 触发外部事件
-
+    dispatch({
+      type: 'changeComplexFilter',
+      complexFilter: {}
+    }); // 基础筛选清空高级筛选
+    // 抛出给外部存储
+
+    var filterQuery = (_Object$entries = Object.entries(basicFilter)) === null || _Object$entries === void 0 ? void 0 : _Object$entries.map(function (v) {
+      return {
+        fieldName: v[0],
+        value: v[1],
+        operator: 'contains'
+      };
+    }); // 触发外部事件
 
     onChange === null || onChange === void 0 ? void 0 : onChange({
       basicFilter: basicFilter,
-      formatVK: formatVK()
+      filterQuery: filterQuery,
+      type: 'basic'
     });
-  }; // 根据字段查找过滤的数据, 不存在时返回默认值
+  }; // 读取缓存
 
 
-  var getFilterValue = function getFilterValue(_ref2) {
-    var field = _ref2.field,
-        type = _ref2.type;
-    var defaultValue = (0, _utils.getValueForType)(type);
-    return state.basicFilter[field] || defaultValue;
+  var setLocalization = function setLocalization() {
+    var localization = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : props.localization;
+    var globalQuery = localization.globalQuery,
+        filterQuery = localization.filterQuery;
+
+    if (filterQuery === null || filterQuery === void 0 ? void 0 : filterQuery.filter) {
+      // 初始化基础查询缓存
+      var basicFilter = filterQuery === null || filterQuery === void 0 ? void 0 : filterQuery.filter.reduce(function (pre, cur) {
+        // 查找改数据是否展示
+        var someData = dataSource.some(function (v) {
+          if (cur.fieldName === v.field) {
+            var isHidden = !v.show && typeof v.show === 'boolean';
+            return !isHidden;
+          }
+
+          return false;
+        });
+
+        if ((0, _utils.getIsHas)(cur.value) && someData) {
+          pre[cur.fieldName] = cur.value;
+        }
+
+        return pre;
+      }, {});
+      dispatch({
+        type: 'changeBasicFilter',
+        basicFilter: basicFilter
+      });
+    }
   };
 
   return {
+    getState: function getState() {
+      return state;
+    },
+    getBasicFilter: function getBasicFilter() {
+      return state.basicFilter;
+    },
+    getFilterValue: getFilterValue,
     setFilterValue: setFilterValue,
-    getFilterValue: getFilterValue
+    setLocalization: setLocalization
   };
 };
 

package/es/LmFilter/style/style.css

@@ -14,6 +14,7 @@
   display: inline-flex;
 }
 .lm_filter_basic_item {
+  font-size: 12px;
   display: inline-flex;
   align-items: center;
   line-height: 1;
@@ -65,7 +66,7 @@
 }
 .ant-dropdown.filter_dropdown_container_date .ant-picker {
   visibility: hidden;
-  transform: translateY(-28px);
+  transform: translateY(-36px);
 }
 .ant-dropdown .filter_dropdown {
   display: flex;

package/es/LmFilter/utils.js

@@ -5,14 +5,12 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getFlat = getFlat;
+exports.getFlatItem = getFlatItem;
 exports.getIsHas = getIsHas;
 exports.getRanges = getRanges;
 exports.getValueForType = getValueForType;
 exports.uniqueFunc = uniqueFunc;
 
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/typeof"));
 
 var _dayjs = _interopRequireDefault(require("dayjs"));
@@ -44,7 +42,9 @@ function getValueForType(type) {
 function uniqueFunc(arr, guid) {
   var res = new Map();
   return arr.filter(function (item) {
-    return !res.has(item[guid]) && res.set(item[guid], 1);
+    var isHas = (item === null || item === void 0 ? void 0 : item[guid]) || typeof (item === null || item === void 0 ? void 0 : item[guid]) === 'number';
+    var resetItem = isHas ? item === null || item === void 0 ? void 0 : item[guid] : item;
+    return !res.has(resetItem) && res.set(resetItem, 1);
   });
 } // 获取最近的时间段
 
@@ -55,17 +55,66 @@ function getRanges() {
     '近一月': [(0, _dayjs.default)().subtract(1, 'month').format('YYYY-MM-DD'), (0, _dayjs.default)().format('YYYY-MM-DD')],
     '近一年': [(0, _dayjs.default)().subtract(1, 'year').format('YYYY-MM-DD'), (0, _dayjs.default)().format('YYYY-MM-DD')]
   };
-}
-
-function getFlat(arr) {
-  var nValue = [];
-  arr.forEach(function (item) {
-    if (item.length > 1) {
-      var suf = item.splice(1);
-      getFlat(suf);
+} // 级联选择器获取深层结构数据 type: 遍历子/父结构
+
+
+function getFlatItem(filterValues, originArr) {
+  var type = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'children';
+  var nArr = []; // 获取子级项
+
+  var getChildren = function getChildren(item) {
+    var _item$children;
+
+    if (type === 'parent') {
+      nArr.push(item);
+      return;
+    }
+
+    if (item === null || item === void 0 ? void 0 : (_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.length) {
+      item === null || item === void 0 ? void 0 : item.children.forEach(function (v) {
+        return getChildren(v);
+      });
     } else {
-      nValue.push.apply(nValue, (0, _toConsumableArray2.default)(item[0].children));
+      nArr.push(item);
+    }
+  }; // 检测到三级结构
+
+
+  filterValues.forEach(function (item) {
+    if (item.length === 1) {
+      var findItem = originArr.find(function (v) {
+        return v.value === item[item.length - 1];
+      });
+      getChildren(findItem);
+    }
+
+    if (item.length === 2) {
+      var findArr1 = originArr.find(function (v) {
+        return v.value === item[0];
+      }).children;
+
+      var _findItem = findArr1.find(function (v) {
+        return v.value === item[item.length - 1];
+      });
+
+      getChildren(_findItem);
+    }
+
+    if (item.length === 3) {
+      var _findArr = originArr.find(function (v) {
+        return v.value === item[0];
+      }).children;
+
+      var findArr2 = _findArr.find(function (v) {
+        return v.value === item[1];
+      }).children;
+
+      var _findItem2 = findArr2.find(function (v) {
+        return v.value === item[item.length - 1];
+      });
+
+      nArr.push(_findItem2);
     }
   });
-  return nValue;
+  return nArr;
 }

package/es/LmFilter/wrapper/Filter.js

@@ -18,13 +18,16 @@ var _complexFilter = _interopRequireDefault(require("../complexFilter"));
 // 筛选组合
 var LmFilter = /*#__PURE__*/_react.default.memo(function (_ref) {
   var instance = _ref.instance;
+  var enableBaisc = instance.enableBaisc,
+      enableComplex = instance.enableComplex,
+      enableCustom = instance.enableCustom;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "lm_filter"
-  }, /*#__PURE__*/_react.default.createElement(_customFilter.default, {
+  }, enableCustom && /*#__PURE__*/_react.default.createElement(_customFilter.default, {
     instance: instance
-  }), /*#__PURE__*/_react.default.createElement(_baseFilter.default, {
+  }), enableBaisc && /*#__PURE__*/_react.default.createElement(_baseFilter.default, {
     instance: instance
-  }), /*#__PURE__*/_react.default.createElement(_complexFilter.default, {
+  }), enableComplex && /*#__PURE__*/_react.default.createElement(_complexFilter.default, {
     instance: instance
   }));
 });