Appearance
Unified Header + Chat Product Context
Summary
Two improvements:
- Unified header — extract full header from
default.vueintoAppHeaderwidget, use in all layouts (default, cabinet, admin) - Chat product context — add product strip in message thread + improve product visibility in conversation list
1. Unified AppHeader Widget
What
Full navigation header (logo, city, search, "Продать", favorites badge, chat badge, user profile, admin link, theme toggle) shown across all layouts.
Changes
- New:
app/widgets/header/ui/AppHeader.vue— extracted fromdefault.vueinline header - Modified:
app/layouts/default.vue— replace inline header with<WidgetsHeaderAppHeader /> - Modified:
app/layouts/cabinet.vue— replace simplified header with<WidgetsHeaderAppHeader />, remove "Messages" from sidebar (already in header) - Modified:
app/layouts/admin.vue— replace admin header with<WidgetsHeaderAppHeader />, sidebar stays
Design
- No props — widget reads from stores (
useAuthStore,useChatStore,useFavoritesStore,useGeoStore) - Desktop: logo → city → search → "Продать" → favorites(badge) → chat(badge) → username → admin(if admin) → theme → logout
- Mobile: logo → search icon → hamburger → USlideover with full menu
- Remove "Messages" from cabinet sidebar (desktop + mobile drawer) to avoid duplication
2. Chat Product Context
2a. Product Strip in Message Thread (/cabinet/messages/[id])
Compact sticky bar above messages:
[thumbnail 40x40] Title (truncated) ₽ price [→ link]- Data from
conversation.product(already loaded) sticky top-0— stays visible while scrolling- Link to
/product/{id} - Fallback: "Объявление недоступно" if product missing
2b. Improved ConversationCard (entities/conversation/ui/ConversationCard.vue)
- Product thumbnail more prominent
- Price shown explicitly next to product title
- Product title on separate line above last message preview, bolder styling
Files Changed
| File | Action |
|---|---|
app/widgets/header/ui/AppHeader.vue | Create — unified header widget |
app/layouts/default.vue | Modify — use AppHeader |
app/layouts/cabinet.vue | Modify — use AppHeader, remove Messages from sidebar |
app/layouts/admin.vue | Modify — use AppHeader |
app/pages/cabinet/messages/[id].vue | Modify — add product strip |
app/entities/conversation/ui/ConversationCard.vue | Modify — improve product display |
Not Changed
- Sidebars (cabinet/admin) — remain, just remove Messages link from cabinet
- Stores, composables, schemas — no changes
- Routing, middleware — no changes