Юниверс DG SDK UI
v2.15.0

Интерфейс GroupTableProps<RowRecord, GroupRecord, ColumnRecord>

Пропсы таблицы с группировкой

interface GroupTableProps<
    RowRecord extends Record<string, any> = Record<string, any>,
    GroupRecord extends GroupRecordType = GroupRecordType,
    ColumnRecord = void,
> {
    addText: ReactNode;
    allowedSortDirections?: Record<string, TableSortDirection[]>;
    canAdd?: boolean;
    canCollapseLocked?: boolean;
    canDelete?: boolean;
    cellRenderer?: (
        props: GroupTableCellRendererProps<RowRecord, ColumnRecord>,
    ) => ReactNode;
    cellViewType?:
        | CELL_VIEW_TYPE
        | (
            (
                column: TableColumn<RowRecord, ColumnRecord>,
                rowData: RowRecord,
                index: number,
            ) => CELL_VIEW_TYPE
        );
    checkedGroups: string[];
    collapsedRowsText?: string;
    collapseText?: string;
    columnHeights?: { [key: string]: number };
    columns: TableColumn<RowRecord, ColumnRecord>[];
    columnWidths?: { [key: string]: number };
    customHeaderCheckbox?: ReactNode;
    data: TableGroupData<RowRecord, GroupRecord, ColumnRecord>[];
    deleteText: ReactNode;
    disabledForCheckLockedRows?: number[];
    editableCellRenderer?: TableEditableCellRenderer<RowRecord, ColumnRecord>;
    emptyTableRenderer?: (
        isLoading: boolean,
        emptyTableText: string,
    ) => ReactNode;
    emptyTableText?: string;
    expandedGroups: string[];
    expandText?: string;
    filterValues?: { [key: string]: any };
    getRowType?: (rowIndex: number) => ROW_TYPE;
    groupRenderer?: (
        props: TableGroupData<RowRecord, GroupRecord, ColumnRecord>,
        defaultRenderer: (
            props: TableGroupData<RowRecord, GroupRecord, ColumnRecord>,
        ) => ReactNode,
        tableRenderer: (
            props: TableGroupData<RowRecord, GroupRecord, ColumnRecord>,
        ) => ReactNode,
    ) => ReactNode;
    hasCellPadding?: boolean;
    hasChecked?: boolean;
    hasHeader?: boolean;
    hasHeaderBg?: boolean;
    hasNavigation?: boolean;
    hasPagination?: boolean;
    hideLastRowBorder?: boolean;
    isAutoHeightFill?: boolean;
    isAutoScrollToSelected?: boolean;
    isChangedAxes?: boolean;
    isEditable?: boolean;
    isGroupCheckable?: boolean;
    isGroupCompact?: boolean;
    isGrouped?: boolean;
    isHeaderCheckable?: boolean;
    isLoading?: boolean;
    isLockedCollapsed?: boolean;
    isLockedRowsCheckable?: boolean;
    isMultiselect?: boolean;
    isResizable?: boolean;
    isRowsCheckable?: boolean;
    isRowsSelectable?: boolean;
    isScrollOverflowAuto?: boolean;
    isSortable?: boolean;
    isStriped?: boolean;
    loadingGroups: string[];
    loadingText: string;
    loadMoreText?: string;
    lockedRowActions?: (
        props: GroupTableRowActionsProps<RowRecord, ColumnRecord>,
    ) => ReactNode;
    maxRowsBeforeOverflow?: number;
    noLockedLimit?: boolean;
    onAllCheck?: (isCheck: boolean) => void;
    onChangeColumnHeight?: (columnId: string, newHeight: number) => void;
    onChangeColumnWidth?: (columnId: string, newWidth: number) => void;
    onCollapseLocked?: (groupName: string) => void;
    onCopy?: (e: ClipboardEvent<HTMLDivElement>) => void;
    onFilter?: (columnId: string, isClear?: boolean) => void;
    onGroupCheck?: (groupName: string, checked: boolean) => void;
    onGroupCollapse?: (groupName: string) => void;
    onGroupExpand?: (groupName: string) => void;
    onLockedRowCheck?: (rowIndex: GroupTableIndex) => void;
    onLockedRowClick?: (rowIndex: GroupTableIndex) => void;
    onPaste?: (
        e: ClipboardEvent<HTMLDivElement>,
        pastedData: TableOptionalData<string>,
    ) => void;
    onPasteError?: () => void;
    onResetFilter?: (columnId: string) => void;
    onRowAdd?: (groupName: string) => void;
    onRowCheck?: (
        rowIndex: GroupTableIndex,
        checked: boolean,
        isShiftPressed?: boolean,
    ) => void;
    onRowClick?: (rowIndex: GroupTableIndex) => void;
    onRowDoubleClick?: (rowIndex: GroupTableIndex) => void;
    onRowMouseEnter?: (rowIndex: GroupTableIndex) => void;
    onRowMouseLeave?: (rowIndex: GroupTableIndex) => void;
    onRowsDelete?: (rowIndexes: GroupTableIndex[]) => void;
    onSelectedDataChange?: (selectedData: TableNormalizedSelectedData) => void;
    onSelectedDataClear?: (selectedData: TableNormalizedSelectedData) => void;
    onSort?: (
        columnId: string,
        newSortDirection: TableSortDirection,
        currentSortDirection: TableSortDirection,
        columnData?: ColumnRecord,
    ) => void;
    rowActions?: (
        props: GroupTableRowActionsProps<RowRecord, ColumnRecord>,
    ) => ReactNode;
    selectedData?: TableSelectedData;
    selectMode?: MULTIPLE_CELLS;
    sortDirection?: { [key: string]: TableSortDirection };
    unsetText: string;
}

