89 lines
5.4 KiB
Markdown
89 lines
5.4 KiB
Markdown
# Kế hoạch Thiết lập Cấu trúc và Tập tin Cơ bản Dự án GeoSport Log
|
|
|
|
Dự án này sẽ chuyển đổi phiên bản Web Prototype của GeoSport Log thành một ứng dụng di động chạy trên iOS và Android sử dụng React Native (Expo SDK), TypeScript, SQLite và NativeWind (Tailwind CSS cho Mobile).
|
|
|
|
## User Review Required
|
|
|
|
> [!IMPORTANT]
|
|
> Chúng ta sẽ khởi tạo dự án Expo sử dụng template mặc định (hỗ trợ sẵn TypeScript & Expo Router) ngay tại thư mục hiện tại (`/home/locpham/geosportlog`).
|
|
> Một số tập tin mặc định của Expo sẽ được thay thế hoặc tổ chức lại theo đúng cấu trúc thư mục quy định tại mục 3 của `TECH_DESIGN.md`.
|
|
|
|
## Open Questions
|
|
|
|
Không có câu hỏi mở. Chúng ta sẽ tiến hành cấu hình theo đúng đặc tả kỹ thuật chi tiết của `TECH_DESIGN.md`.
|
|
|
|
## Proposed Changes
|
|
|
|
Chúng ta sẽ khởi tạo cấu trúc thư mục chính xác như sau:
|
|
- `assets/` - Tài nguyên tĩnh.
|
|
- `src/` - Thư mục gốc chứa mã nguồn.
|
|
- `app/` - Các màn hình định tuyến bằng Expo Router (Auth, Tabs, Replay).
|
|
- `components/` - Các thành phần giao diện dùng chung (Common, Map, Replay, Analytics).
|
|
- `constants/` - Quản lý Colors và Config.
|
|
- `database/` - Cơ sở dữ liệu SQLite và Repositories.
|
|
- `hooks/` - Các Custom Hooks cho GPS, BLE, Weather, Calendar.
|
|
- `services/` - Kết nối BLE và Weather API.
|
|
- `store/` - Zustand global state.
|
|
- `types/` - Type Safety cho database và workout.
|
|
- `utils/` - Các hàm tiện ích thuần logic.
|
|
|
|
Các tập tin cấu hình cốt lõi và mã nguồn cơ bản sẽ được tạo lập:
|
|
|
|
### Cấu hình Dự án
|
|
|
|
#### [MODIFY] [app.json](file:///home/locpham/geosportlog/app.json)
|
|
Cập nhật quyền định vị chạy ngầm (iOS & Android), Camera, Photo Library, Micro và các plugin cần thiết theo mục 2 của `TECH_DESIGN.md`.
|
|
|
|
#### [MODIFY] [tsconfig.json](file:///home/locpham/geosportlog/tsconfig.json)
|
|
Cấu hình alias `@/*` ánh xạ tới thư mục `/src/*` theo mục 4 của `TECH_DESIGN.md`.
|
|
|
|
#### [NEW] [tailwind.config.js](file:///home/locpham/geosportlog/tailwind.config.js)
|
|
Cấu hình NativeWind để hỗ trợ styling bằng Tailwind CSS trên mobile.
|
|
|
|
### Phân lớp Dữ liệu và Quản lý Trạng thái (Persistence & State)
|
|
|
|
#### [NEW] [sqlite.ts](file:///home/locpham/geosportlog/src/database/sqlite.ts)
|
|
Khởi tạo kết nối SQLite cục bộ, định nghĩa lược đồ (schema) cho bảng `workouts`, `trackpoints`, và `media_attachments` theo thiết kế tại mục 5.
|
|
|
|
#### [NEW] [useWorkoutStore.ts](file:///home/locpham/geosportlog/src/store/useWorkoutStore.ts)
|
|
Zustand store để quản lý trạng thái tập luyện thời gian thực, tính toán cự ly/năng lượng và lưu trữ dữ liệu vào SQLite theo thiết kế tại mục 6.
|
|
|
|
### Phân lớp Màn hình (Expo Router Screens)
|
|
|
|
#### [NEW] [index.tsx](file:///home/locpham/geosportlog/src/app/(tabs)/index.tsx)
|
|
Màn hình HUD ghi nhận hành trình chạy bộ/đạp xe kết hợp bản đồ GPS thời gian thực và theo dõi chỉ số sức khỏe (BPM, Kcal).
|
|
|
|
#### [NEW] [analytics.tsx](file:///home/locpham/geosportlog/src/app/(tabs)/analytics.tsx)
|
|
Dashboard thống kê tổng quan và vẽ biểu đồ xu hướng bằng `react-native-chart-kit`.
|
|
|
|
#### [NEW] [history.tsx](file:///home/locpham/geosportlog/src/app/(tabs)/history.tsx)
|
|
Nhật ký lịch tập sử dụng `react-native-calendars` để đánh dấu các ngày tập và liệt kê danh sách hoạt động.
|
|
|
|
#### [NEW] [_layout.tsx](file:///home/locpham/geosportlog/src/app/(tabs)/_layout.tsx)
|
|
Cấu hình giao diện và định tuyến cho Bottom Tab Bar.
|
|
|
|
#### [NEW] [id.tsx](file:///home/locpham/geosportlog/src/app/replay/[id].tsx)
|
|
Màn hình trình phát Cinematic POV chạy dọc theo lộ trình GPS, dừng lại để phát video/ảnh gắn mốc địa lý kèm HUD lớp phủ đẹp mắt.
|
|
|
|
#### [NEW] [_layout.tsx](file:///home/locpham/geosportlog/src/app/_layout.tsx)
|
|
Root Layout khởi tạo cấu hình chung, DB Connection, và các nhà cung cấp trạng thái.
|
|
|
|
### Phân lớp Tiện ích, Kiểu dữ liệu và Các dịch vụ khác (Skeletons)
|
|
|
|
Để hoàn thiện bộ khung dự án và tránh lỗi import, chúng ta sẽ tạo các tập tin skeleton sau:
|
|
- [workout.types.ts](file:///home/locpham/geosportlog/src/types/workout.types.ts): Định nghĩa kiểu dữ liệu `Trackpoint`, `MediaAttachment`, `Workout`.
|
|
- [calculations.ts](file:///home/locpham/geosportlog/src/utils/calculations.ts): Công thức Haversine tính khoảng cách và công thức MET tính Kcal.
|
|
- [weatherService.ts](file:///home/locpham/geosportlog/src/services/weatherService.ts): Mock/Call Open-Meteo API lấy thông tin thời tiết.
|
|
- [Colors.ts](file:///home/locpham/geosportlog/src/constants/Colors.ts) & [Config.ts](file:///home/locpham/geosportlog/src/constants/Config.ts): Mã màu tối tối giản & cấu hình MET.
|
|
- Các tập tin Repository, Service, Hook, Utility trống khác dưới dạng skeleton để nhà phát triển điền tiếp nội dung sau.
|
|
|
|
---
|
|
|
|
## Verification Plan
|
|
|
|
### Automated Tests
|
|
- Chạy `tsc --noEmit` để đảm bảo dự án biên dịch thành công mà không có lỗi kiểu dữ liệu TypeScript.
|
|
|
|
### Manual Verification
|
|
- Xác minh sự tồn tại của đầy đủ các thư mục và tập tin cơ bản theo đúng thiết kế hệ thống.
|