diff --git a/web/src/components/RealtimeTable/TableHead/TableHead.jsx b/web/src/components/RealtimeTable/TableHead/TableHead.jsx index 0a63ae4..7bee2df 100644 --- a/web/src/components/RealtimeTable/TableHead/TableHead.jsx +++ b/web/src/components/RealtimeTable/TableHead/TableHead.jsx @@ -31,6 +31,19 @@ const getColumnId = (header) => { return columnId; } +// Ширина закреплённых дочерних колонок группового заголовка +const getPinnedColumnsWidth = (header, pinningColumn) => { + let width = 0; + for (const leaf of header.getLeafHeaders()) { + if (pinningColumn.includes(leaf.column.id)) { + width += leaf.column.getSize(); + } else { + break; + } + } + return width; +}; + const calculateLeftOffset = (table, columnOrHeader) => { const columnId = getColumnId(columnOrHeader); const pinnedColumns = table.getState().columnPinning.left || []; @@ -122,8 +135,13 @@ const ColumnNumberCell = ({ column, table }) => { const HeaderCell = ({ header, table, onClick, hightlight, onChangeWidth }) => { const column = header.column; + const pinningColumn = table.getState().columnPinning.left || []; + const isGroup = header.subHeaders?.length > 0; const isPinned = isColumnPin(table, header); const leftOffset = calculateLeftOffset(table, header); + const headerSize = header.getSize(); + const pinnedBandWidth = isGroup ? getPinnedColumnsWidth(header, pinningColumn) : 0; + const splitGroup = isGroup && isPinned && pinnedBandWidth > 0 && pinnedBandWidth < headerSize; const customBgColor = column.columnDef?.muiTableHeadCellProps?.sx?.backgroundColor; const color = column.columnDef?.muiTableHeadCellProps?.sx?.color || '#000000'; @@ -157,6 +175,61 @@ const HeaderCell = ({ header, table, onClick, hightlight, onChangeWidth }) => { return `${totalPinnedWidth}px`; }; + const renderCell = (width, textLeft) => ( +