web/src/components/RealtimeTable/Cell/EditCell/EditCell.jsx

@@ -2,15 +2,18 @@
 import { useEffect, useRef, useLayoutEffect, useState } from 'react';
 import { isFormula, extractFormula, calculateFormula, formatNumber } from '../../utils/formulaUtils';
 import { saveToStorage, loadFromStorage } from '../../utils/localStorageUtils';
+import { useRealtime } from '../../contexts/RealtimeContext';
+
+const EditCell = ({ refCell, onChange, disabled, value, tableId, cellId, table }) => {
+  const { endEditing: contextEndEditing } = useRealtime();
 
-const EditCell = ({ refCell, onChange, disabled, value, tableId, cellId }) => {
   const [curValue, setCurValue] = useState(value);
   const [displayValue, setDisplayValue] = useState(value);
   const [isFormulaMode, setIsFormulaMode] = useState(false);
-  
+
   // Ключ для хранения формул в localStorage
   const storageKey = `formula_${tableId}_${cellId}`;
-  
+
   const trFrag = refCell.current.offsetParent.offsetParent;
   const tdFrag = refCell.current.offsetParent;
   const left = tdFrag.offsetLeft;
@@ -69,7 +72,7 @@ const EditCell = ({ refCell, onChange, disabled, value, tableId, cellId }) => {
     if (isFormula(curValue)) {
       // Сохраняем формулу в localStorage
       saveToStorage(storageKey, curValue);
-      
+
       // Вычисляем и сохраняем результат
       try {
         const formula = extractFormula(curValue);
@@ -108,6 +111,32 @@ const EditCell = ({ refCell, onChange, disabled, value, tableId, cellId }) => {
     return displayValue;
   };
 
+  const finishEditing = () => {
+    if (!disabled) {
+      handleSave();
+    }
+    const editingCell = table.getState().editingCell || null;
+    if (editingCell) {
+      contextEndEditing?.(editingCell.row, editingCell.column);
+    }
+  };
+
+  useEffect(() => {
+    const handleClickOutside = (event) => {
+      // Проверяем, был ли клик внутри элемента редактирования
+      const editElement = ref.current;
+      if (editElement && !editElement.contains(event.target)) {
+        finishEditing();
+      }
+    };
+
+    document.addEventListener('mousedown', handleClickOutside);
+
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside);
+    };
+  }, [ref, finishEditing]);
+
   return (
     <tr>
       <td>
@@ -150,16 +179,10 @@ const EditCell = ({ refCell, onChange, disabled, value, tableId, cellId }) => {
             }}
             onChange={handleChangeValue}
             value={curValue}
-            onBlur={handleSave}
             onKeyDown={(e) => {
               if (e.key === 'Enter' && !e.shiftKey) {
                 e.preventDefault();
-                handleSave();
-                // Закрываем редактирование
-                if (onChange) {
-                  // Симулируем завершение редактирования
-                  document.activeElement?.blur();
-                }
+                finishEditing();
               }
             }}
             placeholder={isFormulaMode ? 'Введите формулу (начинается с =)' : ''}

web/src/components/RealtimeTable/RealtimeTable.jsx

@@ -63,7 +63,6 @@ const RealtimeTable = ({ formType, formId, sheetName, direction, year }) => {
     addRow: contextAddRow,
     deleteRow: contextDeleteRow,
     startEditing: contextStartEditing,
-    endEditing: contextEndEditing,
   } = useRealtime();
 
   const {
@@ -180,8 +179,6 @@ const RealtimeTable = ({ formType, formId, sheetName, direction, year }) => {
         if (cell) {
           if (editingCell) return;
           contextStartEditing?.(cell.row, cell.column);
-        } else {
-          contextEndEditing?.(editingCell.row, editingCell.column);
         }
       },
       columnVirtualizerOptions: ({ table }) => ({

web/src/components/RealtimeTable/tableColumns.jsx

@@ -3,6 +3,7 @@ import { createPortal } from 'react-dom';
 import { columns as mockColumns } from '../../mocks/mockTable';
 import { config } from './constants/FORM_2/AHR';
 import { useParams } from 'react-router';
+import { useRealtime } from './contexts/RealtimeContext';
 
 function EditCellPortal({
   cell,
@@ -20,6 +21,8 @@ function EditCellPortal({
   const [isSaving, setIsSaving] = useState(false);
   const isDisabled = false;
 
+  const { endEditing: contextEndEditing } = useRealtime();
+
   useEffect(() => {
     if (ref.current) {
       const tbodyRef = ref.current.offsetParent?.offsetParent?.offsetParent;
@@ -68,6 +71,7 @@ function EditCellPortal({
             disabled={!isEditable}
             onChange={handleChange}
             tableId={tableKey}
+            table={table}
             cellId={cell.row.id + '_' + cell.column.id}
           />,
           refTbody,