- number-поля теперь рендерятся как text + inputMode=numeric, чтобы браузер не округлял значения через input type=number - пробелы при вставке в number-поля удаляются - бэкенд нормализует значения number-полей в строку перед сохранением - добавлен хелпер normalizeFieldValueForStorage Closes: искажение расчётного счёта и других длинных числовых полей
116 lines
6.0 KiB
Plaintext
116 lines
6.0 KiB
Plaintext
Создай React-приложение "Бухгалтерия ЗП" — полная копия Excel-таблицы расчёта зарплаты с полем Formula как в Excel.
|
||
|
||
## Структура таблицы (как в приложенном файле):
|
||
|
||
### Заголовок:
|
||
- Дата: 3.26 (поле ввода)
|
||
- Общ. оф ЗП: 120959.48 (формула =СУММ(К_выдаче))
|
||
- Число рабочих дней в месяце: 15 (поле ввода)
|
||
|
||
### Колонки таблицы:
|
||
| № | ФИО | Отр | Карта | Больнич | База | Допы | Плюс | Минус | К выдаче НА РУКИ | 5000 | 1000 | 500 | 100 |
|
||
|
||
### Формулы для каждой колонки:
|
||
|
||
1. **Отр (Отработано дней)**:
|
||
=ЕСЛИ(B3>0; $B$1; 0) // B1 = число рабочих дней
|
||
|
||
2. **Карта (ЗП на карту)**:
|
||
=ЕСЛИ(Отр>0; Оклад*(Отр/$B$1)*0.87; 0)
|
||
// Оклад берётся из отдельной справочника/поля сотрудника
|
||
|
||
3. **База**:
|
||
=Карта+Больнич+Допы
|
||
|
||
4. **К выдаче НА РУКИ**:
|
||
=База+Плюс−Минус
|
||
|
||
5. **Купюры (каскадный расчёт)**:
|
||
- 5000: =ЦЕЛОЕ(К_выдаче/5000)
|
||
- Остаток1: =К_выдаче−(5000*Кол5000)
|
||
- 1000: =ЦЕЛОЕ(Остаток1/1000)
|
||
- Остаток2: =Остаток1−(1000*Кол1000)
|
||
- 500: =ЦЕЛОЕ(Остаток2/500)
|
||
- Остаток3: =Остаток2−(500*Кол500)
|
||
- 100: =ЦЕЛОЕ(Остаток3/100)
|
||
|
||
6. **Итого купюр (проверка)**:
|
||
=СУММ(К_выдаче) — должно совпадать с Общ. оф ЗП
|
||
|
||
### Промежуточные строки:
|
||
- Строка "ПРОВЕРКА": =СУММ(К_выдаче)
|
||
- Строка "Итого купюр": =СУММ(по каждому номиналу)
|
||
|
||
## Требования к полю Formula:
|
||
|
||
### Движки (как в NocoBase):
|
||
1. **Formula.js** — Excel-функции:
|
||
- СУММ(), ЕСЛИ(), И(), ИЛИ(), НЕ()
|
||
- ЦЕЛОЕ(), ОКРУГЛ(), МАКС(), МИН()
|
||
- СРЗНАЧ(), СЧЁТ(), СЧЁТЕСЛИ()
|
||
- ВПР(), ГПР() (если есть справочники)
|
||
- СЕГОДНЯ(), ТДАТА()
|
||
|
||
2. **Math.js** — математические выражения:
|
||
- +, −, *, /, ^, %
|
||
- sqrt(), abs(), round(), floor(), ceil()
|
||
- Переменные как имена полей
|
||
|
||
3. **Шаблон строки** — для текстовых полей:
|
||
- {{ФИО}} — {{Должность}}
|
||
|
||
### Синтаксис Formula.js:
|
||
- Все функции в ВЕРХНЕМ регистре (как в Excel)
|
||
- Аргументы через точку с запятой `;` (русский Excel) или запятую `,` (английский)
|
||
- Ссылки на ячейки: A1, B2, $A$1 (абсолютная), A$1 (смешанная)
|
||
- Диапазоны: A1:A10, СУММ(B3:B10)
|
||
- Именованные переменные: =Оклад*0.87
|
||
|
||
### Фичи поля Formula:
|
||
- Двойной клик — редактирование формулы
|
||
- Enter — подтверждение
|
||
- Escape — отмена
|
||
- Подсветка ячеек при редактировании (цветные рамки как в Excel)
|
||
- Автодополнение функций (выпадающий список при вводе =)
|
||
- Подсказка синтаксиса функции
|
||
- Ошибки: #ЗНАЧ!, #ДЕЛ/0!, #Н/Д, #ИМЯ?, #ССЫЛКА!
|
||
|
||
## UI таблицы:
|
||
- Фиксированная шапка (заголовок + названия колонок)
|
||
- Фиксированные колонки (№, ФИО) при горизонтальной прокрутке
|
||
- Цветовое оформление:
|
||
- Заголовок: серый фон
|
||
- Формулы: жёлтый фон (или подсветка)
|
||
- Итоги: жирный шрифт
|
||
- Ошибки: красный фон
|
||
- Изменение ширины колонок (drag)
|
||
- Добавление/удаление строк
|
||
- Копирование формул (растягивание как в Excel — drag за уголок)
|
||
|
||
## Технический стек:
|
||
- React 18 + TypeScript
|
||
- Formula.js: библиотека formulajs (npm install @formulajs/formulajs)
|
||
- Math.js: библиотека mathjs (npm install mathjs)
|
||
- Таблица: react-table или ручная реализация на div/grid
|
||
- Состояние: Zustand или Redux Toolkit
|
||
|
||
## Тестовые данные (из файла):
|
||
const employees = [
|
||
{ id: 1, ФИО: "Сорокина Елена Алексеевна", Оклад: 160000, Больнич: 0, Допы: 0, Плюс: 0, Минус: 0 },
|
||
{ id: 2, ФИО: "Сафина Дания Дамировна", Оклад: 68300, Больнич: 0, Допы: 0, Плюс: 0, Минус: 0 },
|
||
{ id: 3, ФИО: "Исмаилова Ирина Николаевна", Оклад: 84200, Больнич: 0, Допы: 0, Плюс: 0, Минус: 0 },
|
||
{ id: 4, ФИО: "Гайфуллина Ильнара Ревкатовна (по уходу до 3 лет)", Оклад: 0, Больнич: 0, Допы: 0, Плюс: 0, Минус: 0 },
|
||
{ id: 5, ФИО: "Кислова Вероника", Оклад: 0, Больнич: 0, Допы: 0, Плюс: 0, Минус: 0 },
|
||
{ id: 6, ФИО: "Попова Галина Руслановна (по уходу до 1,5 лет)", Оклад: 7546.16, Больнич: 0, Допы: 0, Плюс: 0, Минус: 0 },
|
||
];
|
||
|
||
// Рабочие дни = 15
|
||
// Ожидаемый результат К выдаче: [110000, 32900, 48800, 0, 0, 7600]
|
||
|
||
## Дополнительно:
|
||
- Экспорт в Excel (.xlsx) — библиотека sheetjs
|
||
- Импорт из Excel
|
||
- Сохранение расчёта в JSON
|
||
- Печать таблицы (CSS print)
|
||
|
||
Сделай полностью рабочее приложение с формулами, пересчётом в реальном времени и UI как в Excel. |