本文将介绍一种基于SpringBoot后端框架、Vue3前端技术栈以及LogicFlow流程图引擎的工作审批流程设计器实现方案,提供一套完整的可视化流程设计解决方案。
技术栈组成
后端框架:SpringBoot 3.x
前端框架:Vue3 + TypeScript + Vite
流程引擎:LogicFlow 1.3.x(核心库) + @logicflow/extension(插件集)
UI组件库:Element Plus
可视化流程设计器
拖拽式建模:支持BPMN标准元素(开始/结束事件、用户任务、网关等)
动态表单绑定:节点属性面板集成表单设计器,支持JSON Schema配置
状态可视化:根据审批状态(待审/通过/驳回)动态切换样式
多人审批:支持会签/或签模式,头像列表显示当前处理人
子流程:嵌套显示子流程状态概览
审批人动态指定:用户在申请时动态指定审批人
GitHub地址:github.com/337547038/a…
在线体验:337547038.github.io/ak-flow/