diff --git a/src/webparts/ctFormsPortal/forms/ct/components/Step3ComparisonTable/ComparisonMatrix.tsx b/src/webparts/ctFormsPortal/forms/ct/components/Step3ComparisonTable/ComparisonMatrix.tsx index abeb6a7..e7d151d 100644 --- a/src/webparts/ctFormsPortal/forms/ct/components/Step3ComparisonTable/ComparisonMatrix.tsx +++ b/src/webparts/ctFormsPortal/forms/ct/components/Step3ComparisonTable/ComparisonMatrix.tsx @@ -31,12 +31,31 @@ export function ComparisonMatrix({ matrix, currencyRates, isRestrictedView, adat const totalColSpan = FIXED_COLS + suppliersWithOffer.reduce((sum, s) => sum + getSubCols(supplierCurrencies[s.id] ?? 'KZT', isRestrictedView), 0); + // Высота row1 (шапка поставщика) переменная (теги валют, выбор поставщика, состояние Adata), + // а row2 прибит sticky сразу под ней. Измеряем реальную высоту и отдаём в CSS-переменную, + // иначе подзаголовки наезжают на первую строку таблицы. + const headerRow1Ref = React.useRef(null); + const [row1Height, setRow1Height] = React.useState(70); + + React.useLayoutEffect(() => { + const el = headerRow1Ref.current; + if (!el) return; + const update = (): void => setRow1Height(Math.round(el.getBoundingClientRect().height)); + update(); + const observer = new ResizeObserver(update); + observer.observe(el); + return () => observer.disconnect(); + }, []); + return (
- +
{/* Row 1: fixed headers (rowSpan=2) + supplier group headers (colSpan varies by currency) */} - + diff --git a/src/webparts/ctFormsPortal/forms/ct/components/Step3ComparisonTable/Step3ComparisonTable.module.scss b/src/webparts/ctFormsPortal/forms/ct/components/Step3ComparisonTable/Step3ComparisonTable.module.scss index f00a755..9add949 100644 --- a/src/webparts/ctFormsPortal/forms/ct/components/Step3ComparisonTable/Step3ComparisonTable.module.scss +++ b/src/webparts/ctFormsPortal/forms/ct/components/Step3ComparisonTable/Step3ComparisonTable.module.scss @@ -48,7 +48,9 @@ border-bottom: 2px solid $accent-border; border-right: 1px solid $border; position: sticky; - top: 70px; // approximate height of row1 — adjust if needed + // Высота row1 (шапка поставщика) переменная — измеряется в ComparisonMatrix и прокидывается + // сюда через CSS-переменную. Хардкод приводил к наезду подзаголовков на первую строку. + top: var(--header-row1-h, 70px); z-index: 1; white-space: nowrap; min-width: 90px;
Наименование Ед. изм. Кол-во