ivue-material-plus/dist/unplugin-vue-components/lib/components/ivue-table/table/defaults.d.ts

A high quality UI components Library with Vue.js

import type { ComponentInternalInstance, VNode, Ref, PropType, CSSProperties, InjectionKey } from 'vue';
import type { TableColumnCtx } from '../table-column/defaults';
import type { Store } from '../store/index';
import type TableLayout from '../table-layout';
declare type HoverState = NonNullable<{
    cell: HTMLElement;
    column: TableColumnCtx;
    row: TableColumnCtx;
}>;
declare type RenderExpanded = ({ row, $index, store, expanded }: Column) => VNode;
declare type Column = {
    row: TableColumnCtx;
    $index: number;
    store: Store;
    expanded: boolean;
};
declare type ColumnCls = string | ((data: {
    row: TableColumnCtx;
    rowIndex: number;
}) => string);
declare type ColumnStyle = CSSProperties | ((data: {
    row: TableColumnCtx;
    rowIndex: number;
}) => CSSProperties);
declare type SummaryMethod = (data: {
    columns: TableColumnCtx[];
    data: any[];
}) => string[];
declare type Layout = 'fixed' | 'auto';
declare type CellStyle = CSSProperties | ((data: {
    row: TableColumnCtx;
    rowIndex: number;
    column: TableColumnCtx;
    columnIndex: number;
}) => CSSProperties);
declare type CellCls = string | ((data: {
    row: TableColumnCtx;
    rowIndex: number;
    column: TableColumnCtx;
    columnIndex: number;
}) => string);
interface TableRefs {
    tableWrapper?: HTMLElement;
    headerWrapper?: HTMLElement;
    footerWrapper?: HTMLElement;
    fixedBodyWrapper?: HTMLElement;
    rightFixedBodyWrapper?: HTMLElement;
    bodyWrapper?: HTMLElement;
    [key: string]: any;
}
interface TreeNode {
    expanded?: boolean;
    loading?: boolean;
    noLazyChildren?: boolean;
    indent?: number;
    level?: number;
    display?: boolean;
}
interface RenderRowData {
    treeNode?: TreeNode;
    store: Store;
    _self: Table;
    expanded: boolean;
    column: TableColumnCtx;
    row: TableColumnCtx;
    $index: number;
    cellIndex: number;
}
interface TableState {
    isGroup: Ref<boolean>;
    resizeState: Ref<{
        width: null | number;
        height: null | number;
    }>;
    updateLayout: () => void;
    debouncedUpdateLayout: () => void;
}
interface Filter {
    column: TableColumnCtx;
    values: string[];
    silent: boolean;
}
interface Sort {
    prop: string;
    order: 'ascending' | 'descending';
    init?: boolean;
    silent?: boolean;
}
interface Table extends ComponentInternalInstance {
    $ready?: boolean;
    hoverState?: HoverState | null;
    renderExpanded?: RenderExpanded;
    store?: Store;
    layout?: TableLayout;
    refs: TableRefs;
    tableId?: string;
    columnId?: string;
    state?: TableState;
}
interface TableProps {
    data: any[];
    fit?: boolean;
    border: boolean;
    maxHeight: string | number;
    showHeader?: boolean;
    treeProps?: {
        hasChildren?: string;
        children?: string;
    };
    rowKey?: string | ((row: TableColumnCtx) => string);
    defaultExpandAll?: boolean;
    selectOnIndeterminate?: boolean;
    lazy?: boolean;
    showSummary?: boolean;
    tableLayout: Layout;
    height?: string | number;
    defaultSort?: Sort;
    context?: Table;
    stripe?: boolean;
    rowClassName?: ColumnCls;
    rowStyle?: ColumnStyle;
    highlightCurrentRow?: boolean;
    expandRowKeys?: any[];
    load?: (row: TableColumnCtx, treeNode: TreeNode, resolve: (data: any[]) => void) => void;
    sumText?: string;
    summaryMethod?: SummaryMethod;
    spanMethod?: (data: {
        row: TableColumnCtx;
        rowIndex: number;
        column: TableColumnCtx;
        columnIndex: number;
    }) => number[] | {
        rowspan: number;
        colspan: number;
    } | undefined;
    headerCellStyle?: CellStyle;
    headerCellClassName?: CellCls;
    headerRowStyle?: ColumnStyle;
    headerRowClassName?: ColumnCls;
    cellStyle?: CellStyle;
    cellClassName?: CellCls;
    tooltipTheme?: 'dark' | 'light';
    tooltipStop?: boolean;
}
declare type rowClass = string | ((data: {
    row: TableColumnCtx;
    rowIndex: number;
}) => string);
declare type rowStyle = CSSProperties | ((data: {
    row: TableColumnCtx;
    rowIndex: number;
}) => CSSProperties);
export declare const TableContextKey: InjectionKey<Table>;
declare const _default: {
    /**
     * 显示的数据
     *
     * @type {Array}
     */
    data: {
        type: PropType<TableColumnCtx[]>;
        default: () => any[];
    };
    /**
     * 列的宽度是否自撑开
     *
     * @type {Boolean}
     */
    fit: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 是否带有纵向边框
     *
     * @type {Boolean}
     */
    border: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Table 的高度， 默认为自动高度。
     * 如果 height 为 number 类型，单位 px；
     * 如果 height 为 string 类型，
     * 则这个高度会设置为 Table 的 style.height 的值，
     * Table 的高度会受控于外部样式。
     *
     * @type {String | Number}
     */
    height: {
        type: (NumberConstructor | StringConstructor)[];
        default: any;
    };
    /**
     * Table 的最大高度。 合法的值为数字或者单位为 px 的高度。
     *
     * @type {String, Number}
     */
    maxHeight: {
        type: (NumberConstructor | StringConstructor)[];
        default: any;
    };
    /**
     * 是否显示表头
     *
     * @type {Boolean}
     */
    showHeader: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 渲染嵌套数据的配置选项
     *
     * { hasChildren: 'hasChildren', children: 'children' }
     *
     * @type {Object}
     */
    treeProps: {
        type: PropType<{
            hasChildren?: string;
            children?: string;
        }>;
        default: () => {
            hasChildren: string;
            children: string;
        };
    };
    /**
     * 行数据的 Key
     *
     * @type {String, Function}
     */
    rowKey: {
        type: PropType<string | ((row: TableColumnCtx) => string)>;
    };
    /**
     * 是否默认展开所有行，当 Table 包含展开行存在或者为树形表格时有效
     *
     * @type {Boolean}
     */
    defaultExpandAll: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 在多选表格中，当仅有部分行被选中时，点击表头的多选框时的行为。
     * 若为 true，则选中所有行；若为 false，则取消选择所有行
     *
     * @type {Boolean}
     */
    selectOnIndeterminate: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * indent	展示树形数据时，树节点的缩进
     *
     * @type {Number}
     */
    indent: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * 是否懒加载子节点数据
     *
     * @type {Boolean}
     */
    lazy: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 是否在表尾显示合计行
     *
     * @type {Boolean}
     */
    showSummary: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 设置表格单元、行和列的布局方式
     *
     * fixed / auto
     *
     * @type {String}
     */
    tableLayout: {
        type: PropType<Layout>;
        validator(value: string): boolean;
        default: string;
    };
    /**
     * 默认的排序列的 prop 和顺序。
     * 它的 prop 属性指定默认的排序的列，order 指定默认排序的顺序
     *
     * @type {object}
     */
    defaultSort: {
        type: PropType<Sort>;
    };
    /**
     * 提示
     *
     * @type {String}
     */
    placeholder: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 滚动条总是显示
     *
     * @type {Boolean}
     */
    scrollbarAlways: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 是否为斑马纹 table
     *
     * @type {Boolean}
     */
    stripe: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 行的 className 的回调方法，也可以使用字符串为所有行设置一个固定的 className。
     *
     * @type {String | Function}
     */
    rowClassName: {
        type: PropType<ColumnCls>;
    };
    /**
     * 行的 style 的回调方法，也可以使用一个固定的 Object 为所有行设置一样的 Style。
     *
     * @type {Object, Function}
     */
    rowStyle: {
        type: PropType<ColumnStyle>;
    };
    /**
     * 是否要高亮当前行
     *
     * @type {Boolean}
     */
    highlightCurrentRow: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 可以通过该属性设置 Table 目前的展开行
     *
     * @type {Array}
     */
    expandRowKeys: {
        type: PropType<any[]>;
    };
    /**
     * 加载子节点数据的函数
     *
     * @type {Function}
     */
    load: {
        type: PropType<(row: TableColumnCtx, treeNode: TreeNode, resolve: (data: any[]) => void) => void>;
    };
    /**
     * 合计行第一列的文本
     *
     * @type {String}
     */
    sumText: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 自定义的合计计算方法
     *
     * @type {Function}
     */
    summaryMethod: {
        type: PropType<SummaryMethod>;
    };
    /**
     * 合并行或列的计算方法
     *
     * @type {Function}
     */
    spanMethod: {
        type: PropType<(data: {
            row: TableColumnCtx;
            rowIndex: number;
            column: TableColumnCtx;
            columnIndex: number;
        }) => number[] | {
            rowspan: number;
            colspan: number;
        }>;
    };
    /**
     * 表头单元格的 style 的回调方法，
     * 也可以使用一个固定的 Object 为所有表头单元格设置一样的 Style
     *
     * @type {Object, Function}
     */
    headerCellStyle: {
        type: PropType<CellStyle>;
    };
    /**
     * 表头单元格的 className 的回调方法，
     * 也可以使用字符串为所有表头单元格设置一个固定的 className
     *
     * @type {String, Function}
     */
    headerCellClassName: {
        type: PropType<CellCls>;
    };
    /**
     * 表头行的 style 的回调方法，
     * 也可以使用一个固定的 Object 为所有表头行设置一样的 Style
     *
     * @type {Object, Function}
     */
    headerRowStyle: {
        type: PropType<ColumnStyle>;
    };
    /**
     * 表头行的 className 的回调方法
     *
     * @type {String, Function}
     */
    headerRowClassName: {
        type: PropType<ColumnCls>;
    };
    /**
     * 单元格的 style 的回调方法
     *
     * @type {Object, Function}
     */
    cellStyle: {
        type: PropType<CellStyle>;
    };
    /**
     * 单元格的 className 的回调方法
     *
     * @type {String, Function}
     */
    cellClassName: {
        type: PropType<CellCls>;
    };
    /**
     * tooltip主题
     *
     * @type {String}
     */
    tooltipTheme: {
        type: PropType<"light" | "dark">;
        validator(value: string): boolean;
        default: string;
    };
    /**
     * tooltip点击是否阻止当前事件在捕获和冒泡阶段的进一步传播
     *
     * @type {String}
     */
    tooltipStop: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export default _default;
export type { Table, TableProps, TreeNode, RenderRowData, Sort, rowClass, rowStyle, ColumnCls, Filter, SummaryMethod, TableRefs, RenderExpanded, };