@lemon-fe/kits 1.0.0-121 → 1.0.0-122

package/es/components/DataGrid/index.d.ts

@@ -1,8 +1,8 @@
-import React, { Component } from 'react';
 import type { ColDef } from '@ag-grid-community/core';
 import { GridApi, ColumnApi } from '@ag-grid-community/core';
-import type { ColType, DataGridProps, DataGridState } from './typings';
+import React, { Component } from 'react';
 import EditorWrapper from './cell-editors/Wrapper';
+import type { ColType, DataGridProps, DataGridState } from './typings';
 export default class DataGrid<TData extends Record<string, any>> extends Component<DataGridProps<TData>, DataGridState<TData>> {
     api: GridApi<TData>;
     columnApi: ColumnApi;
@@ -41,7 +41,6 @@ export default class DataGrid<TData extends Record<string, any>> extends Compone
         columnTypes: Record<string, ColDef<any>>;
         defaultColDef: ColDef<any>;
         components: Record<string, any>;
-        loading: boolean;
     };
     static EmptyCol: ColType<any>;
     static Editors: {

package/es/components/DataGrid/index.js

@@ -63,36 +63,36 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-import React, { Component } from 'react';
-import { AgGridReact } from '@ag-grid-community/react';
-import shallowEqual from 'shallowequal';
+import { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-model';
 import { ModuleRegistry, GridApi, ColumnApi } from '@ag-grid-community/core';
 import { InfiniteRowModelModule } from '@ag-grid-community/infinite-row-model';
-import { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-model';
-import { get, set } from 'lodash';
-import Scheme from 'async-validator';
-import GridStoreContext from "./context/GridStore";
-import { RowGroupingModule } from "./modules/row-grouping/main";
-import { ClipboardModule } from "./modules/clipboard/main";
-import { MenuModule } from "./modules/menu/main";
-import { ColumnsToolPanelModule } from "./modules/column-tool-panel/main";
-import { SideBarModule } from "./modules/side-bar/main";
-import { MasterDetailModule } from "./modules/master-detail/main";
+import { AgGridReact } from '@ag-grid-community/react';
 import { Spin, Pagination, Empty } from 'antd';
-import { prefix, getColField, isColumn, withSyncRender, Store, Selection, columnTypes } from "./utils";
-import HeaderRenderer from "./renderer/HeaderRenderer";
-import CellRenderer from "./renderer/CellRenderer";
-import Actions from "./renderer/Actions";
+import Scheme from 'async-validator';
+import { get, set } from 'lodash';
+import memoizeOne from 'memoize-one';
+import React, { Component } from 'react';
+import shallowEqual from 'shallowequal';
 import DateEditor from "./cell-editors/Date";
-import TextEditor from "./cell-editors/Text";
 import NumberEditor from "./cell-editors/Number";
-import SelectEditor from "./cell-editors/Select";
 import RowEditor, { RowEditorData } from "./cell-editors/Row";
+import SelectEditor from "./cell-editors/Select";
+import TextEditor from "./cell-editors/Text";
 import EditorWrapper from "./cell-editors/Wrapper";
-import memoizeOne from 'memoize-one';
 import Selected from "./components/Selected";
+import GridStoreContext from "./context/GridStore";
+import { ClipboardModule } from "./modules/clipboard/main";
+import { ColumnsToolPanelModule } from "./modules/column-tool-panel/main";
+import { MasterDetailModule } from "./modules/master-detail/main";
+import { MenuModule } from "./modules/menu/main";
+import { RowGroupingModule } from "./modules/row-grouping/main";
+import { SideBarModule } from "./modules/side-bar/main";
+import Actions from "./renderer/Actions";
 import CellIndexRender from "./renderer/CellIndexRenderer";
+import CellRenderer from "./renderer/CellRenderer";
 import DetailCellRenderer from "./renderer/DetailCellRenderer";
+import HeaderRenderer from "./renderer/HeaderRenderer";
+import { prefix, getColField, isColumn, withSyncRender, Store, Selection, columnTypes } from "./utils";
 ModuleRegistry.registerModules([ClientSideRowModelModule, RowGroupingModule, InfiniteRowModelModule, ClipboardModule, MenuModule, SideBarModule, ColumnsToolPanelModule, MasterDetailModule], false);
 var defaultColDef = {
   resizable: true,
@@ -396,7 +396,7 @@ var DataGrid = /*#__PURE__*/function (_Component) {
 
     _this.state = _objectSpread({
       colDefs: _this.getColumDefs(),
-      loading: props.loading || false
+      loading: false
     }, _this.getPagination());
     _this.store = new Store({
       errors: new Map(),
@@ -456,8 +456,7 @@ var DataGrid = /*#__PURE__*/function (_Component) {
           columns = _this$props5.columns,
           rowSelection = _this$props5.rowSelection,
           dataSource = _this$props5.dataSource,
-          context = _this$props5.context,
-          loading = _this$props5.loading;
+          context = _this$props5.context;
 
       if (columns !== prevProps.columns) {
         this.syncColRender();
@@ -479,12 +478,6 @@ var DataGrid = /*#__PURE__*/function (_Component) {
           context: context
         });
       }
-
-      if (loading !== prevProps.loading) {
-        this.setState({
-          loading: loading || false
-        });
-      }
     }
   }, {
     key: "componentWillUnmount",
@@ -1369,9 +1362,9 @@ var DataGrid = /*#__PURE__*/function (_Component) {
         columnTypes: this.getMemoizedColumnTypes(columnTypesProp)
       })), footer.length > 0 && /*#__PURE__*/React.createElement("div", {
         className: prefix('bottom')
-      }, footer), loading && /*#__PURE__*/React.createElement(Spin, {
+      }, footer), (loadingProp !== null && loadingProp !== void 0 ? loadingProp : loading) ? /*#__PURE__*/React.createElement(Spin, {
         className: prefix('spin')
-      })));
+      }) : null));
     }
   }]);
 
