antv
5.6 KiB
5.6 KiB
Notification & Popup Review List
This document lists all the standard dialogs, popups, toasts, and empty states implemented for the Thankcard System. These screenshots are captured automatically for Business Analyst (BA) and Quality Assurance (QA) review and approval.
Common Components Implemented
The following reusable/common components are created and used across all display cases:
- Confirm Dialog: Dialog prompting for confirmation before an action is executed (danger and primary types).
- Error Dialog: Informing users of errors or validation failures.
- Success Dialog: Standard dialog to show successful actions.
- Warning Dialog: Warnings related to constraints or user balance.
- Info Dialog: Friendly dialog for guidance (e.g., first login, change password required).
- Toast: Slide-in non-blocking notification for quick feedback.
- Empty State: Centered inline placeholder for lists containing no data.
Review Case Matrix
| Case ID | Feature | Display Case | Notification Type | Message | Screenshot Path |
|---|---|---|---|---|---|
| 01 | Authentication | Login failed | Toast (Error) | Đăng nhập thất bại. Vui lòng kiểm tra lại Email hoặc Mật khẩu. | case_01_login_failed.png |
| 02 | Authorization | Access denied | Error Dialog | Tài khoản của bạn không có quyền truy cập vào trang quản trị này. Vui lòng liên hệ với quản trị viên nếu đây là một sự nhầm lẫn. | case_02_access_denied.png |
| 03 | Authentication | First login (change password required) | Info Dialog | Chào mừng bạn đến với hệ thống Thankcard! Đây là lần đầu tiên bạn đăng nhập, vui lòng đổi mật khẩu mới để tiếp tục sử dụng hệ thống. | case_03_first_login.png |
| 04 | User Management | Delete user confirmation | Confirm Dialog (Danger) | Bạn có chắc chắn muốn xóa tài khoản của nhân viên Nguyễn Văn A (MSNV: NV0001)? Hành động này không thể hoàn tác và tất cả dữ liệu liên quan sẽ bị xóa. | case_04_delete_user_confirmation.png |
| 05 | User Management | Create user success | Success Dialog | Tài khoản nhân viên mới đã được tạo thành công trong hệ thống. Email kích hoạt đã được gửi tới người dùng. | case_05_create_user_success.png |
| 06 | User Management | Email already exists | Error Dialog | Địa chỉ email 'nguyenvana@runsystem.net' đã được đăng ký bởi một nhân viên khác. Vui lòng sử dụng địa chỉ email khác. | case_06_email_already_exists.png |
| 07 | User Management | Employee ID already exists | Error Dialog | Mã nhân viên (MSNV) 'NV0001' đã được gán cho một tài khoản khác trong hệ thống. Vui lòng kiểm tra lại. | case_07_employee_id_already_exists.png |
| 08 | General | No data found | Empty State | Không tìm thấy người dùng hoặc giao dịch nào phù hợp với bộ lọc tìm kiếm hiện tại của bạn. Vui lòng thử lại với từ khóa khác. | case_08_no_data_found.png |
| 09 | Thankcard Sending | Not enough thankcards | Warning Dialog | Số dư Thankcard hiện tại của bạn là 0. Bạn không thể gửi thêm thẻ cho đến khi số dư được đặt lại vào đầu tháng tới. | case_09_not_enough_thankcards.png |
| 10 | Thankcard Sending | Maximum 5 thankcards per user/month | Warning Dialog | Bạn đã đạt đến hạn mức gửi tối đa 5 Thankcard trong tháng này. Vui lòng đợi đến tháng sau để tiếp tục gửi lời cảm ơn. | case_10_max_5_thankcards_per_month.png |
| 11 | Thankcard Sending | Send thankcards confirmation | Confirm Dialog (Primary) | Bạn đang thực hiện gửi 1 Thankcard tới Trần Thị B với lời nhắn: 'Cảm ơn bạn đã hỗ trợ dự án'. Bạn có chắc chắn muốn gửi? | case_11_send_thankcards_confirmation.png |
| 12 | Thankcard Sending | Send thankcards success | Success Dialog | Thankcard của bạn đã được gửi thành công đến Trần Thị B. Lượt gửi còn lại trong tháng của bạn: 4/5. | case_12_send_thankcards_success.png |
| 13 | Password Management | Password confirmation mismatch | Error Dialog | Mật khẩu xác nhận nhập lại không khớp với mật khẩu mới. Vui lòng nhập lại chính xác cả hai trường. | case_13_password_confirmation_mismatch.png |
| 14 | Password Management | Change password success | Success Dialog | Mật khẩu của bạn đã được cập nhật thành công. Vui lòng sử dụng mật khẩu mới cho các lần đăng nhập tiếp theo. | case_14_change_password_success.png |
| 15 | General | Generic system error | Error Dialog | Đã xảy ra sự cố kết nối với máy chủ (Mã lỗi: 500 - Internal Server Error). Vui lòng thử lại sau hoặc báo cáo cho đội ngũ kỹ thuật. | case_15_generic_system_error.png |
Note: All screenshots were automatically captured under 1280x800 viewport to ensure precise rendering of transitions and CSS styling.