14 — Screen Matrix chính thức (CON · PAR · DRV · ADM)

Chốt 2026-07-29 · Nguồn: inventory FE + design-index + Swagger tags · Audit JPG trước đó. Doc này là source of truth cho: mockup còn thiếu · nav · RBAC · API trước khi code sâu. Gap JPG cũ: 13-FE-SCREEN-GAP-MATRIX.md

0. Legend

Quy tắc code sâu (Step 5): một vertical = List → Detail → Create/Edit → Action → Success/Error → History Không ship màn rời ngoài chuỗi này.

Ưu tiên code (chốt): Driver → Admin → Shared KYC/Chat/Wallet → Partner forms → Error states CON

1. Board bổ sung (14) — Step 2

Chưa có file JPG → trạng thái mockup = N. Spec panel ở design-boards/. Khi design xong: thả JPG root + cập nhật design-index.md + cột Có mockup → Y.

Tổng: 3 Driver + 4 Admin + 3 Shared + 4 Partner forms = 14 boards.

2. Screen Matrix — Driver (ưu tiên #1)

Nav DRV (chốt): AuthStack(Login|Register|Kyc) → MainTabs: Home | Trips | Wallet | Ratings | Account Online toggle chỉ trên Home. In-trip = modal/stack trên Trips.

3. Screen Matrix — Admin (ưu tiên #2)

Nav ADM (chốt) — WP-FE-ADM-IA-01: Sidebar: Tổng quan · Duyệt hồ sơ eKYC / Đối tác / Tài xế / Agent AI · Vận hành Chuyến & đơn / Sổ ví / Hỗ trợ · Đặt chỗ KS / Khám / Thuốc / Trường / Trọ / Đỗ · Bản đồ Điểm POI / Xăng · Hệ thống Phân quyền / Nội dung & KM / Health. Role: chỉ ADMIN. Gap UI (chưa API admin): Social/Review/Chat mod · ATM/sạc/buýt CMS · Bills/QR/Home · Payment ops — DASHBOARD-AUDIT-PLAN.

4. Screen Matrix — Shared KYC / Chat / Wallet (ưu tiên #3)

5. Screen Matrix — Partner forms (ưu tiên #4)

Nav PAR (chốt): Auth → Onboarding/KYC → Home (chọn vertical) → mỗi vertical: Overview | Ops(List) | Catalog/Form | Finance | Account Role JWT: PARTNER_OWNER · PARTNER_STAFF (scope store) · LANDLORD · DOCTOR.

6. Screen Matrix — Consumer (tóm tắt + Error ưu tiên #5)

CON MVP hầu hết DONE (≈100 screens). Dưới đây chỉ gap / error còn theo ưu tiên.

Nav CON (chốt — hiện tại giữ): MainTabs: Map | Reels | Social | Chat | Account Services qua MapStack. Role: USER.

7. RBAC & Surfaces (Step 3 — chốt)

Capability tài xế (không phải Role): RIDE · COURIER · DELIVERY · SCHOOL_TRIP — ROLE-MATRIX.md · GET /users/me/hats.

Guard BE: JwtAuthGuard + RolesGuard + HatSplitInterceptor + ownership filter (storeId/orgId từ JWT, không tin client).

flowchart TB
  subgraph CON["mobile USER"]
    M[Map] --> S[Service stacks]
    R[Reels] --> Soc[Social]
    C[Chat]
    A[Account / Wallet / KYC]
  end
  subgraph PAR["partner roles"]
    PH[Home vertical picker] --> VT[Overview/Ops/Form/Finance/Account]
  end
  subgraph DRV["driver DRIVER"]
    DH[Home online] --> DT[Trips] --> DW[Wallet] --> DR[Ratings] --> DA[Account]
  end
  subgraph ADM["dashboard ADMIN"]
    AO[Overview] --> Q[KYC/Partner/Driver]
    Q --> OPS[Ops/Ledger/Support]
    OPS --> CMS[CMS/Promo]
  end
  API[(api/v1 JWT)]
  CON --> API
  PAR --> API
  DRV --> API
  ADM --> API

8. API contract & data states (Step 4 — chốt)

8.1 Tag ↔ surface (không mở API thứ hai)

8.2 Entity lifecycle (trước khi code sâu)

8.3 Rule trước code

1. Endpoint đã có trên /docs với DTO — không invent URL FE.
2. Response lỗi: Nest HttpException → FE map Empty | Error | Offline (SCR-SYS).
3. Realtime chỉ /chat và /rides (đã IMP).
4. Payment live secret = stop-gate (MOCK local OK).

9. Hàng đợi implement (Step 5)

Làm 1 WP / turn, vertical đủ chuỗi L→D→C/E→A→S/E→H.

| 7 | WP-FE-ADM-04 | ADM | BOARD-ADM-04 | CMS edit · Promo admin · Broadcast | IMP |

tiếp (P5f) → DONE_QUEUE. Journey còn thiếu → Wave P6 15 §5–6 (Rate · FNB Success · DRV History/Cancel · PAR bind).

9b. Gap journey còn mở (sync 2026-07-30 — chi tiết ở doc 15)

10. Liên kết