Giao diện
@digiforce-nc/plugin-form-drafts
Plugin lưu nháp form — tự động lưu nội dung form đang điền vào local storage hoặc server, phòng mất dữ liệu khi đóng tab hoặc mất kết nối.
Plugin này làm gì?
Người dùng đang điền form dài rồi vô tình đóng tab, mất mạng, hoặc trình duyệt crash — toàn bộ dữ liệu biến mất. Plugin tự động lưu nháp (draft) theo chu kỳ, cho phép khôi phục khi quay lại.
Cơ chế hoạt động
Tính năng chính
| # | Tính năng | Mô tả |
|---|---|---|
| 1 | Auto-save | Tự động lưu nháp theo chu kỳ |
| 2 | Restore dialog | Hỏi người dùng khi phát hiện draft cũ |
| 3 | Multi-storage | Lưu localStorage (offline) hoặc server (cross-device) |
| 4 | Per-form key | Draft riêng cho từng form/collection/record |
| 5 | Expiry | Tự xóa draft sau thời gian cấu hình |
| 6 | Manual save | Nút "Lưu nháp" thủ công |
| 7 | Draft indicator | Hiển thị trạng thái "Đã lưu nháp" |
Cấu hình
| Tham số | Mặc định | Mô tả |
|---|---|---|
autoSaveInterval | 5000 | Chu kỳ auto-save (ms) |
storage | 'local' | Nơi lưu (local / server) |
expiryHours | 24 | Thời gian giữ draft (giờ) |
enabled | true | Bật/tắt draft |
Thành phần client
| Thành phần | Mô tả |
|---|---|
DraftProvider | Provider bọc form, quản lý auto-save |
RestoreDialog | Dialog hỏi khôi phục draft |
DraftIndicator | Badge "Đã lưu nháp" (timestamp) |
SaveDraftButton | Nút lưu nháp thủ công |
Dependencies
| Package | Vai trò |
|---|---|
@digiforce-nc/client | Client UI framework |
@digiforce-nc/server | Server framework (nếu dùng server storage) |
@digiforce-nc/database | Database ORM (nếu dùng server storage) |
Lưu ý triển khai
- localStorage có giới hạn ~5MB — form với nhiều file đính kèm nên dùng server
- Draft key nên bao gồm userId để tránh xung đột giữa users
- Khi form submit thành công, tự động xóa draft