Sergey Krylov
d4d1dd980e
- Replace two MUI DatePicker components with a single visual range field - Click opens Popover with community DateCalendar (no DateRangePicker/pro) - First click sets start, second sets end; if end < start, range resets - Remove isOpen/onToggle props — Popover managed locally - Add BrokerDashboardTableSkeleton for events/income loading - Set default weekly range (today-7d / today) for both events and income - Remove 'Фильтр' label, rename 'Показать' → 'Применить период' - Install @mui/x-date-pickers@7 - Update tests for new UI and skeleton loading states - Align spec.md, plan.md, tasks.md with implementation
63 lines
5.5 KiB
Markdown
63 lines
5.5 KiB
Markdown
# Редизайн обзора брокерского счёта в инвестиционный дашборд — задачи
|
||
|
||
Дата: 2026-06-26
|
||
Статус: в реализации
|
||
|
||
## Документация и pre-flight
|
||
|
||
- [x] Выбрать scope: `/broker/:accountId` становится единым дашбордом.
|
||
- [x] Выбрать визуальный стиль: структура `temp.html`, текущая светлая DS-тема.
|
||
- [x] Исключить график истории стоимости из первой версии.
|
||
- [x] Добавить backlog-задачу на историю стоимости брокерского портфеля.
|
||
- [x] Создать ветку `codex/broker-dashboard-redesign`.
|
||
- [x] Запустить baseline: `rtk npm run test:backend && rtk npm run test:frontend && rtk npm run test:design-system`.
|
||
- [x] Написать `spec.md`.
|
||
- [x] Написать `plan.md`.
|
||
|
||
## Реализация
|
||
|
||
- [x] Добавить pure helpers для фильтрации и суммирования доходных операций dashboard.
|
||
- [x] Добавить helpers для фильтров дат, пресетов, валидации и mapping income types → operationTypes.
|
||
- [x] Добавить dashboard presentation helpers для fallback, event labels и statuses.
|
||
- [x] Добавить локальный `BrokerDashboardCard` pattern или точечно расширить DS, если локального pattern недостаточно.
|
||
- [x] Добавить `BrokerDashboardHero` с KPI по portfolio и analytics.
|
||
- [x] Добавить `BrokerDashboardEventsCard` на основе `useBrokerEvents`.
|
||
- [x] Добавить `BrokerDashboardIncomeCard` на основе `useBrokerOperations`.
|
||
- [x] Перенести навигацию счёта из левой колонки в горизонтальные вкладки над контентом.
|
||
- [x] Перестроить dashboard на один блок на строке для `События`, `Доходы`, `Аналитика доходности`, `Аллокация`.
|
||
- [x] Добавить кликабельные chip-фильтры типов для `События`.
|
||
- [x] Добавить `BrokerDashboardDateFilter` — переиспользуемый expandable-компонент фильтра дат (пресеты 7д/30д/90д/1г/Всё, from/to поля, Сбросить/Показать).
|
||
- [x] Подключить `BrokerDashboardDateFilter` в `События` с draft/applied состоянием.
|
||
- [x] Добавить локальную пагинацию по 10 событий в `События`.
|
||
- [x] Добавить кликабельные chip-фильтры типов для `Доходы`.
|
||
- [x] Подключить `BrokerDashboardDateFilter` в `Доходы` с draft/applied состоянием.
|
||
- [x] Добавить cursor-пагинацию по 10 операций в `Доходы`.
|
||
- [x] Добавить `BrokerDashboardAnalyticsCard` на основе `useBrokerAnalytics`.
|
||
- [x] Добавить `BrokerDashboardAllocationCard` на основе существующей аллокации.
|
||
- [x] Добавить `BrokerDashboardSkeleton`.
|
||
- [x] Добавить `BrokerDashboard` как top-level composition widget.
|
||
- [x] Заменить текущий вертикальный обзор в `BrokerAccountOverviewPage` на `BrokerDashboard`.
|
||
- [x] Добавить unit/component tests для helpers и базовой dashboard composition.
|
||
- [x] Выровнять hero KPI: все Metric одной высоты, supportingText не раздвигает "Доходность" выше соседей.
|
||
- [x] Заменить donut-диаграмму аллокации на горизонтальные бары в `BrokerDashboardAllocationCard`.
|
||
- [x] Убрать слово `Фильтр` из пользовательского текста шапки периода в dashboard-карточках.
|
||
- [x] Переименовать действие `Показать` в управлении периодом и визуально улучшить шапку фильтров.
|
||
- [x] Заменить native date inputs на одно поле периода с popover и community `DateCalendar` из `@mui/x-date-pickers`.
|
||
- [x] Не использовать `@mui/x-date-pickers-pro` и `DateRangePicker`.
|
||
- [x] Настроить default range событий и доходов на `сегодня - 7 дней` / `сегодня`.
|
||
- [x] Заменить текстовую загрузку `События` на skeleton таблицы.
|
||
- [x] Заменить текстовую загрузку `Доходы` на skeleton таблицы.
|
||
- [x] Обновить component tests под новые тексты, единое поле периода, popover-календарь и skeleton loading states.
|
||
- [ ] Проверить desktop layout `/broker/2084014113`.
|
||
- [ ] Проверить mobile layout `/broker/2084014113`.
|
||
|
||
## Definition of Done
|
||
|
||
- [x] `rtk npm run test:frontend` проходит.
|
||
- [x] `rtk npm run test:design-system` проходит.
|
||
- [x] `rtk npm run lint -w apps/frontend` проходит.
|
||
- [x] `rtk npm run build:frontend` проходит.
|
||
- [ ] Dashboard соответствует acceptance criteria из `spec.md`.
|
||
- [x] Существующие вкладки `Акции`, `Облигации`, `Операции`, `События`, `Аналитика` остаются доступны.
|
||
- [x] `graphify update .` выполнен после code changes.
|