flowable-modeler-4arco

install 安装

yarn add flowable-modeler-4arco

import 引入

import flowableModeler from 'flowable-modeler-4arco/package/index'

use 使用

<flowableModeler></flowableModeler>

props/method 属性/方法

• users

  用于提供用户选择，格式为

    [{
        name: 'zhangsan',
        value: '1'
      }, {
        name: 'lisi',
        value: '2'
      }, {
        name: 'wangwu',
        value: '3'
      }]

• groups

  用于提供候选组。格式为

    [{
        name: '普通组',
        value: '1'
      }, {
        name: '特殊组',
        value: '2'
      }]

• onSave

  保存方法回调，参数为xml,

    onSave(xml) {
      console.log(xml);
    }

• diagramXML

  用来而展现已有模型的xml

• slot 插件

  增加toolbar按钮插件，例如：

    <flowableModeler>
      <template #toolbar>
        <a-button>自定义按钮</a-button>
      </template>
    </flowableModeler>

arco-design依赖

本插件是基于vue3和arco design vue的，务必要安装@arco-design/web-vue，在main中设置全局可用，例如：

import ArcoVue from '@arco-design/web-vue';
import ArcoVueIcon from '@arco-design/web-vue/es/icon';
import '@arco-design/web-vue/dist/arco.css';

createApp(App).use(ArcoVue).use(ArcoVueIcon).mount('#app')

screenshot 截图

See See