|
@@ -0,0 +1,34 @@
|
|
|
+import 'antd/lib/table/style';
|
|
|
+import 'antd/lib/typography/style';
|
|
|
+import type { ParamsType } from '@ant-design/pro-provider';
|
|
|
+import Summary from 'rc-table/lib/Footer/Summary';
|
|
|
+import React, { useMemo, useState } from 'react';
|
|
|
+import { ProTable, ProTableProps } from '@ant-design/pro-components';
|
|
|
+
|
|
|
+/**
|
|
|
+ *
|
|
|
+ *ProTable组件外封装了一层传参和ProTable一样,只是可以自己附加一些操作,全局管理一些参数比如table的尺寸
|
|
|
+ * @param props - Table properties
|
|
|
+ */
|
|
|
+const MyProTable = <DataType extends Record<string, any>, Params extends ParamsType = ParamsType, ValueType = "text">(
|
|
|
+ props: ProTableProps<DataType, Params, ValueType>
|
|
|
+): JSX.Element => {
|
|
|
+ const [size,setSize]=useState<"small" | "large" | "middle">(localStorage.getItem("tableSize") as ("small" | "large" | "middle") || "small")
|
|
|
+ // 尺寸改变设置到本地,全局变动
|
|
|
+ function sizeChangge(size: any) {
|
|
|
+ localStorage.setItem("tableSize", size)
|
|
|
+ setSize(size)
|
|
|
+ }
|
|
|
+ // 组件主体逻辑可以在此编写
|
|
|
+ console.log(size)
|
|
|
+ return <ProTable
|
|
|
+ size={size}//全局默认尺寸假如外面传入会覆盖
|
|
|
+ {...props}
|
|
|
+ onSizeChange={sizeChangge}
|
|
|
+ />
|
|
|
+};
|
|
|
+
|
|
|
+// 将 Summary 属性添加到 CustomTableContainer 上
|
|
|
+MyProTable.Summary = Summary;
|
|
|
+
|
|
|
+export default MyProTable;
|