RuoYi Office 文档

Appearance

流程设计器（钉钉、飞书） ​

Simple 设计器（仿钉钉/飞书风格）提供直观的拖拽式流程搭建体验，10 分钟即可完成审批流程配置，适合简单到中等复杂度的审批场景。界面基于 Vue3 + Vben Admin + Ant Design Vue 实现。 流程模型管理

实现原理 ​

Simple 设计器前端使用 JSON 数据结构描述流程，后端通过 SimpleModelUtils.buildBpmnModel() 将 JSON 转换为标准 BPMN 2.0 XML，最终由 Flowable 引擎执行。

两种设计器通过 BpmModelTypeEnum 区分：

  • BPMN(10)：标准 BPMN 设计器
  • SIMPLE(20)：仿钉钉/飞书设计器

1. 操作节点 ​

1.1 发起人节点 ​

流程的起点，配置发起人相关信息：

  • 谁可以发起此流程
  • 发起时需要填写的表单

1.2 审批人节点 ​

核心审批节点，配置项与 BPMN 用户任务一致：

  • 审批人规则（角色/部门/岗位/发起人自选等）
  • 多人审批方式（会签/或签/依次审批）
  • 表单字段权限
  • 操作按钮
  • 超时设置
  • 自动提醒

1.3 办理人节点 ​

与审批人节点类似，但审批意见不计入最终审批结果。适用于「经办」类型的节点。

1.4 抄送人节点 ​

将当前流程状态通知给指定人员，不阻塞流程。

2. 分支节点 ​

2.1 条件分支（排它网关） ​

根据条件选择一个分支执行：

  • 支持表单字段条件
  • 支持流程表达式
  • 需要设置默认分支

2.2 并行分支（并行网关） ​

所有分支同时执行，不进行条件判断：

  • 所有分支完成后才继续
  • 适合多部门并行审批

2.3 包容分支 ​

条件分支 + 并行分支的结合：

  • 根据条件选择多个分支执行
  • 满足条件的分支都会执行
  • 未满足任何条件时走默认分支

2.4 路由分支 ​

根据条件重定向到指定节点：

  • 不是传统的分支网关
  • 而是条件跳转（goto）

3. 其它节点 ​

3.1 子流程节点 ​

在主流程中嵌入子流程：

  • 同步子流程：子流程完成后主流程继续
  • 异步子流程：子流程与主流程并行执行

3.2 延迟器节点 ​

在流程中添加等待：

  • 固定时长（如等待 2 小时）
  • 固定日期（如等到某个时间点）

3.3 触发器节点 ​

执行到该节点时触发自动动作：

  • HTTP 请求
  • HTTP 回调
  • 更新数据
  • 删除数据

4. 前端组件 ​

Simple 设计器相关前端源码位于 ruoyi-office-vben/apps/web-antd/src/views/bpm：

组件路径说明
设计器ruoyi-office-vben/apps/web-antd/src/views/bpm/components/simple-process-design/Simple 流程设计器
查看器ruoyi-office-vben/apps/web-antd/src/views/bpm/processInstance/detail/modules/simple-bpm-viewer.vueSimple 流程图查看
节点组件ruoyi-office-vben/apps/web-antd/src/views/bpm/components/simple-process-design/components/nodes/各节点类型组件
节点配置ruoyi-office-vben/apps/web-antd/src/views/bpm/components/simple-process-design/components/nodes-config/节点配置面板