root/protoc-frontend
1
Fork 0
Code Pull Requests Actions Packages Projects Releases Activity

уменьшение кода

Browse Source
This commit is contained in:
Artyom Tsyrulnikov
2025-07-15 05:44:33 +03:00
parent e1fe966bcd
commit 2100fcd249
8 changed files with 386 additions and 1130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

728
src/components/DualSpreadsheet/DualSpreadsheet.tsx
View File

File diff suppressed because it is too large Load Diff

552
src/components/Spreadsheet/Spreadsheet.tsx
View File

@@ -1,552 +0,0 @@
import { FC, useEffect, useRef, useState } from 'react';
import { useSpreadsheetEngine } from '../../hooks/useSpreadsheetEngine';
interface CellData {
value: string;
isSelected: boolean;
}
const Spreadsheet: FC = () => {
const {
cells: engineCells,
setCellValue: setEngineCellValue,
getCellValue,
getCellRawValue,
isCalculating,
recalculate
} = useSpreadsheetEngine({
rows: 20,
cols: 10,
sheetName: 'Sheet1'
});
const [cells, setCells] = useState<CellData[][]>(() => {
// Создаем сетку 20x10 с пустыми ячейками
return Array(20).fill(null).map(() =>
Array(10).fill(null).map(() => ({ value: '', isSelected: false }))
);
});
const [selectedCell, setSelectedCell] = useState<{row: number, col: number} | null>(null);
const [isEditing, setIsEditing] = useState(false);
const [editingValue, setEditingValue] = useState<string>(''); // Для отмены изменений
const [formulaBarValue, setFormulaBarValue] = useState<string>(''); // Значение в formula bar
const [columnWidths, setColumnWidths] = useState<number[]>(Array(10).fill(96)); // 96px = w-24
const [rowHeights, setRowHeights] = useState<number[]>(Array(20).fill(32)); // 32px = h-8
const containerRef = useRef<HTMLDivElement>(null);
const inputRefs = useRef<(HTMLInputElement | null)[][]>([]);
const formulaBarRef = useRef<HTMLInputElement>(null);
// Инициализируем refs для всех input
useEffect(() => {
inputRefs.current = Array(20).fill(null).map(() => Array(10).fill(null));
}, []);
// Синхронизируем локальное состояние с движком
useEffect(() => {
setCells(prev => {
const newCells = [...prev];
for (let row = 0; row < 20; row++) {
for (let col = 0; col < 10; col++) {
const rawValue = getCellRawValue(row, col);
if (rawValue !== newCells[row][col].value) {
newCells[row][col] = { ...newCells[row][col], value: rawValue };
}
}
}
return newCells;
});
}, [engineCells, getCellRawValue]);
// Тестовые данные для демонстрации
useEffect(() => {
// Добавляем тестовые данные
setEngineCellValue(0, 0, '10'); // A1 = 10
setEngineCellValue(1, 0, '20'); // A2 = 20
setEngineCellValue(2, 0, '=A1+A2'); // A3 = A1+A2
setEngineCellValue(0, 1, '=A1*2'); // B1 = A1*2
setEngineCellValue(1, 1, '=SUM(A1,A2)'); // B2 = SUM(A1,A2)
setEngineCellValue(0, 2, '="Результат: " + A3'); // C1 = "Результат: " + A3
// Демонстрация волатильных функций
setEngineCellValue(0, 3, '=RAND()'); // D1 = случайное число
setEngineCellValue(1, 3, '=RANDBETWEEN(1,100)'); // D2 = случайное число от 1 до 100
setEngineCellValue(2, 3, '=D1*100'); // D3 = D1*100 (зависит от волатильной функции)
setEngineCellValue(0, 4, '=TODAY()'); // E1 = сегодняшняя дата
setEngineCellValue(1, 4, '=NOW()'); // E2 = текущая дата и время
}, [setEngineCellValue]);
// Синхронизируем значение formula bar с выбранной ячейкой
useEffect(() => {
if (selectedCell) {
// Показываем сырое значение (формулу) в formula bar
const rawValue = getCellRawValue(selectedCell.row, selectedCell.col);
setFormulaBarValue(rawValue);
} else {
setFormulaBarValue('');
}
}, [selectedCell, getCellRawValue, engineCells]);
const handleCellClick = (row: number, col: number) => {
setSelectedCell({ row, col });
setIsEditing(false);
containerRef.current?.focus();
};
const handleCellDoubleClick = (row: number, col: number) => {
setSelectedCell({ row, col });
// Сохраняем текущее значение из UI для возможности отмены
setEditingValue(cells[row][col].value);
setIsEditing(true);
// Фокус на input ячейки и курсор в конец
setTimeout(() => {
const input = inputRefs.current[row]?.[col];
if (input) {
input.focus();
// Устанавливаем курсор в конец текста
input.setSelectionRange(input.value.length, input.value.length);
}
}, 10); // Увеличиваем задержку для надежности
};
const moveSelection = (deltaRow: number, deltaCol: number) => {
if (!selectedCell) return;
const newRow = Math.max(0, Math.min(19, selectedCell.row + deltaRow));
const newCol = Math.max(0, Math.min(9, selectedCell.col + deltaCol));
setSelectedCell({ row: newRow, col: newCol });
setIsEditing(false);
};
const startEditing = (focusTarget?: 'cell' | 'formula') => {
if (!selectedCell) return;
// Сохраняем текущее значение из UI для возможности отмены
setEditingValue(cells[selectedCell.row][selectedCell.col].value);
setIsEditing(true);
// Фокус в зависимости от того, откуда вызвано редактирование
if (focusTarget === 'cell') {
setTimeout(() => {
const input = inputRefs.current[selectedCell.row]?.[selectedCell.col];
if (input) {
input.focus();
input.select();
}
}, 0);
} else if (focusTarget === 'formula') {
setTimeout(() => {
if (formulaBarRef.current) {
formulaBarRef.current.focus();
formulaBarRef.current.select();
}
}, 0);
}
// Если focusTarget не указан, не меняем фокус
};
const stopEditing = (save: boolean = true) => {
if (!save && selectedCell) {
// Отменяем изменения - возвращаем старое значение
setCells(prev => {
const newCells = [...prev];
newCells[selectedCell.row][selectedCell.col] = {
...newCells[selectedCell.row][selectedCell.col],
value: editingValue
};
return newCells;
});
setFormulaBarValue(editingValue);
// Восстанавливаем значение в движке
setEngineCellValue(selectedCell.row, selectedCell.col, editingValue);
}
setIsEditing(false);
containerRef.current?.focus();
};
const handleCellChange = (row: number, col: number, value: string) => {
// Обновляем локальное состояние для UI (сырое значение)
setCells(prev => {
const newCells = [...prev];
newCells[row][col] = { ...newCells[row][col], value };
return newCells;
});
// Обновляем formula bar если изменяется текущая выбранная ячейка
if (selectedCell && selectedCell.row === row && selectedCell.col === col) {
setFormulaBarValue(value);
}
// Обновляем значение в движке (это может быть медленно, поэтому делаем в конце)
setEngineCellValue(row, col, value);
};
const getColumnLabel = (index: number) => {
return String.fromCharCode(65 + index); // A, B, C, ...
};
const handleResize = (colIndex: number, newWidth: number) => {
setColumnWidths(prev => {
const newWidths = [...prev];
newWidths[colIndex] = Math.max(60, newWidth); // Минимальная ширина 60px
return newWidths;
});
};
const handleRowResize = (rowIndex: number, newHeight: number) => {
setRowHeights(prev => {
const newHeights = [...prev];
newHeights[rowIndex] = Math.max(24, newHeight); // Минимальная высота 24px
return newHeights;
});
};
const handleKeyDown = (e: React.KeyboardEvent) => {
if (!selectedCell) return;
// Если в режиме редактирования, обрабатываем Esc и стрелочки
if (isEditing) {
if (e.key === 'Escape') {
e.preventDefault();
stopEditing(false); // Отменяем изменения
} else if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(e.key)) {
e.preventDefault();
stopEditing(true); // Сохраняем изменения
// Затем перемещаемся
const deltaMap: Record<string, [number, number]> = {
'ArrowUp': [-1, 0],
'ArrowDown': [1, 0],
'ArrowLeft': [0, -1],
'ArrowRight': [0, 1]
};
const [deltaRow, deltaCol] = deltaMap[e.key];
moveSelection(deltaRow, deltaCol);
}
return;
}
switch (e.key) {
case 'ArrowUp':
e.preventDefault();
moveSelection(-1, 0);
break;
case 'ArrowDown':
e.preventDefault();
moveSelection(1, 0);
break;
case 'ArrowLeft':
e.preventDefault();
moveSelection(0, -1);
break;
case 'ArrowRight':
e.preventDefault();
moveSelection(0, 1);
break;
case 'Enter':
e.preventDefault();
if (selectedCell) {
setEditingValue(cells[selectedCell.row][selectedCell.col].value);
setIsEditing(true);
setTimeout(() => {
const input = inputRefs.current[selectedCell.row]?.[selectedCell.col];
if (input) {
input.focus();
// Устанавливаем курсор в конец текста
input.setSelectionRange(input.value.length, input.value.length);
}
}, 0);
}
break;
case 'F2':
e.preventDefault();
if (selectedCell) {
setEditingValue(cells[selectedCell.row][selectedCell.col].value);
setIsEditing(true);
setTimeout(() => {
const input = inputRefs.current[selectedCell.row]?.[selectedCell.col];
if (input) {
input.focus();
// Устанавливаем курсор в конец текста
input.setSelectionRange(input.value.length, input.value.length);
}
}, 0);
}
break;
case 'Backspace':
case 'Delete':
e.preventDefault();
if (selectedCell) {
handleCellChange(selectedCell.row, selectedCell.col, '');
}
break;
default:
// Если нажата обычная клавиша (буква/цифра), начинаем редактирование
if (e.key.length === 1 && !e.ctrlKey && !e.altKey && !e.metaKey) {
e.preventDefault();
if (selectedCell) {
handleCellChange(selectedCell.row, selectedCell.col, e.key);
setFormulaBarValue(e.key);
setEditingValue(cells[selectedCell.row][selectedCell.col].value);
setIsEditing(true);
setTimeout(() => {
const input = inputRefs.current[selectedCell.row]?.[selectedCell.col];
if (input) {
input.focus();
// Устанавливаем курсор в конец
input.setSelectionRange(input.value.length, input.value.length);
}
}, 0);
}
}
break;
}
};
return (
<div
ref={containerRef}
className="w-full h-full bg-white outline-none"
tabIndex={0}
onKeyDown={handleKeyDown}
>
{/* Formula bar */}
<div className="border-b border-gray-200 p-2 bg-white">
<div className="flex items-center space-x-2">
<div className="text-sm text-gray-600 min-w-[60px]">
{selectedCell ? `${getColumnLabel(selectedCell.col)}${selectedCell.row + 1}` : ''}
</div>
{isCalculating && (
<div className="text-xs text-blue-600 animate-pulse">
Вычисляется...
</div>
)}
<div className="flex-1">
<input
ref={formulaBarRef}
type="text"
className={`w-full px-2 py-1 text-sm border rounded focus:outline-none ${
isEditing
? 'border-blue-400 focus:ring-2 focus:ring-blue-300'
: 'border-gray-300 focus:ring-2 focus:ring-blue-500'
}`}
placeholder="Введите формулу..."
value={formulaBarValue}
onChange={(e) => {
setFormulaBarValue(e.target.value);
if (selectedCell) {
handleCellChange(selectedCell.row, selectedCell.col, e.target.value);
}
}}
onFocus={() => {
if (selectedCell) {
startEditing('formula');
}
}}
onBlur={() => stopEditing(true)}
onKeyDown={(e) => {
if (e.key === 'Enter') {
e.preventDefault();
stopEditing(true);
containerRef.current?.focus();
} else if (e.key === 'Escape') {
e.preventDefault();
stopEditing(false);
}
}}
/>
</div>
</div>
</div>
{/* Spreadsheet */}
<div className="overflow-auto h-[calc(100vh-200px)]">
<table className="border-collapse">
<thead>
<tr>
{/* Empty corner cell */}
<th className="w-12 h-8 bg-gray-100 border border-gray-300 text-xs text-gray-600 font-medium sticky top-0 left-0 z-20"></th>
{/* Column headers */}
{Array.from({ length: 10 }, (_, i) => (
<th
key={i}
className="h-8 bg-gray-100 border border-gray-300 text-xs text-gray-600 font-medium text-center sticky top-0 z-10 relative"
style={{ width: columnWidths[i] }}
>
{getColumnLabel(i)}
{/* Resize handle */}
<div
className="absolute top-0 right-0 w-1 h-full cursor-col-resize hover:bg-blue-500 hover:bg-opacity-50"
onMouseDown={(e) => {
e.preventDefault();
const startX = e.clientX;
const startWidth = columnWidths[i];
const handleMouseMove = (e: MouseEvent) => {
const newWidth = startWidth + (e.clientX - startX);
handleResize(i, newWidth);
};
const handleMouseUp = () => {
document.removeEventListener('mousemove', handleMouseMove);
document.removeEventListener('mouseup', handleMouseUp);
};
document.addEventListener('mousemove', handleMouseMove);
document.addEventListener('mouseup', handleMouseUp);
}}
/>
</th>
))}
</tr>
</thead>
<tbody>
{cells.map((row, rowIndex) => (
<tr key={rowIndex}>
{/* Row header */}
<td
className="w-12 bg-gray-100 border border-gray-300 text-xs text-gray-600 font-medium text-center sticky left-0 z-10 relative"
style={{ height: rowHeights[rowIndex] }}
>
{rowIndex + 1}
{/* Resize handle */}
<div
className="absolute bottom-0 left-0 w-full h-1 cursor-row-resize hover:bg-blue-500 hover:bg-opacity-50"
onMouseDown={(e) => {
e.preventDefault();
const startY = e.clientY;
const startHeight = rowHeights[rowIndex];
const handleMouseMove = (e: MouseEvent) => {
const newHeight = startHeight + (e.clientY - startY);
handleRowResize(rowIndex, newHeight);
};
const handleMouseUp = () => {
document.removeEventListener('mousemove', handleMouseMove);
document.removeEventListener('mouseup', handleMouseUp);
};
document.addEventListener('mousemove', handleMouseMove);
document.addEventListener('mouseup', handleMouseUp);
}}
/>
</td>
{/* Data cells */}
{row.map((cell, colIndex) => (
<td
key={colIndex}
className={`border border-gray-300 relative ${
selectedCell?.row === rowIndex && selectedCell?.col === colIndex
? ''
: 'hover:bg-gray-50'
}`}
style={{
width: columnWidths[colIndex],
height: rowHeights[rowIndex],
...(selectedCell?.row === rowIndex && selectedCell?.col === colIndex
? { boxShadow: isEditing
? 'inset 0 0 0 2px #3b82f6, inset 0 0 0 4px rgba(59, 130, 246, 0.3)' // Синяя рамка + полупрозрачная голубая вокруг
: 'inset 0 0 0 2px #3b82f6' // Только синяя рамка в режиме выделения
}
: {})
}}
onClick={() => {
// Если в режиме редактирования и это активная ячейка, не обрабатываем клик
if (isEditing && selectedCell?.row === rowIndex && selectedCell?.col === colIndex) {
return;
}
handleCellClick(rowIndex, colIndex);
// Фокусируемся на контейнере, чтобы работали клавиши
containerRef.current?.focus();
}}
onDoubleClick={() => handleCellDoubleClick(rowIndex, colIndex)}
>
<input
type="text"
className={`w-full h-full px-1 text-sm bg-transparent border-none outline-none resize-none ${
isEditing && selectedCell?.row === rowIndex && selectedCell?.col === colIndex
? 'cursor-text'
: 'cursor-cell'
}`}
value={isEditing && selectedCell?.row === rowIndex && selectedCell?.col === colIndex
? cell.value
: String(getCellValue(rowIndex, colIndex) || '')}
onChange={(e) => {
handleCellChange(rowIndex, colIndex, e.target.value);
setFormulaBarValue(e.target.value);
}}
onFocus={(e) => {
// Только устанавливаем выбранную ячейку, не включаем режим редактирования автоматически
setSelectedCell({ row: rowIndex, col: colIndex });
// Если не в режиме редактирования, убираем фокус
if (!isEditing) {
(e.target as HTMLInputElement).blur();
}
}}
onBlur={() => stopEditing(true)}
onKeyDown={(e) => {
if (e.key === 'Enter') {
e.preventDefault();
stopEditing(true);
moveSelection(1, 0);
} else if (e.key === 'Escape') {
e.preventDefault();
stopEditing(false);
}
}}
onClick={(e) => {
// Если в режиме редактирования и это активная ячейка, не обрабатываем клик
if (isEditing && selectedCell?.row === rowIndex && selectedCell?.col === colIndex) {
return;
}
e.stopPropagation();
setSelectedCell({ row: rowIndex, col: colIndex });
setIsEditing(false); // Явно отключаем режим редактирования при клике
// Убираем фокус с input чтобы не мигал курсор
(e.target as HTMLInputElement).blur();
}}
onDoubleClick={(e) => {
e.stopPropagation();
setSelectedCell({ row: rowIndex, col: colIndex });
setEditingValue(cells[rowIndex][colIndex].value);
setIsEditing(true);
// Фокус уже на input, устанавливаем курсор в конец
setTimeout(() => {
const input = e.target as HTMLInputElement;
input.focus();
input.setSelectionRange(input.value.length, input.value.length);
}, 0);
}}
onMouseDown={(e) => {
// В режиме редактирования разрешаем нормальное поведение мыши
if (isEditing && selectedCell?.row === rowIndex && selectedCell?.col === colIndex) {
e.stopPropagation();
}
}}
onMouseUp={(e) => {
// В режиме редактирования разрешаем нормальное поведение мыши
if (isEditing && selectedCell?.row === rowIndex && selectedCell?.col === colIndex) {
e.stopPropagation();
}
}}
readOnly={!isEditing || selectedCell?.row !== rowIndex || selectedCell?.col !== colIndex}
ref={(el) => {
if (inputRefs.current[rowIndex]) {
inputRefs.current[rowIndex][colIndex] = el;
}
}}
/>
</td>
))}
</tr>
))}
</tbody>
</table>
</div>
</div>
);
};
export default Spreadsheet;

