ĐẶT LỊCH
1. Màn hình Danh sách Lịch Checklist (Calendar View)
| Tên trường / Chức năng | Loại (Type) | Mô tả giao diện (UI) | Logic xử lý (System/Business Logic) |
| Tab View | Button Group |
- Hiển thị 2 nút: "Lịch" và "Danh sách". - Mặc định chọn: Tab "Lịch". |
Khi switch tab, hệ thống render lại dữ liệu hiển thị theo dạng view tương ứng (Calendar view hoặc List view). |
| Thanh tìm kiếm | Input Text |
- Placeholder: "Tìm theo tên lịch...". - Icon kính lúp ở bên phải. |
- Điều kiện tìm: So khớp chuỗi ký tự gần đúng (LIKE %keyword%) với trường "Tên lịch checklist". - Phạm vi dữ liệu: Query tất cả các lịch trong quá khứ + Lịch hiện tại + Lịch tương lai (trong phạm vi 30 ngày kể từ ngày hiện tại đối với lịch có tần suất). |
| Bộ lọc Địa điểm | Dropdown (Multi-select) |
- Hiển thị danh sách các địa điểm đã được cấu hình (site) - Cho phép tích chọn nhiều. |
- Cho phép nhập tìm kiếm theo tên và mã địa điểm - Quan hệ OR giữa các giá trị chọn. |
| Bộ lọc Phân loại | Dropdown (Multi-select) | - Hiển thị danh sách loại checklist. | - Lọc theo category_id. |
| Bộ lọc Nhãn dán | Dropdown (Multi-select) | - Hiển thị danh sách Tags/Label. | - Lọc theo tag_id. |
| Bộ lọc Năm | Dropdown | - Hiển thị số năm (VD: 2025, 2026). |
- Mặc định: Get - Khi thay đổi, reload lại lịch theo năm chọn. |
| Bộ lọc Tháng | Dropdown | - Hiển thị tháng (Jan - Dec). |
- Mặc định: Get - Khi thay đổi, reload lại lịch theo tháng chọn. |
| Lưới lịch (Calendar Grid) | UI Component |
- Lưới 7 cột (Su - Sa). - Các ngày có sự kiện: Hiển thị chấm tròn màu (theo trạng thái) hoặc tên vắn tắt. - Ô ngày hiện tại: Highlight viền hoặc màu nền khác biệt. |
- Click vào ô trống (Ngày chưa có lịch): Gọi sự kiện mở Modal "Tạo mới" (Màn hình 2.1). Truyền tham số - Click vào item lịch: Gọi API lấy chi tiết lịch -> Mở Drawer "Chi tiết" (Màn hình 3). |
| Nút "Đặt lịch" | Button |
- Nút màu tím (Primary Color). - Icon dấu cộng (+). |
- Sự kiện onClick: Mở Modal "Tạo mới lịch checklist". |
2. Màn hình Tạo mới Đặt lịch
2.1. Màn hình tạo mới với tần suất 1 lần
| Khu vực | Tên trường | Bắt buộc | Mô tả giao diện (UI) | Logic xử lý (System/Business Logic) |
| Header | Nút Đóng / Lưu | - |
- Nút "Đóng": Góc phải trên. - Nút "Lưu": Nút màu tím nổi bật. |
- Đóng: Đóng modal, không lưu dữ liệu, clear form. - Lưu: Trigger validate form -> Nếu Pass -> Gọi API |
| Thông tin chung | Tên lịch checklist | Có |
- Input text. - Hiển thị bộ đếm ký tự góc phải (0/200). |
- Validate: Không được để trống. - Validate: Max length = 200 ký tự. |
| Biểu mẫu sử dụng | Có |
- Dropdown single select. - Có dòng note hướng dẫn bên dưới. |
- Load danh sách Template đang Active. - Khi chọn, hệ thống mapping ID questionnaire vào lịch. - Validate: Không được để trống. |
|
| Thực hiện | Người thực hiện | Có |
1. Trạng thái đóng: Khi chưa chọn - Hiển thị input box. - Placeholder: "Chọn người thực hiện". 2. Trạng thái mở (Dropdown): - Có 2 Tab: Cá nhân và Nhóm. - Có thanh tìm kiếm (Search bar) trên cùng. - Nút "Lưu" màu tím ở dưới cùng của dropdown. 3. Tab Cá nhân (Default): - List user (Display name) - Mỗi dòng cho phép có cơ chế chọn nhiều. - Đã chọn: Hiển thị dấu tích (Checkmark) bên phải. 4. Tab Nhóm: - List danh sách các nhóm (Nhóm 1, Nhóm 2...). - Cơ chế chọn: Single select (Chọn 1).
|
- Validate: Không được để trống. -Mặc định khi bấm tạo mới lịch sẽ hiển thị nút gán người thực hiện mà chưa có các lựa chọn ở phía dưới. 1. Logic Tìm kiếm: - Filter danh sách user/nhóm theo từ khóa nhập vào (Local search hoặc API search). -Chỉ có thể chọn cá nhân hoặc nhóm, khi đang chọn cá nhân mà đổi sang tab nhóm và chọn 1 giá trị sẽ clear toàn bộ giá trị cá nhân đã chọn tương tự với khi chọn nhóm mà đổi sang và chọn cá nhân. 2. Logic Tab Cá nhân (Multi-select): - Cho phép tích chọn nhiều User ID vào mảng - Quy tắc Reset: Ngay khi user thực hiện chọn (click) vào 1 user bất kỳ tại tab này -> Hệ thống tự động Clear (Xóa rỗng) giá trị của 3. Logic Tab Nhóm (Single-select): - Chỉ cho phép chọn duy nhất 1 Group ID - Quy tắc Reset: Ngay khi user thực hiện chọn (click) vào 1 nhóm bất kỳ -> Hệ thống tự động Clear (Xóa rỗng) toàn bộ mảng 4. Nút Lưu (trong dropdown): - Sự kiện: Đóng dropdown. - Hiển thị text lên input box: + Nếu chọn Cá nhân: Hiển thị tên các user (cách nhau dấu phẩy) hoặc dạng Tags. + Nếu chọn Nhóm: Hiển thị tên nhóm.
|
| Tất cả hoàn thành | Không |
Quy tắc hoàn thành Chỉ xuất hiện khi trường "Người thực hiện" có dữ liệu chọn "nhiều người" hoặc "Nhóm thực hiện" - Dạng nút chọn (Radio Button). |
Tất cả hoàn thành: Khi tạo lịch, hệ thống sẽ yêu cầu mọi user được gán đều phải submit checklist thì checklist mới được tính là "Done" |
|
| Chỉ cần 1 người |
Quy tắc hoàn thành Chỉ xuất hiện khi trường "Người thực hiện" có dữ liệu chọn nhiều "người thực hiện" hoặc/và "Nhóm thực hiện" - Dạng nút chọn (Radio Button). |
Check list được chia sẻ chung. Chỉ cần 1 trong số các user được gán submit là check list hoàn thành (First-come first-served). |
||
| ☑ Tự lấy người theo địa điểm. |
- Chỉ xuất hiện khi trường "Người thực hiện" có dữ liệu. - Dạng Checkbox. |
- Khi Uncheck (False): Giữ nguyên danh sách người/nhóm đã chọn ở trên. - Khi Check (True): Kích hoạt logic giao điểm (Intersection). + Hệ thống sẽ lấy danh sách User trong Nhóm/List đã chọn VÀ (AND) User đó phải thuộc + Ví dụ: Chọn "Nhóm Quản lý" + Check "Tự lấy theo địa điểm" + Địa điểm "Kho A" -> Hệ thống chỉ gán check list cho các Quản lý đang làm việc tại Kho A. |
||
| Địa điểm thực hiện | Không | - Dropdown Multi-select. |
|
|
| Thời gian | Múi giờ | Có | - Dropdown chọn múi giờ. |
|
| Thời lượng thực hiện | Có |
- 2 ô Input: Ngày bắt đầu (Date) + Giờ (Time) và Ngày kết thúc (Date) + Giờ (time) - Note: "Mỗi lịch được thực hiện trong X giờ". |
- Validate: - Hệ thống tự tính toán -Mặc định là ngày hiện tại . Giờ mặc định là giờ hiện tại |
|
| Tần suất | Có |
|
- Mặc định: Set giá trị là "Một lần" (One-time).
LƯU Ý KHI LỰA CHỌN ĐỔI GIÁ TRỊ TỪ MỘT LẦN SANG CÁC TẦN SUẤT KHÁC
--> Lý do : Tần suất hàng ngày và hàng ngày lv cho phép vắt ngày thực hiện . (- Miễn là tổng thời gian thực hiện không quá 1 ngày thì vẫn đảm bảo logic lặp lại hàng ngày được.)
--> Lý do: Nếu một checklist kéo dài > 24h (Ví dụ: Từ 8:00 Thứ 2 đến 8:00 Thứ 4), nó không thể lặp lại "Hàng ngày" vì sẽ gây xung đột chồng chéo thời gian (Overlap) giữa lịch cũ chưa xong và lịch mới sinh ra.)
Nếu người dùng đang chọn Tần suất là "Hàng ngày", sau đó quay lại sửa giờ kết thúc thì disable không cho chọn ngày vượt quá 24h. Nếu nhập thời gian >24h thì tự động reset về tần suất 1 lần
- Nếu chọn loại khác (Hàng ngày/tuần...), hiển thị thêm UI cấu hình lặp lại (Recurrence Rules). Các màn hình tiếp theo số: 2.2; 2.3; 2.4; 2.5 |
|
| Hoàn thành sau thời hạn | Không |
- Toggle Switch (On/Off). - Note: "Cho phép ngườii dùng hoàn thành check list sau thời gian quy định lên tới 14 ngày" |
- OFF (False): Đến - ON (True): Cho phép submit sau Cho phép người dùng được làm checklist theo lịch ngay cả khi hết hạn hoàn thành theo thời gian làm khi bật tính năng này. Sau 14 ngày mà k được thực hiện thì Checklist được tính về Bỏ lỡ. |
2.2. Màn hình tạo mới với tần suất "Hằng ngày"
Modal tạo mới đặt lịch với tần suất hàng ngày, các cụm thông tin tương tự với tần suất 1 lần gồm
- Thông tin chung
- Thực hiện
- Thời gian
Các thông tin khác khi lựa chọn tần suất hàng ngày , cụ thẻ mô tả chi tiết và logic xử lý như sau:
| Tên trường / Chức năng | Bắt buộc | Mô tả giao diện (UI) | Logic xử lý (System/Business Logic) |
|
|
|
||
| Múi giờ | Có | - Dropdown chọn múi giờ. |
|
| Thời lượng thực hiện | Có |
- 2 ô Input: Ngày bắt đầu (Date) + Giờ (Time) và Ngày kết thúc (Date) + Giờ (time) - Note: "Mỗi lịch được thực hiện trong X giờ". |
- Validate: - Hệ thống tự tính toán -Mặc định là ngày hiện tại . Giờ mặc định là giờ hiện tại |
| Tần suất | Có |
- Dropdown select. - Giá trị chọn: "Hàng ngày" (Daily). |
- Khi giá trị thay đổi sang "Hàng ngày" (hoặc Hàng tuần/tháng)
|
|
Kết thúc (Cấu hình vòng lặp) |
Có |
Hiển thị: - Label: "Kết thúc". - Dạng: Radio Group (Chọn 1 trong 3). Các tùy chọn: 1. 🔘 Không bao giờ (Never). --> Mặc định 2. ⚪ Vào ngày (On Date): - Kèm theo 1 Date Picker bên cạnh. - Placeholder: DD/MM/YYYY. 3. ⚪ Sau (After): - Kèm theo 1 Input Number. - Placeholder: "10". - Label đuôi: "Vòng lặp" (Occurrences). |
1. Tùy chọn "Không bao giờ": - Hệ thống sẽ sinh lịch vô hạn (Yêu cầu sinh cho 05 năm tới để tránh ảnh hưởng tới performance hệ thống) 2. Tùy chọn "Vào ngày": - Cho phép user chọn ngày kết thúc chuỗi lặp. - Validate: - Hệ thống sẽ sinh lịch từ ngày bắt đầu cho đến ngày này thì dừng.
Chỉ cho phép chọn ngày tương lai. Nếu cùng 1 ngày với trên Block thời lượng thì lịch sẽ chỉ diễn ra 1 ngày.
3. Tùy chọn "Sau [N] vòng lặp": - Cho phép user nhập số lần lặp lại mong muốn. - Validate: Input phải là số nguyên dương (Integer > 0) . Tối đa 500 vòng lặp - Ví dụ: Nhập 10 -> Hệ thống sinh đúng 10 bản ghi lịch checklist rồi dừng. |
2.2.1 Cơ chế hiển thị sinh lịch tại trang chủ "Của tôi" (Check list được sinh ra của hôm nay với user hiện tại)
checklist có: Ngày thực hiện là T, Giờ bắt đầu là Start_Time, Giờ kết thúc là End_Time.
| Giai đoạn | Điều kiện thời gian (Current Time) | Trạng thái hiển thị | Hành động cho phép (Action) |
|
1. Sắp diễn ra (Early View) |
00:00 Ngày T ≤ Hiện tại < Start_Time |
👁️ HIỂN THỊ (Visible) - Style: Màu xám hoặc mờ nhẹ (Dimmed). - Label/Badge: ⚠️ "Chưa đến hạn thực hiện" (hoặc "Sắp diễn ra"). - Icon: 🔒 (Ổ khóa - tùy chọn). |
⛔ KHÓA (Disabled) - Không cho phép mở form nhập liệu. - Khi bấm vào: Hiển thị thông báo (Toast): "Công việc bắt đầu lúc [Start_Time]. Vui lòng quay lại sau." |
|
2. Đang diễn ra (Active) |
Start_Time ≤ Hiện tại ≤ End_Time |
👁️ HIỂN THỊ (Visible) - Style: Nổi bật, bình thường. - Label/Badge: 🟢 "Cần làm" / "Đang thực hiện". |
✅ CHO PHÉP (Enabled) - Bấm vào để mở form checklist. - Cho phép thực hiện, lưu nháp, hoàn thành. |
|
3. Quá hạn (Expired) |
Hiện tại > End_Time |
❌ ẨN (Hidden) - Biến mất khỏi danh sách "Cần làm" ngay lập tức. - (Logic Backend): Hệ thống update trạng thái bản ghi thành "Missed" (Bỏ lỡ) hoặc "Expired" nếu chưa hoàn thành. |
⛔ CHẶN - Nếu user đang mở form dở dang mà đồng hồ điểm qua |
2.2.2. Logic Xử lý Lịch Vắt ngày (Straddling Logic)
Áp dụng cho trường hợp checklist bắt đầu từ ngày hôm trước và kéo dài sang sáng hôm sau.
Ví dụ cụ thể:
-
Ca làm việc: Ca 3 (22:00 -> 02:00 sáng hôm sau).
-
Tần suất: Hàng ngày.
Mô phỏng hiển thị vào lúc 01:00 sáng ngày 02/01:
Lúc này là 01:00 sáng, hệ thống sẽ hiển thị đồng thời 2 checklist trong danh sách của nhân viên:
| Tên Checklist | Thời gian quy định | Trạng thái lúc 01:00 | Giải thích logic |
|
Checklist A (Của đêm hôm qua) |
22:00 (01/01) -> 02:00 (02/01) | Đang diễn ra | Vì Hiện tại (01:00) vẫn nằm trong khoảng cho phép (<= 02:00). User đang thực hiện nốt checklist này. |
|
Checklist B (Của đêm nay) |
22:00 (02/01) -> 02:00 (03/01) | Chưa đến hạn | Vì Hiện tại (01:00) đã qua mốc 00:00 của ngày 02/01 nên checklist này được sinh ra và hiển thị sớm. Tuy nhiên, do chưa đến 22:00 nên bị Khóa. |
Kết quả UX: Nhân viên trực ca đêm lúc 1h sáng sẽ thấy:
-
Checklist Ca 3 đang làm dở (để vào check nốt).
-
Checklist Ca 3 của tối nay (để biết tối nay mình vẫn có lịch, nhưng chưa làm được).
2.2.3. Lưu ý kỹ thuật cho Dev (Technical Notes)
-
Job sinh lịch (Daily Job):
-
Job quét để sinh checklist hàng ngày cần chạy vào lúc 00:00 (Midnight) của ngày đó (hoặc sớm hơn).
-
Dữ liệu
Start_TimevàEnd_Timephải được lưu chính xác kèm Date (DateTime format).
-
-
Real-time Update (Cập nhật thời gian thực):
-
Frontend cần có cơ chế
setIntervalhoặcTimerđể check thời gian mỗi phút. -
Mục đích: Để tự động chuyển trạng thái từ "Chưa đến hạn" -> "Đang diễn ra" -> "Ẩn" mà không cần user phải F5 (Reload) lại trang. Đặc biệt quan trọng với việc Ẩn ngay khi quá hạn.
-
2.3. Màn hình tạo mới với tần suất "Hàng ngày làm việc"
Modal tạo mới đặt lịch với tần suất hàng ngày, các cụm thông tin tương tự với tần suất 1 lần gồm
- Thông tin chung
- Thực hiện
- Thời gian
Các thông tin khác khi lựa chọn tần suất " hàng ngày làm việc" , cụ thẻ mô tả chi tiết và logic xử lý như sau:
| Tên trường / Chức năng | Bắt buộc | Mô tả giao diện (UI) | Logic xử lý (System/Business Logic) |
| Múi giờ | Có | - Dropdown chọn múi giờ. |
|
| Thời lượng thực hiện | Có |
- 2 ô Input: Ngày bắt đầu (Date) + Giờ (Time) và Ngày kết thúc (Date) + Giờ (time) - Note: "Mỗi lịch được thực hiện trong X giờ". |
- Validate: - Hệ thống tự tính toán -Mặc định là ngày hiện tại . Giờ mặc định là giờ hiện tại |
| Tần suất | Có |
- Dropdown select. - Giá trị chọn: "Hàng ngày làm việc". - Note bên dưới: "Lịch sẽ được lặp đi lặp lại hay không?". |
- Khi chọn giá trị này, hệ thống cũng Hiển thị (Unhide) khối cấu hình "Kết thúc" (tương tự như chọn Hàng ngày). - Logic sinh lịch (Generation Logic): + Hệ thống xác định "Ngày làm việc" dựa trên cấu hình Lịch làm việc của Công ty (Working Calendar) hoặc mặc định là từ Thứ 2 đến Thứ 6. + Bỏ qua (Skip): Thứ 7, Chủ Nhật và các ngày Lễ/Tết (nếu hệ thống có cấu hình nghỉ lễ). HIỆN TẠI CHƯA LÀM CẤU HÌNH NGHỈ LỄ LƯU Ý KHI LỰA CHỌN ĐỔI GIÁ TRỊ TỪ MỘT LẦN SANG CÁC TẦN SUẤT KHÁC
--> Lý do : Tần suất hàng ngày và hàng ngày lv cho phép vắt ngày thực hiện . (- Miễn là tổng thời gian thực hiện không quá 1 ngày thì vẫn đảm bảo logic lặp lại hàng ngày được.)
--> Lý do: Nếu một checklist kéo dài > 24h (Ví dụ: Từ 8:00 Thứ 2 đến 8:00 Thứ 4), nó không thể lặp lại "Hàng ngày" vì sẽ gây xung đột chồng chéo thời gian (Overlap) giữa lịch cũ chưa xong và lịch mới sinh ra.)
Nếu người dùng đang chọn Tần suất là "Hàng ngày làm việc", sau đó quay lại sửa giờ kết thúc thì disable không cho chọn ngày vượt quá 24h. Nếu nhập thời gian >24h thì tự động reset về tần suất 1 lần
|
| Kết thúc | Có |
(Giữ nguyên giao diện như phiên bản 2.4) - 🔘 Không bao giờ. - ⚪ Vào ngày [Date]. - ⚪ Sau [N] vòng lặp. |
Logic áp dụng cho "Hàng ngày làm việc": 1. Không bao giờ: Sinh lịch vô hạn vào các ngày làm việc. (Yêu cầu sinh cho 05 năm tới để tránh ảnh hưởng tới performance hệ thống) 2. Vào ngày: Sinh lịch vào các ngày làm việc cho đến mốc thời gian này. 3. Sau [N] vòng lặp: - Ví dụ: User nhập "Sau 5 vòng lặp" và bắt đầu từ Thứ 6. Nhập số nguyên dương, tối đa 500 vòng lặp - Hệ thống sinh: T6, T2, T3, T4, T5 (Bỏ qua T7, CN). Đủ 5 bản ghi thì dừng. |
2.3.1. So sánh Logic sinh lịch Hàng ngày vs Hàng ngày làm việc
| Tiêu chí | Hàng ngày (Daily) | Hàng ngày làm việc (Daily on Workdays) |
| Định nghĩa | Lặp lại vào tất cả các ngày trong tuần (Mon - Sun). | Chỉ lặp lại vào ngày làm việc (thường là Mon - Fri). |
| Xử lý T7, CN | CÓ sinh lịch. | KHÔNG sinh lịch (Bỏ qua). |
| Xử lý ngày Lễ | CÓ sinh lịch (trừ khi có rule đặc biệt khác). | KHÔNG sinh lịch (Nếu lịch làm việc định nghĩa đó là ngày nghỉ). --> HIỆN TẠI CHƯA CÓ CẤU HÌNH NÀY |
| Ví dụ Input | Bắt đầu T6, Lặp 3 lần. | Bắt đầu T6, Lặp 3 lần. |
| Kết quả Output | T6, T7, CN. | T6, T2, T3 (Bỏ qua T7, CN). |
2.3.2. Cơ chế hiển thị sinh lịch tại trang chủ "Của tôi" (Check list được sinh ra của hôm nay với user hiện tại)
| Giai đoạn | Điều kiện thời gian (Current Time) | Trạng thái hiển thị | Hành động cho phép (Action) |
|
1. Sắp diễn ra (Early View) |
00:00 Ngày T ≤ Hiện tại < Start_Time |
👁️ HIỂN THỊ (Visible) - Style: Màu xám hoặc mờ nhẹ (Dimmed). - Label/Badge: ⚠️ "Chưa đến hạn thực hiện" (hoặc "Sắp diễn ra"). - Icon: 🔒 (Ổ khóa - tùy chọn). |
⛔ KHÓA (Disabled) - Không cho phép mở form nhập liệu. - Khi bấm vào: Hiển thị thông báo (Toast): "Công việc bắt đầu lúc [Start_Time]. Vui lòng quay lại sau." |
|
2. Đang diễn ra (Active) |
Start_Time ≤ Hiện tại ≤ End_Time |
👁️ HIỂN THỊ (Visible) - Style: Nổi bật, bình thường. - Label/Badge: 🟢 "Cần làm" / "Đang thực hiện". |
✅ CHO PHÉP (Enabled) - Bấm vào để mở form checklist. - Cho phép thực hiện, lưu nháp, hoàn thành. |
|
3. Quá hạn (Expired) |
Hiện tại > End_Time |
❌ ẨN (Hidden) - Biến mất khỏi danh sách "Cần làm" ngay lập tức. - (Logic Backend): Hệ thống update trạng thái bản ghi thành "Missed" (Bỏ lỡ) hoặc "Expired" nếu chưa hoàn thành. |
⛔ CHẶN - Nếu user đang mở form dở dang mà đồng hồ điểm qua |
2.3.3. Logic Xử lý Lịch Vắt ngày (Straddling Logic)
-
Nếu
Start_Datelà Ngày làm việc (T2 - T6) -> SINH LỊCH (Kể cả khi giờ kết thúc rơi vào T7/CN). -
Nếu
Start_Datelà Ngày nghỉ (T7, CN) -> BỎ QUA (Không sinh lịch). - Ví du: Ca làm việc từ 22:00 đêm đến 02:00 sáng hôm sau. Ngày nghỉ là T7, CN.
Bảng kịch bản Sinh lịch (Scenario Table)
Thứ (Ngày bắt đầu) Thời gian thực hiện Hành động hệ thống Giải thích Thứ 2 22:00 T2 -> 02:00 T3 Sinh lịch T2 là ngày làm việc. Thứ 3- Thứ 4 ... ... ... tương tự thứ 2 Thứ 5 22:00 T5 -> 02:00 T6 Sinh lịch T5 là ngày làm việc. Thứ 6 22:00 T6 -> 02:00 T7 SINH LỊCH Quan trọng: Dù kết thúc vào sáng T7 (Ngày nghỉ), nhưng ca này bắt đầu vào T6 (Ngày làm việc) nên vẫn hợp lệ. Nhân viên làm ca đêm T6 vẫn phải có checklist. Thứ 7 22:00 T7 -> 02:00 CN Bỏ qua T7 là ngày nghỉ -> Không có ca đêm bắt đầu vào T7. Chủ Nhật 22:00 CN -> 02:00 T2 Bỏ qua CN là ngày nghỉ -> Không có ca đêm bắt đầu vào CN. Thứ 2 (Tuần sau) 22:00 T2 -> 02:00 T3 Sinh lịch Quay lại chu kỳ làm việc
2.4. Màn hình tạo mới với tần suất "Hàng tuần"
Modal tạo mới đặt lịch với tần suất "Hàng tuần", các cụm thông tin tương tự với tần suất 1 lần gồm
- Thông tin chung
- Thực hiện
- Thời gian
Các thông tin khác khi lựa chọn tần suất " hàng tuần" , cụ thẻ mô tả chi tiết và logic xử lý như sau:
| Tên trường / Chức năng | Bắt buộc | Mô tả giao diện (UI) | Logic xử lý (System/Business Logic) |
| Múi giờ | Có | - Dropdown chọn múi giờ. |
|
| Thời lượng thực hiện | Có |
- 2 ô Input: Ngày bắt đầu (Date) + Giờ (Time) và Ngày kết thúc (Date) + Giờ (time) - Note: "Mỗi lịch được thực hiện trong X giờ". |
- Validate: - Hệ thống tự tính toán -Mặc định là ngày hiện tại . Giờ mặc định là giờ hiện tại |
| Tần suất | Có |
- Dropdown select. - Giá trị chọn: "Hàng tuần". - Lưu ý: Giao diện tối giản, không hiển thị các nút chọn Thứ (T2, T3...) để tránh rối. |
- Sự kiện (On Change): Khi người dùng chọn "Hàng tuần": 1. Hiển thị (Unhide) khối cấu hình "Kết thúc" ngay bên dưới. 2. Kích hoạt logic "Tự động nhận diện Thứ": - Hệ thống lấy ngày trong trường "Bắt đầu từ" để xác định thứ lặp lại. - Ví dụ: Ngày bắt đầu |
|
Kết thúc (Cấu hình vòng lặp) |
Có |
Dạng Radio Button (Chọn 1 trong 3): 1. 🔘 Không bao giờ (Mặc định). 2. ⚪ Vào ngày: Kèm 1 ô Date Picker (chọn ngày). 3. ⚪ Sau: Kèm 1 ô nhập số (Input Number) + Label "vòng lặp". |
1. Không bao giờ: - Hệ thống sinh lịch lặp lại vô hạn vào thứ đã định (Hệ thống tự sinh trước 5 năm dể tránh ảnh hưởng performance). 2. Vào ngày [Date]: - Sinh lịch lặp lại cho đến khi: - Ví dụ: Chọn kết thúc 30/11. Lịch lặp T2. Các ngày sinh ra: 02, 09, 16, 23, 30/11. 3. Sau [N] vòng lặp: - Sinh đúng N bản ghi lịch (bao gồm cả bản ghi gốc). - Ví dụ: Nhập 4 -> Sinh ra lịch cho 4 tuần liên tiếp. |
|
Thời lượng thực hiện (Liên quan logic tuần) |
Có | - 2 cặp ô nhập liệu: [Ngày bắt đầu - Giờ] và [Ngày kết thúc - Giờ]. |
- Logic Vắt tuần: - Cho phép khoảng thời gian - Cho phép vắt qua tuần (Ví dụ: Từ 10:00 Thứ 6 tuần này đến 10:00 Thứ 2 tuần sau). - Hệ thống vẫn sinh lịch bình thường theo chu kỳ 7 ngày: |
2.4.1. Lưu ý logic sinh lịch
1: Xác định ngày cơ sở (Base Date)
-
-
Lấy
Start_Datetừ ô "Bắt đầu từ". -
Xác định
Day_Of_Week(Thứ) của ngày này. (Ví dụ: Thứ Hai). -
Lưu ý: Nếu User sau đó sửa lại ngày bắt đầu sang một ngày là Thứ Ba, hệ thống phải tự động cập nhật logic lặp sang Thứ Ba.
-
2: Tính toán chuỗi lặp (Recurrence Series)
-
-
-
Interval (Khoảng cách): 7 ngày.
-
Công thức:
-
Start_Next=Start_Current+ 7 ngày. -
End_Next=End_Current+ 7 ngày.
-
-
-
3: Kiểm tra điều kiện dừng (Stop Condition)
-
-
Dựa vào cấu hình trường "Kết thúc" để dừng vòng lặp sinh bản ghi.
-
2.5. Màn hình tạo mới với tần suất "Hàng tháng"
Modal tạo mới đặt lịch với tần suất "Hàng tuần", các cụm thông tin tương tự với tần suất 1 lần gồm
- Thông tin chung
- Thực hiện
- Thời gian
Các thông tin khác khi lựa chọn tần suất " hàng tháng" , cụ thẻ mô tả chi tiết và logic xử lý như sau:
| Tên trường / Chức năng | Bắt buộc | Mô tả giao diện (UI) | Logic xử lý (System/Business Logic) |
| Múi giờ | Có | - Dropdown chọn múi giờ. |
|
| Thời lượng thực hiện | Có |
- 2 ô Input: Ngày bắt đầu (Date) + Giờ (Time) và Ngày kết thúc (Date) + Giờ (time) - Note: "Mỗi lịch được thực hiện trong X giờ". |
- Validate: - Hệ thống tự tính toán -Mặc định là ngày hiện tại . Giờ mặc định là giờ hiện tại |
| Tần suất | Có |
- Dropdown select. - Giá trị chọn: "Hàng tháng". - Lưu ý: Không hiển thị các tùy chọn phức tạp (như "Thứ 2 đầu tiên của tháng") mà dùng logic ngầm định. |
- Cơ chế xác định Ngày (Day of Month Logic): + Hệ thống tự động lấy Ngày (Day) của trường "Bắt đầu từ" làm mốc lặp lại. + Ví dụ: User chọn ngày bắt đầu là + Trường hợp đặc biệt: Xem mục "Xử lý cuối tháng" bên dưới. Lưu ý: khi chọn thời lương thực hiện với ngày kết thúc chọn vào các ngày 29-30-31 -> Hiển thị cảnh báo Lưu ý: Với các tháng thiếu ngày, lịch sẽ tự động điều chỉnh về ngày cuối cùng của tháng đó. |
|
Kết thúc (Cấu hình vòng lặp) |
Có |
Dạng Radio Button (Chọn 1 trong 3): 1. 🔘 Không bao giờ (Mặc định). 2. ⚪ Vào ngày [Date Picker]. 3. ⚪ Sau [Input Number] vòng lặp. |
1. Không bao giờ: - Sinh lịch vào ngày định sẵn của các tháng tiếp theo vô hạn. (Mặc định sinh trươc 5 năm để tránh ảnh hưởng performance 2. Vào ngày [Date]: - Sinh lịch cho đến khi: 3. Sau [N] vòng lặp: - Sinh đúng N bản ghi lịch (bao gồm bản ghi gốc). - Ví dụ: Bắt đầu tháng 11, lặp 3 lần -> Sinh ra tháng 11, 12, 01. |
2.5.1. Logic Sinh Lịch & Xử lý Ngoại lệ với TH số ngày trong các tháng khác nhau
Ví dụ : 28 -29-30-31
A. Quy tắc Sinh lịch Cơ bản
-
Khoảng cách lặp: +1 Tháng (Month).
-
Giữ nguyên giờ: Giờ bắt đầu và Giờ kết thúc được giữ nguyên, chỉ thay đổi Ngày/Tháng/Năm.
B. Quy tắc Xử lý Cuối tháng
Bài toán: User chọn ngày bắt đầu là 31/01. Tháng 2 không có ngày 31.
-
Mong muốn Nguyên tắc xử lý: Nếu ngày lặp lại không tồn tại trong tháng mục tiêu, hệ thống sẽ lùi về ngày cuối cùng hợp lệ của tháng đó.
-
Ví dụ minh họa:
-
Input: Bắt đầu ngày 31/01/2020. Tần suất Hàng tháng.
-
Kết quả sinh lịch:
-
Tháng 1: 31/01/2020.
-
Tháng 2 (Năm nhuận): 29/02/2020 (Vì T2 ko có ngày 30, 31).
-
Tháng 3: 31/03/2020 (Quay lại ngày gốc vì T3 có ngày 31).
-
Tháng 4: 30/04/2020 (Lùi về cuối tháng).
-
-
C. Logic Vắt tháng
Cho phép checklist kéo dài từ tháng này sang tháng sau (Ví dụ: Chốt công từ ngày 25 tháng này đến ngày 05 tháng sau).
-
Công thức:
-
Start_Next = Start_Current + 1 Month -
End_Next = End_Current + 1 Month
-
-
Ví dụ:
-
Lịch 1: 25/01 -> 05/02.
-
Lịch 2: 25/02 -> 05/03 (Hệ thống tự động tính đúng ngày kể cả tháng 2 thiếu ngày).
-
2.5.2. Cơ chế hiển thị sinh lịch tại trang chủ "Của tôi" (Check list được sinh ra của hôm nay với user hiện tại)
Áp dụng logic nhất quán với các tần suất trước khi hiển thị ở menu Của tôi
Ví dụ: Checklist "Báo cáo tài chính tháng" (Ngày 02 hàng tháng).
-
Thời gian: 08:00 ngày 02 -> 17:00 ngày 02.
| Thời điểm (Current Time) | Trạng thái hiển thị | Hành vi hệ thống |
| Ngày 01 | 👁️ HIỂN THỊ (Khóa) | Xuất hiện sớm 1 ngày (hoặc từ 00:00 ngày 02 tùy cấu hình) để nhân viên biết sắp đến hạn nộp báo cáo. |
| 08:00 ngày 02 | 🟢 ĐANG DIỄN RA | Mở khóa form nhập liệu. |
| 17:01 ngày 02 | ❌ ẨN (Quá hạn) | Ẩn khỏi danh sách. Ghi nhận trạng thái Missed nếu chưa nộp. |
2.6. Màn hình tạo mới với tần suất "Hàng năm"
| Tên trường / Chức năng | Bắt buộc | Mô tả giao diện (UI) | Logic xử lý (System/Business Logic) |
| Tần suất | Có |
- Dropdown select. - Giá trị chọn: "Hàng năm". - Note: Giao diện đơn giản, không yêu cầu người dùng chọn "Ngày nào tháng nào" mà hệ thống tự động lấy từ ngày bắt đầu. |
- Cơ chế xác định Ngày & Tháng (Day & Month Logic): + Hệ thống lấy Ngày (Day) và Tháng (Month) của trường "Bắt đầu từ" làm mốc lặp lại. + Ví dụ: User chọn ngày bắt đầu là + Trường hợp đặc biệt: Xử lý năm nhuận (Xem mục |
|
Kết thúc (Cấu hình vòng lặp) |
Có |
Dạng Radio Button (Chọn 1 trong 3): 1. 🔘 Không bao giờ (Mặc định). 2. ⚪ Vào ngày [Date Picker]. 3. ⚪ Sau [Input Number] vòng lặp. |
1. Không bao giờ: - Sinh lịch vô hạn (hoặc giới hạn server 5-10 năm). 2. Vào ngày [Date]: - Sinh lịch cho đến khi: 3. Sau [N] vòng lặp: - Sinh đúng N bản ghi. - Ví dụ: Bảo trì máy trong 5 năm khấu hao -> Nhập 5 -> Sinh ra 5 phiếu bảo trì. |
2.6.1. Logic sinh lịch và xử lý các TH đặc biệt
A. Quy tắc Sinh lịch Cơ bản
-
Khoảng cách lặp: +1 Năm (Year).
-
Công thức:
-
Start_Next = Start_Current + 1 Year -
End_Next = End_Current + 1 Year
-
B. Quy tắc Xử lý Ngày 29/02
Bài toán: User tạo lịch chúc mừng sinh nhật hoặc bảo trì vào ngày 29/02/2024 (Năm nhuận). Năm 2025 không có ngày 29/02 thì hệ thống xử lý sao?
Giải pháp (Standard Logic):
Hệ thống sẽ lùi về ngày cuối cùng của tháng 2 trong năm không nhuận.
-
Input: 29/02/2024.
-
Output:
-
Năm 2025: 28/02/2025.
-
Năm 2026: 28/02/2026.
-
Năm 2027: 28/02/2027.
-
Năm 2028 (Nhuận): 29/02/2028 (Hệ thống thông minh tự trả lại ngày gốc).
-
C. Logic Vắt năm
Cho phép checklist kéo dài từ năm cũ sang năm mới (Ví dụ: Tổng kết năm tài chính từ 25/12 năm trước đến 05/01 năm sau).
-
Logic: Hệ thống cộng 1 năm vào cả
Start_DatevàEnd_Date, giữ nguyên khoảng cách ngày.
2.6.2. Vòng đời Hiển thị
Đối với lịch hàng năm, "tính năng nhắc việc sớm" là cực kỳ quan trọng vì nhân viên dễ bị quên các đầu việc ít lặp lại này.
Ví dụ: Bảo trì server định kỳ (Ngày 02/11 hàng năm).
| Thời điểm | Trạng thái hiển thị | Hành vi hệ thống |
| Tháng 10 (Trước 1 tháng) | 👁️ HIỂN THỊ (Khóa) | Xuất hiện trong danh sách với nhãn "Sắp đến hạn" (Tùy chọn cấu hình nhắc trước bao lâu). |
| 00:00 ngày 02/11 | 🟢 ĐANG DIỄN RA | Mở khóa. Cho phép thực hiện. |
| Sau thời hạn | ❌ ẨN (Quá hạn) | Ẩn khỏi danh sách. |
3. . Tổng kết Logic Hệ thống với các tần suất
Để đảm bảo tính nhất quán cho toàn bộ phân hệ Lịch Checklist, dưới đây là bảng tổng hợp logic
| Tần suất | Đơn vị cộng (Plus Unit) | Logic biên (Edge Case) | Ghi chú quan trọng |
| Hàng ngày | +1 Day | Không | Check Duration > 24h để chặn. |
| Hàng ngày làm việc | +1 Day (Check Workday) | T7, CN, Lễ | Chỉ check Start_Date để quyết định sinh hay bỏ qua. |
| Hàng tuần | +1 Week (+7 Days) | Không | Tự động detect Thứ. |
| Hàng tháng | +1 Month | Tháng thiếu ngày (28, 30) | Auto lùi về ngày cuối tháng (LastDayOfMonth). |
| Hàng năm | +1 Year | Ngày 29/02 | Auto lùi về 28/02 nếu năm thường. |
3. Màn hình Chi tiết Lịch (View Mode)
| Tên trường / Nút | Loại hiển thị | Mô tả giao diện (UI) | Logic xử lý (System/Business Logic) |
| Header | Nút Action |
- Nút "Tạm ngừng": Style Danger/Warning. - Nút "Sửa": Style Primary. - Mã lịch: Hiển thị ID dạng text (Read-only). |
- Tạm ngừng: Update - Sửa: Mở lại form Tạo mới (Màn hình 2) nhưng bind dữ liệu cũ vào các trường để user chỉnh sửa. |
| Thông tin chính | Tiêu đề & Trạng thái |
- Tiêu đề: Font to, in đậm. - Trạng thái: Badge màu (Xanh: Active, Xám: Inactive). |
- Hiển thị đúng tên lịch đã lưu. - Mapping trạng thái từ DB ra màu sắc tương ứng. |
| Chi tiết | Các trường thông tin |
- Hiển thị dạng Label: Value. - Các trường: Biểu mẫu, Người thực hiện, Địa điểm, Múi giờ... |
- Tất cả đều ở trạng thái Read-only (Chỉ xem). - Dữ liệu Người thực hiện: Nếu > 5 người, hiển thị Avatar stack (+5) để tiết kiệm diện tích. |
| Cấu hình | Tần suất & Deadline |
- Tần suất: Hiển thị text. - Hoàn thành sau hạn: Text "Cho phép" / "Không". |
- Hiển thị cấu hình hiện tại của lịch. |