import type { CSSProperties } from 'vue'; import type { FilterValue, SorterResult, SortOrder, FilterDropdownProps, ColumnFilterItem, CompareFn, RowSelectionType, GetPopupContainer, TableRowSelection, TableLocale, ColumnType } from 'ant-design-vue/es/table/interface'; import type { TableSticky, TableLayout, GetComponentProps, TransformCellText, AlignType, DataIndex, CellEllipsisType, FixedType, Key, RenderedCell, GetRowKey, RowClassName, PanelRender, RenderExpandIcon, ExpandedRowRender, TableComponents } from 'ant-design-vue/es/vc-table/interface'; import type { VueNode } from 'ant-design-vue/es/_util/type'; import type { Breakpoint } from 'ant-design-vue/es/_util/responsiveObserve'; import type { TooltipProps } from 'ant-design-vue/es/tooltip'; import type { SizeType } from 'ant-design-vue/es/config-provider'; import type { ThemeType } from '../../ele-toolbar/types'; /** * 表格数据类型 */ export type RecordType = Record; /** * 搜索参数类型 */ export type WhereType = Record; /** * 排序参数类型 */ export type OrderType = Record; /** * 筛选参数类型 */ export type FilterType = Record; /** * 排序方式类型 */ export type SorterType = SorterResult | SorterResult[]; /** * 列配置 sorter 类型 */ export type ColumnSorterType = boolean | CompareFn | { compare?: CompareFn; multiple?: number; }; /** * Function 数据源参数类型 */ export interface DatasourceParams { page?: number; limit?: number; where: WhereType; orders: OrderType; filters: FilterType; sorter: SorterType; orgFilters: FilterType; parent?: RecordType; } /** * Function 数据源返回结果类型 */ export type DatasourceResult = RecordType[] | Record | undefined; /** * Function 数据源类型 */ export type DatasourceFunction = (params: DatasourceParams) => Promise; /** * 数据源类型 */ export type DatasourceType = RecordType[] | DatasourceFunction; /** * 刷新方法参数 */ export interface ReloadOption { page?: number; limit?: number; where?: WhereType; sorter?: SorterType; filters?: FilterType; } /** * 请求参数设置 */ export interface RequestOption { sortName?: string; orderName?: string; } /** * 响应参数设置 */ export interface ResponseOption { dataName?: string; countName?: string; } /** * 排序方式类型 */ export interface OrderItem { field: string; descend: boolean; sorter?: ColumnSorterType; multiple?: number; } /** * parseData 类型 */ export type ParseDataType = (data: any) => any; /** * 列配置数据类型 */ export interface ColItem { id: string; key?: Key; dataIndex?: DataIndex; title?: string; checked?: boolean; fixed?: boolean | 'left' | 'right'; } /** * 设置滚动参数类型 */ export interface ScrollType { x?: number | true | string; y?: number | string; scrollToFirstRowOnChange?: boolean; } /** * 设置头部行属性参数类型 */ export type CustomHeaderRowType = GetComponentProps[]>; /** * 分页组件显示位置参数类型 */ export type TablePaginationPosition = 'topLeft' | 'topCenter' | 'topRight' | 'bottomLeft' | 'bottomCenter' | 'bottomRight'; /** * 生成复杂数据的渲染函数的参数类型 */ export interface CustomRenderOption { value: any; text: any; record: RecordType; index: number; column: ColumnItem; } /** * 自定义 filter 图标 function 参数类型 */ export interface FilterIconOption { filtered: boolean; column: ColumnItem; } /** * 表格列配置 */ export interface ColumnItem { align?: AlignType; colSpan?: number; dataIndex?: DataIndex; defaultFilteredValue?: FilterValue | null | string | string[]; defaultSortOrder?: SortOrder; ellipsis?: CellEllipsisType; filterDropdown?: VueNode | ((props: FilterDropdownProps) => VueNode); customFilterDropdown?: boolean; filterDropdownVisible?: boolean; filtered?: boolean; filteredValue?: FilterValue | null | string | string[]; filterIcon?: VueNode | ((opt: FilterIconOption) => VueNode); filterMultiple?: boolean; filters?: ColumnFilterItem[]; fixed?: FixedType; key?: Key; customRender?: (opt: CustomRenderOption) => any | RenderedCell; responsive?: Breakpoint[]; showSorterTooltip?: ShowSorterTooltipType; sorter?: ColumnSorterType; sortOrder?: SortOrder; sortDirections?: SortOrder[]; title?: string; width?: number | string; minWidth?: number; maxWidth?: number; resizable?: boolean; customCell?: GetComponentProps; customHeaderCell?: GetComponentProps; onFilter?: (value: string | number | boolean, record: RecordType) => boolean; onFilterDropdownVisibleChange?: (visible: boolean) => void; children?: ColumnsType; hideInTable?: boolean; hideInSetting?: boolean; } /** * columns 类型 */ export type ColumnsType = Array; /** * done 事件参数类型 */ export type EleProTableDoneRes = { data: T[]; total: number; response: DatasourceResult; }; /** * done 回调类型 */ export type EleProTableDone = (res: EleProTableDoneRes, curr: number, count: number, parent?: T) => void; /** * 内置的 tool 名称 */ export type TableToolName = 'reload' | 'size' | 'columns' | 'fullscreen'; /** * doRequest 的参数类型 */ export type DoRequestCallback = (options: DatasourceParams) => void; /** * 表格尺寸类型 */ export type TableSizeType = SizeType | 'default'; /** * props 类型 */ export interface ProTableProps { datasource: DatasourceType; where?: WhereType; request?: RequestOption; response?: ResponseOption; parseData?: ParseDataType; ascendValue?: string; descendValue?: string; selection?: RecordType[]; current?: RecordType; needPage?: boolean; initLoad?: boolean; loading?: boolean; columns?: ColumnsType; currentPage?: number; pageSize?: number; toolsTheme?: ThemeType; title?: string; subTitle?: string; toolkit?: TableToolName[]; columnsSort?: boolean; toolbar?: boolean; toolStyle?: CSSProperties; toolClass?: string; toolkitStyle?: CSSProperties; fullZIndex?: number; autoAmendPage?: boolean; selectionType?: RowSelectionType | ''; lazyLoad?: boolean; striped?: boolean; height?: string | number; fullHeight?: string | number; reloadOnChange?: boolean; resizable?: boolean; hideOnSinglePage?: boolean; pageSizeOptions?: string[]; showLessItems?: boolean; showQuickJumper?: boolean; showSizeChanger?: boolean; showTotal?: (total: number, range: [number, number]) => string; simple?: boolean; position?: TablePaginationPosition[]; hasChildrenColumnName?: string; bordered?: boolean; components?: TableComponents; childrenColumnName?: string; defaultExpandAllRows?: boolean; defaultExpandedRowKeys?: Key[]; expandedRowKeys?: Key[]; expandedRowRender?: ExpandedRowRender; expandFixed?: boolean | 'left' | 'right'; expandIcon?: RenderExpandIcon; expandRowByClick?: boolean; expandIconColumnIndex?: number; footer?: PanelRender; getPopupContainer?: GetPopupContainer; locale?: TableLocale; rowClassName?: RowClassName; rowKey?: string | GetRowKey; rowSelection?: TableRowSelection; scroll?: ScrollType; showHeader?: boolean; showSorterTooltip?: ShowSorterTooltipType; size?: TableSizeType; sortDirections?: SortOrder[]; sticky?: TableSticky | boolean; tableLayout?: TableLayout; indentSize?: number; rowExpandable?: (record: RecordType) => boolean; customHeaderRow?: CustomHeaderRowType; customRow?: GetComponentProps; transformCellText?: TransformCellText; } /** * showSorterTooltip 类型 */ export type ShowSorterTooltipType = boolean | TooltipProps; /** * 国际化语言类型 */ export interface TableSizeLocale { medium: string; small: string; mini: string; } /** * 国际化语言类型 */ export interface TableColumnsLocale { columns: string; reset: string; untitled: string; fixedLeft: string; fixedRight: string; } /** * 国际化语言类型 */ export interface TableToolsLocale { refresh: string; size: string; sizeOption: TableSizeLocale; columns: string; columnsOption: TableColumnsLocale; fullscreen: string; }