@hw-component/table 0.0.9-beta-v3 → 0.0.9-beta-v7

package/es/HTableBody/HeaderTitle/index.d.ts

@@ -0,0 +1,9 @@
+import { HTableBodyProps } from "../index";
+import React from "react";
+interface IProps {
+    headerTitle: HTableBodyProps["headerTitle"];
+    contentStyle?: React.CSSProperties;
+    rNode?: React.ReactNode;
+}
+declare const _default: ({ headerTitle, contentStyle, rNode }: IProps) => JSX.Element | null;
+export default _default;

package/es/HTableBody/HeaderTitle/index.js

@@ -0,0 +1,38 @@
+// welcome to hoo hoo hoo
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Row } from 'antd';
+import React from 'react';
+import { useHTableContext } from '../../context.js';
+import { useClassName } from '../../hooks/index.js';
+
+var HeaderTitle = (function (_ref) {
+  var headerTitle = _ref.headerTitle,
+    contentStyle = _ref.contentStyle,
+    rNode = _ref.rNode;
+  var _useHTableContext = useHTableContext(),
+    tableInstance = _useHTableContext.tableInstance,
+    selectedRowData = _useHTableContext.selectedRowData,
+    rowOnChange = _useHTableContext.rowOnChange,
+    allSelectChange = _useHTableContext.allSelectChange;
+  var headerBox = useClassName('hw-table-header-title-box');
+  if (!headerTitle && !rNode) {
+    return null;
+  }
+  return jsxs(Row, {
+    justify: "space-between",
+    align: "middle",
+    style: contentStyle,
+    children: [jsx("div", {
+      className: headerBox,
+      children: headerTitle && /*#__PURE__*/React.cloneElement(headerTitle, {
+        selectedRowData: selectedRowData,
+        allSelectChange: allSelectChange,
+        rowOnChange: rowOnChange,
+        tableInstance: tableInstance
+      })
+    }), rNode && rNode]
+  });
+});
+
+export { HeaderTitle as default };
+// powered by hdj

package/es/HTableBody/Options/index.js

