linkmore-design 1.0.23 → 1.0.26

package/es/ButtonTags/style/style.css

@@ -75,6 +75,9 @@
   font-size: 14px;
   font-weight: 500;
 }
+.ant-notification-notice .ant-notification-notice-content > div > div:last-child {
+  margin-bottom: 8px;
+}
 .ant-notification-notice .ant-notification-notice-description {
   font-size: 12px;
 }

package/es/Card/style/index.css

@@ -75,6 +75,9 @@
   font-size: 14px;
   font-weight: 500;
 }
+.ant-notification-notice .ant-notification-notice-content > div > div:last-child {
+  margin-bottom: 8px;
+}
 .ant-notification-notice .ant-notification-notice-description {
   font-size: 12px;
 }

package/es/CkFilter/baseFilter/NestedFilter.js

@@ -0,0 +1,137 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/drawer/style");
+
+var _drawer = _interopRequireDefault(require("antd/es/drawer"));
+
+require("antd/es/space/style");
+
+var _space = _interopRequireDefault(require("antd/es/space"));
+
+require("antd/es/button/style");
+
+var _button = _interopRequireDefault(require("antd/es/button"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context = require("../context");
+
+var _utils = require("../utils");
+
+var NestedFilter = function NestedFilter() {
+  var _data$body;
+
+  var _useStore = (0, _context.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch;
+
+  var instance = state.instance,
+      _state$nestedDrawer = state.nestedDrawer,
+      visible = _state$nestedDrawer.visible,
+      field = _state$nestedDrawer.field,
+      _state$nestedDrawer$d = _state$nestedDrawer.data,
+      data = _state$nestedDrawer$d === void 0 ? {} : _state$nestedDrawer$d; // 用于缓存数据 1.[{value: '', label: ''}, ...] / 2.{value: []/'', label: []/''}
+
+  var aliveValue = (0, _react.useRef)([]);
+
+  var onClose = function onClose() {
+    dispatch({
+      type: 'changeNestedDrawer',
+      nestedDrawer: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, state.nestedDrawer), {}, {
+        visible: false
+      })
+    });
+  };
+
+  var onSave = function onSave() {
+    var _state$instance$onCha, _state$instance;
+
+    var value = aliveValue.current.map(function (v) {
+      return v.value;
+    }); // 选中的数据
+
+    var childrenField = data.value; // 选中的字段
+
+    var valueLabel = aliveValue.current.map(function (v) {
+      return v.label;
+    }).join('、'); // 字段文本
+
+    var nValue = (0, _objectSpread2.default)({}, state.filterValues); // 过滤的值
+
+    delete nValue[field]; // 删除父级过滤项
+    // 删除所有子级过滤项
+
+    state.instance.data.find(function (v) {
+      return v.field === field;
+    }).data.forEach(function (element) {
+      delete nValue[element.value];
+    });
+    (0, _utils.getIsHas)(value) ? nValue[childrenField] = value : delete nValue[childrenField]; // 保存筛选
+
+    dispatch({
+      type: 'changeFilterValues',
+      filterValues: nValue
+    }); // 保存一个嵌套过滤
+
+    (0, _utils.getIsHas)(valueLabel) && dispatch({
+      type: 'changeNestedFilterValues',
+      nestedFilterValues: (0, _defineProperty2.default)({}, field, {
+        value: value,
+        label: valueLabel,
+        field: childrenField
+      })
+    });
+    (_state$instance$onCha = (_state$instance = state.instance).onChange) === null || _state$instance$onCha === void 0 ? void 0 : _state$instance$onCha.call(_state$instance, nValue, state.customFilterValues);
+    onClose === null || onClose === void 0 ? void 0 : onClose();
+  };
+
+  var onChange = function onChange(value, type) {
+    aliveValue.current = value;
+
+    if (type === 'dbclick') {
+      onSave === null || onSave === void 0 ? void 0 : onSave();
+    }
+  };
+
+  var config = {
+    title: data.label,
+    visible: visible,
+    onClose: onClose,
+    width: 720,
+    placement: 'right',
+    destroyOnClose: true,
+    className: 'filter_drawer',
+    bodyStyle: {
+      padding: '24px 24px 0'
+    },
+    extra: /*#__PURE__*/_react.default.createElement(_space.default, null, /*#__PURE__*/_react.default.createElement(_button.default, {
+      onClick: onClose,
+      size: "small"
+    }, "\u53D6\u6D88"), /*#__PURE__*/_react.default.createElement(_button.default, {
+      type: "primary",
+      onClick: onSave,
+      size: "small"
+    }, "\u786E\u5B9A"))
+  };
+  return /*#__PURE__*/_react.default.createElement(_drawer.default, config, (_data$body = data.body) === null || _data$body === void 0 ? void 0 : _data$body.call(data, {
+    value: data.value,
+    onChange: onChange,
+    item: data
+  }));
+};
+
+var _default = NestedFilter;
+exports.default = _default;

package/es/CkFilter/baseFilter/filterMenu.js

@@ -52,20 +52,25 @@ var FilterMenu = function FilterMenu(props) {
 
   var filterValue = (0, _react.useMemo)(function () {
     return state.filterValues[field];
-  }, [state.filterValues]); // 判断是否正在过滤
+  }, [state.filterValues]); // 判断是否正在过滤,普通过滤 && 嵌套过滤
 
   var isFiltering = (0, _react.useMemo)(function () {
     return (0, _utils.getIsHas)(filterValue) || (0, _utils.getIsHas)(state.nestedFilterValues[field]);
-  }, [filterValue]); // 设置过滤的内容 filterType: 'single' 存在时 单个勾选时触发, 默认按钮触发
+  }, [filterValue, state.nestedFilterValues]); // 设置过滤的内容 filterType: 'single' 存在时 单个勾选时触发, 默认按钮触发
 
   var setFilterValue = (0, _react.useCallback)(function (val, filterType) {
-    var _state$instance$onCha, _state$instance2;
+    var _state$instance$onCha, _state$instance;
 
     // 嵌套结构时触发
     if (filterType === 'children') {
-      var _state$instance$onNes, _state$instance;
-
-      (_state$instance$onNes = (_state$instance = state.instance).onNested) === null || _state$instance$onNes === void 0 ? void 0 : _state$instance$onNes.call(_state$instance, val);
+      dispatch({
+        type: 'changeNestedDrawer',
+        nestedDrawer: {
+          visible: true,
+          data: val,
+          field: field
+        }
+      });
       setVisible(false);
       return;
     }
@@ -90,7 +95,7 @@ var FilterMenu = function FilterMenu(props) {
       filterValues: nValue
     }); // 触发外部查询, 单击时不关闭菜单
 
-    (_state$instance$onCha = (_state$instance2 = state.instance).onChange) === null || _state$instance$onCha === void 0 ? void 0 : _state$instance$onCha.call(_state$instance2, nValue, state.customFilterValues);
+    (_state$instance$onCha = (_state$instance = state.instance).onChange) === null || _state$instance$onCha === void 0 ? void 0 : _state$instance$onCha.call(_state$instance, nValue, state.customFilterValues);
     !filterType && setVisible(false);
   }, [dispatch, field, state.filterValues, state.instance]); // 展示的内容
 

