打印模板

业务用途

打印模板用于配置可打印的文档模板（如合同、收据、审批单等）。运营人员设计模板布局，绑定表单字段（formId），运行时填充表单数据后可预览和导出 PDF。

打印模板通过 PrintTemplateController 管理，目前使用内存存储（TEMPLATE_STORE），模板配置包含 templateName、templateCode、formId、configJson 等字段。

涉及文件

层	文件路径	说明
Controller	`backend/src/main/java/com/lowcode/controller/PrintTemplateController.java`	`/api/print/template` 端点
前端	`frontend/src/views/designer/print/index.vue`	打印模板设计器
前端API	`frontend/src/api/print.ts`	前端请求封装（`printApi` 对象）

PrintTemplateController 当前使用 static final Map<Long, Map<String, Object>> TEMPLATE_STORE 内存存储，重启后数据丢失。实际项目中应替换为数据库表。模板字段包括：id、templateName、templateCode、formId、configJson、status、createTime、updateTime。

后端实现

端点列表（PrintTemplateController -- `/api/print/template`）

方法	路径	说明
GET	`/api/print/template/list`	获取模板列表
GET	`/api/print/template/{id}`	获取模板详情
POST	`/api/print/template/save`	保存模板（新增或更新）
PUT	`/api/print/template/{id}`	更新模板
DELETE	`/api/print/template/{id}`	删除模板
GET	`/api/print/template/preview/{id}`	预览模板（返回模拟表单数据）
GET	`/api/print/template/export/{id}`	导出 PDF（返回 HTML）
GET	`/api/print/template/fields/{formId}`	获取表单关联的字段列表

保存模板 -- `saveTemplate()`

@PostMapping("/save")
public Result<Map<String, Object>> saveTemplate(@RequestBody Map<String, Object> params) {
    Long id = (Long) params.getOrDefault("id", 0L);
    Map<String, Object> template;

    if (id > 0 && TEMPLATE_STORE.containsKey(id)) {
        // 更新
        template = TEMPLATE_STORE.get(id);
        template.put("updateTime", System.currentTimeMillis());
    } else {
        // 新增
        id = idCounter++;
        template.put("id", id);
        template.put("createTime", System.currentTimeMillis());
    }

    template.put("templateName", params.get("templateName"));
    template.put("templateCode", params.get("templateCode"));
    template.put("formId", params.get("formId"));       // 绑定表单
    template.put("configJson", params.get("configJson"));
    template.put("status", "draft");

    TEMPLATE_STORE.put(id, template);
    return Result.success(template);
}

导出 PDF -- `exportPdf()`

@GetMapping("/export/{id}")
public Result<String> exportPdf(@PathVariable Long id) {
    Map<String, Object> template = TEMPLATE_STORE.get(id);
    if (template == null) return Result.error("模板不存在");

    // 生成可打印的 HTML
    String html = "<!DOCTYPE html><html><head><meta charset='UTF-8'>" +
        "<style>body{font-family:Arial,sans-serif;padding:20px;}</style></head>" +
        "<body><h1>" + template.get("templateName") + "</h1>" +
        "<p>模板内容: " + template.get("configJson") + "</p>" +
        "</body></html>";

    return Result.success(html);
}

前端实现

打印模板设计器界面

frontend/src/views/designer/print/index.vue 提供：

模板基本信息配置（名称、编码）
表单选择（formId，从 /form/list 加载表单列表）
模板布局设计（文本、表格、字段占位符等）
预览和导出

前端 API 封装

// frontend/src/api/print.ts
export const printApi = {
  getTemplateList: () => request.get('/print/template/list'),
  getTemplate: (id: number) => request.get(`/print/template/${id}`),
  saveTemplate: (data: any) => request.post('/print/template/save', data),
  updateTemplate: (id: number, data: any) => request.put(`/print/template/${id}`, data),
  deleteTemplate: (id: number) => request.delete(`/print/template/${id}`),
  previewTemplate: (id: number) => request.get(`/print/template/preview/${id}`),
  exportPdf: (id: number) => request.get(`/print/template/export/${id}`, { responseType: 'blob' })
}

加载表单列表

// print/index.vue 第 534 行
const res = await request.get('/form/list')
// 用于选择绑定的表单

操作步骤

进入「设计器 -> 打印模板」页面，点击「新建模板」
填写模板名称、编码
选择绑定的表单（formId），系统会加载该表单的字段列表
设计模板布局：放置文本、表格，插入字段占位符
点击「保存」
点击「预览」查看模板效果（使用模拟数据）
点击「导出 PDF」生成可打印的 HTML

常见问题

模板保存后重启丢失

当前 PrintTemplateController 使用内存存储（TEMPLATE_STORE），服务重启后数据丢失。实际项目中需要替换为数据库持久化。

获取表单字段返回空列表

getFormFields()（/print/template/fields/{formId}）当前返回空列表（List.of()），是模拟实现。实际项目中应根据 formId 查询表单设计获取字段列表。