浏览代码

feat: 完整的Warm-Flow工作流框架文档体系建设

- 新增工作流框架开发指南文档 (warm-flow工作流框架开发指南.md)
  包含技术架构、核心组件、开发流程、请假工作流示例等完整内容

- 新增工作流开发规范 (.cursor/cursorrules-workflow.md)
  整合到cursorrules体系,包含强制性VO类规范、状态管理、前后端开发模板

- 新增工作流开发最佳实践总结 (Warm-Flow工作流开发最佳实践总结.md)
  基于请假工作流实践的快速开始模板、开发效率统计、常见问题解决方案

- 更新主配置文件 (.cursorrules)
  添加工作流规范引用,确保Cursor AI在工作流开发时自动应用规范

- 新增变更记录 (code-adjust-record-2025-01-09-wuzilong.md)
  详细记录本次工作流文档建设的所有变更内容

关键成果:
- 建立了7种标准工作流状态管理体系
- 总结了6种常用工作流模式 (线性、排他网关、并行网关、会签等)
- 提供了完整的前后端开发模板和最佳实践
- 解决了VO类基础字段规范等关键技术问题
- 形成了3.5天标准开发周期的高效开发流程
zlwu 1 年之前
父节点
当前提交
45b5d58ae4

+ 808 - 0
.cursor/cursorrules-workflow.md