package/es/CkFilter/baseFilter/index.js

@@ -25,6 +25,8 @@ var _filterMenu = _interopRequireDefault(require("./filterMenu"));
 
 var _moreFilters = _interopRequireDefault(require("./moreFilters"));
 
+var _NestedFilter = _interopRequireDefault(require("./NestedFilter"));
+
 /* 二级筛选：基础过滤
  * data
  *
@@ -82,7 +84,7 @@ var Filter = function Filter() {
     return /*#__PURE__*/_react.default.createElement(_filterMenu.default, (0, _extends2.default)({
       key: v.field
     }, v));
-  }), isMore && /*#__PURE__*/_react.default.createElement(_moreFilters.default, null)));
+  }), isMore && /*#__PURE__*/_react.default.createElement(_moreFilters.default, null)), /*#__PURE__*/_react.default.createElement(_NestedFilter.default, null));
 };
 
 var _default = Filter;

package/es/CkFilter/baseFilter/moreFilters.js

@@ -139,6 +139,18 @@ var MoreFilters = function MoreFilters() {
           return v !== item.field;
         })))
       });
+    }
+
+    if (type === 'move') {
+      var cloneArr = (0, _toConsumableArray2.default)(state.orderFields);
+      var findIndex = cloneArr.findIndex(function (v) {
+        return v === item.over;
+      });
+      cloneArr.splice(findIndex, 0, item.active);
+      dispatch({
+        type: 'changeOrderFields',
+        orderFields: cloneArr
+      });
     } // 全选操作
 
 