@@ -1402,8 +1395,7 @@ _defineProperty(DataGrid, "defaultProps", {
   },
   columnTypes: {},
   defaultColDef: {},
-  components: {},
-  loading: false
+  components: {}
 });
 
 _defineProperty(DataGrid, "EmptyCol", {

package/es/components/DataGrid/index.less

@@ -268,7 +268,7 @@
   --ag-header-column-resize-handle-display: block;
   --ag-header-column-resize-handle-width: 1px;
   --ag-header-column-resize-handle-height: 12px;
-  --ag-header-column-resize-handle-color: #bbb;
+  --ag-header-column-resize-handle-color: #d9d9d9;
   --ag-cell-horizontal-padding: 8px;
   --ag-icon-font-family: 'agGridAlpine';
   --ag-selected-row-background-color: ~'var(--@{ant-prefix}-primary-1)';

package/es/components/Filter/index.js

@@ -34,16 +34,16 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 
 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); }
 
-import React, { useEffect, useMemo, useState } from 'react';
-import ResizeObserver from 'rc-resize-observer';
-import { Button, Checkbox, Form, Input, Popover, Space, Modal, message, Select, Empty, InputNumber } from 'antd';
 import { useDebounce, useRequest } from '@lemon-fe/hooks';
+import { Button, Checkbox, Form, Input, Popover, Space, Modal, message, Select, Empty, InputNumber } from 'antd';
 import classNames from 'classnames';
-import Icons from "../Icons";
+import ResizeObserver from 'rc-resize-observer';
+import React, { useEffect, useMemo, useState } from 'react';
+import Dropdown from "../Dropdown";
 import DurationPicker from "../DurationPicker";
 import FormLayout from "../FormLayout";
+import Icons from "../Icons";
 import TabBar from "../TabBar";
