@hw-component/table 0.0.5-beta-v6 → 0.0.5-beta-v8

package/es/GoTop/index.d.ts

@@ -0,0 +1,3 @@
+import type { IPaginationProps } from "../HTablePagination/index";
+declare const _default: ({ affixProps }: IPaginationProps) => JSX.Element;
+export default _default;

package/es/GoTop/index.js

@@ -0,0 +1,63 @@
+// welcome to hoo hoo hoo
+import _slicedToArray from '@babel/runtime-corejs3/helpers/slicedToArray';
+import { jsx } from 'react/jsx-runtime';
+import { useClassName } from '../hooks/index.js';
+import { useState, useEffect } from 'react';
+
+var GoTop = (function (_ref) {
+  var affixProps = _ref.affixProps;
+  var className = useClassName("hw-top-btn");
+  var _ref2 = affixProps || {},
+    target = _ref2.target;
+  var _useState = useState({
+      display: "none"
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    style = _useState2[0],
+    setStyle = _useState2[1];
+  var dom = target === null || target === void 0 ? void 0 : target();
+  var cuDom = dom || document.body;
+  var goTopFn = function goTopFn() {
+    cuDom.scrollTo({
+      top: 0
+    });
+  };
+  useEffect(function () {
+    var scroll = function scroll(e) {
+      var top = e.target.scrollTop;
+      if (top > 10) {
+        setStyle({
+          display: "block"
+        });
+        return;
+      }
+      setStyle({
+        display: "none"
+      });
+    };
+    cuDom.addEventListener("scroll", scroll);
+    return function () {
+      cuDom.removeEventListener("scroll", scroll);
+    };
+  }, [dom]);
+  useEffect(function () {
+    var top = cuDom.scrollTop;
+    if (top > 10) {
+      setStyle({
+        display: "block"
+      });
+      return;
+    }
+    setStyle({
+      display: "none"
+    });
+  }, []);
+  return jsx("div", {
+    className: className,
+    style: style,
+    onClick: goTopFn
+  });
+});
+
+export { GoTop as default };
+// powered by hdj

package/es/HTableBody/index.d.ts

@@ -3,7 +3,7 @@ import type { ActionRenderFn, ConfigDataModal, ParamsModal } from "../modal";
 import React from "react";
 import type { HTableInstance } from "../modal";
 import type { HRowSelection } from "../modal";
-import { AffixProps } from "antd/lib/affix";
+import type { AffixProps } from "antd/lib/affix";
 interface HTableBodyProps extends Omit<ProTableProps<any, any>, "dataSource" | "rowSelection"> {
     configData?: ConfigDataModal;
     onPageChange?: (params: ParamsModal) => void;
@@ -14,6 +14,7 @@ interface HTableBodyProps extends Omit<ProTableProps<any, any>, "dataSource" | "
     actionRender?: ActionRenderFn;
     rowSelection?: HRowSelection | false;
     affixProps?: AffixProps | false;
+    goTop?: boolean;
 }
-declare const _default: ({ configData, pagination, onPageChange, rowSelection, rowKey, emptyRender, errorRender, tableStyle, paginationStyle, headerTitle, options, actionRender, affixProps, ...props }: HTableBodyProps) => JSX.Element;
+declare const _default: ({ configData, pagination, onPageChange, rowSelection, rowKey, emptyRender, errorRender, tableStyle, paginationStyle, headerTitle, options, actionRender, affixProps, goTop, ...props }: HTableBodyProps) => JSX.Element;
 export default _default;

package/es/HTableBody/index.js

@@ -21,7 +21,7 @@ import HTablePagination from '../HTablePagination/index.js';
 import { useClassName } from '../hooks/index.js';
 import AlertMsg from './AlertMsg.js';
 
-var _excluded = ["configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle", "paginationStyle", "headerTitle", "options", "actionRender", "affixProps"];
+var _excluded = ["configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle", "paginationStyle", "headerTitle", "options", "actionRender", "affixProps", "goTop"];
 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() {
@@ -32,7 +32,7 @@ var defaultRender = function defaultRender() {
 var contentStyle = {
   paddingLeft: 24,
   paddingRight: 24,
-  marginBottom: 16
+  paddingBottom: 16
 };
 var Body = (function (_ref) {
   var configData = _ref.configData,
@@ -51,6 +51,8 @@ var Body = (function (_ref) {
     options = _ref.options,
     actionRender = _ref.actionRender,
     affixProps = _ref.affixProps,
+    _ref$goTop = _ref.goTop,
+    goTop = _ref$goTop === void 0 ? true : _ref$goTop,
     props = _objectWithoutProperties(_ref, _excluded);
   var selectedRowKeys = rowSelection.selectedRowKeys;
   var _useHTableContext = useHTableContext(),
@@ -133,7 +135,8 @@ var Body = (function (_ref) {
       })), pagination !== false && jsx(HTablePagination, _objectSpread({
         onPageChange: onPageChange,
         paginationStyle: paginationStyle,
-        affixProps: affixProps
+        affixProps: affixProps,
+        goTop: goTop
       }, pagination))]
     })
   });

package/es/HTableHeader/index.js

@@ -39,7 +39,10 @@ var Header = (function (_ref) {
   }, [configData]);
   var className = useClassName("hw-table-header");
   return jsx(Card, {
-    style: _objectSpread({}, headerStyle),
+    style: _objectSpread({
+      borderBottomLeftRadius: 0,
+      borderBottomRightRadius: 0
+    }, headerStyle),
     bordered: false,
     className: "hw_table_header ".concat(className),
     bodyStyle: {

package/es/HTablePagination/index.d.ts

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

package/es/HTablePagination/index.js

@@ -12,13 +12,14 @@ import _slicedToArray from '@babel/runtime-corejs3/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/objectWithoutProperties';
 import _Number$parseInt from '@babel/runtime-corejs3/core-js/number/parse-int';
 import _concatInstanceProperty from '@babel/runtime-corejs3/core-js/instance/concat';
-import { jsx, Fragment } from 'react/jsx-runtime';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { Row, Pagination, Affix } from 'antd';
 import { useHTableContext } from '../context.js';
 import { useClassName } from '../hooks/index.js';
 import { useState } from 'react';
+import GoTop from '../GoTop/index.js';
 
-var _excluded = ["onPageChange", "paginationStyle", "affixProps"],
+var _excluded = ["onPageChange", "paginationStyle", "affixProps", "goTop"],
   _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; }
@@ -26,6 +27,7 @@ var HTablePagination = (function (_ref) {
   var onPageChange = _ref.onPageChange,
     paginationStyle = _ref.paginationStyle,
     affixProps = _ref.affixProps,
+    goTop = _ref.goTop,
     props = _objectWithoutProperties(_ref, _excluded);
   var _useHTableContext = useHTableContext(),
     contextOnPageChange = _useHTableContext.onPageChange,
@@ -89,11 +91,11 @@ var HTablePagination = (function (_ref) {
       });
     }
   }, afProps), {}, {
-    children: jsx(Row, {
+    children: jsxs(Row, {
       justify: "end",
       className: className,
       style: _objectSpread(_objectSpread({}, paginationStyle), style),
-      children: jsx(Pagination, _objectSpread({
+      children: [jsx(Pagination, _objectSpread({
         size: "small",
         showQuickJumper: true,
         pageSize: pageSize,
@@ -112,7 +114,9 @@ var HTablePagination = (function (_ref) {
             current: pn
           });
         }
-      }, props))
+      }, props)), goTop && jsx(GoTop, {
+        affixProps: affixProps
+      })]
     })
   }));
 });

