@farris/ui-vue/types/data-grid/src/data-grid.props.d.ts

Farris Vue, a Farris Design based Vue3 component library.

/**
 * Copyright (c) 2020 - present, Inspur Genersoft Co., Ltd.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *       http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
import { ExtractPropTypes, PropType, VNode } from 'vue';
import { EditorConfig } from '../../dynamic-form';
import { HeaderCell, VisualData, VisualDataCell } from '../../data-view';
import { DataGridColumnCommand, SortType } from './designer/data-grid-column.props';
export interface DataGridColumn {
    dataType: string;
    draggable?: boolean;
    editor?: EditorConfig;
    id?: string;
    parentId?: any;
    field: string;
    title: string;
    width?: number | string;
    /** 记录原始定义宽度 */
    actualWidth?: number;
    /** 标题对齐方式 */
    halign?: 'left' | 'center' | 'right';
    /** 文本对齐方式 */
    align?: 'left' | 'center' | 'right';
    /** 垂直对齐方式 */
    valign?: 'top' | 'middle' | 'bottom';
    left?: number;
    /** 是否固定 */
    fixed?: 'left' | 'right';
    /** 是否显示 */
    visible?: boolean | any;
    /** 只读 */
    readonly?: boolean | any;
    /** 鼠标移动至单元格后，显示悬浮消息 */
    showTips?: boolean;
    /** 单元格提示模式：
     *  allways： 鼠标滑过即显示
     *  auto: 单元格宽度不够时才会显示
     */
    tipMode?: 'allways' | 'auto';
    /** True to allow the column can be sorted. */
    sortable?: boolean;
    sort?: SortType;
    sortOrder?: number;
    sorter?: (preValue: any, postValue: any, sortType: SortType) => number;
    /** True to allow the column can be resized. */
    resizable?: boolean;
    rowspan?: number;
    /** 列合并 */
    colspan?: number;
    /** 列合并原始值  */
    origianlColSpan?: number;
    index?: number;
    /** 允许分组，默认为 true */
    allowGrouping?: boolean;
    /** 是否多语字段 */
    /** 操作列命令 */
    commands?: DataGridColumnCommand[];
    /** True to allow the column can be filtered. */
    filterable?: boolean;
    filter?: string;
    showSetting?: boolean;
    showEllipsis?: boolean;
    /** 列模板 */
    columnTemplate?: (cell: VisualDataCell, visualDataRow: VisualData) => VNode;
    /** inner boolean formatter */
    formatter?: ((cell: VisualDataCell, visualDataRow: VisualData) => VNode | string) | object;
    headerFormatter?: (context: {
        headerCell: HeaderCell;
        headerCells: HeaderCell[];
        columnIndex: number;
    }) => VNode | string;
}
export interface ColumnGroupItem {
    field: string;
    title?: string;
    group?: (ColumnGroupItem | string)[];
}
export type InteractiveMode = 'server' | 'client';
export declare const paginationOptions: {
    /** 启用分页 */
    enable: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 当前页码 */
    index: {
        type: NumberConstructor;
        default: number;
    };
    /** 分页交互模式 */
    mode: {
        type: PropType<InteractiveMode>;
        default: string;
    };
    /** 显示页码输入框 */
    showGoto: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 显示页码 */
    showIndex: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 显示每页记录数 */
    showLimits: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 显示分页汇总信息 */
    showPageInfo: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 默认每页记录数 */
    size: {
        type: NumberConstructor;
        default: number;
    };
    /** 可选择的没有记录数据 */
    sizeLimits: {
        type: {
            (arrayLength: number): number[];
            (...items: number[]): number[];
            new (arrayLength: number): number[];
            new (...items: number[]): number[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
            of<T_4>(...items: T_4[]): T_4[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        default: number[];
    };
    /** 总记录数 */
    total: {
        type: NumberConstructor;
        default: number;
    };
    /** 禁用分页 */
    disabled: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export type PaginatonOptions = ExtractPropTypes<typeof paginationOptions>;
export type DataGridSortOrder = 'asc' | 'desc';
export interface DataGridSortField {
    /** 排序字段名 */
    name: string;
    /** 排序方式 */
    order: DataGridSortOrder;
}
export declare const sortOptions: {
    /** 启用排序 */
    enable: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 排序字段集合 */
    fields: {
        type: {
            (arrayLength: number): DataGridSortField[];
            (...items: DataGridSortField[]): DataGridSortField[];
            new (arrayLength: number): DataGridSortField[];
            new (...items: DataGridSortField[]): DataGridSortField[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
            of<T_4>(...items: T_4[]): T_4[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        default: never[];
    };
    /** 排序交互模式 */
    mode: {
        type: PropType<InteractiveMode>;
        default: string;
    };
    /** 多列排序 */
    multiSort: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export type SortOptions = ExtractPropTypes<typeof sortOptions>;
export type GroupSummaryPosition = 'merge-to-group' | 'separate';
export declare const groupOptions: {
    /** 自定义分组合计内容 */
    customGroupRow: {
        type: FunctionConstructor;
        default: () => void;
    };
    /** 自定义分组行样式 */
    customGroupRowStyle: {
        type: FunctionConstructor;
        default: () => void;
    };
    /** 自行分组合计行样式 */
    customSummaryStyle: {
        type: FunctionConstructor;
        default: () => void;
    };
    /** 启用行数据分组 */
    enable: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 分组行合并列数 */
    groupColSpan: {
        type: NumberConstructor;
        default: number;
    };
    /** 行数据分组字段；多字段分组以英文逗号分隔 */
    groupFields: {
        type: {
            (arrayLength: number): string[];
            (...items: string[]): string[];
            new (arrayLength: number): string[];
            new (...items: string[]): string[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
            of<T_4>(...items: T_4[]): T_4[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        default: never[];
    };
    /** 在DataGrid中显示被分组的列 */
    showGroupedColumn: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 显示分组面板 */
    showGroupPanel: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 启用合计行 */
    showSummary: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 显示合计行位置； */
    summaryPosition: {
        type: PropType<GroupSummaryPosition>;
        default: string;
    };
};
export type GroupOptions = ExtractPropTypes<typeof groupOptions>;
export type DataGridFilterStyle = 'filter-column' | 'filter-row';
export declare const filterOptions: {
    /** 启用筛选 */
    enable: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** DataGrid筛选风格 */
    filterStyle: {
        type: PropType<DataGridFilterStyle>;
        default: string;
    };
    /** 筛选交互模式 */
    mode: {
        type: PropType<InteractiveMode>;
        default: string;
    };
    /** 显示过滤条件工具条 */
    showSummary: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export type FilterOptions = ExtractPropTypes<typeof filterOptions>;
export declare const headerOptions: {
    /** 允许折行显示列标题 */
    wrapHeadings: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export type HeaderOptions = ExtractPropTypes<typeof headerOptions>;
export declare const rowNumberOptions: {
    /** 显示行号 */
    enable: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 行号列表头标题 */
    heading: {
        type: StringConstructor;
        default: string;
    };
    /** 行号宽度，默认为 36px */
    width: {
        type: NumberConstructor;
        default: number;
    };
    /** 是否展示省略号 */
    showEllipsis: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export type RowNumberOptions = ExtractPropTypes<typeof rowNumberOptions>;
export declare const rowOptions: {
    /** 自定义行样式 */
    customRowStyle: {
        type: FunctionConstructor;
        default: () => void;
    };
    /** 自定义行状态 */
    customRowStatus: {
        type: FunctionConstructor;
        default: () => void;
    };
    /** 禁止行选中表达式 */
    disable: {
        type: FunctionConstructor;
        default: () => void;
    };
    /** 默认行高度为 29px */
    height: {
        type: NumberConstructor;
        default: number;
    };
    /** 鼠标滑过行效果 */
    showHovering: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 禁止数据折行 */
    wrapContent: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export type RowOptions = ExtractPropTypes<typeof rowOptions>;
export type DataGridSummaryPosition = 'bottom' | 'top' | 'both';
export declare const summaryOptions: {
    /** 显示合计信息 */
    enable: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 合计行自定义样式，对启用合计行模板无效 */
    customSummaryStyle: {
        type: FunctionConstructor;
        default: () => void;
    };
    /** 分组合计字段 */
    groupFields: {
        type: {
            (arrayLength: number): string[];
            (...items: string[]): string[];
            new (arrayLength: number): string[];
            new (...items: string[]): string[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
            of<T_4>(...items: T_4[]): T_4[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        default: never[];
    };
    /** 合计交互模式 */
    mode: {
        type: PropType<InteractiveMode>;
        default: string;
    };
    /** 合计行显示位置， top: 顶部 bottom: 底部， both: 顶部与底部同时显示 */
    position: {
        type: PropType<DataGridSummaryPosition>;
        default: string;
    };
};
export type SummaryOptions = ExtractPropTypes<typeof summaryOptions>;
export type DataGridColumnFitMode = 'none' | 'average' | 'expand' | 'percentage';
export declare const columnOptions: {
    /** 自动列宽。设为true后，所有列将填满表格并不会出现横向滚动条。 */
    fitColumns: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 自动适配列宽度模式 */
    fitMode: {
        type: PropType<DataGridColumnFitMode>;
        default: string;
    };
    groups: {
        type: {
            (arrayLength: number): ColumnGroupItem[];
            (...items: ColumnGroupItem[]): ColumnGroupItem[];
            new (arrayLength: number): ColumnGroupItem[];
            new (...items: ColumnGroupItem[]): ColumnGroupItem[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
            of<T_4>(...items: T_4[]): T_4[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        defaut: never[];
    };
    /** 允许拖动表头改变列显示顺序 */
    reorderColumn: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 允许拖动改变列宽度 */
    resizeColumn: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 双击表头列自适应内容宽度 */
    resizeColumnOnDoubleClick: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export type ColumnOptions = ExtractPropTypes<typeof columnOptions>;
export type FocuseSelectionMode = 'current' | 'all';
export declare const selectionOptions: {
    /** 启用多选且显示checkbox, 选中行后勾选前面的checkbox */
    checkOnSelect: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 当数据源为空时，清空已选记录 */
    clearSelectionOnEmpty: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 自定义已选记录列表中的显示内容 */
    customSelectionItem: {
        type: FunctionConstructor;
        default: () => void;
    };
    /** 允许选中行 */
    enabelSelectRow: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 允许重复点击行是保留选中状态 */
    keepSelectingOnClick: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 允许跨页多选 */
    keepSelectingOnPaging: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 启用多选 */
    multiSelect: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 启用多选时，点击行选中，只允许且只有一行被选中 */
    focusSelection: {
        type: PropType<FocuseSelectionMode>;
        default: string;
    };
    /** 启用多选且显示checkbox, 勾选后并且选中行 */
    selectOnCheck: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 每行前边显示 checkbox */
    showCheckbox: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 显示全选checkbox */
    showSelectAll: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 显示已选数据 */
    showSelection: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export type SelectionOptions = ExtractPropTypes<typeof selectionOptions>;
export type DataGridEditMode = 'cell' | 'row';
export declare const editOptions: {
    /** 编辑时选中文本 */
    selectOnEditing: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** 编辑模式； row：整行编辑，cell: 单元格编辑 */
    editMode: {
        type: PropType<DataGridEditMode>;
        default: string;
    };
};
export type EditOption = ExtractPropTypes<typeof editOptions>;
export declare const loadingOptions: {
    /** show loading */
    show: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** message on display when loading */
    message: {
        type: StringConstructor;
        default: string;
    };
};
export type LoadingOption = Partial<ExtractPropTypes<typeof editOptions>>;
export declare const dataGridProps: Record<string, any>;
export type DataGridProps = ExtractPropTypes<typeof dataGridProps>;