From 6034ffecf2fc4d1d2ee965f1034d9dcd62d225ab Mon Sep 17 00:00:00 2001 From: xingyu Date: Mon, 18 Sep 2023 18:09:42 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20basicTable=20=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E7=9A=84=E7=B1=BB=E5=9E=8B=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Table/src/hooks/useColumns.ts | 2 +- .../Table/src/hooks/useDataSource.ts | 2 +- .../Table/src/hooks/useRowSelection.ts | 21 ++++++++++++------- .../Table/src/hooks/useTableExpand.ts | 4 ++-- src/components/Table/src/types/table.ts | 10 ++++----- 5 files changed, 22 insertions(+), 17 deletions(-) diff --git a/src/components/Table/src/hooks/useColumns.ts b/src/components/Table/src/hooks/useColumns.ts index baa58c0..1bb8e52 100644 --- a/src/components/Table/src/hooks/useColumns.ts +++ b/src/components/Table/src/hooks/useColumns.ts @@ -15,7 +15,7 @@ function handleItem(item: BasicColumn, ellipsis: boolean) { item.align = item.align || DEFAULT_ALIGN if (ellipsis) { if (!key) - item.key = dataIndex as any + item.key = typeof dataIndex == 'object' ? dataIndex.join('-') : dataIndex if (!isBoolean(item.ellipsis)) { Object.assign(item, { diff --git a/src/components/Table/src/hooks/useDataSource.ts b/src/components/Table/src/hooks/useDataSource.ts index 41f43cd..e84cfd7 100644 --- a/src/components/Table/src/hooks/useDataSource.ts +++ b/src/components/Table/src/hooks/useDataSource.ts @@ -185,7 +185,7 @@ export function useDataSource( }) } - function insertTableDataRecord(record: Recordable | Recordable[], index: number): Recordable[] | undefined { + function insertTableDataRecord(record: Recordable | Recordable[], index?: number): Recordable[] | undefined { // if (!dataSourceRef.value || dataSourceRef.value.length == 0) return; index = index ?? dataSourceRef.value?.length const _record = isObject(record) ? [record as Recordable] : (record as Recordable[]) diff --git a/src/components/Table/src/hooks/useRowSelection.ts b/src/components/Table/src/hooks/useRowSelection.ts index 182af89..b5d7ec3 100644 --- a/src/components/Table/src/hooks/useRowSelection.ts +++ b/src/components/Table/src/hooks/useRowSelection.ts @@ -1,13 +1,18 @@ import type { ComputedRef, Ref } from 'vue' import { computed, nextTick, ref, toRaw, unref, watch } from 'vue' import { omit } from 'lodash-es' +import type { Key } from 'ant-design-vue/lib/table/interface' import type { BasicTableProps, TableRowSelection } from '../types/table' import { ROW_KEY } from '../const' -import { isFunction } from '@/utils/is' import { findNodeAll } from '@/utils/helper/treeHelper' +import { isFunction } from '@/utils/is' -export function useRowSelection(propsRef: ComputedRef, tableData: Ref, emit: EmitType) { - const selectedRowKeysRef = ref([]) +export function useRowSelection( + propsRef: ComputedRef, + tableData: Ref, + emit: EmitType, +) { + const selectedRowKeysRef = ref([]) const selectedRowRef = ref([]) const getRowSelectionRef = computed((): TableRowSelection | null => { @@ -17,7 +22,7 @@ export function useRowSelection(propsRef: ComputedRef, tableDat return { selectedRowKeys: unref(selectedRowKeysRef), - onChange: (selectedRowKeys: string[]) => { + onChange: (selectedRowKeys: Key[]) => { setSelectedRowKeys(selectedRowKeys) }, ...omit(rowSelection, ['onChange']), @@ -26,7 +31,7 @@ export function useRowSelection(propsRef: ComputedRef, tableDat watch( () => unref(propsRef).rowSelection?.selectedRowKeys, - (v: string[]) => { + (v?: Key[]) => { setSelectedRowKeys(v) }, ) @@ -59,8 +64,8 @@ export function useRowSelection(propsRef: ComputedRef, tableDat return unref(getAutoCreateKey) ? ROW_KEY : rowKey }) - function setSelectedRowKeys(rowKeys: string[]) { - selectedRowKeysRef.value = rowKeys + function setSelectedRowKeys(rowKeys?: Key[]) { + selectedRowKeysRef.value = rowKeys || [] const allSelectedRows = findNodeAll( toRaw(unref(tableData)).concat(toRaw(unref(selectedRowRef))), item => rowKeys?.includes(item[unref(getRowKey) as string]), @@ -69,7 +74,7 @@ export function useRowSelection(propsRef: ComputedRef, tableDat }, ) const trueSelectedRows: any[] = [] - rowKeys?.forEach((key: string) => { + rowKeys?.forEach((key: Key) => { const found = allSelectedRows.find(item => item[unref(getRowKey) as string] === key) found && trueSelectedRows.push(found) }) diff --git a/src/components/Table/src/hooks/useTableExpand.ts b/src/components/Table/src/hooks/useTableExpand.ts index 164948d..2e082ff 100644 --- a/src/components/Table/src/hooks/useTableExpand.ts +++ b/src/components/Table/src/hooks/useTableExpand.ts @@ -4,7 +4,7 @@ import type { BasicTableProps } from '../types/table' import { ROW_KEY } from '../const' export function useTableExpand(propsRef: ComputedRef, tableData: Ref, emit: EmitType) { - const expandedRowKeys = ref([]) + const expandedRowKeys = ref<(string | number)[]>([]) const getAutoCreateKey = computed(() => { return unref(propsRef).autoCreateKey && !unref(propsRef).rowKey @@ -34,7 +34,7 @@ export function useTableExpand(propsRef: ComputedRef, tableData expandedRowKeys.value = keys } - function expandRows(keys: string[]) { + function expandRows(keys: (string | number)[]) { // use row ID expands the specified table row const { isTreeTable } = unref(propsRef) if (!isTreeTable) diff --git a/src/components/Table/src/types/table.ts b/src/components/Table/src/types/table.ts index deb3a0e..d778787 100644 --- a/src/components/Table/src/types/table.ts +++ b/src/components/Table/src/types/table.ts @@ -1,5 +1,5 @@ import type { Ref, VNodeChild } from 'vue' -import type { TableRowSelection as ITableRowSelection } from 'ant-design-vue/lib/table/interface' +import type { TableRowSelection as ITableRowSelection, Key } from 'ant-design-vue/lib/table/interface' import type { ColumnProps } from 'ant-design-vue/lib/table' import type { PaginationProps } from './pagination' @@ -19,7 +19,7 @@ export interface TableRowSelection extends ITableRowSelection { * Callback executed when selected rows change * @type Function */ - onChange?: (selectedRowKeys: string[] | number[], selectedRows: T[]) => any + onChange?: (selectedRowKeys: Key[], selectedRows: T[]) => any /** * Callback executed when select/deselect one row @@ -37,7 +37,7 @@ export interface TableRowSelection extends ITableRowSelection { * Callback executed when row selection is inverted * @type Function */ - onSelectInvert?: (selectedRows: string[] | number[]) => any + onSelectInvert?: (selectedRows: Key[]) => any } export interface TableCustomRecord { @@ -83,7 +83,7 @@ export interface TableActionType { getSelectRows: () => T[] clearSelectedRowKeys: () => void expandAll: () => void - expandRows: (keys: string[] | number[]) => void + expandRows: (keys: (string | number)[]) => void collapseAll: () => void scrollTo: (pos: string) => void // pos: id | "top" | "bottom" getSelectRowKeys: () => string[] @@ -101,7 +101,7 @@ export interface TableActionType { setLoading: (loading: boolean) => void setProps: (props: Partial) => void redoHeight: () => void - setSelectedRowKeys: (rowKeys: string[] | number[]) => void + setSelectedRowKeys: (rowKeys: Key[]) => void getPaginationRef: () => PaginationProps | boolean getSize: () => SizeType getRowSelection: () => TableRowSelection