Skip to main content

Biểu mẫu

Link thiết kế: https://www.figma.com/design/jM4Xopoh41pK1UhYEnxWUq/Workplace-Home?node-id=17609-14177&t=TZBwrrKSgFKbTvZw-4 

1. Mục tiêu:

  • Thuận tiện cho KH sử dụng
  • Tối ưu công cụ cho phép user thực hiện các thao tác

2. Mô tả chi tiết giao diện và logic

2.1. Thanh điều hướng (Side bar)

  • Hiển thị danh sách các chức năng chính gồm:

Menu Tiếng Việt Menu English (Standard) Ghi chú
Của tôi  My Space Tab mặc định
Nhắn tin Messages Điều hướng sang chức năng nhắn tín/chat
Báo cáo Reports

Điều hướng sang chức năng báo cáo tổng hợp

Biểu mẫu Forms Điều hướng sang chức năng biểu mẫu (WORK)
Checklist Checklist Điều hướng sang chức năng check list (WORK)
Lịch checklist Checklist Schedule Điều hướng sang chức năng Đặt lịch (WORK)
Công việc Tasks Điều hướng sang chức năng Công việc (WORK)
Lịch Calendar Điều hướng sang chức năng calender 
Đào tạo Training Điều hướng sang chức năng Đào tạo (Traing)
Dự án Projects Điều hướng sang chức năng Dự án
Cài đặt Settings Điều hướng sang chức năng Cài đặt
Ứng dụng Apps Điều hướng sang ds các phân hệ trong ứng dụng
  • Active State: Highlight menu Biểu mẫu".

2.2. Màn hình master

Các Tab thông tin fồm

STT Tên trường Loại Mô tả Ghi chú
1 Biểu mẫu Tab Tab hiển thị danh sách các biểu mẫu trong hệ thống Tab mặc định
2 Mẫu trả lời Tab Tab hiển thị danh sách các mẫu trả lời của biểu mẫu  
3 Lưu trữ Tab Tab hiển thị các biểu mẫu đã được lưu trữ

 

2.2.1. Tab Biểu mẫu

2.2.1.1. Block "Biểu mẫu yêu thích"

  • Khi không có danh sách biểu mẫu yêu thích thì không hiển thị block này
  • Đẩy cụm Danh sách biểu mẫu lên 
  • Danh sách biểu mẫu yêu thích hiển thị:
    • Tối đã 05 biểu mẫu --> Khi đưa vào list "Biểu mẫu yêu thích" thì không hiển thị ở cụm "Danh sách biểu mẫu " 
    • List hiển thị biểu mẫu ưu thích hiển thì từ ngày đưa vào list yêu thích từ "mới nhất" đến "Cũ nhất"
    • Vượt quá 05 biểu mẫu --> Trả biểu mẫu được đưa vào ds yêu thích có ngày "cũ nhất" so với ngày hiên tại . Biểu mẫu này cũng đưa về list danh sách biểu mẫu 
    •  
  • STT Tên trường Loại

    Mô tả

    Ghi chú
    1 Biểu mẫu yêu thích Khu vực hiển thị Danh sách các biểu mẫu được người dùng đánh dấu yêu thích Hiển thị phía trên danh sách biểu mẫu
    2 Ảnh biểu mãu image

    Hiển thị ảnh đại diện biểu mẫu (nếu có)

    Nếu k có thì hiển thị ảnh mặc định


    3 Ngày sửa gần nhất Date Hiển thị nhgayf sửa gần nhất của biểu mẫu  
    4 Ngày phát hành
    Hiển thị nhgayf sửa gần nhất của biểu mẫu  
    5 Đặt lịch Label Giá trị Có; Không
    6 Làm check list Button Bấm vào để mở ra modal làm check list
    7 action Hub Butto

    Bấm vào mở ra các action chi tiết gồm:

    • Sửa biểu mẫu
    • Đặt lịch check list
    • Bỏ yêu thích
    • Quản lý quyền
    • Nhân bản
    • Lưu trữ biểu mẫu
    • Xóa biểu mẫu
    • Lấy QR Code

    2.2.1.2.Block“DANH SÁCH BIỂU MẪU”

    1. Thanh tìm kiếm & bộ lọc
    STT Tên trường Loại Mô tả Ghi chú
    8 Search bar Textbox Tìm kiếm biểu mẫu theo tên biểu mẫu Tìm gần đúng
    9 Bộ lọc Người tạo Dropdown Lọc danh sách biểu mẫu theo người tạo Cho phép chọn 1 hoặc nhiều
    10 Bộ lọc Đặt lịch Dropdown (Yes/No) Lọc biểu mẫu theo trạng thái có đặt lịch hay không Yes / No
    11 Bộ lọc khác Button Mở popup bộ lọc nâng cao  

    2. Popup “Bộ lọc khác”
    STT Tên trường Loại Mô tả Ghi chú
    12 Người được thực hiện Dropdown multi-select Lọc theo người được phân công thực hiện checklist  
    13 Nhóm được thực hiện Dropdown multi-select Lọc theo nhóm được phân công thực hiện  
    14 Ngày chỉnh sửa Date range picker Lọc biểu mẫu theo khoảng ngày chỉnh sửa Start date – End date
    15 Ngày phát hành Date range picker Lọc biểu mẫu theo khoảng ngày phát hành Start date – End date
    16 Nút Lọc Button Áp dụng điều kiện lọc  
    17 Nút Bỏ lọc Button Xóa toàn bộ điều kiện lọc  

    3. Bảng danh sách biểu mẫu
    STT Tên trường Loại Mô tả Ghi chú
    18 Checkbox chọn Checkbox Chọn một hoặc nhiều biểu mẫu để thao tác hàng loạt  
    19 Biểu mẫu Text Tên biểu mẫu và mã biểu mẫu Ví dụ: QA.2026.000035
    20 Thực hiện Icon + số Hiển thị số người/nhóm được gán thực hiện  
    21 Xem báo cáo Icon + số Hiển thị số người/nhóm có quyền xem báo cáo  
    22 Sửa gần nhất Date Ngày chỉnh sửa gần nhất của biểu mẫu  
    23 Phát hành Date Ngày phát hành biểu mẫu  
    24 Đặt lịch Label Hiển thị trạng thái đặt lịch (Có/Không)  
    25 Làm checklist Button Tạo checklist từ biểu mẫu tương ứng  
    26 Menu thao tác (…) Button

    Mở danh sách hành động với biểu mẫu. gồm:

    • Sửa biểu mẫu
    • Đặt lịch check list
    • Yêu thích
    • QUản lý quyền
    • Nhân bản biểu mẫu
    • Lưu trữ biễu mẫu
    • Xóa biểu mẫu,
    • Lấy QR code
    Có cảnh báo xác nhận khi thực hiện xóa biểu mẫu