Màn Hình: Danh Sách Sự Kiện (Event List)
Ngày tạo: 01/07/2026
Loại: Giao diện ứng dụng (APP UI) — Danh sách Sự kiện chính
Ảnh tham chiếu:
- [Ảnh màn hình danh sách sự kiện](./images/Event (1).png)
1. Mô Tả Chung
Đây là màn hình trung tâm của tính năng Sự kiện (Event). Màn hình này cung cấp lối vào các sự kiện cá nhân đã đăng ký, danh sách các sự kiện nổi bật (HOT) dưới dạng thanh cuộn ngang, và toàn bộ sự kiện hiện có dưới dạng danh sách cuộn dọc.
2. Chi Tiết Giao Diện & Thành Phần
.png)
| Thành phần | Loại phần tử | Chi tiết hiển thị / Hành vi |
|---|---|---|
| Thanh Tiêu đề (Header) | Navigation Bar | Màu nâu đậm chứa nút Back (<-) và tiêu đề chính "Event" căn giữa. |
| Sự kiện của bạn | Navigation Card | Thẻ màu trắng bo góc chứa icon vé G vàng, tiêu đề "Sự kiện của bạn", số lượng sự kiện đã đăng ký ("3 sự kiện") và mũi tên sang phải để điều hướng tới Sự kiện của bạn. |
| Mục "Sự kiện HOT" | Horizontal Scroll | Danh sách các sự kiện nổi bật cuộn ngang. |
| Card Sự kiện HOT | Card | Gồm hình ảnh minh họa lớn ở trên, nhãn "Đang mở" góc trái, tiêu đề sự kiện đầy đủ ở dưới kèm thông tin thời gian, địa điểm và chi phí ("Miễn phí"). Nhấp vào để xem Chi tiết Sự kiện. |
| Mục "Tất cả sự kiện" | Vertical Scroll | Danh sách cuộn dọc toàn bộ sự kiện hiện có trên hệ thống. |
| Card Tất cả sự kiện | List Item | Bố cục dạng dòng ngang: Ảnh đại diện bên trái (có nhãn "Đang mở" đè lên), tiêu đề rút gọn ("Lorem ipsum non viv..."), thời gian, địa điểm và chi phí ở bên phải. Nhấp vào để xem Chi tiết Sự kiện. |
3. Luồng Nghiệp Vụ & Logic Hoạt Động
- Điều hướng từ Sự kiện của bạn: Nhấn vào thẻ "Sự kiện của bạn" để chuyển tới màn hình Sự kiện của bạn.
- Xem chi tiết sự kiện: Nhấn vào bất kỳ thẻ sự kiện nào trong danh sách "Sự kiện HOT" hoặc "Tất cả sự kiện" để mở trang Chi tiết Sự kiện.
- Cuộn trang:
- Phần "Sự kiện HOT" hỗ trợ vuốt sang trái/phải để xem các sự kiện nổi bật khác.
- Phần dưới hỗ trợ cuộn dọc để duyệt qua toàn bộ sự kiện.