import { Key, ReactNode } from 'react'; import type { ButtonProps } from 'antd/es/button'; import type { TooltipProps } from 'antd/es/tooltip'; import type { NamePath } from 'antd/es/form/interface'; import type { ColumnType, TableProps } from 'antd/es/table'; import type { FormInstance, FormItemProps } from 'antd/es/form'; import type { ProRule } from '../ProForm/propsType'; import { ProFormValueType, ColumnPropsMap } from '../ProForm/components/render/propsType'; export type ActionType = 'edit' | 'delete' | 'save' | 'cancel' | 'add' | 'mulDelete' | 'custom'; export type ShowFunction = (record?: T, options?: { index?: number; form?: FormInstance; namePath?: NamePath; }) => Promise | boolean | void; export interface OptionsProps { index: number; form: FormInstance; namePath: NamePath; } export interface SummaryColumnProps { key: string; index: number; title?: string; colSpan?: number; valueType?: string; precision?: number; prefix?: ReactNode | string; } export interface BaseActionProps { /** * @description 按钮类型 * @default - */ type?: ActionType; /** * @description 按钮名称 * @default - */ label?: string | ReactNode; /** * @description 是否显示按钮 * @default true */ show?: boolean | ShowFunction; /** * @description 是否禁止操作 * @default true */ disabled?: boolean | ShowFunction; /** * @description 添加是否自定义打开弹框 * @default false */ isSelectModal?: boolean; /** * @description 删除是否开启二次确认 * @default true */ needConfirm?: boolean; /** * @description 按钮是否禁止操作 * @default - */ isEditable?: boolean; /** * @description 按钮前置校验事件 * @default - */ onClick?: ShowFunction; /** * @description 按钮前置校验事件 * @default - */ onHandle?: ShowFunction; /** * @description 支持antd的Button属性 * @default - */ buttonProps?: Omit; } export type RulesFn = (text?: any, record?: T, options?: OptionsProps) => ProRule[] | void; export type RequiredFn = (text?: any, record?: T, options?: OptionsProps) => boolean | void; export type viewRenderFn = (text?: any, record?: T, options?: OptionsProps) => string | number | ReactNode | void; export interface ProColumnsProps extends Omit, 'rules' | 'required'>, ColumnType { required?: boolean | RequiredFn; labelRequired?: boolean; name?: NamePath; names?: NamePath[]; cache?: boolean; isEditable?: boolean | RequiredFn; valueType?: ProFormValueType; tooltip?: string | ({ icon?: string | ReactNode; } & TooltipProps); component?: string | number | ReactNode | viewRenderFn; viewRender?: string | number | ReactNode | viewRenderFn; hiddenNames?: NamePath[] | NamePath[][]; rules?: ProRule[] | RulesFn; [key: string]: any; } export type ProEditTableColumnsProps = ProColumnsProps & ColumnPropsMap; export interface State { _columns: ProEditTableColumnsProps[]; cellNamePath: NamePath[]; forceUpdate: {}; editingKeys: string[]; selectedRowKeys: Key[]; selectedRows: any[]; virtualKey: string; page: { pageNum: number; pageSize: number; }; } export interface ProEditTableRefProps { getInternalState: () => State; } export interface ProEditTableProps extends Omit, 'onChange' | 'summary'> { /** * @description 可编辑表格的 form 实例,使用 Form.useForm 生成后使用 * @default - */ form?: FormInstance; /** * @description 原始数据源,设置后可以对比更新后的数值 * @default - */ originalValues?: any; /** * @description 原始数据源,是否tooltip显示 * @default - */ originalTip?: boolean; /** * @description 可编辑表格的类型,单行、多行、单元格编辑 * @default false */ mode?: 'single' | 'multiple' | 'cell'; /** * @description 可编辑表格的类型,单行编辑或者多行编辑 * @deprecated 将于下个版本 4.0.0 被弃用 * @default multiple */ type?: 'single' | 'multiple' | 'cell'; /** * @description 必填对齐方式, 默认右对齐 * @default right */ requiredAlign?: 'left' | 'right'; /** * @description 同 dataSource,传入一个数组,是 table 渲染的元数据 * @default undefined */ value?: T[]; /** * @description dataSource 修改时触发,删除和修改都会触发,如果设置了 value,ProEditTable 会成为一个受控组件 * @default - */ onChange?: (list: T[]) => void; /** * @description 表格列的配置描述,扩展了FormItemProps属性 * @default [] */ columns: ProEditTableColumnsProps[]; /** * @description 是否禁止编辑 * @default false */ disabled?: boolean; /** * @description 是否开启斑马纹 * @default true */ stripe?: boolean; /** * @description 可编辑表格新增时数据插入方式,头部插入或者尾部插入 * @default after */ insertType?: 'before' | 'after'; /** * @description 字段名,支持数组 * @default - */ name?: string | number | (string | number)[]; /** * @description 是否可拖拽排序 * @default - */ draggable?: boolean; /** * @description 空列表状态时,自定义添加按钮 * @default 点击添加 */ emptyBtnText?: string; /** * @description 只能编辑一行的的提示 * @default 请先保存数据 */ onlyOneLineMsg?: string; /** * @description 单行删除时弹出的确认框提示消息 * @default 您确定要删除该行数据吗? */ deletePoConfirmMsg?: string; /** * @description 多行删除时弹出的确认框提示消息 * @default 您确定要删除选中的数据吗? */ mulDeletePoConfirmMsg?: string; /** * @description 自定义编辑模式的操作栏 单行编辑默认为编辑、删除、保存、取消;多行编辑为删除 * @default - */ actionWidth?: ColumnType['width']; /** * @description 自定义编辑模式的操作栏 单行编辑默认为编辑、删除、保存、取消;多行编辑为删除 * @default - */ actionProps?: BaseActionProps[] | boolean; /** * @description 自定义底部操作栏 默认为添加、删除(批量) * @default - */ toolbarProps?: BaseActionProps[] | boolean; /** * @description 最大可添加数量 * @default - */ max?: number; /** * @description formItem的props * @default - */ otherProps?: any; /** * @description 底部合计配置 * @default - */ summary?: { columns: SummaryColumnProps[]; total?: boolean; fixed?: boolean | 'top' | 'bottom'; } | TableProps['summary']; /** * @description 底部合计配置 * @default - */ headerRender?: ReactNode; }