1
src/components/Spreadsheet/index.ts
View File

@@ -1 +0,0 @@
export { default as Spreadsheet } from './Spreadsheet';

1
src/components/index.ts
View File

@@ -1,3 +1,2 @@
export { DualSpreadsheet } from "./DualSpreadsheet";
export { Spreadsheet } from "./Spreadsheet";

99
src/hooks/useMultiSheetEngine.ts
View File

@@ -24,6 +24,8 @@ export function useMultiSheetEngine({
const workbookRef = useRef<Workbook | null>(null);
const [isCalculating, setIsCalculating] = useState(false);
const [sheetCells, setSheetCells] = useState<Record<string, CellData[][]>>({});
const debouncedRecalcTimeoutRef = useRef<number | null>(null);
const isRecalculatingRef = useRef(false);
// Инициализация workbook и листов
useEffect(() => {
@@ -54,7 +56,7 @@ export function useMultiSheetEngine({
// Синхронизация всех листов из движка
const syncAllSheetsFromEngine = useCallback(() => {
if (!workbookRef.current) return;
if (!workbookRef.current || isRecalculatingRef.current) return;
const newSheetCells: Record<string, CellData[][]> = {};
@@ -84,26 +86,78 @@ export function useMultiSheetEngine({
setSheetCells(newSheetCells);
}, [sheets]);
// Установка значения ячейки
const setCellValue = useCallback((sheetName: string, row: number, col: number, value: string) => {
if (!workbookRef.current) return;
// Безопасная функция для вычислений
const safeRecalc = useCallback(() => {
if (!workbookRef.current || isRecalculatingRef.current) return;
isRecalculatingRef.current = true;
setIsCalculating(true);
try {
workbookRef.current.recalc();
syncAllSheetsFromEngine();
} catch (error) {
console.warn('Ошибка при вычислении:', error);
} finally {
// Небольшая задержка для визуального индикатора
setTimeout(() => {
setIsCalculating(false);
isRecalculatingRef.current = false;
}, 150);
}
}, [syncAllSheetsFromEngine]);
// Отложенный пересчет с дебаунсом
const debouncedRecalc = useCallback(() => {
if (!workbookRef.current || isRecalculatingRef.current) return;
// Очищаем предыдущий отложенный пересчет
if (debouncedRecalcTimeoutRef.current) {
clearTimeout(debouncedRecalcTimeoutRef.current);
}
// Запускаем пересчет через 300ms
debouncedRecalcTimeoutRef.current = setTimeout(() => {
safeRecalc();
}, 300);
}, [safeRecalc]);
// Установка значения ячейки без немедленного пересчета
const setCellValueWithoutRecalc = useCallback((sheetName: string, row: number, col: number, value: string) => {
if (!workbookRef.current || isRecalculatingRef.current) return;
const cellName = columnToLabel(col) + (row + 1);
const qualifiedName = `${sheetName}!${cellName}`;
setIsCalculating(true);
// Устанавливаем значение в движке без пересчета
workbookRef.current.setCell(qualifiedName, value);
// Обновляем только локальное состояние ячейки
setSheetCells(prev => {
const newSheetCells = { ...prev };
if (newSheetCells[sheetName]) {
const newCells = [...newSheetCells[sheetName]];
newCells[row] = [...newCells[row]];
newCells[row][col] = { ...newCells[row][col], value };
newSheetCells[sheetName] = newCells;
}
return newSheetCells;
});
}, []);
// Установка значения ячейки с немедленным пересчетом
const setCellValue = useCallback((sheetName: string, row: number, col: number, value: string) => {
if (!workbookRef.current || isRecalculatingRef.current) return;
const cellName = columnToLabel(col) + (row + 1);
const qualifiedName = `${sheetName}!${cellName}`;
// Устанавливаем значение в движке
workbookRef.current.setCell(qualifiedName, value);
// Запускаем пересчет
workbookRef.current.recalc();
setIsCalculating(false);
// Синхронизируем состояние
syncAllSheetsFromEngine();
}, [syncAllSheetsFromEngine]);
// Запускаем безопасный пересчет
safeRecalc();
}, [safeRecalc]);
// Получение значения ячейки (вычисленное)
const getCellValue = useCallback((sheetName: string, row: number, col: number): CellValue => {
@@ -165,15 +219,24 @@ export function useMultiSheetEngine({
const recalculate = useCallback(() => {
if (!workbookRef.current) return;
setIsCalculating(true);
workbookRef.current.recalc();
setIsCalculating(false);
syncAllSheetsFromEngine();
}, [syncAllSheetsFromEngine]);
safeRecalc();
}, [safeRecalc]);
// Очистка таймаутов при размонтировании
useEffect(() => {
return () => {
if (debouncedRecalcTimeoutRef.current) {
clearTimeout(debouncedRecalcTimeoutRef.current);
}
isRecalculatingRef.current = false;
};
}, []);
return {
sheetCells,
setCellValue,
setCellValueWithoutRecalc,
debouncedRecalc,
getCellValue,
getCellRawValue,
getModifiedCells,

15
src/lib/spreadsheet-engine.ts
View File

@@ -210,8 +210,17 @@ export class Cell {
// Заменяем квалифицированные ссылки на ячейки
code = code.replace(QUALIFIED_REF_RE, (match) => {
try {
const [sheetName] = match.split('!');
const sheet = this.sheet.workbook.getSheet(sheetName);
if (!sheet) {
return '"#REF!"';
}
const cellValue = this.sheet.workbook.getCell(match).evaluate();
return typeof cellValue === 'string' ? `"${cellValue}"` : String(cellValue ?? 0);
} catch (error) {
return '"#REF!"';
}
});
// Заменяем локальные ссылки на ячейки
@@ -220,14 +229,18 @@ export class Cell {
if (this.isFunction(match)) {
return match;
}
try {
const qualifiedRef = `${this.sheet.name}!${match}`;
const cellValue = this.sheet.workbook.getCell(qualifiedRef).evaluate();
return typeof cellValue === 'string' ? `"${cellValue}"` : String(cellValue ?? 0);
} catch (error) {
return '"#REF!"';
}
});
// Заменяем функции Excel
const functions = this.sheet.workbook.getFunctions();
for (const [funcName, func] of Object.entries(functions)) {
for (const [funcName] of Object.entries(functions)) {
const funcRegex = new RegExp(`\\b${funcName}\\s*\\(`, 'gi');
code = code.replace(funcRegex, `__functions__.${funcName}(`);
}

4
src/lib/spreadsheet-example.ts
View File

@@ -5,7 +5,7 @@ export function createExampleWorkbook(): Workbook {
const wb = new Workbook();
// Создаём листы
const sheetMain = wb.addSheet('Sheet1');
wb.addSheet('Sheet1');
// Заполняем данные с локальными ссылками
wb.setCell('Sheet1!A1', 10);
@@ -16,7 +16,7 @@ export function createExampleWorkbook(): Workbook {
wb.setCell('Sheet1!C1', '="Результат: " + A3'); // Строковая операция с локальной ссылкой
// Пример с квалифицированными ссылками (если есть несколько листов)
const countsSheet = wb.addSheet('Counts');
wb.addSheet('Counts');
wb.setCell('Counts!A1', 'N455');
wb.setCell('Sheet1!D1', '="Отчет по протоколу " + Counts!A1');

24
src/lib/template-data.ts
View File

@@ -1,11 +1,8 @@
// Пример шаблонных данных для отчета (только простые значения из Excel)
export const exampleTemplateData = {
// Заголовки
A1: 'Отчет о продажах',
A2: 'Период: Январь 2024',
A3: '',
// Таблица данных
A4: 'Товар',
B4: 'Количество',
C4: 'Цена',
@@ -14,42 +11,39 @@ export const exampleTemplateData = {
A5: 'Товар A',
B5: 100,
C5: 1500,
D5: 150000, // Простое значение вместо формулы
D5: 150000,
A6: 'Товар B',
B6: 50,
C6: 2000,
D6: 100000, // Простое значение вместо формулы
D6: 100000,
A7: 'Товар C',
B7: 75,
C7: 1200,
D7: 90000, // Простое значение вместо формулы
D7: 90000,
A8: '',
A9: 'Итого:',
D9: 340000, // Простое значение вместо формулы
D9: 340000,
// Дополнительные поля для расчетов
A11: 'НДС (20%):',
D11: 68000, // Простое значение вместо формулы
D11: 68000,
A12: 'Всего к оплате:',
D12: 408000, // Простое значение вместо формулы
D12: 408000,
// Поля для ссылок на правый лист (пока пустые, формулы можно добавить поверх)
A14: 'Скидка из расчетов:',
D14: '', // Пустое значение, формулу можно добавить поверх
D14: '',
A15: 'Итого со скидкой:',
D15: '' // Пустое значение, формулу можно добавить поверх
D15: ''
};
// Пример данных для листа вычислений
export const exampleCalculationsData = {
A1: 'Расчеты',
A2: 'Скидка:',
B2: '=Report!D9*0.05', // 5% скидка от общей суммы
B2: '=Report!D9*0.05',
A4: 'Дополнительные расчеты:',
A5: 'Средняя цена:',