diff --git a/src/components/Table/src/hooks/useTable.ts b/src/components/Table/src/hooks/useTable.ts index 8c82617..0f66c82 100644 --- a/src/components/Table/src/hooks/useTable.ts +++ b/src/components/Table/src/hooks/useTable.ts @@ -9,25 +9,25 @@ import { getDynamicProps } from '@/utils' import { isProdMode } from '@/utils/env' import { error } from '@/utils/log' -type Props = Partial> +type Props = Partial>> type UseTableMethod = TableActionType & { getForm: () => FormActionType } -export function useTable(tableProps?: Props): [ - (instance: TableActionType, formInstance: UseTableMethod) => void, - TableActionType & { +export function useTable(tableProps?: Props): [ + (instance: TableActionType, formInstance: UseTableMethod) => void, + TableActionType & { getForm: () => FormActionType }, ] { - const tableRef = ref>(null) + const tableRef = ref>>(null) const loadedRef = ref>(false) const formRef = ref>(null) let stopWatch: WatchStopHandle - function register(instance: TableActionType, formInstance: UseTableMethod) { + function register(instance: TableActionType, formInstance: UseTableMethod) { isProdMode() && onUnmounted(() => { tableRef.value = null @@ -56,17 +56,17 @@ export function useTable(tableProps?: Props): [ ) } - function getTableInstance(): TableActionType { + function getTableInstance(): TableActionType { const table = unref(tableRef) if (!table) { error( 'The table instance has not been obtained yet, please make sure the table is presented when performing the table operation!', ) } - return table as TableActionType + return table as TableActionType } - const methods: TableActionType & { + const methods: TableActionType & { getForm: () => FormActionType } = { reload: async (opt?: FetchParams) => { @@ -124,16 +124,16 @@ export function useTable(tableProps?: Props): [ getSize: () => { return toRaw(getTableInstance().getSize()) }, - updateTableData: (index: number, key: string, value: any) => { + updateTableData: (index: number, key: K, value: T[K]) => { return getTableInstance().updateTableData(index, key, value) }, deleteTableDataRecord: (rowKey: string | number | string[] | number[]) => { return getTableInstance().deleteTableDataRecord(rowKey) }, - insertTableDataRecord: (record: Recordable | Recordable[], index?: number) => { + insertTableDataRecord: (record: T | T[], index?: number) => { return getTableInstance().insertTableDataRecord(record, index) }, - updateTableDataRecord: (rowKey: string | number, record: Recordable) => { + updateTableDataRecord: (rowKey: string | number, record: T) => { return getTableInstance().updateTableDataRecord(rowKey, record) }, findTableDataRecord: (rowKey: string | number) => { diff --git a/src/components/Table/src/types/table.ts b/src/components/Table/src/types/table.ts index a878e24..908ba5e 100644 --- a/src/components/Table/src/types/table.ts +++ b/src/components/Table/src/types/table.ts @@ -83,10 +83,10 @@ export interface GetColumnsParams { export type SizeType = 'default' | 'middle' | 'small' | 'large' -export interface TableActionType { +export interface TableActionType { reload: (opt?: FetchParams) => Promise setSelectedRows: (rows: Recordable[]) => void - getSelectRows: () => T[] + getSelectRows: () => T[] clearSelectedRowKeys: () => void expandAll: () => void expandRows: (keys: (string | number)[]) => void @@ -95,14 +95,14 @@ export interface TableActionType { getSelectRowKeys: () => Key[] deleteSelectRowByKey: (key: string) => void setPagination: (info: Partial) => void - setTableData: (values: T[]) => void - updateTableDataRecord: (rowKey: string | number, record: Recordable) => Recordable | void + setTableData: (values: T[]) => void + updateTableDataRecord: (rowKey: string | number, record: T) => T | void deleteTableDataRecord: (rowKey: string | number | string[] | number[]) => void - insertTableDataRecord: (record: Recordable | Recordable[], index?: number) => Recordable[] | void - findTableDataRecord: (rowKey: string | number) => Recordable | void + insertTableDataRecord: (record: T | T[], index?: number) => T[] | void + findTableDataRecord: (rowKey: string | number) => T | void getColumns: (opt?: GetColumnsParams) => BasicColumn[] setColumns: (columns: BasicColumn[] | string[]) => void - getDataSource: () => T[] + getDataSource: () => T[] getRawDataSource: () => T setLoading: (loading: boolean) => void setProps: (props: Partial) => void @@ -110,10 +110,10 @@ export interface TableActionType { setSelectedRowKeys: (rowKeys: Key[]) => void getPaginationRef: () => PaginationProps | boolean getSize: () => SizeType - getRowSelection: () => TableRowSelection + getRowSelection: () => TableRowSelection getCacheColumns: () => BasicColumn[] emit?: EmitType - updateTableData: (index: number, key: string, value: any) => Recordable + updateTableData: (index: number, key: K, value: T[K]) => Promise setShowPagination: (show: boolean) => Promise getShowPagination: () => boolean setCacheColumnsByField?: (dataIndex: string | undefined, value: BasicColumn) => void @@ -141,7 +141,7 @@ export interface TableSetting { fullScreen?: boolean } -export interface BasicTableProps { +export interface BasicTableProps> { // 点击行选中 clickToRowSelect?: boolean isTreeTable?: boolean @@ -166,8 +166,10 @@ export interface BasicTableProps { showSummary?: boolean // 是否可拖拽列 canColDrag?: boolean - // 接口请求对象 - api?: (...arg: any) => Promise + /** + * 接口请求对象, 返回类型同 `src/settings/componentSetting.ts > table > fetchSetting` + */ + api?: (...arg: any) => Promise // 请求之前处理参数 beforeFetch?: Fn // 自定义处理接口返回参数 @@ -189,7 +191,7 @@ export interface BasicTableProps { // 表单配置 formConfig?: Partial // 列配置 - columns: BasicColumn[] + columns: BasicColumn[] // 是否显示序号列 showIndexColumn?: boolean // 序号列配置 @@ -207,9 +209,9 @@ export interface BasicTableProps { // 在分页改变的时候清空选项 clearSelectOnPageChange?: boolean // - rowKey?: string | ((record: Recordable) => string) + rowKey?: keyof T | ((record: T) => keyof T) // 数据 - dataSource?: Recordable[] + dataSource?: T[] // 标题右侧提示 titleHelpMessage?: string | string[] // 表格滚动最大高度 @@ -412,13 +414,13 @@ export interface BasicTableProps { onColumnsChange?: (data: ColumnChangeParam[]) => void } -export type CellFormat = +export type CellFormat = | string - | ((text: string, record: Recordable, index: number) => string | number) + | ((text: string, record: T, index: number) => string | number) | Map -export interface DefaultBasicColumn extends Omit, 'filters'> { - children?: BasicColumn[] +export interface DefaultBasicColumn extends Omit, 'filters'> { + children?: BasicColumn[] filters?: { text: string value: string @@ -434,19 +436,19 @@ export interface DefaultBasicColumn extends Omit, 'filte slots?: Recordable // 自定义header渲染 - customHeaderRender?: (column: BasicColumn) => string | VNodeChild | JSX.Element + customHeaderRender?: (column: BasicColumn) => string | VNodeChild | JSX.Element // Whether to hide the column by default, it can be displayed in the column configuration defaultHidden?: boolean // Help text for table column header helpMessage?: string | string[] | VNodeChild | JSX.Element - format?: CellFormat + format?: CellFormat // 权限编码控制是否显示 auth?: RoleEnum | RoleEnum[] | string | string[] // 业务控制是否显示 - ifShow?: boolean | ((column: BasicColumn) => boolean) + ifShow?: boolean | ((column: BasicColumn) => boolean) /** * default is not editable @@ -454,36 +456,36 @@ export interface DefaultBasicColumn extends Omit, 'filte edit?: false } -export interface EditableBasicColumn extends Omit { +export interface EditableBasicColumn extends Omit, 'edit'> { edit: true editRow?: boolean editable?: boolean - editComponent: T + editComponent: C editComponentProps?: | ((opt: { text: string | number | boolean | Recordable - record: Recordable - column: EditableBasicColumn + record: T + column: EditableBasicColumn index: number - }) => ComponentProps[T]) - | ComponentProps[T] - editRule?: boolean | ((text: string, record: Recordable) => Promise) + }) => ComponentProps[C]) + | ComponentProps[C] + editRule?: boolean | ((text: string, record: T) => Promise) editValueMap?: (value: any) => string onEditRow?: () => void // 自定义修改后显示的内容 editRender?: (opt: { text: string | number | boolean | Recordable - record: Recordable - column: EditableBasicColumn + record: T + column: EditableBasicColumn index: number }) => VNodeChild | JSX.Element // 动态 Disabled - editDynamicDisabled?: boolean | ((record: Recordable) => boolean) + editDynamicDisabled?: boolean | ((record: T) => boolean) } -type EditableBasicColumns = T extends any ? EditableBasicColumn : never +type EditableBasicColumns = C extends any ? EditableBasicColumn : never -export type BasicColumn = DefaultBasicColumn | EditableBasicColumns +export type BasicColumn = DefaultBasicColumn | EditableBasicColumns export interface ColumnChangeParam { dataIndex: string