7.6 KiB
Этап 6: общая оболочка и дашборд
Рабочая схема от 2026-09-20. Основа — ui-design-contract.md: ReUI PRO, base-nova, Frame, Sidebar 240 px. Поиск вызывается Ctrl+K/⌘K, тема остаётся в NavUser. Этап завершён в границах локальной приёмки; ограничения указаны ниже.
| Область | Референс | Результат |
|---|---|---|
| Оболочка | App Shell 12 | Контекст страницы, доступные действия, меню и поиск с клавиатуры |
| Сводка | Stats 12 | KpiStatGrid/IconTile во Frame, предметные подписи, неизвестное значение — «—» |
| Очередь проблем | List 9 | Проблема → объект → доступное действие |
ПК
┌ Навигация 240 px ┬ Путь страницы · Действия · Приложения · Монитор ┐
│ Обзор ├ Свежесть / ошибки источников / обновить │
│ Данные ├ Сводка: серверы · туннели · BGP · проверки │
│ Управление ├ Очередь проблем → сервер / профильный раздел │
│ Инструменты ├ Измерения и события │
│ Система │ Быстрые переходы │
└─────────────────┴─────────────────────────────────────────────────┘
Телефон
┌ Меню · Текущая страница ┐
│ Действия с переносом · Приложения · Монитор │
├ Свежесть / ошибки источников ┤
│ Сводка в адаптивной сетке │
│ Очередь проблем → объект │
│ Измерения → события → быстрые переходы │
└────────────────────────────────────────────┘
На страницах без действий служебные кнопки остаются рядом с заголовком. При наличии действий и ширине менее 1280 px выделяется дополнительная строка с переносом кнопок. DOM-порядок совпадает с визуальным и клавиатурным, текущий заголовок не скрывается многоточием. На ПК сохраняется компактная строка, при нехватке места шапка растёт по высоте.
Блоки и приёмка
- Шапка. Убрать фиксированную высоту и обрезку; текущая страница видна на телефоне; корректный список Breadcrumb. Проверить 320/390/1024/1440 px, клавиатуру и Escape.
- Навигация. Общий источник названий, адресов и поисковых синонимов для Sidebar и CommandPalette. Использовать установленные Command/Dialog для фокуса, поиска, клавиатуры и семантических цветов. Закрывать мобильное меню после перехода. Сверить маршруты с существующими страницами.
- Дашборд. Уточнить подписи «Флот», «Оверлей», «BGP Rx», «Здоровье». Поднять очередь проблем после сводки, дать контекст и переходы к объектам. Сохранить состояния источников этапа 5; отсутствие данных не считать отсутствием проблем. Быстрые переходы не должны вытеснять проблемы за первый экран.
- Приёмка. Просмотреть ПК/телефон, проверить переходы, пустое состояние, частичный сбой и клавиатуру; профильные тесты, TypeScript, lint и production build общей оболочки.
HTTP-моки проверяют интерфейс и запросы. Реальные данные, права и RouterOS требуют тестового окружения. Формы и полный URL-контекст сервера относятся к этапу 7; сетевые операции в этапе 6 не менять.
Состояние реализации
Шапка, навигация, иерархия дашборда и переходы ко всем типам объектов очереди завершены. Итоговая приёмка этапа: 68 E2E-сценариев passed; production build и TypeScript успешны. Проверены клавиатура, светлая/тёмная навигация, ширины шапки 320/390/1024/1440, контекст туннелей на ПК/телефоне, ошибки HTTP и возврат. Подробнее — ux-ui-progress.md.
Переходы к объектам
Готовы и проверены: /servers?server=, /uptime?probe=, /gre?server=&tunnel=, /wireguard?server=&interface=, /vxlan?server=&tunnel=. Идентификаторы кодируются encodeURIComponent, целевые страницы выбирают точный ID (для туннелей — пару сервер/объект) и сообщают об отсутствии/ошибке загрузки. Снятие выбора сохраняет остальные query-параметры. GRE, WireGuard и VXLAN используют preserveSelection серверной панели, чтобы не сбрасывать URL при загрузке/отсутствии устройства. При отсутствии VXLAN сообщение не делает вывода об удалении: backend скрывает ошибки отдельных опросов. Исправление этого API и достоверность сетевых KPI — этап 9.
Границы приёмки
HTTP-моки подтверждают UI и запросы; RouterOS и реальные права требуют отдельного окружения. Полная адаптивность профильных таблиц/форм не входит в эту приёмку: известная обрезка строк Ping-проб — этап 7, сетевые формы и действия — этап 9. Прежние lint-замечания общих компонентов перечислены в журнале; чистый lint всего проекта не заявляется. ReUI Frame/base-nova, установленные Alert, DataGrid, Command/Dialog и ServerRail сохранены; новых зависимостей и изменений vendored-компонентов нет.