0.0.2 • Published 4 years ago
@sscfaith/vue-bpmn v0.0.2
简介
本项目是一款基于 bpmn.js 的流程设计器。 在线预览
- 暂不提供源码
- 支持 设计/预览 模式
- 支持camunda，flowable，activiti的基本xml配置
- 由于本人对流程引擎配置了解有限，缺少什么配置欢迎提issue，并附上xml。感谢！
依赖（请自行安装）
element-ui 2.13.2+
$ npm i element-ui或自行引入 cdn
安装
组件
$ npm i @sscfaith/vue-bpmn
或
$ yarn add @sscfaith/vue-bpmn源码
github
$ yarn
$ yarn servehtml
详见 examples
使用
import VueBpmn from "@sscfaith/vue-bpmn"
export default {
components: { VueBpmn }
}<vue-bpmn style="height: 100vh;"
option="option"
storage></vue-bpmn>属性
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| option | 组件配置（详情见下） | Object | {} |
| storage | 开启缓存配置 | Boolean | false |
option 字段配置
| 参数 | 说明 | 类型 | 默认值 | 可选值 | |
|---|---|---|---|---|---|
| mode | 设计/预览模式 | String | 'edit' | 'edit', 'view' | |
| toolbar | 顶部工具栏 | Array | 'open', 'create', 'fit', 'zoom-in', 'zoom-out', 'undo', 'redo', 'import', 'preview', 'get', 'download-xml', 'download-svg' | - | |
| engine | 流程引擎 | String | 'camunda' | 'camunda', 'flowable', 'activiti' | - |
| xml | 初始xml | String | '' | - | |
| lint | 是否开启模型校验 | Boolean | true | true/false | |
| flows | 流转节点颜色配置(mode='view')时生效 | Array | [] | - |
flows 字段配置
| 属性 | 说明 | 类型 | 可选值 |
|---|---|---|---|
| id | 节点id | String | - |
| class | 节点class名（可自定义） | String | 'nodeSuccess', 'nodeWarn', 'nodeError', 'lineSuccess', 'lineWarn', 'lineError' |
| tips | 节点提示 | String | - |
事件
| 名称 | 说明 | 回调参数 |
|---|---|---|
| get | 获取xml回调 | 当前配置的xml |
TODO
- 支持 设计/预览 模式
- 支持camunda，flowable，activiti的基本xml配置
流程配置
- id 流程id
- name 名称
- document 描述
Start Event
- id 节点id
- name 名称
- document 描述
- executionListener 执行监听
- form 表单配置
Sequence Flow
- id 节点id
- name 名称
- document 描述
- conditionExpression 流转条件
- executionListener 执行监听
Gateway
- id 节点id
- name 名称
- document 描述
User Task
- id 节点id
- name 名称
- document 描述
- assignee 审批人（目前只支持填写）
- candidateUsers 候选用户（目前只支持填写）
- candidateGroups 候选用户组（目前只支持填写）
- multiInstanceLoopCharacteristics 多实例
- loopCardinality 多实例 - 循环基数
- collection 多实例 - 集合
- elementVariable 多实例 - 元素变量
- completionCondition 多实例 - 完成条件
- taskListener 任务监听
- executionListener 执行监听
- form 表单配置
捐赠
如果你觉得本项目帮助到你的话，可以给作者买杯咖啡。
License
MIT Copyright (c) 2020-present SSC(273702440@qq.com)