WP-FIGMA-FN-PARK-01 — Bãi xe: chức năng trên hình

Domain: D-PARK · Surface: CON · Status: IMP · Date: 2026-08-15

Design

JPG 25af5769d09451ca088510.jpg (list+map · route · carousel · detail · filter)
Figma 25:1037 — MCP rate-limit → JPG

CTA trên hình	Kết quả
Search «Tìm bãi xe gần đây…» · filter	Overlay + sheet `ParkFilterModal`
Chip Tất cả / Trống nhiều / Sạc điện / Giá rẻ	Quick filter (EV heuristic tên/địa chỉ)
Pin giá · SẴN SÀNG / SẮP ĐẦY / HẾT CHỖ	Nearby map + cards (đã SYNC)
Chỉ đường / Bắt đầu dẫn đường	`RoutingDirections` → RouteSteps (không Google URL)
Bản đồ «Gợi ý gần bạn» + Chỉ đường	Carousel khi `mapExpanded` · «Xem tất cả» thu sheet
Filter 500m / 1km / 2km · Xe máy / Ô tô · Thấp nhất / Theo giờ / Qua đêm	Sheet copy khớp hình · Áp dụng (N) · Xóa bộ lọc
Tiện ích mái che / camera / rửa xe	Ưu tiên sort theo tên/địa chỉ (BE không có cột)
Detail Còn N chỗ · Chỉ đường · Gọi điện	Directions in-app · Gọi = Alert (lot không có phone)
Giá Xe máy / Ô tô · 2 giờ / Qua đêm · Đặt chỗ	Chọn hiển thị · `POST /parking/bookings` `endAt` 2h/12h
Pay-ok dẫn đường · lịch đặt	`ParkingPayOk` + `ParkingBookings` Chỉ đường (`lot.lat/lng`)
Share	Header detail + pay-ok

mobile/src/features/parking/components/ParkFilterModal.tsx
mobile/src/features/parking/parkFilter.ts
mobile/src/features/parking/screens/ParkingNearbyScreen.tsx
mobile/src/features/parking/screens/ParkingLotScreen.tsx
mobile/src/features/parking/screens/ParkingPayOkScreen.tsx
mobile/src/features/parking/screens/ParkingBookingsScreen.tsx
mobile/src/services/api.ts · mobile/src/navigation/types.ts
api/src/modules/parking/parking.service.ts (serialize booking lot.lat/lng — field sẵn có)

SĐT bãi / tel: — Prisma ParkingLot không có phone
Giá xe máy / qua đêm riêng — BE chỉ pricePerHour (ô tô); moto = ước tính UI; overnight = 12h × hourly
QR pay / bảo vệ 24/7 hardcoded — bỏ fake; chip tiện ích chỉ khi heuristic khớp
Loại xe filter list — lot không có vehicleType
Pixel Figma live — MCP Starter rate-limit