linkmore-design 1.0.91 → 1.0.95

package/es/LmFilter/complexFilter/valueDrawer.js

@@ -0,0 +1,235 @@
+"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;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
+
+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 _react = _interopRequireWildcard(require("react"));
+
+var _linkmoreDesign = require("linkmore-design");
+
+var _utils = require("../utils");
+
+var _Controls = _interopRequireDefault(require("../Controls"));
+
+// 第二层抽屉，弹出数据选择
+var ValueDrawer = function ValueDrawer(_ref) {
+  var instance = _ref.instance;
+  var state = instance.state,
+      dispatch = instance.dispatch,
+      dataSource = instance.dataSource;
+  var valueDrawer = state.valueDrawer,
+      complexDrawer = state.complexDrawer;
+
+  var _Form$useForm = _form.default.useForm(),
+      _Form$useForm2 = (0, _slicedToArray2.default)(_Form$useForm, 1),
+      form = _Form$useForm2[0];
+
+  var onClose = function onClose() {
+    dispatch({
+      type: 'changeValueDrawer',
+      valueDrawer: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, valueDrawer), {}, {
+        visible: false
+      })
+    });
+    form.resetFields();
+  };
+  /*
+   * customModal.data.type === 'nested' 时,处理不同(未增加)
+   *
+  */
+
+
+  var onSave = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+      var _yield$form$validateF, field, mode, value, filterValues, currentItem, isNested, nField, nValue, _value$subValue;
+
+      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;
+              mode = _yield$form$validateF.mode;
+              value = _yield$form$validateF.value;
+              // 选中的筛选数据
+              filterValues = (0, _objectSpread2.default)({}, complexDrawer.data); // 查找当前筛选的值
+
+              currentItem = valueDrawer.data; // 是否嵌套筛选
+
+              isNested = currentItem.type === 'nested'; // 嵌套筛选的键值不同
+
+              nField = valueDrawer.data.field;
+              nValue = value;
+
+              if (isNested) {
+                // 删除原有筛选
+                delete filterValues[currentItem.field];
+                currentItem.data.forEach(function (element) {
+                  delete filterValues[element.value];
+                }); // 存在子级嵌套时,改变键值
+
+                if (value === null || value === void 0 ? void 0 : (_value$subValue = value.subValue) === null || _value$subValue === void 0 ? void 0 : _value$subValue.children) {
+                  nField = value.subValue.value;
+                }
+
+                nValue = (value === null || value === void 0 ? void 0 : value.value) || [];
+              } // 判断是新增还是编辑
+
+
+              Object.assign(filterValues, (0, _defineProperty2.default)({}, nField, {
+                mode: mode,
+                value: nValue,
+                originField: currentItem.field
+              }));
+              dispatch({
+                type: 'changeComplexDrawer',
+                complexDrawer: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, complexDrawer), {}, {
+                  data: filterValues
+                })
+              });
+              onClose();
+              _context.next = 20;
+              break;
+
+            case 18:
+              _context.prev = 18;
+              _context.t0 = _context["catch"](0);
+
+            case 20:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[0, 18]]);
+    }));
+
+    return function onSave() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  var onValuesChange = function onValuesChange(values) {
+    if (values.field) {
+      form.setFieldsValue({
+        value: []
+      });
+    }
+
+    if (values.value) {
+      var _values$value;
+
+      // 嵌套筛选双击触发
+      if ((values === null || values === void 0 ? void 0 : (_values$value = values.value) === null || _values$value === void 0 ? void 0 : _values$value.type) === 'dbclick') {
+        onSave();
+      }
+    }
+  }; // 动态展示选择框
+
+
+  var DynamicSelect = (0, _react.useCallback)(function (_ref3) {
+    var getFieldValue = _ref3.getFieldValue;
+    var field = getFieldValue('field');
+    var findItem = (dataSource === null || dataSource === void 0 ? void 0 : dataSource.find(function (v) {
+      return v.field === field;
+    })) || {};
+    var options = (findItem === null || findItem === void 0 ? void 0 : findItem.data) || [];
+
+    if (field) {
+      return /*#__PURE__*/_react.default.createElement(_form.default.Item, {
+        name: "value",
+        label: "\u9009\u62E9\u5B57\u6BB5\u503C",
+        noStyle: true
+      }, /*#__PURE__*/_react.default.createElement(_Controls.default, {
+        item: findItem,
+        options: options
+      }));
+    }
+
+    return false;
+  }, [dataSource]);
+  var config = {
+    title: valueDrawer.data.title,
+    visible: valueDrawer.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 (valueDrawer.visible) {
+      form.setFieldsValue(valueDrawer.data);
+    }
+  }, [form, valueDrawer]);
+  return /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Drawer, config, /*#__PURE__*/_react.default.createElement(_form.default, {
+    form: form,
+    initialValues: {
+      mode: 'or'
+    },
+    onValuesChange: onValuesChange,
+    layout: "vertical",
+    size: "default",
+    className: "custom_form"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "custom_group"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "custom_label"
+  }, "\u67E5\u8BE2\u65B9\u5F0F"), /*#__PURE__*/_react.default.createElement(_form.default.Item, {
+    name: "mode",
+    label: "\u67E5\u8BE2\u65B9\u5F0F",
+    noStyle: true
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Radio.Group, {
+    direction: "column"
+  }, /*#__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")))), /*#__PURE__*/_react.default.createElement("div", {
+    className: "custom_group custom_full"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "custom_label"
+  }, "\u9009\u62E9\u5B57\u6BB5\u503C"), /*#__PURE__*/_react.default.createElement(_form.default.Item, {
+    noStyle: true,
+    shouldUpdate: function shouldUpdate(prevValues, currentValues) {
+      return prevValues.field !== currentValues.field;
+    }
+  }, DynamicSelect))));
+};
+
+var _default = ValueDrawer;
+exports.default = _default;

