feat(core): Table copy

vaynevayne · Oct 20, 2023 · 03b657c · 03b657c
1 parent 9130f3b
commit 03b657c
Show file tree

Hide file tree

Showing 14 changed files with 1,167 additions and 618 deletions.
diff --git a/apps/docs/package.json b/apps/docs/package.json
@@ -10,13 +10,13 @@
     "deploy": "pnpm build && touch ./storybook-static/.nojekyll && gh-pages -d ./storybook-static -t true"
   },
   "dependencies": {
-    "@soul/core": "workspace:0.0.21",
+    "@soul/core": "workspace:0.0.22",
     "mockjs": "^1.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@soul/tsconfig": "workspace:0.0.20",
+    "@soul/tsconfig": "workspace:0.0.21",
     "@storybook/addon-essentials": "^7.0.12",
     "@storybook/addon-interactions": "^7.0.12",
     "@storybook/addon-links": "^7.0.12",
@@ -26,7 +26,7 @@
     "@storybook/testing-library": "^0.0.14-next.2",
     "@types/react": "^18.2.7",
     "@vitejs/plugin-react": "^1.3.2",
-    "eslint-config-soul": "workspace:0.0.20",
+    "eslint-config-soul": "workspace:0.0.21",
     "eslint-plugin-storybook": "^0.6.12",
     "prop-types": "^15.8.1",
     "serve": "^13.0.4",

diff --git a/packages/eslint-config-soul/CHANGELOG.md b/packages/eslint-config-soul/CHANGELOG.md
@@ -1,5 +1,11 @@
 # eslint-config-soul
 
+## 0.0.21
+
+### Patch Changes
+
+- sada
+
 ## 0.0.20
 
 ### Patch Changes

diff --git a/packages/eslint-config-soul/package.json b/packages/eslint-config-soul/package.json
@@ -1,6 +1,6 @@
 {
   "name": "eslint-config-soul",
-  "version": "0.0.20",
+  "version": "0.0.21",
   "main": "index.js",
   "license": "MIT",
   "dependencies": {

diff --git a/packages/soul-core/CHANGELOG.md b/packages/soul-core/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @soul/core
 
+## 0.0.22
+
+### Patch Changes
+
+- sada
+- Updated dependencies
+  - @soul/utils@0.0.22
+
 ## 0.0.21
 
 ### Patch Changes

diff --git a/packages/soul-core/package.json b/packages/soul-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@soul/core",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
@@ -25,7 +25,7 @@
     "@soul/tsconfig": "workspace:*",
     "@types/react": "^18.2.7",
     "@types/react-dom": "^18.2.4",
-    "antd": "^5.5.1",
+    "antd": "^5.10.1",
     "array-move": "^4.0.0",
     "eslint": "^8.15.0",
     "eslint-config-soul": "workspace:*",
@@ -59,6 +59,7 @@
     "@dnd-kit/modifiers": "^6.0.1",
     "@dnd-kit/sortable": "^7.0.2",
     "@soul/utils": "workspace:^",
+    "clipboard": "^2.0.11",
     "react-collapse": "^5.1.1",
     "react-sortablejs": "^6.1.4"
   },

diff --git a/packages/soul-core/src/Table/Table.tsx b/packages/soul-core/src/Table/Table.tsx
@@ -1,4 +1,5 @@
 import {
+  CopyOutlined,
   DownOutlined,
   DownloadOutlined,
   RightOutlined,
@@ -13,7 +14,6 @@ import {
   Space,
   Table,
   TableColumnType,
-  TableColumnsType,
   Tooltip,
 } from "antd"
 import {arrayMoveImmutable} from "array-move"
@@ -22,6 +22,7 @@ import {
   forwardRef,
   memo,
   useCallback,
+  useId,
   useImperativeHandle,
   useMemo,
   useState,
@@ -37,28 +38,31 @@ import SettingModal from "./SettingModal"
 import {ColumnsStateContext} from "./context"
 import {ColumnState, ColumnWithState, ColumnsState, Meta} from "./type"
 import {findColKey, getSorter, getState, getVisible} from "./util"
+import ClipboardJS from "clipboard"
 
 interface Handle {
-  getTableColumns(): TableColumnsType
+  getTableColumns(): TableColumnType<object>[]
 }
 
 export type TableProps = {
   /**
    * @description 可以在 column 中传入相关 columnState, 将作为默认值使用
    */
-  columns: any[]
+  columns: TableColumnType<any>[]
 
   defaultColumnsState?: ColumnsState
 
   columnsState?: ColumnsState
 
   onColumnsStateChange?: (columnsState: ColumnsState) => void
-  rewriteColumns?: (columns: TableColumnsType<any>) => TableColumnsType<any>
+  rewriteColumns?: (columns: TableColumnType<any>[]) => TableColumnType<any>[]
   meta?: Meta
 } & AntTableProps<any>
 
 const MENU_ID = "menu-id"
 
+new ClipboardJS(".js-copy-btn")
+
 const SoulTable: React.ForwardRefRenderFunction<Handle, TableProps> = (
   {
     columns: propColumns,
@@ -74,6 +78,9 @@ const SoulTable: React.ForwardRefRenderFunction<Handle, TableProps> = (
   },
   ref
 ) => {
+  const uuid = useId()
+  const tableId = uuid.replace(/:/g, "")
+
   // 函数参数默认值对 null 无效,所以在这里写引用类型默认值
   const columns = useMemo(() => propColumns || [], [propColumns])
   const meta = useMemo(
@@ -235,7 +242,10 @@ const SoulTable: React.ForwardRefRenderFunction<Handle, TableProps> = (
           <Col flex={1}>{title?.(dataSource)}</Col>
           <Col flex="none">
             {meta.toolbar === false ? null : (
-              <Space style={{marginBottom: 8, marginLeft: "auto"}}>
+              <Space
+                style={{marginBottom: 8, marginLeft: "auto"}}
+                size={"small"}
+              >
                 {meta.toolbar}
                 {meta.disableSetting ? null : (
                   <Tooltip title="列配置">
@@ -258,7 +268,15 @@ const SoulTable: React.ForwardRefRenderFunction<Handle, TableProps> = (
                     ></Button>
                   </Tooltip>
                 )}
-
+                <Tooltip title="复制">
+                  <Button
+                    type="text"
+                    className="js-copy-btn"
+                    data-clipboard-target={`#${tableId}`}
+                    size="small"
+                    icon={<CopyOutlined />}
+                  />
+                </Tooltip>
                 {meta.disableCollapse ? null : (
                   <Tooltip title={isOpenedCollapse ? "收起" : "展开"}>
                     <Button
@@ -280,6 +298,7 @@ const SoulTable: React.ForwardRefRenderFunction<Handle, TableProps> = (
           <ReactDragListView.DragColumn {...dragProps}>
             <ReactDragListView {...dragRowProps}>
               <Table
+                id={tableId}
                 columns={rewriteColumns?.(tableColumns) || tableColumns}
                 {...(meta.contextMenus && meta.contextMenus.length > 0
                   ? {

diff --git a/packages/soul-core/src/Table/util.ts b/packages/soul-core/src/Table/util.ts
@@ -1,6 +1,6 @@
-import {TableColumnType} from "antd"
 import {ColumnsState, ColumnWithState} from "./type"
 
+import {TableColumnType} from "antd"
 /**
  * @desc (key || dataIndex).toString()
  * @param column

diff --git a/packages/soul-tsconfig/CHANGELOG.md b/packages/soul-tsconfig/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @soul/tsconfig
 
+## 0.0.21
+
+### Patch Changes
+
+- sada
+
 ## 0.0.20
 
 ### Patch Changes

diff --git a/packages/soul-tsconfig/base.json b/packages/soul-tsconfig/base.json
@@ -13,6 +13,7 @@
     "noUnusedLocals": false,
     "noUnusedParameters": false,
     "preserveWatchOutput": true,
+    "allowSyntheticDefaultImports": true,
     "skipLibCheck": true,
     "strict": true
   },

diff --git a/packages/soul-tsconfig/package.json b/packages/soul-tsconfig/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@soul/tsconfig",
-  "version": "0.0.20",
+  "version": "0.0.21",
   "private": true,
   "license": "MIT",
   "publishConfig": {

diff --git a/packages/soul-tsconfig/react-library.json b/packages/soul-tsconfig/react-library.json
@@ -15,7 +15,8 @@
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true
+    "noFallthroughCasesInSwitch": true,
+    "allowSyntheticDefaultImports": true
   },
   "include": ["src"],
   "references": [{"path": "./node16.json"}]

diff --git a/packages/soul-utils/CHANGELOG.md b/packages/soul-utils/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @soul/utils
 
+## 0.0.22
+
+### Patch Changes
+
+- sada
+
 ## 0.0.21
 
 ### Patch Changes

diff --git a/packages/soul-utils/package.json b/packages/soul-utils/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@soul/utils",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",