UI_Bán Hàng POS
Giới thiệu & tài liệu liên quan
Đặc tả giao diện cho module Bán Hàng POS (OW-01). Xem thêm Tổng quan module · UC · SRS.
Quy tắc giỏ hàng chung
Đặt sân, FNB, Thuê dụng cụ và Bán dụng cụ được gộp vào một giỏ hàng chung trên cùng màn bán hàng — Thu ngân không phải mở nhiều màn riêng cho từng loại dịch vụ; tất cả thanh toán một lần.
Trạng thái ảnh chụp
Pickleball hiện chưa có ứng dụng/màn hình thật trong workspace nên các ảnh chụp dưới đây ⏳ chờ chụp thực tế. Các bảng hạng mục được mô tả từ năng lực đã chốt ở Tổng quan module; cần cập nhật ảnh khi có môi trường dev.
1/ Danh sách màn hình
| Mã | Màn hình | Mô tả |
|---|---|---|
| MH1 | Màn bán hàng (giỏ chung) | 4 tab dịch vụ + giỏ chung + Court Status Bar + badge ca trên header |
| MH2 | Tab Đặt Sân (lịch + form) | Lịch Gantt trong POS; click slot mở form đặt theo ngày / cố định / sự kiện |
| MH3 | Modal thanh toán | Tổng kết đơn; tiền mặt / QR VNPAY / thẻ / hỗn hợp; chia hoá đơn |
| MH4 | Mở / Kết ca & đối soát | Mở ca với quỹ đầu; kết ca đếm tiền, so kỳ vọng, chênh lệch + lý do |
| MH5 | Danh sách đơn & Tạm tính | Đơn của ca; tab Tạm tính mở lại đơn; in lại hoá đơn đã thanh toán |
2/ Luồng di chuyển màn hình
3/ Mô tả màn hình
MH1 — Màn bán hàng (giỏ chung) ⏳ chờ chụp thực tế
Khu vực trái có 4 tab dịch vụ và lưới món; khu vực phải là giỏ chung phân nhóm theo loại; trên cùng có Court Status Bar và badge ca; dưới giỏ là nút thanh toán.
| STT | Hạng mục | Kiểu hiển thị | Kiểu thao tác | Bắt buộc | Độ dài | Mô tả |
|---|---|---|---|---|---|---|
| 1 | Tab dịch vụ | Button | Click | - | - | Hành vi: chuyển giữa Đặt Sân / FNB / Thuê / Bán dụng cụ |
| 2 | Nút [+] thêm món | Button | Click | - | - | Hành vi: thêm nhanh món vào giỏ, kiểm tra tồn kho realtime |
| 3 | Giỏ hàng chung | List | Click | - | - | Mục đích: hiển thị mọi món phân nhóm theo loại dịch vụ |
| 4 | Court Status Bar | Label | ReadOnly | - | - | Mục đích: trạng thái pill từng sân (Trống / Đang chơi / Dọn / Bảo trì) realtime |
| 5 | Badge ca | Label | ReadOnly | - | - | Mục đích: tên ca · khung giờ · nhân viên · thời gian trực |
| 6 | Gắn khách | Textbox | Text | Không | ≤ 20 | Hành vi: tìm member theo SĐT hoặc tạo khách mới |
| 7 | Áp voucher / điểm | Textbox | Text | Không | - | Hành vi: nhập mã voucher hoặc quy đổi điểm |
| 8 | Nút Tạm tính | Button | Click | - | - | Hành vi: lưu đơn "Chờ thanh toán", làm trống giỏ |
| 9 | Nút THANH TOÁN | Button | Click | - | - | Hành vi: mở MH3 nếu giỏ có món |
MH2 — Tab Đặt Sân (lịch + form) ⏳ chờ chụp thực tế
Lịch Gantt theo sân/khung giờ; click slot trống mở form đặt; có lựa chọn đặt theo ngày, đặt cố định, đặt sự kiện.
| STT | Hạng mục | Kiểu hiển thị | Kiểu thao tác | Bắt buộc | Độ dài | Mô tả |
|---|---|---|---|---|---|---|
| 1 | Lịch Gantt sân | List | Click | - | - | Hành vi: click slot trống để chọn sân + khung giờ |
| 2 | Chọn ngày | Textbox (ngày) | Select | Có | - | Mục đích: ngày đặt sân |
| 3 | Kiểu đặt | List | Select | Có | - | Hành vi: đặt theo ngày / đặt cố định / đặt sự kiện |
| 4 | Khoảng lặp (đặt cố định) | Textbox | Select | Có khi cố định | - | Mục đích: thứ trong tuần + khoảng tuần lặp |
| 5 | Giá sân | Label | ReadOnly | - | - | Mục đích: giá theo loại sân / khung giờ / ngày |
| 6 | Nút Thêm sân vào giỏ | Button | Click | - | - | Hành vi: cộng sân vào giỏ chung, có thể [+ Thêm sân] |
MH3 — Modal thanh toán ⏳ chờ chụp thực tế
Hộp thoại tổng kết đơn; chọn hình thức thanh toán; ô nhập số tiền và hiển thị tiền thừa; tuỳ chọn chia hoá đơn.
| STT | Hạng mục | Kiểu hiển thị | Kiểu thao tác | Bắt buộc | Độ dài | Mô tả |
|---|---|---|---|---|---|---|
| 1 | Tổng đơn | Label | ReadOnly | - | - | Mục đích: tổng tiền sau ưu đãi |
| 2 | Hình thức thanh toán | Button | Click | Có | - | Hành vi: tiền mặt / QR VNPAY / thẻ / hỗn hợp |
| 3 | Số tiền nhận | Textbox (số) | Text | Có khi tiền mặt | - | Ràng buộc: số ≥ tổng đơn; hiển thị tiền thừa |
| 4 | Chia hoá đơn | Checkbox | Check | Không | - | Hành vi: tách đơn thành nhiều phần trả độc lập |
| 5 | Nút Xác nhận thanh toán | Button | Click | - | - | Hành vi: ghi PAID, tạo booking, trừ kho, in hoá đơn |
MH4 — Mở / Kết ca & đối soát ⏳ chờ chụp thực tế
Hai chế độ: Mở ca nhập quỹ đầu; Kết ca đếm tiền thực tế, hiển thị tiền kỳ vọng, chênh lệch và ô ghi chú lý do.
| STT | Hạng mục | Kiểu hiển thị | Kiểu thao tác | Bắt buộc | Độ dài | Mô tả |
|---|---|---|---|---|---|---|
| 1 | Quỹ đầu ca | Textbox (số) | Text | Có khi mở ca | - | Ràng buộc: số ≥ 0; khoá sau khi mở ca |
| 2 | Nút Mở ca | Button | Click | - | - | Hành vi: tạo ca đang mở, hiển thị badge ca |
| 3 | Tiền mặt thực đếm | Textbox (số) | Text | Có khi kết ca | - | Mục đích: số tiền đếm trong két |
| 4 | Tiền kỳ vọng | Label | ReadOnly | - | - | Mục đích: quỹ đầu + bán tiền mặt − chi |
| 5 | Chênh lệch | Label | ReadOnly | - | - | Mục đích: thực đếm − kỳ vọng |
| 6 | Ghi chú lý do | Textbox | Text | Có khi chênh ≠ 0 | ≤ 255 | Ràng buộc: bắt buộc khi chênh lệch khác 0 |
| 7 | Nút Kết ca | Button | Click | - | - | Hành vi: sinh báo cáo ca, đóng ca |
MH5 — Danh sách đơn & Tạm tính ⏳ chờ chụp thực tế
Danh sách đơn của ca với các tab (Tất cả / Tạm tính / Đã thanh toán); mỗi đơn có nút mở lại hoặc in lại hoá đơn.
| STT | Hạng mục | Kiểu hiển thị | Kiểu thao tác | Bắt buộc | Độ dài | Mô tả |
|---|---|---|---|---|---|---|
| 1 | Tab trạng thái đơn | Button | Click | - | - | Hành vi: lọc Tất cả / Tạm tính / Đã thanh toán |
| 2 | Dòng đơn | List | Click | - | - | Mục đích: xem chi tiết đơn của ca |
| 3 | Nút Mở lại đơn | Button | Click | - | - | Hành vi: khôi phục giỏ đầy đủ về MH1 |
| 4 | Nút In lại hoá đơn | Button | Click | - | - | Hành vi: in lại receipt đơn đã thanh toán |
| 5 | Nút Huỷ đơn tạm tính | Button | Click | - | - | Hành vi: huỷ đơn "Chờ thanh toán" kèm lý do |