仿釘釘流程輕松實(shí)現(xiàn)JSON轉(zhuǎn)BPMN完整實(shí)現(xiàn)過(guò)程示例
前言
寫(xiě)過(guò)工作流都會(huì)遇到這樣的難題，希望流程的設(shè)計(jì)可以類似釘釘一樣簡(jiǎn)單明了，而不是超級(jí)不有好的bpmn設(shè)計(jì)器，上網(wǎng)大概搜了一下實(shí)現(xiàn)方案，前端仿釘釘設(shè)計(jì)器一大堆，例如wflow，smart-flow-design，參照這些源碼前端設(shè)計(jì)器不成問(wèn)題
問(wèn)題在于這樣的設(shè)計(jì)器數(shù)據(jù)是json格式，不符合bpmn協(xié)議，就無(wú)法和activiti，flowable等工作流直接對(duì)接
如果自己開(kāi)發(fā)工作流引擎，但開(kāi)發(fā)成本肯定比較大，所以還是希望能實(shí)現(xiàn)自定義的json和xml可以轉(zhuǎn)換
方案
轉(zhuǎn)換這個(gè)活可以前端干，也可以后端干，如果前端干可以使用bpmn-moddle，bpmn.js就是使用它生成的xml，但大概看了一下發(fā)現(xiàn)文檔稀缺，使用很起來(lái)很難
最終決定使用java轉(zhuǎn)換，因?yàn)榘l(fā)現(xiàn)activiti包中的BpmnModel可以很輕松畫(huà)出xml，而且基本不用看文檔，.方法名基本就能和bpmn協(xié)議對(duì)上號(hào)
json協(xié)議
前后端使用json來(lái)表達(dá)流程設(shè)計(jì)，那一定要訂一套自己的協(xié)議，大概按照smart-flow-design寫(xiě)一個(gè)簡(jiǎn)版的
smart-flow-design
{
"id": "節(jié)點(diǎn)id",
"name": "節(jié)點(diǎn)名稱",
"type": "申請(qǐng)節(jié)點(diǎn)/審核節(jié)點(diǎn)/分支節(jié)點(diǎn)/抄送節(jié)點(diǎn)",
"next": "下一節(jié)點(diǎn)",
"exclusive": [// 排他條件
{
// 條件
"condition": "條件表達(dá)式",
//分支節(jié)點(diǎn)內(nèi)部流程
"process": {}
}
],
// 委派人
"assignee": {
"users": [],
"multiMode": "會(huì)簽/順序?qū)徟?
},
// 表單權(quán)限
"formPerms": [
{
"key": "字段key",
"perm": "權(quán)限類型 編輯/只讀/隱藏",
"required": true
}
]
}節(jié)點(diǎn)類型簡(jiǎn)單實(shí)現(xiàn)幾個(gè)：申請(qǐng)節(jié)點(diǎn)/審核節(jié)點(diǎn)/分支節(jié)點(diǎn)/抄送節(jié)點(diǎn)
通過(guò)next指向下一節(jié)點(diǎn)，實(shí)現(xiàn)一個(gè)鏈表結(jié)構(gòu)
如一個(gè)簡(jiǎn)單的流程設(shè)計(jì)如下
簡(jiǎn)單工作流
對(duì)應(yīng)的json數(shù)據(jù)如下
{
"id": "1",
"name": "申請(qǐng)節(jié)點(diǎn)",
"type": "ROOT",
"next": {
"id": "2",
"name": "審批節(jié)點(diǎn)",
"type": "APPROVAL",
"next": {
"id": "3",
"name": "抄送節(jié)點(diǎn)",
"type": "CC"
}
}
}帶分支的設(shè)計(jì)如下
分支工作流
對(duì)應(yīng)的json:
{
"id": "1",
"name": "申請(qǐng)節(jié)點(diǎn)",
"type": "ROOT",
"next": {
"id": "2",
"name": "條件節(jié)點(diǎn)",
"type": "EXCLUSIVE",
"exclusive": [
{
"condition": "amount>=100"
},
{
"condition": "amount<100",
"process": {
"id": "4",
"name": "審批人1",
"type": "APPROVAL",
"next": null
}
}
],
"next": {
"id": "3",
"name": "審批人2",
"type": "APPROVAL"
}
}
}基本上這個(gè)json數(shù)據(jù)結(jié)構(gòu)就足夠標(biāo)識(shí)很多場(chǎng)景了，分支條件可以自己再寫(xiě)復(fù)雜一點(diǎn)，如果需要擴(kuò)展新增屬性即可
java
java 創(chuàng)建一些實(shí)體來(lái)接受json，很簡(jiǎn)單就不詳細(xì)寫(xiě)了，大概如下
@Data
public class ProcessNode {
@ApiModelProperty(value = "節(jié)點(diǎn)ID")
private String id;
@ApiModelProperty(value = "節(jié)點(diǎn)名稱")
private String name;
@ApiModelProperty(value = "節(jié)點(diǎn)類型")
private String type;
@ApiModelProperty(value = "下一節(jié)點(diǎn)")
private ProcessNode next;
@ApiModelProperty(value = "分支")
private List<ExclusiveBranch> exclusive;
@ApiModelProperty(value = "委托人")
private Assignee assignee;
@ApiModelProperty(value = "表單權(quán)限")
private List<FormPerm> formPerms;
}
@Data
public class ExclusiveBranch {
@ApiModelProperty(value = "id")
private String id;
@ApiModelProperty(value = "分支條件")
private String condition;
@ApiModelProperty(value = "分支內(nèi)部流程")
private ProcessNode process;
}
@Data
public class Assignee {
@ApiModelProperty(value = "委托人列表")
private List<String> users;
@ApiModelProperty(value = "多人審批方式")
private String multiMode;
}在controller使用@RequestBody接受一下前端傳來(lái)的json即可
轉(zhuǎn)BPMN
接下來(lái)就把這個(gè)java實(shí)體轉(zhuǎn)成xml，引入今天的主角：BpmnModel
引入依賴
<dependency>
<groupId>org.activiti</groupId>
<artifactId>activiti-bpmn-model</artifactId>
<version>7.1.0.M1</version>
</dependency>即可開(kāi)始使用BpmnModel開(kāi)始繪制bpmn協(xié)議的工作流
初始化
首先準(zhǔn)備工作流
BpmnModel model = new BpmnModel();
Process process = new Process();
model.addProcess(process);
process.setId("Process_"+UUID.randomUUID());
process.setExecutable(true);其中process就相當(dāng)于我們的圖紙，后續(xù)工作就是往這個(gè)圖紙上畫(huà)節(jié)點(diǎn)和線
繪制開(kāi)始結(jié)束
由于json協(xié)議中不包含開(kāi)始結(jié)束節(jié)點(diǎn)，所以首先要繪制出兩個(gè)節(jié)點(diǎn)
開(kāi)始節(jié)點(diǎn)
// 新建開(kāi)始節(jié)點(diǎn)
StartEvent startEvent = new StartEvent();
startEvent.setId("_start");
// 繪制到圖紙
process.addFlowElement(startEvent)
結(jié)束節(jié)點(diǎn)
// 新建結(jié)束節(jié)點(diǎn)
EndEvent endEvent = new EndEvent();
endEvent.setId("_end");
// 繪制到圖紙
process.addFlowElement(endEvent)
到此兩個(gè)節(jié)點(diǎn)就畫(huà)出來(lái)了，但是還沒(méi)有任何線
繪制bpmn
接下來(lái)就根據(jù)json的節(jié)點(diǎn)來(lái)繪制bpmn節(jié)點(diǎn)，同時(shí)還要考慮線的繪制節(jié)點(diǎn)的連接線
json協(xié)議中是next指向下一節(jié)點(diǎn)，所以繪制節(jié)點(diǎn)的方法一定是要使用遞歸的畫(huà)法，為了處理畫(huà)線問(wèn)題，可以在繪制方法中添加兩個(gè)參數(shù)preId(上一節(jié)點(diǎn)ID)和endId(結(jié)束節(jié)點(diǎn)ID)
這樣邏輯為如下：
- 繪制bpmn節(jié)點(diǎn)
- 繪制上一節(jié)點(diǎn)與當(dāng)前節(jié)點(diǎn)的連線
- 如果有next，遞歸繪制下一節(jié)點(diǎn)
- 如果沒(méi)有next，繪制當(dāng)前節(jié)點(diǎn)與結(jié)束節(jié)點(diǎn)的連接線
考慮到上一根線可能有條件，所以再加入?yún)?shù)preExpression(上一根線的條件)，最終方法如下
/**
* 繪制節(jié)點(diǎn)
* @param process bpmn process 圖紙
* @param node json的節(jié)點(diǎn)
* @param preId 上一節(jié)點(diǎn)id
* @param endId 結(jié)束節(jié)點(diǎn)
* @param preExpression 上一節(jié)點(diǎn)表達(dá)式
*/
public void drawNode(Process process, ProcessNode node, String preId, String endId, String preExpression) {
// 根據(jù)type繪制不同種類的節(jié)點(diǎn)
Inout inout = drawNodeByType(process, node);
// 繪制前一根線
process.addFlowElement(createSequenceFlow(preId, inout.getIn(), preExpression));
if (node.getNext() == null) {
// 沒(méi)有下一步，繪制指向結(jié)束的線
process.addFlowElement(createSequenceFlow(inout.getOut(), endId, null));
} else {
// 有下一步，遞歸繪制下一個(gè)節(jié)點(diǎn)
drawNode(process, node.getNext(), inout.getOut(), endId, null);
}
}其中drawNodeByType(process, node)方法根據(jù)不同的種類畫(huà)不通過(guò)的節(jié)點(diǎn)，反回是一個(gè)Inout
@Data
@AllArgsConstructor
public class Inout {
private String in;
private String out;
}
代表進(jìn)入節(jié)點(diǎn)的id和出節(jié)點(diǎn)的id，這是因?yàn)?strong>json的節(jié)點(diǎn)和bpmn的節(jié)點(diǎn)不是一一對(duì)應(yīng)的，普通的審核節(jié)點(diǎn)，in和out都是審核節(jié)點(diǎn)id，而如果是分支節(jié)點(diǎn)，in代表分支的開(kāi)始網(wǎng)關(guān)id，out代表分支結(jié)束網(wǎng)關(guān)的id，接下來(lái)分別以兩種節(jié)點(diǎn)類型舉例來(lái)實(shí)現(xiàn)
/**
* 繪制不同種類節(jié)點(diǎn)
* @param process
* @param node
* @return
*/
private Inout drawNodeByType(Process process, ProcessNode node) {
if (node.getType().equals("審核節(jié)點(diǎn)")) {
return drawAuditNode(process, node);
} else if (node.getType().equals("分支節(jié)點(diǎn)")) {
return drawExclusiveNode(process, node);
} else {
throw new IllegalArgumentException();
}
}審核節(jié)點(diǎn)
/**
* 繪制審核節(jié)點(diǎn)
* @param process
* @param node
* @return
*/
private Inout drawAuditNode(Process process, ProcessNode node) {
// 繪制節(jié)點(diǎn)
String id = "Node_"+UUID.randomUUID();
UserTask userTask = new UserTask();
userTask.setId(id);
userTask.setName(node.getName());
// 設(shè)置多實(shí)例
userTask.setAssignee("${user}");
MultiInstanceLoopCharacteristics multiInstanceLoopCharacteristics = new MultiInstanceLoopCharacteristics();
if (node.getAssignee().getMultiMode().equals("順序?qū)徟?)) {
multiInstanceLoopCharacteristics.setSequential(true);
}
multiInstanceLoopCharacteristics.setElementVariable("user");
// 完成條件
multiInstanceLoopCharacteristics.setCompletionCondition("${nrOfInstances == nrOfCompletedInstances}");
multiInstanceLoopCharacteristics.setInputDataItem("${users}");
userTask.setLoopCharacteristics(multiInstanceLoopCharacteristics);
// 保存json節(jié)點(diǎn)配置到擴(kuò)展屬性
Map<String, Object> extensions = new HashMap<>();
extensions.put("node", node);
BpmnUtil.addExtensionProperty(userTask, extensions);
// 只有一個(gè)節(jié)點(diǎn)，in&out相同
return new Inout(id, id);
}分支節(jié)點(diǎn)
/**
* 繪制分支節(jié)點(diǎn)
* @param process
* @param node
* @return
*/
private Inout drawExclusiveNode(Process process, ProcessNode node) {
// 開(kāi)始網(wǎng)關(guān)
String startId = "Exclusive_"+UUID.randomUUID();
ExclusiveGateway startGateway = new ExclusiveGateway();
startGateway.setId(startId);
process.addFlowElement(startGateway);
// 結(jié)束網(wǎng)關(guān)
String endId = "Exclusive_"+UUID.randomUUID();
ExclusiveGateway endGateway = new ExclusiveGateway();
endGateway.setId(endId);
process.addFlowElement(endGateway);
// 繪制分支
List<ExclusiveBranch> branches = node.getExclusive();
for (ExclusiveBranch branch : branches) {
String expression = branch.getCondition();
if (branch.getProcess()==null) {
// 沒(méi)有子流程，直接繪制結(jié)束線
process.addFlowElement(createSequenceFlow(startId, endId, expression));
} else {
// 有子流程，遞歸繪制子流程
drawNode(process, branch.getProcess(), startId, endId, expression);
}
}
// int和out不一樣
return new Inout(startId, endId);
}
注意：繪制分支時(shí)如果有子流程，又回調(diào)用了drawNode，這是preId為開(kāi)始網(wǎng)關(guān)id，endId是結(jié)束網(wǎng)關(guān)id，并且攜帶了表達(dá)式
其他類型的節(jié)點(diǎn)都類似，很簡(jiǎn)單，不寫(xiě)了
bpmn繪制完了，如果使用activiti就可以直接部署B(yǎng)pmnModel對(duì)象了
Deployment deployment = repositoryService
.createDeployment()
.addBpmnModel("test", bpmnModel)
.deploy();
自動(dòng)布局
如果要轉(zhuǎn)換xml，上面的bpmnModel只有節(jié)點(diǎn)和線，并沒(méi)有布局，可以使用第三方輕松布局
<dependency>
<groupId>org.activiti</groupId>
<artifactId>activiti-bpmn-layout</artifactId>
<version>7.1.0.M1</version>
<scope>compile</scope>
</dependency>代碼一行就夠了
// 四.自動(dòng)布局 new BpmnAutoLayout(bpmnModel).execute();
轉(zhuǎn)xml
如果想把BpmnModel轉(zhuǎn)換為xml，也很簡(jiǎn)單，引入依賴
<dependency>
<groupId>org.activiti</groupId>
<artifactId>activiti-bpmn-converter</artifactId>
<version>7.1.0.M1</version>
</dependency>轉(zhuǎn)換代碼
// 五.轉(zhuǎn)xml
BpmnXMLConverter bpmnXMLConverter=new BpmnXMLConverter();
byte[] convertToXML = bpmnXMLConverter.convertToXML(bpmnModel);
String xml=new String(convertToXML);
xml = xml.replaceAll("<","<").replaceAll(">",">");最終
貼一下完整實(shí)例代碼(代碼只是簡(jiǎn)版，只為提供思路
/**
* @Author pq
* @Date 2022/10/20 10:58
* @Description
*/
@SuppressWarnings("ALL")
public class BpmnConvert {
public String toBpmn(ProcessNode node) {
// 一.準(zhǔn)備工作
BpmnModel bpmnModel = new BpmnModel();
Process process = new Process(); // 相當(dāng)于圖紙
bpmnModel.addProcess(process);
process.setId("Process_"+UUID.randomUUID());
process.setExecutable(true);
// 二.開(kāi)始結(jié)束節(jié)點(diǎn)
StartEvent startEvent = new StartEvent();// 新建開(kāi)始節(jié)點(diǎn)
startEvent.setId("_start");
process.addFlowElement(startEvent);// 繪制到圖紙
EndEvent endEvent = new EndEvent(); // 新建結(jié)束節(jié)點(diǎn)
endEvent.setId("_end");// 繪制到圖紙
process.addFlowElement(endEvent);
// 三.遞歸繪制節(jié)點(diǎn)
drawNode(process, node, "_start", "_end", null);
// 四.自動(dòng)布局
new BpmnAutoLayout(bpmnModel).execute();
// 五.轉(zhuǎn)xml
BpmnXMLConverter bpmnXMLConverter=new BpmnXMLConverter();
byte[] convertToXML = bpmnXMLConverter.convertToXML(bpmnModel);
String xml=new String(convertToXML);
xml = xml.replaceAll("<","<").replaceAll(">",">");
return xml;
}
/**
* 繪制節(jié)點(diǎn)
* @param process bpmn process 圖紙
* @param node json的節(jié)點(diǎn)
* @param preId 上一節(jié)點(diǎn)id
* @param endId 結(jié)束節(jié)點(diǎn)
* @param preExpression 上一節(jié)點(diǎn)表達(dá)式
*/
public void drawNode(Process process, ProcessNode node, String preId, String endId, String preExpression) {
// 根據(jù)type繪制不同種類的節(jié)點(diǎn)
Inout inout = drawNodeByType(process, node);
// 繪制前一根線
process.addFlowElement(createSequenceFlow(preId, inout.getIn(), preExpression));
if (node.getNext() == null) {
// 沒(méi)有下一步, 繪制指向結(jié)束的線
process.addFlowElement(createSequenceFlow(inout.getOut(), endId, null));
} else {
// 有下一步, 遞歸繪制下一個(gè)節(jié)點(diǎn)
drawNode(process, node.getNext(), inout.getOut(), endId, null);
}
}
/**
* 繪制不同種類節(jié)點(diǎn)
* @param process
* @param node
* @return
*/
private Inout drawNodeByType(Process process, ProcessNode node) {
if (node.getType().equals("審核節(jié)點(diǎn)")) {
return drawAuditNode(process, node);
} else if (node.getType().equals("分支節(jié)點(diǎn)")) {
return drawExclusiveNode(process, node);
} else {
throw new IllegalArgumentException();
}
}
/**
* 繪制審核節(jié)點(diǎn)
* @param process
* @param node
* @return
*/
private Inout drawAuditNode(Process process, ProcessNode node) {
// 繪制節(jié)點(diǎn)
String id = "Node_"+UUID.randomUUID();
UserTask userTask = new UserTask();
userTask.setId(id);
userTask.setName(node.getName());
// 設(shè)置多實(shí)例
userTask.setAssignee("${user}");
MultiInstanceLoopCharacteristics multiInstanceLoopCharacteristics = new MultiInstanceLoopCharacteristics();
if (node.getAssignee().getMultiMode().equals("順序?qū)徟?)) {
multiInstanceLoopCharacteristics.setSequential(true);
}
multiInstanceLoopCharacteristics.setElementVariable("user");
// 完成條件
multiInstanceLoopCharacteristics.setCompletionCondition("${nrOfInstances == nrOfCompletedInstances}");
multiInstanceLoopCharacteristics.setInputDataItem("${users}");
userTask.setLoopCharacteristics(multiInstanceLoopCharacteristics);
// 保存json節(jié)點(diǎn)配置到擴(kuò)展屬性
Map<String, Object> extensions = new HashMap<>();
extensions.put("node", node);
BpmnUtil.addExtensionProperty(userTask, extensions);
return new Inout(id, id);
}
/**
* 繪制分支節(jié)點(diǎn)
* @param process
* @param node
* @return
*/
private Inout drawExclusiveNode(Process process, ProcessNode node) {
// 開(kāi)始網(wǎng)關(guān)
String startId = "Exclusive_"+UUID.randomUUID();
ExclusiveGateway startGateway = new ExclusiveGateway();
startGateway.setId(startId);
process.addFlowElement(startGateway);
// 結(jié)束網(wǎng)關(guān)
String endId = "Exclusive_"+UUID.randomUUID();
ExclusiveGateway endGateway = new ExclusiveGateway();
endGateway.setId(endId);
process.addFlowElement(endGateway);
// 繪制分支
List<ExclusiveBranch> branches = node.getExclusive();
for (ExclusiveBranch branch : branches) {
String expression = branch.getCondition();
if (branch.getProcess()==null) {
// 沒(méi)有子流程，直接繪制結(jié)束線
process.addFlowElement(createSequenceFlow(startId, endId, expression));
} else {
// 有子流程，遞歸繪制子流程
drawNode(process, branch.getProcess(), startId, endId, expression);
}
}
// int和out不一樣
return new Inout(startId, endId);
}
/**
* 創(chuàng)建連線
* @param from
* @param to
* @return
*/
public SequenceFlow createSequenceFlow(String from, String to, String conditionExpression) {
SequenceFlow flow = new SequenceFlow();
flow.setId(from + "-" + to);
flow.setSourceRef(from);
flow.setTargetRef(to);
if (conditionExpression != null) {
flow.setConditionExpression(conditionExpression);
}
return flow;
}
}核心代碼真的沒(méi)幾行，細(xì)節(jié)自己完善即可
我自己做了個(gè)相對(duì)復(fù)雜的json，轉(zhuǎn)換為xml最終在bpmn.js展示效果如下
功能都沒(méi)大問(wèn)題，就是自動(dòng)布局的線有點(diǎn)扭曲
以上就是仿釘釘流程輕松實(shí)現(xiàn)JSON轉(zhuǎn)BPMN完整實(shí)現(xiàn)過(guò)程示例的詳細(xì)內(nèi)容，更多關(guān)于仿釘釘流程JSON轉(zhuǎn)BPMN的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
解讀SpringBoot接收List<Bean>參數(shù)問(wèn)題(POST請(qǐng)求方式)
這篇文章主要介紹了解讀SpringBoot接收List<Bean>參數(shù)問(wèn)題(POST請(qǐng)求方式)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09
springMvc注解之@ResponseBody和@RequestBody詳解
本篇文章主要介紹了springMvc注解之@ResponseBody和@RequestBody詳解，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-05-05
數(shù)組是有序的元素序列，若將有限個(gè)類型相同的變量的集合命名，那么這個(gè)名稱為數(shù)組名。組成數(shù)組的各個(gè)變量稱為數(shù)組的分量，也稱為數(shù)組的元素，有時(shí)也稱為下標(biāo)變量。數(shù)組是在程序設(shè)計(jì)中，為了處理方便， 把具有相同類型的若干元素按有序的形式組織起來(lái)的一種形式2022-03-03
這篇文章主要介紹了Java代碼中設(shè)置輸出字符集為UTF-8,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-05-05
總結(jié)一下關(guān)于在Java8中使用stream流踩過(guò)的一些坑
java8新增了stream流式處理,對(duì)于list的各種操作處理提供了好多方法 ,用過(guò)的都知道,方便極了.比如篩選、排序、合并、類型轉(zhuǎn)換等等.以下是我實(shí)際工作中踩過(guò)的坑,記錄下避免大家踩坑,需要的朋友可以參考下2021-06-06
最近更新了idea2022.2版本，這是一個(gè)比較大的軟件版本更迭，下面小編給大家介紹下idea2022.2?閃退的問(wèn)題及解決方法,需要的朋友可以參考下2022-08-08
Java遠(yuǎn)程調(diào)用Shell腳本并獲取輸出信息【推薦】
這篇文章主要介紹了Java遠(yuǎn)程調(diào)用Shell腳本并獲取輸出信息，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-09-09
Java Guava排序器Ordering原理及代碼實(shí)例
這篇文章主要介紹了Java Guava排序器Ordering原理及代碼實(shí)例,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-11-11
Spring Security實(shí)現(xiàn)自動(dòng)登陸功能示例
自動(dòng)登錄在很多網(wǎng)站和APP上都能用的到，解決了用戶每次輸入賬號(hào)密碼的麻煩。本文就使用Spring Security實(shí)現(xiàn)自動(dòng)登陸功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-11-11
這篇文章主要介紹了java不通過(guò)配置文件初始化logger示例,需要的朋友可以參考下2014-05-05