import React__default from 'react'; type SortOrder = "ascend" | "descend" | null; interface FilterConfig { text: string; value: any; } type ColumnDataType = "text" | "number" | "date" | "boolean"; interface ICanvasColumnType { /** * 列的key,唯一标识 */ key: string; /** * 数据字段名 */ dataIndex?: string; /** * 列标题 */ title: React__default.ReactNode | string; /** * 动态列配置的title * 当你传入的title是一个 组件时。组件再做动态列配置的时候,需要一个字符串的值,来充当动态列配置的title。这里可以传入一个字符串的值进来 */ dynamicTitle?: string; /** * 子列(用于多级表头) */ children?: ICanvasColumnType[]; /** * 列宽度 */ width?: number; /** * 对齐方式 */ align?: "left" | "center" | "right"; /** * 表头对齐方式(如果不设置,使用全局 headerAlign 或 align) */ headerAlign?: "left" | "center" | "right"; /** * 是否固定列 */ fixed?: "left" | "right" | boolean; /** * 是否可排序(默认为true) */ sorter?: boolean | ((a: RecordType, b: RecordType) => number); /** * 默认排序顺序 */ defaultSortOrder?: SortOrder; /** * 是否开启自定义排序(默认为true) * 排序的数据默认实际不会影响源数据,是一份新的数据。 */ isOrder?: boolean; /** * 是否开启过滤 */ filters?: FilterConfig[]; /** * 过滤方法 */ onFilter?: (value: any, record: RecordType) => boolean; /** * 是否开启过滤功能(默认为true) */ isFilter?: boolean; /** * 列数据类型(用于筛选功能,默认为'text') */ dataType?: ColumnDataType; /** * 自定义渲染 ,两种模式,兼容旧的入参方式 */ render?: ((text: any, record: RecordType, index: number) => React__default.ReactNode) | ((options: { value: any; record: RecordType; index: number; }) => React__default.ReactNode); /** * 是否显示 */ hidden?: boolean; /** * 最小宽度 */ minWidth?: number; /** * 最大宽度 */ maxWidth?: number; /** * 是否溢出省略(默认为true) */ ellipsis?: boolean; /** * 是否换行(默认为false) */ wrap?: boolean; /** * 获取复制的值(用于自定义复制内容) */ getCopyValue?: (text: any, record: RecordType, index: number) => string; /** * 是否默认不勾选 */ defaultUnChecked?: boolean; /** * 是否开启维度自定义 */ isDimension?: boolean; /** * 自定义排序的优先级,数字越小,优先级越高,比如2的不能排序到1的前面 */ dimensionPriority?: number; /** * 维度优先级分组,同组内遵循 dimensionPriority,跨组自由排序 */ dimensionGroup?: string; /** * 自定义维度互斥的字段,多个需要逗号分隔,比如:name,age */ dimensionExclusive?: string; /** * 维度是否开启合计 */ isDimensionSum?: boolean; /** * 是否合并单元格 */ isMerge?: boolean; /** * 开启合计 */ isSummary?: boolean; /** * 合计自定义计算回调函数(用于格式化或二次处理已计算的合计值) * @param value 当前值 * @param values 所有值的数组 * @returns 计算后的合计值 */ totalCalcCallback?: (value: string | number | undefined, values: Record) => any; /** * 自定义合计计算方式(替代默认的求和逻辑) * @param dataSource 数据源 * @param dataIndex 当前列的字段名 * @returns 计算后的值 */ summaryCalc?: (dataSource: RecordType[], dataIndex: string) => number | string; /** * 开启合并的字段,按其他字段维度合并 */ mergeKey?: string; /** * 添加角标 */ badge?: IBadgeProps | ((record: RecordType) => IBadgeProps | undefined); /** * 导出excel的配置 */ excelConfig?: { /** * 表头背景色 */ headerBgColor?: string; /** * 表头字体颜色 */ headerFontColor?: string; }; /** * 日期格式化 */ dateFormat?: string; /** * 精度 */ precision?: number; /** * 是否加上千分符 */ thousand?: boolean; /** * 空值时显示的文本,默认为 "—" */ emptyText?: string; /** * 设置单元格属性(用于合并单元格等) * 参考 antd table 的 onCell 用法 */ onCell?: (record: RecordType, rowIndex?: number) => { rowSpan?: number; colSpan?: number; [key: string]: any; }; } type ICanvasColumnsType = ICanvasColumnType[]; interface IBadgeProps { /** * 角标提示文本(鼠标悬停时显示) */ title?: string; /** * 角标颜色 */ color?: string; /** * 角标位置 */ position?: "top-left" | "top-right" | "bottom-left" | "bottom-right"; } interface ICanvasRowSelection { /** * 选中的key数组 */ selectedRowKeys?: React__default.Key[]; /** * 选中改变时的回调 */ onChange?: (selectedRowKeys: React__default.Key[], selectedRows: RecordType[]) => void; /** * 获取checkbox的属性 */ getCheckboxProps?: (record: RecordType) => any; /** * 选择框的列宽度 */ columnWidth?: number; /** * 固定选择列 */ fixed?: boolean; } interface IExpandable { /** * 展开的keys集合 */ expandedRowKeys?: React__default.Key[]; /** * 默认展开的keys集合 */ defaultExpandedRowKeys?: React__default.Key[]; /** * 展开状态改变时的回调 */ onExpandedRowsChange?: (expandedKeys: React__default.Key[], row: RecordType, action: "expand" | "collapse") => void; /** * 是否默认展开所有行 */ defaultExpandAllRows?: boolean; /** * 展开图标的列索引(默认0,第一列) */ expandIconColumnIndex?: number; /** * 自定义展开图标 */ expandIcon?: (params: { expanded: boolean; record: RecordType; onExpand: (record: RecordType, expanded: boolean) => void; }) => React__default.ReactNode; /** * 展开行的自定义渲染 */ expandedRowRender?: (params: { record: RecordType; index: number; expanded: boolean; }) => React__default.ReactNode; /** * 展开行的类名 */ expandedRowClassName?: (record: RecordType, index: number) => string; /** * 子节点数据的字段名(默认为'children') */ childrenColumnName?: string; } interface ICanvasTableProps { /** * 数据源 */ dataSource: RecordType[]; /** * 列配置 */ columns: ICanvasColumnType[]; /** * 行key */ rowKey?: string | ((record: RecordType) => string); /** * 表格高度 */ height?: number; /** * 表格最大高度 */ maxHeight?: number; /** * 表格宽度 */ width?: number; /** * 行高 */ rowHeight?: number; /** * 表头高度 */ headerHeight?: number; /** * 表头换行 */ headerWrap?: boolean; /** * 表头对齐方式(默认居中) */ headerAlign?: "left" | "center" | "right"; /** * 勾选配置 */ rowSelection?: ICanvasRowSelection; /** * 树形展开配置 */ expandable?: IExpandable; /** * 排序改变回调 */ onSortChange?: (field: string, order: SortOrder) => void; /** * 过滤改变回调 */ onFilterChange?: (filters: Record) => void; /** * 滚动事件 */ onScroll?: (scrollLeft: number, scrollTop: number) => void; /** * 行点击事件 */ onRowClick?: (record: RecordType, index: number) => void; /** * 列宽调整回调 */ onColumnResize?: (columnKey: string, newWidth: number) => void; /** * 是否显示边框 */ bordered?: boolean; /** * 是否显示斑马纹 */ striped?: boolean; /** * 空数据时的提示 */ emptyText?: string; /** * 自定义样式 */ style?: React__default.CSSProperties; /** * 类名 */ className?: string; /** * 加载状态 */ loading?: boolean; /** * 是否启用右键菜单(默认为false) */ isContextMenu?: boolean; /** * 全屏状态变化回调 */ isFullscreenHandle?: (isFull: boolean) => void; /** * 表格模式 * index: 自动添加序号列 */ mode?: "index"; /** * 动态列配置key(开启动态列配置) */ dynamicKey?: string; /** * 动态列配置版本号 */ dynamicVersion?: number; /** * 自定义动态列配置后的回调 */ customDynamicListHandle?: (dynamicList: any) => void; /** * 开启维度自定义(需配合 isAutoMerge 使用) */ isDimensionDynamic?: boolean; /** * 开启维度自定义后,是否合并子数据。默认为true,会将相同维度组合的子数据合并为一行;为false时保留所有原始记录 */ isDimensionMergeChildren?: boolean; /** * 开启维度自定义后,开启维度合计的字段 */ dimensionCustomSumKeys?: (string | { key: string; value?: (record: any) => string | number; summaryType?: "sum" | "first" | "computed"; computedSummary?: (items: any[], summaryRow: any) => string | number; })[]; /** * 开启自动合并行 */ isAutoMerge?: boolean; /** * 序号列是否参与合并(默认为true) */ isIndexMerge?: boolean; /** * 勾选框列是否参与合并(默认为false) */ isSelectionMerge?: boolean; /** * 自定义渲染模式 */ renderMode?: "traditional" | "object"; /** * 固定行配置 * 固定前几行不参与滚动 */ fixedRowsCount?: number; /** * 固定行配置(扩展) */ fixedRowsConfig?: { /** * 固定顶部行数量 */ topCount?: number; /** * 固定底部行数量 */ bottomCount?: number; /** * 固定行的行高(可选,默认使用rowHeight) */ rowHeight?: number; /** * 固定行的样式 */ style?: React__default.CSSProperties; }; /** * 合计行是否固定在底部(默认为false) * 当为true时,合计行固定在表格底部不参与滚动 */ summaryFixed?: boolean; /** * 自动计算Y轴高度模式 * - false: 不自动调整(默认) * - true | 'viewport': 根据视口自动调整高度(距离页面底部的距离) * - 'content': 根据内容自动撑开高度(表头 + 所有数据行) */ isAutoScrollY?: boolean | "viewport" | "content"; /** * 自动计算Y轴高度时,canvas table下面留出的距离 * 仅在 isAutoScrollY 为 true 或 'viewport' 时生效 */ autoScrollYMarginBottom?: number; /** * 表格id(用于自动高度计算时定位元素) */ canvasTableId?: string; /** * 表格ref句柄,用于暴露表格的一些方法 */ tableRefHandle?: React__default.MutableRefObject; /** * 导出excel的一些配置 */ exportExcelConfig?: { topDescription?: string; time?: string; topDescriptionRowHeight?: number; fileName: string; isExportNoSummary?: boolean; }; } /** * CanvasTable 暴露的方法 */ interface ICanvasTableRefHandle { /** * 获取当前表格的配置信息(动态列配置) */ getDynamicList: () => any[]; /** * 动态列配置重置 */ onResetDynamicList: () => void; /** * 动态列配置设置 */ onSetDynamicList: (list: any[]) => void; /** * 导出Excel */ exportExcel?: (fileName: string, config?: { topDescription?: string; time?: string; topDescriptionRowHeight?: number; }) => void; /** * 获取表格容器 */ getContainer: () => HTMLDivElement | null; /** * 全屏展示表格 */ toggleFullScreen: () => void; /** * 获取选中的行keys */ getSelectedRowKeys: () => React__default.Key[]; /** * 设置选中的行keys */ setSelectedRowKeys: (keys: React__default.Key[]) => void; /** * 获取展开的keys */ getExpandedRowKeys: () => React__default.Key[]; /** * 设置展开的keys */ setExpandedRowKeys: (keys: React__default.Key[]) => void; /** * 展开指定行 */ expandRow: (key: React__default.Key) => void; /** * 收起指定行 */ collapseRow: (key: React__default.Key) => void; /** * 切换指定行展开状态 */ toggleExpandRow: (key: React__default.Key) => void; /** * 滚动到指定位置 */ scrollTo: (params: { x?: number; y?: number; }) => void; /** * 获取滚动条位置信息 * @returns 包含 x(水平) 和 y(垂直) 滚动位置的对象 */ getScrollPosition: () => { /** 水平滚动位置 */ x: number; /** 垂直滚动位置 */ y: number; }; /** * 获取当前排序状态 */ getSortState: () => { field: string | null; order: SortOrder; }; /** * 获取当前过滤状态 */ getFilterState: () => Record; /** * 清除排序 */ clearSort: () => void; /** * 清除过滤 */ clearFilter: () => void; } export { ColumnDataType, FilterConfig, IBadgeProps, ICanvasColumnType, ICanvasColumnsType, ICanvasRowSelection, ICanvasTableProps, ICanvasTableRefHandle, IExpandable, SortOrder };