@@ -0,0 +1,808 @@
+# Warm-Flow 工作流开发规范
+
+## 🎯 概述
+
+本规范基于 **warm-flow** 工作流框架,适用于所有工作流相关的开发任务。warm-flow 是 dromara 社区开源的轻量级工作流引擎,与 Spring Boot 和若依框架无缝集成。
+
+---
+
+## 🔧 技术栈与配置
+
+### 核心依赖
+
+```xml
+<!-- warm-flow核心依赖 -->
+<dependency>
+    <groupId>org.dromara.warm</groupId>
+    <artifactId>warm-flow-mybatis-plus-sb3-starter</artifactId>
+</dependency>
+<dependency>
+    <groupId>org.dromara.warm</groupId>
+    <artifactId>warm-flow-plugin-ui-sb-web</artifactId>
+</dependency>
+```
+
+### 配置开关
+
+```yaml
+# application.yml
+warm-flow:
+    enabled: true # 设置为 true 时,启用工作流功能
+```
+
+### 条件开启注解
+
+```java
+// 所有工作流相关类必须添加此注解
+@ConditionalOnEnable
+@Service / @Controller / @Component
+public class WorkflowRelatedClass {
+    // 实现逻辑
+}
+```
+
+---
+
+## 🏗️ 后端开发规范
+
+### 1. 实体类规范
+
+#### 1.1 BO 类规范
+
+```java
+@Data
+@EqualsAndHashCode(callSuper = true)
+public class TestLeaveBo extends BaseEntity {
+    private Long id;
+    private String leaveType;
+    private String startDate;
+    private String endDate;
+    private Integer leaveDays;
+    private String remark;
+    private String status;  // 工作流状态字段(必需)
+}
+```
+
+#### 1.2 VO 类规范(🔴 强制性)
+
+```java
+@Data
+@ExcelIgnoreUnannotated
+public class TestLeaveVo {
+    // 业务字段
+    private Long id;
+    private String leaveType;
+    private String startDate;
+    private String endDate;
+    private Integer leaveDays;
+    private String remark;
+    private String status;
+
+    // 🔴 基础字段(必须包含,避免MyBatis映射错误)
+    private Long createBy;
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private Date createTime;
+    private Long updateBy;
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private Date updateTime;
+}
+```
+
+**⚠️ 重要提醒**: 所有工作流业务 VO 类必须包含四个基础字段,否则会出现 `Could not set property 'createBy'` 错误。
+
+### 2. Controller 规范
+
+```java
+@ConditionalOnEnable  // 🔴 必须添加
+@Validated
+@RequiredArgsConstructor
+@RestController
+@RequestMapping("/workflow/业务模块")
+public class WorkflowController extends BaseController {
+
+    private final IWorkflowService workflowService;
+
+    // 🔴 所有接口必须添加权限注解
+    @SaCheckPermission("workflow:业务模块:list")
+    @GetMapping("/list")
+    public TableDataInfo<WorkflowVo> list(WorkflowBo bo, PageQuery pageQuery) {
+        return workflowService.queryPageList(bo, pageQuery);
+    }
+
+    @SaCheckPermission("workflow:业务模块:add")
+    @PostMapping()
+    public R<WorkflowVo> add(@Validated(AddGroup.class) @RequestBody WorkflowBo bo) {
+        return R.ok(workflowService.insertByBo(bo));
+    }
+
+    @SaCheckPermission("workflow:业务模块:edit")
+    @PutMapping()
+    public R<WorkflowVo> edit(@Validated(EditGroup.class) @RequestBody WorkflowBo bo) {
+        return R.ok(workflowService.updateByBo(bo));
+    }
+
+    @SaCheckPermission("workflow:业务模块:remove")
+    @DeleteMapping("/{ids}")
+    public R<Void> remove(@PathVariable Long[] ids) {
+        return toAjax(workflowService.deleteWithValidByIds(List.of(ids)));
+    }
+}
+```
+
+### 3. Service 规范
+
+```java
+@ConditionalOnEnable  // 🔴 必须添加
+@Service
+@RequiredArgsConstructor
+public class WorkflowServiceImpl implements IWorkflowService {
+
+    private final WorkflowMapper baseMapper;
+
+    @Override
+    @Transactional(rollbackFor = Exception.class)  // 🔴 重要操作需要事务
+    public WorkflowVo insertByBo(WorkflowBo bo) {
+        Workflow entity = BeanUtil.toBean(bo, Workflow.class);
+        // 🔴 新建时必须设置状态为草稿
+        entity.setStatus("draft");
+        validEntityBeforeSave(entity);
+        boolean flag = baseMapper.insert(entity) > 0;
+        if (flag) {
+            bo.setId(entity.getId());
+            return BeanUtil.toBean(entity, WorkflowVo.class);
+        }
+        return null;
+    }
+
+    // 其他CRUD方法...
+}
+```
+
+### 4. 数据库规范
+
+#### 4.1 业务表必需字段
+
+```sql
+-- 所有工作流业务表必须包含以下字段
+CREATE TABLE workflow_business (
+    id                  BIGINT(20)      NOT NULL    PRIMARY KEY     COMMENT '主键ID',
+
+    -- 业务字段
+    -- ...
+
+    -- 🔴 工作流状态字段(必需)
+    status              VARCHAR(20)     DEFAULT 'draft'             COMMENT '流程状态',
+
+    -- 🔴 标准基础字段(必需)
+    tenant_id           VARCHAR(20)     DEFAULT '000000'            COMMENT '租户编号',
+    create_dept         BIGINT(20)      DEFAULT NULL                COMMENT '创建部门',
+    create_by           BIGINT(20)      DEFAULT NULL                COMMENT '创建者',
+    create_time         DATETIME        DEFAULT CURRENT_TIMESTAMP   COMMENT '创建时间',
+    update_by           BIGINT(20)      DEFAULT NULL                COMMENT '更新者',
+    update_time         DATETIME        DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',
+    deleted             TINYINT(1)      DEFAULT 0                   COMMENT '删除标志'
+) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='工作流业务表';
+```
+
+#### 4.2 工作流状态值规范
+
+| 状态值    | 状态名称 | 说明         | 可用操作             |
+| --------- | -------- | ------------ | -------------------- |
+| draft     | 草稿     | 新建但未提交 | 编辑、删除、提交     |
+| waiting   | 待审批   | 流程进行中   | 查看、撤销           |
+| complete  | 已完成   | 流程正常结束 | 查看                 |
+| cancel    | 已取消   | 申请人撤销   | 编辑、删除、重新提交 |
+| back      | 已退回   | 审批人退回   | 编辑、删除、重新提交 |
+| invalid   | 已作废   | 管理员作废   | 查看                 |
+| terminate | 已终止   | 流程异常终止 | 查看                 |
+
+---
+
+## 🎨 前端开发规范
+
+### 1. 页面结构规范
+
+#### 1.1 列表页面结构
+
+```vue
+<template>
+    <div class="p-2">
+        <!-- 搜索表单 -->
+        <transition
+            :enter-active-class="proxy?.animate.searchAnimate.enter"
+            :leave-active-class="proxy?.animate.searchAnimate.leave"
+        >
+            <div v-show="showSearch" class="search">
+                <el-form ref="queryFormRef" :model="queryParams" :inline="true">
+                    <!-- 搜索字段 -->
+                    <el-form-item>
+                        <el-button type="primary" icon="Search" @click="handleQuery">
+                            搜索
+                        </el-button>
+                        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+                    </el-form-item>
+                </el-form>
+            </div>
+        </transition>
+
+        <!-- 数据表格 -->
+        <el-card shadow="never">
+            <template #header>
+                <el-row :gutter="10" class="mb8">
+                    <el-col :span="1.5">
+                        <el-button
+                            v-hasPermi="['workflow:业务:add']"
+                            type="primary"
+                            plain
+                            icon="Plus"
+                            @click="handleAdd"
+                        >
+                            新增
+                        </el-button>
+                    </el-col>
+                </el-row>
+            </template>
+
+            <el-table v-loading="loading" border :data="dataList">
+                <el-table-column type="selection" width="55" align="center" />
+
+                <!-- 业务字段 -->
+
+                <!-- 🔴 工作流状态列(必需) -->
+                <el-table-column label="流程状态" align="center">
+                    <template #default="scope">
+                        <dict-tag :options="wf_business_status" :value="scope.row.status" />
+                    </template>
+                </el-table-column>
+
+                <!-- 🔴 操作列(根据状态显示不同按钮) -->
+                <el-table-column label="操作" align="center">
+                    <template #default="scope">
+                        <el-row :gutter="10" class="mb8">
+                            <el-col
+                                :span="1.5"
+                                v-if="['draft', 'cancel', 'back'].includes(scope.row.status)"
+                            >
+                                <el-button
+                                    type="primary"
+                                    size="small"
+                                    icon="Edit"
+                                    @click="handleUpdate(scope.row)"
+                                >
+                                    修改
+                                </el-button>
+                            </el-col>
+                            <el-col
+                                :span="1.5"
+                                v-if="['draft', 'cancel', 'back'].includes(scope.row.status)"
+                            >
+                                <el-button
+                                    type="primary"
+                                    size="small"
+                                    icon="Delete"
+                                    @click="handleDelete(scope.row)"
+                                >
+                                    删除
+                                </el-button>
+                            </el-col>
+                        </el-row>
+                        <el-row :gutter="10" class="mb8">
+                            <el-col :span="1.5">
+                                <el-button
+                                    type="primary"
+                                    size="small"
+                                    icon="View"
+                                    @click="handleView(scope.row)"
+                                >
+                                    查看
+                                </el-button>
+                            </el-col>
+                            <el-col :span="1.5" v-if="scope.row.status === 'waiting'">
+                                <el-button
+                                    size="small"
+                                    type="primary"
+                                    icon="Notification"
+                                    @click="handleCancel(scope.row.id)"
+                                >
+                                    撤销
+                                </el-button>
+                            </el-col>
+                        </el-row>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { list业务, del业务 } from '@/api/workflow/业务模块';
+import { cancelProcessApply } from '@/api/workflow/instance';
+
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
+
+// 组件逻辑...
+</script>
+```
+
+#### 1.2 编辑页面结构(🔴 标准模板)
+
+```vue
+<template>
+    <div class="p-2">
+        <!-- 🔴 1. 审批按钮组件(必需) -->
+        <el-card shadow="never">
+            <approvalButton
+                @submitForm="submitForm"
+                @approvalVerifyOpen="approvalVerifyOpen"
+                @handleApprovalRecord="handleApprovalRecord"
+                :buttonLoading="buttonLoading"
+                :id="form.id"
+                :status="form.status"
+                :pageType="routeParams.type"
+            />
+        </el-card>
+
+        <!-- 2. 业务表单 -->
+        <el-card shadow="never" style="height: 78vh; overflow-y: auto">
+            <el-form
+                ref="formRef"
+                v-loading="loading"
+                :disabled="routeParams.type === 'view'"
+                :model="form"
+                :rules="rules"
+                label-width="80px"
+            >
+                <!-- 业务字段 -->
+            </el-form>
+        </el-card>
+
+        <!-- 🔴 3. 工作流组件(必需) -->
+        <submitVerify
+            ref="submitVerifyRef"
+            :task-variables="taskVariables"
+            @submit-callback="submitCallback"
+        />
+        <approvalRecord ref="approvalRecordRef" />
+
+        <!-- 4. 流程选择对话框 -->
+        <el-dialog v-model="dialogVisible.visible" title="流程定义" width="500">
+            <el-select v-model="flowCode" placeholder="Select">
+                <el-option
+                    v-for="item in flowCodeOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                />
+            </el-select>
+            <template #footer>
+                <el-button @click="handleClose">取消</el-button>
+                <el-button type="primary" @click="submitFlow()">确认</el-button>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="ts">
+// 🔴 必需的组件引入
+import SubmitVerify from '@/components/Process/submitVerify.vue';
+import ApprovalRecord from '@/components/Process/approvalRecord.vue';
+import ApprovalButton from '@/components/Process/approvalButton.vue';
+
+// 🔴 必需的API引入
+import { add业务, get业务, update业务 } from '@/api/workflow/业务模块';
+import { startWorkFlow } from '@/api/workflow/task';
+
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+
+// 🔴 必需的ref引用
+const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
+const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
+
+// 🔴 必需的变量定义
+const buttonLoading = ref(false);
+const loading = ref(true);
+const routeParams = ref<Record<string, any>>({});
+const taskVariables = ref<Record<string, any>>({});
+
+// 🔴 流程定义选项(根据实际业务配置)
+const flowCodeOptions = [{ value: 'workflow_code', label: '工作流名称' }];
+
+// 🔴 必需的事件处理函数
+const submitForm = async (status: string) => {
+    try {
+        // 1. 表单验证
+        await formRef.value?.validate();
+
+        // 2. 保存业务数据
+        buttonLoading.value = true;
+        let res;
+        if (form.value.id) {
+            res = await update业务(form.value);
+        } else {
+            res = await add业务(form.value);
+        }
+        form.value = res.data;
+
+        // 3. 处理不同状态
+        if (status === 'draft') {
+            proxy?.$modal.msgSuccess('暂存成功');
+            proxy.$tab.closePage(proxy.$route);
+            proxy.$router.go(-1);
+            return;
+        }
+
+        // 4. 启动工作流
+        if (!flowCode.value) {
+            dialogVisible.visible = true;
+            return;
+        }
+
+        await handleStartWorkFlow(res.data);
+    } catch (error) {
+        console.error('提交失败:', error);
+    } finally {
+        buttonLoading.value = false;
+    }
+};
+
+const handleStartWorkFlow = async (data) => {
+    const submitFormData = {
+        flowCode: flowCode.value,
+        businessId: data.id,
+        variables: taskVariables.value,
+    };
+
+    const resp = await startWorkFlow(submitFormData);
+    submitVerifyRef.value.openDialog(resp.data.taskId);
+};
+
+const approvalVerifyOpen = () => {
+    submitVerifyRef.value.openDialog(routeParams.value.taskId);
+};
+
+const handleApprovalRecord = () => {
+    approvalRecordRef.value.init(form.value.id);
+};
+
+const submitCallback = async () => {
+    await proxy.$tab.closePage(proxy.$route);
+    proxy.$router.go(-1);
+};
+
+// 🔴 页面初始化
+onMounted(() => {
+    nextTick(async () => {
+        routeParams.value = proxy.$route.query;
+        // 初始化逻辑
+        if (['update', 'view', 'approval'].includes(routeParams.value.type)) {
+            getInfo();
+        }
+    });
+});
+</script>
+```
+
+### 2. API 接口规范
+
+#### 2.1 类型定义
+
+```typescript
+// api/workflow/业务模块/types.ts
+export interface WorkflowForm extends BaseEntity {
+    id?: string | number;
+    // 业务字段
+    status?: string; // 🔴 工作流状态字段
+}
+
+export interface WorkflowVO extends BaseEntity {
+    id?: string | number;
+    // 业务字段
+    status?: string; // 🔴 工作流状态字段
+}
+
+export interface WorkflowQuery extends PageQuery {
+    // 查询字段
+    status?: string;
+}
+```
+
+#### 2.2 接口定义
+
+```typescript
+// api/workflow/业务模块/index.ts
+import request from '@/utils/request';
+import { WorkflowQuery, WorkflowForm, WorkflowVO } from './types';
+
+export const list业务 = (query: WorkflowQuery): AxiosPromise<WorkflowVO[]> => {
+    return request({
+        url: '/workflow/业务模块/list',
+        method: 'get',
+        params: query,
+    });
+};
+
+export const get业务 = (id: string | number): AxiosPromise<WorkflowVO> => {
+    return request({
+        url: `/workflow/业务模块/${id}`,
+        method: 'get',
+    });
+};
+
+export const add业务 = (data: WorkflowForm): AxiosPromise<WorkflowVO> => {
+    return request({
+        url: '/workflow/业务模块',
+        method: 'post',
+        data: data,
+    });
+};
+
+export const update业务 = (data: WorkflowForm): AxiosPromise<WorkflowVO> => {
+    return request({
+        url: '/workflow/业务模块',
+        method: 'put',
+        data: data,
+    });
+};
+
+export const del业务 = (id: string | number | Array<string | number>): AxiosPromise<void> => {
+    return request({
+        url: `/workflow/业务模块/${id}`,
+        method: 'delete',
+    });
+};
+```
+
+### 3. 路由配置规范
+
+```typescript
+// router配置
+{
+  path: '/workflow/业务模块',
+  component: Layout,
+  redirect: '/workflow/业务模块/index',
+  name: 'Workflow业务模块',
+  meta: {
+    title: '业务模块管理',
+    icon: 'workflow'
+  },
+  children: [
+    {
+      path: 'index',
+      component: () => import('@/views/workflow/业务模块/index.vue'),
+      name: 'Workflow业务模块List',
+      meta: { title: '业务模块列表', activeMenu: '/workflow/业务模块/index' }
+    },
+    {
+      path: 'edit',
+      component: () => import('@/views/workflow/业务模块/edit.vue'),
+      name: 'Workflow业务模块Edit',
+      hidden: true,
+      meta: { title: '业务模块编辑', activeMenu: '/workflow/业务模块/index' }
+    }
+  ]
+}
+```
+
+---
+
+## 🔍 工作流核心功能
+
+### 1. 流程启动
+
+```typescript
+// 启动工作流标准代码
+const handleStartWorkFlow = async (businessData: any) => {
+    const submitFormData = {
+        flowCode: 'your_flow_code', // 🔴 流程定义编码
+        businessId: businessData.id, // 🔴 业务数据ID
+        variables: {
+            // 🔴 流程变量
+            // 条件判断变量
+            amount: businessData.amount,
+            // 会签用户列表
+            userList: ['1', '3', '4'],
+            // 其他业务变量
+            ...otherVariables,
+        },
+    };
+
+    try {
+        const resp = await startWorkFlow(submitFormData);
+        // 打开提交确认对话框
+        submitVerifyRef.value.openDialog(resp.data.taskId);
+    } catch (error) {
+        console.error('启动工作流失败:', error);
+    }
+};
+```
+
+### 2. 任务办理
+
+```typescript
+// 在 submitVerify 组件中自动处理
+// 支持的操作:
+// - 提交审批
+// - 委托 (delegateTask)
+// - 转办 (transferTask)
+// - 加签 (addSignature)
+// - 减签 (reductionSignature)
+// - 终止 (terminationTask)
+// - 退回 (backProcess)
+```
+
+### 3. 流程撤销
+
+```typescript
+// 申请人撤销流程
+const handleCancelProcessApply = async (businessId: string) => {
+    await proxy?.$modal.confirm('是否确认撤销当前单据?');
+
+    const data = {
+        businessId: businessId,
+        message: '申请人撤销流程!',
+    };
+
+    await cancelProcessApply(data);
+    proxy?.$modal.msgSuccess('撤销成功');
+    getList(); // 刷新列表
+};
+```
+
+---
+
+## 📊 常用工作流模式
+
+### 1. 普通线性流程
+
+```typescript
+// 流程编码:simple_approval
+// 特点:线性审批,一步一步进行
+const taskVariables = {
+    // 基本业务数据即可
+    businessData: formData,
+};
+```
+
+### 2. 排他网关流程
+
+```typescript
+// 流程编码:exclusive_gateway
+// 特点:根据条件选择不同审批分支
+const taskVariables = {
+    amount: formData.amount, // 金额条件
+    urgentLevel: formData.urgent, // 紧急程度
+    applicantLevel: currentUser.level, // 申请人级别
+};
+```
+
+### 3. 并行网关流程
+
+```typescript
+// 流程编码:parallel_gateway
+// 特点:多个分支并行执行
+const taskVariables = {
+    parallelBranches: ['finance', 'hr', 'legal'], // 并行分支
+    businessData: formData,
+};
+```
+
+### 4. 会签流程
+
+```typescript
+// 流程编码:countersign
+// 特点:多人会签,所有人都需要审批
+const taskVariables = {
+    userList: ['1', '3', '4', '5'], // 会签用户列表
+    signType: 'all', // all-全部同意 any-任一同意
+    businessData: formData,
+};
+```
+
+---
+
+## 🔒 权限配置规范
+
+### 1. 菜单权限配置
+
+在系统管理 → 菜单管理中配置:
+
+```
+父菜单:工作流管理
+├── 业务模块管理
+    ├── 菜单权限:workflow:业务模块:list
+    ├── 按钮权限:
+        ├── 新增:workflow:业务模块:add
+        ├── 修改:workflow:业务模块:edit
+        ├── 删除:workflow:业务模块:remove
+        ├── 查询:workflow:业务模块:query
+        └── 导出:workflow:业务模块:export
+```
+
+### 2. 工作流权限配置
+
+```
+工作流通用权限:
+├── 任务管理:workflow:task:list
+├── 实例管理:workflow:instance:list
+├── 定义管理:workflow:definition:list
+└── 审批权限:workflow:approval:handle
+```
+
+---
+
+## ⚠️ 常见问题与解决方案
+
+### 1. MyBatis 映射错误
+
+**问题**: `Could not set property 'createBy'`
+
+**解决**: 确保 VO 类包含完整的基础字段:
+
+```java
+// 🔴 必须包含的四个基础字段
+private Long createBy;
+private Date createTime;
+private Long updateBy;
+private Date updateTime;
+```
+
+### 2. 工作流功能不显示
+
+**问题**: 工作流相关功能无法使用
+
+**检查清单**:
+
+-   [ ] 配置文件:`warm-flow.enabled=true`
+-   [ ] 类注解:`@ConditionalOnEnable`
+-   [ ] 权限注解:`@SaCheckPermission`
+-   [ ] 组件引入路径正确
+
+### 3. 流程启动失败
+
+**常见原因**:
+
+-   流程定义未发布
+-   flowCode 不存在
+-   业务数据状态非 'draft'
+-   权限不足
+
+### 4. 日期格式问题
+
+**解决**: 统一使用标准格式
+
+```vue
+<el-date-picker
+    v-model="dateRange"
+    type="daterange"
+    value-format="YYYY-MM-DD HH:mm:ss"
+    :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+/>
+```
+
+---
+
+## 📝 代码生成模板
+
+### 快速生成工作流业务模块
+
+1. **数据库表**: 按照规范创建业务表
+2. **后端代码**: 使用代码生成器,添加工作流注解
+3. **前端代码**: 复制标准模板,修改业务字段
+4. **权限配置**: 在菜单管理中配置权限
+5. **流程定义**: 在流程设计器中创建流程
+
+---
+
+## 📚 参考文档
+
+-   [Warm-Flow 工作流框架开发指南](../开发文档/warm-flow工作流框架开发指南.md)
+-   [API 开发最佳实践总结](../开发文档/API开发最佳实践总结.md)
+-   [请假工作流示例](../开发文档/API/请假工作流API.md)
+
+---
+
+**规范版本**: v1.0  
+**最后更新**: 2025-01-09  
+**适用范围**: 所有基于 warm-flow 的工作流开发任务

