基于jeecgboot-vue3的Flowable流程-集成仿钉钉流程（六）仿钉钉流程的转bpmn流程图

因为这个项目license问题无法开源，更多技术支持与服务请加入我的知识星球。

1、转bpmn流程图接口

/*** 转为bpmn xml格式* @param processModel* @throws IOException*/@PostMapping("/ddtobpmnxml")public Result<?> ddToBpmnXml(@RequestBody ProcessModel processModel) {try {BpmnModel bpmnModel = processModel.toBpmnModel();return Result.OK(new String(new BpmnXMLConverter().convertToXML(bpmnModel)));} catch (Exception e) {e.printStackTrace();throw new RuntimeException("创建失败: e=" + e.getMessage());}}

2、toBpmnModel()方法

public BpmnModel toBpmnModel() {BpmnModel bpmnModel = new BpmnModel();// 命名空间bpmnModel.setTargetNamespace("https://flowable.org/bpmn20");// 创建一个流程Process process = new Process();// 设置流程的idprocess.setId(this.getCode());// 设置流程的nameprocess.setName(this.getName());// 设置流程的文档process.setDocumentation(this.getRemark());// 递归构建所有节点Node node = this.getProcess();List<FlowElement> flowElementList = node.convert();for (FlowElement flowElement : flowElementList) {process.addFlowElement(flowElement);}// 设置流程bpmnModel.addProcess(process);// 自动布局new BpmnAutoLayout(bpmnModel).execute();return bpmnModel;}

3、前端调用接口

const converterBpmn = () => {const processModel = {code: pCode.value,name: pName.value,icon: {name: 'el:HomeFilled',color: '#409EFF'},process: props.process,enable: true,version: 1,sort: 0,groupId: '',remark: ''}ddToBpmnXml(processModel).then(res => {console.log("ddToBpmnXml res",res)processView.title = pName.valueprocessView.index = pCode.valueprocessView.xmlData = res.resultprocessView.open = true})  
}

4、效果图