package/es/index.css

@@ -2,7 +2,7 @@
   border-bottom-left-radius: 4px;
   border-bottom-right-radius: 4px;
   background-color: #fff;
-  overflow: hidden;
+  position: relative;
 }
 .ant-hw-table-body .ant-hw-table-pagination {
   padding: 12px 24px;
@@ -19,6 +19,18 @@
   padding: 24px;
   border-radius: 4px;
   background-color: #ffffff;
+  position: relative;
+}
+.ant-hw-top-btn {
+  position: absolute;
+  right: 10px;
+  bottom: 54px;
+  z-index: 9;
+  cursor: pointer;
+  width: 48px;
+  height: 48px;
+  background: url("./GoTop/goTop.png") no-repeat;
+  background-size: 100%;
 }
 .ant-hw-table-header {
   border-top-left-radius: 4px;

package/es/modal.d.ts

@@ -5,7 +5,7 @@ import type { ColProps } from "antd";
 import type React from "react";
 import type { ModalProps } from "antd";
 import type { TableProps } from "antd/lib/table";
-import { AffixProps } from "antd/lib/affix";
+import type { AffixProps } from "antd/lib/affix";
 export interface RowObj {
     keys?: React.Key[];
     rowData?: any[];
@@ -61,6 +61,7 @@ export interface HTableProps extends Omit<ProTableProps<any, any>, "request" | "
     allPageCheck?: boolean;
     rowSelection?: HRowSelection | false;
     affixProps?: AffixProps | false;
+    goTop?: boolean;
 }
 export interface TableInstance {
     reload: (params?: ParamsModal) => Promise<any>;

package/lib/GoTop/index.d.ts

@@ -0,0 +1,3 @@
+import type { IPaginationProps } from "../HTablePagination/index";
+declare const _default: ({ affixProps }: IPaginationProps) => JSX.Element;
+export default _default;

package/lib/GoTop/index.js

@@ -0,0 +1,66 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
+var jsxRuntime = require('react/jsx-runtime');
+var index = require('../hooks/index.js');
+var React = require('react');
+
+var GoTop = (function (_ref) {
+  var affixProps = _ref.affixProps;
+  var className = index.useClassName("hw-top-btn");
+  var _ref2 = affixProps || {},
+    target = _ref2.target;
+  var _useState = React.useState({
+      display: "none"
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    style = _useState2[0],
+    setStyle = _useState2[1];
+  var dom = target === null || target === void 0 ? void 0 : target();
+  var cuDom = dom || document.body;
+  var goTopFn = function goTopFn() {
+    cuDom.scrollTo({
+      top: 0
+    });
+  };
+  React.useEffect(function () {
+    var scroll = function scroll(e) {
+      var top = e.target.scrollTop;
+      if (top > 10) {
+        setStyle({
+          display: "block"
+        });
+        return;
+      }
+      setStyle({
+        display: "none"
+      });
+    };
+    cuDom.addEventListener("scroll", scroll);
+    return function () {
+      cuDom.removeEventListener("scroll", scroll);
+    };
+  }, [dom]);
+  React.useEffect(function () {
+    var top = cuDom.scrollTop;
+    if (top > 10) {
+      setStyle({
+        display: "block"
+      });
+      return;
+    }
+    setStyle({
+      display: "none"
+    });
+  }, []);
+  return jsxRuntime.jsx("div", {
+    className: className,
+    style: style,
+    onClick: goTopFn
+  });
+});
+
+exports.default = GoTop;
+// powered by h

package/lib/HTableBody/index.d.ts

@@ -3,7 +3,7 @@ import type { ActionRenderFn, ConfigDataModal, ParamsModal } from "../modal";
 import React from "react";
 import type { HTableInstance } from "../modal";
 import type { HRowSelection } from "../modal";
-import { AffixProps } from "antd/lib/affix";
+import type { AffixProps } from "antd/lib/affix";
 interface HTableBodyProps extends Omit<ProTableProps<any, any>, "dataSource" | "rowSelection"> {
     configData?: ConfigDataModal;
     onPageChange?: (params: ParamsModal) => void;
@@ -14,6 +14,7 @@ interface HTableBodyProps extends Omit<ProTableProps<any, any>, "dataSource" | "
     actionRender?: ActionRenderFn;
     rowSelection?: HRowSelection | false;
     affixProps?: AffixProps | false;
+    goTop?: boolean;
 }
-declare const _default: ({ configData, pagination, onPageChange, rowSelection, rowKey, emptyRender, errorRender, tableStyle, paginationStyle, headerTitle, options, actionRender, affixProps, ...props }: HTableBodyProps) => JSX.Element;
+declare const _default: ({ configData, pagination, onPageChange, rowSelection, rowKey, emptyRender, errorRender, tableStyle, paginationStyle, headerTitle, options, actionRender, affixProps, goTop, ...props }: HTableBodyProps) => JSX.Element;
 export default _default;

package/lib/HTableBody/index.js

@@ -24,7 +24,7 @@ var index$1 = require('../HTablePagination/index.js');
 var index = require('../hooks/index.js');
 var AlertMsg = require('./AlertMsg.js');
 
-var _excluded = ["configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle", "paginationStyle", "headerTitle", "options", "actionRender", "affixProps"];
+var _excluded = ["configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle", "paginationStyle", "headerTitle", "options", "actionRender", "affixProps", "goTop"];
 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() {
@@ -35,7 +35,7 @@ var defaultRender = function defaultRender() {
 var contentStyle = {
   paddingLeft: 24,
   paddingRight: 24,
-  marginBottom: 16
+  paddingBottom: 16
 };
 var Body = (function (_ref) {
   var configData = _ref.configData,
@@ -54,6 +54,8 @@ var Body = (function (_ref) {
     options = _ref.options,
     actionRender = _ref.actionRender,
     affixProps = _ref.affixProps,
+    _ref$goTop = _ref.goTop,
+    goTop = _ref$goTop === void 0 ? true : _ref$goTop,
     props = _objectWithoutProperties(_ref, _excluded);
   var selectedRowKeys = rowSelection.selectedRowKeys;
   var _useHTableContext = context.useHTableContext(),
@@ -136,7 +138,8 @@ var Body = (function (_ref) {
       })), pagination !== false && jsxRuntime.jsx(index$1.default, _objectSpread({
         onPageChange: onPageChange,
         paginationStyle: paginationStyle,
-        affixProps: affixProps
+        affixProps: affixProps,
+        goTop: goTop
       }, pagination))]
     })
   });

package/lib/HTableHeader/index.js

@@ -42,7 +42,10 @@ var Header = (function (_ref) {
   }, [configData]);
   var className = index.useClassName("hw-table-header");
   return jsxRuntime.jsx(antd.Card, {
-    style: _objectSpread({}, headerStyle),
+    style: _objectSpread({
+      borderBottomLeftRadius: 0,
+      borderBottomRightRadius: 0
+    }, headerStyle),
     bordered: false,
     className: "hw_table_header ".concat(className),
     bodyStyle: {

package/lib/HTablePagination/index.d.ts

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

package/lib/HTablePagination/index.js

@@ -20,8 +20,9 @@ var antd = require('antd');
 var context = require('../context.js');
 var index = require('../hooks/index.js');
 var React = require('react');
+var index$1 = require('../GoTop/index.js');
 
-var _excluded = ["onPageChange", "paginationStyle", "affixProps"],
+var _excluded = ["onPageChange", "paginationStyle", "affixProps", "goTop"],
   _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; }
@@ -29,6 +30,7 @@ var HTablePagination = (function (_ref) {
   var onPageChange = _ref.onPageChange,
     paginationStyle = _ref.paginationStyle,
     affixProps = _ref.affixProps,
+    goTop = _ref.goTop,
     props = _objectWithoutProperties(_ref, _excluded);
   var _useHTableContext = context.useHTableContext(),
     contextOnPageChange = _useHTableContext.onPageChange,
@@ -92,11 +94,11 @@ var HTablePagination = (function (_ref) {
       });
     }
   }, afProps), {}, {
-    children: jsxRuntime.jsx(antd.Row, {
+    children: jsxRuntime.jsxs(antd.Row, {
       justify: "end",
       className: className,
       style: _objectSpread(_objectSpread({}, paginationStyle), style),
-      children: jsxRuntime.jsx(antd.Pagination, _objectSpread({
+      children: [jsxRuntime.jsx(antd.Pagination, _objectSpread({
         size: "small",
         showQuickJumper: true,
         pageSize: pageSize,
@@ -115,7 +117,9 @@ var HTablePagination = (function (_ref) {
             current: pn
           });
         }
-      }, props))
+      }, props)), goTop && jsxRuntime.jsx(index$1.default, {
+        affixProps: affixProps
+      })]
     })
   }));
 });

package/lib/index.css

@@ -2,7 +2,7 @@
   border-bottom-left-radius: 4px;
   border-bottom-right-radius: 4px;
   background-color: #fff;
-  overflow: hidden;
+  position: relative;
 }
 .ant-hw-table-body .ant-hw-table-pagination {
   padding: 12px 24px;
@@ -19,6 +19,18 @@
   padding: 24px;
   border-radius: 4px;
   background-color: #ffffff;
+  position: relative;
+}
+.ant-hw-top-btn {
+  position: absolute;
+  right: 10px;
+  bottom: 54px;
+  z-index: 9;
+  cursor: pointer;
+  width: 48px;
+  height: 48px;
+  background: url("./GoTop/goTop.png") no-repeat;
+  background-size: 100%;
 }
 .ant-hw-table-header {
   border-top-left-radius: 4px;

package/lib/modal.d.ts

@@ -5,7 +5,7 @@ import type { ColProps } from "antd";
 import type React from "react";
 import type { ModalProps } from "antd";
 import type { TableProps } from "antd/lib/table";
-import { AffixProps } from "antd/lib/affix";
+import type { AffixProps } from "antd/lib/affix";
 export interface RowObj {
     keys?: React.Key[];
     rowData?: any[];
@@ -61,6 +61,7 @@ export interface HTableProps extends Omit<ProTableProps<any, any>, "request" | "
     allPageCheck?: boolean;
     rowSelection?: HRowSelection | false;
     affixProps?: AffixProps | false;
+    goTop?: boolean;
 }
 export interface TableInstance {
     reload: (params?: ParamsModal) => Promise<any>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hw-component/table",
-  "version": "0.0.5-beta-v6",
+  "version": "0.0.5-beta-v8",
   "description": "基于antd二次开发table组件",
   "keywords": [
     "table"
@@ -47,6 +47,7 @@
     "@babel/runtime-corejs3": "^7.21.5",
     "@rollup/plugin-babel": "^6.0.3",
     "@rollup/plugin-commonjs": "^25.0.0",
+    "@rollup/plugin-image": "^3.0.3",
     "@rollup/plugin-inject": "^5.0.3",
     "@rollup/plugin-node-resolve": "^15.0.2",
     "@rollup/plugin-url": "^8.0.1",

package/scripts/rollup.config.js

@@ -11,6 +11,8 @@ const postcss = require("rollup-plugin-postcss");
 const input = path.resolve(__dirname, "../src/components/index.tsx");
 const outDir = path.resolve(__dirname, "../lib");
 const esOutDir = path.resolve(__dirname, "../es");
+const image = require("@rollup/plugin-image");
+
 module.exports = {
   input,
   output: [
@@ -36,6 +38,7 @@ module.exports = {
     clear({
       targets: [outDir, esOutDir],
     }),
+    image(),
     url({
       fileName: "[dirname][hash][extname]",
     }),

package/scripts/webpack.config.js

@@ -52,6 +52,10 @@ module.exports = {
           },
         ],
       },
+      {
+        test: /\.(png|jpe?g|gif|webp)$/,
+        type: "asset",
+      },
     ],
   },
   resolve: {

package/src/components/GoTop/index.tsx

@@ -0,0 +1,37 @@
+import type { IPaginationProps } from "../HTablePagination/index";
+import { useClassName } from "../hooks";
+import { useEffect, useState } from "react";
+export default ({ affixProps }: IPaginationProps) => {
+  const className = useClassName("hw-top-btn");
+  const { target } = affixProps || {};
+  const [style, setStyle] = useState({ display: "none" });
+  const dom = target?.();
+  const cuDom = dom || document.body;
+  const goTopFn = () => {
+    cuDom.scrollTo({ top: 0 });
+  };
+  useEffect(() => {
+    const scroll = (e) => {
+      const top = e.target.scrollTop;
+      if (top > 10) {
+        setStyle({ display: "block" });
+        return;
+      }
+      setStyle({ display: "none" });
+    };
+    cuDom.addEventListener("scroll", scroll);
+    return () => {
+      cuDom.removeEventListener("scroll", scroll);
+    };
+  }, [dom]);
+  useEffect(() => {
+    const top = (cuDom as HTMLElement).scrollTop;
+    if (top > 10) {
+      setStyle({ display: "block" });
+      return;
+    }
+    setStyle({ display: "none" });
+  }, []);
+
+  return <div className={className} style={style} onClick={goTopFn} />;
+};

package/src/components/HTableBody/index.tsx

@@ -4,7 +4,7 @@ import type { ActionRenderFn, ConfigDataModal, ParamsModal } from "../modal";
 import { useCols, useSynchronousKeys } from "./hooks";
 import { useHTableContext } from "../context";
 import type { DetailedReactHTMLElement } from "react";
-import React, { useRef } from "react";
+import React from "react";
 import { ConfigProvider, Empty, Row, Alert } from "antd";
 import type { HTableInstance } from "../modal";
 import { useHTableConfigContext } from "../TableConfig";
@@ -12,7 +12,8 @@ import HTablePagination from "../HTablePagination";
 import { useClassName } from "../hooks";
 import AlertMsg from "./AlertMsg";
 import type { HRowSelection } from "../modal";
-import {AffixProps} from "antd/lib/affix";
+import type { AffixProps } from "antd/lib/affix";
+import GoTop from "../GoTop";
 interface HTableBodyProps
   extends Omit<ProTableProps<any, any>, "dataSource" | "rowSelection"> {
   configData?: ConfigDataModal;
@@ -25,8 +26,9 @@ interface HTableBodyProps
   tableStyle?: React.CSSProperties;
   paginationStyle?: React.CSSProperties;
   actionRender?: ActionRenderFn;
-  rowSelection?: HRowSelection|false;
+  rowSelection?: HRowSelection | false;
   affixProps?: AffixProps | false;
+  goTop?: boolean;
 }
 const defaultRender = () => {
   return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
@@ -34,7 +36,7 @@ const defaultRender = () => {
 const contentStyle = {
   paddingLeft: 24,
   paddingRight: 24,
-  marginBottom: 16,
+  paddingBottom: 16,
 };
 export default ({
   configData,
@@ -49,7 +51,8 @@ export default ({
   headerTitle,
   options,
   actionRender,
-                  affixProps,
+  affixProps,
+  goTop = true,
   ...props
 }: HTableBodyProps) => {
   // @ts-ignore
@@ -135,6 +138,7 @@ export default ({
             onPageChange={onPageChange}
             paginationStyle={paginationStyle}
             affixProps={affixProps}
+            goTop={goTop}
             {...pagination}
           />
         )}

package/src/components/HTableHeader/index.tsx

@@ -38,7 +38,11 @@ export default ({
   const className = useClassName("hw-table-header");
   return (
     <Card
-      style={{ ...headerStyle }}
+      style={{
+        borderBottomLeftRadius: 0,
+        borderBottomRightRadius: 0,
+        ...headerStyle,
+      }}
       bordered={false}
       className={`hw_table_header ${className}`}
       bodyStyle={{ paddingBottom: 0 }}

package/src/components/HTablePagination/index.tsx

@@ -1,19 +1,22 @@
 import type { PaginationProps } from "antd";
-import { Affix, Button, Pagination, Row, Space, Typography } from "antd";
+import { Affix, Pagination, Row } from "antd";
 import { useHTableContext } from "../context";
 import type { ParamsModal } from "@/components/modal";
 import { useClassName } from "../hooks";
 import React, { useState } from "react";
 import type { AffixProps } from "antd/lib/affix";
-interface IPaginationProps extends PaginationProps {
+import GoTop from "../GoTop";
+export interface IPaginationProps extends PaginationProps {
   onPageChange?: (params: ParamsModal) => void;
   paginationStyle?: React.CSSProperties;
   affixProps?: AffixProps | false;
+  goTop?: boolean;
 }
 export default ({
   onPageChange,
   paginationStyle,
   affixProps,
+  goTop,
   ...props
 }: IPaginationProps) => {
   const { onPageChange: contextOnPageChange, data } = useHTableContext();
@@ -81,6 +84,7 @@ export default ({
           }}
           {...props}
         />
+        {goTop && <GoTop affixProps={affixProps} />}
       </Row>
     </Affix>
   );

package/src/components/Table.tsx

@@ -1,7 +1,6 @@
 import Header from "./HTableHeader";
 import Body from "./HTableBody";
 import useCurrentTable from "./hooks/useCurrentTable";
-import Footer from "./HTableFooter";
 import useRowObj from "./hooks/useRowObj";
 import { HTableContext } from "./context";
 import { Space } from "antd";

package/src/components/index.less

@@ -3,7 +3,7 @@
   border-bottom-left-radius: 4px;
   border-bottom-right-radius: 4px;
   background-color: #fff;
-  overflow: hidden;
+  position: relative;
   .@{ant-prefix}-hw-table-pagination{
     padding: 12px 24px;
     background-color:#ffffff;
@@ -20,8 +20,20 @@
    padding: 24px;
    border-radius: 4px;
    background-color: #ffffff;
+   position: relative;
 }
 
+.@{ant-prefix}-hw-top-btn{
+   position: absolute;
+   right: 10px;
+   bottom: 54px;
+   z-index: 9;
+   cursor: pointer;
+   width: 48px;
+   height: 48px;
+   background: url("./GoTop/goTop.png") no-repeat;
+   background-size: 100%;
+}
 .@{ant-prefix}-hw-table-header{
   border-top-left-radius: 4px;
   border-top-right-radius: 4px;

package/src/components/modal.ts

@@ -8,7 +8,7 @@ import type { ColProps } from "antd";
 import type React from "react";
 import type { ModalProps } from "antd";
 import type { TableProps } from "antd/lib/table";
-import {AffixProps} from "antd/lib/affix";
+import type { AffixProps } from "antd/lib/affix";
 
 export interface RowObj {
   keys?: React.Key[];
@@ -92,6 +92,7 @@ export interface HTableProps
   allPageCheck?: boolean;
   rowSelection?: HRowSelection | false;
   affixProps?: AffixProps | false;
+  goTop?: boolean;
 }
 export interface TableInstance {
   reload: (params?: ParamsModal) => Promise<any>;

package/src/pages/Table/index.tsx

@@ -37,6 +37,9 @@ export default () => {
           rowKey={"id"}
           table={hTable}
           rowSelection={{}}
+          affixProps={{
+            target: () => document.querySelector(".body"),
+          }}
           options={{
             reload: false,
             setting: false,

package/src/pages/TableCustomize/index.tsx

@@ -31,7 +31,13 @@ export default () => {
   const { run, loading, error, data } = useRequest(
     (params) => {
       const { current = 1 } = params;
-      console.log(params, "params");
+      const arrayData = [];
+      for (let i = 0; i < 100; i = i + 1) {
+        arrayData.push({
+          id: i,
+          name: "11",
+        });
+      }
       return new Promise((resolve, reject) => {
         setTimeout(() => {
           // reject(new Error("错误"));
@@ -39,12 +45,7 @@ export default () => {
             size: "10",
             current: current.toString(10),
             total: "100",
-            records: [
-              {
-                id: 1,
-                name: "111",
-              },
-            ],
+            records:arrayData
           });
         }, 2000);
       });
@@ -62,9 +63,10 @@ export default () => {
       <Space direction={"vertical"} style={{ width: "100%" }}>
         <HTableHeader />
         <HTableBody
-          pagination={false}
-          scroll={{ x: 1000, y: 100 }}
           headerTitle={<AddBtn />}
+          affixProps={{
+            target: () => document.querySelector(".body"),
+          }}
           rowSelection={{
             onChange: () => {
               console.log("rowSelection");

package/src/typings.d.ts

@@ -0,0 +1,46 @@
+declare module "slash2";
+declare module "*.css";
+declare module "*.less";
+declare module "*.scss";
+declare module "*.sass";
+declare module "*.svg";
+declare module "*.png";
+declare module "*.jpg";
+declare module "*.jpeg";
+declare module "*.gif";
+declare module "*.bmp";
+declare module "*.tiff";
+declare module "omit.js";
+declare module "numeral";
+declare module "@antv/data-set";
+declare module "mockjs";
+declare module "react-fittext";
+declare module "bizcharts-plugin-slider";
+
+// google analytics interface
+type GAFieldsObject = {
+  eventCategory: string;
+  eventAction: string;
+  eventLabel?: string;
+  eventValue?: number;
+  nonInteraction?: boolean;
+};
+
+interface Window {
+  ga: (
+    command: "send",
+    hitType: "event" | "pageview",
+    fieldsObject: GAFieldsObject | string
+  ) => void;
+  reloadAuthorized: () => void;
+}
+
+declare let ga: () => void;
+
+// preview.pro.ant.design only do not use in your production ;
+// preview.pro.ant.design 专用环境变量，请不要在你的项目中使用它。
+declare let ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION:
+  | "site"
+  | undefined;
+
+declare const REACT_APP_ENV: "test" | "dev" | "pre" | false;

package/tsconfig.json

@@ -24,6 +24,6 @@
       "@/*": ["./src/*"]
     }
   },
-  "include": ["src/**/*"],
+  "include": ["src/**/*", "typings/**/*"],
   "exclude": ["node_modules", "**/*.spec.ts", "**/*.css", "**/*.less"]
 }