Параметры типа

Иерархия

  • Omit<
        TableProps<RowRecord, ColumnRecord>,

            | "data"
            | "lockedData"
            | "onRowClick"
            | "onRowDoubleClick"
            | "onRowMouseEnter"
            | "onRowMouseLeave"
            | "onRowAdd"
            | "onRowsDelete"
            | "onLockedRowClick"
            | "rowWidths"
            | "rowHeights"
            | "getRowKey"
            | "selectedRows"
            | "disabledForCheckRows"
            | "cellRenderer"
            | "onCollapseLocked"
            | "lockedRowActions"
            | "rowActions"
            | "editableCell"
            | "checkedRows"
            | "checkedLockedRows"
            | "highlightedRows"
            | "onCellEdit"
            | "onCellEditStart"
            | "onRowCheck"
            | "onLockedRowCheck"
            | "onMove",
    >
    • GroupTableProps
Индекс

Свойства

addText: ReactNode

Текст кнопки добавления.

allowedSortDirections?: Record<string, TableSortDirection[]>

Разрешенные направления сортировки по столбцам.

Параметр работает по следующим правилам:

  • Если параметр не задан — таблица работает как обычно, сортировка доступна для всех колонок.
  • Если объект пустой allowedSortDirections={{}} - таблица работает как обычно.
  • Если для колонки задан пустой массив allowedSortDirections={{colOne: []}} - сортировка для этой колонки запрещена.
  • В комбинации с sortDirection будет происходить проверка на наличие колонки из sortDirection в allowedSortDirections.

allowedSortDirections={{colOne: ['ASC', undefined]}} sortDirection={{colOne: 'DESC'}}.

  • Callback onSort без параметра allowedSortDirections работает как обычно.

Если параметр allowedSortDirections !== undefined, то onSort вызовется только если есть совпадение колонки из sortDirection в allowedSortDirections.

canAdd?: boolean

Разрешает добавление новых строк.

canCollapseLocked?: boolean

Разрешает сворачивать зафиксированные строки.

canDelete?: boolean

Разрешает удаление строк.

cellRenderer?: (
    props: GroupTableCellRendererProps<RowRecord, ColumnRecord>,
) => ReactNode

Рендер ячейки

Объявление типа

cellViewType?:
    | CELL_VIEW_TYPE
    | (
        (
            column: TableColumn<RowRecord, ColumnRecord>,
            rowData: RowRecord,
            index: number,
        ) => CELL_VIEW_TYPE
    )

Тип отображения ячеек или функция определения типа.

Параметры столбца.

Данные строки.

Индекс строки.

checkedGroups: string[]

Имена групп, которые должны быть отмечены

collapsedRowsText?: string

Текст при свернутых строках.

collapseText?: string

Текст кнопки сворачивания.

columnHeights?: { [key: string]: number }

Текущие высоты столбцов.

Массив столбцов, определяющих структуру таблицы.

columnWidths?: { [key: string]: number }

Текущие ширины столбцов.

customHeaderCheckbox?: ReactNode

Свойство для кастомного рендеринга чекбокса в заголовке.

Данные для отображения в таблице

deleteText: ReactNode

Текст кнопки удаления.

disabledForCheckLockedRows?: number[]

Индексы зафиксированных строк, недоступных для отметки.

Собственный рендерер редактируемой ячейки таблицы.

emptyTableRenderer?: (isLoading: boolean, emptyTableText: string) => ReactNode

Функция рендера пустого состояния таблицы.

Объявление типа

    • (isLoading: boolean, emptyTableText: string): ReactNode
    • Параметры

      • isLoading: boolean

        Флаг загрузки.

      • emptyTableText: string

        Текст пустого состояния.

      Возвращает ReactNode