-import Dropdown from "../Dropdown";
 import { prefixClassName } from "../utils";
 var components = [{
   type: 'input',
@@ -136,9 +136,7 @@ function Filter(props) {
       return new Set(defaultActiveKeys);
     }
 
-    return new Set(data.map(function (item) {
-      return item.key;
-    }));
+    return null;
   }, []);
   var compMap = useMemo(function () {
     return new Map(components.map(function (item) {
@@ -365,7 +363,9 @@ function Filter(props) {
 
   var handleActiveKey = function handleActiveKey(key, flag) {
     setActiveKeys(function (prev) {
-      var next = new Set(prev);
+      var next = new Set(prev === null ? data.map(function (item) {
+        return item.key;
+      }) : prev);
 
       if (flag) {
         next.add(key);
@@ -395,7 +395,7 @@ function Filter(props) {
     };
 
     var result = data.filter(function (item) {
-      if (activeKeys.has(item.key) && !item.hidden) {
+      if (activeKeys === null || activeKeys.has(item.key) && !item.hidden) {
         return true;
       }
 
@@ -614,7 +614,7 @@ function Filter(props) {
         key: item.key,
         className: prefix('item')
       }, /*#__PURE__*/React.createElement(Checkbox, {
-        checked: activeKeys.has(item.key),
+        checked: activeKeys === null || activeKeys.has(item.key),
         onChange: function onChange(e) {
           handleActiveKey(item.key, e.target.checked);
         }

package/es/components/Layout/index.d.ts

@@ -1,8 +1,15 @@
-import type { ReactNode, CSSProperties } from 'react';
+import { type ReactNode, type CSSProperties } from 'react';
 import React from 'react';
 interface Tab {
+    label?: ReactNode;
+    /**
+     * 与antd tabs保持一致
+     * @deprecated
+     */
     title?: ReactNode;
     key: string;
+    forceRender?: boolean;
+    children?: ReactNode;
 }
 interface Props {
     children?: ReactNode;
@@ -39,7 +46,10 @@ declare namespace Layout {
         left?: ReactNode;
         tab?: string | undefined;
         forceRender?: boolean | undefined;
-    } & Pick<Props, "onCollapse">) => JSX.Element;
+    } & Pick<Props, "footer" | "header" | "onCollapse">) => JSX.Element;
+    var useFocus: () => boolean;
+    var SLOT_HEADER: string;
+    var SLOT_FOOTER: string;
 }
 export default Layout;
 declare function LayoutTabs(props: {

package/es/components/Layout/index.js

@@ -20,12 +20,16 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import { mapChildren, prefixClassName } from "../utils";
 import { Spin, Tabs } from 'antd';
-import { Resizable } from 'react-resizable';
-import React, { useState } from 'react';
 import classNames from 'classnames';
 import { get } from 'lodash';
+import { useCallback, createContext, useContext } from 'react';
+import React, { useState } from 'react';
+import { Resizable } from 'react-resizable';
+import Portal from "../Portal";
+import { mapChildren, prefixClassName } from "../utils";
+var SLOT_HEADER = 'header';
+var SLOT_FOOTER = 'footer';
 var prefix = prefixClassName('layout');
 
 function Sider(props) {
@@ -126,17 +130,30 @@ function Sider(props) {
   })))))))));
 }
 
+var ActiveContext = /*#__PURE__*/createContext(true);
+
+function useFocus() {
+  return useContext(ActiveContext);
+}
+
 function Content(props) {
   var left = props.left,
       children = props.children,
-      onCollapse = props.onCollapse;
+      onCollapse = props.onCollapse,
+      header = props.header,
+      footer = props.footer;
+  var focused = useFocus();
   return /*#__PURE__*/React.createElement("div", {
     className: prefix('content')
   }, left ? /*#__PURE__*/React.createElement(Sider, {
     onCollapse: onCollapse
   }, left) : null, /*#__PURE__*/React.createElement("div", {
     className: prefix('main')
-  }, children));
+  }, children), focused && header ? /*#__PURE__*/React.createElement(Portal, {
+    slot: SLOT_HEADER
+  }, header) : null, focused && footer ? /*#__PURE__*/React.createElement(Portal, {
+    slot: SLOT_FOOTER
+  }, footer) : null);
 }
 
 export default function Layout(props) {
@@ -153,12 +170,23 @@ export default function Layout(props) {
       tabs = props.tabs,
       activeKey = props.activeKey,
       onTabClick = props.onTabClick;
-  return /*#__PURE__*/React.createElement("div", {
+  var renderHeader = useCallback(function (node) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: prefix('header')
+    }, node);
+  }, []);
+  var renderFooter = useCallback(function (node) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: prefix('footer')
+    }, node);
+  }, []);
+  return /*#__PURE__*/React.createElement(Portal.Host, null, /*#__PURE__*/React.createElement("div", {
     className: classNames(prefix(), className),
     style: style
-  }, header ? /*#__PURE__*/React.createElement("div", {
-    className: prefix('header')
-  }, header) : null, /*#__PURE__*/React.createElement("div", {
+  }, header ? renderHeader(header) : null, /*#__PURE__*/React.createElement(Portal.Slot, {
+    slot: SLOT_HEADER,
+    render: renderHeader
+  }), /*#__PURE__*/React.createElement("div", {
     className: prefix('body')
   }, tabs ? /*#__PURE__*/React.createElement(Tabs, {
     className: prefix('tabs'),
@@ -176,41 +204,68 @@ export default function Layout(props) {
   }) : null, body || /*#__PURE__*/React.createElement(Content, {
     onCollapse: onCollapse,
     left: left
-  }, children)), footer ? /*#__PURE__*/React.createElement("div", {
-    className: prefix('footer')
-  }, footer) : null, loading && /*#__PURE__*/React.createElement("div", {
+  }, children)), /*#__PURE__*/React.createElement(Portal.Slot, {
+    slot: SLOT_FOOTER,
+    render: renderFooter
+  }), footer ? renderFooter(footer) : null, loading && /*#__PURE__*/React.createElement("div", {
     className: prefix('spin')
-  }, /*#__PURE__*/React.createElement(Spin, null)));
+  }, /*#__PURE__*/React.createElement(Spin, null))));
 }
 
 function LayoutTabs(props) {
+  var _tabs$;
+
   var _props$tabs = props.tabs,
       tabs = _props$tabs === void 0 ? [] : _props$tabs,
       children = props.children,
       className = props.className,
       activeKey = props.activeKey,
-      onTabClick = props.onTabClick,
+      _onTabClick = props.onTabClick,
       hideTabBar = props.hideTabBar,
       restProps = _objectWithoutProperties(props, _excluded);
 
+  var _useState7 = useState((_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.key),
+      _useState8 = _slicedToArray(_useState7, 2),
+      active = _useState8[0],
+      setActive = _useState8[1];
+
+  var currentTab = activeKey !== null && activeKey !== void 0 ? activeKey : active;
   return /*#__PURE__*/React.createElement(Layout, _extends({
     className: classNames(className, prefix('tabs-wrapper'), _defineProperty({}, prefix('tabs-hide-tab-bar'), hideTabBar)),
     body: /*#__PURE__*/React.createElement(Tabs, {
-      activeKey: activeKey,
-      onTabClick: onTabClick,
+      activeKey: currentTab,
+      onTabClick: function onTabClick(key, e) {
+        if (_onTabClick !== undefined) {
+          _onTabClick(key, e);
+        }
+
+        setActive(key);
+      },
       className: prefix('tabs'),
       renderTabBar: hideTabBar ? function () {
         return null;
       } : undefined,
-      items: mapChildren(children, function (node, index) {
-        var _get, _get2;
+      items: children ? mapChildren(children, function (node, index) {
+        var _get, _get2, _get3, _get4;
 
         var tab = tabs[index];
+        var key = (_get = get(node, 'key')) !== null && _get !== void 0 ? _get : tab === null || tab === void 0 ? void 0 : tab.key;
+        return {
+          label: (_get2 = get(node, ['props', 'tab'])) !== null && _get2 !== void 0 ? _get2 : tab === null || tab === void 0 ? void 0 : tab.title,
+          key: (_get3 = get(node, 'key')) !== null && _get3 !== void 0 ? _get3 : tab === null || tab === void 0 ? void 0 : tab.key,
+          forceRender: (_get4 = get(node, ['props', 'forceRender'])) !== null && _get4 !== void 0 ? _get4 : tab === null || tab === void 0 ? void 0 : tab.forceRender,
+          children: /*#__PURE__*/React.createElement(ActiveContext.Provider, {
+            value: currentTab === key
+          }, node)
+        };
+      }) : tabs.map(function (tab) {
         return {
-          label: (_get = get(node, ['props', 'tab'])) !== null && _get !== void 0 ? _get : tab.title,
-          key: (_get2 = get(node, 'key')) !== null && _get2 !== void 0 ? _get2 : tab.key,
-          forceRender: get(node, ['props', 'forceRender']),
-          children: node
+          label: tab.label || tab.title,
+          key: tab.key,
+          forceRender: tab.forceRender,
+          children: /*#__PURE__*/React.createElement(ActiveContext.Provider, {
+            value: currentTab === tab.key
+          }, tab.children)
         };
       })
     })
@@ -218,4 +273,7 @@ function LayoutTabs(props) {
 }
 
 Layout.Tabs = LayoutTabs;
-Layout.Content = Content;
+Layout.Content = Content;
+Layout.useFocus = useFocus;
+Layout.SLOT_HEADER = SLOT_HEADER;
+Layout.SLOT_FOOTER = SLOT_FOOTER;

package/es/components/Layout/index.less

@@ -127,6 +127,7 @@
 
   &-main > & {
     flex: 1;
+    background-color: transparent;
   }
 
   .@{prefixCls}-section + &&-tabs-wrapper {

package/es/components/Portal/index.d.ts

@@ -1,17 +1,18 @@
-import type { ReactElement } from 'react';
-declare type ContentType = ReactElement | null;
+import React from 'react';
+import type { ReactNode } from 'react';
+declare type ContentType = ReactNode;
 declare function PortalHost(props: {
     children: ContentType;
 }): JSX.Element;
-declare function PortalSlot(props: {
-    slot: string;
-}): ContentType;
 declare function Portal(props: {
     children: ContentType;
     slot: string;
 }): null;
 declare namespace Portal {
     var Host: typeof PortalHost;
-    var Slot: typeof PortalSlot;
+    var Slot: React.NamedExoticComponent<{
+        slot: string;
+        render?: ((children: React.ReactNode) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null) | undefined;
+    }>;
 }
 export default Portal;

package/es/components/Portal/index.js

@@ -1,3 +1,11 @@
+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."); }
@@ -10,9 +18,10 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { createContext, memo, useContext, useEffect, useMemo, useState } from 'react';
+import React, { createContext, memo, useContext, useEffect, useId, useMemo, useState, Fragment } from 'react';
 var Slot = /*#__PURE__*/memo(function Content(props) {
-  return props.children;
+  var children = props.children;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, children);
 });
 var Context = /*#__PURE__*/createContext({
   set: function set() {},
@@ -72,17 +81,28 @@ function PortalHost(props) {
   }, []);
   var portal = useMemo(function () {
     return {
-      set: function set(key, node) {
+      set: function set(slot, id, node) {
         setNodes(function (prev) {
           var next = new Map(prev);
-          next.set(key, node);
+          var elms = new Map(next.get(slot));
+          elms.set(id, node);
+          next.set(slot, elms);
           return next;
         });
       },
-      delete: function _delete(key) {
+      delete: function _delete(slot, id) {
         setNodes(function (prev) {
           var next = new Map(prev);
-          next.delete(key);
+          var elms = new Map(next.get(slot));
+
+          if (elms) {
+            elms.delete(id);
+          }
+
+          if (elms.size <= 0) {
+            next.delete(slot);
+          }
+
           return next;
         });
       },
@@ -97,8 +117,9 @@ function PortalHost(props) {
   }, /*#__PURE__*/React.createElement(Slot, null, children));
 }
 
-function PortalSlot(props) {
-  var slot = props.slot;
+var PortalSlot = /*#__PURE__*/memo(function PortalSlotContent(props) {
+  var slot = props.slot,
+      render = props.render;
 
   var _useContext = useContext(Context),
       observable = _useContext.observable;
@@ -118,20 +139,41 @@ function PortalSlot(props) {
 
     return unsubscribe;
   }, [slot]);
-  return node;
-}
+  var result = useMemo(function () {
+    if (node === null) {
+      return null;
+    }
+
+    return _toConsumableArray(node).map(function (_ref) {
+      var _ref2 = _slicedToArray(_ref, 2),
+          id = _ref2[0],
+          elm = _ref2[1];
+
+      return /*#__PURE__*/React.createElement(Fragment, {
+        key: id
+      }, elm);
+    });
+  }, [node]);
+
+  if (render) {
+    return result ? render(result) : null;
+  }
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, result);
+});
 
 function Portal(props) {
   var slot = props.slot,
       children = props.children;
   var portal = useContext(Context);
+  var id = useId();
   useEffect(function () {
     return function () {
-      portal.delete(slot);
+      portal.delete(slot, id);
     };
   }, [slot]);
   useEffect(function () {
-    portal.set(slot, children);
+    portal.set(slot, id, children);
   }, [slot, children]);
   return null;
 }

package/es/hooks/useBatchOperator/index.d.ts

@@ -1,12 +1,34 @@
+import { type ReactElement } from 'react';
 import type { Key } from 'react';
 import type { ColType, DataGridProps } from "../../components/DataGrid/typings";
-declare type Result = void | string | Error | symbol;
-export default function useBatchOperate<RecordType extends Record<string, any> = Record<string, any>>(options: {
+declare type Result<ResultType = unknown> = void | string | Error | symbol | ResultType;
+export default function useBatchOperate<RecordType extends Record<string, any> = Record<string, any>, ResultType = unknown>(options: {
     modalTitle: string;
-    handler: (record: RecordType) => Promise<string | void>;
+    handler: (record: RecordType) => Promise<string | void | ResultType>;
     columns?: ColType<RecordType>[];
     rowKey: DataGridProps<RecordType>['rowKey'];
-    onClose?: (results: Map<Key, Result>) => void;
+    onClose?: (results: Map<Key, Result<ResultType>>) => void;
+    /** 弹窗关闭前的检验，返回true校验通过关闭弹窗，false校验不通过 */
+    onBeforeClose?: (results: Map<Key, Result>) => Promise<boolean>;
+    /**
+     * 自定义渲染结果，不要依赖上下文
+     * @param params
+     * @returns
+     */
+    renderResult?: (params: {
+        data: RecordType;
+        result: ResultType;
+        /**
+         * 显示用的节点
+         */
+        elements: {
+            reloadButton: ReactElement;
+            failIcon: ReactElement;
+            successIcon: ReactElement;
+        };
+        reload: () => any;
+    }) => ReactElement | string | number | null;
+    isError?: () => boolean;
 }): {
     node: JSX.Element;
     run: (rows: RecordType[]) => void;

package/es/hooks/useBatchOperator/index.js

@@ -26,15 +26,15 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { useMemo, useState, useRef, useEffect } from 'react';
+import { PlayCircleOutlined, PauseCircleOutlined, ReloadOutlined } from '@ant-design/icons';
+import { useThrottle } from '@lemon-fe/hooks';
 import { Modal, Row, Spin } from 'antd';
-import { PlayCircleOutlined, DeleteTwoTone, PauseCircleOutlined, ReloadOutlined } from '@ant-design/icons';
 import { get } from 'lodash';
-import { useThrottle } from '@lemon-fe/hooks';
+import React, { useMemo, useState, useRef, useEffect } from 'react';
+import Actions from "../../components/Actions";
 import DataGrid from "../../components/DataGrid";
 import Icons from "../../components/Icons";
 import Layout from "../../components/Layout";
-import Actions from "../../components/Actions";
 import Section from "../../components/Section";
 var loading = Symbol('loading');
 export default function useBatchOperate(options) {
@@ -43,7 +43,9 @@ export default function useBatchOperate(options) {
       handler = options.handler,
       columns = options.columns,
       onClose = options.onClose,
-      rowKey = options.rowKey;
+      onBeforeClose = options.onBeforeClose,
+      rowKey = options.rowKey,
+      renderResult = options.renderResult;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -102,7 +104,7 @@ export default function useBatchOperate(options) {
     }
   };
 
-  var reload = useThrottle( /*#__PURE__*/function () {
+  var _reload = useThrottle( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(item, key) {
       var res;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
@@ -137,6 +139,7 @@ export default function useBatchOperate(options) {
       return _ref.apply(this, arguments);
     };
   }(), 500);
+
   var start = useThrottle( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
     var i, item, key, res;
     return _regeneratorRuntime().wrap(function _callee2$(_context2) {
@@ -210,33 +213,70 @@ export default function useBatchOperate(options) {
     setData(rows);
   };
 
-  var handleClose = function handleClose() {
-    setVisible(false);
+  var handleClose = /*#__PURE__*/function () {
+    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
+      var beforeCloseResult;
+      return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              if (!onBeforeClose) {
+                _context3.next = 6;
+                break;
+              }
 
-    if (onClose) {
-      onClose(results);
-    }
-  };
+              _context3.next = 3;
+              return onBeforeClose(results);
+
+            case 3:
+              beforeCloseResult = _context3.sent;
+
+              if (beforeCloseResult) {
+                _context3.next = 6;
+                break;
+              }
+
+              return _context3.abrupt("return");
+
+            case 6:
+              setVisible(false);
+
+              if (onClose) {
+                onClose(results);
+              }
+
+            case 8:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    }));
+
+    return function handleClose() {
+      return _ref3.apply(this, arguments);
+    };
+  }();
 
   var mCols = useMemo(function () {
     var cols = columns ? _toConsumableArray(columns) : [{
       title: '编号',
       colId: 'id',
       dataIndex: typeof rowKey === 'string' ? rowKey : undefined,
-      render: function render(_1, _2, _3, _ref3) {
-        var node = _ref3.node;
+      render: function render(_1, _2, _3, _ref4) {
+        var node = _ref4.node;
         return node.id || '';
       }
     }];
     cols.unshift({
       title: '',
-      colId: 'delete',
+      colId: '__delete__',
       width: 32,
-      render: function render(_1, _2, index, _ref4) {
-        var context = _ref4.context,
-            node = _ref4.node;
+      render: function render(_1, _2, index, _ref5) {
+        var context = _ref5.context,
+            node = _ref5.node;
         var key = node.id;
-        return /*#__PURE__*/React.createElement(DeleteTwoTone, {
+        return /*#__PURE__*/React.createElement(Icons.Delete, {
           onClick: function onClick() {
             if (!context.paused) {
               return;
@@ -273,9 +313,9 @@ export default function useBatchOperate(options) {
       dataIndex: 'status',
       flex: 1,
       resizable: false,
-      render: function render(_, record, index, _ref5) {
-        var context = _ref5.context,
-            node = _ref5.node;
+      render: function render(_, record, index, _ref6) {
+        var context = _ref6.context,
+            node = _ref6.node;
         var key = node.id;
         var result = context.results.get(key);
 
@@ -299,18 +339,41 @@ export default function useBatchOperate(options) {
             type: "error"
           }), /*#__PURE__*/React.createElement("span", null, " ", result.message, " "), /*#__PURE__*/React.createElement(ReloadOutlined, {
             onClick: function onClick() {
-              return reload(record, key);
+              return _reload(record, key);
             }
           }));
         }
 
+        if (renderResult !== undefined) {
+          return renderResult({
+            data: record,
+            result: result,
+            elements: {
+              failIcon: /*#__PURE__*/React.createElement(Icons.Tip, {
+                type: "error"
+              }),
+              successIcon: /*#__PURE__*/React.createElement(Icons.Tip, {
+                type: "success"
+              }),
+              reloadButton: /*#__PURE__*/React.createElement(ReloadOutlined, {
+                onClick: function onClick() {
+                  return _reload(record, key);
+                }
+              })
+            },
+            reload: function reload() {
+              _reload(record, key);
+            }
+          });
+        }
+
         return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Icons.Tip, {
           type: "success"
-        }), /*#__PURE__*/React.createElement("span", null, " ", (result || '操作成功').toString()));
+        }), /*#__PURE__*/React.createElement("span", null, " ", (typeof result === 'string' ? result : '操作成功').toString()));
       }
     });
     return cols;
-  }, [columns, paused, active, results]);
+  }, [columns, paused, active]);
   var node = /*#__PURE__*/React.createElement(Modal, {
     title: modalTitle,
     open: visible,
@@ -320,9 +383,8 @@ export default function useBatchOperate(options) {
     footer: null,
     maskClosable: false,
     bodyStyle: {
-      height: '549px',
-      padding: 0,
-      backgroundColor: '#f9f9f9'
+      height: 550,
+      padding: 0
     },
     afterClose: function afterClose() {
       setResults(new Map());
@@ -333,7 +395,8 @@ export default function useBatchOperate(options) {
     keyboard: false
   }, /*#__PURE__*/React.createElement(Layout, {
     header: /*#__PURE__*/React.createElement(Row, {
-      justify: "space-between"
+      justify: "space-between",
+      align: "middle"
     }, /*#__PURE__*/React.createElement("span", null, "\u660E\u7EC6".concat(results.size > 0 ? "(".concat(results.size, "/").concat(data.length, ")") : '')), /*#__PURE__*/React.createElement(Actions, {
       actions: [paused ? {
         disabled: data.length <= 0 || results.size >= data.length,

package/es/index.d.ts

@@ -37,6 +37,7 @@ export type { ColDef, ColGroupDef, ColumnState, GridOptions, GridReadyEvent, ICe
 export { GridApi, ColumnApi } from '@ag-grid-community/core';
 export * from '@ag-grid-community/react';
 export { default as TipMark } from './components/TipMark';
+export { default as Portal } from './components/Portal';
 export { default as BasicLayout } from './layouts/BasicLayout';
 export { default as BlankLayout } from './layouts/BlankLayout';
 export { default as MicroLayout } from './layouts/MicroLayout';

package/es/index.js

@@ -30,6 +30,7 @@ export * from "./components/DataGrid/hooks";
 export { GridApi, ColumnApi } from '@ag-grid-community/core';
 export * from '@ag-grid-community/react';
 export { default as TipMark } from "./components/TipMark";
+export { default as Portal } from "./components/Portal";
 export { default as BasicLayout } from "./layouts/BasicLayout";
 export { default as BlankLayout } from "./layouts/BlankLayout";
 export { default as MicroLayout } from "./layouts/MicroLayout";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/kits",
-  "version": "1.0.0-121",
+  "version": "1.0.0-122",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",