linkmore-design 1.0.30 → 1.0.33

package/es/CkFilter/components/CustomModal.js

@@ -0,0 +1,230 @@
+"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 _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+require("antd/es/form/style");
+
+var _form = _interopRequireDefault(require("antd/es/form"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _linkmoreDesign = require("linkmore-design");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context2 = require("../context");
+
+var _utils = require("../utils");
+
+var _Controls = _interopRequireDefault(require("./Controls"));
+
+var _excluded = ["field"];
+
+// const { EditModal } = Modal
+// 第二层抽屉，弹出数据选择
+var ModalItem = function ModalItem() {
+  var _useStore = (0, _context2.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch;
+
+  var customModal = state.customModal,
+      customDrawer = state.customDrawer,
+      complexDrawer = state.complexDrawer,
+      instance = state.instance;
+
+  var _Form$useForm = _form.default.useForm(),
+      _Form$useForm2 = (0, _slicedToArray2.default)(_Form$useForm, 1),
+      form = _Form$useForm2[0]; // 是否编辑
+
+
+  var isEdit = (0, _react.useMemo)(function () {
+    var type = customModal.type,
+        data = customModal.data;
+    return type === 'complex' || (0, _utils.getIsHas)(data);
+  }, [customModal]);
+
+  var onClose = function onClose() {
+    dispatch({
+      type: 'changeModal',
+      customModal: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, customModal), {}, {
+        visible: false
+      })
+    });
+    form.resetFields();
+  };
+
+  var onSave = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+      var _yield$form$validateF, field, values, filterValues;
+
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              _context.next = 3;
+              return form.validateFields();
+
+            case 3:
+              _yield$form$validateF = _context.sent;
+              field = _yield$form$validateF.field;
+              values = (0, _objectWithoutProperties2.default)(_yield$form$validateF, _excluded);
+              filterValues = customModal.type === 'complex' ? (0, _objectSpread2.default)({}, complexDrawer.data) : (0, _objectSpread2.default)({}, customDrawer.data.filterValues); // 判断是新增还是编辑
+
+              if (isEdit) {
+                Object.assign(filterValues, (0, _defineProperty2.default)({}, customModal.data.field, values));
+              } else {
+                Object.assign(filterValues, (0, _defineProperty2.default)({}, field, values));
+              }
+
+              if (customModal.type === 'complex') {
+                dispatch({
+                  type: 'changeComplexDrawer',
+                  complexDrawer: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, complexDrawer), {}, {
+                    data: filterValues
+                  })
+                });
+              } else {
+                dispatch({
+                  type: 'changeDrawer',
+                  customDrawer: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, customDrawer), {}, {
+                    data: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, customDrawer.data), {}, {
+                      filterValues: filterValues
+                    })
+                  })
+                });
+              }
+
+              onClose();
+              _context.next = 15;
+              break;
+
+            case 12:
+              _context.prev = 12;
+              _context.t0 = _context["catch"](0);
+              console.log('校验错误！', _context.t0);
+
+            case 15:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[0, 12]]);
+    }));
+
+    return function onSave() {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  var onValuesChange = function onValuesChange(values) {
+    if (values.field) {
+      form.setFieldsValue({
+        value: []
+      });
+    }
+  }; // 动态展示选择框
+
+
+  var DynamicSelect = (0, _react.useCallback)(function (_ref2) {
+    var _instance$fullData, _instance$fullData$fi;
+
+    var getFieldValue = _ref2.getFieldValue;
+    var field = getFieldValue('field');
+    var options = ((_instance$fullData = instance.fullData) === null || _instance$fullData === void 0 ? void 0 : (_instance$fullData$fi = _instance$fullData.find(function (v) {
+      return v.field === field;
+    })) === null || _instance$fullData$fi === void 0 ? void 0 : _instance$fullData$fi.data) || [];
+
+    if (field) {
+      return /*#__PURE__*/_react.default.createElement(_form.default.Item, {
+        name: "value",
+        label: "\u9009\u62E9\u5B57\u6BB5\u503C"
+      }, /*#__PURE__*/_react.default.createElement(_Controls.default, (0, _extends2.default)({
+        visible: customModal.visible
+      }, customModal.data, {
+        options: options
+      })));
+    }
+
+    return false;
+  }, [instance.fullData, customModal.data.type]);
+  var config = {
+    title: isEdit ? customModal.data.title : '新增查询项',
+    visible: customModal.type === 'custom' && customModal.visible,
+    onClose: onClose,
+    className: 'lm_det_drawer',
+    extra: /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Space, {
+      size: 8
+    }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Button, {
+      key: "cancel",
+      onClick: onClose,
+      size: "small"
+    }, "\u53D6\u6D88"), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Button, {
+      type: "primary",
+      key: "back",
+      onClick: onSave,
+      size: "small"
+    }, "\u786E\u5B9A"))
+  }; // 初始化重置数据
+
+  (0, _react.useEffect)(function () {
+    if (customModal.visible) {
+      form.setFieldsValue(customModal.data);
+    }
+  }, [form, customModal]);
+  return /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Drawer, config, /*#__PURE__*/_react.default.createElement("div", {
+    className: "custom_modal"
+  }, /*#__PURE__*/_react.default.createElement(_form.default, {
+    form: form,
+    initialValues: {
+      mode: 'or'
+    },
+    onValuesChange: onValuesChange,
+    layout: "vertical",
+    size: "default"
+  }, /*#__PURE__*/_react.default.createElement(_form.default.Item, {
+    name: "mode",
+    label: "\u67E5\u8BE2\u65B9\u5F0F"
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Radio.Group, null, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Radio, {
+    value: "and"
+  }, "\u4E14,\u67E5\u8BE2\u540C\u65F6\u6EE1\u8DB3\u6B64\u9009\u9879\u6761\u4EF6"), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Radio, {
+    value: "or"
+  }, "\u6216,\u67E5\u8BE2\u5305\u542B\u6B64\u9009\u9879\u6761\u4EF6"))), !isEdit && /*#__PURE__*/_react.default.createElement(_form.default.Item, {
+    name: "field",
+    label: "\u9009\u62E9\u5B57\u6BB5"
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Select, {
+    open: true
+  }, state.instance.fullData.map(function (v) {
+    return /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Select.Option, {
+      key: v.field,
+      value: v.field
+    }, v.title);
+  }))), /*#__PURE__*/_react.default.createElement(_form.default.Item, {
+    noStyle: true,
+    shouldUpdate: function shouldUpdate(prevValues, currentValues) {
+      return prevValues.field !== currentValues.field;
+    }
+  }, DynamicSelect))));
+};
+
+var _default = ModalItem;
+exports.default = _default;

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,63 @@
+"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) {
+    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,111 @@
+"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, {
+    style: {
+      color: 'var(--tip-text-color)'
+    }
+  })), /*#__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;

package/es/CkFilter/components/Nested.js

@@ -0,0 +1,90 @@
+"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 _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _linkmoreDesign = require("linkmore-design");
+
+var _excluded = ["value", "onChange", "options"];
+
+var Nested = function Nested(_ref) {
+  var _aliveActive$body;
+
+  var value = _ref.value,
+      onChange = _ref.onChange,
+      options = _ref.options,
+      resetProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)({}),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      aliveActive = _useState2[0],
+      setAliveActive = _useState2[1];
+
+  var handleClick = function handleClick(item) {
+    setAliveActive(item);
+
+    if (!item.children) {
+      onChange({
+        subValue: item,
+        value: [(0, _objectSpread2.default)({}, item)]
+      });
+    }
+  };
+  /*
+   * @Array val 选中的数据数组: [{}, ...]
+   * @String subValue 选中的子级
+   * 
+  */
+
+
+  var handleOnChange = function handleOnChange(val, type) {
+    onChange({
+      subValue: aliveActive,
+      value: val,
+      type: type
+    });
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Space, {
+    size: 8,
+    wrap: true
+  }, options === null || options === void 0 ? void 0 : options.map(function (v) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: v.value,
+      className: (0, _classnames.default)('checkbox_tag', {
+        active: aliveActive.value === v.value
+      }),
+      onClick: function onClick() {
+        return handleClick(v);
+      }
+    }, v.label);
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      flex: 1,
+      marginTop: 16
+    }
+  }, (_aliveActive$body = aliveActive.body) === null || _aliveActive$body === void 0 ? void 0 : _aliveActive$body.call(aliveActive, {
+    value: aliveActive.value,
+    onChange: handleOnChange,
+    item: aliveActive
+  })));
+};
+
+var _default = Nested;
+exports.default = _default;