# Этап 6: общая оболочка и дашборд

Рабочая схема от 2026-09-20. Основа — ui-design-contract.md: ReUI PRO, base-nova, Frame, Sidebar 240 px. Поиск вызывается Ctrl+K/⌘K, тема остаётся в NavUser. Этап завершён в границах локальной приёмки; ограничения указаны ниже.

| Область | Референс | Результат |
| --- | --- | --- |
| Оболочка | [App Shell 12](https://reui.io/preview/base/app-shell-12?ref=mcp) | Контекст страницы, доступные действия, меню и поиск с клавиатуры |
| Сводка | [Stats 12](https://reui.io/preview/base/stats-12?ref=mcp) | KpiStatGrid/IconTile во Frame, предметные подписи, неизвестное значение — «—» |
| Очередь проблем | [List 9](https://reui.io/preview/base/list-9?ref=mcp) | Проблема → объект → доступное действие |

## ПК

```text
┌ Навигация 240 px ┬ Путь страницы · Действия · Приложения · Монитор ┐
│ Обзор           ├ Свежесть / ошибки источников / обновить         │
│ Данные          ├ Сводка: серверы · туннели · BGP · проверки       │
│ Управление      ├ Очередь проблем → сервер / профильный раздел    │
│ Инструменты     ├ Измерения и события                             │
│ Система         │ Быстрые переходы                               │
└─────────────────┴─────────────────────────────────────────────────┘
```

## Телефон

```text
┌ Меню · Текущая страница                     ┐
│ Действия с переносом · Приложения · Монитор │
├ Свежесть / ошибки источников               ┤
│ Сводка в адаптивной сетке                   │
│ Очередь проблем → объект                   │
│ Измерения → события → быстрые переходы     │
└────────────────────────────────────────────┘
```

На страницах без действий служебные кнопки остаются рядом с заголовком. При наличии действий и ширине менее 1280 px выделяется дополнительная строка с переносом кнопок. DOM-порядок совпадает с визуальным и клавиатурным, текущий заголовок не скрывается многоточием. На ПК сохраняется компактная строка, при нехватке места шапка растёт по высоте.

## Блоки и приёмка

1. **Шапка.** Убрать фиксированную высоту и обрезку; текущая страница видна на телефоне; корректный список Breadcrumb. Проверить 320/390/1024/1440 px, клавиатуру и Escape.
2. **Навигация.** Общий источник названий, адресов и поисковых синонимов для Sidebar и CommandPalette. Использовать установленные Command/Dialog для фокуса, поиска, клавиатуры и семантических цветов. Закрывать мобильное меню после перехода. Сверить маршруты с существующими страницами.
3. **Дашборд.** Уточнить подписи «Флот», «Оверлей», «BGP Rx», «Здоровье». Поднять очередь проблем после сводки, дать контекст и переходы к объектам. Сохранить состояния источников этапа 5; отсутствие данных не считать отсутствием проблем. Быстрые переходы не должны вытеснять проблемы за первый экран.
4. **Приёмка.** Просмотреть ПК/телефон, проверить переходы, пустое состояние, частичный сбой и клавиатуру; профильные тесты, 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=<id>, /uptime?probe=<id>, /gre?server=<serverId>&tunnel=<id>, /wireguard?server=<serverId>&interface=<id>, /vxlan?server=<serverId>&tunnel=<id>. Идентификаторы кодируются 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-компонентов нет.