Cài đặt và sử dụng

Cài đặt

Plugin @digiforce-nc/plugin-calendar thường được cài sẵn trong bản phân phối chính. Kích hoạt qua trang Plugin Manager.

Plugin có server stub (đăng ký plugin) và client phong phú. Dữ liệu calendar đọc từ collection API.

Thêm Calendar block

1. Mở trang ở chế độ thiết kế (Schema Editor).
2. Click Add block → chọn Calendar.
3. Chọn collection có chứa trường ngày (date/datetime).
4. Cấu hình các field mapping (xem bên dưới).
5. Calendar block xuất hiện với giao diện lịch.

Cấu hình field mapping

Khi tạo hoặc sửa block, cấu hình các field:

Setting	Mô tả	Mặc định
Title field	Field hiển thị làm tiêu đề event trên lịch	title
Start date field	Field ngày/giờ bắt đầu event	startDate hoặc createdAt
End date field	Field ngày/giờ kết thúc event	endDate
Color field	Field xác định màu event (select/radio)	Không có

Chế độ xem

Calendar hỗ trợ ba chế độ xem, chuyển đổi qua toolbar:

Chế độ	Mô tả	Phù hợp cho
Month	Tổng quan tháng, mỗi ô là một ngày	Xem lịch trình tổng thể
Week	7 cột, timeline chi tiết theo giờ	Lập lịch tuần
Day	1 ngày, timeline chi tiết từng giờ	Quản lý lịch hẹn

Tạo sự kiện mới

1. Click vào ô trống trên lịch (ngày hoặc khung giờ).
2. Popup tạo event hiện ra với ngày/giờ đã chọn sẵn.
3. Điền thông tin → Submit → event mới hiển thị trên lịch.

Chỉnh sửa sự kiện

• Click vào event trên lịch → popup chi tiết/chỉnh sửa.
• Kéo thả event (drag reschedule) → thay đổi ngày/giờ trực tiếp trên lịch.

Hiển thị màu event

Nếu cấu hình Color field (field select/radio), event trên lịch sẽ tô màu theo giá trị field. VD: status "Pending" = vàng, "Done" = xanh.

Lịch âm dương

Calendar hỗ trợ hiển thị ngày âm lịch (lunar calendar) bên cạnh ngày dương lịch — bật qua Settings → Show lunar.

Mẹo

Calendar block phù hợp nhất cho lịch hẹn, lịch sự kiện, timeline dự án — bất kỳ collection nào có trường ngày bắt đầu/kết thúc.