由于新东家使用的是React，不是Vue，而自己一直想做一个关于工作流的应用出来，断断续续，花了几个月的时间，开发了工作流的功能，后面会继续完善。

技术栈

前端

前端是基于React开发的，使用了antd做页面布局，bpmn-js做流程图设计，使用vite工具打包

后端

后端是基于SpringBoot开发的，整合了flowable工作流引擎，mybatis-plus做持久层，SpringSecurity做认证和授权，jwt做token的生成、校验、解析

成果展示

首页

目前的首页，做得很简陋，后续做法：

• 增加待办列表：推送待办到首页

• 增加菜单快捷入口

流程模型

模型列表

模型设计

以报销流程为例

这里有两个并行多实例节点：会计审批和出纳审批，是支持多实例的：

多实例的完成条件，设置为比例（0.01~1）之间，满足条件，则流转到下一个节点。比如这里的会计审批节点，设置为0.01，代表只需要一个人审批即可。

任务管理

待签收任务

包括了个人待签收和岗位待签收（这里是角色待签收）

待办任务

签收任务之后，就会把任务变成自己的待办任务了

办理任务：

这个页面待优化，应该点了对应的按钮，弹窗显示对应的栏位，这个暂时没有做

查看审批记录：

流程跟踪，可视化流程走到哪里了：

目前待优化的点：

• 走过的有些线没有高亮显示

• 对于退回的节点，还是会高亮显示（退回到目标节点之后的节点，都不应该高亮显示）

已办任务