UNPKG

vxe-table-demonic

Version:

一个基于 vue 的 PC 端表单/表格组件,支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、JSON 配置式...

1,811 lines (1,757 loc) 112 kB
import { RenderFunction, SetupContext, Ref, ComputedRef, ComponentPublicInstance, ComponentInternalInstance, VNode } from 'vue' import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, VNodeStyle, SlotVNodeType } from './component' import { VxeTableProEmits, VxeTableProDefines } from './plugins/pro' import { VxeColumnPropTypes, VxeColumnProps, VxeColumnSlotTypes } from './column' import { VXETableConfigOptions, VxeGlobalRendererHandles } from './v-x-e-table' import { VxeToolbarConstructor, VxeToolbarInstance } from './toolbar' import { VxeTooltipInstance } from './tooltip' import { VxeGridConstructor } from './grid' import { VxeMenuPanelInstance } from './menu' /* eslint-disable no-use-before-define */ /** * 组件 - 表格 * @example import { VxeTable } from 'vxe-components' */ export const VxeTable: VXEComponent<VxeTableProps<any>, VxeTableEventProps<any>, VxeTableSlots<any>> /** * 组件 - 表格 */ export const Table: typeof VxeTable export type VxeTableInstance<D = any> = ComponentPublicInstance<VxeTableProps<D>, VxeTableConstructor<D>> export type VxeTableDataRow = Record<string, any> export interface VxeTableConstructor<D = any> extends VxeComponentBase, VxeTableMethods<D> { props: Readonly<VxeTableProps<D>> context: SetupContext<VxeTableEmits> instance: ComponentInternalInstance reactData: TableReactData<D> internalData: TableInternalData<D> getRefMaps(): TablePrivateRef getComputeMaps(): TablePrivateComputed<D> renderVN: RenderFunction xegrid: VxeGridConstructor<D> | null } export interface TablePrivateRef { refElem: Ref<HTMLDivElement> refTooltip: Ref<VxeTooltipInstance> refValidTooltip: Ref<VxeTooltipInstance> refTableFilter: Ref<ComponentPublicInstance> refTableMenu: Ref<VxeMenuPanelInstance> refTableHeader: Ref<ComponentPublicInstance> refTableBody: Ref<ComponentPublicInstance> refTableFooter: Ref<ComponentPublicInstance> refTableLeftHeader: Ref<ComponentPublicInstance> refTableLeftBody: Ref<ComponentPublicInstance> refTableLeftFooter: Ref<ComponentPublicInstance> refTableRightHeader: Ref<ComponentPublicInstance> refTableRightBody: Ref<ComponentPublicInstance> refTableRightFooter: Ref<ComponentPublicInstance> refLeftContainer: Ref<HTMLDivElement> refRightContainer: Ref<HTMLDivElement> refCellResizeBar: Ref<HTMLDivElement> } export interface VxeTablePrivateRef extends TablePrivateRef { } export interface TablePrivateComputed<D = VxeTableDataRow> { computeSize: ComputedRef<VxeTablePropTypes.Size> computeValidOpts: ComputedRef<VxeTablePropTypes.ValidOpts<D>> computeSXOpts: ComputedRef<VxeTablePropTypes.SXOpts> computeSYOpts: ComputedRef<VxeTablePropTypes.SYOpts> computeColumnOpts: ComputedRef<VxeTablePropTypes.ColumnOpts> computeRowOpts: ComputedRef<VxeTablePropTypes.RowOpts> computeResizeleOpts: ComputedRef<VxeTablePropTypes.ResizeOpts> computeResizableOpts: ComputedRef<VxeTablePropTypes.ResizableOpts<D>> computeSeqOpts: ComputedRef<VxeTablePropTypes.SeqOpts<D>> computeRadioOpts: ComputedRef<VxeTablePropTypes.RadioOpts<D>> computeCheckboxOpts: ComputedRef<VxeTablePropTypes.CheckboxOpts<D>> computeTooltipOpts: ComputedRef<VxeTablePropTypes.TooltipOpts<D>> computeEditOpts: ComputedRef<VxeTablePropTypes.EditOpts<D>> computeSortOpts: ComputedRef<VxeTablePropTypes.SortConfig<D>> computeFilterOpts: ComputedRef<VxeTablePropTypes.FilterOpts<D>> computeMouseOpts: ComputedRef<VxeTablePropTypes.MouseOpts> computeAreaOpts: ComputedRef<VxeTablePropTypes.AreaOpts> computeKeyboardOpts: ComputedRef<VxeTablePropTypes.KeyboardOpts> computeClipOpts: ComputedRef<VxeTablePropTypes.ClipOpts<D>> computeFNROpts: ComputedRef<VxeTablePropTypes.FNROpts<D>> computeHeaderMenu: ComputedRef<VxeTableDefines.MenuFirstOption> computeBodyMenu: ComputedRef<VxeTableDefines.MenuFirstOption> computeFooterMenu: ComputedRef<VxeTableDefines.MenuFirstOption> computeIsMenu: ComputedRef<boolean> computeMenuOpts: ComputedRef<VxeTablePropTypes.MenuOpts<D>> computeExportOpts: ComputedRef<VxeTablePropTypes.ExportOpts> computeImportOpts: ComputedRef<VxeTablePropTypes.ImportOpts> computePrintOpts: ComputedRef<VxeTablePropTypes.PrintOpts> computeExpandOpts: ComputedRef<VxeTablePropTypes.ExpandOpts<D>> computeTreeOpts: ComputedRef<VxeTablePropTypes.TreeOpts<D>> computeEmptyOpts: ComputedRef<VxeTablePropTypes.EmptyOpts> computeLoadingOpts: ComputedRef<VxeTablePropTypes.LoadingOpts> computeCustomOpts: ComputedRef<VxeTablePropTypes.CustomOpts<D>> computeFixedColumnSize: ComputedRef<number> computeIsMaxFixedColumn: ComputedRef<boolean> computeIsAllCheckboxDisabled: ComputedRef<boolean> } export type VxeTablePrivateComputed<D = VxeTableDataRow> = TablePrivateComputed<D> export interface TableMethods<D = VxeTableDataRow> extends TablePublicMethods<D> { dispatchEvent(type: ValueOf<VxeTableEmits>, params: any, evnt: Event | null): void } export interface TablePublicMethods<DT = VxeTableDataRow> { /** * 手动清除表格所有条件,还原到初始状态 * 对于增删改查的场景中可能会用到,比如在数据保存之后清除表格缓存 */ clearAll(): Promise<void> /** * 该方法已废弃!!! * 同步 data 数据;如果用了该方法,那么组件将不再记录增删改的状态,只能自行实现对应逻辑 * 对于某些特殊的场景,比如深层树节点元素发生变动时可能会用到 * @deprecated */ syncData(): Promise<void> /** * 手动处理数据,用于手动排序与筛选 * 对于手动更改了排序、筛选...等条件后需要重新处理数据时可能会用到 */ updateData(): Promise<void> /** * 加载数据 * @param data 数据 */ loadData(data: any[]): Promise<any> /** * 加载数据并恢复到初始状态 * @param data 数据 */ reloadData(data: any[]): Promise<void> /** * 局部加载行数据并恢复到初始状态 * @param rows 行对象 * @param record 新数据 * @param field 指定字段名 */ reloadRow(rows: any | any[], record?: any, field?: string): Promise<void> /** * 用于树结构,给行数据加载子节点 * @param row 行对象 * @param children 子节点 */ loadTreeChildren(row: any, children: any[]): Promise<any[]> /** * 加载列配置 * @param columns 列对象 */ loadColumn(columns: (VxeTableDefines.ColumnOptions<any> | VxeTableDefines.ColumnInfo<any>)[]): Promise<any> /** * 加载列配置并恢复到初始状态 * @param columns 列对象 */ reloadColumn(columns: (VxeTableDefines.ColumnOptions<any> | VxeTableDefines.ColumnInfo<any>)[]): Promise<any> /** * 根据 tr 元素获取对应的 row 信息 * @param tr 行节点元素 */ getRowNode(trElem: HTMLElement): { rowid: string item: any items: any[] index: number parent?: any } | null /** * 根据 th/td 元素获取对应的 column 信息 * @param cell 单元格节点元素 */ getColumnNode(cellElem: HTMLElement): { colid: string item: VxeTableDefines.ColumnInfo<DT> items: VxeTableDefines.ColumnInfo<DT>[] index: number parent?: VxeTableDefines.ColumnInfo<DT> } | null /** * 根据 row 获取行的序号 * @param row 行对象 */ getRowSeq(row: any): string | number /** * 根据 row 获取相对于 data 中的索引 * @param row 行对象 */ getRowIndex(row: any): number /** * 根据 row 获取相对于当前数据中的索引 * @param row 行对象 */ getVTRowIndex(row: any): number /** * 根据 row 获取渲染中的虚拟索引 * @param row 行对象 */ getVMRowIndex(row: any): number /** * 根据 column 获取相对于 columns 中的索引 * @param column 列对象 */ getColumnIndex(column: VxeTableDefines.ColumnInfo<any>): number /** * 根据 column 获取相对于当前表格列中的索引 * @param column 列对象 */ getVTColumnIndex(column: VxeTableDefines.ColumnInfo<any>): number /** * 根据 column 获取渲染中的虚拟索引 * @param column 列对象 */ getVMColumnIndex(column: VxeTableDefines.ColumnInfo<any>): number /** * 创建 data 对象 * 对于某些特殊场景可能会用到,会自动对数据的字段名进行检测,如果不存在就自动定义 * @param records 数据 */ createData(records: any[]): Promise<any[]> /** * 创建 Row|Rows 对象 * 对于某些特殊场景需要对数据进行手动插入时可能会用到 * @param records 数据 */ createRow(records: any | any[]): Promise<any | any[]> /** * 只对 keep-source 开启有效,还原指定行 row 或者整个表格的数据 * @param rows 指定行 * @param field 字段名 */ revertData(rows?: any | any[], field?: string): Promise<any> /** * 手动清空单元格内容,如果不传参数,则清空整个表格内容,如果传了行则清空指定行内容,如果传了指定字段,则清空该字段内容 * @param rows 指定行 * @param field 字段名 */ clearData(rows?: any | any[], field?: string): Promise<any> /** * 用于 edit-config,判断行是否为新增的临时数据 * @param row 指定行 */ isInsertByRow(row: any): boolean /** * 删除所有新增的临时数据 */ removeInsertRow(): Promise<{ row: any, rows: any[] }> /** * 只对 keep-source 开启有效,判断行数据是否发生改变 * @param row 指定行 * @param field 指定字段 */ isUpdateByRow(row: any, field?: string): boolean /** * 获取表格的可视列,也可以指定索引获取列 * @param columnIndex 列索引 */ getColumns(): VxeTableDefines.ColumnInfo<DT>[] getColumns(columnIndex?: number): VxeTableDefines.ColumnInfo<DT> /** * 根据列的唯一主键获取列 * @param colid 列主键 */ getColumnById(colid: string): VxeTableDefines.ColumnInfo<DT> | null /** * 根据列的字段名获取列 * @param field 字段名 */ getColumnByField(field: string): VxeTableDefines.ColumnInfo<DT> | null /** * 获取当前表格的列 * 收集到的全量列、全量表头列、处理条件之后的全量表头列、当前渲染中的表头列 */ getTableColumn(): { collectColumn: VxeTableDefines.ColumnInfo<DT>[] fullColumn: VxeTableDefines.ColumnInfo<DT>[] visibleColumn: VxeTableDefines.ColumnInfo<DT>[] tableColumn: VxeTableDefines.ColumnInfo<DT>[] } /** * 获取数据,和 data 的行为一致,也可以指定索引获取数据 */ getData(): DT[] getData(rowIndex: number): DT /** * 用于 type=checkbox,获取已选中的行数据 */ getCheckboxRecords(isFull?: boolean): DT[] /** * 只对 tree-config 有效,获取行的父级 */ getParentRow(rowOrRowid: any): DT | null /** * 根据行的唯一主键获取行 * @param rowid 行主键 */ getRowById(rowid: string | number): DT | null /** * 根据行获取行的唯一主键 * @param row 行对象 */ getRowid(row: any): string /** * 获取当前表格的数据 * 完整的全量表体数据、处理条件之后的全量表体数据、当前渲染中的表体数据、当前渲染中的表尾数据 */ getTableData(): { fullData: DT[] visibleData: DT[] tableData: DT[] footerData: DT[][] } /** * 设置指定列为固定列 * @param columnOrField 列对象或字段名 */ setColumnFixed(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>, fixed: VxeColumnPropTypes.Fixed): Promise<void> /** * 取消指定的固定列 * @param columnOrField 列对象或字段名 */ clearColumnFixed(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): Promise<void> /** * 隐藏指定列 * @param columnOrField 列对象或字段名 */ hideColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): Promise<void> /** * 显示指定列 * @param columnOrField 列对象或字段名 */ showColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): Promise<void> /** * 设置列宽 * @param fieldOrColumn 列对象或字段名 * @param width 宽度 %,px */ setColumnWidth(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>, width: number | string): Promise<void> /** * 获取列宽 * @param fieldOrColumn 列对象或字段名 */ getColumnWidth(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): number; /** * 手动重置列的显示隐藏、列宽拖动的状态;如果为 true 则重置所有状态 * 如果已关联工具栏,则会同步更新 * @param options 可选参数 */ resetColumn(options?: boolean | { visible?: boolean resizable?: boolean fixed?: boolean order?: boolean }): Promise<void> /** * 刷新列配置 * 对于动态修改属性、显示/隐藏列等场景下可能会用到 */ refreshColumn(): Promise<void> /** * 刷新滚动操作,手动同步滚动相关位置 * 对于某些特殊的操作,比如滚动条错位、固定列不同步 */ refreshScroll(): Promise<void> /** * 重新计算表格,如果传 true 则进行完整计算 * 对于某些特殊场景可能会用到,比如隐藏的表格、重新计算列宽...等 */ recalculate(refull?: boolean): Promise<void> /** * 打开 tooltip 提示 * @param target 目标元素 * @param content 内容 */ openTooltip(target: HTMLElement, content: string | number): Promise<any> /** * 关闭 tooltip 提示 */ closeTooltip(): Promise<any> /** * 用于 type=checkbox,设置行为选中状态,第二个参数为选中与否 * @param rows 指定行 * @param checked 是否选中 */ setCheckboxRow(rows: any | any[], checked: boolean): Promise<any> /** * 用于 type=checkbox,判断列头复选框是否被选中 */ isAllCheckboxChecked(): boolean /** * 用于 type=checkbox,判断列头复选框是否被半选 */ isAllCheckboxIndeterminate(): boolean /** * 用于 type=checkbox,判断复选行数据是否勾选 * @param row 指定行 */ isCheckedByCheckboxRow(row: any): boolean /** * 用于 type=checkbox,判断复选行数据是否半选 * @param row 指定行 */ isIndeterminateByCheckboxRow(row: any): boolean /** * 用于 type=checkbox,切换某一行的选中状态 * @param row 指定行 */ toggleCheckboxRow(row: any): Promise<any> /** * 用于 type=checkbox,设置所有行的选中状态 * @param checked 是否选中 */ setAllCheckboxRow(checked: boolean): Promise<any> /** * 用于 radio-config.reserve,获取已保留选中的行数据 */ getRadioReserveRecord(isFull?: boolean): any[] /** * 用于 radio-config.reserve,手动清空用户保留选中的行数据 */ clearRadioReserve(): Promise<any> /** * 用于 checkbox-config.reserve,获取已保留选中的行数据 */ getCheckboxReserveRecords(isFull?: boolean): any[] /** * 用于 type=checkbox,获取半选状态的行数据 */ getCheckboxIndeterminateRecords(isFull?: boolean): any[] /** * 用于 checkbox-config.reserve,手动清空用户保留选中的行数据 */ clearCheckboxReserve(): Promise<any> /** * 用于 type=checkbox,切换所有行的选中状态 */ toggleAllCheckboxRow(): Promise<any> /** * 用于 type=checkbox,手动清空用户的选择 */ clearCheckboxRow(): Promise<any> /** * 用于 row-config.isCurrent,设置某一行为高亮状态 * @param row 指定行 */ setCurrentRow(row: any): Promise<any> /** * 用于 type=radio,判断单选行数据是否勾选 * @param row 指定行 */ isCheckedByRadioRow(row: any): boolean /** * 用于 type=radio,设置某一行为选中状态 * @param row 指定行 */ setRadioRow(row: any): Promise<any> /** * 将指定行设置为取消/标记待删除状态 */ setPendingRow(rows: any | any[], status: boolean): Promise<any> /** * 切换指定行的取消/标记待删除状态 */ togglePendingRow(rows: any | any[]): Promise<any> /** * 获取待删除状态的数据 */ getPendingRecords(): DT[] /** * 判断行是否为待删除状态 * @param row 指定行 */ hasPendingByRow(row: any): boolean /** * 清除所有标记状态 */ clearPendingRow(): Promise<any> /** * 手动清除临时合并的单元格 */ clearMergeCells(): Promise<any> /** * 手动清除临时合并的表尾 */ clearMergeFooterItems(): Promise<any> /** * 用于 row-config.isCurrent,手动清空当前高亮的状态 */ clearCurrentRow(): Promise<any> /** * 用于 type=radio,手动清空用户的选择 */ clearRadioRow(): Promise<any> /** * 获取临时合并的单元格 */ getMergeCells(): VxeTableDefines.MergeInfo[] /** * 获取临时合并的表尾 */ getMergeFooterItems(): VxeTableDefines.MergeInfo[] /** * 用于 column-config.isCurrent,获取当前列 */ getCurrentColumn(): VxeTableDefines.ColumnInfo<DT> | null /** * 用于 row-config.isCurrent,获取当前行的行数据 */ getCurrentRecord(): DT | null /** * 用于 type=radio,获取当已选中的行数据 */ getRadioRecord(isFull?: boolean): DT | null /** * 用于 column-config.isCurrent,设置某列行为高亮状态 * @param columnOrField 列对象或字段名 */ setCurrentColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): Promise<void> /** * 用于 column-config.isCurrent,手动清空当前高亮的状态 */ clearCurrentColumn(): Promise<void> /** * 手动对表格进行排序 * @param sortConfs 字段名、多列排序 * @param order 排序方式 */ sort(field: string, order?: VxeTablePropTypes.SortOrder): Promise<void> sort(sortConfs: VxeTableDefines.SortConfs, order?: VxeTablePropTypes.SortOrder): Promise<void> sort(sortConfs: VxeTableDefines.SortConfs[], order?: VxeTablePropTypes.SortOrder): Promise<void> /** * 手动清空排序条件,数据会恢复成未排序的状态 * @param columnOrField 列对象或字段名 */ clearSort(fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any> | null): Promise<void> /** * 判断指定列是否为排序状态,如果为空则判断所有列 * @param columnOrField 列对象或字段名 */ isSort(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): boolean /** * 获取当前排序的列信息 */ getSortColumns(): VxeTableDefines.SortCheckedParams[] /** * 手动关闭筛选面板 */ closeFilter(): Promise<any> /** * 已废弃,请使用 isActiveFilterByColumn * @deprecated */ isFilter(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): boolean /** * 判断指定列是否为筛选状态,如果为空则判断所有列 * @param columnOrField 列对象或字段名 */ isActiveFilterByColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): boolean /** * 用于 expand-config.lazy,用于懒加载展开行,判断展开行是否懒加载完成 * @param row 指定行 */ isRowExpandLoaded(row: any): boolean /** * 用于 expand-config.lazy,手动清空懒加载展开行的状态,数据会恢复成未展开的状态,当再次展开时会重新加载 */ clearRowExpandLoaded(row: any): Promise<void> /** * 重新懒加载展开行,并展开内容 * @param row 指定行 */ reloadRowExpand(row: any): Promise<void> /** * @deprecated 已废弃,请使用 reloadRowExpand */ reloadExpandContent(row: any): Promise<void> /** * 用于 type=expand,切换展开行的状态 * @param row 指定行 */ toggleRowExpand(row: any): Promise<void> /** * 用于 expand-config,设置所有行的展开与否 * 如果是关闭所有行,可以使用 clearRowExpand 快速清除 * @param checked 是否选中 */ setAllRowExpand(checked: boolean): Promise<void> /** * 用于 expand-config,设置展开行,二个参数设置这一行展开与否 * @param rows 指定行 * @param checked 是否选中 */ setRowExpand(rows: any | any[], checked: boolean): Promise<void> /** * 用于 expand-config,判断行是否为展开状态 * @param row 指定行 */ isRowExpandByRow(row: any): boolean /** * @deprecated 已废弃,请使用 isRowExpandByRow */ isExpandByRow(row: any): boolean /** * 用于 type=expand,手动清空展开行状态,数据会恢复成未展开的状态 */ clearRowExpand(): Promise<void> /** * 用于 type=expand,手动清空用户保留行的展开状态 */ clearRowExpandReserve(): Promise<void> /** * 用于 expand-config,用于展开行,获取已展开的行数据 */ getRowExpandRecords(): DT[] /** * 用于 tree-config,用于树表格,获取已展开的节点 * 注意,即使父节点被收起,只要该节点还处于展开状态都能获取到 */ getTreeExpandRecords(): DT[] /** * 用于 tree-config.lazy,用于懒加载树表格,判断树节点是否懒加载完成 */ isTreeExpandLoaded(row: any): boolean /** * 用于 tree-config.lazy,手动清空懒加载树节点的状态,数据会恢复成未展开的状态,当再次展开时会重新加载 */ clearTreeExpandLoaded(row: any): Promise<any> /** * 重新懒加载树节点,并展开该节点 * @param rows 指定行 */ reloadTreeExpand(row: any): Promise<any> /** * @deprecated 已废弃,请使用 reloadTreeExpand */ reloadTreeChilds(row: any): Promise<any> /** * 用于 tree-config,切换展开树形节点的状态 * @param row 指定行 */ toggleTreeExpand(row: any): Promise<any> /** * 用于 tree-config,设置所有树节点的展开与否 * 如果是关闭所有树节点,可以使用 clearTreeExpand 快速清除 * @param checked 是否选中 */ setAllTreeExpand(checked: boolean): Promise<void> /** * 用于 tree-config,设置展开树形节点,二个参数设置这一行展开与否 * @param rows 指定行 * @param checked 是否选中 */ setTreeExpand(rows: any | any[], checked: boolean): Promise<void> /** * 用于 tree-config,判断行是否为树形节点展开状态 * @param row 指定行 */ isTreeExpandByRow(row: any): boolean /** * 用于 tree-config,手动清空树形节点的展开状态,数据会恢复成未展开的状态 */ clearTreeExpand(): Promise<void> /** * 用于 tree-config.reserve,手动清空用户保留树节点的展开状态 */ clearTreeExpandReserve(): Promise<void> /** * 获取表格的滚动状态 */ getScroll(): { virtualX: boolean virtualY: boolean scrollTop: number scrollLeft: number } /** * 如果有滚动条,则滚动到对应的位置 * @param scrollLeft 左边距离 * @param scrollTop 顶部距离 */ scrollTo(scrollLeft: number | null, scrollTop?: number | null): Promise<void> /** * 如果有滚动条,则滚动到对应的行 * @param row 指定行 * @param columnOrField 列对象或字段名 */ scrollToRow(row: any, fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): Promise<any> /** * 如果有滚动条,则滚动到对应的列 * @param columnOrField 列对象或字段名 */ scrollToColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo<any>): Promise<any> /** * 手动清除滚动相关信息,还原到初始状态 */ clearScroll(): Promise<any> /** * 手动更新表尾 */ updateFooter(): Promise<any> /** * 更新单元格状态 * @param params 插槽对象 */ updateStatus( params: { row: DT column: VxeTableDefines.ColumnInfo<DT> }, cellValue?: any ): Promise<any> /** * 取消单元格的临时合并状态,如果为数组,则取消多个合并 */ removeMergeCells(merges: VxeTableDefines.MergeOptions<any> | VxeTableDefines.MergeOptions<any>[]): Promise<VxeTableDefines.MergeInfo[]> /** * 取消表尾的临时合并状态,如果为数组,则取消多个合并 */ removeMergeFooterItems(merges: VxeTableDefines.MergeOptions<any> | VxeTableDefines.MergeOptions<any>[]): Promise<VxeTableDefines.MergeInfo[]> /** * 临时合并单元格,如果为数组则合并多个 */ setMergeCells(merges: VxeTableDefines.MergeOptions<any> | VxeTableDefines.MergeOptions<any>[]): Promise<any> /** * 临时合并表尾,如果为数组则合并多个 */ setMergeFooterItems(merges: VxeTableDefines.MergeOptions<any> | VxeTableDefines.MergeOptions<any>[]): Promise<any> /** * 用于 mouse-config.area,更新已选区域的单元格样式 */ updateCellAreas(): Promise<void> /** * 连接工具栏 * @param toolbar 工具栏组件实例 */ connect(toolbar: VxeToolbarConstructor | VxeToolbarInstance): Promise<void> /** * 使表格获取焦点 */ focus(): Promise<void> /** * 使表格失去焦点 */ blur(): Promise<void> } export interface VxeTableMethods<D = VxeTableDataRow> extends TableMethods<D> { } export interface TablePrivateMethods<D = VxeTableDataRow> { getSetupOptions(): Required<VXETableConfigOptions> updateAfterDataIndex(): void callSlot<T>(slotFunc: ((params: T) => SlotVNodeType | SlotVNodeType[]) | string | null, params: T): SlotVNodeType[] getParentElem(): Element | null getParentHeight(): number getExcludeHeight(): number defineField(records: any[]): any[] handleTableData(force?: boolean): Promise<any> cacheRowMap(isSource?: boolean): void cacheSourceMap(fullData: any[]): void saveCustomResizable(isReset?: boolean): void saveCustomVisible(): void saveCustomFixed(): void analyColumnWidth(): void checkSelectionStatus(): void handleSelectRow(params: any, value: any, isForce?: boolean): void handleCustom(): Promise<void> handleUpdateDataQueue(): void handleRefreshColumnQueue(): void preventEvent(evnt: any, type: any, args?: any, next?: any, end?: any): any calcIndeterminateTem(treeData:VxeTableDataRow[]): void triggerHeaderTitleEvent(evnt: MouseEvent, iconParams: VxeColumnPropTypes.TitlePrefix | VxeColumnPropTypes.TitleSuffix, params: VxeTableDefines.CellRenderHeaderParams<any>): void triggerHeaderTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams<any>): void triggerBodyTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams<any>): void triggerFooterTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderFooterParams<any>): void handleTargetLeaveEvent(evnt: MouseEvent): void triggerHeaderCellClickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams<any>): void triggerHeaderCellDblclickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams<any>): void triggerCellClickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams<any>): void triggerCellDblclickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams<any>): void handleToggleCheckRowEvent(evnt: Event | null, params: { row: any }): void triggerCheckRowEvent(evnt: Event, params: { row: any }, value: boolean): void triggerCheckAllEvent(evnt: MouseEvent | null, value: boolean): void triggerRadioRowEvent(evnt: Event, params: { row: any }): void triggerCurrentRowEvent(evnt: Event, params: { $table: VxeTableConstructor<any> & VxeTablePrivateMethods<any> row: any rowIndex: number $rowIndex: number }): void triggerRowExpandEvent(evnt: Event, params: VxeTableDefines.CellRenderBodyParams<any>): void triggerTreeExpandEvent(evnt: Event, params: VxeTableDefines.CellRenderBodyParams<any>): void triggerSortEvent(evnt: Event, column: VxeTableDefines.ColumnInfo<any>, order: VxeTablePropTypes.SortOrder): void triggerScrollXEvent(evnt: Event): void triggerScrollYEvent(evnt: Event): void scrollToTreeRow(row: any): Promise<any> updateScrollYStatus(fullData?: any[]): boolean updateScrollXSpace(): void updateScrollYSpace(): void updateScrollXData(): void updateScrollYData(): void checkScrolling(): void updateZindex(): void handleCheckedCheckboxRow(rows: any, value: boolean, isForce?: boolean): Promise<any> triggerHoverEvent(evnt: any, params: any): void setHoverRow(row: any): void clearHoverRow(): void getCell(row: any, column: VxeTableDefines.ColumnInfo<any>): HTMLTableDataCellElement | null getCellLabel(row: any, column: VxeTableDefines.ColumnInfo<any>): any findRowIndexOf(list: any[], row: any): number eqRow(row1: any, row2: any): boolean } export interface VxeTablePrivateMethods<D = VxeTableDataRow> extends TablePrivateMethods<D> { } export interface TableReactData<D = VxeTableDataRow> { // 低性能的静态列 staticColumns: any[] // 渲染的列分组 tableGroupColumn: any[] // 可视区渲染的列 tableColumn: any[] // 渲染中的数据 tableData: D[] // 是否启用了横向 X 可视渲染方式加载 scrollXLoad: boolean // 是否启用了纵向 Y 可视渲染方式加载 scrollYLoad: boolean // 是否存在纵向滚动条 overflowY: boolean // 是否存在横向滚动条 overflowX: boolean // 纵向滚动条的宽度 scrollbarWidth: number // 横向滚动条的高度 scrollbarHeight: number // 最后滚动时间戳 lastScrollTime: number // 行高 rowHeight: number // 表格父容器的高度 parentHeight: number // 是否使用分组表头 isGroup: boolean isAllOverflow: boolean // 复选框属性,是否全选 isAllSelected: boolean // 复选框属性,有选中且非全选状态 isIndeterminate: boolean // 复选框属性,已选中的行集合 selectCheckboxMaps: Record<string, D> // 当前行 currentRow: D | null // 单选框属性,选中列 currentColumn: any // 单选框属性,选中行 selectRadioRow: D | null // 表尾合计数据 footerTableData: any[][] // 展开列信息 expandColumn: any hasFixedColumn: boolean // 已展开的行 rowExpandedMaps: Record<string, D | null> // 懒加载中的展开行 rowExpandLazyLoadedMaps: Record<string, D | null> // 树节点列信息 treeNodeColumn: any // 已展开树节点 treeExpandedMaps: Record<string, D | null> // 懒加载中的树节点的集合 treeExpandLazyLoadedMaps: Record<string, D | null> // 树节点不确定状态的集合 treeIndeterminateMaps: Record<string, D | null> // 合并单元格的对象集 mergeList: VxeTableDefines.MergeItem<D>[] // 合并表尾数据的对象集 mergeFooterList: VxeTableDefines.MergeItem<D>[] // 刷新列标识,当列筛选被改变时,触发表格刷新数据 upDataFlag: number // 刷新列标识,当列的特定属性被改变时,触发表格刷新列 reColumnFlag: number // 已标记的对象集 pendingRowMaps: Record<string, D | null> // 已标记的行 pendingRowList: any[], // 初始化标识 initStore: { filter: boolean import: boolean export: boolean }, // 当前选中的筛选列 filterStore: { isAllSelected: boolean isIndeterminate: boolean style: any options: any[] column: any multiple: boolean visible: boolean maxHeight: number | null [key: string]: any }, // 存放列相关的信息 columnStore: { leftList: VxeTableDefines.ColumnInfo<D>[] centerList: VxeTableDefines.ColumnInfo<D>[] rightList: VxeTableDefines.ColumnInfo<D>[] resizeList: VxeTableDefines.ColumnInfo<D>[] pxList: VxeTableDefines.ColumnInfo<D>[] pxMinList: VxeTableDefines.ColumnInfo<D>[] scaleList: VxeTableDefines.ColumnInfo<D>[] scaleMinList: VxeTableDefines.ColumnInfo<D>[] autoList: VxeTableDefines.ColumnInfo<D>[] }, // 存放快捷菜单的信息 ctxMenuStore: { selected: any visible: boolean showChild: boolean selectChild: any list: any[][] style: any [key: string]: any }, // 存放可编辑相关信息 editStore: { indexs: { columns: any[] }, titles: { columns: any[] }, // 选中源 selected: { row: D | null column: any [key: string]: any }, // 已复制源 copyed: { cut: boolean rows: D[] columns: any[] [key: string]: any }, // 激活 actived: { row: D | null column: any [key: string]: any }, insertMaps: { [key: string]: any } removeMaps: { [key: string]: any } }, // 存放 tooltip 相关信息 tooltipStore: { row: D | null column: any content: any visible: boolean, currOpts: any } // 存放数据校验相关信息 validStore: { visible: boolean }, validErrorMaps: { [key: string]: { row: D | null column: any rule: any content: any } }, // 导入相关信息 importStore: { inited: boolean file: any type: any modeList: any[] typeList: any[] filename: any visible: boolean }, importParams: { mode: any types: any message: boolean }, // 导出相关信息 exportStore: { inited: boolean name: any modeList: any[] typeList: any[] columns: any[] isPrint: boolean hasFooter: boolean hasMerge: boolean hasTree: boolean hasColgroup: boolean visible: boolean }, exportParams: { filename: any sheetName: any mode: any type: any isColgroup: boolean isMerge: boolean isAllExpand: boolean useStyle: boolean original: boolean message: boolean isHeader: boolean isFooter: boolean }, scrollVMLoading: boolean _isResize: boolean } export interface TableInternalData<D = VxeTableDataRow> { tZindex: number elemStore: { [key: string]: Ref<HTMLElement> | null } // 存放横向 X 虚拟滚动相关的信息 scrollXStore: { offsetSize: number visibleSize: number startIndex: number endIndex: number } // 存放纵向 Y 虚拟滚动相关信息 scrollYStore: { adaptive?: boolean rowHeight: number offsetSize: number visibleSize: number startIndex: number endIndex: number } // 表格宽度 tableWidth: number // 表格高度 tableHeight: number // 表头高度 headerHeight: number // 表尾高度 footerHeight: number customHeight: number customMinHeight: number customMaxHeight: number // 当前 hover 行 hoverRow: any // 最后滚动位置 lastScrollLeft: number lastScrollTop: number // 单选框属性,已选中保留的行 radioReserveRow: any // 复选框属性,已选中保留的行 checkboxReserveRowMap: any // 行数据,已展开保留的行集合 rowExpandedReserveRowMap: Record<string, D> // 树结构数据,已展开保留的行集合 treeExpandedReserveRowMap: Record<string, D> // 树结构数据,不确定状态的集合 treeIndeterminateRowMaps: Record<string, D> // 列表完整数据、条件处理后 tableFullData: D[] afterFullData: D[] afterTreeFullData: D[] // 列表条件处理后数据集合 afterFullRowMaps: Record<string, D> tableSynchData: D[] tableSourceData: D[] // 树的全量数据、条件处理后 tableFullTreeData: D[] // 收集的列配置(带分组) collectColumn: VxeTableDefines.ColumnInfo<D>[], // 完整所有列(不带分组) tableFullColumn: VxeTableDefines.ColumnInfo<D>[] // 渲染所有列 visibleColumn: VxeTableDefines.ColumnInfo<D>[] // 缓存数据集 fullAllDataRowIdData: { [key: string]: { row: D rowid: string seq: string | number index: number $index: number _index: number items: any[] parent: any level: number treeLoaded?: boolean expandLoaded?: boolean formatData?: { [key: string]: { value: any label: any } } } } sourceDataRowIdData: Record<string, D> fullDataRowIdData: { [key: string]: { row: D rowid: string seq: string | number index: number $index: number _index: number items: any[] parent: any level: number } } fullColumnIdData: { [key: string]: { column: VxeTableDefines.ColumnInfo<D> colid: string index: number $index: number _index: number items: VxeTableDefines.ColumnInfo<D>[] parent: VxeTableDefines.ColumnInfo<D> } } fullColumnFieldData: { [key: string]: { column: VxeTableDefines.ColumnInfo<D> colid: string index: number items: VxeTableDefines.ColumnInfo<D>[] parent: VxeTableDefines.ColumnInfo<D> } } // 特殊标识 inited: boolean tooltipTimeout: any initStatus: boolean isActivated: boolean // 内部属性 _lastResizeTime?: any _keyCtx?: any _lastCallTime?: any _importResolve?: ((...args: any[]) => any) | null _importReject?: ((...args: any[]) => any) | null _currFilterParams?: any _currMenuParams?: any } export namespace VxeTablePropTypes { export type Size = SizeType export type ID = string export type Data<T = any> = T[] export type Height = number | string export type MinHeight = number | string export type MaxHeight = number | string export type Resizable = boolean export type Stripe = boolean export type Round = boolean export type Border = boolean | 'default' | 'full' | 'outer' | 'inner' | 'none' | '' export type Loading = boolean export type Align = 'left' | 'center' | 'right' | '' | null export type HeaderAlign = Align export type FooterAlign = Align export type ShowHeader = boolean export type HighlightCurrentRow = boolean export type HighlightHoverRow = boolean export type HighlightCurrentColumn = boolean export type HighlightHoverColumn = boolean export type HighlightCell = boolean export type ShowFooter = boolean export type FooterMethod<D = VxeTableDataRow> = (params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $grid: VxeGridConstructor<D> | null | undefined columns: VxeTableDefines.ColumnInfo<D>[] data: D[] }) => Array<string | number | null>[] export type RowClassName<D = VxeTableDataRow> = string | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> row: D rowIndex: number $rowIndex: number _rowIndex: number }) => void | null | string | { [key: string]: boolean }) export type CellClassName<D = VxeTableDataRow> = string | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> row: D rowIndex: number $rowIndex: number _rowIndex: number column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number _columnIndex: number }) => void | null | string | { [key: string]: boolean }) export type HeaderRowClassName<D = VxeTableDataRow> = string | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $rowIndex: number fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | string | { [key: string]: boolean }) export type HeaderCellClassName<D = VxeTableDataRow> = string | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $rowIndex: number column: VxeTableDefines.ColumnInfo<D> fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | string | { [key: string]: boolean }) export type FooterRowClassName<D = VxeTableDataRow> = string | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $rowIndex: number _rowIndex: number fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | string | { [key: string]: boolean }) export type FooterCellClassName<D = VxeTableDataRow> = string | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $rowIndex: number _rowIndex: number column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number _columnIndex: number }) => void | null | string | { [key: string]: boolean }) export type CellStyle<D = VxeTableDataRow> = VNodeStyle | ((params: { row: D rowIndex: number $rowIndex: number _rowIndex: number column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number _columnIndex: number }) => void | null | VNodeStyle) export type HeaderCellStyle<D = VxeTableDataRow> = VNodeStyle | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $rowIndex: number column: VxeTableDefines.ColumnInfo<D> columnIndex: number _columnIndex: number }) => void | null | VNodeStyle) export type FooterCellStyle<D = VxeTableDataRow> = VNodeStyle | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $rowIndex: number column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number _columnIndex: number }) => void | null | VNodeStyle) export type RowStyle<D = VxeTableDataRow> = VNodeStyle | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> row: D rowIndex: number $rowIndex: number _rowIndex: number }) => void | null | VNodeStyle) export type HeaderRowStyle<D = VxeTableDataRow> = VNodeStyle | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $rowIndex: number fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | VNodeStyle) export type FooterRowStyle<D = VxeTableDataRow> = VNodeStyle | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> $rowIndex: number _rowIndex: number fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | VNodeStyle) export type MergeCell<D = VxeTableDataRow> = VxeTableDefines.MergeOptions<D> export type MergeCells<D = VxeTableDataRow> = MergeCell<D>[] export type MergeFooterItem<D = VxeTableDataRow> = VxeTableDefines.MergeOptions<D> export type MergeFooterItems<D = VxeTableDataRow> = MergeFooterItem<D>[] export type SpanMethod<D = VxeTableDataRow> = (params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number row: D rowIndex: number $rowIndex: number _rowIndex: number isHidden: boolean fixed: VxeColumnPropTypes.Fixed type: string visibleData: D[] }) => void | { rowspan: number, colspan: number } export type FooterSpanMethod<D = VxeTableDataRow> = (params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> column: VxeTableDefines.ColumnInfo<D> columnIndex: number _columnIndex: number $columnIndex: number $rowIndex: number _rowIndex: number items: any[] data: D[][] }) => void | { rowspan: number, colspan: number } export type ShowOverflow = boolean | 'ellipsis' | 'title' | 'tooltip' | '' | null export type ShowHeaderOverflow = ShowOverflow export type ShowFooterOverflow = ShowOverflow export type ColumnKey = boolean export type RowKey = boolean export type RowId = string export type KeepSource = boolean export type AutoResize = boolean export type SyncResize = boolean | string | number /** * 响应式布局配置项 */ export interface ResizeConfig { refreshDelay?: number } export interface ResizeOpts extends ResizeConfig { } /** * 列配置信息 */ export interface ColumnConfig { /** * 是否需要为每一列的 VNode 设置 key 属性 */ useKey?: boolean /** * 当鼠标点击列头时,是否要高亮当前列 */ isCurrent?: boolean /** * 当鼠标移到列头时,是否要高亮当前头 */ isHover?: boolean /** * 每一列是否启用列宽调整 */ resizable?: VxeColumnPropTypes.Resizable /** * 每一列的宽度 */ width?: VxeColumnPropTypes.Width /** * 每一列的最小宽度 */ minWidth?: VxeColumnPropTypes.MinWidth /** * 每一列的最大宽度 */ maxWidth?: VxeColumnPropTypes.MaxWidth /** * 固定列允许设置的最大数量(如果是分组,则一个分组算一个) */ maxFixedSize?: number /** * 每一列的自定义表头单元格数据导出方法,返回自定义的标题 */ headerExportMethod?: VxeColumnPropTypes.HeaderExportMethod<any> /** * 每一列的自定义单元格数据导出方法,返回自定义的值 */ exportMethod?: VxeColumnPropTypes.ExportMethod<any> /** * 每一列的自定义表尾单元格数据导出方法,返回自定义的值 */ footerExportMethod?: VxeColumnPropTypes.FooterExportMethod<any> } export interface ColumnOpts extends ColumnConfig { } /** * 行配置信息 */ export interface RowConfig { /** * 是否需要为每一行的 VNode 设置 key 属性 */ useKey?: boolean /** * 自定义行数据唯一主键的字段名(默认自动生成) */ keyField?: string /** * 当鼠标点击行时,是否要高亮当前行 */ isCurrent?: boolean /** * 当鼠标移到行时,是否要高亮当前行 */ isHover?: boolean /** * 每一行开启调整行高度 */ resizable?: boolean /** * 只对 show-overflow 有效,每一行的高度 */ height?: number } export interface RowOpts extends RowConfig { } /** * 自定义列配置项 */ export interface CustomConfig<D = VxeTableDataRow> { /** * 是否启用 localStorage 本地保存,会将列操作状态保留在本地(需要有 id) */ storage?: boolean | { visible?: boolean resizable?: boolean fixed?: boolean order?: boolean } /** * 自定义列是否允许列选中的方法,该方法的返回值用来决定这一列的 checkbox 是否可以选中 */ checkMethod?(params: { column: VxeTableDefines.ColumnInfo<D> }): boolean } export interface CustomOpts<D = VxeTableDataRow> extends CustomConfig<D> { } /** * 列调整配置项 */ export interface ResizableConfig<D = VxeTableDataRow> { /** * 列宽拖动的最小宽度 */ minWidth?: number | string | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number $rowIndex: number cell: HTMLElement }) => number | string) /** * 列宽拖动的最大宽度 */ maxWidth?: number | string | ((params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number $rowIndex: number cell: HTMLElement }) => number | string) } export interface ResizableOpts<D = VxeTableDataRow> extends ResizableConfig<D> { } /** * 序号配置项 */ export interface SeqConfig<D = VxeTableDataRow> { startIndex?: number seqMethod?(params: { column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number row: D rowIndex: number $rowIndex: number }): number | string } export interface SeqOpts<D = VxeTableDataRow> extends SeqConfig<D> { } interface SortConfigDefaultSort { field: string order: SortOrder } /** * 排序配置项 */ export interface SortConfig<D = VxeTableDataRow> { defaultSort?: SortConfigDefaultSort | SortConfigDefaultSort[] orders?: SortOrder[] sortMethod?(params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> data: D[] sortList: VxeTableDefines.SortCheckedParams[] }): any[] remote?: boolean multiple?: boolean chronological?: boolean trigger?: 'default' | 'cell' showIcon?: boolean iconLayout?: 'horizontal' | 'vertical' iconAsc?: string iconDesc?: string } export type SortOrder = 'asc' | 'desc' | '' | null export interface SortOpts<D = VxeTableDataRow> extends SortConfig<D> { orders: SortOrder[] } /** * 筛选配置项 */ export interface FilterConfig<D = VxeTableDataRow> { filterMethod?:(params: { options: VxeTableDefines.FilterOption[] values: any[] cellValue: any row: D column: VxeTableDefines.ColumnInfo<D> }) => any remote?: boolean showIcon?: boolean iconNone?: string iconMatch?: string confirmButtonText?: string resetButtonText?: string } export interface FilterOpts<D = VxeTableDataRow> extends FilterConfig<D> { } /** * 单选框配置 */ export interface RadioConfig<D = VxeTableDataRow> { reserve?: boolean labelField?: string checkRowKey?: string | number checkMethod?(params: { row: D }): boolean visibleMethod?(params: { row: D }): boolean trigger?: 'default' | 'cell' | 'row' | '' | null highlight?: boolean strict?: boolean } export interface RadioOpts<D = VxeTableDataRow> extends RadioConfig<D> { } /** * 复选框配置项 */ export interface CheckboxConfig<D = VxeTableDataRow> { reserve?: boolean labelField?: string checkField?: string indeterminateField?: string showHeader?: boolean checkAll?: boolean checkRowKeys?: string[] | number[] checkStrictly?: boolean strict?: boolean isShiftKey?: boolean checkMethod?(params: { row: D }): boolean visibleMethod?(params: { row: D }): boolean trigger?: 'default' | 'cell' | 'row' | '' | null highlight?: boolean range?: boolean /** * 请使用 indeterminateField * @deprecated */ halfField?: string } export interface CheckboxOpts<D = VxeTableDataRow> extends CheckboxConfig<D> { } /** * 提示信息配置项 */ export interface TooltipConfig<D = VxeTableDataRow> { showAll?: boolean theme?: 'dark' | 'light' | '' | null enterable?: boolean enterDelay?: number leaveDelay?: number contentMethod?(params: { items: any[] row: D rowIndex: number $rowIndex: number _rowIndex: number column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number _columnIndex: number type: 'header' | 'body' | 'footer' | '' | null cell: HTMLElement $event: any }): string | null | void } export interface TooltipOpts<D = VxeTableDataRow> extends TooltipConfig<D> { } /** * 展开行配置项 */ export interface ExpandConfig<D = VxeTableDataRow> { labelField?: string expandAll?: boolean expandRowKeys?: string[] | number[] accordion?: boolean trigger?: 'default' | 'cell' | 'row' | '' | null lazy?: boolean reserve?: boolean height?: number loadMethod?(params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> row: D rowIndex: number $rowIndex: number }): Promise<void> toggleMethod?(params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> expanded: boolean row: D rowIndex: number $rowIndex: number column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number }): boolean visibleMethod?(params: VxeTableDefines.CellRenderBodyParams<D>): boolean showIcon?: boolean iconOpen?: string iconClose?: string iconLoaded?: string } export interface ExpandOpts<D = VxeTableDataRow> extends ExpandConfig<D> { } /** * 树形结构配置项 */ export interface TreeConfig<D = VxeTableDataRow> { /** * 自动将列表转为树结构 */ transform?: boolean /** * 用于 tree-config.transform,树节点的字段名 */ rowField?: string /** * 用于 tree-config.transform,树父节点的字段名 */ parentField?: string /** * 树子节点的字段名 */ childrenField?: string /** * 用于 tree-config.transform,树子节点映射的字段名 */ mapChildrenField?: string /** * 树节点的缩进 */ indent?: number /** * 树节点的连接线(启用连接线会降低渲染性能) */ showLine?: boolean /** * 默认展开所有子孙树节点(只会在初始化时被触发一次) */ expandAll?: boolean /** * 默认展开指定树节点(只会在初始化时被触发一次,需要有 row-config.keyField) */ expandRowKeys?: string[] | number[] /** * 对于同一级的节点,每次只能展开一个 */ accordion?: boolean /** * 触发方式(注:当多种功能重叠时,会同时触发) */ trigger?: 'default' | 'cell' | 'row' | '' | null /** * 是否使用懒加载(启用后只有指定 hasChildField 字段的节点才允许被点击) */ lazy?: boolean /** * 只对 lazy 启用后有效,标识是否存在子节点,从而控制是否允许被点击 */ hasChildField?: string /** * 是否保留展开状态,对于某些场景可能会用到,比如数据被刷新之后还保留之前展开的状态(需要有 row-config.keyField) */ reserve?: boolean /** * 该方法用于异步加载子节点 */ loadMethod?(params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> row: D }): Promise<any[]> /** * 该方法在展开或关闭触发之前调用,可以通过返回值来决定是否允许继续执行 */ toggleMethod?(params: { $table: VxeTableConstructor<D> & VxeTablePrivateMethods<D> expanded: boolean row: D column: VxeTableDefines.ColumnInfo<D> columnIndex: number $columnIndex: number }): boolean /** * 是否显示图标按钮 */ showIcon?: boolean /** * 自定义展开后显示的图标 */ iconOpen?: string /** * 自定义收起后显示的图标 */ iconClose?: string /** * 自定义懒加载中显示的图标 */ iconLoaded?: string /** * 已废弃,请使用 showLine * @deprecated */ line?: boolean /** * 已废弃,请使用 hasChildField * @deprecated */ hasChild?: string /** * 已废弃,请使用 childrenField * @deprecated */ children?: string } export type TreeOpts<D = VxeTableDataRow> = Required<TreeConfig<D>> /** * 快捷菜单配置项 */ export interface MenuConfig<D = VxeTableDataRow> { /** * 是否启用 */ enabled?: boolean /** * 表头的右键菜单 */ header?: VxeTableDefines.MenuOptions /** * 内容的右键菜单 */ body?: VxeTableDefines.MenuOptions /** * 表尾的右键菜单 */ footer?: VxeTableDefines.MenuOptions /** * 触发方式 * default(默认右键表格触发), cell(右键单元格触发) */ trigger?: 'default' | 'cell' | '' | null /** * 菜单面板的 className */ className?: string /** * 该函数的返回值用来决定是否允许显示右键菜单(对于需要对菜单进行权限控制时可能会用到) */ visibleMethod?(params: { type: string options: VxeTableDefines.MenuFirstOption[][] columns: VxeTableDefines.ColumnInfo<D>[] row?: D rowIndex?: number column?: VxeTableDefines.ColumnInfo<D> columnIndex?: number