emptyTableText?: string

Текст пустого состояния.

expandedGroups: string[]

Имена групп, которые должны быть раскрыты

expandText?: string

Текст кнопки разворачивания.

filterValues?: { [key: string]: any }

Значения фильтров для столбцов.

getRowType?: (rowIndex: number) => ROW_TYPE

Получение типа строки.

Объявление типа

    • (rowIndex: number): ROW_TYPE
    • Параметры

      • rowIndex: number

        Индекс строки.

      Возвращает ROW_TYPE

groupRenderer?: (
    props: TableGroupData<RowRecord, GroupRecord, ColumnRecord>,
    defaultRenderer: (
        props: TableGroupData<RowRecord, GroupRecord, ColumnRecord>,
    ) => ReactNode,
    tableRenderer: (
        props: TableGroupData<RowRecord, GroupRecord, ColumnRecord>,
    ) => ReactNode,
) => ReactNode

Рендер-функция группы

Объявление типа

hasCellPadding?: boolean

Наличие отступов в ячейках.

hasChecked?: boolean

Включает ли таблица механизм отметки строк.

hasHeader?: boolean

Наличие заголовка таблицы.

hasHeaderBg?: boolean

Фон заголовка таблицы.

hasNavigation?: boolean

Наличие навигации.

hasPagination?: boolean

Наличие пагинации.

hideLastRowBorder?: boolean

Скрывать нижнюю границу последней строки.

isAutoHeightFill?: boolean

Автоматическое заполнение высоты контейнера.

isAutoScrollToSelected?: boolean

Автопрокрутка к выбранной строке.

isChangedAxes?: boolean

Признак изменения осей.

isEditable?: boolean

Доступно ли редактирование.

isGroupCheckable?: boolean

Возможность выбора группы

isGroupCompact?: boolean

Флаг, указывающий на то, что группы должны быть компактными и прижаты к левому краю

isGrouped?: boolean
isHeaderCheckable?: boolean

Разрешает массовую отметку в заголовке.

isLoading?: boolean

Состояние загрузки таблицы.

isLockedCollapsed?: boolean

Запрет сворачивания при блокировке.

isLockedRowsCheckable?: boolean

Разрешает выбор заблокированных строк.

isMultiselect?: boolean

Включает режим множественного выбора.

Если selectMode задан, то текущее свойство игнорируется

isResizable?: boolean

Разрешено ли изменение размеров столбцов.

isRowsCheckable?: boolean

Разрешает выбор строк.

isRowsSelectable?: boolean

Включает выбор строк (для селекта).

Если selectMode задан, то текущее свойство игнорируется

isScrollOverflowAuto?: boolean

Включает автопрокрутку при переполнении.

isSortable?: boolean

Доступна ли сортировка.

isStriped?: boolean

Полосатое оформление строк.

loadingGroups: string[]

Имена групп, которые должны быть загружены

loadingText: string

Текст статуса загрузки.

loadMoreText?: string

Текст кнопки "Загрузить ещё"

lockedRowActions?: (
    props: GroupTableRowActionsProps<RowRecord, ColumnRecord>,
) => ReactNode

Действия для строк в заблокированной области

Объявление типа

maxRowsBeforeOverflow?: number

Максимальное число строк до появления прокрутки.

noLockedLimit?: boolean

Отключает ограничение на количество зафиксированных строк.

onAllCheck?: (isCheck: boolean) => void

Отметка всех строк/снятие отметки.

Объявление типа

    • (isCheck: boolean): void
    • Параметры

      • isCheck: boolean

        Флаг отметки.

      Возвращает void

onChangeColumnHeight?: (columnId: string, newHeight: number) => void

Изменение высоты столбца.

Объявление типа

    • (columnId: string, newHeight: number): void
    • Параметры

      • columnId: string

        Идентификатор столбца.

      • newHeight: number

        Новая высота.

      Возвращает void

onChangeColumnWidth?: (columnId: string, newWidth: number) => void

Изменение ширины столбца.

Объявление типа

    • (columnId: string, newWidth: number): void
    • Параметры

      • columnId: string

        Идентификатор столбца.

      • newWidth: number

        Новая ширина.

      Возвращает void

onCollapseLocked?: (groupName: string) => void

Обработчик скрытия группы

Объявление типа

    • (groupName: string): void
    • Параметры

      • groupName: string

        Имя группы

      Возвращает void

onCopy?: (e: ClipboardEvent<HTMLDivElement>) => void

Обработчик события копирования данных в буфер

onFilter?: (columnId: string, isClear?: boolean) => void

Обработчик фильтрации.

