bpmn2适配activiti，调整初始位置，避免图片在弹框难回显

最新推荐文章于 2024-06-26 13:31:27 发布

Program W

最新推荐文章于 2024-06-26 13:31:27 发布

阅读量2.5k

点赞数 1

分类专栏：工作流文章标签： activiti

本文链接：https://blog.csdn.net/weixin_46037781/article/details/119330852

版权

文章目录

一、因为bpmn自带的camunda，所以需要适配activiti.json
二、完成后的xml
三、调整初始位置，避免图片在弹框难回显
四、显示流程图
- - - 4.1、这里就是为了这个代理人，才适配的`activiti`
五、适配前后

一、因为bpmn自带的camunda，所以需要适配activiti.json

  import BpmnModeler from 'bpmn-js/lib/Modeler'
  import PropertiesPanelModule from 'bpmn-js-properties-panel'
  //上面两个是bpmn的
  import PropertiesProviderModule from './properties-panel/provider/activiti' // bpmn的camunda配置提供改成了ActivitiPropertiesProvider
  
  import ActivitiModdleDescriptor from './activiti' // 适配的json
  import CustomControls from './customControls/' //CustomContextPad、CustomPalette、index
  import CustomTranslate from './CustomTranslate' //翻译

mounted () {
   
      const canvas = this.$refs.canvas

      const CustomTranslateModule = {
   
        translate: ['value', CustomTranslate]
      };

      this.bpmnModeler = new BpmnModeler({
   
        container: canvas,
        propertiesPanel: {
   
          parent: '#properties'
        },
        additionalModules: [
          PropertiesProviderModule,
          PropertiesPanelModule,
          CustomTranslateModule,
          CustomControls
        ],
        moddleExtensions: {
   
          activiti: ActivitiModdleDescriptor
        }
      });
    }

activiti.json

{
   
  "name": "Activiti",
  "uri": "http://activiti.org/bpmn",
  "prefix": "activiti",
  "xml": {
   
    "tagAlias": "lowerCase"
  },
  "associations": [],
  "types": [
    {
   
      "name": "Definitions",
      "isAbstract": true,
      "extends": [
        "bpmn:Definitions"
      ],
      "properties": [
        {
   
          "name": "diagramRelationId",
          "isAttr": true,
          "type": "String"
        }
      ]
    }
......
],
    
  "emumerations": [ ]
}

二、完成后的xml

<?xml version="1.0" encoding="UTF-8"?>
<bpmn2:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:activiti="http://activiti.org/bpmn" id="sample-diagram" targetNamespace="http://activiti.org/bpmn" xsi:schemaLocation="http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd">
<bpmn2:process id="model_audit" name="model_audit" isExecutable="true">
<bpmn2:startEvent id="StartEvent_1" name="开始">
<bpmn2:outgoing>Flow_1p8y3br