Карта фронтенда

Последняя сверка с кодом: 2026-06-14
Стек: Nuxt 4, гибрид SSR (ssr: true + routeRules), Vue 3, Pinia, SCSS UI-kit, @eventpass/api
SSR / SEO: 26-ssr-migration.md
Связанные доки: 03-backend-map · 00-product-overview

---

1. Разделы приложения

Раздел	URL (примеры)	Layout	Auth	Назначение
Маркетинг	/, /pricing, /terms, /privacy	landing	—	Лендинг, тарифы, legal
Auth redirect	/login, /auth/:view	(redirect)	—	Увод на /?auth=… → модалка
Гостевой альбом	/:id, /:id/share	default	опционально	Альбом, QR, ссылки
Wall	/:id/wall	fullscreen	опционально	Слайдшоу на экране
Join MEMBER	/:id/join	default	при join	Вступление по инвайт-токену
Аккаунт	/account, /my-events, /profile	cabinet	auth	Дашборд, список, профиль
Админка события	/:id/manage, settings, members, moderate	cabinet	role middleware	Управление событием
Платформа	/admin/users, events, plans	cabinet	require-super-admin	SUPER_ADMIN
Dev	/dev/ui-kit, /dev/api	default	—	Только разработка

SSR (серверный HTML + OG): /, /pricing, /terms, /privacy, /:id, /:id/share, /:id/manage, /:id/settings, /:id/members.
Client-only (ssr: false): wall, join, moderate, /admin/**, /account/**, upload-интерактив.

---

2. Все страницы (app/pages/)

URL	Файл	Layout	Middleware	Основной API
/	index.vue	landing	—	POST /api/events (через CreateEventForm)
/pricing	pricing.vue	landing	—	GET /api/plans
/terms, /privacy	terms.vue, privacy.vue	landing	—	—
/login, /register, …	auth/[view].vue + алиасы	—	redirect	—
/account	cabinet/index.vue	cabinet	auth	GET /api/events/my
/my-events	my-events.vue	cabinet	auth	GET /api/events/my
/profile	profile.vue	cabinet	auth	Better Auth + GET /api/users/me
/:id	[id]/index.vue	default	—	GET /api/events/:id, …/media, SSE
/:id/share	[id]/share.vue	default	—	GET /api/events/:id
/:id/wall	[id]/wall.vue	fullscreen	—	GET …/media, GET …/stream
/:id/join	[id]/join.vue	default	—	POST /api/events/:id/join
/:id/manage	[id]/manage.vue	cabinet	require-event-admin	media list, ZIP, delete
/:id/settings	[id]/settings.vue	cabinet	require-event-owner	GET/PATCH …/settings, branding
/:id/members	[id]/members.vue	cabinet	require-event-admin	members, invite link
/:id/moderate	[id]/moderate.vue	cabinet	require-event-admin	PATCH /api/media/:id/moderation
/admin	admin/index.vue	cabinet	auth + super-admin	redirect → /admin/users
/admin/users	admin/users.vue	cabinet	auth + super-admin	GET /api/admin/users
/admin/events	admin/events.vue	cabinet	auth + super-admin	GET /api/admin/events
/admin/plans	admin/plans.vue	cabinet	auth + super-admin	GET /api/admin/plans

---

3. Layouts

Layout	Файл	Header	Sidebar	Когда
landing	layouts/landing.vue	AppSiteHeader (public)	—	Маркетинг
default	layouts/default.vue	AppSiteHeader (public)	—	Альбом, share, join
cabinet	`layout: account)	AdminSidebar	Аккаунт, админка
fullscreen	layouts/fullscreen.vue	—	—	Wall

Глобально в app.vue: <AuthModal /> — auth UI на всех страницах.

Ошибки доступа: не отдельная /403, а UiPageError в cabinet main или inline на странице (useRouteAccessError).

---

4. Middleware (route guards)

Имя	Файл	Логика
auth	middleware/auth.ts	Не залогинен → модалка + /
require-event-admin	require-event-admin.ts	GET …/access → canAdmin
require-event-owner	require-event-owner.ts	GET …/access → role OWNER
require-super-admin	require-super-admin.ts	GET /api/users/me → SUPER_ADMIN
guest-only	guest-only.ts	Залогинен → /account
clear-route-access (global)	clear-route-access.global.ts	Сброс inline-ошибки при смене route

Неавторизованный доступ: utils/unauthenticatedAccess.ts (без цикла ?auth=).

---

5. Composables по разделам

Composable	Раздел	Назначение
useAuth	Auth	Сессия, signIn/Out, profile API
useAuthModal	Auth	Открытие модалки login/register/…
useAdminNav	Cabinet	Пункты sidebar (global + event + platform)
useAdminSidebar	Cabinet	Collapse / mobile drawer
usePlatformAdmin	Platform	SUPER_ADMIN profile, admin stats
useEventAccess	Event admin	canAdmin, isOwner по GET …/access
useRouteAccessError	Errors	Inline 403/401 для cabinet
useUploader	Album	Uppy + TUS → /api/tus
useEventStream	Album / Wall	SSE GET …/stream
useAlbumMediaRefresh	Album	Подмешивание новых media из SSE
useGuestName / useGuestNamePrompt	Album	Имя гостя в localStorage
useMediaSelection	Album / Admin	Multi-select для ZIP
usePricingPlans / usePricingMarketing	Marketing	Тарифы с API
useEventBrandingStyles	Album / Wall	CSS из EventSettings
useToast	Global	Уведомления

Полный список: frontend/app/composables/*.ts.

---

6. Компоненты (дерево)

components/
├── ui/           # UiButton, UiInput, UiModal, UiPageError, …
├── layout/       # AppSiteHeader, SiteFooter
├── auth/         # AuthModal
├── brand/        # DReventLogo
├── domain/       # CreateEventForm, MediaGrid, QrShare, SlideshowPlayer, …
└── admin/        # AdminSidebar, AdminDataTable, PlatformAdminHeader, …

Domain — бизнес-логика UI. Ui — переиспользуемый kit (09-ui-kit.md).

---

7. Plugins и API-клиент

Файл	Роль
plugins/api.ts	Axios + @eventpass/api, interceptors, toasts
plugins/auth.client.ts	Init сессии при старте
plugins/auth-modal.client.ts	Sync ?auth= → модалка

API base: dev — proxy /api/** → :3002 (nuxt.config routeRules).

---

8. Поток данных (типичный альбом)

sequenceDiagram
  participant Page as /:id index.vue
  participant API as Express API
  participant TUS as /api/tus
  participant SSE as /api/events/:id/stream

  Page->>API: GET /events/:id
  Page->>API: GET /events/:id/media
  Page->>SSE: EventSource stream
  SSE-->>Page: new media event
  Page->>TUS: Uppy upload chunks
  TUS-->>API: onUploadFinish → Media row

---

9. Навигация sidebar (cabinet)

Источник: useAdminNav.ts.

Global: /account → /my-events → /profile

Event (когда route.params.id):

• /:id/manage — обзор
• /:id/members — команда
• /:id/moderate — модерация
• /:id/settings — только OWNER
• /:id — открыть альбом

Platform (SUPER_ADMIN): /admin/users, /admin/events, /admin/plans

---

10. i18n

Локали: frontend/i18n/locales/ru.json, en.json.
Стратегия: no_prefix (без /en/ в URL). Переключатель: UiLocaleSwitcher (в header при необходимости).

---

11. Где править код

Задача	Куда смотреть
Новая публичная страница	pages/ + layout: landing
Новый пункт аккаунта	useAdminNav.ts + pages/
Guard маршрута	middleware/ + definePageMeta
Auth UI	AuthModal.vue, 21-auth-frontend.md
Ошибки API в UI	utils/apiError.ts, pageLoadError.ts
SSR, OG, SEO	26-ssr-migration.md, useEventPageMeta.ts