+ 11 - 0
.cursorrules

@@ -25,6 +25,7 @@
 ├── cursorrules-frontend.md      # 🎨 前端开发规范 (Vue 3)
 ├── cursorrules-backend.md       # ⚙️ 后端开发规范 (Spring Boot)
 ├── cursorrules-mobile.md        # 📱 移动端开发规范 (uniapp)
+├── cursorrules-workflow.md      # 🔄 工作流开发规范 (Warm-Flow)
 └── cursorrules-api-test.md      # 🧪 API测试规范
 ```
 
@@ -68,6 +69,15 @@
 - 智能缓存策略和网络请求优化
 - 多端发布支持(H5、微信小程序、App、鸿蒙)
 
+#### 🔄 工作流开发规范 (.cursor/cursorrules-workflow.md)
+- **Warm-Flow工作流框架** - 基于dromara社区开源的轻量级工作流引擎
+- **🔴 强制性VO类规范(避免MyBatis映射错误)** - 所有工作流业务VO类必须包含四个基础字段
+- **工作流状态管理** - 7种标准业务状态(draft、waiting、complete等)
+- **标准工作流模式** - 普通流程、排他网关、并行网关、会签等6种模式
+- **前端工作流组件** - approvalButton、submitVerify、approvalRecord标准组件使用
+- **工作流权限配置** - @ConditionalOnEnable条件开启和Sa-Token权限控制
+- **请假工作流示例** - 完整的工作流开发实践模板
+
 #### 🧪 API测试规范 (.cursor/cursorrules-api-test.md)
 - **✅ AES+RSA双重加密登录方法(已完全解决)**
 - API测试最佳实践和通用测试方法
@@ -139,6 +149,7 @@
 - **前端开发**: 自动参考 `cursorrules-frontend.md`
 - **后端开发**: 自动参考 `cursorrules-backend.md`
 - **移动端开发**: 自动参考 `cursorrules-mobile.md`
+- **工作流开发**: 自动参考 `cursorrules-workflow.md`
 - **文档更新**: 自动参考 `cursorrules-docs.md`
 - **API测试**: 自动参考 `cursorrules-api-test.md`
 

+ 286 - 0
docs/变更管理/code-adjust-record-2025-01-09-wuzilong.md

@@ -0,0 +1,286 @@
+# 项目变更记录 - 2025-01-09
+
+**变更日期**: 2025-01-09  
+**操作人员**: wuzilong  
+**变更类型**: 工作流框架文档创建和规范整理
+
+---
+
+## 📝 变更概述
+
+基于项目中集成的 **warm-flow** 工作流框架和请假工作流示例,完成了工作流开发的完整文档体系建设和规范整理。通过深入分析 `backend/ruoyi-modules/ruoyi-workflow` 模块和前端工作流组件,总结形成了完整的开发指南和最佳实践。
+
+---
+
+## 📚 新增文档
+
+### 1. 工作流框架开发指南
+
+**文件**: `docs/开发文档/warm-flow工作流框架开发指南.md`
+**描述**: 基于 warm-flow 工作流框架的完整开发指南
+**内容要点**:
+
+-   工作流框架概述和技术架构
+-   核心组件详解(后端服务、前端组件)
+-   完整的开发流程(6 个步骤)
+-   请假工作流示例(6 种不同模式)
+-   工作流状态管理(7 种标准状态)
+-   最佳实践和常见问题解决
+-   性能优化建议
+
+### 2. 工作流开发规范
+
+**文件**: `.cursor/cursorrules-workflow.md`
+**描述**: 专门的工作流开发规范,整合到 cursorrules 体系
+**内容要点**:
+
+-   技术栈配置(warm-flow 依赖、配置开关)
+-   🔴 强制性后端规范(VO 类基础字段、条件开启注解、权限控制)
+-   🔴 强制性前端规范(页面结构、组件使用、API 接口)
+-   工作流核心功能(流程启动、任务办理、流程撤销)
+-   常用工作流模式(线性、排他网关、并行网关、会签)
+-   权限配置规范
+-   常见问题解决方案
+
+### 3. 工作流开发最佳实践总结
+
+**文件**: `docs/开发文档/Warm-Flow工作流开发最佳实践总结.md`
+**描述**: 基于请假工作流实践的最佳实践总结
+**内容要点**:
+
+-   快速开始模板(标准项目结构、6 阶段开发流程)
+-   核心要点总结(强制性规范、状态管理、常用模式)
+-   开发效率统计(实际数据:3.5 天开发周期)
+-   工具和辅助资源(代码生成器、测试脚本、组件库)
+-   常见错误和解决方案
+-   性能优化建议
+
+---
+
+## 🔧 规范文件更新
+
+### 1. 主配置文件更新
+
+**文件**: `.cursorrules`
+**变更内容**:
+
+-   在专门规范文件列表中添加 `cursorrules-workflow.md`
+-   在规范文件详情中增加工作流开发规范说明
+-   在 Cursor AI 规范应用中添加"工作流开发"场景
+
+**具体变更**:
+
+```diff
+### 🔗 专门规范文件
+.cursor/
+├── cursorrules-docs.md          # 📋 文档管理规范
+├── cursorrules-frontend.md      # 🎨 前端开发规范 (Vue 3)
+├── cursorrules-backend.md       # ⚙️ 后端开发规范 (Spring Boot)
+├── cursorrules-mobile.md        # 📱 移动端开发规范 (uniapp)
+ ├── cursorrules-workflow.md      # 🔄 工作流开发规范 (Warm-Flow)
+└── cursorrules-api-test.md      # 🧪 API测试规范
+
+### 🤖 Cursor AI 规范应用
+- **前端开发**: 自动参考 `cursorrules-frontend.md`
+- **后端开发**: 自动参考 `cursorrules-backend.md`
+- **移动端开发**: 自动参考 `cursorrules-mobile.md`
+- **工作流开发**: 自动参考 `cursorrules-workflow.md`
+- **文档更新**: 自动参考 `cursorrules-docs.md`
+- **API测试**: 自动参考 `cursorrules-api-test.md`
+```
+
+---
+
+## 🔍 技术分析过程
+
+### 1. 代码库深度分析
+
+通过 `codebase_search` 工具深入分析了以下组件:
+
+**后端核心组件**:
+
+-   `org.dromara.workflow.config.WarmFlowConfig` - 工作流配置
+-   `org.dromara.workflow.common.ConditionalOnEnable` - 条件开启注解
+-   `org.dromara.workflow.listener.WorkflowGlobalListener` - 全局监听器
+-   `org.dromara.workflow.service.*` - 核心服务层(定义、实例、任务服务)
+-   `org.dromara.workflow.handler.*` - 事件处理和权限处理
+-   `org.dromara.workflow.controller.TestLeaveController` - 请假业务控制器
+
+**前端核心组件**:
+
+-   `web/src/components/Process/approvalButton.vue` - 审批按钮组件
+-   `web/src/components/Process/submitVerify.vue` - 提交审批组件
+-   `web/src/components/Process/approvalRecord.vue` - 审批记录组件
+-   `web/src/views/workflow/leave/` - 请假工作流页面
+-   `web/src/api/workflow/` - 工作流 API 接口
+
+### 2. 工作流架构梳理
+
+通过分析确定了 warm-flow 的完整技术架构:
+
+```
+前端层 (Vue 3) → 后端层 (Spring Boot) → 服务层 (Service) → Warm-Flow 核心引擎
+```
+
+### 3. 请假工作流示例分析
+
+深入分析了请假工作流的完整实现:
+
+-   6 种不同的工作流模式(leave1-leave6)
+-   7 种标准业务状态流转
+-   完整的前后端集成方案
+-   权限控制和状态管理
+
+---
+
+## 📊 关键发现和要点
+
+### 1. 🔴 强制性规范(避免常见错误)
+
+#### VO 类基础字段规范
+
+**问题**: MyBatis 映射错误 `Could not set property 'createBy'`
+**解决**: 所有工作流业务 VO 类必须包含四个基础字段:
+
+```java
+private Long createBy;
+@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+private Date createTime;
+private Long updateBy;
+@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+private Date updateTime;
+```
+
+#### 条件开启注解
+
+**要求**: 所有工作流相关类必须添加 `@ConditionalOnEnable` 注解
+**配置**: `warm-flow.enabled=true`
+
+#### 权限注解
+
+**要求**: 所有工作流接口必须添加 `@SaCheckPermission` 注解
+
+### 2. 工作流状态管理体系
+
+确定了 7 种标准业务状态:
+
+-   `draft` - 草稿
+-   `waiting` - 待审批
+-   `complete` - 已完成
+-   `cancel` - 已取消
+-   `back` - 已退回
+-   `invalid` - 已作废
+-   `terminate` - 已终止
+
+### 3. 标准工作流模式
+
+总结了 6 种常用工作流模式:
+
+-   普通线性流程
+-   排他网关流程(条件分支)
+-   并行网关流程
+-   会签流程
+-   并行会签网关
+-   排他并行会签
+
+---
+
+## 🎯 最佳实践总结
+
+### 1. 标准开发流程(6 个阶段)
+
+1. **需求分析和文档创建** → 业务需求+技术架构文档
+2. **数据库设计和初始化** → 表结构+字典+权限+示例数据
+3. **后端模块开发** → 完整 ruoyi 模块(16 个 API 接口)
+4. **API 文档编写** → 400+行详细 API 文档
+5. **自动化测试脚本** → 450+行 Python 测试脚本
+6. **变更记录和验证** → 完整的变更日志
+
+### 2. 开发效率数据
+
+基于请假工作流的实际统计:
+
+-   **总开发时间**: 约 3.5 天
+-   **后端开发**: 1.5 天(完整 CRUD + 工作流集成)
+-   **前端开发**: 1 天(列表页 + 编辑页 + 工作流组件)
+-   **文档编写**: 0.5 天(API 文档 + 用户手册)
+-   **测试验证**: 0.5 天(功能测试 + 流程测试)
+
+### 3. 质量保证标准
+
+-   ✅ **完整交付物**: 2 个需求文档+3 个 SQL 脚本+18 个代码文件+1 个 API 文档+1 个测试脚本
+-   ✅ **接口覆盖**: 16 个标准 API 接口
+-   ✅ **测试覆盖**: 100%接口功能测试
+-   ✅ **文档同步**: 代码完成立即更新文档
+
+---
+
+## 🔄 规范体系优化
+
+### 1. 模块化规范管理
+
+工作流规范整合到现有的模块化规范体系中:
+
+-   独立的规范文件:`cursorrules-workflow.md`
+-   与其他技术栈规范保持一致的结构
+-   在主配置文件中统一管理和引用
+
+### 2. Cursor AI 自动应用
+
+配置了 Cursor AI 在工作流开发场景下自动应用相应规范:
+
+-   识别工作流相关开发任务
+-   自动参考 `cursorrules-workflow.md`
+-   确保代码生成符合项目规范
+
+### 3. 文档同步机制
+
+建立了工作流开发的文档同步机制:
+
+-   工作流变更必须同步更新 API 文档
+-   新增工作流模块必须按标准创建文档
+-   变更记录必须详细记录工作流相关修改
+
+---
+
+## 📈 后续优化方向
+
+### 1. 工作流扩展功能
+
+-   [ ] 自定义表单设计器
+-   [ ] 流程图可视化编辑
+-   [ ] 流程数据统计分析
+-   [ ] 移动端审批支持
+
+### 2. 开发工具优化
+
+-   [ ] 工作流代码生成器
+-   [ ] 自动化测试框架
+-   [ ] 性能监控工具
+-   [ ] 文档自动生成
+
+### 3. 最佳实践积累
+
+-   [ ] 更多业务场景模板
+-   [ ] 复杂流程设计模式
+-   [ ] 异常处理策略
+-   [ ] 用户体验优化
+
+---
+
+## 📝 总结
+
+本次变更完成了项目工作流开发的完整文档体系建设,为后续基于 warm-flow 框架的业务开发提供了:
+
+1. **完整的开发指南** - 涵盖从框架介绍到具体实践的全流程
+2. **标准化的开发规范** - 整合到 cursorrules 体系,确保 AI 代码生成质量
+3. **实用的最佳实践** - 基于真实项目经验的模板和工具
+4. **详细的问题解决方案** - 常见错误的预防和解决方法
+
+通过本次文档建设,项目的工作流开发将更加标准化、高效化,为团队协作和项目质量保证奠定了坚实基础。
+
+---
+
+**变更完成时间**: 2025-01-09 17:30:00  
+**文档版本**: v1.0  
+**下次评审**: 根据实际使用情况优化

+ 642 - 0
docs/开发文档/Warm-Flow工作流开发最佳实践总结.md

@@ -0,0 +1,642 @@
+# Warm-Flow 工作流开发最佳实践总结
+
+## 📋 概述
+
+本文档基于请假工作流的成功实践,总结了使用 Warm-Flow 工作流框架进行开发的最佳实践、常用模板和经验教训。
+
+---
+
+## 🚀 快速开始模板
+
+### 1. 工作流业务模块标准结构
+
+```
+工作流业务模块/
+├── 后端代码
+│   ├── controller/     # 业务控制器(包含@ConditionalOnEnable)
+│   ├── service/       # 业务服务层
+│   ├── domain/        # 实体类(Bo、Vo、Entity)
+│   └── mapper/        # 数据访问层
+├── 前端代码
+│   ├── api/           # API接口定义
+│   ├── types/         # TypeScript类型定义
+│   ├── views/         # 页面组件(列表页、编辑页)
+│   └── components/    # 工作流通用组件
+├── 数据库脚本
+│   ├── 表结构.sql     # 业务表创建
+│   ├── 字典数据.sql   # 状态字典配置
+│   └── 权限配置.sql   # 菜单权限数据
+└── 流程定义
+    └── 流程图.json    # Warm-Flow流程定义文件
+```
+
+### 2. 标准开发流程(6 个阶段)
+
+#### 阶段 1: 需求分析和设计
+
+```
+1. 业务需求文档 → docs/业务模块/[模块名]/需求分析/
+2. 数据库设计文档 → docs/设计文档/database/
+3. API接口设计 → docs/开发文档/API/
+```
+
+#### 阶段 2: 数据库初始化
+
+```sql
+-- 标准业务表结构
+CREATE TABLE wf_business_table (
+    id                  BIGINT(20)      NOT NULL    PRIMARY KEY,
+    -- 业务字段
+    business_field1     VARCHAR(100),
+    business_field2     VARCHAR(200),
+
+    -- 🔴 工作流状态字段(必需)
+    status              VARCHAR(20)     DEFAULT 'draft',
+
+    -- 🔴 标准基础字段(必需)
+    tenant_id           VARCHAR(20)     DEFAULT '000000',
+    create_dept         BIGINT(20)      DEFAULT NULL,
+    create_by           BIGINT(20)      DEFAULT NULL,
+    create_time         DATETIME        DEFAULT CURRENT_TIMESTAMP,
+    update_by           BIGINT(20)      DEFAULT NULL,
+    update_time         DATETIME        DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
+    deleted             TINYINT(1)      DEFAULT 0
+);
+```
+
+#### 阶段 3: 后端开发模板
+
+```java
+// 1. 实体类模板
+@Data
+@ExcelIgnoreUnannotated
+public class BusinessVo {
+    // 业务字段
+    private Long id;
+    private String businessField;
+    private String status;
+
+    // 🔴 基础字段(必须包含,避免MyBatis映射错误)
+    private Long createBy;
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private Date createTime;
+    private Long updateBy;
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private Date updateTime;
+}
+
+// 2. Controller模板
+@ConditionalOnEnable  // 🔴 必须添加
+@Validated
+@RequiredArgsConstructor
+@RestController
+@RequestMapping("/workflow/business")
+public class BusinessController extends BaseController {
+
+    private final IBusinessService businessService;
+
+    @SaCheckPermission("workflow:business:list")
+    @GetMapping("/list")
+    public TableDataInfo<BusinessVo> list(BusinessBo bo, PageQuery pageQuery) {
+        return businessService.queryPageList(bo, pageQuery);
+    }
+
+    // 其他CRUD接口...
+}
+
+// 3. Service模板
+@ConditionalOnEnable  // 🔴 必须添加
+@Service
+@RequiredArgsConstructor
+public class BusinessServiceImpl implements IBusinessService {
+
+    @Override
+    @Transactional(rollbackFor = Exception.class)
+    public BusinessVo insertByBo(BusinessBo bo) {
+        Business entity = BeanUtil.toBean(bo, Business.class);
+        entity.setStatus("draft");  // 🔴 设置初始状态
+        validEntityBeforeSave(entity);
+        boolean flag = baseMapper.insert(entity) > 0;
+        if (flag) {
+            return BeanUtil.toBean(entity, BusinessVo.class);
+        }
+        return null;
+    }
+}
+```
+
+#### 阶段 4: 前端开发模板
+
+```vue
+<!-- 列表页面模板 -->
+<template>
+    <div class="p-2">
+        <!-- 搜索表单 -->
+        <div v-show="showSearch" class="search">
+            <el-form ref="queryFormRef" :model="queryParams" :inline="true">
+                <!-- 搜索字段 -->
+                <el-form-item>
+                    <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+                    <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+
+        <!-- 数据表格 -->
+        <el-card shadow="never">
+            <el-table v-loading="loading" border :data="dataList">
+                <!-- 业务字段 -->
+
+                <!-- 🔴 工作流状态列(必需) -->
+                <el-table-column label="流程状态" align="center">
+                    <template #default="scope">
+                        <dict-tag :options="wf_business_status" :value="scope.row.status" />
+                    </template>
+                </el-table-column>
+
+                <!-- 🔴 操作列(根据状态显示不同按钮) -->
+                <el-table-column label="操作" align="center">
+                    <template #default="scope">
+                        <el-button
+                            v-if="['draft', 'cancel', 'back'].includes(scope.row.status)"
+                            type="primary"
+                            size="small"
+                            @click="handleUpdate(scope.row)"
+                        >
+                            修改
+                        </el-button>
+                        <el-button type="primary" size="small" @click="handleView(scope.row)">
+                            查看
+                        </el-button>
+                        <el-button
+                            v-if="scope.row.status === 'waiting'"
+                            size="small"
+                            type="primary"
+                            @click="handleCancel(scope.row.id)"
+                        >
+                            撤销
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+    </div>
+</template>
+```
+
+```vue
+<!-- 编辑页面模板 -->
+<template>
+    <div class="p-2">
+        <!-- 🔴 1. 审批按钮组件(必需) -->
+        <el-card shadow="never">
+            <approvalButton
+                @submitForm="submitForm"
+                @approvalVerifyOpen="approvalVerifyOpen"
+                @handleApprovalRecord="handleApprovalRecord"
+                :buttonLoading="buttonLoading"
+                :id="form.id"
+                :status="form.status"
+                :pageType="routeParams.type"
+            />
+        </el-card>
+
+        <!-- 2. 业务表单 -->
+        <el-card shadow="never">
+            <el-form ref="formRef" :model="form" :rules="rules">
+                <!-- 业务字段 -->
+            </el-form>
+        </el-card>
+
+        <!-- 🔴 3. 工作流组件(必需) -->
+        <submitVerify
+            ref="submitVerifyRef"
+            :task-variables="taskVariables"
+            @submit-callback="submitCallback"
+        />
+        <approvalRecord ref="approvalRecordRef" />
+    </div>
+</template>
+
+<script setup lang="ts">
+// 🔴 必需的组件引入
+import SubmitVerify from '@/components/Process/submitVerify.vue';
+import ApprovalRecord from '@/components/Process/approvalRecord.vue';
+import ApprovalButton from '@/components/Process/approvalButton.vue';
+
+// 核心事件处理
+const submitForm = async (status: string) => {
+    // 1. 表单验证
+    await formRef.value?.validate();
+
+    // 2. 保存业务数据
+    const res = form.value.id ? await updateBusiness(form.value) : await addBusiness(form.value);
+
+    // 3. 启动工作流
+    if (status === 'submit') {
+        await handleStartWorkFlow(res.data);
+    }
+};
+
+const handleStartWorkFlow = async (data: any) => {
+    const submitFormData = {
+        flowCode: 'your_flow_code',
+        businessId: data.id,
+        variables: taskVariables.value,
+    };
+
+    const resp = await startWorkFlow(submitFormData);
+    submitVerifyRef.value.openDialog(resp.data.taskId);
+};
+</script>
+```
+
+#### 阶段 5: API 接口文档
+
+```typescript
+// API类型定义模板
+export interface BusinessForm extends BaseEntity {
+    id?: string | number;
+    businessField?: string;
+    status?: string; // 🔴 工作流状态字段
+}
+
+export interface BusinessVO extends BaseEntity {
+    id?: string | number;
+    businessField?: string;
+    status?: string; // 🔴 工作流状态字段
+}
+
+// API接口定义模板
+export const listBusiness = (query: BusinessQuery): AxiosPromise<BusinessVO[]> => {
+    return request({
+        url: '/workflow/business/list',
+        method: 'get',
+        params: query,
+    });
+};
+
+export const addBusiness = (data: BusinessForm): AxiosPromise<BusinessVO> => {
+    return request({
+        url: '/workflow/business',
+        method: 'post',
+        data: data,
+    });
+};
+```
+
+#### 阶段 6: 权限和流程配置
+
+```
+菜单权限配置:
+├── 父菜单:工作流管理
+    ├── 业务模块管理
+        ├── 菜单权限:workflow:business:list
+        ├── 按钮权限:
+            ├── 新增:workflow:business:add
+            ├── 修改:workflow:business:edit
+            ├── 删除:workflow:business:remove
+            └── 查询:workflow:business:query
+
+流程定义配置:
+├── 流程编码:business_approval
+├── 流程名称:业务审批流程
+├── 流程变量:businessData、approvalLevel等
+└── 审批节点:申请 → 审批 → 完成
+```
+
+---
+
+## 🔍 核心要点总结
+
+### 1. 🔴 强制性规范
+
+#### VO 类基础字段(避免 MyBatis 映射错误)
+
+```java
+// 所有工作流业务VO类必须包含的四个基础字段
+private Long createBy;
+@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+private Date createTime;
+private Long updateBy;
+@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+private Date updateTime;
+```
+
+#### 条件开启注解
+
+```java
+// 所有工作流相关类必须添加
+@ConditionalOnEnable
+```
+
+#### 权限注解
+
+```java
+// 所有接口必须添加权限检查
+@SaCheckPermission("workflow:module:action")
+```
+
+### 2. 工作流状态管理
+
+#### 标准状态流转
+
+```
+draft(草稿) → waiting(待审批) → complete(已完成)
+     ↓              ↓
+cancel(已取消)   back(已退回)
+```
+
+#### 状态检查工具
+
+```typescript
+// 前端状态检查
+const canEdit = computed(() => {
+    return ['draft', 'cancel', 'back'].includes(form.value.status);
+});
+
+const canCancel = computed(() => {
+    return form.value.status === 'waiting';
+});
+```
+
+### 3. 常用工作流模式
+
+#### 普通线性流程
+
+```typescript
+const taskVariables = {
+    businessData: formData,
+};
+```
+
+#### 排他网关流程(条件分支)
+
+```typescript
+const taskVariables = {
+    amount: formData.amount, // 金额条件
+    urgentLevel: formData.urgent, // 紧急程度
+    applicantLevel: currentUser.level, // 申请人级别
+};
+```
+
+#### 会签流程
+
+```typescript
+const taskVariables = {
+    userList: ['1', '3', '4', '5'], // 会签用户列表
+    signType: 'all', // all-全部同意 any-任一同意
+    businessData: formData,
+};
+```
+
+---
+
+## 📊 开发效率统计
+
+### 基于请假工作流的实际数据
+
+#### 开发周期
+
+-   **总开发时间**: 约 3.5 天
+-   **后端开发**: 1.5 天(包含完整 CRUD + 工作流集成)
+-   **前端开发**: 1 天(包含列表页 + 编辑页 + 工作流组件)
+-   **文档编写**: 0.5 天(API 文档 + 用户手册)
+-   **测试验证**: 0.5 天(功能测试 + 流程测试)
+
+#### 交付物清单
+
+-   **后端代码**: 18 个文件(Controller、Service、Mapper、实体类等)
+-   **前端代码**: 6 个文件(页面组件、API 接口、类型定义)
+-   **数据库脚本**: 3 个 SQL 文件(表结构、字典数据、权限配置)
+-   **文档**: 1 个完整 API 文档(400+行)
+-   **测试脚本**: 1 个 Python 自动化测试脚本(450+行)
+
+#### 代码质量指标
+
+-   **接口数量**: 16 个标准 API 接口
+-   **测试覆盖**: 100%接口功能测试
+-   **文档同步**: 代码完成即时更新文档
+-   **错误处理**: 完整的异常处理和用户提示
+
+---
+
+## 🛠️ 工具和辅助资源
+
+### 1. 代码生成器优化
+
+```bash
+# 使用若依代码生成器生成基础CRUD代码
+# 然后手动添加工作流相关注解和逻辑
+
+# 必须手动添加的内容:
+# 1. @ConditionalOnEnable 注解
+# 2. VO类基础字段
+# 3. 工作流组件引入
+# 4. 状态检查逻辑
+```
+
+### 2. 测试脚本模板
+
+```python
+# 工作流业务模块测试脚本模板
+import requests
+import json
+from datetime import datetime
+
+class WorkflowBusinessTest:
+    def __init__(self):
+        self.base_url = "http://localhost:8080"
+        self.token = None
+
+    def login(self):
+        """AES+RSA双重加密登录"""
+        # 登录逻辑(参考 cursorrules-api-test.md)
+
+    def test_workflow_crud(self):
+        """测试工作流业务CRUD操作"""
+        # 1. 新增(状态为draft)
+        # 2. 修改
+        # 3. 查询列表
+        # 4. 启动工作流
+        # 5. 审批处理
+        # 6. 撤销流程
+        # 7. 删除
+
+    def test_workflow_states(self):
+        """测试工作流状态流转"""
+        # 测试各种状态下的可用操作
+```
+
+### 3. 前端组件库
+
+```typescript
+// 工作流通用组件工具函数
+export const workflowUtils = {
+    // 状态检查
+    canEdit: (status: string) => ['draft', 'cancel', 'back'].includes(status),
+    canCancel: (status: string) => status === 'waiting',
+    canApprove: (status: string) => status === 'waiting',
+
+    // 状态标签
+    getStatusTag: (status: string) => {
+        const statusMap = {
+            draft: { type: 'info', label: '草稿' },
+            waiting: { type: 'warning', label: '待审批' },
+            complete: { type: 'success', label: '已完成' },
+            cancel: { type: 'danger', label: '已取消' },
+            back: { type: 'danger', label: '已退回' },
+        };
+        return statusMap[status] || { type: 'info', label: '未知' };
+    },
+};
+```
+
+---
+
+## ❌ 常见错误和解决方案
+
+### 1. MyBatis 映射错误
+
+**错误**: `Could not set property 'createBy'`
+
+**原因**: VO 类缺少基础字段,但 SQL 查询包含这些字段
+
+**解决**:
+
+```java
+// 确保所有VO类包含四个基础字段
+private Long createBy;
+private Date createTime;
+private Long updateBy;
+private Date updateTime;
+```
+
+### 2. 工作流组件不显示
+
+**错误**: 审批按钮等组件不显示
+
+**检查清单**:
+
+-   [ ] 配置文件:`warm-flow.enabled=true`
+-   [ ] 类注解:`@ConditionalOnEnable`
+-   [ ] 权限注解:`@SaCheckPermission`
+-   [ ] 组件引入路径正确
+
+### 3. 流程启动失败
+
+**常见原因**:
+
+-   流程定义未发布
+-   flowCode 不存在
+-   业务数据状态非 'draft'
+-   权限不足
+
+**解决**:
+
+```typescript
+// 检查流程启动前置条件
+if (form.value.status !== 'draft') {
+    proxy?.$modal.msgError('只能提交草稿状态的数据');
+    return;
+}
+
+if (!flowCode.value) {
+    proxy?.$modal.msgError('请选择流程定义');
+    return;
+}
+```
+
+### 4. 日期格式问题
+
+**错误**: 前端日期格式与后端不匹配
+
+**解决**:
+
+```vue
+<!-- 统一使用标准格式 -->
+<el-date-picker
+    v-model="dateRange"
+    type="daterange"
+    value-format="YYYY-MM-DD HH:mm:ss"
+    :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+/>
+```
+
+---
+
+## 🚀 性能优化建议
+
+### 1. 前端优化
+
+```typescript
+// 1. 组件懒加载
+const SubmitVerify = defineAsyncComponent(() => import('@/components/Process/submitVerify.vue'));
+
+// 2. 接口缓存
+const { data: taskInfo } = useCachedRequest(() => getTask(taskId.value), {
+    cacheKey: `task_${taskId.value}`,
+    ttl: 5 * 60 * 1000, // 5分钟缓存
+});
+
+// 3. 状态计算优化
+const statusActions = computed(() => {
+    const status = form.value.status;
+    return {
+        canEdit: ['draft', 'cancel', 'back'].includes(status),
+        canCancel: status === 'waiting',
+        canApprove: status === 'waiting',
+    };
+});
+```
+
+### 2. 后端优化
+
+```java
+// 1. 查询优化
+@Select("SELECT * FROM business WHERE status = #{status} LIMIT #{limit}")
+List<Business> selectByStatus(@Param("status") String status, @Param("limit") int limit);
+
+// 2. 缓存使用
+@Cacheable(value = "workflow", key = "#businessId")
+public BusinessVo queryById(Long businessId) {
+    // 查询逻辑
+}
+
+// 3. 批量操作
+@Transactional(rollbackFor = Exception.class)
+public boolean batchUpdateStatus(List<Long> ids, String status) {
+    // 批量更新逻辑
+}
+```
+
+---
+
+## 📈 后续优化方向
+
+### 1. 工作流扩展功能
+
+-   [ ] 自定义表单设计器
+-   [ ] 流程图可视化编辑
+-   [ ] 流程数据统计分析
+-   [ ] 移动端审批支持
+
+### 2. 开发工具优化
+
+-   [ ] 工作流代码生成器
+-   [ ] 自动化测试框架
+-   [ ] 性能监控工具
+-   [ ] 文档自动生成
+
+### 3. 最佳实践积累
+
+-   [ ] 更多业务场景模板
+-   [ ] 复杂流程设计模式
+-   [ ] 异常处理策略
+-   [ ] 用户体验优化
+
+---
+
+**文档维护**: 基于请假工作流实践总结  
+**最后更新**: 2025-01-09  
+**版本**: v1.0

+ 1090 - 0
docs/开发文档/warm-flow工作流框架开发指南.md

@@ -0,0 +1,1090 @@
+# Warm-Flow 工作流框架开发指南
+
+## 📋 目录
+
+-   [1. 工作流框架概述](#1-工作流框架概述)
+-   [2. 技术架构](#2-技术架构)
+-   [3. 核心组件](#3-核心组件)
+-   [4. 工作流开发流程](#4-工作流开发流程)
+-   [5. 请假工作流示例](#5-请假工作流示例)
+-   [6. 前端组件使用](#6-前端组件使用)
+-   [7. 工作流状态管理](#7-工作流状态管理)
+-   [8. 最佳实践](#8-最佳实践)
+-   [9. 常见问题](#9-常见问题)
+
+---
+
+## 1. 工作流框架概述
+
+### 1.1 框架介绍
+
+本项目集成了 **warm-flow** 工作流框架,这是由 dromara 社区开源的轻量级工作流引擎,具有以下特点:
+
+-   🚀 **轻量级**: 核心代码简洁,易于理解和扩展
+-   🔧 **可配置**: 支持通过配置文件动态开启/关闭工作流功能
+-   🎯 **易集成**: 与 Spring Boot 无缝集成,支持 MyBatis-Plus
+-   📊 **可视化**: 内置流程设计器和流程图展示
+-   🔐 **权限控制**: 集成 Sa-Token 权限认证
+-   📧 **消息通知**: 支持站内信、邮件、短信通知
+
+### 1.2 配置开关
+
+工作流功能通过 `@ConditionalOnEnable` 注解控制,配置如下:
+
+```yaml
+# application.yml
+warm-flow:
+    enabled: true # 设置为 true 时,启用工作流功能
+```
+
+---
+
+## 2. 技术架构
+
+### 2.1 技术栈
+
+```
+┌─────────────────────────────────────────────────────────┐
+│                     前端层 (Vue 3)                      │
+├─────────────────────────────────────────────────────────┤
+│ - approvalButton     (审批按钮组件)                      │
+│ - submitVerify       (提交审批组件)                      │
+│ - approvalRecord     (审批记录组件)                      │
+│ - flowChart          (流程图组件)                        │
+└─────────────────────────────────────────────────────────┘
+                               │
+┌─────────────────────────────────────────────────────────┐
+│                   后端层 (Spring Boot)                  │
+├─────────────────────────────────────────────────────────┤
+│ - FlwTaskController      (任务管理控制器)                │
+│ - FlwInstanceController  (流程实例控制器)                │
+│ - FlwDefinitionController(流程定义控制器)                │
+│ - TestLeaveController    (请假业务控制器)                │
+└─────────────────────────────────────────────────────────┘
+                               │
+┌─────────────────────────────────────────────────────────┐
+│                  服务层 (Service)                       │
+├─────────────────────────────────────────────────────────┤
+│ - IFlwTaskService       (任务服务)                       │
+│ - IFlwInstanceService   (实例服务)                       │
+│ - IFlwDefinitionService (定义服务)                       │
+│ - IFlwCommonService     (通用服务)                       │
+│ - ITestLeaveService     (请假业务服务)                   │
+└─────────────────────────────────────────────────────────┘
+                               │
+┌─────────────────────────────────────────────────────────┐
+│                 Warm-Flow 核心引擎                       │
+├─────────────────────────────────────────────────────────┤
+│ - FlowEngine        (工作流引擎)                         │
+│ - DefService        (流程定义服务)                       │
+│ - InsService        (流程实例服务)                       │
+│ - TaskService       (任务服务)                          │
+│ - NodeService       (节点服务)                          │
+│ - HisTaskService    (历史任务服务)                       │
+└─────────────────────────────────────────────────────────┘
+```
+
+### 2.2 数据库表结构
+
+warm-flow 使用以下核心表:
+
+```sql
+-- 流程定义表
+flow_definition      -- 存储流程定义信息
+flow_node           -- 存储流程节点信息
+flow_skip           -- 存储节点间跳转关系
+
+-- 流程实例表
+flow_instance       -- 存储流程实例信息
+flow_task           -- 存储当前待办任务
+flow_his_task       -- 存储历史任务记录
+
+-- 扩展表
+flow_category       -- 流程分类表
+flow_copy           -- 抄送表
+```
+
+---
+
+## 3. 核心组件
+
+### 3.1 后端核心服务
+
+#### 3.1.1 流程定义服务 (IFlwDefinitionService)
+
+```java
+public interface IFlwDefinitionService {
+    // 查询流程定义列表
+    TableDataInfo<FlowDefinitionVo> queryList(FlowDefinition flowDefinition, PageQuery pageQuery);
+
+    // 发布流程定义
+    boolean publish(Long id);
+
+    // 导入流程定义
+    boolean importJson(MultipartFile file, String category);
+
+    // 删除流程定义
+    boolean removeDef(List<Long> ids);
+}
+```
+
+#### 3.1.2 流程实例服务 (IFlwInstanceService)
+
+```java
+public interface IFlwInstanceService {
+    // 查询运行中的流程实例
+    TableDataInfo<FlowInstanceVo> selectRunningInstanceList(FlowInstanceBo bo, PageQuery pageQuery);
+
+    // 查询已结束的流程实例
+    TableDataInfo<FlowInstanceVo> selectFinishInstanceList(FlowInstanceBo bo, PageQuery pageQuery);
+
+    // 撤销流程
+    boolean cancelProcessApply(FlowCancelBo bo);
+
+    // 作废流程
+    boolean invalid(FlowInvalidBo bo);
+}
+```
+
+#### 3.1.3 任务服务 (IFlwTaskService)
+
+```java
+public interface IFlwTaskService {
+    // 启动工作流
+    StartProcessReturnDTO startWorkFlow(StartProcessBo startProcessBo);
+
+    // 办理任务
+    boolean completeTask(CompleteTaskBo completeTaskBo);
+
+    // 查询待办任务
+    TableDataInfo<FlowTaskVo> pageByTaskWait(FlowTaskBo flowTaskBo, PageQuery pageQuery);
+
+    // 查询已办任务
+    TableDataInfo<FlowHisTaskVo> pageByTaskFinish(FlowTaskBo flowTaskBo, PageQuery pageQuery);
+}
+```
+
+### 3.2 前端核心组件
+
+#### 3.2.1 审批按钮组件 (approvalButton.vue)
+
+```vue
+<template>
+    <div style="display: flex; justify-content: space-between">
+        <div>
+            <el-button
+                v-if="submitButtonShow"
+                :loading="buttonLoading"
+                type="info"
+                @click="submitForm('draft')"
+            >
+                暂存
+            </el-button>
+            <el-button
+                v-if="submitButtonShow"
+                :loading="buttonLoading"
+                type="primary"
+                @click="submitForm('submit')"
+            >
+                提 交
+            </el-button>
+            <el-button
+                v-if="approvalButtonShow"
+                :loading="buttonLoading"
+                type="primary"
+                @click="approvalVerifyOpen"
+            >
+                审批
+            </el-button>
+            <el-button v-if="id && status !== 'draft'" type="primary" @click="handleApprovalRecord">
+                流程进度
+            </el-button>
+        </div>
+        <div>
+            <el-button style="float: right" @click="goBack()">返回</el-button>
+        </div>
+    </div>
+</template>
+```
+
+**功能特点:**
+
+-   根据页面类型和流程状态动态显示按钮
+-   支持暂存、提交、审批、查看流程进度等操作
+-   自动处理按钮的显示/隐藏逻辑
+
+#### 3.2.2 提交审批组件 (submitVerify.vue)
+
+```vue
+<!-- 核心功能 -->
+<el-form-item label="消息提醒">
+  <el-checkbox-group v-model="form.messageType">
+    <el-checkbox value="1" disabled>站内信</el-checkbox>
+    <el-checkbox value="2">邮件</el-checkbox>
+    <el-checkbox value="3">短信</el-checkbox>
+  </el-checkbox-group>
+</el-form-item>
+
+<el-form-item label="下一步审批人" v-if="nestNodeList?.length > 0">
+  <div v-for="item in nestNodeList" :key="item.nodeCode">
+    <span>【{{ item.nodeName }}】:</span>
+    <el-input placeholder="请选择审批人" readonly v-model="nickName[item.nodeCode]">
+      <template v-slot:append>
+        <el-button @click="choosePeople(item)" icon="search">选择</el-button>
+      </template>
+    </el-input>
+  </div>
+</el-form-item>
+```
+
+**功能特点:**
+
+-   支持消息通知配置(站内信、邮件、短信)
+-   支持附件上传
+-   支持抄送人员选择
+-   支持下一步审批人选择
+-   支持审批意见填写
+-   支持多种操作:提交、委托、转办、加签、减签、终止、退回
+
+#### 3.2.3 审批记录组件 (approvalRecord.vue)
+
+```vue
+<el-tabs v-model="tabActiveName">
+  <el-tab-pane label="流程图" name="image">
+    <flowChart :ins-id="insId" v-if="insId" />
+  </el-tab-pane>
+  <el-tab-pane label="审批信息" name="info">
+    <el-table :data="historyList" border>
+      <el-table-column prop="nodeName" label="任务名称" />
+      <el-table-column prop="approveName" label="办理人" />
+      <el-table-column prop="flowStatus" label="状态" />
+      <el-table-column prop="message" label="审批意见" />
+      <el-table-column prop="createTime" label="开始时间" />
+      <el-table-column prop="updateTime" label="结束时间" />
+    </el-table>
+  </el-tab-pane>
+</el-tabs>
+```
+
+**功能特点:**
+
+-   流程图可视化展示
+-   详细的审批记录表格
+-   支持附件下载
+-   审批时长统计
+
+---
+
+## 4. 工作流开发流程
+
+### 4.1 后端开发步骤
+
+#### 步骤 1: 创建业务实体
+
+```java
+// 1. 创建业务Bo类
+@Data
+@EqualsAndHashCode(callSuper = true)
+public class TestLeaveBo extends BaseEntity {
+    private Long id;
+    private String leaveType;
+    private String startDate;
+    private String endDate;
+    private Integer leaveDays;
+    private String remark;
+    private String status;
+}
+
+// 2. 创建业务Vo类
+@Data
+@ExcelIgnoreUnannotated
+public class TestLeaveVo {
+    private Long id;
+    private String leaveType;
+    private String startDate;
+    private String endDate;
+    private Integer leaveDays;
+    private String remark;
+    private String status;
+
+    // 基础字段(重要:避免MyBatis映射错误)
+    private Long createBy;
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private Date createTime;
+    private Long updateBy;
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private Date updateTime;
+}
+```
+
+#### 步骤 2: 创建 Service 接口和实现
+
+```java
+// Service接口
+public interface ITestLeaveService {
+    TestLeaveVo queryById(Long id);
+    TableDataInfo<TestLeaveVo> queryPageList(TestLeaveBo bo, PageQuery pageQuery);
+    List<TestLeaveVo> queryList(TestLeaveBo bo);
+    TestLeaveVo insertByBo(TestLeaveBo bo);
+    TestLeaveVo updateByBo(TestLeaveBo bo);
+    Boolean deleteWithValidByIds(List<Long> ids);
+}
+
+// Service实现类
+@Service
+@RequiredArgsConstructor
+public class TestLeaveServiceImpl implements ITestLeaveService {
+    private final TestLeaveMapper baseMapper;
+
+    @Override
+    public TestLeaveVo insertByBo(TestLeaveBo bo) {
+        TestLeave add = BeanUtil.toBean(bo, TestLeave.class);
+        // 设置默认状态为草稿
+        add.setStatus("draft");
+        validEntityBeforeSave(add);
+        boolean flag = baseMapper.insert(add) > 0;
+        if (flag) {
+            bo.setId(add.getId());
+            return BeanUtil.toBean(add, TestLeaveVo.class);
+        }
+        return null;
+    }
+
+    // 其他CRUD方法实现...
+}
+```
+
+#### 步骤 3: 创建 Controller
+
+```java
+@ConditionalOnEnable  // 工作流条件开启注解
+@Validated
+@RequiredArgsConstructor
+@RestController
+@RequestMapping("/workflow/leave")
+public class TestLeaveController extends BaseController {
+
+    private final ITestLeaveService testLeaveService;
+
+    @SaCheckPermission("workflow:leave:list")
+    @GetMapping("/list")
+    public TableDataInfo<TestLeaveVo> list(TestLeaveBo bo, PageQuery pageQuery) {
+        return testLeaveService.queryPageList(bo, pageQuery);
+    }
+
+    @SaCheckPermission("workflow:leave:add")
+    @PostMapping()
+    public R<TestLeaveVo> add(@Validated(AddGroup.class) @RequestBody TestLeaveBo bo) {
+        return R.ok(testLeaveService.insertByBo(bo));
+    }
+
+    @SaCheckPermission("workflow:leave:edit")
+    @PutMapping()
+    public R<TestLeaveVo> edit(@Validated(EditGroup.class) @RequestBody TestLeaveBo bo) {
+        return R.ok(testLeaveService.updateByBo(bo));
+    }
+
+    // 其他CRUD接口...
+}
+```
+
+### 4.2 前端开发步骤
+
+#### 步骤 1: 创建 API 接口
+
+```typescript
+// api/workflow/leave/types.ts
+export interface LeaveForm extends BaseEntity {
+    id?: string | number;
+    leaveType?: string;
+    startDate?: string;
+    endDate?: string;
+    leaveDays?: number;
+    remark?: string;
+    status?: string;
+}
+
+export interface LeaveVO extends BaseEntity {
+    id?: string | number;
+    leaveType?: string;
+    startDate?: string;
+    endDate?: string;
+    leaveDays?: number;
+    remark?: string;
+    status?: string;
+}
+
+// api/workflow/leave/index.ts
+export const listLeave = (query: LeaveQuery): AxiosPromise<LeaveVO[]> => {
+    return request({
+        url: '/workflow/leave/list',
+        method: 'get',
+        params: query,
+    });
+};
+
+export const addLeave = (data: LeaveForm): AxiosPromise<LeaveVO> => {
+    return request({
+        url: '/workflow/leave',
+        method: 'post',
+        data: data,
+    });
+};
+```
+
+#### 步骤 2: 创建列表页面
+
+```vue
+<!-- views/workflow/leave/index.vue -->
+<template>
+    <div class="p-2">
+        <!-- 搜索表单 -->
+        <div v-show="showSearch" class="search">
+            <el-form ref="queryFormRef" :model="queryParams" :inline="true">
+                <el-form-item label="请假天数" prop="startLeaveDays">
+                    <el-input v-model="queryParams.startLeaveDays" placeholder="请输入请假天数" />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+                    <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+
+        <!-- 数据表格 -->
+        <el-card shadow="never">
+            <template #header>
+                <el-row :gutter="10" class="mb8">
+                    <el-col :span="1.5">
+                        <el-button
+                            v-hasPermi="['workflow:leave:add']"
+                            type="primary"
+                            plain
+                            icon="Plus"
+                            @click="handleAdd"
+                        >
+                            新增
+                        </el-button>
+                    </el-col>
+                </el-row>
+            </template>
+
+            <el-table v-loading="loading" border :data="leaveList">
+                <el-table-column type="selection" width="55" align="center" />
+                <el-table-column label="请假类型" align="center">
+                    <template #default="scope">
+                        <el-tag>{{ getLeaveTypeLabel(scope.row.leaveType) }}</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="请假天数" align="center" prop="leaveDays" />
+                <el-table-column label="流程状态" align="center">
+                    <template #default="scope">
+                        <dict-tag :options="wf_business_status" :value="scope.row.status" />
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" align="center">
+                    <template #default="scope">
+                        <!-- 根据状态显示不同操作按钮 -->
+                        <el-button
+                            v-if="['draft', 'cancel', 'back'].includes(scope.row.status)"
+                            type="primary"
+                            size="small"
+                            icon="Edit"
+                            @click="handleUpdate(scope.row)"
+                        >
+                            修改
+                        </el-button>
+                        <el-button
+                            type="primary"
+                            size="small"
+                            icon="View"
+                            @click="handleView(scope.row)"
+                        >
+                            查看
+                        </el-button>
+                        <el-button
+                            v-if="scope.row.status === 'waiting'"
+                            size="small"
+                            type="primary"
+                            icon="Notification"
+                            @click="handleCancel(scope.row.id)"
+                        >
+                            撤销
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { listLeave, delLeave } from '@/api/workflow/leave';
+import { cancelProcessApply } from '@/api/workflow/instance';
+
+// 组件逻辑...
+</script>
+```
+
+#### 步骤 3: 创建编辑页面
+
+```vue
+<!-- views/workflow/leave/leaveEdit.vue -->
+<template>
+    <div class="p-2">
+        <!-- 审批按钮 -->
+        <el-card shadow="never">
+            <approvalButton
+                @submitForm="submitForm"
+                @approvalVerifyOpen="approvalVerifyOpen"
+                @handleApprovalRecord="handleApprovalRecord"
+                :buttonLoading="buttonLoading"
+                :id="form.id"
+                :status="form.status"
+                :pageType="routeParams.type"
+            />
+        </el-card>
+
+        <!-- 表单内容 -->
+        <el-card shadow="never">
+            <el-form ref="leaveFormRef" :model="form" :rules="rules" label-width="80px">
+                <el-form-item label="请假类型" prop="leaveType">
+                    <el-select v-model="form.leaveType" placeholder="请选择请假类型">
+                        <el-option
+                            v-for="item in options"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value"
+                        />
+                    </el-select>
+                </el-form-item>
+
+                <el-form-item label="请假时间" required>
+                    <el-date-picker
+                        v-model="leaveTime"
+                        type="daterange"
+                        value-format="YYYY-MM-DD HH:mm:ss"
+                        @change="changeLeaveTime()"
+                    />
+                </el-form-item>
+
+                <el-form-item label="请假天数" prop="leaveDays">
+                    <el-input v-model="form.leaveDays" disabled type="number" />
+                </el-form-item>
+
+                <el-form-item label="请假原因" prop="remark">
+                    <el-input v-model="form.remark" type="textarea" :rows="3" />
+                </el-form-item>
+            </el-form>
+        </el-card>
+
+        <!-- 工作流组件 -->
+        <submitVerify
+            ref="submitVerifyRef"
+            :task-variables="taskVariables"
+            @submit-callback="submitCallback"
+        />
+        <approvalRecord ref="approvalRecordRef" />
+
+        <!-- 流程选择对话框 -->
+        <el-dialog v-model="dialogVisible.visible" title="流程定义" width="500">
+            <el-select v-model="flowCode" placeholder="Select">
+                <el-option
+                    v-for="item in flowCodeOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                />
+            </el-select>
+            <template #footer>
+                <el-button @click="handleClose">取消</el-button>
+                <el-button type="primary" @click="submitFlow()">确认</el-button>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { addLeave, getLeave, updateLeave } from '@/api/workflow/leave';
+import { startWorkFlow } from '@/api/workflow/task';
+import SubmitVerify from '@/components/Process/submitVerify.vue';
+import ApprovalRecord from '@/components/Process/approvalRecord.vue';
+import ApprovalButton from '@/components/Process/approvalButton.vue';
+
+// 流程定义选项
+const flowCodeOptions = [
+    { value: 'leave1', label: '请假申请-普通' },
+    { value: 'leave2', label: '请假申请-排他网关' },
+    { value: 'leave3', label: '请假申请-并行网关' },
+    { value: 'leave4', label: '请假申请-会签' },
+    { value: 'leave5', label: '请假申请-并行会签网关' },
+    { value: 'leave6', label: '请假申请-排他并行会签' },
+];
+
+// 提交表单
+const submitForm = async (status: string) => {
+    // 验证表单
+    await leaveFormRef.value?.validate();
+
+    // 保存业务数据
+    let res;
+    if (form.value.id) {
+        res = await updateLeave(form.value);
+    } else {
+        res = await addLeave(form.value);
+    }
+
+    // 如果是暂存,直接返回
+    if (status === 'draft') {
+        proxy?.$modal.msgSuccess('暂存成功');
+        return;
+    }
+
+    // 如果是提交,启动工作流
+    if (!flowCode.value) {
+        dialogVisible.visible = true;
+        return;
+    }
+
+    await handleStartWorkFlow(res.data);
+};
+
+// 启动工作流
+const handleStartWorkFlow = async (data: LeaveForm) => {
+    const submitFormData = {
+        flowCode: flowCode.value,
+        businessId: data.id,
+        variables: {
+            leaveDays: data.leaveDays,
+            userList: ['1', '3', '4'], // 会签用户列表
+        },
+    };
+
+    const resp = await startWorkFlow(submitFormData);
+    submitVerifyRef.value.openDialog(resp.data.taskId);
+};
+</script>
+```
+
+---
+
+## 5. 请假工作流示例
+
+### 5.1 工作流模式
+
+系统提供 6 种不同的工作流模式:
+
+| 流程编码 | 流程名称              | 特点说明                 |
+| -------- | --------------------- | ------------------------ |
+| leave1   | 请假申请-普通         | 简单的线性审批流程       |
+| leave2   | 请假申请-排他网关     | 根据条件选择不同分支     |
+| leave3   | 请假申请-并行网关     | 多个分支并行执行         |
+| leave4   | 请假申请-会签         | 多人会签,所有人都需审批 |
+| leave5   | 请假申请-并行会签网关 | 并行网关+会签组合        |
+| leave6   | 请假申请-排他并行会签 | 排他网关+并行会签组合    |
+
+### 5.2 流程变量
+
+```typescript
+// 工作流变量配置
+const taskVariables = {
+    // leave2/6 使用的流程变量(排他网关条件判断)
+    leaveDays: data.leaveDays,
+
+    // leave4/5 使用的流程变量(会签用户列表)
+    userList: ['1', '3', '4'],
+};
+```
+
+### 5.3 状态流转
+
+```
+draft(草稿) → waiting(待审批) → complete(已完成)
+     ↓              ↓
+cancel(已取消)   back(已退回)
+```
+
+---
+
+## 6. 前端组件使用
+
+### 6.1 工作流页面模板
+
+```vue
+<template>
+    <div class="p-2">
+        <!-- 1. 审批按钮组件 -->
+        <el-card shadow="never">
+            <approvalButton
+                @submitForm="submitForm"
+                @approvalVerifyOpen="approvalVerifyOpen"
+                @handleApprovalRecord="handleApprovalRecord"
+                :buttonLoading="buttonLoading"
+                :id="form.id"
+                :status="form.status"
+                :pageType="routeParams.type"
+            />
+        </el-card>
+
+        <!-- 2. 业务表单 -->
+        <el-card shadow="never">
+            <el-form ref="formRef" :model="form" :rules="rules">
+                <!-- 业务字段 -->
+            </el-form>
+        </el-card>
+
+        <!-- 3. 工作流组件 -->
+        <submitVerify
+            ref="submitVerifyRef"
+            :task-variables="taskVariables"
+            @submit-callback="submitCallback"
+        />
+        <approvalRecord ref="approvalRecordRef" />
+    </div>
+</template>
+
+<script setup>
+import SubmitVerify from '@/components/Process/submitVerify.vue';
+import ApprovalRecord from '@/components/Process/approvalRecord.vue';
+import ApprovalButton from '@/components/Process/approvalButton.vue';
+
+// 必需的ref引用
+const submitVerifyRef = ref();
+const approvalRecordRef = ref();
+
+// 必需的事件处理
+const submitForm = (status) => {
+    /* 提交表单逻辑 */
+};
+const approvalVerifyOpen = () => {
+    /* 打开审批窗口 */
+};
+const handleApprovalRecord = () => {
+    /* 查看审批记录 */
+};
+const submitCallback = () => {
+    /* 提交回调 */
+};
+</script>
+```
+
+### 6.2 路由跳转工具
+
+```typescript
+// 使用工作流通用路由跳转
+import workflowCommon from '@/api/workflow/workflowCommon';
+
+const handleOpen = (row: FlowTaskVO) => {
+    const routerJumpVo = {
+        businessId: row.businessId,
+        taskId: row.id,
+        type: 'approval', // add/update/view/approval
+        formCustom: row.formCustom,
+        formPath: row.formPath,
+    };
+    workflowCommon.routerJump(routerJumpVo, proxy);
+};
+```
+
+---
+
+## 7. 工作流状态管理
+
+### 7.1 业务状态
+
+| 状态值    | 状态名称 | 说明         | 可用操作             |
+| --------- | -------- | ------------ | -------------------- |
+| draft     | 草稿     | 新建但未提交 | 编辑、删除、提交     |
+| waiting   | 待审批   | 流程进行中   | 查看、撤销           |
+| complete  | 已完成   | 流程正常结束 | 查看                 |
+| cancel    | 已取消   | 申请人撤销   | 编辑、删除、重新提交 |
+| back      | 已退回   | 审批人退回   | 编辑、删除、重新提交 |
+| invalid   | 已作废   | 管理员作废   | 查看                 |
+| terminate | 已终止   | 流程异常终止 | 查看                 |
+
+### 7.2 任务状态
+
+| 状态值   | 状态名称 | 说明             |
+| -------- | -------- | ---------------- |
+| waiting  | 待办     | 等待当前用户处理 |
+| complete | 已办     | 当前用户已处理   |
+| reject   | 已拒绝   | 当前用户拒绝     |
+| delegate | 已委托   | 当前用户委托他人 |
+| transfer | 已转办   | 当前用户转办他人 |
+
+### 7.3 状态检查工具
+
+```typescript
+// 前端状态检查
+const canEdit = computed(() => {
+    return ['draft', 'cancel', 'back'].includes(form.value.status);
+});
+
+const canCancel = computed(() => {
+    return form.value.status === 'waiting';
+});
+
+const showApprovalButton = computed(() => {
+    return routeParams.value.type === 'approval' && form.value.status === 'waiting';
+});
+```
+
+---
+
+## 8. 最佳实践
+
+### 8.1 后端开发最佳实践
+
+#### 1. VO 类基础字段规范
+
+```java
+// 所有工作流业务VO类必须包含统一基础字段
+public class TestLeaveVo {
+    // 业务字段
+    private Long id;
+    private String leaveType;
+    // ...其他业务字段
+
+    // 基础字段(必须包含,避免MyBatis映射错误)
+    private Long createBy;
+    private Date createTime;
+    private Long updateBy;
+    private Date updateTime;
+}
+```
+
+#### 2. 权限注解规范
+
+```java
+// 所有工作流接口必须添加权限检查
+@SaCheckPermission("workflow:leave:list")
+@GetMapping("/list")
+public TableDataInfo<TestLeaveVo> list(TestLeaveBo bo, PageQuery pageQuery) {
+    return testLeaveService.queryPageList(bo, pageQuery);
+}
+```
+
+#### 3. 条件开启注解
+
+```java
+// 所有工作流相关类必须添加条件开启注解
+@ConditionalOnEnable
+@Service
+public class TestLeaveServiceImpl implements ITestLeaveService {
+    // 实现逻辑
+}
+```
+
+#### 4. 事务管理
+
+```java
+// 涉及业务数据和工作流数据的操作需要事务保证
+@Transactional(rollbackFor = Exception.class)
+public TestLeaveVo insertByBo(TestLeaveBo bo) {
+    // 1. 保存业务数据
+    TestLeave entity = BeanUtil.toBean(bo, TestLeave.class);
+    entity.setStatus("draft");
+    baseMapper.insert(entity);
+
+    // 2. 如果需要同时操作工作流数据,确保在同一事务中
+    return BeanUtil.toBean(entity, TestLeaveVo.class);
+}
+```
+
+### 8.2 前端开发最佳实践
+
+#### 1. 组件引入规范
+
+```vue
+<script setup>
+// 工作流组件统一引入
+import SubmitVerify from '@/components/Process/submitVerify.vue';
+import ApprovalRecord from '@/components/Process/approvalRecord.vue';
+import ApprovalButton from '@/components/Process/approvalButton.vue';
+
+// API接口引入
+import { addLeave, getLeave, updateLeave } from '@/api/workflow/leave';
+import { startWorkFlow } from '@/api/workflow/task';
+</script>
+```
+
+#### 2. 表单验证规范
+
+```javascript
+// 工作流表单必须包含的验证规则
+const rules = {
+    // 业务字段验证
+    leaveType: [{ required: true, message: '请假类型不能为空', trigger: 'blur' }],
+    leaveDays: [{ required: true, message: '请假天数不能为空', trigger: 'blur' }],
+
+    // 如果有时间范围,需要自定义验证
+    leaveTime: [{ required: true, message: '请假时间不能为空', trigger: 'blur' }],
+};
+```
+
+#### 3. 错误处理规范
+
+```javascript
+// 提交表单错误处理
+const submitForm = async (status: string) => {
+    try {
+        // 表单验证
+        await leaveFormRef.value?.validate();
+
+        // 业务数据保存
+        buttonLoading.value = true;
+        const res = form.value.id ? await updateLeave(form.value) : await addLeave(form.value);
+
+        // 工作流处理
+        if (status === 'submit') {
+            await handleStartWorkFlow(res.data);
+        }
+    } catch (error) {
+        console.error('提交失败:', error);
+        proxy?.$modal.msgError('操作失败,请重试');
+    } finally {
+        buttonLoading.value = false;
+    }
+};
+```
+
+### 8.3 性能优化
+
+#### 1. 组件懒加载
+
+```javascript
+// 工作流组件按需加载
+const SubmitVerify = defineAsyncComponent(() => import('@/components/Process/submitVerify.vue'));
+const ApprovalRecord = defineAsyncComponent(() =>
+    import('@/components/Process/approvalRecord.vue'),
+);
+```
+
+#### 2. 接口优化
+
+```javascript
+// 避免重复请求,使用缓存
+const { data: taskInfo, loading } = useCachedRequest(() => getTask(taskId.value), {
+    cacheKey: `task_${taskId.value}`,
+    ttl: 5 * 60 * 1000, // 5分钟缓存
+});
+```
+
+---
+
+## 9. 常见问题
+
+### 9.1 MyBatis 映射错误
+
+**问题**: `Could not set property 'createBy'`
+
+**原因**: VO 类缺少基础字段,但 SQL 查询包含这些字段
+
+**解决**: 确保所有 VO 类包含统一的基础字段
+
+```java
+// 正确的VO类定义
+public class TestLeaveVo {
+    // 业务字段
+    private Long id;
+    private String leaveType;
+
+    // 必须包含的基础字段
+    private Long createBy;
+    private Date createTime;
+    private Long updateBy;
+    private Date updateTime;
+}
+```
+
+### 9.2 工作流组件不显示
+
+**问题**: 审批按钮或其他工作流组件不显示
+
+**原因**:
+
+1. 没有添加 `@ConditionalOnEnable` 注解
+2. 配置文件中 `warm-flow.enabled=false`
+3. 组件引入路径错误
+
+**解决**:
+
+```yaml
+# 确保配置正确
+warm-flow:
+    enabled: true
+```
+
+```java
+// 确保添加条件注解
+@ConditionalOnEnable
+@RestController
+public class TestLeaveController {
+    // 控制器逻辑
+}
+```
+
+### 9.3 权限问题
+
+**问题**: 接口访问被拒绝
+
+**原因**: 缺少权限注解或权限配置不正确
+
+**解决**:
+
+1. 添加权限注解:`@SaCheckPermission("workflow:leave:list")`
+2. 在菜单管理中配置对应的权限标识
+3. 为用户角色分配相应权限
+
+### 9.4 流程启动失败
+
+**问题**: 启动工作流时报错
+
+**原因**:
+
+1. 流程定义未发布
+2. 流程编码不存在
+3. 业务数据状态不正确
+
+**解决**:
+
+1. 检查流程定义是否已发布
+2. 确认 `flowCode` 参数正确
+3. 确保业务数据状态为 `draft`
+
+### 9.5 日期格式问题
+
+**问题**: 日期选择器数据格式不匹配
+
+**原因**: 前端日期格式与后端不一致
+
+**解决**:
+
+```vue
+<!-- 统一使用标准格式 -->
+<el-date-picker
+    v-model="leaveTime"
+    type="daterange"
+    value-format="YYYY-MM-DD HH:mm:ss"
+    :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+/>
+```
+
+---
+
+## 10. 总结
+
+warm-flow 工作流框架为本项目提供了完整的工作流解决方案,具有以下优势:
+
+1. **轻量级**: 核心简洁,易于理解和维护
+2. **可扩展**: 支持自定义业务逻辑和权限控制
+3. **可视化**: 内置流程设计器和流程图展示
+4. **完整性**: 提供完整的前后端组件和示例
+
+通过请假工作流示例,开发者可以快速掌握工作流开发的完整流程,并应用到其他业务场景中。
+
+---
+
+**文档维护**: 本文档随项目发展持续更新  
+**最后更新**: 2025-01-09  
+**版本**: v1.0