Skip to main content

Trang Chủ: Bố Cục Chi Nhánh & Chuyên Mục BigFan

Ngày cập nhật: 20/06/2026
File ảnh gốc: z7956731455045_66f16c8e05cd8ca34f241d856fceecef.jpg

Tài liệu này ghi nhận các yêu cầu chỉnh sửa thiết kế giao diện (UI) và logic vận hành trên màn hình Trang chủ (Home) đối với phần danh sách chi nhánh và chuyên mục BigFan.

1. Tối Ưu Bố Cục Danh Sách Chi Nhánh (Branch Section)​

  • Hiện trạng: Các nút icon hình tròn của chi nhánh hiển thị kích thước quá nhỏ và xếp quá khít nhau, gây chật chội về mặt thị giác và bất tiện khi click chọn trên thiết bị di động.

Giao diện Trang chủ và Yêu cầu

  • Yêu cầu chỉnh sửa:
    • Tăng kích thước icon: Điều chỉnh tăng size của các hình tròn icon chi nhánh lớn hơn (hiển thị rõ logo và thông tin thành phố bên dưới).
    • Nới rộng khoảng cách (Gap/Padding): Thêm margin/gap giữa các chi nhánh để giao diện thoáng đãng, dễ theo dõi và dễ thao tác cuộn ngang.

2. Đặc Tả Chuyên Mục BigFan (BigFan Section)​

  • Vấn đề hiện tại: Mục BigFan đang hiển thị dạng bài viết tin tức thủ công giống như mục Event (Sự kiện), không đúng với yêu cầu thiết kế động của hệ thống.

2.1. Yêu cầu về Giao diện (UI Layout)​

  • Nhân bản layout của Event: Tạo phần BigFan nằm ngay bên dưới phần Event, sử dụng lại (clone) chính xác layout dạng thẻ (Card Layout) cuộn ngang của phần Event để hiển thị các hoạt động.

2.2. Luồng dữ liệu tự động (Automated Activity Feed)​

  • Nội dung hiển thị trong các thẻ BigFan phải được cập nhật tự động 100% từ hệ thống (không đăng tay), lấy dữ liệu thời gian thực từ các sự kiện gửi quà tặng gần đây:
    • Khách hàng vừa nhận được Voucher tặng từ các chiến dịch.
    • Khách hàng vừa nhận được Voucher quà tặng sinh nhật (Vé Jjim Jil Bang).
    • Khách hàng vừa quay thưởng Minigame Vòng quay may mắn trúng Point hoặc Voucher.

2.3. Quy tắc bảo mật thông tin khách hàng (Masking Policy)​

Để bảo vệ thông tin cá nhân của hội viên khi public hoạt động lên màn hình chung, Backend bắt buộc phải mã hóa/ẩn danh một phần thông tin tên và số điện thoại của người nhận theo quy tắc sau:

  • Đối với Số điện thoại: Ẩn các chữ số ở giữa, chỉ giữ lại đầu số và 3 số cuối.
    • Ví dụ hiển thị: Khách hàng 090****123 vừa nhận được Voucher Vé Jjim Jil Bang nhân dịp sinh nhật!
  • Đối với Tên khách hàng: Ẩn phần đệm và tên lót, chỉ giữ lại họ và tên chính.
    • Ví dụ hiển thị: Nguyễn *** Anh vừa quay trúng 500 GPoint từ Vòng quay may mắn!