service-finder/plans/logic_spec_fix_double_prefix_and_4level_arch.md

📐 Logic Spec: Fix Double API Prefix & Execute 4-Level Architecture

1. Modul célja és Masterbook 2 illeszkedés

Cél: A frontend járművek lekérésének javítása (Double API Prefix → 404 hiba), majd a jármű UI 4-szintű réteges architektúrájának kialakítása a kód-duplikáció megszüntetésével.

Masterbook 2.0 illeszkedés: A feladat az Epic 11 (Public Frontend) és a B2C Dashboard UX stabilizálásához tartozik.

---

2. Problémaelemzés

🔴 Bug #1: Double API Prefix Crash

Réteg	Fájl	Sor	Tartalom	Probléma
Env	frontend/.env	1	VITE_API_BASE_URL=https://dev.servicefinder.hu/api/v1	OK - base URL helyes
Axios	frontend/src/api/axios.ts:4	4	baseURL: import.meta.env.VITE_API_BASE_URL	OK - base URL = /api/v1
Store	frontend/src/stores/vehicle.ts:63	63	api.get('/api/v1/assets/vehicles')	🔴 HIBÁS - dupla prefix!
Eredmény URL			https://dev.servicefinder.hu/api/v1/api/v1/assets/vehicles	404 Not Found

🔴 Bug #2: Duplikált Mock Adatok

Fájl	Sorok	Tartalom
DashboardView.vue:368	368-426	MockVehicle interface + 3 mock vehicle
PrivateVehicleManager.vue:248	248-306	MockVehicle interface + 3 mock vehicle

---

3. 4-Level Architecture Design

Level 1: types/vehicle.ts       (VehicleData interface)
Level 2: data/mockVehicles.ts   (mock vehicles array)
Level 3: components/vehicle/    (3 új komponens)
Level 4: DashboardView + PrivateVehicleManager + VehicleDetailModal (refaktor)

Level 1: frontend/src/types/vehicle.ts

Unified VehicleData interface covering both API response and mock data.

Level 2: frontend/src/data/mockVehicles.ts

Single source of mock data, imported by all consumers.

Level 3: 3 új komponens

• VehiclePlateBadge.vue - EU plate badge (sm/md/lg sizes)
• VehicleCardCompact.vue - Mini dashboard card
• VehicleCardStandard.vue - Full carousel card

Level 4: Refaktor

• VehicleDetailModal áthelyezése dashboard/ → vehicle/
• DashboardView: inline card → VehicleCardCompact
• PrivateVehicleManager: inline card → VehicleCardStandard

---

4. Érintett fájlok

#	Fájl	Művelet
1	frontend/src/stores/vehicle.ts	JAVÍTÁS - /api/v1 prefix eltávolítása
2	frontend/src/types/vehicle.ts	LÉTREHOZÁS - VehicleData interface
3	frontend/src/data/mockVehicles.ts	LÉTREHOZÁS - mock adatok
4	frontend/src/components/vehicle/VehiclePlateBadge.vue	LÉTREHOZÁS
5	frontend/src/components/vehicle/VehicleCardCompact.vue	LÉTREHOZÁS
6	frontend/src/components/vehicle/VehicleCardStandard.vue	LÉTREHOZÁS
7	frontend/src/components/vehicle/VehicleDetailModal.vue	LÉTREHOZÁS (áthelyezve)
8	frontend/src/components/dashboard/VehicleDetailModal.vue	TÖRLÉS
9	frontend/src/views/DashboardView.vue	REFACTOR
10	frontend/src/components/dashboard/PrivateVehicleManager.vue	REFACTOR

---

5. Módosítási sorrend

1. vehicle.ts → Fix API prefix
2. types/vehicle.ts → Létrehozás
3. data/mockVehicles.ts → Létrehozás
4. VehiclePlateBadge.vue → Létrehozás
5. VehicleCardCompact.vue → Létrehozás
6. VehicleCardStandard.vue → Létrehozás
7. VehicleDetailModal.vue → Áthelyezés + típusosítás
8. DashboardView.vue → Refaktor (VehicleCardCompact)
9. PrivateVehicleManager.vue → Refaktor (VehicleCardStandard)
10. vite build → Verifikáció

---

⏸️ Jóváhagyási pont

Kérem a felhasználó jóváhagyását a fenti specifikációhoz!