diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1e1675177..7dee593da 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -103,7 +103,7 @@ dependencies: devDependencies: '@amap/amap-jsapi-types': 0.0.10 - '@iconify/json': 2.2.31 + '@iconify/json': 2.2.32 '@iconify/vue': 4.1.0_vue@3.2.47 '@soybeanjs/cli': 0.1.6 '@soybeanjs/vite-plugin-vue-page-route': 0.0.5 @@ -2060,8 +2060,8 @@ packages: engines: {node: '>=6.9.0'} dev: true - /@iconify/json/2.2.31: - resolution: {integrity: sha512-DztAaMCNFM+b46IDnqlCU3LvjD6hFQyHKsd7+KusdHwbCDq0EeLMtyyydOivModCaGc0zQwLqfLCGbxDBdj0wA==} + /@iconify/json/2.2.32: + resolution: {integrity: sha512-303XU9iOVQxihO0a11S9x/cQgrlgQk3j4TwT5lCfx4kxomHL00mswTPrnUGZXM5VOTbLOM+7LdpdCnay7NAJnw==} dependencies: '@iconify/types': 2.0.0 pathe: 1.1.0 @@ -2071,8 +2071,8 @@ packages: resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==} dev: true - /@iconify/utils/2.1.4: - resolution: {integrity: sha512-7vzsYIvxv5Hng0MNEtSSnyMBD/+zqnORqmKiYsSgpMBGSz1r93URgBZHPYCZ1/gpoaVstYW4/SVLGCMJBNMCLQ==} + /@iconify/utils/2.1.5: + resolution: {integrity: sha512-6MvDI+I6QMvXn5rK9KQGdpEE4mmLTcuQdLZEiX5N+uZB+vc4Yw9K1OtnOgkl8mp4d9X0UrILREyZgF1NUwUt+Q==} dependencies: '@antfu/install-pkg': 0.1.1 '@antfu/utils': 0.7.2 @@ -2408,7 +2408,7 @@ packages: rollup: 2.79.1 dev: true - /@rollup/plugin-replace/5.0.2_rollup@3.18.0: + /@rollup/plugin-replace/5.0.2_rollup@3.19.0: resolution: {integrity: sha512-M9YXNekv/C/iHHK+cvORzfRYfPbq0RDD8r0G+bMiTXjNGKulPnCT9O3Ss46WfhI6ZOCgApOP7xAdmCQJ+U2LAA==} engines: {node: '>=14.0.0'} peerDependencies: @@ -2417,9 +2417,9 @@ packages: rollup: optional: true dependencies: - '@rollup/pluginutils': 5.0.2_rollup@3.18.0 + '@rollup/pluginutils': 5.0.2_rollup@3.19.0 magic-string: 0.27.0 - rollup: 3.18.0 + rollup: 3.19.0 dev: true /@rollup/pluginutils/3.1.0_rollup@2.79.1: @@ -2457,7 +2457,7 @@ packages: rollup: 2.79.1 dev: true - /@rollup/pluginutils/5.0.2_rollup@3.18.0: + /@rollup/pluginutils/5.0.2_rollup@3.19.0: resolution: {integrity: sha512-pTd9rIsP92h+B6wWwFbW8RkZv4hiR/xKsqre4SIuAOaOEQRxi0lqLke9k2/7WegC85GgUs9pjmOjCUi3In4vwA==} engines: {node: '>=14.0.0'} peerDependencies: @@ -2469,7 +2469,7 @@ packages: '@types/estree': 1.0.0 estree-walker: 2.0.2 picomatch: 2.3.1 - rollup: 3.18.0 + rollup: 3.19.0 dev: true /@sindresorhus/is/5.3.0: @@ -2485,7 +2485,7 @@ packages: execa: 5.1.1 kolorist: 1.7.0 minimist: 1.2.8 - npm-check-updates: 16.7.10 + npm-check-updates: 16.7.12 prompts: 2.4.2 rimraf: 3.0.2 zx: 7.2.0 @@ -2761,8 +2761,8 @@ packages: resolution: {integrity: sha512-gC3TazRzGoOnoKAhUx+Q0t8S9Tzs74z7m0ipwGpSqQrleP14hKxP4/JUeEQcD3W1/aIpnWl8pHowI7WokuZpXg==} dev: true - /@types/node/18.14.6: - resolution: {integrity: sha512-93+VvleD3mXwlLI/xASjw0FzKcwzl3OdTCzm1LaRfqgS21gfFtK3zDXM5Op9TeeMsJVOaJ2VRDpT9q4Y3d0AvA==} + /@types/node/18.15.0: + resolution: {integrity: sha512-z6nr0TTEOBGkzLGmbypWOGnpSpSIBorEhC4L+4HeQ2iezKCi4f77kyslRwvHeNitymGQ+oFyIWGP96l/DPSV9w==} dev: true /@types/normalize-package-data/2.4.1: @@ -3850,8 +3850,8 @@ packages: engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} hasBin: true dependencies: - caniuse-lite: 1.0.30001460 - electron-to-chromium: 1.4.321 + caniuse-lite: 1.0.30001464 + electron-to-chromium: 1.4.327 node-releases: 2.0.10 update-browserslist-db: 1.0.10_browserslist@4.21.5 dev: true @@ -4008,8 +4008,8 @@ packages: engines: {node: '>=14.16'} dev: true - /caniuse-lite/1.0.30001460: - resolution: {integrity: sha512-Bud7abqjvEjipUkpLs4D7gR0l8hBYBHoa+tGtKJHvT2AYzLp1z7EmVkUT4ERpVUfca8S2HGIVs883D8pUH1ZzQ==} + /caniuse-lite/1.0.30001464: + resolution: {integrity: sha512-oww27MtUmusatpRpCGSOneQk2/l5czXANDSFvsc7VuOQ86s3ANhZetpwXNf1zY/zdfP63Xvjz325DAdAoES13g==} dev: true /ccount/1.1.0: @@ -5168,8 +5168,8 @@ packages: jake: 10.8.5 dev: true - /electron-to-chromium/1.4.321: - resolution: {integrity: sha512-ERuAqNq7YknVY3+47VbB+Q92kWH7O7sX3mkZINqZtsGJMQFb0dj71d5U3PRTihX03qt2NWIfZic2CCcGXOHJ7A==} + /electron-to-chromium/1.4.327: + resolution: {integrity: sha512-DIk2H4g/3ZhjgiABJjVdQvUdMlSABOsjeCm6gmUzIdKxAuFrGiJ8QXMm3i09grZdDBMC/d8MELMrdwYRC0+YHg==} dev: true /emoji-regex/7.0.3: @@ -5605,7 +5605,7 @@ packages: dependencies: eslint: 8.35.0 eslint-utils: 3.0.0_eslint@8.35.0 - jsonc-eslint-parser: 2.1.0 + jsonc-eslint-parser: 2.2.0 natural-compare: 1.4.0 dev: true @@ -6812,7 +6812,7 @@ packages: he: 1.2.0 param-case: 3.0.4 relateurl: 0.2.7 - terser: 5.16.5 + terser: 5.16.6 dev: true /html-tags/3.2.0: @@ -7526,8 +7526,8 @@ packages: hasBin: true dev: true - /jsonc-eslint-parser/2.1.0: - resolution: {integrity: sha512-qCRJWlbP2v6HbmKW7R3lFbeiVWHo+oMJ0j+MizwvauqnCV/EvtAeEeuCgoc/ErtsuoKgYB8U4Ih8AxJbXoE6/g==} + /jsonc-eslint-parser/2.2.0: + resolution: {integrity: sha512-x5QjzBOORd+T2EjErIxJnkOEbLVEdD1ILEeBbIJt8Eq/zUn7P7M8qdnWiNVBK5f8oxnJpc6SBHOeeIEl/swPjg==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dependencies: acorn: 8.8.2 @@ -8446,8 +8446,8 @@ packages: npm-normalize-package-bin: 3.0.0 dev: true - /npm-check-updates/16.7.10: - resolution: {integrity: sha512-sLDgYD8ebkH9Jd6mPIq7UDGLr3DAxkHl6ZuJrEF4rauLv6DqHBxtnF16MHUPN+/eBt5QbH4GL/+nxfSAFm3TfQ==} + /npm-check-updates/16.7.12: + resolution: {integrity: sha512-ejYl/BiWhkUxDs1ISQd/6blgTIfHabSdsfR5JWoA7PK+cGn8hCqVKO5p+nNI2PqX+0F21ExGqkt8b7cg2yxuYg==} engines: {node: '>=14.14'} hasBin: true dependencies: @@ -8472,7 +8472,7 @@ packages: prompts-ncu: 2.5.1 rc-config-loader: 4.1.2 remote-git-tags: 3.0.0 - rimraf: 4.3.1 + rimraf: 4.4.0 semver: 7.3.8 semver-utils: 1.1.4 source-map-support: 0.5.21 @@ -10038,8 +10038,8 @@ packages: glob: 7.2.3 dev: true - /rimraf/4.3.1: - resolution: {integrity: sha512-GfHJHBzFQra23IxDzIdBqhOWfbtdgS1/dCHrDy+yvhpoJY5TdwdT28oWaHWfRpKFDLd3GZnGTx6Mlt4+anbsxQ==} + /rimraf/4.4.0: + resolution: {integrity: sha512-X36S+qpCUR0HjXlkDe4NAOhS//aHH0Z+h8Ckf2auGJk3PTnx5rLmrHkwNdbVQuCSUhOyFrlRvFEllZOYE+yZGQ==} engines: {node: '>=14'} hasBin: true dependencies: @@ -10056,7 +10056,7 @@ packages: jest-worker: 26.6.2 rollup: 2.79.1 serialize-javascript: 4.0.0 - terser: 5.16.5 + terser: 5.16.6 dev: true /rollup-plugin-visualizer/5.9.0_rollup@2.79.1: @@ -10084,8 +10084,8 @@ packages: fsevents: 2.3.2 dev: true - /rollup/3.18.0: - resolution: {integrity: sha512-J8C6VfEBjkvYPESMQYxKHxNOh4A5a3FlP+0BETGo34HEcE4eTlgCrO2+eWzlu2a/sHs2QUkZco+wscH7jhhgWg==} + /rollup/3.19.0: + resolution: {integrity: sha512-xZzJZlH9Ca6cosfdNGPwl2z7Pby8dTi9TrYLPeg6/j7aUoDOhBd706tCUFvbiBj45h/cS7z/a4gS8xd5Yg0jBw==} engines: {node: '>=14.18.0', npm: '>=8.0.0'} hasBin: true optionalDependencies: @@ -10461,8 +10461,8 @@ packages: cross-spawn: 7.0.3 dev: true - /spdx-correct/3.1.1: - resolution: {integrity: sha512-cOYcUWwhCuHCXi49RhFRCyJEK3iPj1Ziz9DpViV3tbZOwXD49QzIN3MpOLJNxh2qwq2lJJZaKMVw9qNi4jTC0w==} + /spdx-correct/3.2.0: + resolution: {integrity: sha512-kN9dJbvnySHULIluDHy32WHRUu3Og7B9sbY7tsFLctQkIqnMh3hErYgdMjTYuqmcXX+lK5T1lnUt3G7zNswmZA==} dependencies: spdx-expression-parse: 3.0.1 spdx-license-ids: 3.0.12 @@ -10878,8 +10878,8 @@ packages: unique-string: 2.0.0 dev: true - /terser/5.16.5: - resolution: {integrity: sha512-qcwfg4+RZa3YvlFh0qjifnzBHjKGNbtDo9yivMqMFDy9Q6FSaQWSB/j1xKhsoUFJIqDOM3TsN6D5xbrMrFcHbg==} + /terser/5.16.6: + resolution: {integrity: sha512-IBZ+ZQIA9sMaXmRZCUMDjNH0D5AQQfdn4WUjHL0+1lF4TP1IHRJbrhb6fNaXWikrYQTSkb7SLxkeXAiy1p7mbg==} engines: {node: '>=10'} hasBin: true dependencies: @@ -11414,7 +11414,7 @@ packages: dependencies: '@antfu/install-pkg': 0.1.1 '@antfu/utils': 0.7.2 - '@iconify/utils': 2.1.4 + '@iconify/utils': 2.1.5 debug: 4.3.4 kolorist: 1.7.0 local-pkg: 0.4.3 @@ -11596,7 +11596,7 @@ packages: /validate-npm-package-license/3.0.4: resolution: {integrity: sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==} dependencies: - spdx-correct: 3.1.1 + spdx-correct: 3.2.0 spdx-expression-parse: 3.0.1 dev: true @@ -11722,11 +11722,11 @@ packages: workbox-build: ^6.5.4 workbox-window: ^6.5.4 dependencies: - '@rollup/plugin-replace': 5.0.2_rollup@3.18.0 + '@rollup/plugin-replace': 5.0.2_rollup@3.19.0 debug: 4.3.4 fast-glob: 3.2.12 pretty-bytes: 6.1.0 - rollup: 3.18.0 + rollup: 3.19.0 vite: 4.1.4_tuq4uaq64ig7wgklr2h7aod5xq workbox-build: 6.5.4 workbox-window: 6.5.4 @@ -11781,7 +11781,7 @@ packages: esbuild: 0.16.17 postcss: 8.4.21 resolve: 1.22.1 - rollup: 3.18.0 + rollup: 3.19.0 sass: 1.58.3 optionalDependencies: fsevents: 2.3.2 @@ -12348,7 +12348,7 @@ packages: dependencies: '@types/fs-extra': 11.0.1 '@types/minimist': 1.2.2 - '@types/node': 18.14.6 + '@types/node': 18.15.0 '@types/ps-tree': 1.1.2 '@types/which': 2.0.2 chalk: 5.2.0 diff --git a/src/hooks/business/use-table.ts b/src/hooks/business/use-table.ts index ee5dde7e4..e0624aa4b 100644 --- a/src/hooks/business/use-table.ts +++ b/src/hooks/business/use-table.ts @@ -1 +1,89 @@ -export function useTable() {} +import { ref, reactive } from 'vue'; +import type { Ref } from 'vue'; +import type { DataTableBaseColumn, DataTableSelectionColumn, DataTableExpandColumn, PaginationProps } from 'naive-ui'; +import type { MaybeComputedRef } from '@vueuse/core'; +import type { TableColumnGroup, InternalRowData } from 'naive-ui/es/data-table/src/interface'; +import { useLoadingEmpty } from '../common'; + +/** + * 表格的列 + */ +type DataTableColumn = + | (Omit, 'key'> & { key: keyof T }) + | (Omit, 'key'> & { key: keyof T }) + | DataTableSelectionColumn + | DataTableExpandColumn; + +/** + * 表格分页参数 + */ +type TablePaginationParams = Pick; + +/** + * 表格接口的请求参数 + */ +type TableApiParams = Record & TablePaginationParams; + +/** + * 表格接口的请求数据 + */ +type TableApiData = { + data: T[]; + pageNum: number; + pageSize: number; + total: number; +}; + +/** + * 表格接口的请求函数 + */ +type TableApiFn

= ( + params: P +) => Promise>>; + +export function useNaiveTable( + apiFn: TableApiFn, + apiParams: P, + columns: MaybeComputedRef[]> +) { + const { loading, startLoading, endLoading, empty, setEmpty } = useLoadingEmpty(); + + const tableData: Ref = ref([]); + + async function getTableData(paginationParams?: TablePaginationParams) { + startLoading(); + + const params = { ...apiParams, ...paginationParams }; + + const { data } = await apiFn(params); + if (data) { + tableData.value = data.data; + + setEmpty(data.data.length === 0); + } + endLoading(); + } + + const pagination: PaginationProps = reactive({ + page: 1, + pageSize: 10, + showSizePicker: true, + pageSizes: [10, 15, 20, 25, 30], + onChange: (page: number) => { + pagination.page = page; + }, + onUpdatePageSize: (pageSize: number) => { + pagination.pageSize = pageSize; + pagination.page = 1; + } + }); + + return { + tableData, + columns, + loading, + empty, + pagination, + start: getTableData + }; +}