package/es/LmFilter/components/CascaderFilter.js

@@ -0,0 +1,160 @@
+"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/cascader/style");
+
+var _cascader = _interopRequireDefault(require("antd/es/cascader"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _linkmoreDesign = require("linkmore-design");
+
+var _InputSearchClose = _interopRequireDefault(require("./InputSearchClose"));
+
+var _hooks = require("../hooks");
+
+// 重置级联弹框
+var DropdownRender = function DropdownRender(_ref) {
+  var dom = _ref.dom,
+      instance = _ref.instance,
+      item = _ref.item,
+      setOptions = _ref.setOptions,
+      checkedValues = _ref.checkedValues;
+  var _instance$filterValue = instance.filterValue,
+      filterValue = _instance$filterValue === void 0 ? [] : _instance$filterValue,
+      setFilterValue = instance.setFilterValue,
+      visible = instance.visible,
+      setVisible = instance.setVisible;
+  var _item$data = item.data,
+      filters = _item$data === void 0 ? [] : _item$data;
+  var inputRef = (0, _react.useRef)(null);
+  var delayedFn = (0, _hooks.useDelayedFn)();
+  var isShowFoot = (0, _react.useMemo)(function () {
+    var _item$props;
+
+    return item === null || item === void 0 ? void 0 : (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.multiple;
+  }, [item]);
+
+  var handleFilter = function handleFilter(val) {
+    var serachValues = filters.filter(function (v) {
+      var _v, _item$props2, _item$props2$fieldNam;
+
+      return ((_v = v[(item === null || item === void 0 ? void 0 : (_item$props2 = item.props) === null || _item$props2 === void 0 ? void 0 : (_item$props2$fieldNam = _item$props2.fieldNames) === null || _item$props2$fieldNam === void 0 ? void 0 : _item$props2$fieldNam.label) || 'label']) === null || _v === void 0 ? void 0 : _v.indexOf(val)) > -1;
+    });
+    setOptions(serachValues);
+  }; // 确定
+
+
+  var handleSure = function handleSure() {
+    setFilterValue(checkedValues);
+    setVisible === null || setVisible === void 0 ? void 0 : setVisible(false);
+  }; // 取消
+
+
+  var handleReset = function handleReset() {
+    return setVisible === null || setVisible === void 0 ? void 0 : setVisible(false);
+  };
+
+  (0, _react.useEffect)(function () {
+    if (visible) {
+      delayedFn(function () {
+        var _inputRef$current, _inputRef$current$foc;
+
+        return (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : (_inputRef$current$foc = _inputRef$current.focus) === null || _inputRef$current$foc === void 0 ? void 0 : _inputRef$current$foc.call(_inputRef$current, {
+          cursor: 'all'
+        });
+      });
+    }
+  }, [visible]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_dropdown"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_header"
+  }, /*#__PURE__*/_react.default.createElement(_InputSearchClose.default, {
+    ref: inputRef,
+    onSearch: handleFilter,
+    onChange: handleFilter
+  })), dom, isShowFoot && /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_footer"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "footer_clear",
+    onClick: handleReset
+  }, "\u53D6\u6D88"), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Button, {
+    type: "primary",
+    size: "small",
+    onClick: handleSure
+  }, "\u786E\u5B9A")));
+};
+
+var CascaderFilter = function CascaderFilter(_ref2) {
+  var instance = _ref2.instance,
+      itemProps = _ref2.item;
+  var _instance$filterValue2 = instance.filterValue,
+      filterValue = _instance$filterValue2 === void 0 ? [] : _instance$filterValue2,
+      setFilterValue = instance.setFilterValue,
+      visible = instance.visible,
+      setVisible = instance.setVisible,
+      _instance$children = instance.children,
+      children = _instance$children === void 0 ? /*#__PURE__*/_react.default.createElement("div", null) : _instance$children;
+  var _itemProps$data = itemProps.data,
+      filters = _itemProps$data === void 0 ? [] : _itemProps$data;
+
+  var _useState = (0, _react.useState)(filters),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      options = _useState2[0],
+      setOptions = _useState2[1];
+
+  var _useState3 = (0, _react.useState)([]),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      checkedValues = _useState4[0],
+      setCheckedValues = _useState4[1];
+
+  var defaultValue = (0, _react.useMemo)(function () {
+    return filterValue;
+  }, [filterValue]);
+
+  var onChange = function onChange(item, selectedOptions) {
+    var _itemProps$props;
+
+    setCheckedValues(item);
+
+    if (!(itemProps === null || itemProps === void 0 ? void 0 : (_itemProps$props = itemProps.props) === null || _itemProps$props === void 0 ? void 0 : _itemProps$props.multiple)) {
+      setFilterValue(item);
+    }
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_cascader.default, (0, _extends2.default)({}, itemProps.props, {
+    options: options,
+    onChange: onChange,
+    defaultValue: defaultValue,
+    open: visible,
+    onDropdownVisibleChange: function onDropdownVisibleChange(vis) {
+      return setVisible(vis);
+    },
+    dropdownRender: function dropdownRender(dom) {
+      return /*#__PURE__*/_react.default.createElement(DropdownRender, {
+        dom: dom,
+        instance: instance,
+        item: itemProps,
+        checkedValues: checkedValues,
+        setCheckedValues: setCheckedValues,
+        setOptions: setOptions
+      });
+    }
+  }), children));
+};
+
+var _default = CascaderFilter;
+exports.default = _default;