Объявление типа

    • (columnId: string, isClear?: boolean): void
    • Параметры

      • columnId: string

        Идентификатор столбца.

      • OptionalisClear: boolean

        Флаг очистки фильтра.

      Возвращает void

onGroupCheck?: (groupName: string, checked: boolean) => void

Обработчик выбора группы

Объявление типа

    • (groupName: string, checked: boolean): void
    • Параметры

      • groupName: string

        Имя группы

      • checked: boolean

        Флаг, указывающий на то, что группа выбрана

      Возвращает void

onGroupCollapse?: (groupName: string) => void

Обработчик раскрытия группы

Объявление типа

    • (groupName: string): void
    • Параметры

      • groupName: string

        Имя группы

      Возвращает void

onGroupExpand?: (groupName: string) => void

Обработчик раскрытия группы

Объявление типа

    • (groupName: string): void
    • Параметры

      • groupName: string

        Имя группы

      Возвращает void

onLockedRowCheck?: (rowIndex: GroupTableIndex) => void

Обработчик выбора строки в заблокированной области

Объявление типа

onLockedRowClick?: (rowIndex: GroupTableIndex) => void

Обработчик клика по строке в заблокированной области

Объявление типа

onPaste?: (
    e: ClipboardEvent<HTMLDivElement>,
    pastedData: TableOptionalData<string>,
) => void

Обработчик события вставки данных из буфера обмена

Объявление типа

onPasteError?: () => void

Обработчик события ошибки вставки данных из буфера обмена

onResetFilter?: (columnId: string) => void

Сброс фильтра для столбца.

Объявление типа

    • (columnId: string): void
    • Параметры

      • columnId: string

        Идентификатор столбца.

      Возвращает void

onRowAdd?: (groupName: string) => void

Обработчик добавления строки

Объявление типа

    • (groupName: string): void
    • Параметры

      • groupName: string

        Имя группы

      Возвращает void

onRowCheck?: (
    rowIndex: GroupTableIndex,
    checked: boolean,
    isShiftPressed?: boolean,
) => void

Обработчик выбора строки

Объявление типа

    • (rowIndex: GroupTableIndex, checked: boolean, isShiftPressed?: boolean): void
    • Параметры

      • rowIndex: GroupTableIndex

        Индекс строки

      • checked: boolean

        Флаг, указывающий на то, что строка выбрана

      • OptionalisShiftPressed: boolean

        Флаг, указывающий на то, что была нажата клавиша Shift

      Возвращает void

onRowClick?: (rowIndex: GroupTableIndex) => void

Обработчик клика по строке

Объявление типа

onRowDoubleClick?: (rowIndex: GroupTableIndex) => void

Обработчик двойного клика по строке

Объявление типа

onRowMouseEnter?: (rowIndex: GroupTableIndex) => void

Обработчик наведения курсора на строку

Объявление типа

onRowMouseLeave?: (rowIndex: GroupTableIndex) => void

Обработчик ухода курсора с строки

Объявление типа

onRowsDelete?: (rowIndexes: GroupTableIndex[]) => void

Обработчик удаления строк

Объявление типа

onSelectedDataChange?: (selectedData: TableNormalizedSelectedData) => void

Обработчик изменений в выборе ячеек таблицы

Объявление типа

onSelectedDataClear?: (selectedData: TableNormalizedSelectedData) => void

Обработчик события удаления данных из выбранных ячеек

Срабатывает при нажатии клавиши "Delete"

Объявление типа

onSort?: (
    columnId: string,
    newSortDirection: TableSortDirection,
    currentSortDirection: TableSortDirection,
    columnData?: ColumnRecord,
) => void

Обработчик сортировки.

Объявление типа

    • (
          columnId: string,
          newSortDirection: TableSortDirection,
          currentSortDirection: TableSortDirection,
          columnData?: ColumnRecord,
      ): void
    • Параметры

      • columnId: string

        Идентификатор столбца.

      • newSortDirection: TableSortDirection

        Новое направление сортировки.

      • currentSortDirection: TableSortDirection

        Текущее направление сортировки.

      • OptionalcolumnData: ColumnRecord

        Данные столбца.

      Возвращает void

rowActions?: (
    props: GroupTableRowActionsProps<RowRecord, ColumnRecord>,
) => ReactNode

Действия для строк

Объявление типа

selectedData?: TableSelectedData

Данные о выбранных ячейках таблицы

Содержит полную информацию по выбранным ячейкам во всей таблице

Если selectMode не задан или задан как none, то данное свойство игнорируется

selectMode?: MULTIPLE_CELLS

Режим выбора ячеек таблицы

undefined

sortDirection?: { [key: string]: TableSortDirection }

Текущее направление сортировки по столбцам.

unsetText: string

Текст "не установлено".