@@ -20,7 +20,6 @@ var Options = (function (_ref) {
     setSizeChange = _ref.setSizeChange,
     columns = _ref.columns,
     onChange = _ref.onChange;
-  var className = useClassName("hw-table-body-option");
   var pointer = useClassName(["hw-table-pointer", "hw-table-body-option-icon"]);
   var ref = useRef(null);
   var _useState = useState([]),
@@ -69,7 +68,6 @@ var Options = (function (_ref) {
   };
   return jsx(Row, {
     justify: "end",
-    className: className,
     ref: ref,
     children: jsxs(Space, {
       size: 20,

package/es/HTableBody/Options/utils.d.ts

@@ -55,7 +55,7 @@ export declare const getItemValue: (data: ConfigItemModal) => {
     render?: ((dom: React.ReactNode, data: any, index: number, tableInstance: import("../../modal").HTableInstance) => React.ReactNode) | undefined;
     showSearch?: boolean | undefined;
     searchType?: string | undefined;
-    searchRender?: ((props: import("@hw-component/form/es/Form/modal").HItemProps, node: React.ReactNode, form: import("antd").FormInstance<any>) => React.ReactNode) | undefined;
+    searchRender?: ((item: import("@hw-component/form/es/Form/modal").HItemProps, node: React.ReactNode, form: import("antd").FormInstance<any>, tableInstance: import("../../modal").HTableInstance) => React.ReactNode) | undefined;
     rowSelectionTitle?: boolean | undefined;
     index?: number | undefined;
     filters?: boolean | import("antd/lib/table/interface").ColumnFilterItem[] | undefined;

package/es/HTableBody/index.d.ts

@@ -16,6 +16,7 @@ export interface HTableBodyProps extends Omit<ProTableProps<any, any>, "dataSour
     affixProps?: AffixProps | false;
     goTop?: boolean;
     optionsRender?: (node: React.ReactNode) => React.ReactNode;
+    paginationActionRender?: (tableInstance: HTableInstance) => React.ReactNode;
 }
-declare const _default: ({ configData, pagination, onPageChange, rowSelection, rowKey, emptyRender, errorRender, tableStyle, paginationStyle, headerTitle, options, actionRender, affixProps, goTop, size, optionsRender, ...props }: HTableBodyProps) => JSX.Element;
+declare const _default: ({ configData, pagination, onPageChange, rowSelection, rowKey, emptyRender, errorRender, tableStyle, paginationStyle, headerTitle, options, actionRender, affixProps, goTop, size, optionsRender, paginationActionRender, ...props }: HTableBodyProps) => JSX.Element;
 export default _default;

package/es/HTableBody/index.js

@@ -14,15 +14,15 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import ProTable from '@ant-design/pro-table';
 import { useSize, useCols, useSynchronousKeys } from './hooks.js';
 import { useHTableContext } from '../context.js';
-import React from 'react';
-import { Row, Alert, ConfigProvider, Empty } from 'antd';
+import { Alert, ConfigProvider, Empty } from 'antd';
 import { useHTableConfigContext } from '../TableConfig.js';
 import HTablePagination from '../HTablePagination/index.js';
 import { useClassName } from '../hooks/index.js';
 import AlertMsg from './AlertMsg.js';
 import Options from './Options/index.js';
+import HeaderTitle from './HeaderTitle/index.js';
 
-var _excluded = ["configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle", "paginationStyle", "headerTitle", "options", "actionRender", "affixProps", "goTop", "size", "optionsRender"];
+var _excluded = ["configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle", "paginationStyle", "headerTitle", "options", "actionRender", "affixProps", "goTop", "size", "optionsRender", "paginationActionRender"];
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 var defaultRender = function defaultRender() {
@@ -56,6 +56,7 @@ var Body = (function (_ref) {
     goTop = _ref$goTop === void 0 ? true : _ref$goTop,
     size = _ref.size,
     optionsRender = _ref.optionsRender,
+    paginationActionRender = _ref.paginationActionRender,
     props = _objectWithoutProperties(_ref, _excluded);
   var _ref2 = rowSelection || {},
     selectedRowKeys = _ref2.selectedRowKeys,
@@ -64,11 +65,11 @@ var Body = (function (_ref) {
     tableInstance = _useHTableContext.tableInstance,
     contextConfigData = _useHTableContext.configData,
     data = _useHTableContext.data,
-    selectedRowData = _useHTableContext.selectedRowData,
-    rowOnChange = _useHTableContext.rowOnChange,
-    error = _useHTableContext.error,
-    loading = _useHTableContext.loading,
-    allSelectChange = _useHTableContext.allSelectChange;
+    selectedRowData = _useHTableContext.selectedRowData;
+    _useHTableContext.rowOnChange;
+    var error = _useHTableContext.error,
+    loading = _useHTableContext.loading;
+    _useHTableContext.allSelectChange;
   var _useHTableConfigConte = useHTableConfigContext({
       emptyRender: emptyRender,
       errorRender: errorRender
@@ -108,21 +109,13 @@ var Body = (function (_ref) {
   var _selectedRowData$keys = _keysInstanceProperty(selectedRowData),
     keys = _selectedRowData$keys === void 0 ? [] : _selectedRowData$keys,
     selectAll = selectedRowData.selectAll;
+  var defaultOptionsNode = optionsRender ? optionsRender(optionsNode) : optionsNode;
   var alwaysShowAlert = keys.length > 0 || selectAll || configAlwaysShowAlert;
   var className = useClassName("hw-table-body");
   return jsxs("div", {
     style: tableStyle,
     className: "hw_table_body  ".concat(className),
-    children: [headerTitle && jsx(Row, {
-      gutter: [0, 8],
-      style: contentStyle,
-      children: /*#__PURE__*/React.cloneElement(headerTitle, {
-        selectedRowData: selectedRowData,
-        allSelectChange: allSelectChange,
-        rowOnChange: rowOnChange,
-        tableInstance: tableInstance
-      })
-    }), alwaysShowAlert && jsx("div", {
+    children: [alwaysShowAlert && jsx("div", {
       style: contentStyle,
       children: jsx(Alert, {
         message: jsx(AlertMsg, {
@@ -130,7 +123,11 @@ var Body = (function (_ref) {
         }),
         type: "info"
       })
-    }), optionsRender ? optionsRender(optionsNode) : optionsNode, jsxs(ConfigProvider, {
+    }), jsx(HeaderTitle, {
+      headerTitle: headerTitle,
+      contentStyle: contentStyle,
+      rNode: defaultOptionsNode
+    }), jsxs(ConfigProvider, {
       renderEmpty: function renderEmpty() {
         if (error) {
           return tableErrorRender === null || tableErrorRender === void 0 ? void 0 : tableErrorRender(tableInstance, error);
@@ -141,6 +138,9 @@ var Body = (function (_ref) {
         columns: cols,
         size: cuSize,
         search: false,
+        onChange: function onChange(pagination, filters, sorter) {
+          console.log(filters, sorter);
+        },
         options: false,
         tableStyle: {
           paddingBottom: 0
@@ -154,7 +154,8 @@ var Body = (function (_ref) {
         onPageChange: onPageChange,
         paginationStyle: paginationStyle,
         affixProps: affixProps,
-        goTop: goTop
+        goTop: goTop,
+        actionRender: paginationActionRender
       }, pagination))]
     })]
   });

package/es/HTablePagination/index.d.ts

@@ -2,11 +2,13 @@ import type { PaginationProps } from "antd";
 import type { ParamsModal } from "../modal";
 import React from "react";
 import type { AffixProps } from "antd/lib/affix";
+import { HTableInstance } from "../modal";
 export interface IPaginationProps extends PaginationProps {
     onPageChange?: (params: ParamsModal) => void;
     paginationStyle?: React.CSSProperties;
     affixProps?: AffixProps | false;
     goTop?: boolean;
+    actionRender?: (tableInstance: HTableInstance) => React.ReactNode;
 }
-declare const _default: ({ onPageChange, paginationStyle, affixProps, goTop, ...props }: IPaginationProps) => JSX.Element;
+declare const _default: ({ onPageChange, paginationStyle, affixProps, goTop, actionRender, ...props }: IPaginationProps) => JSX.Element;
 export default _default;

package/es/HTablePagination/index.js

@@ -19,7 +19,7 @@ import { useClassName } from '../hooks/index.js';
 import { useState } from 'react';
 import GoTop from '../GoTop/index.js';
 
-var _excluded = ["onPageChange", "paginationStyle", "affixProps", "goTop"],
+var _excluded = ["onPageChange", "paginationStyle", "affixProps", "goTop", "actionRender"],
   _excluded2 = ["offsetBottom"];
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context5, _context6; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context5 = ownKeys(Object(t), !0)).call(_context5, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context6 = ownKeys(Object(t))).call(_context6, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -28,10 +28,12 @@ var HTablePagination = (function (_ref) {
     paginationStyle = _ref.paginationStyle,
     affixProps = _ref.affixProps,
     goTop = _ref.goTop,
+    actionRender = _ref.actionRender,
     props = _objectWithoutProperties(_ref, _excluded);
   var _useHTableContext = useHTableContext(),
     contextOnPageChange = _useHTableContext.onPageChange,
-    data = _useHTableContext.data;
+    data = _useHTableContext.data,
+    tableInstance = _useHTableContext.tableInstance;
   var tableOnPageChange = onPageChange || contextOnPageChange;
   var _ref2 = data || {},
     size = _ref2.size,
@@ -49,11 +51,14 @@ var HTablePagination = (function (_ref) {
     return jsx(Fragment, {});
   }
   if (affixProps === false) {
-    return jsx(Row, {
-      justify: "end",
+    return jsxs(Row, {
+      justify: "space-between",
+      align: "middle",
       className: className,
       style: paginationStyle,
-      children: jsx(Pagination, _objectSpread({
+      children: [jsx("div", {
+        children: actionRender === null || actionRender === void 0 ? void 0 : actionRender(tableInstance)
+      }), jsx(Pagination, _objectSpread({
         size: "small",
         showQuickJumper: true,
         pageSize: pageSize,
@@ -72,7 +77,7 @@ var HTablePagination = (function (_ref) {
             current: pn
           });
         }
-      }, props))
+      }, props))]
     });
   }
   var _ref5 = affixProps || {},
@@ -93,10 +98,13 @@ var HTablePagination = (function (_ref) {
     }
   }, afProps), {}, {
     children: jsxs(Row, {
-      justify: "end",
+      justify: "space-between",
       className: className,
+      align: "middle",
       style: _objectSpread(_objectSpread({}, paginationStyle), style),
-      children: [jsx(Pagination, _objectSpread({
+      children: [jsx("div", {
+        children: actionRender === null || actionRender === void 0 ? void 0 : actionRender(tableInstance)
+      }), jsx(Pagination, _objectSpread({
         size: "small",
         showQuickJumper: true,
         pageSize: pageSize,

package/es/index.css

@@ -41,9 +41,6 @@
 .ant-hw-table-header .ant-hw-table-header-item-hide {
   display: none;
 }
-.ant-hw-table-body-option {
-  padding: 0px 24px 16px 24px;
-}
 .ant-hw-table-body-option-icon {
   font-size: 16px;
 }
@@ -84,3 +81,15 @@
 .ant-hw-table-pointer:hover {
   color: #1890ff;
 }
+.ant-hw-table-header-title-box {
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  position: relative;
+  margin-right: 12px;
+}

package/es/modal.d.ts

@@ -70,6 +70,7 @@ export interface HTableProps extends Omit<ProTableProps<any, any>, "request" | "
     goTop?: boolean;
     optionsRender?: (node: React.ReactNode) => React.ReactNode;
     onFinish?: (value: any) => Promise<any>;
+    paginationActionRender?: (tableInstance: HTableInstance) => React.ReactNode;
 }
 export interface TableInstance {
     reload: (params?: ParamsModal) => Promise<any>;

package/lib/HTableBody/HeaderTitle/index.d.ts

@@ -0,0 +1,9 @@
+import { HTableBodyProps } from "../index";
+import React from "react";
+interface IProps {
+    headerTitle: HTableBodyProps["headerTitle"];
+    contentStyle?: React.CSSProperties;
+    rNode?: React.ReactNode;
+}
+declare const _default: ({ headerTitle, contentStyle, rNode }: IProps) => JSX.Element | null;
+export default _default;

package/lib/HTableBody/HeaderTitle/index.js

@@ -0,0 +1,41 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var antd = require('antd');
+var React = require('react');
+var context = require('../../context.js');
+var index = require('../../hooks/index.js');
+
+var HeaderTitle = (function (_ref) {
+  var headerTitle = _ref.headerTitle,
+    contentStyle = _ref.contentStyle,
+    rNode = _ref.rNode;
+  var _useHTableContext = context.useHTableContext(),
+    tableInstance = _useHTableContext.tableInstance,
+    selectedRowData = _useHTableContext.selectedRowData,
+    rowOnChange = _useHTableContext.rowOnChange,
+    allSelectChange = _useHTableContext.allSelectChange;
+  var headerBox = index.useClassName('hw-table-header-title-box');
+  if (!headerTitle && !rNode) {
+    return null;
+  }
+  return jsxRuntime.jsxs(antd.Row, {
+    justify: "space-between",
+    align: "middle",
+    style: contentStyle,
+    children: [jsxRuntime.jsx("div", {
+      className: headerBox,
+      children: headerTitle && /*#__PURE__*/React.cloneElement(headerTitle, {
+        selectedRowData: selectedRowData,
+        allSelectChange: allSelectChange,
+        rowOnChange: rowOnChange,
+        tableInstance: tableInstance
+      })
+    }), rNode && rNode]
+  });
+});
+
+exports.default = HeaderTitle;
+// powered by h

package/lib/HTableBody/Options/index.js

@@ -23,7 +23,6 @@ var Options = (function (_ref) {
     setSizeChange = _ref.setSizeChange,
     columns = _ref.columns,
     onChange = _ref.onChange;
-  var className = index.useClassName("hw-table-body-option");
   var pointer = index.useClassName(["hw-table-pointer", "hw-table-body-option-icon"]);
   var ref = React.useRef(null);
   var _useState = React.useState([]),
@@ -72,7 +71,6 @@ var Options = (function (_ref) {
   };
   return jsxRuntime.jsx(antd.Row, {
     justify: "end",
-    className: className,
     ref: ref,
     children: jsxRuntime.jsxs(antd.Space, {
       size: 20,

package/lib/HTableBody/Options/utils.d.ts

@@ -55,7 +55,7 @@ export declare const getItemValue: (data: ConfigItemModal) => {
     render?: ((dom: React.ReactNode, data: any, index: number, tableInstance: import("../../modal").HTableInstance) => React.ReactNode) | undefined;
     showSearch?: boolean | undefined;
     searchType?: string | undefined;
-    searchRender?: ((props: import("@hw-component/form/es/Form/modal").HItemProps, node: React.ReactNode, form: import("antd").FormInstance<any>) => React.ReactNode) | undefined;
+    searchRender?: ((item: import("@hw-component/form/es/Form/modal").HItemProps, node: React.ReactNode, form: import("antd").FormInstance<any>, tableInstance: import("../../modal").HTableInstance) => React.ReactNode) | undefined;
     rowSelectionTitle?: boolean | undefined;
     index?: number | undefined;
     filters?: boolean | import("antd/lib/table/interface").ColumnFilterItem[] | undefined;

package/lib/HTableBody/index.d.ts

@@ -16,6 +16,7 @@ export interface HTableBodyProps extends Omit<ProTableProps<any, any>, "dataSour
     affixProps?: AffixProps | false;
     goTop?: boolean;
     optionsRender?: (node: React.ReactNode) => React.ReactNode;
+    paginationActionRender?: (tableInstance: HTableInstance) => React.ReactNode;
 }
-declare const _default: ({ configData, pagination, onPageChange, rowSelection, rowKey, emptyRender, errorRender, tableStyle, paginationStyle, headerTitle, options, actionRender, affixProps, goTop, size, optionsRender, ...props }: HTableBodyProps) => JSX.Element;
+declare const _default: ({ configData, pagination, onPageChange, rowSelection, rowKey, emptyRender, errorRender, tableStyle, paginationStyle, headerTitle, options, actionRender, affixProps, goTop, size, optionsRender, paginationActionRender, ...props }: HTableBodyProps) => JSX.Element;
 export default _default;

package/lib/HTableBody/index.js

@@ -17,15 +17,15 @@ var jsxRuntime = require('react/jsx-runtime');
 var ProTable = require('@ant-design/pro-table');
 var hooks = require('./hooks.js');
 var context = require('../context.js');
-var React = require('react');
 var antd = require('antd');
 var TableConfig = require('../TableConfig.js');
-var index$2 = require('../HTablePagination/index.js');
+var index$3 = require('../HTablePagination/index.js');
 var index$1 = require('../hooks/index.js');
 var AlertMsg = require('./AlertMsg.js');
 var index = require('./Options/index.js');
+var index$2 = require('./HeaderTitle/index.js');
 
-var _excluded = ["configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle", "paginationStyle", "headerTitle", "options", "actionRender", "affixProps", "goTop", "size", "optionsRender"];
+var _excluded = ["configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle", "paginationStyle", "headerTitle", "options", "actionRender", "affixProps", "goTop", "size", "optionsRender", "paginationActionRender"];
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 var defaultRender = function defaultRender() {
@@ -59,6 +59,7 @@ var Body = (function (_ref) {
     goTop = _ref$goTop === void 0 ? true : _ref$goTop,
     size = _ref.size,
     optionsRender = _ref.optionsRender,
+    paginationActionRender = _ref.paginationActionRender,
     props = _objectWithoutProperties(_ref, _excluded);
   var _ref2 = rowSelection || {},
     selectedRowKeys = _ref2.selectedRowKeys,
@@ -67,11 +68,11 @@ var Body = (function (_ref) {
     tableInstance = _useHTableContext.tableInstance,
     contextConfigData = _useHTableContext.configData,
     data = _useHTableContext.data,
-    selectedRowData = _useHTableContext.selectedRowData,
-    rowOnChange = _useHTableContext.rowOnChange,
-    error = _useHTableContext.error,
-    loading = _useHTableContext.loading,
-    allSelectChange = _useHTableContext.allSelectChange;
+    selectedRowData = _useHTableContext.selectedRowData;
+    _useHTableContext.rowOnChange;
+    var error = _useHTableContext.error,
+    loading = _useHTableContext.loading;
+    _useHTableContext.allSelectChange;
   var _useHTableConfigConte = TableConfig.useHTableConfigContext({
       emptyRender: emptyRender,
       errorRender: errorRender
@@ -111,21 +112,13 @@ var Body = (function (_ref) {
   var _selectedRowData$keys = _keysInstanceProperty(selectedRowData),
     keys = _selectedRowData$keys === void 0 ? [] : _selectedRowData$keys,
     selectAll = selectedRowData.selectAll;
+  var defaultOptionsNode = optionsRender ? optionsRender(optionsNode) : optionsNode;
   var alwaysShowAlert = keys.length > 0 || selectAll || configAlwaysShowAlert;
   var className = index$1.useClassName("hw-table-body");
   return jsxRuntime.jsxs("div", {
     style: tableStyle,
     className: "hw_table_body  ".concat(className),
-    children: [headerTitle && jsxRuntime.jsx(antd.Row, {
-      gutter: [0, 8],
-      style: contentStyle,
-      children: /*#__PURE__*/React.cloneElement(headerTitle, {
-        selectedRowData: selectedRowData,
-        allSelectChange: allSelectChange,
-        rowOnChange: rowOnChange,
-        tableInstance: tableInstance
-      })
-    }), alwaysShowAlert && jsxRuntime.jsx("div", {
+    children: [alwaysShowAlert && jsxRuntime.jsx("div", {
       style: contentStyle,
       children: jsxRuntime.jsx(antd.Alert, {
         message: jsxRuntime.jsx(AlertMsg.default, {
@@ -133,7 +126,11 @@ var Body = (function (_ref) {
         }),
         type: "info"
       })
-    }), optionsRender ? optionsRender(optionsNode) : optionsNode, jsxRuntime.jsxs(antd.ConfigProvider, {
+    }), jsxRuntime.jsx(index$2.default, {
+      headerTitle: headerTitle,
+      contentStyle: contentStyle,
+      rNode: defaultOptionsNode
+    }), jsxRuntime.jsxs(antd.ConfigProvider, {
       renderEmpty: function renderEmpty() {
         if (error) {
           return tableErrorRender === null || tableErrorRender === void 0 ? void 0 : tableErrorRender(tableInstance, error);
@@ -144,6 +141,9 @@ var Body = (function (_ref) {
         columns: cols,
         size: cuSize,
         search: false,
+        onChange: function onChange(pagination, filters, sorter) {
+          console.log(filters, sorter);
+        },
         options: false,
         tableStyle: {
           paddingBottom: 0
@@ -153,11 +153,12 @@ var Body = (function (_ref) {
         rowKey: rowKey,
         dataSource: records,
         pagination: false
-      })), pagination !== false && jsxRuntime.jsx(index$2.default, _objectSpread({
+      })), pagination !== false && jsxRuntime.jsx(index$3.default, _objectSpread({
         onPageChange: onPageChange,
         paginationStyle: paginationStyle,
         affixProps: affixProps,
-        goTop: goTop
+        goTop: goTop,
+        actionRender: paginationActionRender
       }, pagination))]
     })]
   });

package/lib/HTablePagination/index.d.ts

@@ -2,11 +2,13 @@ import type { PaginationProps } from "antd";
 import type { ParamsModal } from "../modal";
 import React from "react";
 import type { AffixProps } from "antd/lib/affix";
+import { HTableInstance } from "../modal";
 export interface IPaginationProps extends PaginationProps {
     onPageChange?: (params: ParamsModal) => void;
     paginationStyle?: React.CSSProperties;
     affixProps?: AffixProps | false;
     goTop?: boolean;
+    actionRender?: (tableInstance: HTableInstance) => React.ReactNode;
 }
-declare const _default: ({ onPageChange, paginationStyle, affixProps, goTop, ...props }: IPaginationProps) => JSX.Element;
+declare const _default: ({ onPageChange, paginationStyle, affixProps, goTop, actionRender, ...props }: IPaginationProps) => JSX.Element;
 export default _default;

package/lib/HTablePagination/index.js

@@ -22,7 +22,7 @@ var index = require('../hooks/index.js');
 var React = require('react');
 var index$1 = require('../GoTop/index.js');
 
-var _excluded = ["onPageChange", "paginationStyle", "affixProps", "goTop"],
+var _excluded = ["onPageChange", "paginationStyle", "affixProps", "goTop", "actionRender"],
   _excluded2 = ["offsetBottom"];
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context5, _context6; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context5 = ownKeys(Object(t), !0)).call(_context5, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context6 = ownKeys(Object(t))).call(_context6, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -31,10 +31,12 @@ var HTablePagination = (function (_ref) {
     paginationStyle = _ref.paginationStyle,
     affixProps = _ref.affixProps,
     goTop = _ref.goTop,
+    actionRender = _ref.actionRender,
     props = _objectWithoutProperties(_ref, _excluded);
   var _useHTableContext = context.useHTableContext(),
     contextOnPageChange = _useHTableContext.onPageChange,
-    data = _useHTableContext.data;
+    data = _useHTableContext.data,
+    tableInstance = _useHTableContext.tableInstance;
   var tableOnPageChange = onPageChange || contextOnPageChange;
   var _ref2 = data || {},
     size = _ref2.size,
@@ -52,11 +54,14 @@ var HTablePagination = (function (_ref) {
     return jsxRuntime.jsx(jsxRuntime.Fragment, {});
   }
   if (affixProps === false) {
-    return jsxRuntime.jsx(antd.Row, {
-      justify: "end",
+    return jsxRuntime.jsxs(antd.Row, {
+      justify: "space-between",
+      align: "middle",
       className: className,
       style: paginationStyle,
-      children: jsxRuntime.jsx(antd.Pagination, _objectSpread({
+      children: [jsxRuntime.jsx("div", {
+        children: actionRender === null || actionRender === void 0 ? void 0 : actionRender(tableInstance)
+      }), jsxRuntime.jsx(antd.Pagination, _objectSpread({
         size: "small",
         showQuickJumper: true,
         pageSize: pageSize,
@@ -75,7 +80,7 @@ var HTablePagination = (function (_ref) {
             current: pn
           });
         }
-      }, props))
+      }, props))]
     });
   }
   var _ref5 = affixProps || {},
@@ -96,10 +101,13 @@ var HTablePagination = (function (_ref) {
     }
   }, afProps), {}, {
     children: jsxRuntime.jsxs(antd.Row, {
-      justify: "end",
+      justify: "space-between",
       className: className,
+      align: "middle",
       style: _objectSpread(_objectSpread({}, paginationStyle), style),
-      children: [jsxRuntime.jsx(antd.Pagination, _objectSpread({
+      children: [jsxRuntime.jsx("div", {
+        children: actionRender === null || actionRender === void 0 ? void 0 : actionRender(tableInstance)
+      }), jsxRuntime.jsx(antd.Pagination, _objectSpread({
         size: "small",
         showQuickJumper: true,
         pageSize: pageSize,

package/lib/index.css

@@ -41,9 +41,6 @@
 .ant-hw-table-header .ant-hw-table-header-item-hide {
   display: none;
 }
-.ant-hw-table-body-option {
-  padding: 0px 24px 16px 24px;
-}
 .ant-hw-table-body-option-icon {
   font-size: 16px;
 }
@@ -84,3 +81,15 @@
 .ant-hw-table-pointer:hover {
   color: #1890ff;
 }
+.ant-hw-table-header-title-box {
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  position: relative;
+  margin-right: 12px;
+}

package/lib/modal.d.ts

@@ -70,6 +70,7 @@ export interface HTableProps extends Omit<ProTableProps<any, any>, "request" | "
     goTop?: boolean;
     optionsRender?: (node: React.ReactNode) => React.ReactNode;
     onFinish?: (value: any) => Promise<any>;
+    paginationActionRender?: (tableInstance: HTableInstance) => React.ReactNode;
 }
 export interface TableInstance {
     reload: (params?: ParamsModal) => Promise<any>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hw-component/table",
-  "version": "0.0.9-beta-v3",
+  "version": "0.0.9-beta-v7",
   "description": "基于antd二次开发table组件",
   "keywords": [
     "table"

package/src/components/HTableBody/HeaderTitle/index.tsx

@@ -0,0 +1,31 @@
+import {Row, Space} from "antd";
+import {HTableBodyProps} from "../index";
+import React, {DetailedReactHTMLElement} from "react";
+import { useHTableContext } from "../../context";
+import {useClassName} from "../../hooks";
+interface IProps {
+    headerTitle:HTableBodyProps["headerTitle"];
+    contentStyle?:React.CSSProperties;
+    rNode?:React.ReactNode;
+}
+export default ({headerTitle,contentStyle,rNode}:IProps)=>{
+    const {
+        tableInstance,
+        selectedRowData,
+        rowOnChange,
+        allSelectChange,
+    } = useHTableContext();
+    const headerBox=useClassName('hw-table-header-title-box');
+    if (!headerTitle&&!rNode){
+        return null
+    }
+    return <Row justify={"space-between"} align={"middle"} style={contentStyle}>
+        <div className={headerBox}>
+            {headerTitle && React.cloneElement(
+                headerTitle as DetailedReactHTMLElement<any, any>,
+                { selectedRowData, allSelectChange, rowOnChange, tableInstance }
+            )}
+        </div>
+        {rNode&&rNode}
+    </Row>
+}

package/src/components/HTableBody/Options/index.tsx

@@ -20,7 +20,6 @@ export default ({
   columns,
   onChange,
 }: IProps) => {
-  const className = useClassName("hw-table-body-option");
   const pointer = useClassName([
     "hw-table-pointer",
     "hw-table-body-option-icon",
@@ -59,7 +58,7 @@ export default ({
     );
   };
   return (
-    <Row justify={"end"} className={className} ref={ref}>
+    <Row justify={"end"} ref={ref}>
       <Space size={20}>
         {reload && (
           <Tooltip title="刷新">

package/src/components/HTableBody/index.tsx

@@ -14,6 +14,7 @@ import AlertMsg from "./AlertMsg";
 import type { HRowSelection } from "../modal";
 import type { AffixProps } from "antd/lib/affix";
 import Options from "./Options";
+import HeaderTitle from './HeaderTitle';
 export interface HTableBodyProps
   extends Omit<ProTableProps<any, any>, "dataSource" | "rowSelection"> {
   configData?: ConfigDataModal;
@@ -30,6 +31,8 @@ export interface HTableBodyProps
   affixProps?: AffixProps | false;
   goTop?: boolean;
   optionsRender?: (node: React.ReactNode) => React.ReactNode;
+  paginationActionRender?: (tableInstance: HTableInstance) => React.ReactNode;
+
 }
 const defaultRender = () => {
   return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
@@ -56,6 +59,7 @@ export default ({
   goTop = true,
   size,
   optionsRender,
+                  paginationActionRender,
   ...props
 }: HTableBodyProps) => {
   // @ts-ignore
@@ -97,19 +101,11 @@ export default ({
     />
   );
   const { keys = [], selectAll } = selectedRowData;
-
+  const defaultOptionsNode=optionsRender ? optionsRender(optionsNode) : optionsNode;
   const alwaysShowAlert = keys.length > 0 || selectAll || configAlwaysShowAlert;
   const className = useClassName("hw-table-body");
   return (
     <div style={tableStyle} className={`hw_table_body  ${className}`}>
-      {headerTitle && (
-        <Row gutter={[0, 8]} style={contentStyle}>
-          {React.cloneElement(
-            headerTitle as DetailedReactHTMLElement<any, any>,
-            { selectedRowData, allSelectChange, rowOnChange, tableInstance }
-          )}
-        </Row>
-      )}
       {alwaysShowAlert && (
         <div style={contentStyle}>
           <Alert
@@ -118,7 +114,7 @@ export default ({
           />
         </div>
       )}
-      {optionsRender ? optionsRender(optionsNode) : optionsNode}
+      <HeaderTitle headerTitle={headerTitle} contentStyle={contentStyle} rNode={defaultOptionsNode}/>
       <ConfigProvider
         renderEmpty={() => {
           if (error) {
@@ -132,6 +128,9 @@ export default ({
           columns={cols as any}
           size={cuSize}
           search={false}
+          onChange={(pagination, filters, sorter)=>{
+            console.log(filters,sorter)
+          }}
           options={false}
           tableStyle={{
             paddingBottom: 0,
@@ -148,6 +147,7 @@ export default ({
             paginationStyle={paginationStyle}
             affixProps={affixProps}
             goTop={goTop}
+            actionRender={paginationActionRender}
             {...pagination}
           />
         )}

package/src/components/HTablePagination/index.tsx

@@ -6,20 +6,23 @@ import { useClassName } from "../hooks";
 import React, { useState } from "react";
 import type { AffixProps } from "antd/lib/affix";
 import GoTop from "../GoTop";
+import {HTableInstance} from "../modal";
 export interface IPaginationProps extends PaginationProps {
   onPageChange?: (params: ParamsModal) => void;
   paginationStyle?: React.CSSProperties;
   affixProps?: AffixProps | false;
   goTop?: boolean;
+  actionRender?: (tableInstance: HTableInstance) => React.ReactNode;
 }
 export default ({
   onPageChange,
   paginationStyle,
   affixProps,
   goTop,
+                  actionRender,
   ...props
 }: IPaginationProps) => {
-  const { onPageChange: contextOnPageChange, data } = useHTableContext();
+  const { onPageChange: contextOnPageChange, data,tableInstance } = useHTableContext();
   const tableOnPageChange = onPageChange || contextOnPageChange;
   const { size, current, total } = data || {};
   const pageCurrent = Number.parseInt(current || "1", 10);
@@ -32,7 +35,10 @@ export default ({
   }
   if (affixProps === false) {
     return (
-      <Row justify={"end"} className={className} style={paginationStyle}>
+      <Row justify={"space-between"} align={"middle"} className={className} style={paginationStyle}>
+        <div>
+          {actionRender?.(tableInstance)}
+        </div>
         <Pagination
           size={"small"}
           showQuickJumper={true}
@@ -67,10 +73,14 @@ export default ({
       {...afProps}
     >
       <Row
-        justify={"end"}
+        justify={"space-between"}
         className={className}
+        align={"middle"}
         style={{ ...paginationStyle, ...style }}
       >
+        <div>
+          {actionRender?.(tableInstance)}
+        </div>
         <Pagination
           size={"small"}
           showQuickJumper={true}

package/src/components/index.less

@@ -44,10 +44,6 @@
   }
 }
 
-.@{ant-prefix}-hw-table-body-option{
-  padding: 0px 24px 16px 24px;
-
-}
 .@{ant-prefix}-hw-table-body-option-icon{
  font-size: 16px;
 }
@@ -84,4 +80,10 @@
     color:#1890ff;
   }
 }
+.@{ant-prefix}-hw-table-header-title-box{
+  flex: 1;
+  display: flex;
+  position: relative;
+  margin-right: 12px;
+}
 

package/src/components/modal.ts

@@ -103,6 +103,7 @@ export interface HTableProps
   goTop?: boolean;
   optionsRender?: (node: React.ReactNode) => React.ReactNode;
   onFinish?: (value: any) => Promise<any>;
+  paginationActionRender?: (tableInstance: HTableInstance) => React.ReactNode;
 }
 export interface TableInstance {
   reload: (params?: ParamsModal) => Promise<any>;

package/src/pages/Table/index.tsx

@@ -7,16 +7,11 @@ const configData = [
     title: "座位21321",
     showSearch: true,
     searchType: "select",
-    hideInTable: true,
     dataIndex: "name",
+    sorter: true,
     itemProps: {
       options: [{ label: "1", value: 1 }],
     },
-    searchRender:(item,node,form,tableInstance)=>{
-      return <div onClick={()=>{
-        tableInstance.table.dispatch("test",{name:"111"})
-      }}>点击</div>
-    }
   },
   {
     title: "座位断开",
@@ -69,36 +64,25 @@ export default () => {
           configData={configData}
           rowKey={"id"}
           table={hTable}
-          optionsRender={(node) => {
-            return <Space>ffff{node}</Space>;
-          }}
           action={{
             test:(params)=>{
                 console.log(params,"lllll")
             }
           }}
           rowSelection={{
-            alwaysShowAlert: true,
             allPageCheck: false,
           }}
           affixProps={{
             target: () => document.querySelector(".body"),
           }}
-          actionRender={() => {
-            return (
-              <Button
-                onClick={() => {
-                  console.log(hTable.table.settingKeys);
-                }}
-              >
-                你大爷
-              </Button>
-            );
-          }}
           scroll={{
             x: 1000,
           }}
           headerTitle={<Button type={"primary"}>操作</Button>}
+          options={false}
+          paginationActionRender={()=>{
+            return <div>你大爷</div>
+          }}
           request={(params) => {
             console.log(params,".....");
             const { current = 1 } = params;