From 26ddfcb5ba7402b22449fae8d8353f586d803fe8 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: Thu, 29 Oct 2026 09:20:15 +0500
Subject: [PATCH] =?UTF-8?q?fix:=20=D0=BA=D0=BD=D0=BE=D0=BF=D0=BA=D0=B8=20?=
 =?UTF-8?q?=D0=B4=D0=B5=D0=B9=D1=81=D1=82=D0=B2=D0=B8=D0=B9=20=D0=BC=D0=B0?=
 =?UTF-8?q?=D1=80=D1=88=D1=80=D1=83=D1=82=D0=B0=20=D0=B2=D1=80=D0=BE=D0=B2?=
 =?UTF-8?q?=D0=B5=D0=BD=D1=8C=20=D1=81=D0=BE=20=D1=81=D1=82=D1=80=D0=B5?=
 =?UTF-8?q?=D0=BB=D0=BA=D0=B0=D0=BC=D0=B8=20=D1=83=20=D1=81=D1=82=D1=80?=
 =?UTF-8?q?=D0=BE=D0=BA=D0=B8=20=D1=81=20=D0=BA=D0=BE=D0=BC=D0=BC=D0=B5?=
 =?UTF-8?q?=D0=BD=D1=82=D0=B0=D1=80=D0=B8=D0=B5=D0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Стрелки шага объединены на строку участника и его комментария и стояли по
центру пары, а кнопки действий — по центру одной строки, из-за чего
расходились по высоте. Ячейка действий теперь тоже накрывает комментарий.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
---
 .../shared/approval/ui/ApprovalMatrix.tsx           | 13 ++++++++-----
 .../shared/approval/ui/approval.module.scss         | 12 ++++--------
 2 files changed, 12 insertions(+), 13 deletions(-)

diff --git a/src/webparts/requestPortal/shared/approval/ui/ApprovalMatrix.tsx b/src/webparts/requestPortal/shared/approval/ui/ApprovalMatrix.tsx
index b373c70..6f561df 100644
--- a/src/webparts/requestPortal/shared/approval/ui/ApprovalMatrix.tsx
+++ b/src/webparts/requestPortal/shared/approval/ui/ApprovalMatrix.tsx
@@ -211,7 +211,8 @@ export const ApprovalMatrix: React.FC<IApprovalMatrixProps> = ({
 
   // Комментарий занимает всю ширину между объединёнными колонками «Шаг» и
   // стрелок: «Согласующий» + «Должность» + те необязательные колонки, что
-  // сейчас показаны. Колонку действий не захватывает — в ней своя пустая ячейка.
+  // сейчас показаны. Колонку действий не захватывает — её ячейка из строки
+  // участника объединена и на строку комментария (rowSpan у .matrixActions).
   const optionalColumns = [hasDepartment, hasOrganization, hasStatuses, hasDates, hasSla];
   const commentColSpan = 2 + optionalColumns.filter(Boolean).length;
   const hasActionsCol = editable || hasRemovable;
@@ -337,8 +338,11 @@ export const ApprovalMatrix: React.FC<IApprovalMatrixProps> = ({
                           )}
                         </td>
                       )}
+                      {/* Кнопки — на участника вместе с его комментарием, как номер
+                          шага и стрелки: иначе стрелки стоят по центру пары строк,
+                          а кнопки — по центру одной, и они расходятся по высоте. */}
                       {hasActionsCol && (
-                        <td className={styles.matrixActions}>
+                        <td className={styles.matrixActions} rowSpan={r.comment ? 2 : 1}>
                           {editable && (
                             <button
                               type="button"
@@ -379,14 +383,13 @@ export const ApprovalMatrix: React.FC<IApprovalMatrixProps> = ({
                     </tr>
                     {/* Комментарий — отдельной строкой во всю ширину под участником:
                         в узкой колонке «Согласующий» текст ломался по слову на строку.
-                        Ячейки «Шаг» и стрелок её не повторяют — их накрывает rowSpan
-                        (см. block.span); колонка действий — пустая ячейка. */}
+                        Ячейки «Шаг», стрелок и действий её не повторяют — их накрывает
+                        rowSpan из строки участника. */}
                     {r.comment && (
                       <tr ref={registerRow(commentRowKey(rowKeys[i]))} className={commentClassNames.join(' ')}>
                         <td colSpan={commentColSpan} className={styles.commentCell}>
                           <ApprovalComment text={r.comment} status={r.status} />
                         </td>
-                        {hasActionsCol && <td />}
                       </tr>
                     )}
                   </React.Fragment>
diff --git a/src/webparts/requestPortal/shared/approval/ui/approval.module.scss b/src/webparts/requestPortal/shared/approval/ui/approval.module.scss
index d75fb5d..b4839d6 100644
--- a/src/webparts/requestPortal/shared/approval/ui/approval.module.scss
+++ b/src/webparts/requestPortal/shared/approval/ui/approval.module.scss
@@ -159,9 +159,10 @@
 
 // Строка участника, под которой идёт его комментарий (см. ApprovalComment):
 // разделитель между ними убираем, иначе комментарий читается как отдельная
-// запись маршрута. Ячейки «Шаг» и стрелок не трогаем — они объединены на весь
-// шаг (rowSpan), и их нижняя граница — это граница всего шага.
-.rowWithComment > td:not(.matrixStepCol):not(.matrixMoveCol) {
+// запись маршрута. Объединённые ячейки (rowSpan) не трогаем: «Шаг» и стрелки
+// накрывают весь шаг, действия — участника с комментарием, и их нижняя
+// граница — это граница всей записи.
+.rowWithComment > td:not(.matrixStepCol):not(.matrixMoveCol):not(.matrixActions) {
   border-bottom-color: transparent;
 }
 
@@ -388,11 +389,6 @@
     flex: 1 1 100%;
   }
 
-  // Пустая ячейка под колонкой действий на телефоне дала бы лишний отступ.
-  .commentRow > td:empty {
-    display: none;
-  }
-
   .matrixActions,
   .matrixMoveCol {
     justify-content: flex-start;