vector/FRONTEND_README.md

SAR-MCHS Frontend

Структура приложения

Страницы

• AdminDashboard - Десктопная админ-панель с навигацией
• MobileFormPage - Мобильная форма создания карточки

Компоненты админ-панели

CasesList

• Таблица всех карточек пропавших
• Фильтры: пол, возраст, диагноз
• Переход к детальному просмотру

CaseDetail

• Детальная информация о карточке
• Психотип с рекомендациями по поиску
• Ответы на вопросы психотипирования

HeatmapView

• Интерактивная карта с тепловой картой находок
• Фильтры: возраст, сезон, период, исход
• Leaflet + leaflet.heat

Statistics

• Общая статистика по карточкам
• Разбивка по полу, возрасту, психотипам, диагнозам

Мобильная форма

MobileForm - адаптивная форма для создания карточки:

• Основная информация (возраст, пол)
• Диагнозы (чекбоксы)
• Психотипирование (4 вопроса)
• Валидация и отправка на API
• Сообщения об успехе/ошибке

Технологии

• React 18
• React Router v6
• Axios для API
• Leaflet для карт

Доступ

• Десктоп: http://192.168.0.108:3000/admin
• Мобильная форма: http://192.168.0.108:3000/mobile
• API Backend: http://192.168.0.108:8000
• Adminer: http://192.168.0.108:8080

Responsive дизайн

• Автоматический редирект на /mobile для мобильных устройств
• Адаптивная верстка для всех компонентов
• Breakpoint: 768px