📌 Overview
Merge Request này triển khai chức năng Quản lý Thẻ (Cards Management) trên trang Admin Portal (admin/):
- Trang danh sách thẻ (Cards List) theo dõi số dư, trạng thái hoạt động và bộ lọc thẻ Reap.
- Trang chi tiết thẻ (Card Detail Page) hiển thị đầy đủ thông tin hạn mức, số dư và user liên kết.
- Tích hợp danh sách thẻ vào trang chi tiết người dùng (User Detail).
- Chuẩn hóa phân trang đa ngôn ngữ (i18n) và sắp xếp server-side cho bảng thẻ.
🚀 Key Changes
1. Cards Management (admin/src/features/cards/)
-
Cards List Page (
/cards): Hiển thị danh sách thẻ, hỗ trợ filter theo trạng thái (ACTIVE,INACTIVE,BLOCKED,...), sắp xếp theo số dư / ngày tạo và phân trang. -
Card Detail Page (
/cards/:cardId): Xem chi tiết thông tin thẻ, trạng thái hoạt động, hạn mức (lifetime/monthly limits), số dư đã lưu và người sở hữu. -
Schemas & Service:
-
card-balance-schema.ts: Zod schemas cho thông tin thẻ và chi tiết số dư. -
reap-cards.service.ts: Gọi API Reap Cards từ backend. -
use-card-balances.ts,use-card-detail.ts,query-keys.ts: React Query hooks quản lý cache dữ liệu. -
card-balances-filter-store.ts: Quản lý state bộ lọc danh sách thẻ.
-
2. User Detail Integration (admin/src/features/users/)
- Bổ sung bảng danh sách thẻ của user trong trang chi tiết user (
user-detail-page.tsx). - Thêm hook
use-user-cards.tslấy danh sách thẻ gắn vớiuserId.
3. Routing & i18n
- Đăng ký routes
/cardsvà/cards/:cardIdtrongroutes.tsx. - Thêm formatters
date-time.tsvàdecimal.tscho số dư và thời gian. - Hỗ trợ đa ngôn ngữ cho toàn bộ nhãn thẻ và điều khiển phân trang trong
vi.jsonvàen.json.
🧪 Verification
-
TypeScript type-check thành công ( pnpm type-check). -
Vite build thành công ( pnpm build). -
Đã cập nhật đầy đủ file ngôn ngữ ( vi.jsonvàen.json). -
Không dính file hoặc thay đổi từ các module khác (lending, dashboard).