package/es/LmFilter/components/CheckboxFilter.js

@@ -0,0 +1,189 @@
+"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 _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _linkmoreDesign = require("linkmore-design");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _InputSearchClose = _interopRequireDefault(require("./InputSearchClose"));
+
+var _EmptyFilter = _interopRequireDefault(require("./EmptyFilter"));
+
+var _utils = require("../utils");
+
+var _hooks = require("../hooks");
+
+var _excluded = ["item"];
+var useIsomorphicLayoutEffect = typeof window !== 'undefined' ? _react.useLayoutEffect : _react.useEffect;
+
+var CheckboxFilter = function CheckboxFilter(_ref) {
+  var instance = _ref.instance,
+      itemProps = _ref.item;
+  var _instance$filterValue = instance.filterValue,
+      filterValue = _instance$filterValue === void 0 ? [] : _instance$filterValue,
+      setFilterValue = instance.setFilterValue,
+      visible = instance.visible,
+      setVisible = instance.setVisible;
+  var _itemProps$data = itemProps.data,
+      filters = _itemProps$data === void 0 ? [] : _itemProps$data;
+  var inputRef = (0, _react.useRef)(); // 选中的数据项: [key, key, ...];
+
+  var _useState = (0, _react.useState)(filterValue),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      checkedValues = _useState2[0],
+      setCheckedValues = _useState2[1]; // 选中的数据的键
+  // const checkedKeys = useMemo(() => checkedValues.map(v => v), [checkedValues]);
+  // 搜索后的筛选项
+
+
+  var _useState3 = (0, _react.useState)(filters),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      options = _useState4[0],
+      setOptions = _useState4[1];
+
+  var delayedFn = (0, _hooks.useDelayedFn)(); // 是否存在搜索, 当数据大于8时存在搜索
+
+  var isSearch = (0, _react.useMemo)(function () {
+    return filters.length > 8;
+  }, [filters.length]); // 是否全选: 选中的数据大于等于筛选后的数据 && 筛选后的数据全部存在于选中的数据中
+
+  var checkAll = (0, _react.useMemo)(function () {
+    var isAll = checkedValues.length >= options.length;
+    return isAll && options.every(function (_ref2) {
+      var value = _ref2.value;
+      return checkedValues.some(function (v) {
+        return v === value;
+      });
+    });
+  }, [checkedValues, options]); // 是否半选: 存在选中的数据 && 未全选
+
+  var indeterminate = (0, _react.useMemo)(function () {
+    return checkedValues.length && !checkAll;
+  }, [checkedValues.length, checkAll]); // 搜索
+
+  var handleFilter = function handleFilter() {
+    var val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+    var serachValues = filters.filter(function (v) {
+      return v.label.indexOf(val) > -1;
+    });
+    setOptions(serachValues);
+  }; // 单选事件
+
+
+  var onChange = function onChange(e, item) {
+    e.preventDefault();
+    var nValue = checkedValues.some(function (value) {
+      return value === item.value;
+    }) ? checkedValues.filter(function (value) {
+      return value !== item.value;
+    }) : (0, _utils.uniqueFunc)([].concat((0, _toConsumableArray2.default)(checkedValues), [item.value]), 'value');
+    setCheckedValues(nValue);
+  }; // 全选事件
+
+
+  var onCheckAllChange = function onCheckAllChange() {
+    var nValue = checkAll ? checkedValues.filter(function (value) {
+      return !options.some(function (v) {
+        return v.value === value;
+      });
+    }) : (0, _utils.uniqueFunc)([].concat((0, _toConsumableArray2.default)(checkedValues), (0, _toConsumableArray2.default)(options)), 'value');
+    setCheckedValues(nValue);
+  }; // 取消 不执行查询操作 关闭下拉框
+
+
+  var handleCancel = function handleCancel() {
+    // 手动触发内容改变(不会触发onChange事件)
+    setVisible === null || setVisible === void 0 ? void 0 : setVisible(false);
+  }; // 确定 执行查询操作
+
+
+  var handleSure = function handleSure() {
+    setFilterValue(checkedValues);
+  }; // 展开下拉时触发: 赋值 && 聚焦 && 重置显示内容
+
+
+  useIsomorphicLayoutEffect(function () {
+    if (visible) {
+      delayedFn(function () {
+        var _inputRef$current;
+
+        return (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus({
+          cursor: 'all'
+        });
+      }); // 若开启了 Dropdown => destroyPopupOnHide=true 无需重置操作 反之需开启
+      // setCheckedValues(filterValue);
+      // inputRef.current?.setValue?.('');
+      // handleFilter('');
+    }
+  }, [visible]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_dropdown"
+  }, isSearch && /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_header"
+  }, /*#__PURE__*/_react.default.createElement(_InputSearchClose.default, {
+    ref: inputRef,
+    onSearch: handleFilter,
+    onChange: handleFilter
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_header_operate"
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
+    indeterminate: indeterminate,
+    onChange: onCheckAllChange,
+    checked: checkAll,
+    className: "filter_tip"
+  }, "\u5168\u90E8"), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", {
+    className: "filter_tip"
+  }, "\u5DF2\u9009: ", checkedValues.length)))), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox.Group, {
+    value: checkedValues,
+    className: "filter_body"
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.VirtualList, {
+    options: options,
+    className: "filter_list"
+  }, function (_ref3) {
+    var item = _ref3.item,
+        resetProps = (0, _objectWithoutProperties2.default)(_ref3, _excluded);
+    return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, resetProps, {
+      className: (0, _classnames.default)('filter_item', {
+        checked: checkedValues.some(function (value) {
+          return value === item.value;
+        })
+      }),
+      onClick: function onClick(e) {
+        return onChange(e, item);
+      }
+    }), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
+      value: item.value,
+      className: "filter_item_content"
+    }, item.label));
+  }), !options.length && /*#__PURE__*/_react.default.createElement(_EmptyFilter.default, null)), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_footer"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "footer_clear",
+    onClick: handleCancel
+  }, "\u53D6\u6D88"), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Button, {
+    type: "primary",
+    size: "small",
+    onClick: handleSure
+  }, "\u786E\u5B9A")));
+};
+
+var _default = CheckboxFilter;
+exports.default = _default;