vue-devui/types/data-grid/src/composables/use-data-grid.d.ts

DevUI components based on Vite and Vue3

import type { SetupContext, Ref } from 'vue';
import type { DataGridProps, InnerRowData } from '../data-grid-types';
export declare function useDataGrid(props: DataGridProps, ctx: SetupContext): {
    scrollRef: Ref<HTMLElement | undefined>;
    headBoxRef: Ref<HTMLElement | undefined>;
    bodyScrollLeft: Ref<number>;
    bodyContentHeight: Ref<number>;
    bodyContentWidth: Ref<number>;
    translateX: Ref<number>;
    translateY: Ref<number>;
    renderFixedLeftColumnData: Ref<{
        $columnId: string;
        offsetLeft: number;
        $showExpandTreeIcon?: boolean | undefined;
        header: string;
        field: string;
        width?: string | number | undefined;
        minWidth?: string | number | undefined;
        maxWidth?: string | number | undefined;
        type?: import("../data-grid-types").ColumnType | undefined;
        resizable?: boolean | undefined;
        sortable?: boolean | undefined;
        showSortIcon?: boolean | undefined;
        sortMethod?: import("../data-grid-types").SortMethod<import("../data-grid-types").RowData> | undefined;
        filterable?: boolean | undefined;
        showFilterIcon?: boolean | undefined;
        filterMultiple?: boolean | undefined;
        filterList?: {
            name: string;
            value: any;
            checked?: boolean | undefined;
        }[] | undefined;
        filterChange?: ((val: import("../data-grid-types").FilterListItem | import("../data-grid-types").FilterListItem[]) => void) | undefined;
        filterMenu?: ((scope: {
            toggleFilterMenu: (status?: boolean | undefined) => void;
            setFilterStatus: (status: boolean) => void;
        }) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
        fixed?: import("../data-grid-types").FixedDirection | undefined;
        align?: import("../data-grid-types").ColumnAlign | undefined;
        showOverflowTooltip?: boolean | {
            content?: string | undefined;
            position?: import("../../../overlay").Placement[] | undefined;
            mouseEnterDelay?: number | undefined;
            enterable?: boolean | undefined;
            class?: string | undefined;
        } | undefined;
        showHeadOverflowTooltip?: boolean | {
            content?: string | undefined;
            position?: import("../../../overlay").Placement[] | undefined;
            mouseEnterDelay?: number | undefined;
            enterable?: boolean | undefined;
            class?: string | undefined;
        } | undefined;
        headRender?: ((columnConfig: import("../data-grid-types").ColumnConfig) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
        cellRender?: ((rowData: import("../data-grid-types").RowData, rowIndex: number, cellData: string, cellIndex: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
    }[]>;
    renderFixedRightColumnData: Ref<{
        $columnId: string;
        offsetLeft: number;
        $showExpandTreeIcon?: boolean | undefined;
        header: string;
        field: string;
        width?: string | number | undefined;
        minWidth?: string | number | undefined;
        maxWidth?: string | number | undefined;
        type?: import("../data-grid-types").ColumnType | undefined;
        resizable?: boolean | undefined;
        sortable?: boolean | undefined;
        showSortIcon?: boolean | undefined;
        sortMethod?: import("../data-grid-types").SortMethod<import("../data-grid-types").RowData> | undefined;
        filterable?: boolean | undefined;
        showFilterIcon?: boolean | undefined;
        filterMultiple?: boolean | undefined;
        filterList?: {
            name: string;
            value: any;
            checked?: boolean | undefined;
        }[] | undefined;
        filterChange?: ((val: import("../data-grid-types").FilterListItem | import("../data-grid-types").FilterListItem[]) => void) | undefined;
        filterMenu?: ((scope: {
            toggleFilterMenu: (status?: boolean | undefined) => void;
            setFilterStatus: (status: boolean) => void;
        }) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
        fixed?: import("../data-grid-types").FixedDirection | undefined;
        align?: import("../data-grid-types").ColumnAlign | undefined;
        showOverflowTooltip?: boolean | {
            content?: string | undefined;
            position?: import("../../../overlay").Placement[] | undefined;
            mouseEnterDelay?: number | undefined;
            enterable?: boolean | undefined;
            class?: string | undefined;
        } | undefined;
        showHeadOverflowTooltip?: boolean | {
            content?: string | undefined;
            position?: import("../../../overlay").Placement[] | undefined;
            mouseEnterDelay?: number | undefined;
            enterable?: boolean | undefined;
            class?: string | undefined;
        } | undefined;
        headRender?: ((columnConfig: import("../data-grid-types").ColumnConfig) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
        cellRender?: ((rowData: import("../data-grid-types").RowData, rowIndex: number, cellData: string, cellIndex: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
    }[]>;
    renderColumnData: Ref<{
        $columnId: string;
        offsetLeft: number;
        $showExpandTreeIcon?: boolean | undefined;
        header: string;
        field: string;
        width?: string | number | undefined;
        minWidth?: string | number | undefined;
        maxWidth?: string | number | undefined;
        type?: import("../data-grid-types").ColumnType | undefined;
        resizable?: boolean | undefined;
        sortable?: boolean | undefined;
        showSortIcon?: boolean | undefined;
        sortMethod?: import("../data-grid-types").SortMethod<import("../data-grid-types").RowData> | undefined;
        filterable?: boolean | undefined;
        showFilterIcon?: boolean | undefined;
        filterMultiple?: boolean | undefined;
        filterList?: {
            name: string;
            value: any;
            checked?: boolean | undefined;
        }[] | undefined;
        filterChange?: ((val: import("../data-grid-types").FilterListItem | import("../data-grid-types").FilterListItem[]) => void) | undefined;
        filterMenu?: ((scope: {
            toggleFilterMenu: (status?: boolean | undefined) => void;
            setFilterStatus: (status: boolean) => void;
        }) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
        fixed?: import("../data-grid-types").FixedDirection | undefined;
        align?: import("../data-grid-types").ColumnAlign | undefined;
        showOverflowTooltip?: boolean | {
            content?: string | undefined;
            position?: import("../../../overlay").Placement[] | undefined;
            mouseEnterDelay?: number | undefined;
            enterable?: boolean | undefined;
            class?: string | undefined;
        } | undefined;
        showHeadOverflowTooltip?: boolean | {
            content?: string | undefined;
            position?: import("../../../overlay").Placement[] | undefined;
            mouseEnterDelay?: number | undefined;
            enterable?: boolean | undefined;
            class?: string | undefined;
        } | undefined;
        headRender?: ((columnConfig: import("../data-grid-types").ColumnConfig) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
        cellRender?: ((rowData: import("../data-grid-types").RowData, rowIndex: number, cellData: string, cellIndex: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
            [key: string]: any;
        }>) | undefined;
    }[]>;
    renderRowData: Ref<{
        [x: string]: any;
        $rowId?: string | undefined;
        $parentId?: string | undefined;
        $rowIndex?: number | undefined;
        $level?: number | undefined;
        height?: number | undefined;
        offsetTop?: number | undefined;
        showNode?: boolean | undefined;
        $expand?: boolean | undefined;
        halfChecked?: boolean | undefined;
        childList?: any[] | undefined;
        descendantList?: any[] | undefined;
        checked?: boolean | undefined;
        disableCheck?: boolean | undefined;
        children?: {
            [x: string]: any;
            checked?: boolean | undefined;
            disableCheck?: boolean | undefined;
            children?: any[] | undefined;
            isLeaf?: boolean | undefined;
        }[] | undefined;
        isLeaf?: boolean | undefined;
    }[]>;
    isTreeGrid: Ref<boolean>;
    allChecked: Ref<boolean>;
    halfAllChecked: Ref<boolean>;
    sort: (key: string, direction: import("../data-grid-types").SortDirection) => void;
    getCheckedRows: () => InnerRowData[];
    execSortMethod: (direction: import("../data-grid-types").SortDirection, sortMethod?: import("../data-grid-types").SortMethod<import("../data-grid-types").RowData> | undefined) => void;
    addGridThContextToMap: (key: string, thCtx: import("../data-grid-types").GridThContext) => void;
    clearAllSortState: () => void;
    toggleRowExpansion: (node: InnerRowData, status?: boolean | undefined) => void;
    toggleAllRowExpansion: (status?: boolean | undefined) => void;
    toggleRowChecked: (node: import("../data-grid-types").RowData | InnerRowData, status?: boolean | undefined) => void;
    toggleAllRowChecked: (status?: boolean | undefined) => void;
    afterColumnDragend: (columnId: string, offset: number) => void;
    refreshRowsData: () => void;
};
export declare function useDataGridStyle(props: DataGridProps, scrollRef: Ref<HTMLElement | undefined>): {
    gridClasses: import("vue").ComputedRef<{
        [x: string]: boolean;
    }>;
};