65 lines
4.3 KiB
Markdown
65 lines
4.3 KiB
Markdown
# Просмотр UI/UX правок
|
|
|
|
Ветка: `codex/ui-ux-guided-tour`.
|
|
|
|
## Локальный просмотр с вымышленными данными
|
|
|
|
Из папки `frontend`:
|
|
|
|
```sh
|
|
npm run build
|
|
npm run preview:demo
|
|
```
|
|
|
|
Откройте http://127.0.0.1:4174. Демо-вход: `demo` / `demo123`.
|
|
Это отдельный сервер с заявками в памяти; он не подключается к рабочему backend.
|
|
Перезапуск сбрасывает демонстрационные изменения. Номера телефонов вымышленные.
|
|
Остановить сервер: Ctrl+C. Демо-сервер не входит в production bundle.
|
|
|
|
## Что проверить
|
|
|
|
- Главная страница: быстрый переход к сегодняшним заявкам, календарь, ближайшие даты.
|
|
- Список: соседние дни, поиск, фильтры места загрузки/статуса, сброс фильтров.
|
|
- На телефоне дополнительные фильтры раскрываются кнопкой «Фильтры».
|
|
- Карточки: адрес и контакты первыми, крупные действия, условия доставки.
|
|
- Таблица: товар с загрузкой и клиент с контактами в одной ячейке.
|
|
- Изменение статуса сохраняет представление и соседние заявки; блокируется только текущая доставка.
|
|
- Перенос заявки сохраняет открытый день: перенесённая заявка исчезает из него, новая дата указана в подтверждении.
|
|
- Форма: отдельные группы, прокрутка содержимого, закреплённые действия; ошибки не стирают введённые данные.
|
|
- Escape закрывает диалог; с изменёнными данными запрашивается подтверждение. Во время сохранения закрытие и повторная отправка блокируются.
|
|
|
|
## Обучение
|
|
|
|
Два коротких тура: план доставок (4 шага), список (до 6 шагов).
|
|
Тур автоматически появляется при первом открытии соответствующего экрана после обновления.
|
|
Если заявок нет, шаги про конкретную заявку пропускаются.
|
|
«Пропустить», крестик и Escape завершают показ; «Помощь» повторяет тур текущего экрана.
|
|
|
|
Результат хранится в localStorage отдельно для каждого пользователя, версии тура и экрана.
|
|
На другом устройстве подсказки появятся снова. При недоступном хранилище тур остаётся работоспособным,
|
|
но после перезагрузки может появиться повторно.
|
|
|
|
Для следующего изменения рабочего процесса увеличьте `TOUR_VERSION`
|
|
в `src/components/ui/GuidedTour.tsx` и обновите соответствующие шаги.
|
|
Версия приложения сама по себе не запускает обучение заново.
|
|
|
|
## Проверки
|
|
|
|
```sh
|
|
npm run lint
|
|
npm test
|
|
npm run build
|
|
```
|
|
|
|
Регрессионные тесты проверяют перенос даты, проброс ошибки сохранения, независимость
|
|
обновления счётчиков от сохранения, локальное состояние смены статуса и гонку запросов разных дат.
|
|
|
|
Для проверки ошибки в демо перед следующим сохранением:
|
|
|
|
```sh
|
|
curl -X POST http://127.0.0.1:4174/__demo__/fail-next
|
|
```
|
|
|
|
Первое сохранение завершится ошибкой, повторное с теми же данными — успешно.
|
|
Этот служебный адрес существует только в демо-сервере.
|