@pisell/materials 1.0.472 → 1.0.473

package/es/components/dataSourceComponents/dataSourceTable/filter/index.js

@@ -0,0 +1,162 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { useMemo, useEffect, useState } from 'react';
+import { Form } from 'antd';
+import { useMemoizedFn, useDebounceFn } from 'ahooks';
+import { SearchOutlined } from '@ant-design/icons';
+import Input from "../../fields/Input";
+import useDataSource from "../../hooks/useDataSource";
+import FilterButton from "../../../filter/components/FilterButton";
+import { genFilterItems, genGetField, field2Cpt, getStoredFilterOrder, saveFilterOrder } from "./utils";
+var defaultArr = [];
+var Filter = function Filter(props) {
+  var componentId = props.componentId,
+    _props$items = props.items,
+    items = _props$items === void 0 ? defaultArr : _props$items,
+    _props$mode = props.mode,
+    mode = _props$mode === void 0 ? 'simple' : _props$mode,
+    _props$quickFilterMax = props.quickFilterMaxLength,
+    quickFilterMaxLength = _props$quickFilterMax === void 0 ? 3 : _props$quickFilterMax,
+    _props$sortButtonShow = props.sortButtonShow,
+    sortButtonShow = _props$sortButtonShow === void 0 ? false : _props$sortButtonShow,
+    handleValuesChange = props.handleValuesChange,
+    search = props.search,
+    filterBy = props.filterBy;
+  var _Form$useForm = Form.useForm(),
+    _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
+    form = _Form$useForm2[0];
+  var _useDataSource = useDataSource(),
+    dataSource = _useDataSource.dataSource;
+  var _useState = useState(function () {
+      var storedOrder = getStoredFilterOrder(componentId);
+      return storedOrder || {
+        quickFilter: [],
+        otherFilter: []
+      };
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    list = _useState2[0],
+    setList = _useState2[1];
+  var filterList = useMemo(function () {
+    return items.filter(function (item) {
+      return !(item !== null && item !== void 0 && item.isHidden);
+    });
+  }, [items]);
+  var filterDom = useMemo(function () {
+    return genFilterItems(list.quickFilter, dataSource);
+  }, [list.quickFilter]);
+  useEffect(function () {
+    var storedOrder = getStoredFilterOrder(componentId);
+    if (!storedOrder) {
+      var newList = {
+        quickFilter: filterList.slice(0, quickFilterMaxLength),
+        otherFilter: filterList.slice(quickFilterMaxLength)
+      };
+      setList(newList);
+      saveFilterOrder(componentId, newList);
+      return;
+    }
+    var orderedItems = {
+      quickFilter: [],
+      otherFilter: []
+    };
+    var itemMap = new Map(filterList.map(function (item) {
+      return [item.name, item];
+    }));
+    storedOrder.quickFilter.forEach(function (stored) {
+      var item = itemMap.get(stored.name);
+      if (item) {
+        orderedItems.quickFilter.push(item);
+        itemMap.delete(stored.name);
+      }
+    });
+    storedOrder.otherFilter.forEach(function (stored) {
+      var item = itemMap.get(stored.name);
+      if (item) {
+        orderedItems.otherFilter.push(item);
+        itemMap.delete(stored.name);
+      }
+    });
+    var remainingItems = Array.from(itemMap.values());
+    remainingItems.forEach(function (item) {
+      if (orderedItems.quickFilter.length < quickFilterMaxLength) {
+        orderedItems.quickFilter.push(item);
+      } else {
+        orderedItems.otherFilter.push(item);
+      }
+    });
+    if (quickFilterMaxLength && orderedItems.quickFilter.length > quickFilterMaxLength) {
+      var _orderedItems$otherFi;
+      var overflow = orderedItems.quickFilter.splice(quickFilterMaxLength);
+      (_orderedItems$otherFi = orderedItems.otherFilter).unshift.apply(_orderedItems$otherFi, _toConsumableArray(overflow));
+    }
+    setList(orderedItems);
+    saveFilterOrder(componentId, orderedItems);
+  }, [filterList, quickFilterMaxLength, componentId]);
+  var onChange = function onChange(newVal) {
+    setList(newVal);
+    saveFilterOrder(componentId, newVal);
+  };
+  var renderItem = useMemoizedFn(function (item, otherProps) {
+    var getField = genGetField(dataSource);
+    var field = getField(item.name);
+    var cptDom = field2Cpt(field, item, _objectSpread({
+      labelCol: {
+        span: 24
+      },
+      style: function style(_style) {
+        return _objectSpread(_objectSpread({}, _style || {}), {}, {
+          width: '100%'
+        });
+      }
+    }, otherProps));
+    return cptDom;
+  });
+  var onValuesChange = useDebounceFn(function (changedFields, allFields) {
+    handleValuesChange(changedFields, allFields);
+  }, {
+    wait: 300
+  }).run;
+  var searchDom = useMemo(function () {
+    return search !== null && search !== void 0 && search.show ? /*#__PURE__*/React.createElement(Input, {
+      name: search.key || '_keywords',
+      placeholder: search.placeholder,
+      renderMode: "edit",
+      prefix: /*#__PURE__*/React.createElement(SearchOutlined, null),
+      style: {
+        width: 200
+      }
+    }) : null;
+  }, [search]);
+  return /*#__PURE__*/React.createElement(Form, {
+    labelCol: {
+      span: 0
+    },
+    form: form,
+    size: "large",
+    layout: "inline",
+    className: "filter-form-wrapper",
+    onValuesChange: onValuesChange
+  }, searchDom, filterDom, /*#__PURE__*/React.createElement(FilterButton, {
+    value: list,
+    quickFilterMaxLength: quickFilterMaxLength,
+    formFiltersPrefix: '',
+    onChange: onChange,
+    renderItem: renderItem
+  }));
+};
+export default Filter;

package/es/components/dataSourceComponents/dataSourceTable/filter/utils.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { FilterItemProps } from '../../../filter/types';
+import { DataSourceType, Field } from '../../provider/dataSource/DataSourceContext';
+export declare const genGetField: (dataSource?: DataSourceType) => (key: string) => Field;
+export declare const field2Cpt: (field: Field, item: any, otherProps?: any) => React.JSX.Element | null;
+export declare const genFilterItems: (list: FilterItemProps[], dataSource?: DataSourceType) => (React.JSX.Element | null)[];
+export declare const getStoredFilterOrder: (componentId: string) => any;
+export declare const saveFilterOrder: (componentId: string, order: any) => void;

package/es/components/dataSourceComponents/dataSourceTable/filter/utils.js

@@ -0,0 +1,135 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import React from 'react';
+import { isFunction } from '@pisell/utils';
+import { formFieldMap } from "../../fields";
+export var genGetField = function genGetField(dataSource) {
+  var _ref = dataSource || {},
+    _ref$fields = _ref.fields,
+    fields = _ref$fields === void 0 ? [] : _ref$fields;
+  var fieldMap = fields.reduce(function (acc, field) {
+    acc[field.name] = field;
+    return acc;
+  }, {});
+  return function (key) {
+    return fieldMap[key];
+  };
+};
+var fieldType2FilterMap = {
+  Checkbox: 'Select',
+  ColorPicker: 'Input',
+  DatePicker: 'DateRangePicker',
+  Input: 'Input',
+  Radio: 'Select',
+  Select: 'Select',
+  Percent: 'Percent',
+  InputNumber: 'Input',
+  'Input.JSON': 'Input',
+  'Input.URL': 'Input',
+  'Input.Password': 'Input',
+  'Radio.Group': 'Select',
+  'Checkbox.Group': 'Select'
+};
+var getCptProps = function getCptProps(field, cptType, item) {
+  var _field$uiSchema, _field$uiSchema2, _field$uiSchema3, _field$uiSchema3$enum, _field$uiSchema6, _field$uiSchema8;
+  var props = (field === null || field === void 0 ? void 0 : (_field$uiSchema = field.uiSchema) === null || _field$uiSchema === void 0 ? void 0 : _field$uiSchema['x-component-props']) || {};
+  props.style = _objectSpread(_objectSpread({}, (props === null || props === void 0 ? void 0 : props.style) || {}), {}, {
+    width: '200px'
+  });
+  props.placeholder = item.label;
+  props.allowClear = true;
+  if (cptType === 'Select') {
+    props.mode = 'multiple';
+  }
+  if (['Select', 'Radio.Group', 'Checkbox.Group'].includes(field === null || field === void 0 ? void 0 : (_field$uiSchema2 = field.uiSchema) === null || _field$uiSchema2 === void 0 ? void 0 : _field$uiSchema2['x-component']) && ((field === null || field === void 0 ? void 0 : (_field$uiSchema3 = field.uiSchema) === null || _field$uiSchema3 === void 0 ? void 0 : (_field$uiSchema3$enum = _field$uiSchema3.enum) === null || _field$uiSchema3$enum === void 0 ? void 0 : _field$uiSchema3$enum.length) || 0) > 0) {
+    var _field$uiSchema4, _field$uiSchema5;
+    if (['Radio.Group', 'Checkbox.Group'].includes(field === null || field === void 0 ? void 0 : (_field$uiSchema4 = field.uiSchema) === null || _field$uiSchema4 === void 0 ? void 0 : _field$uiSchema4['x-component'])) {
+      props.direction = 'horizontal';
+    }
+    props.options = field === null || field === void 0 ? void 0 : (_field$uiSchema5 = field.uiSchema) === null || _field$uiSchema5 === void 0 ? void 0 : _field$uiSchema5.enum;
+  }
+  if ((field === null || field === void 0 ? void 0 : (_field$uiSchema6 = field.uiSchema) === null || _field$uiSchema6 === void 0 ? void 0 : _field$uiSchema6['x-component']) === 'ColorPicker') {
+    var _field$uiSchema7;
+    props.defaultValue = field === null || field === void 0 ? void 0 : (_field$uiSchema7 = field.uiSchema) === null || _field$uiSchema7 === void 0 ? void 0 : _field$uiSchema7.default;
+  }
+  if (cptType === 'DateRangePicker') {
+    props.style = _objectSpread(_objectSpread({}, (props === null || props === void 0 ? void 0 : props.style) || {}), {}, {
+      width: '240px'
+    });
+  }
+
+  // 勾选组件
+  if ((field === null || field === void 0 ? void 0 : (_field$uiSchema8 = field.uiSchema) === null || _field$uiSchema8 === void 0 ? void 0 : _field$uiSchema8['x-component']) === 'Checkbox' && cptType === 'Select') {
+    props.mode = undefined;
+    props.allowClear = true;
+    props.options = [{
+      label: '是',
+      value: true
+    }, {
+      label: '否',
+      value: false
+    }];
+  }
+  return props;
+};
+export var field2Cpt = function field2Cpt(field, item, otherProps) {
+  var isCustom = item.isCustom,
+    configType = item.type;
+  var _ref2 = field || {},
+    uiSchema = _ref2.uiSchema;
+  var _ref3 = uiSchema || {},
+    xComponent = _ref3['x-component'];
+  var cptType = fieldType2FilterMap[xComponent];
+  if (isCustom) {
+    cptType = configType;
+  }
+  var Cpt = formFieldMap[cptType];
+  if (!Cpt) {
+    return null;
+  }
+  var props = getCptProps(field, cptType, item);
+  var style = isFunction(otherProps === null || otherProps === void 0 ? void 0 : otherProps.style) ? otherProps === null || otherProps === void 0 ? void 0 : otherProps.style(props.style) : otherProps !== null && otherProps !== void 0 && otherProps.style ? _objectSpread(_objectSpread({}, props.style), otherProps === null || otherProps === void 0 ? void 0 : otherProps.style) : props.style;
+  return /*#__PURE__*/React.createElement(Cpt, _extends({}, props, {
+    label: item.label,
+    name: item.name || item.value
+  }, otherProps, {
+    style: style
+  }));
+};
+export var genFilterItems = function genFilterItems(list, dataSource) {
+  return list.map(function (item) {
+    if (!item) {
+      return null;
+    }
+    var name = item.name;
+    var getField = genGetField(dataSource);
+    var field = getField(name);
+    var cptDom = field2Cpt(field, item);
+    return cptDom;
+  });
+};
+var FILTER_STORAGE_KEY = 'filter-setting-';
+var getStorageKey = function getStorageKey(componentId) {
+  return "".concat(FILTER_STORAGE_KEY).concat(componentId);
+};
+export var getStoredFilterOrder = function getStoredFilterOrder(componentId) {
+  try {
+    var stored = localStorage.getItem(getStorageKey(componentId));
+    return stored ? JSON.parse(stored) : null;
+  } catch (e) {
+    console.error('Failed to parse stored filter order:', e);
+    return null;
+  }
+};
+export var saveFilterOrder = function saveFilterOrder(componentId, order) {
+  try {
+    localStorage.setItem(getStorageKey(componentId), JSON.stringify(order));
+  } catch (e) {
+    console.error('Failed to save filter order:', e);
+  }
+};

package/es/components/dataSourceComponents/dataSourceTable/hooks/useDataSourceKey.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 declare const useDataSourceKey: () => {
-    dataSourceKey: string;
-    dataSourceKeyRef: import("react").MutableRefObject<string>;
+    dataSourceKey: string | undefined;
+    dataSourceKeyRef: import("react").MutableRefObject<string | undefined>;
 };
 export default useDataSourceKey;

package/es/components/dataSourceComponents/dataSourceTable/hooks/useDataSourceKey.js

@@ -5,7 +5,7 @@ var useDataSourceKey = function useDataSourceKey() {
   var _useDataSource = useDataSource(),
     dataSource = _useDataSource.dataSource;
   var dataSourceKey = useMemo(function () {
-    return isString(dataSource) ? dataSource : dataSource === null || dataSource === void 0 ? void 0 : dataSource.key;
+    return isString(dataSource) ? dataSource : (dataSource === null || dataSource === void 0 ? void 0 : dataSource.key) || (dataSource === null || dataSource === void 0 ? void 0 : dataSource.tableName);
   }, [dataSource]);
   var dataSourceKeyRef = useRef(dataSourceKey);
   dataSourceKeyRef.current = dataSourceKey;

package/es/components/dataSourceComponents/dataSourceTable/hooks/useDesignMode.js

@@ -1,5 +1,4 @@
-import { useEffect } from 'react';
-
+import { useEffect, useRef } from 'react';
 // 设计模式下状态管理
 var useDesignMode = function useDesignMode(props, _ref) {
   var registerValueVariable = _ref.registerValueVariable,
@@ -8,46 +7,43 @@ var useDesignMode = function useDesignMode(props, _ref) {
     data = _ref.data;
   var __designMode = props.__designMode,
     componentId = props.componentId,
-    showDetailButton = props.showDetailButton,
-    showEditButton = props.showEditButton,
-    showAddButton = props.showAddButton;
-  useEffect(function () {
-    if (__designMode === 'design') {
-      if (showDetailButton) {
-        var _data$data;
-        openDrawer('detail');
-        registerValueVariable === null || registerValueVariable === void 0 ? void 0 : registerValueVariable(componentId, {
-          currentRecord: (data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data[0]) || null
-        });
-      } else {
-        closeDrawer();
-      }
-    }
-  }, [showDetailButton, __designMode]);
-  useEffect(function () {
-    if (__designMode === 'design') {
-      if (showEditButton) {
-        var _data$data2;
-        openDrawer('edit');
-        registerValueVariable === null || registerValueVariable === void 0 ? void 0 : registerValueVariable(componentId, {
-          currentRecord: (data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : _data$data2[0]) || null
-        });
-      } else {
-        closeDrawer();
-      }
-    }
-  }, [showEditButton, __designMode]);
+    operation = props.operation;
+  var _ref2 = operation || {},
+    items = _ref2.items;
+
+  // 存储上一次的items
+  var prevItemsRef = useRef([]);
   useEffect(function () {
-    if (__designMode === 'design') {
-      if (showAddButton) {
-        openDrawer('add');
-        registerValueVariable === null || registerValueVariable === void 0 ? void 0 : registerValueVariable(componentId, {
-          currentRecord: null
+    var _prevItemsRef$current;
+    if (__designMode === 'design' && items !== null && items !== void 0 && items.length && (_prevItemsRef$current = prevItemsRef.current) !== null && _prevItemsRef$current !== void 0 && _prevItemsRef$current.length) {
+      // 找出变更的那一条记录
+      var changedItem = items.find(function (item) {
+        var prevItem = prevItemsRef.current.find(function (prev) {
+          return prev.key === item.key;
         });
-      } else {
-        closeDrawer();
+        if (!prevItem) return false;
+
+        // 对比actionType是否变更
+        if (item.actionType !== prevItem.actionType) {
+          return true;
+        }
+        return false;
+      });
+      if (changedItem) {
+        // 如果是view/edit/custom类型,则打开对应弹窗
+        if (['view', 'edit', 'custom'].includes(changedItem.actionType)) {
+          registerValueVariable === null || registerValueVariable === void 0 ? void 0 : registerValueVariable(componentId, {
+            currentRecord: (data === null || data === void 0 ? void 0 : data[0]) || null
+          });
+          openDrawer(changedItem);
+        } else {
+          closeDrawer();
+        }
       }
     }
-  }, [showAddButton, __designMode]);
+
+    // 更新prevItemsRef
+    prevItemsRef.current = items;
+  }, [items, __designMode]);
 };
 export default useDesignMode;

package/es/components/dataSourceComponents/dataSourceTable/hooks/useDrawerState.d.ts

@@ -1,10 +1,26 @@
 /// <reference types="react" />
-declare const useDrawerState: () => {
+import { Drawer } from 'antd';
+import { OperationItem } from '../type';
+declare const useDrawerState: (operationContent?: {
+    [key: string]: import("react").ReactNode;
+} | undefined) => {
     drawerVisible: boolean;
     setDrawerVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
-    drawerType: "add" | "edit" | "detail";
-    setDrawerType: import("react").Dispatch<import("react").SetStateAction<"add" | "edit" | "detail">>;
-    openDrawer: (type: 'detail' | 'edit' | 'add') => void;
+    openDrawer: (item: OperationItem) => void;
     closeDrawer: () => void;
+    drawerContent: import("react").ReactNode;
+    Container: typeof Drawer | (import("react").FC<import("antd").ModalProps> & import("antd/es/modal/confirm").ModalStaticFunctions & {
+        useModal: typeof import("antd/es/modal/useModal").default;
+        destroyAll: () => void;
+        config: typeof import("antd/es/modal/confirm").modalGlobalConfig;
+        _InternalPanelDoNotUseOrYouWillBeFired: import("react").FC<import("antd/es/modal/PurePanel").PurePanelProps>;
+    });
+    containerProps: {
+        width?: undefined;
+        title?: undefined;
+    } | {
+        width: number;
+        title: string;
+    };
 };
 export default useDrawerState;

package/es/components/dataSourceComponents/dataSourceTable/hooks/useDrawerState.js

@@ -4,32 +4,86 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { useState } from 'react';
-var useDrawerState = function useDrawerState() {
+import { Drawer, Modal } from 'antd';
+import { useState, useMemo, useRef, useEffect } from 'react';
+var sizeMap = {
+  small: 400,
+  middle: 600,
+  large: 800
+};
+var useDrawerState = function useDrawerState(operationContent) {
   // 抽屉是否显示
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     drawerVisible = _useState2[0],
     setDrawerVisible = _useState2[1];
-  // 抽屉类型
-  var _useState3 = useState('detail'),
+  var _useState3 = useState(null),
     _useState4 = _slicedToArray(_useState3, 2),
-    drawerType = _useState4[0],
-    setDrawerType = _useState4[1];
-  var openDrawer = function openDrawer(type) {
+    item = _useState4[0],
+    setItem = _useState4[1];
+  var timerRef = useRef();
+
+  // 组件卸载时清除定时器
+  useEffect(function () {
+    return function () {
+      if (timerRef.current) {
+        clearTimeout(timerRef.current);
+      }
+    };
+  }, []);
+  var openDrawer = function openDrawer(item) {
+    // 如果存在未完成的定时器，先清除
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+    }
     setDrawerVisible(true);
-    setDrawerType(type);
+    setItem(item);
   };
   var closeDrawer = function closeDrawer() {
+    // 如果存在未完成的定时器，先清除
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+    }
     setDrawerVisible(false);
+    // 等待动画完成后再清除item
+    timerRef.current = setTimeout(function () {
+      setItem(null);
+      timerRef.current = undefined;
+    }, 300);
   };
+
+  // 抽屉内容
+  var drawerContent = useMemo(function () {
+    if (item !== null && item !== void 0 && item.key && operationContent) {
+      return operationContent[item.key];
+    }
+    return null;
+  }, [item, operationContent]);
+
+  // 容器属性
+  var containerProps = useMemo(function () {
+    if (!item) {
+      return {};
+    }
+    return {
+      width: sizeMap[item === null || item === void 0 ? void 0 : item.openContentSize],
+      title: item === null || item === void 0 ? void 0 : item.openTitle
+    };
+  }, [item]);
+  var Container = useMemo(function () {
+    if ((item === null || item === void 0 ? void 0 : item.openMode) === 'drawer') {
+      return Drawer;
+    }
+    return Modal;
+  }, [item === null || item === void 0 ? void 0 : item.openMode]);
   return {
     drawerVisible: drawerVisible,
     setDrawerVisible: setDrawerVisible,
-    drawerType: drawerType,
-    setDrawerType: setDrawerType,
     openDrawer: openDrawer,
-    closeDrawer: closeDrawer
+    closeDrawer: closeDrawer,
+    drawerContent: drawerContent,
+    Container: Container,
+    containerProps: containerProps
   };
 };
 export default useDrawerState;

package/es/components/dataSourceComponents/dataSourceTable/hooks/useFormat.d.ts

@@ -1,3 +1,4 @@
+import { Field } from '../../provider/dataSource/DataSourceContext';
 export declare type ListResult = {
     data: any[];
     count: number;
@@ -6,6 +7,7 @@ export declare type ListResult = {
 };
 export declare type UseFormatParams = {
     dataSourceKey: string;
+    fields: Field[];
 };
 export declare type FormatListResultParams = {
     list: any[];
@@ -20,7 +22,21 @@ export declare type FormatListResultParams = {
         pageSize: number;
     };
 };
-declare const useFormat: ({ dataSourceKey }: UseFormatParams) => {
+export declare type FilterValue = {
+    [key: string]: any;
+};
+export declare type FilterOperator = '$includes' | '$dateAfter' | '$dateBefore' | '$eq' | '$in' | '$isTruly' | '$and';
+export declare type SimpleFilterValue = {
+    [key in Exclude<FilterOperator, '$and'>]?: any;
+};
+export declare type AndFilterValue = {
+    $and: FilterCondition[];
+};
+export declare type FilterConditionValue = SimpleFilterValue | AndFilterValue;
+export declare type FilterCondition = {
+    [key: string]: FilterConditionValue;
+} | AndFilterValue;
+declare const useFormat: ({ dataSourceKey, fields }: UseFormatParams) => {
     formatListResult: (res: FormatListResultParams) => ListResult;
     formatListParams: (params: any) => any;
 };