zeebe-bpmn-oms v1.0.2

zeebe-bpmn-oms

Project setup

yarn install

Compiles and hot-reloads for development

yarn serve

Compiles and minifies for production

yarn build

Lints and fixes files

yarn lint

Customize configuration

See Configuration Reference.

使用时需要注意

1、给window绑定一个全局对象：window.$bpmnApi，可以在main.js文件引入 2、该对象需要三个方法 const getTabs = () => {} 获取标签头 const getPublicVariables = () => {} 获取公共变量 const getCustomvariables = () => {} 获取自定义变量 window.$bpmnApi = { getTabs, getPublicVariables, getCustomVariables }

3、初始化zeebeModeler后，要将该实例绑定到window this.bpmnModeler = new BpmnModeler({ container: "#flow-designer-canvas", propertiesPanel: '#properties-panel', }); let result = await this.bpmnModeler.importXML(xml); window.bpmnModeler = this.bpmnModeler;

4、HTML结构

<div class="flow-designer">
    <div class="canvas" id="flow-designer-canvas" />
    <div id="properties-panel"/>
</div>

5、maig.js引入样式文件 import 'bpmn-js/dist/assets/diagram-js.css'; import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'; import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'; import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'; import 'bpmn-js-properties-panel/dist/assets/bpmn-js-properties-panel.css';

import "zeebe-bpmn-oms/src/assets/default.css";