fix aurora-1149
This commit is contained in:
parent
c0e186baef
commit
acd4645a4e
@ -2,15 +2,18 @@
|
|||||||
import { useEffect, useRef, useLayoutEffect, useState } from 'react';
|
import { useEffect, useRef, useLayoutEffect, useState } from 'react';
|
||||||
import { isFormula, extractFormula, calculateFormula, formatNumber } from '../../utils/formulaUtils';
|
import { isFormula, extractFormula, calculateFormula, formatNumber } from '../../utils/formulaUtils';
|
||||||
import { saveToStorage, loadFromStorage } from '../../utils/localStorageUtils';
|
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 [curValue, setCurValue] = useState(value);
|
||||||
const [displayValue, setDisplayValue] = useState(value);
|
const [displayValue, setDisplayValue] = useState(value);
|
||||||
const [isFormulaMode, setIsFormulaMode] = useState(false);
|
const [isFormulaMode, setIsFormulaMode] = useState(false);
|
||||||
|
|
||||||
// Ключ для хранения формул в localStorage
|
// Ключ для хранения формул в localStorage
|
||||||
const storageKey = `formula_${tableId}_${cellId}`;
|
const storageKey = `formula_${tableId}_${cellId}`;
|
||||||
|
|
||||||
const trFrag = refCell.current.offsetParent.offsetParent;
|
const trFrag = refCell.current.offsetParent.offsetParent;
|
||||||
const tdFrag = refCell.current.offsetParent;
|
const tdFrag = refCell.current.offsetParent;
|
||||||
const left = tdFrag.offsetLeft;
|
const left = tdFrag.offsetLeft;
|
||||||
@ -69,7 +72,7 @@ const EditCell = ({ refCell, onChange, disabled, value, tableId, cellId }) => {
|
|||||||
if (isFormula(curValue)) {
|
if (isFormula(curValue)) {
|
||||||
// Сохраняем формулу в localStorage
|
// Сохраняем формулу в localStorage
|
||||||
saveToStorage(storageKey, curValue);
|
saveToStorage(storageKey, curValue);
|
||||||
|
|
||||||
// Вычисляем и сохраняем результат
|
// Вычисляем и сохраняем результат
|
||||||
try {
|
try {
|
||||||
const formula = extractFormula(curValue);
|
const formula = extractFormula(curValue);
|
||||||
@ -108,6 +111,32 @@ const EditCell = ({ refCell, onChange, disabled, value, tableId, cellId }) => {
|
|||||||
return displayValue;
|
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 (
|
return (
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
@ -150,16 +179,10 @@ const EditCell = ({ refCell, onChange, disabled, value, tableId, cellId }) => {
|
|||||||
}}
|
}}
|
||||||
onChange={handleChangeValue}
|
onChange={handleChangeValue}
|
||||||
value={curValue}
|
value={curValue}
|
||||||
onBlur={handleSave}
|
|
||||||
onKeyDown={(e) => {
|
onKeyDown={(e) => {
|
||||||
if (e.key === 'Enter' && !e.shiftKey) {
|
if (e.key === 'Enter' && !e.shiftKey) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
handleSave();
|
finishEditing();
|
||||||
// Закрываем редактирование
|
|
||||||
if (onChange) {
|
|
||||||
// Симулируем завершение редактирования
|
|
||||||
document.activeElement?.blur();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
placeholder={isFormulaMode ? 'Введите формулу (начинается с =)' : ''}
|
placeholder={isFormulaMode ? 'Введите формулу (начинается с =)' : ''}
|
||||||
|
|||||||
@ -63,7 +63,6 @@ const RealtimeTable = ({ formType, formId, sheetName, direction, year }) => {
|
|||||||
addRow: contextAddRow,
|
addRow: contextAddRow,
|
||||||
deleteRow: contextDeleteRow,
|
deleteRow: contextDeleteRow,
|
||||||
startEditing: contextStartEditing,
|
startEditing: contextStartEditing,
|
||||||
endEditing: contextEndEditing,
|
|
||||||
} = useRealtime();
|
} = useRealtime();
|
||||||
|
|
||||||
const {
|
const {
|
||||||
@ -180,8 +179,6 @@ const RealtimeTable = ({ formType, formId, sheetName, direction, year }) => {
|
|||||||
if (cell) {
|
if (cell) {
|
||||||
if (editingCell) return;
|
if (editingCell) return;
|
||||||
contextStartEditing?.(cell.row, cell.column);
|
contextStartEditing?.(cell.row, cell.column);
|
||||||
} else {
|
|
||||||
contextEndEditing?.(editingCell.row, editingCell.column);
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
columnVirtualizerOptions: ({ table }) => ({
|
columnVirtualizerOptions: ({ table }) => ({
|
||||||
|
|||||||
@ -3,6 +3,7 @@ import { createPortal } from 'react-dom';
|
|||||||
import { columns as mockColumns } from '../../mocks/mockTable';
|
import { columns as mockColumns } from '../../mocks/mockTable';
|
||||||
import { config } from './constants/FORM_2/AHR';
|
import { config } from './constants/FORM_2/AHR';
|
||||||
import { useParams } from 'react-router';
|
import { useParams } from 'react-router';
|
||||||
|
import { useRealtime } from './contexts/RealtimeContext';
|
||||||
|
|
||||||
function EditCellPortal({
|
function EditCellPortal({
|
||||||
cell,
|
cell,
|
||||||
@ -20,6 +21,8 @@ function EditCellPortal({
|
|||||||
const [isSaving, setIsSaving] = useState(false);
|
const [isSaving, setIsSaving] = useState(false);
|
||||||
const isDisabled = false;
|
const isDisabled = false;
|
||||||
|
|
||||||
|
const { endEditing: contextEndEditing } = useRealtime();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (ref.current) {
|
if (ref.current) {
|
||||||
const tbodyRef = ref.current.offsetParent?.offsetParent?.offsetParent;
|
const tbodyRef = ref.current.offsetParent?.offsetParent?.offsetParent;
|
||||||
@ -68,6 +71,7 @@ function EditCellPortal({
|
|||||||
disabled={!isEditable}
|
disabled={!isEditable}
|
||||||
onChange={handleChange}
|
onChange={handleChange}
|
||||||
tableId={tableKey}
|
tableId={tableKey}
|
||||||
|
table={table}
|
||||||
cellId={cell.row.id + '_' + cell.column.id}
|
cellId={cell.row.id + '_' + cell.column.id}
|
||||||
/>,
|
/>,
|
||||||
refTbody,
|
refTbody,
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user