Giao diện
@digiforce-nc/plugin-block-template
Plugin quản lý block template - cho phép lưu cấu hình block thành template tái sử dụng, hỗ trợ template kế thừa (inherited) và chuyển đổi qua lại giữa template và block thường.
Plugin này làm gì?
Khi admin xây dựng nhiều trang có block tương tự (cùng collection, cùng layout), việc cấu hình lại từ đầu rất tốn thời gian. Block template cho phép lưu một block đã cấu hình thành template, sau đó sử dụng lại ở nhiều nơi - thậm chí với chế độ inherited, thay đổi template sẽ tự động cập nhật tất cả block liên kết.
Ba nhiệm vụ chính
| # | Nhiệm vụ | Chi tiết |
|---|---|---|
| 1 | Lưu block thành template | Save cấu hình block (schema) vào bảng blockTemplates |
| 2 | Template kế thừa | Block liên kết với template - thay đổi template tự cập nhật block |
| 3 | Quản lý template | Trang quản lý liệt kê, xem, xóa template; hỗ trợ desktop và mobile |
Kiến trúc
Tổng quan
Plugin có server (lưu trữ template, quản lý liên kết) và client (UI quản lý, decorator kế thừa):
| Tầng | Vai trò | Thành phần |
|---|---|---|
| Client UI | Quản lý template, decorator kế thừa | BlockTemplatePage, TemplateGridDecorator |
| Server API | CRUD template, link/unlink | Actions: saveSchema, link, destroy |
| Database | Lưu template metadata + links | blockTemplates, blockTemplateLinks |
| UI Schema | Lưu trữ schema thực tế | Từ plugin-ui-schema-storage |
API endpoints
| Endpoint | Method | Mô tả | ACL |
|---|---|---|---|
blockTemplates:list | GET | Liệt kê tất cả template | loggedIn |
blockTemplates:get | GET | Lấy chi tiết template | loggedIn |
blockTemplates:saveSchema | POST | Lưu block schema thành template | loggedIn |
blockTemplates:link | POST | Liên kết block với template (inherited) | loggedIn |
blockTemplates:destroy | DELETE | Xóa template | loggedIn |
Middleware
| Middleware | Vai trò |
|---|---|
templateDataMiddleware | Inject dữ liệu template vào request context khi block sử dụng template |
Luồng lưu và sử dụng template
Database
Bảng blockTemplates
| Cột | Kiểu | Mô tả |
|---|---|---|
key | string (PK) | Khóa duy nhất của template |
title | string | Tên hiển thị template |
description | text | Mô tả template |
type | string | Loại: form, details, table, ... |
collection | string | Collection liên kết |
dataSource | string | Data source |
componentType | string | Loại component |
menuName | string | Tên menu chứa template |
configured | boolean | Đã cấu hình xong chưa |
Quan hệ: belongsTo uiSchema - template trỏ đến schema đã lưu.
Bảng blockTemplateLinks
| Cột | Kiểu | Mô tả |
|---|---|---|
id | uid (PK) | Định danh |
templateKey | string (FK) | Trỏ đến blockTemplates.key |
uiSchemaUid | string (FK) | Trỏ đến uiSchema đang dùng template |
Tính năng
| Tính năng | Mô tả |
|---|---|
| Save as template | Lưu block hiện tại thành template tái sử dụng |
| Inherited template | Block liên kết - thay đổi template cập nhật tất cả |
| Duplicate template | Tạo bản sao độc lập từ template |
| Mobile template | Hỗ trợ template cho mobile layout |
| Template manager | Trang quản lý với danh sách, preview, delete |
| Convert | Chuyển block thường thành template và ngược lại |
Thành phần client
| Thành phần | Mô tả |
|---|---|
BlockTemplatePage | Trang quản lý template (Settings > Block Templates) |
BlockTemplateList | Danh sách template với filter theo type |
TemplateGridDecorator | Decorator cho block kế thừa, hiển thị badge "Template" |
BlockTemplateMenusProvider | Provider cung cấp template vào menu "Add block" |
BlockTemplateDesigner | Designer cho template: rename, convert, unlink |
Dependencies
| Package | Vai trò |
|---|---|
@digiforce-nc/client | Client framework (peer) |
@digiforce-nc/server | Server framework (peer) |
@digiforce-nc/database | Database ORM (peer) |
plugin-ui-schema-storage | Lưu trữ UI schema (peer) |
plugin-mobile | Hỗ trợ mobile template (optional peer) |