美文网首页
vue+bpmn.js+elementui实现流程设计器

vue+bpmn.js+elementui实现流程设计器

作者: 冯李 | 来源:发表于2020-07-10 17:12 被阅读0次

bpmn.js流程设计器组件

1、调整设计器UI布局,基于vue-elementui美化属性面板

2、支持设置任务变量、表达式、分支条件等,满足90%以上的业务需求

3、支持flowable和activiti

组件常用方法

1、配置支持flowable(activiti)

<vue-bpmn product="flowable"></vue-bpmn>

2、组件还在完善中,如果有需要扩展需求,可以参考以下三个事件:

// 监听选择事件,改变属性栏表单的显示与隐藏

this.modeler.on("selection.changed", e => { // TODO})

// 监听内容变化事件,改变属性烂的值

this.modeler.on("element.changed", e => { // TODO})

// 监听点击事件

this.modeler.on("element.click", e => { // TODO})

安装运行

yarn install

yarn serve

yarn build

在线demo

在线demo:http://47.108.140.13/bpmn/

后端代码,参照:https://github.com/fengli01/bpmn-spring-boot.git

相关文章

网友评论

      本文标题:vue+bpmn.js+elementui实现流程设计器

      本文链接:https://www.haomeiwen.com/subject/qlimcktx.html