From f615ca3c95edc638adf6dd05980d12054c45da90 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=A2=D0=B8=D0=BC=D1=83=D1=80=20=D0=93=D0=BE=D1=80=D0=BE?=
 =?UTF-8?q?=D0=B4=D0=B5=D1=86=D0=BA=D0=B8=D0=B9?=
 <gorodetskiy.timur@tnsu.kz>
Date: Wed, 2 Sep 2026 11:38:58 +0500
Subject: [PATCH] =?UTF-8?q?fix:=20=D0=BD=D0=B0=D0=B5=D0=B7=D0=B4=20=D0=BF?=
 =?UTF-8?q?=D0=BE=D0=B4=D0=B7=D0=B0=D0=B3=D0=BE=D0=BB=D0=BE=D0=B2=D0=BA?=
 =?UTF-8?q?=D0=BE=D0=B2=20=D1=82=D0=B0=D0=B1=D0=BB=D0=B8=D1=86=D1=8B=20?=
 =?UTF-8?q?=D1=81=D1=80=D0=B0=D0=B2=D0=BD=D0=B5=D0=BD=D0=B8=D1=8F=20=D0=BD?=
 =?UTF-8?q?=D0=B0=20=D0=BF=D0=B5=D1=80=D0=B2=D1=83=D1=8E=20=D1=81=D1=82?=
 =?UTF-8?q?=D1=80=D0=BE=D0=BA=D1=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Второй ряд шапки (Наименование ТМЦ/Ед.изм./Кол-во/Цена/Сумма) прибит
sticky с захардкоженным top:70px, а реальная высота ряда поставщика больше
(имя, индикатор Adata, теги валют, статус, кнопки) — из-за чего подзаголовки
наезжали на первую строку данных.

Высота row1 теперь измеряется через ResizeObserver и прокидывается в CSS
переменную --header-row1-h; sticky top использует её. Обновляется при
выборе поставщика, появлении тегов валют и изменении состояния Adata.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../Step3ComparisonTable/ComparisonMatrix.tsx | 23 +++++++++++++++++--
 .../Step3ComparisonTable.module.scss          |  4 +++-
 2 files changed, 24 insertions(+), 3 deletions(-)

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<HTMLTableRowElement>(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 (
     <div className={styles.tableScrollWrapper}>
-      <table className={styles.ctTable}>
+      <table
+        className={styles.ctTable}
+        style={{ '--header-row1-h': `${row1Height}px` } as React.CSSProperties}
+      >
         <thead>
           {/* Row 1: fixed headers (rowSpan=2) + supplier group headers (colSpan varies by currency) */}
-          <tr className={styles.headerRow1}>
+          <tr className={styles.headerRow1} ref={headerRow1Ref}>
             <th rowSpan={2} className={styles.colPosition}>Наименование</th>
             <th rowSpan={2} className={styles.colUnit}>Ед. изм.</th>
             <th rowSpan={2} className={styles.colQty}>Кол-во</th>
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;