@@ -171,7 +183,9 @@ var MoreFilters = function MoreFilters() {
     } // 人性化设计,位置不变无需收起
 
 
-    type !== 'top' && setVisible(false); // 收起下拉选项框
+    if (['top'].includes(type)) {
+      setVisible(false); // 收起下拉选项框
+    }
   }, [dispatch, state]);
   var FilterControl = (0, _react.useCallback)(function () {
     var _state$instance$data;

package/es/CkFilter/complexFilter/drawer.js

@@ -50,17 +50,20 @@ var ListItemChecked = function ListItemChecked(props) {
       fullData = _state$instance$fullD === void 0 ? [] : _state$instance$fullD,
       data = state.complexDrawer.data;
   var field = props.field,
-      value = props.value; // 单项匹配数据, 根据字段名查找
+      _props$value = props.value,
+      value = _props$value === void 0 ? {} : _props$value; // 单项匹配数据, 根据字段名查找, 嵌套筛选时查询父级
 
   var getItem = (0, _react.useMemo)(function () {
     return fullData.find(function (v) {
-      return v.field === field;
+      return [field, value.originField].includes(v.field);
     });
-  }, [field, fullData]); // 级联选择器的选中值
+  }, [props, fullData]); // 选中值的处理
 
-  var cascaderValue = (0, _react.useMemo)(function () {
+  var resetValue = (0, _react.useMemo)(function () {
     if (getItem.type === 'cascader') {
-      return value.value.map(function (v) {
+      var _value$value;
+
+      return (_value$value = value.value) === null || _value$value === void 0 ? void 0 : _value$value.map(function (v) {
         return v[v.length - 1];
       });
     }
@@ -72,7 +75,7 @@ var ListItemChecked = function ListItemChecked(props) {
     arr.forEach(function (item) {
       var _item$children;
 
-      if (cascaderValue.includes(item.value)) {
+      if (resetValue.includes(item.value)) {
         preArr.push(item);
       }
 
@@ -87,6 +90,10 @@ var ListItemChecked = function ListItemChecked(props) {
     var checkedValue = value.value;
 
     if (Array.isArray(checkedValue)) {
+      if (getItem.type === 'nested') {
+        return checkedValue;
+      }
+
       if (getItem.type === 'cascader') {
         var arr = [];
         deepChildren(getItem.data, arr);
@@ -99,9 +106,9 @@ var ListItemChecked = function ListItemChecked(props) {
     }
 
     if (getItem.type === 'input') {
-      return cascaderValue ? [{
-        value: cascaderValue,
-        label: cascaderValue
+      return resetValue ? [{
+        value: resetValue,
+        label: resetValue
       }] : [];
     }
 
@@ -322,10 +329,19 @@ var Index = function Index() {
         }
       });
     }
-  }, [dispatch, visible]); // 弹窗配置项
+  }, [dispatch, visible]);
+
+  var Tit = function Tit() {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      onClick: function onClick() {
+        console.log('title', state);
+      }
+    }, "\u9AD8\u7EA7\u67E5\u8BE2");
+  }; // 弹窗配置项
+
 
   var config = {
-    title: '高级查询',
+    title: /*#__PURE__*/_react.default.createElement(Tit, null),
     visible: visible,
     onClose: onClose,
     width: 440,

package/es/CkFilter/components/Controls.js

@@ -21,6 +21,8 @@ var _CheckboxTags = _interopRequireDefault(require("./CheckboxTags"));
 
 var _CascaderFilter = _interopRequireDefault(require("./CascaderFilter"));
 
+var _Nested = _interopRequireDefault(require("./Nested"));
+
 var _excluded = ["type", "options"];
 
 var Controls = function Controls(props) {
@@ -31,11 +33,17 @@ var Controls = function Controls(props) {
     'select': /*#__PURE__*/_react.default.createElement(_CheckboxTags.default, (0, _extends2.default)({
       options: options
     }, resetProps)),
+    'checkbox': /*#__PURE__*/_react.default.createElement(_CheckboxTags.default, (0, _extends2.default)({
+      options: options
+    }, resetProps)),
     'cascader': /*#__PURE__*/_react.default.createElement(_CascaderFilter.default, (0, _extends2.default)({
       options: options
     }, resetProps)),
     'input': /*#__PURE__*/_react.default.createElement(_input.default, (0, _extends2.default)({
       placeholder: "\u8BF7\u8F93\u5165"
+    }, resetProps)),
+    'nested': /*#__PURE__*/_react.default.createElement(_Nested.default, (0, _extends2.default)({
+      options: options
     }, resetProps))
   };
   return obj[type] || null;

package/es/CkFilter/components/DragBox/DndContainer.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@dnd-kit/core");
+
+var _modifiers = require("@dnd-kit/modifiers");
+
+var _sortable = require("@dnd-kit/sortable");
+
+// 可拖拽容器
+var DndContainer = function DndContainer(_ref) {
+  var children = _ref.children,
+      move = _ref.move;
+  var sensors = (0, _core.useSensors)((0, _core.useSensor)(_core.PointerSensor), (0, _core.useSensor)(_core.KeyboardSensor, {
+    coordinateGetter: _sortable.sortableKeyboardCoordinates
+  })); // 拖拽结束
+
+  var handleDragEnd = function handleDragEnd(event) {
+    var active = event.active,
+        over = event.over; // 未移入时触发
+
+    if (!(over === null || over === void 0 ? void 0 : over.id)) {
+      return;
+    } // 移入时触发更新数据
+
+
+    if (active.id !== over.id) {
+      move(active.data.current.field, over.data.current.field);
+    }
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_core.DndContext, {
+    sensors: sensors,
+    collisionDetection: _core.closestCenter,
+    onDragEnd: handleDragEnd,
+    modifiers: [_modifiers.restrictToParentElement]
+  }, children);
+};
+
+var _default = DndContainer;
+exports.default = _default;

package/es/CkFilter/components/DragBox/index.js

@@ -0,0 +1,64 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _linkmoreDesign = require("linkmore-design");
+
+var _DndContainer = _interopRequireDefault(require("./DndContainer"));
+
+var _sortableBox = _interopRequireDefault(require("./sortableBox"));
+
+var _sortableItem = _interopRequireDefault(require("./sortableItem"));
+
+var _excluded = ["options", "checkedValues", "setFilterValue"];
+
+var Drag = function Drag(_ref) {
+  var _ref$options = _ref.options,
+      options = _ref$options === void 0 ? [] : _ref$options,
+      _ref$checkedValues = _ref.checkedValues,
+      checkedValues = _ref$checkedValues === void 0 ? [] : _ref$checkedValues,
+      setFilterValue = _ref.setFilterValue,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var move = function move(active, over) {
+    console.log('handleMove', active, over);
+    setFilterValue({
+      active: active,
+      over: over
+    }, 'move');
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_DndContainer.default, {
+    move: move
+  }, /*#__PURE__*/_react.default.createElement(_sortableBox.default, {
+    items: options.map(function (v) {
+      return "drag".concat(v.field);
+    })
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox.Group, {
+    value: checkedValues,
+    className: "filter_body"
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.VirtualList, {
+    options: options,
+    className: "filter_list"
+  }, function (virProps) {
+    return /*#__PURE__*/_react.default.createElement(_sortableItem.default, (0, _extends2.default)({}, virProps, {
+      options: options,
+      checkedValues: checkedValues,
+      setFilterValue: setFilterValue
+    }, props));
+  })))));
+};
+
+var _default = Drag;
+exports.default = _default;

package/es/CkFilter/components/DragBox/sortableBox.js

@@ -0,0 +1,24 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _sortable = require("@dnd-kit/sortable");
+
+var SortableBox = function SortableBox(_ref) {
+  var items = _ref.items,
+      children = _ref.children;
+  return /*#__PURE__*/_react.default.createElement(_sortable.SortableContext, {
+    items: items,
+    strategy: _sortable.verticalListSortingStrategy
+  }, children);
+};
+
+var _default = SortableBox;
+exports.default = _default;

package/es/CkFilter/components/DragBox/sortableItem.js

@@ -0,0 +1,107 @@
+"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 _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _icons = require("@ant-design/icons");
+
+var _linkmoreDesign = require("linkmore-design");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _sortable = require("@dnd-kit/sortable");
+
+var _utilities = require("@dnd-kit/utilities");
+
+var _excluded = ["item", "filters", "options", "checkedValues", "setFilterValue", "setCheckedValues"];
+
+var SortableItem = function SortableItem(props) {
+  var virItem = props.item,
+      filters = props.filters,
+      options = props.options,
+      checkedValues = props.checkedValues,
+      setFilterValue = props.setFilterValue,
+      setCheckedValues = props.setCheckedValues,
+      resetProps = (0, _objectWithoutProperties2.default)(props, _excluded);
+
+  var _useSortable = (0, _sortable.useSortable)({
+    id: "drag".concat(virItem.field),
+    data: (0, _objectSpread2.default)({}, virItem)
+  }),
+      attributes = _useSortable.attributes,
+      listeners = _useSortable.listeners,
+      setNodeRef = _useSortable.setNodeRef,
+      transform = _useSortable.transform,
+      transition = _useSortable.transition;
+
+  var style = {
+    transform: _utilities.CSS.Transform.toString(transform),
+    transition: transition
+  }; // 是否可置顶, 第一项无置顶操作, 所以这里的index > 0
+
+  var isTop = (0, _react.useCallback)(function (item) {
+    return checkedValues.includes(item.field) && filters.findIndex(function (v) {
+      return v.field === item.field;
+    }) > 0;
+  }, [checkedValues, filters]); // 置顶操作, 防止频繁操作, 建议加上节流
+
+  var handleTop = function handleTop(e, item) {
+    e.stopPropagation();
+    setFilterValue(item, 'top');
+  }; // 单选事件
+
+
+  var onChange = function onChange(e, item) {
+    e.preventDefault();
+    e.stopPropagation(); // setFilterValue(item)
+
+    var nValue = checkedValues.includes(item.field) ? checkedValues.filter(function (v) {
+      return v !== item.field;
+    }) : [].concat((0, _toConsumableArray2.default)(checkedValues), [item.field]);
+    setCheckedValues(nValue);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+    ref: setNodeRef,
+    style: style
+  }, attributes), /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, resetProps, {
+    className: (0, _classnames.default)('filter_item', {
+      checked: checkedValues.includes(virItem.field)
+    }),
+    onClick: function onClick(e) {
+      return onChange(e, virItem);
+    }
+  }), /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+    className: "pointer_move"
+  }, listeners), /*#__PURE__*/_react.default.createElement(_icons.HolderOutlined, null)), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
+    value: virItem.field,
+    className: "filter_item-content"
+  }, virItem.title), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_item_operate"
+  }, isTop(virItem) && /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
+    type: "lmweb-vertical-align-top",
+    className: "hover_show icon_top",
+    onClick: function onClick(e) {
+      return handleTop(e, virItem);
+    }
+  })))));
+};
+
+var _default = SortableItem;
+exports.default = _default;