Bỏ qua

Đặc tả Màn hình: Quản lý Người dùng (User Management Screen)

Mã tài liệu: EZD-DES-SCR-ADM-010 Phiên bản: 1.0
User Story liên quan: us-adm-07 Ngày hiệu lực: 19/09/2025
Người soạn: John Người phê duyệt: Stephen

1. Mục tiêu của Màn hình

Cho phép Super Admin quản lý người dùng trong hệ thống: tạo mới, reset mật khẩu, gán role, xóa. Đây là công cụ để tạo tài khoản TENANT_ADMIN đầu tiên cho đối tác (ví dụ “Anh Phong”), đồng thời duy trì kiểm soát an toàn (không cho phép xóa Super Admin cuối cùng).

2. Bố cục Tổng thể (Overall Layout)

  • Sidebar trái: Điều hướng (Dashboard, Promotions, FAQ, Branding, Avatar, RBAC, Users).
  • Content chính:

  • Toolbar (tiêu đề + nút “Thêm người dùng”).

  • Danh sách người dùng (bảng).
  • Modal form để tạo/sửa user.

3. Phân rã các Thành phần (Component Breakdown)

Thành phần 1: Sidebar

  • Giữ nguyên layout từ Dashboard.
  • Menu item “Users” active.

Thành phần 2: Toolbar

  • Tiêu đề: “Quản lý Người dùng”.
  • Button chính: “+ Thêm người dùng mới” (primary, top-right).

Thành phần 3: Danh sách Người dùng (User List Table)

  • Cột:

  • Email.

  • Tên hiển thị.
  • Vai trò (badge: SUPER_ADMIN, TENANT_ADMIN).
  • Trạng thái (Active/Inactive).
  • Action (Edit / Reset password / Delete).
  • Empty state: Icon + text: “Chưa có người dùng nào. Hãy tạo mới để bắt đầu.”

Thành phần 4: Form Tạo/Sửa User (Modal)

  • Field:

  • Email (bắt buộc, unique, format check).

  • Tên hiển thị (bắt buộc).
  • Role: dropdown chỉ gồm 2 lựa chọn (SUPER_ADMIN, TENANT_ADMIN).
  • Button:

  • Lưu (primary).

  • Hủy (secondary).
  • Validation: Không cho lưu nếu thiếu thông tin hoặc email trùng.

Thành phần 5: Action Buttons

  • Edit: Mở modal với dữ liệu cũ để chỉnh sửa.
  • Reset password: Dialog xác nhận → gửi email reset.
  • Delete: Dialog xác nhận:

  • Nếu user ≠ Super Admin cuối cùng → cho phép xóa.

  • Nếu user = Super Admin cuối cùng → hiển thị cảnh báo và chặn.

Thành phần 6: Thông báo (Notifications)

  • Success: Toast xanh “Người dùng đã được tạo / cập nhật / xóa thành công.”
  • Error: Toast đỏ “Không thể lưu / đồng bộ thất bại.”
  • Retry: Button “Thử lại” hiển thị khi có lỗi.

4. Hành vi Chuyển tiếp (Transition Behavior)

  • Bấm Thêm người dùng mới → mở form modal.
  • Lưu thành công → modal đóng + danh sách cập nhật ngay.
  • Reset password → gửi email reset, hiển thị toast success.
  • Xóa user → bảng cập nhật, trừ trường hợp Super Admin cuối cùng → hiển thị cảnh báo “Không thể xóa Super Admin cuối cùng”.

5. Triết lý Thiết kế (Design Philosophy)

  • MVP-first: Chỉ có 2 role cố định (SUPER_ADMIN, TENANT_ADMIN).
  • Đơn giản & Rõ ràng: CRUD qua bảng + modal, không có thao tác phức tạp.
  • An toàn: Guardrail ngăn xóa Super Admin cuối cùng.
  • Consistency: Giữ nguyên style với Dashboard, Promotions, FAQ.
  • Resilience: Empty state, error state rõ ràng; có thông báo cụ thể.