BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 5bedff605a5b2e0e840e7fbfbf0a50fea86def51

Authored by YunaiV
2 parents c04ef59e 00a93ab9

Merge branch 'feature/vue3-bpm' of https://gitee.com/zhijiantianya/ruoyi-vue-pro… 

… into feature/vue3-bpm
Inline Side-by-side
Showing 61 changed files with 10207 additions and 47 deletions
yudao-ui-admin-vue3/package.json
  View file @5bedff6
... ... @@ -54,7 +54,15 @@
54 54 "vue-types": "^5.0.2",
55 55 "vxe-table": "^4.3.9",
56 56 "web-storage-cache": "^1.1.1",
57   - "xe-utils": "^3.5.7"
  57 + "xe-utils": "^3.5.7",
  58 + "bpmn-js-token-simulation": "^0.10.0",
  59 + "camunda-bpmn-moddle": "^7.0.1",
  60 + "fast-xml-parser": "^4.0.13",
  61 + "highlight.js": "^9.18.5",
  62 + "min-dash": "^4.0.0",
  63 + "vue3-treeselect": "^0.1.10",
  64 + "vuedraggable": "^4.1.0",
  65 + "xml-js": "^1.6.11"
58 66 },
59 67 "devDependencies": {
60 68 "@commitlint/cli": "^17.4.2",
... ... @@ -76,6 +84,8 @@
76 84 "autoprefixer": "^10.4.13",
77 85 "consola": "^2.15.3",
78 86 "eslint": "^8.32.0",
  87 + "bpmn-js": "^8.9.0",
  88 + "bpmn-js-properties-panel": "^0.46.0",
79 89 "eslint-config-prettier": "^8.6.0",
80 90 "eslint-define-config": "^1.14.0",
81 91 "eslint-plugin-prettier": "^4.2.1",
... ... @@ -123,4 +133,4 @@
123 133 "url": "https://gitee.com/zhijiantianya/ruoyi-vue-pro/issues"
124 134 },
125 135 "homepage": "https://gitee.com/zhijiantianya/ruoyi-vue-pro"
126 136 -}
  137 +}
127 138 \ No newline at end of file
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="my-process-designer">
  3 + <div class="my-process-designer__header">
  4 + <slot name="control-header"></slot>
  5 + <template v-if="!$slots['control-header']">
  6 + <ElButtonGroup key="file-control">
  7 + <XButton preIcon="ep:folder-opened" title="打开文件" @click="refFile.click()" />
  8 + <el-tooltip effect="light" placement="bottom">
  9 + <template #content>
  10 + <div style="color: #409eff">
  11 + <!-- <el-button link @click="downloadProcessAsXml()">下载为XML文件</el-button> -->
  12 + <XTextButton title="下载为XML文件" @click="downloadProcessAsXml()" />
  13 + <br />
  14 +
  15 + <!-- <el-button link @click="downloadProcessAsSvg()">下载为SVG文件</el-button> -->
  16 + <XTextButton title="下载为SVG文件" @click="downloadProcessAsSvg()" />
  17 + <br />
  18 +
  19 + <!-- <el-button link @click="downloadProcessAsBpmn()">下载为BPMN文件</el-button> -->
  20 + <XTextButton title="下载为BPMN文件" @click="downloadProcessAsBpmn()" />
  21 + </div>
  22 + </template>
  23 + <XButton title="下载文件" preIcon="ep:download" />
  24 + </el-tooltip>
  25 + <el-tooltip effect="light">
  26 + <XButton preIcon="ep:view" title="浏览" />
  27 + <template #content>
  28 + <!-- <el-button link @click="previewProcessXML">预览XML</el-button> -->
  29 + <XTextButton title="预览XML" @click="previewProcessXML" />
  30 + <br />
  31 + <!-- <el-button link @click="previewProcessJson">预览JSON</el-button> -->
  32 + <XTextButton title="预览JSON" @click="previewProcessJson" />
  33 + </template>
  34 + </el-tooltip>
  35 + <el-tooltip
  36 + v-if="props.simulation"
  37 + effect="light"
  38 + :content="simulationStatus ? '退出模拟' : '开启模拟'"
  39 + >
  40 + <XButton preIcon="ep:cpu" title="模拟" @click="processSimulation" />
  41 + </el-tooltip>
  42 + </ElButtonGroup>
  43 + <ElButtonGroup key="align-control">
  44 + <el-tooltip effect="light" content="向左对齐">
  45 + <!-- <el-button
  46 + class="align align-left"
  47 + icon="el-icon-s-data"
  48 + @click="elementsAlign('left')"
  49 + /> -->
  50 + <XButton
  51 + preIcon="fa:align-left"
  52 + class="align align-bottom"
  53 + @click="elementsAlign('left')"
  54 + />
  55 + </el-tooltip>
  56 + <el-tooltip effect="light" content="向右对齐">
  57 + <!-- <el-button
  58 + class="align align-right"
  59 + icon="el-icon-s-data"
  60 + @click="elementsAlign('right')"
  61 + /> -->
  62 + <XButton
  63 + preIcon="fa:align-left"
  64 + class="align align-top"
  65 + @click="elementsAlign('right')"
  66 + />
  67 + </el-tooltip>
  68 + <el-tooltip effect="light" content="向上对齐">
  69 + <!-- <el-button
  70 + class="align align-top"
  71 + icon="el-icon-s-data"
  72 + @click="elementsAlign('top')"
  73 + /> -->
  74 + <XButton
  75 + preIcon="fa:align-left"
  76 + class="align align-left"
  77 + @click="elementsAlign('top')"
  78 + />
  79 + </el-tooltip>
  80 + <el-tooltip effect="light" content="向下对齐">
  81 + <!-- <el-button
  82 + class="align align-bottom"
  83 + icon="el-icon-s-data"
  84 + @click="elementsAlign('bottom')"
  85 + /> -->
  86 + <XButton
  87 + preIcon="fa:align-left"
  88 + class="align align-right"
  89 + @click="elementsAlign('bottom')"
  90 + />
  91 + </el-tooltip>
  92 + <el-tooltip effect="light" content="水平居中">
  93 + <!-- <el-button
  94 + class="align align-center"
  95 + icon="el-icon-s-data"
  96 + @click="elementsAlign('center')"
  97 + /> -->
  98 + <!-- class="align align-center" -->
  99 + <XButton
  100 + preIcon="fa:align-left"
  101 + class="align align-center"
  102 + @click="elementsAlign('center')"
  103 + />
  104 + </el-tooltip>
  105 + <el-tooltip effect="light" content="垂直居中">
  106 + <!-- <el-button
  107 + class="align align-middle"
  108 + icon="el-icon-s-data"
  109 + @click="elementsAlign('middle')"
  110 + /> -->
  111 + <XButton
  112 + preIcon="fa:align-left"
  113 + class="align align-middle"
  114 + @click="elementsAlign('middle')"
  115 + />
  116 + </el-tooltip>
  117 + </ElButtonGroup>
  118 + <ElButtonGroup key="scale-control">
  119 + <el-tooltip effect="light" content="缩小视图">
  120 + <!-- <el-button
  121 + :disabled="defaultZoom < 0.2"
  122 + icon="el-icon-zoom-out"
  123 + @click="processZoomOut()"
  124 + /> -->
  125 + <XButton
  126 + preIcon="ep:zoom-out"
  127 + @click="processZoomOut()"
  128 + :disabled="defaultZoom < 0.2"
  129 + />
  130 + </el-tooltip>
  131 + <el-button>{{ Math.floor(defaultZoom * 10 * 10) + '%' }}</el-button>
  132 + <el-tooltip effect="light" content="放大视图">
  133 + <!-- <el-button
  134 + :disabled="defaultZoom > 4"
  135 + icon="el-icon-zoom-in"
  136 + @click="processZoomIn()"
  137 + /> -->
  138 + <XButton preIcon="ep:zoom-in" @click="processZoomIn()" :disabled="defaultZoom > 4" />
  139 + </el-tooltip>
  140 + <el-tooltip effect="light" content="重置视图并居中">
  141 + <!-- <el-button icon="el-icon-c-scale-to-original" @click="processReZoom()" /> -->
  142 + <XButton preIcon="ep:scale-to-original" @click="processReZoom()" />
  143 + </el-tooltip>
  144 + </ElButtonGroup>
  145 + <ElButtonGroup key="stack-control">
  146 + <el-tooltip effect="light" content="撤销">
  147 + <!-- <el-button :disabled="!revocable" icon="el-icon-refresh-left" @click="processUndo()" /> -->
  148 + <XButton preIcon="ep:refresh-left" @click="processUndo()" :disabled="!revocable" />
  149 + </el-tooltip>
  150 + <el-tooltip effect="light" content="恢复">
  151 + <!-- <el-button
  152 + :disabled="!recoverable"
  153 + icon="el-icon-refresh-right"
  154 + @click="processRedo()"
  155 + /> -->
  156 + <XButton preIcon="ep:refresh-right" @click="processRedo()" :disabled="!recoverable" />
  157 + </el-tooltip>
  158 + <el-tooltip effect="light" content="重新绘制">
  159 + <!-- <el-button icon="el-icon-refresh" @click="processRestart" /> -->
  160 + <XButton preIcon="ep:refresh" @click="processRestart()" />
  161 + </el-tooltip>
  162 + </ElButtonGroup>
  163 + <XButton
  164 + preIcon="ep:plus"
  165 + title="保存模型"
  166 + @click="processSave"
  167 + :type="props.headerButtonType"
  168 + :disabled="simulationStatus"
  169 + />
  170 + </template>
  171 + <!-- 用于打开本地文件-->
  172 + <input
  173 + type="file"
  174 + id="files"
  175 + ref="refFile"
  176 + style="display: none"
  177 + accept=".xml, .bpmn"
  178 + @change="importLocalFile"
  179 + />
  180 + </div>
  181 + <div class="my-process-designer__container">
  182 + <div
  183 + class="my-process-designer__canvas"
  184 + ref="bpmnCanvas"
  185 + id="bpmnCanvas"
  186 + style="width: 1680px; height: 800px"
  187 + ></div>
  188 + <!-- <div id="js-properties-panel" class="panel"></div> -->
  189 + <!-- <div class="my-process-designer__canvas" ref="bpmn-canvas"></div> -->
  190 + </div>
  191 + <XModal
  192 + title="预览"
  193 + width="80%"
  194 + height="90%"
  195 + v-model="previewModelVisible"
  196 + append-to-body
  197 + destroy-on-close
  198 + >
  199 + <div v-highlight>
  200 + <pre>
  201 + <code>
  202 + <!-- 高亮代码块 -->
  203 + {{ previewResult }}
  204 + </code>
  205 + </pre>
  206 + </div>
  207 + <!-- <pre>
  208 + <code class="hljs" v-html="highlightedCode(previewType, previewResult)"></code>
  209 + </pre> -->
  210 + </XModal>
  211 + </div>
  212 +</template>
  213 +
  214 +<script setup lang="ts" name="MyProcessDesigner">
  215 +// import 'bpmn-js/dist/assets/diagram-js.css' // 左边工具栏以及编辑节点的样式
  216 +// import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
  217 +// import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
  218 +// import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
  219 +// import 'bpmn-js-properties-panel/dist/assets/bpmn-js-properties-panel.css' // 右侧框样式
  220 +import { ElTooltip, ElButtonGroup, ElButton, ElMessage, ElMessageBox } from 'element-plus'
  221 +import { computed, onBeforeMount, onBeforeUnmount, onMounted, provide, ref } from 'vue'
  222 +import BpmnModeler from 'bpmn-js/lib/Modeler'
  223 +import DefaultEmptyXML from './plugins/defaultEmpty'
  224 +// 翻译方法
  225 +import customTranslate from './plugins/translate/customTranslate'
  226 +import translationsCN from './plugins/translate/zh'
  227 +// 模拟流转流程
  228 +import tokenSimulation from 'bpmn-js-token-simulation'
  229 +// 标签解析构建器
  230 +// import bpmnPropertiesProvider from "bpmn-js-properties-panel/lib/provider/bpmn";
  231 +// import propertiesPanelModule from 'bpmn-js-properties-panel'
  232 +// import propertiesProviderModule from 'bpmn-js-properties-panel/lib/provider/camunda'
  233 +// 标签解析 Moddle
  234 +import camundaModdleDescriptor from './plugins/descriptor/camundaDescriptor.json'
  235 +import activitiModdleDescriptor from './plugins/descriptor/activitiDescriptor.json'
  236 +import flowableModdleDescriptor from './plugins/descriptor/flowableDescriptor.json'
  237 +// 标签解析 Extension
  238 +import camundaModdleExtension from './plugins/extension-moddle/camunda'
  239 +import activitiModdleExtension from './plugins/extension-moddle/activiti'
  240 +import flowableModdleExtension from './plugins/extension-moddle/flowable'
  241 +// 引入json转换与高亮
  242 +// import xml2js from 'xml-js'
  243 +import xml2js from 'fast-xml-parser'
  244 +// import { XmlNode, XmlNodeType, parseXmlString } from 'steady-xml'
  245 +// 代码高亮插件
  246 +// import hljs from 'highlight.js/lib/highlight'
  247 +// import 'highlight.js/styles/github-gist.css'
  248 +// hljs.registerLanguage('xml', 'highlight.js/lib/languages/xml')
  249 +// hljs.registerLanguage('json', 'highlight.js/lib/languages/json')
  250 +// const eventName = reactive({
  251 +// name: ''
  252 +// })
  253 +const bpmnCanvas = ref()
  254 +const refFile = ref()
  255 +const emit = defineEmits([
  256 + 'destroy',
  257 + 'init-finished',
  258 + 'save',
  259 + 'commandStack-changed',
  260 + 'input',
  261 + 'change',
  262 + 'canvas-viewbox-changed',
  263 + // eventName.name
  264 + 'element-click'
  265 +])
  266 +
  267 +const props = defineProps({
  268 + value: String, // xml 字符串
  269 + // valueWatch: true, // xml 字符串的 watch 状态
  270 + processId: String, // 流程 key 标识
  271 + processName: String, // 流程 name 名字
  272 + formId: Number, // 流程 form 表单编号
  273 + translations: Object, // 自定义的翻译文件
  274 + additionalModel: [Object, Array], // 自定义model
  275 + moddleExtension: Object, // 自定义moddle
  276 + onlyCustomizeAddi: {
  277 + type: Boolean,
  278 + default: false
  279 + },
  280 + onlyCustomizeModdle: {
  281 + type: Boolean,
  282 + default: false
  283 + },
  284 + simulation: {
  285 + type: Boolean,
  286 + default: true
  287 + },
  288 + keyboard: {
  289 + type: Boolean,
  290 + default: true
  291 + },
  292 + prefix: {
  293 + type: String,
  294 + default: 'camunda'
  295 + },
  296 + events: {
  297 + type: Array,
  298 + default: () => ['element.click']
  299 + },
  300 + headerButtonSize: {
  301 + type: String,
  302 + default: 'small',
  303 + validator: (value) => ['default', 'medium', 'small', 'mini'].indexOf(value) !== -1
  304 + },
  305 + headerButtonType: {
  306 + type: String,
  307 + default: 'primary',
  308 + validator: (value) =>
  309 + ['default', 'primary', 'success', 'warning', 'danger', 'info'].indexOf(value) !== -1
  310 + }
  311 +})
  312 +
  313 +provide('configGlobal', props)
  314 +let bpmnModeler = null
  315 +const defaultZoom = ref(1)
  316 +const previewModelVisible = ref(false)
  317 +const simulationStatus = ref(false)
  318 +const previewResult = ref('')
  319 +const previewType = ref('xml')
  320 +const recoverable = ref(false)
  321 +const revocable = ref(false)
  322 +const additionalModules = computed(() => {
  323 + console.log(props.additionalModel, 'additionalModel')
  324 + const Modules = []
  325 + // 仅保留用户自定义扩展模块
  326 + if (props.onlyCustomizeAddi) {
  327 + if (Object.prototype.toString.call(props.additionalModel) == '[object Array]') {
  328 + return props.additionalModel || []
  329 + }
  330 + return [props.additionalModel]
  331 + }
  332 +
  333 + // 插入用户自定义扩展模块
  334 + if (Object.prototype.toString.call(props.additionalModel) == '[object Array]') {
  335 + Modules.push(...props.additionalModel)
  336 + } else {
  337 + props.additionalModel && Modules.push(props.additionalModel)
  338 + }
  339 +
  340 + // 翻译模块
  341 + const TranslateModule = {
  342 + translate: ['value', customTranslate(props.translations || translationsCN)]
  343 + }
  344 + Modules.push(TranslateModule)
  345 +
  346 + // 模拟流转模块
  347 + if (props.simulation) {
  348 + Modules.push(tokenSimulation)
  349 + }
  350 +
  351 + // 根据需要的流程类型设置扩展元素构建模块
  352 + // if (this.prefix === "bpmn") {
  353 + // Modules.push(bpmnModdleExtension);
  354 + // }
  355 + console.log(props.prefix, 'props.prefix ')
  356 + if (props.prefix === 'camunda') {
  357 + Modules.push(camundaModdleExtension)
  358 + }
  359 + if (props.prefix === 'flowable') {
  360 + Modules.push(flowableModdleExtension)
  361 + }
  362 + if (props.prefix === 'activiti') {
  363 + Modules.push(activitiModdleExtension)
  364 + }
  365 +
  366 + return Modules
  367 +})
  368 +const moddleExtensions = computed(() => {
  369 + console.log(props.onlyCustomizeModdle, 'props.onlyCustomizeModdle')
  370 + console.log(props.moddleExtension, 'props.moddleExtension')
  371 + console.log(props.prefix, 'props.prefix')
  372 + const Extensions = {}
  373 + // 仅使用用户自定义模块
  374 + if (props.onlyCustomizeModdle) {
  375 + return props.moddleExtension || null
  376 + }
  377 +
  378 + // 插入用户自定义模块
  379 + if (props.moddleExtension) {
  380 + for (let key in props.moddleExtension) {
  381 + Extensions[key] = props.moddleExtension[key]
  382 + }
  383 + }
  384 +
  385 + // 根据需要的 "流程类型" 设置 对应的解析文件
  386 + if (props.prefix === 'activiti') {
  387 + Extensions.activiti = activitiModdleDescriptor
  388 + }
  389 + if (props.prefix === 'flowable') {
  390 + Extensions.flowable = flowableModdleDescriptor
  391 + }
  392 + if (props.prefix === 'camunda') {
  393 + Extensions.camunda = camundaModdleDescriptor
  394 + }
  395 + return Extensions
  396 +})
  397 +console.log(additionalModules, 'additionalModules()')
  398 +console.log(moddleExtensions, 'moddleExtensions()')
  399 +const initBpmnModeler = () => {
  400 + if (bpmnModeler) return
  401 + let data = document.getElementById('bpmnCanvas')
  402 + console.log(data, 'data')
  403 + console.log(props.keyboard, 'props.keyboard')
  404 + console.log(additionalModules, 'additionalModules()')
  405 + console.log(moddleExtensions, 'moddleExtensions()')
  406 +
  407 + bpmnModeler = new BpmnModeler({
  408 + // container: this.$refs['bpmn-canvas'],
  409 + // container: getCurrentInstance(),
  410 + // container: needClass,
  411 + // container: bpmnCanvas.value,
  412 + container: data,
  413 + // width: '100%',
  414 + // 添加控制板
  415 + // propertiesPanel: {
  416 + // parent: '#js-properties-panel'
  417 + // },
  418 + keyboard: props.keyboard ? { bindTo: document } : null,
  419 + // additionalModules: additionalModules.value,
  420 + additionalModules: additionalModules.value,
  421 + moddleExtensions: moddleExtensions.value
  422 +
  423 + // additionalModules: [
  424 + // additionalModules.value
  425 + // propertiesPanelModule,
  426 + // propertiesProviderModule
  427 + // propertiesProviderModule
  428 + // ],
  429 + // moddleExtensions: { camunda: moddleExtensions.value }
  430 + })
  431 +
  432 + // bpmnModeler.createDiagram()
  433 +
  434 + console.log(bpmnModeler, 'bpmnModeler111111')
  435 + emit('init-finished', bpmnModeler)
  436 + initModelListeners()
  437 +}
  438 +
  439 +const initModelListeners = () => {
  440 + const EventBus = bpmnModeler.get('eventBus')
  441 + console.log(EventBus, 'EventBus')
  442 + // 注册需要的监听事件, 将. 替换为 - , 避免解析异常
  443 + props.events.forEach((event) => {
  444 + EventBus.on(event, function (eventObj) {
  445 + let eventName = event.replace(/\./g, '-')
  446 + // eventName.name = eventName
  447 + let element = eventObj ? eventObj.element : null
  448 + console.log(eventName, 'eventName')
  449 + console.log(element, 'element')
  450 + emit('element-click', element, eventObj)
  451 + // emit(eventName, element, eventObj)
  452 + })
  453 + })
  454 + // 监听图形改变返回xml
  455 + EventBus.on('commandStack.changed', async (event) => {
  456 + try {
  457 + recoverable.value = bpmnModeler.get('commandStack').canRedo()
  458 + revocable.value = bpmnModeler.get('commandStack').canUndo()
  459 + let { xml } = await bpmnModeler.saveXML({ format: true })
  460 + emit('commandStack-changed', event)
  461 + emit('input', xml)
  462 + emit('change', xml)
  463 + } catch (e) {
  464 + console.error(`[Process Designer Warn]: ${e.message || e}`)
  465 + }
  466 + })
  467 + // 监听视图缩放变化
  468 + bpmnModeler.on('canvas.viewbox.changed', ({ viewbox }) => {
  469 + emit('canvas-viewbox-changed', { viewbox })
  470 + const { scale } = viewbox
  471 + defaultZoom.value = Math.floor(scale * 100) / 100
  472 + })
  473 +}
  474 +/* 创建新的流程图 */
  475 +const createNewDiagram = async (xml) => {
  476 + console.log(xml, 'xml')
  477 + // 将字符串转换成图显示出来
  478 + let newId = props.processId || `Process_${new Date().getTime()}`
  479 + let newName = props.processName || `业务流程_${new Date().getTime()}`
  480 + let xmlString = xml || DefaultEmptyXML(newId, newName, props.prefix)
  481 + try {
  482 + // console.log(xmlString, 'xmlString')
  483 + // console.log(this.bpmnModeler.importXML);
  484 + let { warnings } = await bpmnModeler.importXML(xmlString)
  485 + console.log(warnings, 'warnings')
  486 + if (warnings && warnings.length) {
  487 + warnings.forEach((warn) => console.warn(warn))
  488 + }
  489 + } catch (e) {
  490 + console.error(`[Process Designer Warn]: ${e?.message || e}`)
  491 + }
  492 +}
  493 +
  494 +// 下载流程图到本地
  495 +const downloadProcess = async (type, name) => {
  496 + try {
  497 + // 按需要类型创建文件并下载
  498 + if (type === 'xml' || type === 'bpmn') {
  499 + const { err, xml } = await bpmnModeler.saveXML()
  500 + // 读取异常时抛出异常
  501 + if (err) {
  502 + console.error(`[Process Designer Warn ]: ${err.message || err}`)
  503 + }
  504 + let { href, filename } = setEncoded(type.toUpperCase(), name, xml)
  505 + downloadFunc(href, filename)
  506 + } else {
  507 + const { err, svg } = await bpmnModeler.saveSVG()
  508 + // 读取异常时抛出异常
  509 + if (err) {
  510 + return console.error(err)
  511 + }
  512 + let { href, filename } = setEncoded('SVG', name, svg)
  513 + downloadFunc(href, filename)
  514 + }
  515 + } catch (e) {
  516 + console.error(`[Process Designer Warn ]: ${e.message || e}`)
  517 + }
  518 + // 文件下载方法
  519 + function downloadFunc(href, filename) {
  520 + if (href && filename) {
  521 + let a = document.createElement('a')
  522 + a.download = filename //指定下载的文件名
  523 + a.href = href // URL对象
  524 + a.click() // 模拟点击
  525 + URL.revokeObjectURL(a.href) // 释放URL 对象
  526 + }
  527 + }
  528 +}
  529 +
  530 +// 根据所需类型进行转码并返回下载地址
  531 +const setEncoded = (type, filename = 'diagram', data) => {
  532 + const encodedData = encodeURIComponent(data)
  533 + return {
  534 + filename: `${filename}.${type}`,
  535 + href: `data:application/${
  536 + type === 'svg' ? 'text/xml' : 'bpmn20-xml'
  537 + };charset=UTF-8,${encodedData}`,
  538 + data: data
  539 + }
  540 +}
  541 +
  542 +// 加载本地文件
  543 +const importLocalFile = () => {
  544 + const file = refFile.value.files[0]
  545 + const reader = new FileReader()
  546 + reader.readAsText(file)
  547 + reader.onload = function () {
  548 + let xmlStr = this.result
  549 + createNewDiagram(xmlStr)
  550 + }
  551 +}
  552 +/* ------------------------------------------------ refs methods ------------------------------------------------------ */
  553 +const downloadProcessAsXml = () => {
  554 + downloadProcess('xml')
  555 +}
  556 +const downloadProcessAsBpmn = () => {
  557 + downloadProcess('bpmn')
  558 +}
  559 +const downloadProcessAsSvg = () => {
  560 + downloadProcess('svg')
  561 +}
  562 +const processSimulation = () => {
  563 + simulationStatus.value = !simulationStatus.value
  564 + console.log(bpmnModeler.get('toggleMode', 'strict'), "bpmnModeler.get('toggleMode')")
  565 + props.simulation && bpmnModeler.get('toggleMode', 'strict').toggleMode()
  566 +}
  567 +const processRedo = () => {
  568 + bpmnModeler.get('commandStack').redo()
  569 +}
  570 +const processUndo = () => {
  571 + bpmnModeler.get('commandStack').undo()
  572 +}
  573 +const processZoomIn = (zoomStep = 0.1) => {
  574 + let newZoom = Math.floor(defaultZoom.value * 100 + zoomStep * 100) / 100
  575 + if (newZoom > 4) {
  576 + throw new Error('[Process Designer Warn ]: The zoom ratio cannot be greater than 4')
  577 + }
  578 + defaultZoom.value = newZoom
  579 + bpmnModeler.get('canvas').zoom(defaultZoom.value)
  580 +}
  581 +const processZoomOut = (zoomStep = 0.1) => {
  582 + let newZoom = Math.floor(defaultZoom.value * 100 - zoomStep * 100) / 100
  583 + if (newZoom < 0.2) {
  584 + throw new Error('[Process Designer Warn ]: The zoom ratio cannot be less than 0.2')
  585 + }
  586 + defaultZoom.value = newZoom
  587 + bpmnModeler.get('canvas').zoom(defaultZoom.value)
  588 +}
  589 +// const processZoomTo = (newZoom = 1) => {
  590 +// if (newZoom < 0.2) {
  591 +// throw new Error('[Process Designer Warn ]: The zoom ratio cannot be less than 0.2')
  592 +// }
  593 +// if (newZoom > 4) {
  594 +// throw new Error('[Process Designer Warn ]: The zoom ratio cannot be greater than 4')
  595 +// }
  596 +// defaultZoom = newZoom
  597 +// bpmnModeler.get('canvas').zoom(newZoom)
  598 +// }
  599 +const processReZoom = () => {
  600 + defaultZoom.value = 1
  601 + bpmnModeler.get('canvas').zoom('fit-viewport', 'auto')
  602 +}
  603 +const processRestart = () => {
  604 + recoverable.value = false
  605 + revocable.value = false
  606 + createNewDiagram(null)
  607 +}
  608 +const elementsAlign = (align) => {
  609 + const Align = bpmnModeler.get('alignElements')
  610 + const Selection = bpmnModeler.get('selection')
  611 + const SelectedElements = Selection.get()
  612 + if (!SelectedElements || SelectedElements.length <= 1) {
  613 + ElMessage.warning('请按住 Shift 键选择多个元素对齐')
  614 + // alert('请按住 Ctrl 键选择多个元素对齐
  615 + return
  616 + }
  617 + ElMessageBox.confirm('自动对齐可能造成图形变形，是否继续？', '警告', {
  618 + confirmButtonText: '确定',
  619 + cancelButtonText: '取消',
  620 + type: 'warning'
  621 + }).then(() => {
  622 + Align.trigger(SelectedElements, align)
  623 + })
  624 +}
  625 +/*----------------------------- 方法结束 ---------------------------------*/
  626 +const previewProcessXML = () => {
  627 + console.log(bpmnModeler.saveXML, 'bpmnModeler')
  628 + bpmnModeler.saveXML({ format: true }).then(({ xml }) => {
  629 + console.log(xml, 'xml111111')
  630 + previewResult.value = xml
  631 + previewType.value = 'xml'
  632 + previewModelVisible.value = true
  633 + })
  634 +}
  635 +const previewProcessJson = () => {
  636 + bpmnModeler.saveXML({ format: true }).then(({ xml }) => {
  637 + console.log(xml, 'xml')
  638 +
  639 + // const rootNode = parseXmlString(xml)
  640 + // console.log(rootNode, 'rootNoderootNode')
  641 + // const rootNodes = new XmlNode(XmlNodeType.Root)
  642 + // rootNodes.toJsObject()
  643 + // console.log(JSON.stringify(rootNodes), ';;;;;;;;;;;;;;;')
  644 +
  645 + const parser = new xml2js.XMLParser()
  646 + let jObj = parser.parse(xml)
  647 + // console.log(jObj, 'jObjjObjjObjjObjjObj')
  648 + // const builder = new xml2js.XMLBuilder(xml)
  649 + // const xmlContent = builder
  650 + // console.log(xmlContent, 'xmlContent')
  651 + // console.log(xml2js, 'convertconvertconvert')
  652 + previewResult.value = jObj
  653 + // previewResult.value = convert.xml2json(xml, {explicitArray : false},{ spaces: 2 })
  654 + previewType.value = 'json'
  655 + previewModelVisible.value = true
  656 + })
  657 +}
  658 +/* ------------------------------------------------ 芋道源码 methods ------------------------------------------------------ */
  659 +const processSave = async () => {
  660 + console.log(bpmnModeler, 'bpmnModelerbpmnModelerbpmnModelerbpmnModeler')
  661 + const { err, xml } = await bpmnModeler.saveXML()
  662 + console.log(err, 'errerrerrerrerr')
  663 + console.log(xml, 'xmlxmlxmlxmlxml')
  664 + // 读取异常时抛出异常
  665 + if (err) {
  666 + // this.$modal.msgError('保存模型失败，请重试！')
  667 + alert('保存模型失败，请重试！')
  668 + return
  669 + }
  670 + // 触发 save 事件
  671 + emit('save', xml)
  672 +}
  673 +/** 高亮显示 */
  674 +// const highlightedCode = (previewType, previewResult) => {
  675 +// console.log(previewType, 'previewType, previewResult')
  676 +// console.log(previewResult, 'previewType, previewResult')
  677 +// console.log(hljs.highlight, 'hljs.highlight')
  678 +// const result = hljs.highlight(previewType, previewResult.value || '', true)
  679 +// return result.value || '&nbsp;'
  680 +// }
  681 +onBeforeMount(() => {
  682 + console.log(props, 'propspropspropsprops')
  683 +})
  684 +onMounted(() => {
  685 + initBpmnModeler()
  686 + createNewDiagram(props.value)
  687 +})
  688 +onBeforeUnmount(() => {
  689 + // this.$once('hook:beforeDestroy', () => {
  690 + // })
  691 + if (bpmnModeler) bpmnModeler.destroy()
  692 + emit('destroy', bpmnModeler)
  693 + bpmnModeler = null
  694 +})
  695 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/ProcessViewer.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="my-process-designer">
  3 + <div class="my-process-designer__container">
  4 + <div class="my-process-designer__canvas" ref="bpmn-canvas"></div>
  5 + </div>
  6 + </div>
  7 +</template>
  8 +
  9 +<script setup lang="ts" name="MyProcessViewer">
  10 +import BpmnViewer from 'bpmn-js/lib/Viewer'
  11 +import DefaultEmptyXML from './plugins/defaultEmpty'
  12 +import { onMounted } from 'vue'
  13 +import { onBeforeUnmount, provide, ref, watch } from 'vue'
  14 +const props = defineProps({
  15 + value: {
  16 + // BPMN XML 字符串
  17 + type: String
  18 + },
  19 + prefix: {
  20 + // 使用哪个引擎
  21 + type: String,
  22 + default: 'camunda'
  23 + },
  24 + activityData: {
  25 + // 活动的数据。传递时，可高亮流程
  26 + type: Array,
  27 + default: () => []
  28 + },
  29 + processInstanceData: {
  30 + // 流程实例的数据。传递时，可展示流程发起人等信息
  31 + type: Object
  32 + },
  33 + taskData: {
  34 + // 任务实例的数据。传递时，可展示 UserTask 审核相关的信息
  35 + type: Array,
  36 + default: () => []
  37 + }
  38 +})
  39 +
  40 +provide('configGlobal', props)
  41 +
  42 +const emit = defineEmits(['destroy'])
  43 +
  44 +let bpmnModeler
  45 +
  46 +const xml = ref('')
  47 +const activityList = ref([])
  48 +const processInstance = ref(undefined)
  49 +const taskList = ref([])
  50 +const bpmnCanvas = ref()
  51 +// const element = ref()
  52 +const elementOverlayIds = ref()
  53 +const overlays = ref()
  54 +
  55 +const initBpmnModeler = () => {
  56 + if (bpmnModeler) return
  57 + bpmnModeler = new BpmnViewer({
  58 + container: bpmnCanvas.value,
  59 + bpmnRenderer: {}
  60 + })
  61 +}
  62 +
  63 +/* 创建新的流程图 */
  64 +const createNewDiagram = async (xml) => {
  65 + // 将字符串转换成图显示出来
  66 + let newId = `Process_${new Date().getTime()}`
  67 + let newName = `业务流程_${new Date().getTime()}`
  68 + let xmlString = xml || DefaultEmptyXML(newId, newName, props.prefix)
  69 + try {
  70 + // console.log(this.bpmnModeler.importXML);
  71 + let { warnings } = await bpmnModeler.importXML(xmlString)
  72 + if (warnings && warnings.length) {
  73 + warnings.forEach((warn) => console.warn(warn))
  74 + }
  75 + // 高亮流程图
  76 + await highlightDiagram()
  77 + const canvas = bpmnModeler.get('canvas')
  78 + canvas.zoom('fit-viewport', 'auto')
  79 + } catch (e) {
  80 + console.error(e)
  81 + // console.error(`[Process Designer Warn]: ${e?.message || e}`);
  82 + }
  83 +}
  84 +/* 高亮流程图 */
  85 +// TODO 芋艿：如果多个 endActivity 的话，目前的逻辑可能有一定的问题。https://www.jdon.com/workflow/multi-events.html
  86 +const highlightDiagram = async () => {
  87 + const activityList = activityList.value
  88 + if (activityList.length === 0) {
  89 + return
  90 + }
  91 + // 参考自 https://gitee.com/tony2y/RuoYi-flowable/blob/master/ruoyi-ui/src/components/Process/index.vue#L222 实现
  92 + // 再次基础上，增加不同审批结果的颜色等等
  93 + let canvas = bpmnModeler.get('canvas')
  94 + let todoActivity = activityList.find((m) => !m.endTime) // 找到待办的任务
  95 + let endActivity = activityList[activityList.length - 1] // 获得最后一个任务
  96 + // debugger
  97 + // console.log(this.bpmnModeler.getDefinitions().rootElements[0].flowElements);
  98 + bpmnModeler.getDefinitions().rootElements[0].flowElements?.forEach((n) => {
  99 + let activity = activityList.find((m) => m.key === n.id) // 找到对应的活动
  100 + if (!activity) {
  101 + return
  102 + }
  103 + if (n.$type === 'bpmn:UserTask') {
  104 + // 用户任务
  105 + // 处理用户任务的高亮
  106 + const task = taskList.value.find((m) => m.id === activity.taskId) // 找到活动对应的 taskId
  107 + if (!task) {
  108 + return
  109 + }
  110 + // 高亮任务
  111 + canvas.addMarker(n.id, getResultCss(task.result))
  112 +
  113 + // 如果非通过，就不走后面的线条了
  114 + if (task.result !== 2) {
  115 + return
  116 + }
  117 + // 处理 outgoing 出线
  118 + const outgoing = getActivityOutgoing(activity)
  119 + outgoing?.forEach((nn) => {
  120 + // debugger
  121 + let targetActivity = activityList.find((m) => m.key === nn.targetRef.id)
  122 + // 如果目标活动存在，则根据该活动是否结束，进行【bpmn:SequenceFlow】连线的高亮设置
  123 + if (targetActivity) {
  124 + canvas.addMarker(nn.id, targetActivity.endTime ? 'highlight' : 'highlight-todo')
  125 + } else if (nn.targetRef.$type === 'bpmn:ExclusiveGateway') {
  126 + // TODO 芋艿：这个流程，暂时没走到过
  127 + canvas.addMarker(nn.id, activity.endTime ? 'highlight' : 'highlight-todo')
  128 + canvas.addMarker(nn.targetRef.id, activity.endTime ? 'highlight' : 'highlight-todo')
  129 + } else if (nn.targetRef.$type === 'bpmn:EndEvent') {
  130 + // TODO 芋艿：这个流程，暂时没走到过
  131 + if (!todoActivity && endActivity.key === n.id) {
  132 + canvas.addMarker(nn.id, 'highlight')
  133 + canvas.addMarker(nn.targetRef.id, 'highlight')
  134 + }
  135 + if (!activity.endTime) {
  136 + canvas.addMarker(nn.id, 'highlight-todo')
  137 + canvas.addMarker(nn.targetRef.id, 'highlight-todo')
  138 + }
  139 + }
  140 + })
  141 + } else if (n.$type === 'bpmn:ExclusiveGateway') {
  142 + // 排它网关
  143 + // 设置【bpmn:ExclusiveGateway】排它网关的高亮
  144 + canvas.addMarker(n.id, getActivityHighlightCss(activity))
  145 + // 查找需要高亮的连线
  146 + let matchNN = undefined
  147 + let matchActivity = undefined
  148 + n.outgoing?.forEach((nn) => {
  149 + let targetActivity = activityList.find((m) => m.key === nn.targetRef.id)
  150 + if (!targetActivity) {
  151 + return
  152 + }
  153 + // 特殊判断 endEvent 类型的原因，ExclusiveGateway 可能后续连有 2 个路径：
  154 + // 1. 一个是 UserTask => EndEvent
  155 + // 2. 一个是 EndEvent
  156 + // 在选择路径 1 时，其实 EndEvent 可能也存在，导致 1 和 2 都高亮，显然是不正确的。
  157 + // 所以，在 matchActivity 为 EndEvent 时，需要进行覆盖~~
  158 + if (!matchActivity || matchActivity.type === 'endEvent') {
  159 + matchNN = nn
  160 + matchActivity = targetActivity
  161 + }
  162 + })
  163 + if (matchNN && matchActivity) {
  164 + canvas.addMarker(matchNN.id, getActivityHighlightCss(matchActivity))
  165 + }
  166 + } else if (n.$type === 'bpmn:ParallelGateway') {
  167 + // 并行网关
  168 + // 设置【bpmn:ParallelGateway】并行网关的高亮
  169 + canvas.addMarker(n.id, getActivityHighlightCss(activity))
  170 + n.outgoing?.forEach((nn) => {
  171 + // 获得连线是否有指向目标。如果有，则进行高亮
  172 + const targetActivity = activityList.find((m) => m.key === nn.targetRef.id)
  173 + if (targetActivity) {
  174 + canvas.addMarker(nn.id, getActivityHighlightCss(targetActivity)) // 高亮【bpmn:SequenceFlow】连线
  175 + // 高亮【...】目标。其中 ... 可以是 bpm:UserTask、也可以是其它的。当然，如果是 bpm:UserTask 的话，其实不做高亮也没问题，因为上面有逻辑做了这块。
  176 + canvas.addMarker(nn.targetRef.id, getActivityHighlightCss(targetActivity))
  177 + }
  178 + })
  179 + } else if (n.$type === 'bpmn:StartEvent') {
  180 + // 开始节点
  181 + n.outgoing?.forEach((nn) => {
  182 + // outgoing 例如说【bpmn:SequenceFlow】连线
  183 + // 获得连线是否有指向目标。如果有，则进行高亮
  184 + let targetActivity = activityList.find((m) => m.key === nn.targetRef.id)
  185 + if (targetActivity) {
  186 + canvas.addMarker(nn.id, 'highlight') // 高亮【bpmn:SequenceFlow】连线
  187 + canvas.addMarker(n.id, 'highlight') // 高亮【bpmn:StartEvent】开始节点（自己）
  188 + }
  189 + })
  190 + } else if (n.$type === 'bpmn:EndEvent') {
  191 + // 结束节点
  192 + if (!processInstance.value || processInstance.value.result === 1) {
  193 + return
  194 + }
  195 + canvas.addMarker(n.id, getResultCss(processInstance.value.result))
  196 + } else if (n.$type === 'bpmn:ServiceTask') {
  197 + //服务任务
  198 + if (activity.startTime > 0 && activity.endTime === 0) {
  199 + //进入执行，标识进行色
  200 + canvas.addMarker(n.id, getResultCss(1))
  201 + }
  202 + if (activity.endTime > 0) {
  203 + // 执行完成，节点标识完成色, 所有outgoing标识完成色。
  204 + canvas.addMarker(n.id, getResultCss(2))
  205 + const outgoing = getActivityOutgoing(activity)
  206 + outgoing?.forEach((out) => {
  207 + canvas.addMarker(out.id, getResultCss(2))
  208 + })
  209 + }
  210 + }
  211 + })
  212 +}
  213 +const getActivityHighlightCss = (activity) => {
  214 + return activity.endTime ? 'highlight' : 'highlight-todo'
  215 +}
  216 +const getResultCss = (result) => {
  217 + if (result === 1) {
  218 + // 审批中
  219 + return 'highlight-todo'
  220 + } else if (result === 2) {
  221 + // 已通过
  222 + return 'highlight'
  223 + } else if (result === 3) {
  224 + // 不通过
  225 + return 'highlight-reject'
  226 + } else if (result === 4) {
  227 + // 已取消
  228 + return 'highlight-cancel'
  229 + }
  230 + return ''
  231 +}
  232 +
  233 +const getActivityOutgoing = (activity) => {
  234 + // 如果有 outgoing，则直接使用它
  235 + if (activity.outgoing && activity.outgoing.length > 0) {
  236 + return activity.outgoing
  237 + }
  238 + // 如果没有，则遍历获得起点为它的【bpmn:SequenceFlow】节点们。原因是：bpmn-js 的 UserTask 拿不到 outgoing
  239 + const flowElements = bpmnModeler.getDefinitions().rootElements[0].flowElements
  240 + const outgoing = []
  241 + flowElements.forEach((item) => {
  242 + if (item.$type !== 'bpmn:SequenceFlow') {
  243 + return
  244 + }
  245 + if (item.sourceRef.id === activity.key) {
  246 + outgoing.push(item)
  247 + }
  248 + })
  249 + return outgoing
  250 +}
  251 +const initModelListeners = () => {
  252 + const EventBus = bpmnModeler.get('eventBus')
  253 + // 注册需要的监听事件
  254 + EventBus.on('element.hover', function (eventObj) {
  255 + let element = eventObj ? eventObj.element : null
  256 + elementHover(element)
  257 + })
  258 + EventBus.on('element.out', function (eventObj) {
  259 + let element = eventObj ? eventObj.element : null
  260 + elementOut(element)
  261 + })
  262 +}
  263 +// 流程图的元素被 hover
  264 +const elementHover = (element) => {
  265 + element.value = element
  266 + !elementOverlayIds.value && (elementOverlayIds.value = {})
  267 + !overlays.value && (overlays.value = bpmnModeler.get('overlays'))
  268 + // 展示信息
  269 + const activity = activityList.value.find((m) => m.key === element.value.id)
  270 + if (!activity) {
  271 + return
  272 + }
  273 + if (!elementOverlayIds.value[element.value.id] && element.value.type !== 'bpmn:Process') {
  274 + let html = `<div class="element-overlays">
  275 + <p>Elemet id: ${element.value.id}</p>
  276 + <p>Elemet type: ${element.value.type}</p>
  277 + </div>` // 默认值
  278 + if (element.value.type === 'bpmn:StartEvent' && processInstance.value) {
  279 + html = `<p>发起人：${processInstance.value.startUser.nickname}</p>
  280 + <p>部门：${processInstance.value.startUser.deptName}</p>
  281 + <p>创建时间：${parseTime(processInstance.value.createTime)}`
  282 + } else if (element.value.type === 'bpmn:UserTask') {
  283 + // debugger
  284 + let task = taskList.value.find((m) => m.id === activity.taskId) // 找到活动对应的 taskId
  285 + if (!task) {
  286 + return
  287 + }
  288 + html = `<p>审批人：${task.assigneeUser.nickname}</p>
  289 + <p>部门：${task.assigneeUser.deptName}</p>
  290 + <p>结果：${getDictDataLabel(
  291 + DICT_TYPE.BPM_PROCESS_INSTANCE_RESULT,
  292 + task.result
  293 + )}</p>
  294 + <p>创建时间：${parseTime(task.createTime)}</p>`
  295 + if (task.endTime) {
  296 + html += `<p>结束时间：${parseTime(task.endTime)}</p>`
  297 + }
  298 + if (task.reason) {
  299 + html += `<p>审批建议：${task.reason}</p>`
  300 + }
  301 + } else if (element.value.type === 'bpmn:ServiceTask' && processInstance.value) {
  302 + if (activity.startTime > 0) {
  303 + html = `<p>创建时间：${parseTime(activity.startTime)}</p>`
  304 + }
  305 + if (activity.endTime > 0) {
  306 + html += `<p>结束时间：${parseTime(activity.endTime)}</p>`
  307 + }
  308 + console.log(html)
  309 + } else if (element.value.type === 'bpmn:EndEvent' && processInstance.value) {
  310 + html = `<p>结果：${getDictDataLabel(
  311 + DICT_TYPE.BPM_PROCESS_INSTANCE_RESULT,
  312 + processInstance.value.result
  313 + )}</p>`
  314 + if (processInstance.value.endTime) {
  315 + html += `<p>结束时间：${parseTime(processInstance.value.endTime)}</p>`
  316 + }
  317 + }
  318 + elementOverlayIds.value[element.value.id] = overlays.value.add(element.value, {
  319 + position: { left: 0, bottom: 0 },
  320 + html: `<div class="element-overlays">${html}</div>`
  321 + })
  322 + }
  323 +}
  324 +// 流程图的元素被 out
  325 +const elementOut = (element) => {
  326 + overlays.value.remove({ element })
  327 + elementOverlayIds.value[element.id] = null
  328 +}
  329 +
  330 +onMounted(() => {
  331 + xml.value = props.value
  332 + activityList.value = props.activityData
  333 + // 初始化
  334 + initBpmnModeler()
  335 + createNewDiagram(xml.value)
  336 + // 初始模型的监听器
  337 + initModelListeners()
  338 +})
  339 +onBeforeUnmount(() => {
  340 + // this.$once('hook:beforeDestroy', () => {
  341 + // })
  342 + if (bpmnModeler) bpmnModeler.destroy()
  343 + emit('destroy', bpmnModeler)
  344 + bpmnModeler = null
  345 +})
  346 +
  347 +watch(
  348 + () => props.value,
  349 + (newValue) => {
  350 + console.log(newValue, 'oldVal')
  351 + xml.value = newValue
  352 + createNewDiagram(xml.value)
  353 + }
  354 +)
  355 +watch(
  356 + () => props.activityData,
  357 + (newActivityData) => {
  358 + activityList.value = newActivityData
  359 + createNewDiagram(xml.value)
  360 + }
  361 +)
  362 +watch(
  363 + () => props.processInstanceData,
  364 + (newProcessInstanceData) => {
  365 + processInstance.value = newProcessInstanceData
  366 + createNewDiagram(xml.value)
  367 + }
  368 +)
  369 +watch(
  370 + () => props.taskData,
  371 + (newTaskListData) => {
  372 + taskList.value = newTaskListData
  373 + createNewDiagram(xml.value)
  374 + }
  375 +)
  376 +</script>
  377 +
  378 +<style>
  379 +/** 处理中 */
  380 +.highlight-todo.djs-connection > .djs-visual > path {
  381 + stroke: #1890ff !important;
  382 + stroke-dasharray: 4px !important;
  383 + fill-opacity: 0.2 !important;
  384 +}
  385 +.highlight-todo.djs-shape .djs-visual > :nth-child(1) {
  386 + fill: #1890ff !important;
  387 + stroke: #1890ff !important;
  388 + stroke-dasharray: 4px !important;
  389 + fill-opacity: 0.2 !important;
  390 +}
  391 +
  392 +:deep(.highlight-todo.djs-connection > .djs-visual > path) {
  393 + stroke: #1890ff !important;
  394 + stroke-dasharray: 4px !important;
  395 + fill-opacity: 0.2 !important;
  396 + marker-end: url(#sequenceflow-end-_E7DFDF-_E7DFDF-803g1kf6zwzmcig1y2ulm5egr);
  397 +}
  398 +:deep(.highlight-todo.djs-shape .djs-visual > :nth-child(1)) {
  399 + fill: #1890ff !important;
  400 + stroke: #1890ff !important;
  401 + stroke-dasharray: 4px !important;
  402 + fill-opacity: 0.2 !important;
  403 +}
  404 +
  405 +/** 通过 */
  406 +.highlight.djs-shape .djs-visual > :nth-child(1) {
  407 + fill: green !important;
  408 + stroke: green !important;
  409 + fill-opacity: 0.2 !important;
  410 +}
  411 +.highlight.djs-shape .djs-visual > :nth-child(2) {
  412 + fill: green !important;
  413 +}
  414 +.highlight.djs-shape .djs-visual > path {
  415 + fill: green !important;
  416 + fill-opacity: 0.2 !important;
  417 + stroke: green !important;
  418 +}
  419 +.highlight.djs-connection > .djs-visual > path {
  420 + stroke: green !important;
  421 +}
  422 +
  423 +.highlight:not(.djs-connection) .djs-visual > :nth-child(1) {
  424 + fill: green !important; /* color elements as green */
  425 +}
  426 +
  427 +:deep(.highlight.djs-shape .djs-visual > :nth-child(1)) {
  428 + fill: green !important;
  429 + stroke: green !important;
  430 + fill-opacity: 0.2 !important;
  431 +}
  432 +:deep(.highlight.djs-shape .djs-visual > :nth-child(2)) {
  433 + fill: green !important;
  434 +}
  435 +:deep(.highlight.djs-shape .djs-visual > path) {
  436 + fill: green !important;
  437 + fill-opacity: 0.2 !important;
  438 + stroke: green !important;
  439 +}
  440 +:deep(.highlight.djs-connection > .djs-visual > path) {
  441 + stroke: green !important;
  442 +}
  443 +
  444 +/** 不通过 */
  445 +.highlight-reject.djs-shape .djs-visual > :nth-child(1) {
  446 + fill: red !important;
  447 + stroke: red !important;
  448 + fill-opacity: 0.2 !important;
  449 +}
  450 +.highlight-reject.djs-shape .djs-visual > :nth-child(2) {
  451 + fill: red !important;
  452 +}
  453 +.highlight-reject.djs-shape .djs-visual > path {
  454 + fill: red !important;
  455 + fill-opacity: 0.2 !important;
  456 + stroke: red !important;
  457 +}
  458 +.highlight-reject.djs-connection > .djs-visual > path {
  459 + stroke: red !important;
  460 +}
  461 +
  462 +.highlight-reject:not(.djs-connection) .djs-visual > :nth-child(1) {
  463 + fill: red !important; /* color elements as green */
  464 +}
  465 +
  466 +:deep(.highlight-reject.djs-shape .djs-visual > :nth-child(1)) {
  467 + fill: red !important;
  468 + stroke: red !important;
  469 + fill-opacity: 0.2 !important;
  470 +}
  471 +:deep(.highlight-reject.djs-shape .djs-visual > :nth-child(2)) {
  472 + fill: red !important;
  473 +}
  474 +:deep(.highlight-reject.djs-shape .djs-visual > path) {
  475 + fill: red !important;
  476 + fill-opacity: 0.2 !important;
  477 + stroke: red !important;
  478 +}
  479 +:deep(.highlight-reject.djs-connection > .djs-visual > path) {
  480 + stroke: red !important;
  481 +}
  482 +
  483 +/** 已取消 */
  484 +.highlight-cancel.djs-shape .djs-visual > :nth-child(1) {
  485 + fill: grey !important;
  486 + stroke: grey !important;
  487 + fill-opacity: 0.2 !important;
  488 +}
  489 +.highlight-cancel.djs-shape .djs-visual > :nth-child(2) {
  490 + fill: grey !important;
  491 +}
  492 +.highlight-cancel.djs-shape .djs-visual > path {
  493 + fill: grey !important;
  494 + fill-opacity: 0.2 !important;
  495 + stroke: grey !important;
  496 +}
  497 +.highlight-cancel.djs-connection > .djs-visual > path {
  498 + stroke: grey !important;
  499 +}
  500 +
  501 +.highlight-cancel:not(.djs-connection) .djs-visual > :nth-child(1) {
  502 + fill: grey !important; /* color elements as green */
  503 +}
  504 +
  505 +:deep(.highlight-cancel.djs-shape .djs-visual > :nth-child(1)) {
  506 + fill: grey !important;
  507 + stroke: grey !important;
  508 + fill-opacity: 0.2 !important;
  509 +}
  510 +:deep(.highlight-cancel.djs-shape .djs-visual > :nth-child(2)) {
  511 + fill: grey !important;
  512 +}
  513 +:deep(.highlight-cancel.djs-shape .djs-visual > path) {
  514 + fill: grey !important;
  515 + fill-opacity: 0.2 !important;
  516 + stroke: grey !important;
  517 +}
  518 +:deep(.highlight-cancel.djs-connection > .djs-visual > path) {
  519 + stroke: grey !important;
  520 +}
  521 +
  522 +.element-overlays {
  523 + box-sizing: border-box;
  524 + padding: 8px;
  525 + background: rgba(0, 0, 0, 0.6);
  526 + border-radius: 4px;
  527 + color: #fafafa;
  528 + width: 200px;
  529 +}
  530 +</style>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/index.js 0 → 100644
  View file @5bedff6
  1 +import MyProcessDesigner from "./ProcessDesigner.vue";
  2 +
  3 +MyProcessDesigner.install = function(Vue) {
  4 + Vue.component(MyProcessDesigner.name, MyProcessDesigner);
  5 +};
  6 +
  7 +// 流程图的设计器，可编辑
  8 +export default MyProcessDesigner;
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/index2.js 0 → 100644
  View file @5bedff6
  1 +import MyProcessViewer from "./ProcessViewer.vue";
  2 +
  3 +MyProcessViewer.install = function(Vue) {
  4 + Vue.component(MyProcessViewer.name, MyProcessViewer);
  5 +};
  6 +
  7 +// 流程图的查看器，不可编辑
  8 +export default MyProcessViewer;
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/content-pad/contentPadProvider.js 0 → 100644
  View file @5bedff6
  1 +import { assign, forEach, isArray } from 'min-dash'
  2 +
  3 +import { is } from "bpmn-js/lib/util/ModelUtil"
  4 +
  5 +import { isExpanded, isEventSubProcess } from "bpmn-js/lib/util/DiUtil"
  6 +
  7 +import { isAny } from "bpmn-js/lib/features/modeling/util/ModelingUtil"
  8 +
  9 +import { getChildLanes } from "bpmn-js/lib/features/modeling/util/LaneUtil"
  10 +
  11 +import { hasPrimaryModifier } from "diagram-js/lib/util/Mouse"
  12 +
  13 +/**
  14 + * A provider for BPMN 2.0 elements context pad
  15 + */
  16 +export default function ContextPadProvider (
  17 + config,
  18 + injector,
  19 + eventBus,
  20 + contextPad,
  21 + modeling,
  22 + elementFactory,
  23 + connect,
  24 + create,
  25 + popupMenu,
  26 + canvas,
  27 + rules,
  28 + translate,
  29 + elementRegistry
  30 +) {
  31 + config = config || {}
  32 +
  33 + contextPad.registerProvider(this)
  34 +
  35 + this._contextPad = contextPad
  36 +
  37 + this._modeling = modeling
  38 +
  39 + this._elementFactory = elementFactory
  40 + this._connect = connect
  41 + this._create = create
  42 + this._popupMenu = popupMenu
  43 + this._canvas = canvas
  44 + this._rules = rules
  45 + this._translate = translate
  46 +
  47 + if (config.autoPlace !== false) {
  48 + this._autoPlace = injector.get("autoPlace", false)
  49 + }
  50 +
  51 + eventBus.on("create.end", 250, function (event) {
  52 + const context = event.context,
  53 + shape = context.shape
  54 +
  55 + if (!hasPrimaryModifier(event) || !contextPad.isOpen(shape)) {
  56 + return
  57 + }
  58 +
  59 + const entries = contextPad.getEntries(shape)
  60 +
  61 + if (entries.replace) {
  62 + entries.replace.action.click(event, shape)
  63 + }
  64 + })
  65 +}
  66 +
  67 +ContextPadProvider.$inject = [
  68 + "config.contextPad",
  69 + "injector",
  70 + "eventBus",
  71 + "contextPad",
  72 + "modeling",
  73 + "elementFactory",
  74 + "connect",
  75 + "create",
  76 + "popupMenu",
  77 + "canvas",
  78 + "rules",
  79 + "translate",
  80 + "elementRegistry"
  81 +]
  82 +
  83 +ContextPadProvider.prototype.getContextPadEntries = function (element) {
  84 + const contextPad = this._contextPad,
  85 + modeling = this._modeling,
  86 + elementFactory = this._elementFactory,
  87 + connect = this._connect,
  88 + create = this._create,
  89 + popupMenu = this._popupMenu,
  90 + canvas = this._canvas,
  91 + rules = this._rules,
  92 + autoPlace = this._autoPlace,
  93 + translate = this._translate
  94 +
  95 + const actions = {}
  96 +
  97 + if (element.type === "label") {
  98 + return actions
  99 + }
  100 +
  101 + const businessObject = element.businessObject
  102 +
  103 + function startConnect (event, element) {
  104 + connect.start(event, element)
  105 + }
  106 +
  107 + function removeElement () {
  108 + modeling.removeElements([element])
  109 + }
  110 +
  111 + function getReplaceMenuPosition (element) {
  112 + const Y_OFFSET = 5
  113 +
  114 + const diagramContainer = canvas.getContainer(),
  115 + pad = contextPad.getPad(element).html
  116 +
  117 + const diagramRect = diagramContainer.getBoundingClientRect(),
  118 + padRect = pad.getBoundingClientRect()
  119 +
  120 + const top = padRect.top - diagramRect.top
  121 + const left = padRect.left - diagramRect.left
  122 +
  123 + const pos = {
  124 + x: left,
  125 + y: top + padRect.height + Y_OFFSET
  126 + }
  127 +
  128 + return pos
  129 + }
  130 +
  131 + /**
  132 + * Create an append action
  133 + *
  134 + * @param {string} type
  135 + * @param {string} className
  136 + * @param {string} [title]
  137 + * @param {Object} [options]
  138 + *
  139 + * @return {Object} descriptor
  140 + */
  141 + function appendAction (type, className, title, options) {
  142 + if (typeof title !== "string") {
  143 + options = title
  144 + title = translate("Append {type}", { type: type.replace(/^bpmn:/, "") })
  145 + }
  146 +
  147 + function appendStart (event, element) {
  148 + const shape = elementFactory.createShape(assign({ type: type }, options))
  149 + create.start(event, shape, {
  150 + source: element
  151 + })
  152 + }
  153 +
  154 + const append = autoPlace
  155 + ? function (event, element) {
  156 + const shape = elementFactory.createShape(assign({ type: type }, options))
  157 +
  158 + autoPlace.append(element, shape)
  159 + }
  160 + : appendStart
  161 +
  162 + return {
  163 + group: "model",
  164 + className: className,
  165 + title: title,
  166 + action: {
  167 + dragstart: appendStart,
  168 + click: append
  169 + }
  170 + }
  171 + }
  172 +
  173 + function splitLaneHandler (count) {
  174 + return function (event, element) {
  175 + // actual split
  176 + modeling.splitLane(element, count)
  177 +
  178 + // refresh context pad after split to
  179 + // get rid of split icons
  180 + contextPad.open(element, true)
  181 + }
  182 + }
  183 +
  184 + if (isAny(businessObject, ["bpmn:Lane", "bpmn:Participant"]) && isExpanded(businessObject)) {
  185 + const childLanes = getChildLanes(element)
  186 +
  187 + assign(actions, {
  188 + "lane-insert-above": {
  189 + group: "lane-insert-above",
  190 + className: "bpmn-icon-lane-insert-above",
  191 + title: translate("Add Lane above"),
  192 + action: {
  193 + click: function (event, element) {
  194 + modeling.addLane(element, "top")
  195 + }
  196 + }
  197 + }
  198 + })
  199 +
  200 + if (childLanes.length < 2) {
  201 + if (element.height >= 120) {
  202 + assign(actions, {
  203 + "lane-divide-two": {
  204 + group: "lane-divide",
  205 + className: "bpmn-icon-lane-divide-two",
  206 + title: translate("Divide into two Lanes"),
  207 + action: {
  208 + click: splitLaneHandler(2)
  209 + }
  210 + }
  211 + })
  212 + }
  213 +
  214 + if (element.height >= 180) {
  215 + assign(actions, {
  216 + "lane-divide-three": {
  217 + group: "lane-divide",
  218 + className: "bpmn-icon-lane-divide-three",
  219 + title: translate("Divide into three Lanes"),
  220 + action: {
  221 + click: splitLaneHandler(3)
  222 + }
  223 + }
  224 + })
  225 + }
  226 + }
  227 +
  228 + assign(actions, {
  229 + "lane-insert-below": {
  230 + group: "lane-insert-below",
  231 + className: "bpmn-icon-lane-insert-below",
  232 + title: translate("Add Lane below"),
  233 + action: {
  234 + click: function (event, element) {
  235 + modeling.addLane(element, "bottom")
  236 + }
  237 + }
  238 + }
  239 + })
  240 + }
  241 +
  242 + if (is(businessObject, "bpmn:FlowNode")) {
  243 + if (is(businessObject, "bpmn:EventBasedGateway")) {
  244 + assign(actions, {
  245 + "append.receive-task": appendAction("bpmn:ReceiveTask", "bpmn-icon-receive-task", translate("Append ReceiveTask")),
  246 + "append.message-intermediate-event": appendAction(
  247 + "bpmn:IntermediateCatchEvent",
  248 + "bpmn-icon-intermediate-event-catch-message",
  249 + translate("Append MessageIntermediateCatchEvent"),
  250 + { eventDefinitionType: "bpmn:MessageEventDefinition" }
  251 + ),
  252 + "append.timer-intermediate-event": appendAction(
  253 + "bpmn:IntermediateCatchEvent",
  254 + "bpmn-icon-intermediate-event-catch-timer",
  255 + translate("Append TimerIntermediateCatchEvent"),
  256 + { eventDefinitionType: "bpmn:TimerEventDefinition" }
  257 + ),
  258 + "append.condition-intermediate-event": appendAction(
  259 + "bpmn:IntermediateCatchEvent",
  260 + "bpmn-icon-intermediate-event-catch-condition",
  261 + translate("Append ConditionIntermediateCatchEvent"),
  262 + { eventDefinitionType: "bpmn:ConditionalEventDefinition" }
  263 + ),
  264 + "append.signal-intermediate-event": appendAction(
  265 + "bpmn:IntermediateCatchEvent",
  266 + "bpmn-icon-intermediate-event-catch-signal",
  267 + translate("Append SignalIntermediateCatchEvent"),
  268 + { eventDefinitionType: "bpmn:SignalEventDefinition" }
  269 + )
  270 + })
  271 + } else if (isEventType(businessObject, "bpmn:BoundaryEvent", "bpmn:CompensateEventDefinition")) {
  272 + assign(actions, {
  273 + "append.compensation-activity": appendAction("bpmn:Task", "bpmn-icon-task", translate("Append compensation activity"), {
  274 + isForCompensation: true
  275 + })
  276 + })
  277 + } else if (
  278 + !is(businessObject, "bpmn:EndEvent") &&
  279 + !businessObject.isForCompensation &&
  280 + !isEventType(businessObject, "bpmn:IntermediateThrowEvent", "bpmn:LinkEventDefinition") &&
  281 + !isEventSubProcess(businessObject)
  282 + ) {
  283 + assign(actions, {
  284 + "append.end-event": appendAction("bpmn:EndEvent", "bpmn-icon-end-event-none", translate("Append EndEvent")),
  285 + "append.gateway": appendAction("bpmn:ExclusiveGateway", "bpmn-icon-gateway-none", translate("Append Gateway")),
  286 + "append.append-task": appendAction("bpmn:UserTask", "bpmn-icon-user-task", translate("Append Task")),
  287 + "append.intermediate-event": appendAction(
  288 + "bpmn:IntermediateThrowEvent",
  289 + "bpmn-icon-intermediate-event-none",
  290 + translate("Append Intermediate/Boundary Event")
  291 + )
  292 + })
  293 + }
  294 + }
  295 +
  296 + if (!popupMenu.isEmpty(element, "bpmn-replace")) {
  297 + // Replace menu entry
  298 + assign(actions, {
  299 + replace: {
  300 + group: "edit",
  301 + className: "bpmn-icon-screw-wrench",
  302 + title: '修改类型',
  303 + action: {
  304 + click: function (event, element) {
  305 + const position = assign(getReplaceMenuPosition(element), {
  306 + cursor: { x: event.x, y: event.y }
  307 + })
  308 +
  309 + popupMenu.open(element, "bpmn-replace", position)
  310 + }
  311 + }
  312 + }
  313 + })
  314 + }
  315 +
  316 + if (isAny(businessObject, ["bpmn:FlowNode", "bpmn:InteractionNode", "bpmn:DataObjectReference", "bpmn:DataStoreReference"])) {
  317 + assign(actions, {
  318 + "append.text-annotation": appendAction("bpmn:TextAnnotation", "bpmn-icon-text-annotation"),
  319 +
  320 + connect: {
  321 + group: "connect",
  322 + className: "bpmn-icon-connection-multi",
  323 + title: translate("Connect using " + (businessObject.isForCompensation ? "" : "Sequence/MessageFlow or ") + "Association"),
  324 + action: {
  325 + click: startConnect,
  326 + dragstart: startConnect
  327 + }
  328 + }
  329 + })
  330 + }
  331 +
  332 + if (isAny(businessObject, ["bpmn:DataObjectReference", "bpmn:DataStoreReference"])) {
  333 + assign(actions, {
  334 + connect: {
  335 + group: "connect",
  336 + className: "bpmn-icon-connection-multi",
  337 + title: translate("Connect using DataInputAssociation"),
  338 + action: {
  339 + click: startConnect,
  340 + dragstart: startConnect
  341 + }
  342 + }
  343 + })
  344 + }
  345 +
  346 + if (is(businessObject, "bpmn:Group")) {
  347 + assign(actions, {
  348 + "append.text-annotation": appendAction("bpmn:TextAnnotation", "bpmn-icon-text-annotation")
  349 + })
  350 + }
  351 +
  352 + // delete element entry, only show if allowed by rules
  353 + let deleteAllowed = rules.allowed('elements.delete', { elements: [element] })
  354 +
  355 + if (isArray(deleteAllowed)) {
  356 + // was the element returned as a deletion candidate?
  357 + deleteAllowed = deleteAllowed[0] === element
  358 + }
  359 +
  360 + if (deleteAllowed) {
  361 + assign(actions, {
  362 + delete: {
  363 + group: "edit",
  364 + className: "bpmn-icon-trash",
  365 + title: translate("Remove"),
  366 + action: {
  367 + click: removeElement
  368 + }
  369 + }
  370 + })
  371 + }
  372 +
  373 + return actions
  374 +}
  375 +
  376 +// helpers /////////
  377 +
  378 +function isEventType (eventBo, type, definition) {
  379 + const isType = eventBo.$instanceOf(type)
  380 + let isDefinition = false
  381 +
  382 + const definitions = eventBo.eventDefinitions || []
  383 + forEach(definitions, function (def) {
  384 + if (def.$type === definition) {
  385 + isDefinition = true
  386 + }
  387 + })
  388 +
  389 + return isType && isDefinition
  390 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/content-pad/index.js 0 → 100644
  View file @5bedff6
  1 +import CustomContextPadProvider from "./contentPadProvider";
  2 +
  3 +export default {
  4 + __init__: ["contextPadProvider"],
  5 + contextPadProvider: ["type", CustomContextPadProvider]
  6 +};
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/defaultEmpty.js 0 → 100644
  View file @5bedff6
  1 +export default (key, name, type) => {
  2 + if (!type) type = "camunda";
  3 + const TYPE_TARGET = {
  4 + activiti: "http://activiti.org/bpmn",
  5 + camunda: "http://bpmn.io/schema/bpmn",
  6 + flowable: "http://flowable.org/bpmn"
  7 + };
  8 + return `<?xml version="1.0" encoding="UTF-8"?>
  9 +<bpmn2:definitions
  10 + xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  11 + xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL"
  12 + xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI"
  13 + xmlns:dc="http://www.omg.org/spec/DD/20100524/DC"
  14 + xmlns:di="http://www.omg.org/spec/DD/20100524/DI"
  15 + id="diagram_${key}"
  16 + targetNamespace="${TYPE_TARGET[type]}">
  17 + <bpmn2:process id="${key}" name="${name}" isExecutable="true">
  18 + </bpmn2:process>
  19 + <bpmndi:BPMNDiagram id="BPMNDiagram_1">
  20 + <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="${key}">
  21 + </bpmndi:BPMNPlane>
  22 + </bpmndi:BPMNDiagram>
  23 +</bpmn2:definitions>`;
  24 +};
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/descriptor/activitiDescriptor.json 0 → 100644
  View file @5bedff6
  1 +{
  2 + "name": "Activiti",
  3 + "uri": "http://activiti.org/bpmn",
  4 + "prefix": "activiti",
  5 + "xml": {
  6 + "tagAlias": "lowerCase"
  7 + },
  8 + "associations": [],
  9 + "types": [
  10 + {
  11 + "name": "Definitions",
  12 + "isAbstract": true,
  13 + "extends": [
  14 + "bpmn:Definitions"
  15 + ],
  16 + "properties": [
  17 + {
  18 + "name": "diagramRelationId",
  19 + "isAttr": true,
  20 + "type": "String"
  21 + }
  22 + ]
  23 + },
  24 + {
  25 + "name": "InOutBinding",
  26 + "superClass": [
  27 + "Element"
  28 + ],
  29 + "isAbstract": true,
  30 + "properties": [
  31 + {
  32 + "name": "source",
  33 + "isAttr": true,
  34 + "type": "String"
  35 + },
  36 + {
  37 + "name": "sourceExpression",
  38 + "isAttr": true,
  39 + "type": "String"
  40 + },
  41 + {
  42 + "name": "target",
  43 + "isAttr": true,
  44 + "type": "String"
  45 + },
  46 + {
  47 + "name": "businessKey",
  48 + "isAttr": true,
  49 + "type": "String"
  50 + },
  51 + {
  52 + "name": "local",
  53 + "isAttr": true,
  54 + "type": "Boolean",
  55 + "default": false
  56 + },
  57 + {
  58 + "name": "variables",
  59 + "isAttr": true,
  60 + "type": "String"
  61 + }
  62 + ]
  63 + },
  64 + {
  65 + "name": "In",
  66 + "superClass": [
  67 + "InOutBinding"
  68 + ],
  69 + "meta": {
  70 + "allowedIn": [
  71 + "bpmn:CallActivity"
  72 + ]
  73 + }
  74 + },
  75 + {
  76 + "name": "Out",
  77 + "superClass": [
  78 + "InOutBinding"
  79 + ],
  80 + "meta": {
  81 + "allowedIn": [
  82 + "bpmn:CallActivity"
  83 + ]
  84 + }
  85 + },
  86 + {
  87 + "name": "AsyncCapable",
  88 + "isAbstract": true,
  89 + "extends": [
  90 + "bpmn:Activity",
  91 + "bpmn:Gateway",
  92 + "bpmn:Event"
  93 + ],
  94 + "properties": [
  95 + {
  96 + "name": "async",
  97 + "isAttr": true,
  98 + "type": "Boolean",
  99 + "default": false
  100 + },
  101 + {
  102 + "name": "asyncBefore",
  103 + "isAttr": true,
  104 + "type": "Boolean",
  105 + "default": false
  106 + },
  107 + {
  108 + "name": "asyncAfter",
  109 + "isAttr": true,
  110 + "type": "Boolean",
  111 + "default": false
  112 + },
  113 + {
  114 + "name": "exclusive",
  115 + "isAttr": true,
  116 + "type": "Boolean",
  117 + "default": true
  118 + }
  119 + ]
  120 + },
  121 + {
  122 + "name": "JobPriorized",
  123 + "isAbstract": true,
  124 + "extends": [
  125 + "bpmn:Process",
  126 + "activiti:AsyncCapable"
  127 + ],
  128 + "properties": [
  129 + {
  130 + "name": "jobPriority",
  131 + "isAttr": true,
  132 + "type": "String"
  133 + }
  134 + ]
  135 + },
  136 + {
  137 + "name": "SignalEventDefinition",
  138 + "isAbstract": true,
  139 + "extends": [
  140 + "bpmn:SignalEventDefinition"
  141 + ],
  142 + "properties": [
  143 + {
  144 + "name": "async",
  145 + "isAttr": true,
  146 + "type": "Boolean",
  147 + "default": false
  148 + }
  149 + ]
  150 + },
  151 + {
  152 + "name": "ErrorEventDefinition",
  153 + "isAbstract": true,
  154 + "extends": [
  155 + "bpmn:ErrorEventDefinition"
  156 + ],
  157 + "properties": [
  158 + {
  159 + "name": "errorCodeVariable",
  160 + "isAttr": true,
  161 + "type": "String"
  162 + },
  163 + {
  164 + "name": "errorMessageVariable",
  165 + "isAttr": true,
  166 + "type": "String"
  167 + }
  168 + ]
  169 + },
  170 + {
  171 + "name": "Error",
  172 + "isAbstract": true,
  173 + "extends": [
  174 + "bpmn:Error"
  175 + ],
  176 + "properties": [
  177 + {
  178 + "name": "activiti:errorMessage",
  179 + "isAttr": true,
  180 + "type": "String"
  181 + }
  182 + ]
  183 + },
  184 + {
  185 + "name": "PotentialStarter",
  186 + "superClass": [
  187 + "Element"
  188 + ],
  189 + "properties": [
  190 + {
  191 + "name": "resourceAssignmentExpression",
  192 + "type": "bpmn:ResourceAssignmentExpression"
  193 + }
  194 + ]
  195 + },
  196 + {
  197 + "name": "FormSupported",
  198 + "isAbstract": true,
  199 + "extends": [
  200 + "bpmn:StartEvent",
  201 + "bpmn:UserTask"
  202 + ],
  203 + "properties": [
  204 + {
  205 + "name": "formHandlerClass",
  206 + "isAttr": true,
  207 + "type": "String"
  208 + },
  209 + {
  210 + "name": "formKey",
  211 + "isAttr": true,
  212 + "type": "String"
  213 + }
  214 + ]
  215 + },
  216 + {
  217 + "name": "TemplateSupported",
  218 + "isAbstract": true,
  219 + "extends": [
  220 + "bpmn:Process",
  221 + "bpmn:FlowElement"
  222 + ],
  223 + "properties": [
  224 + {
  225 + "name": "modelerTemplate",
  226 + "isAttr": true,
  227 + "type": "String"
  228 + }
  229 + ]
  230 + },
  231 + {
  232 + "name": "Initiator",
  233 + "isAbstract": true,
  234 + "extends": [ "bpmn:StartEvent" ],
  235 + "properties": [
  236 + {
  237 + "name": "initiator",
  238 + "isAttr": true,
  239 + "type": "String"
  240 + }
  241 + ]
  242 + },
  243 + {
  244 + "name": "ScriptTask",
  245 + "isAbstract": true,
  246 + "extends": [
  247 + "bpmn:ScriptTask"
  248 + ],
  249 + "properties": [
  250 + {
  251 + "name": "resultVariable",
  252 + "isAttr": true,
  253 + "type": "String"
  254 + },
  255 + {
  256 + "name": "resource",
  257 + "isAttr": true,
  258 + "type": "String"
  259 + }
  260 + ]
  261 + },
  262 + {
  263 + "name": "Process",
  264 + "isAbstract": true,
  265 + "extends": [
  266 + "bpmn:Process"
  267 + ],
  268 + "properties": [
  269 + {
  270 + "name": "candidateStarterGroups",
  271 + "isAttr": true,
  272 + "type": "String"
  273 + },
  274 + {
  275 + "name": "candidateStarterUsers",
  276 + "isAttr": true,
  277 + "type": "String"
  278 + },
  279 + {
  280 + "name": "versionTag",
  281 + "isAttr": true,
  282 + "type": "String"
  283 + },
  284 + {
  285 + "name": "historyTimeToLive",
  286 + "isAttr": true,
  287 + "type": "String"
  288 + },
  289 + {
  290 + "name": "isStartableInTasklist",
  291 + "isAttr": true,
  292 + "type": "Boolean",
  293 + "default": true
  294 + },
  295 + {
  296 + "name":"executionListener",
  297 + "isAbstract": true,
  298 + "type":"Expression"
  299 + }
  300 + ]
  301 + },
  302 + {
  303 + "name": "EscalationEventDefinition",
  304 + "isAbstract": true,
  305 + "extends": [
  306 + "bpmn:EscalationEventDefinition"
  307 + ],
  308 + "properties": [
  309 + {
  310 + "name": "escalationCodeVariable",
  311 + "isAttr": true,
  312 + "type": "String"
  313 + }
  314 + ]
  315 + },
  316 + {
  317 + "name": "FormalExpression",
  318 + "isAbstract": true,
  319 + "extends": [
  320 + "bpmn:FormalExpression"
  321 + ],
  322 + "properties": [
  323 + {
  324 + "name": "resource",
  325 + "isAttr": true,
  326 + "type": "String"
  327 + }
  328 + ]
  329 + },
  330 + {
  331 + "name": "multiinstance_type",
  332 + "superClass":[
  333 + "Element"
  334 + ]
  335 + },
  336 + {
  337 + "name": "multiinstance_condition",
  338 + "superClass":[
  339 + "Element"
  340 + ]
  341 + },
  342 + {
  343 + "name": "Assignable",
  344 + "extends": [ "bpmn:UserTask" ],
  345 + "properties": [
  346 + {
  347 + "name": "assignee",
  348 + "isAttr": true,
  349 + "type": "String"
  350 + },
  351 + {
  352 + "name": "candidateUsers",
  353 + "isAttr": true,
  354 + "type": "String"
  355 + },
  356 + {
  357 + "name": "candidateGroups",
  358 + "isAttr": true,
  359 + "type": "String"
  360 + },
  361 + {
  362 + "name": "dueDate",
  363 + "isAttr": true,
  364 + "type": "String"
  365 + },
  366 + {
  367 + "name": "followUpDate",
  368 + "isAttr": true,
  369 + "type": "String"
  370 + },
  371 + {
  372 + "name": "priority",
  373 + "isAttr": true,
  374 + "type": "String"
  375 + },
  376 + {
  377 + "name": "multiinstance_condition",
  378 + "isAttr": true,
  379 + "type": "String"
  380 + }
  381 + ]
  382 + },
  383 + {
  384 + "name": "CallActivity",
  385 + "extends": [ "bpmn:CallActivity" ],
  386 + "properties": [
  387 + {
  388 + "name": "calledElementBinding",
  389 + "isAttr": true,
  390 + "type": "String",
  391 + "default": "latest"
  392 + },
  393 + {
  394 + "name": "calledElementVersion",
  395 + "isAttr": true,
  396 + "type": "String"
  397 + },
  398 + {
  399 + "name": "calledElementVersionTag",
  400 + "isAttr": true,
  401 + "type": "String"
  402 + },
  403 + {
  404 + "name": "calledElementTenantId",
  405 + "isAttr": true,
  406 + "type": "String"
  407 + },
  408 + {
  409 + "name": "caseRef",
  410 + "isAttr": true,
  411 + "type": "String"
  412 + },
  413 + {
  414 + "name": "caseBinding",
  415 + "isAttr": true,
  416 + "type": "String",
  417 + "default": "latest"
  418 + },
  419 + {
  420 + "name": "caseVersion",
  421 + "isAttr": true,
  422 + "type": "String"
  423 + },
  424 + {
  425 + "name": "caseTenantId",
  426 + "isAttr": true,
  427 + "type": "String"
  428 + },
  429 + {
  430 + "name": "variableMappingClass",
  431 + "isAttr": true,
  432 + "type": "String"
  433 + },
  434 + {
  435 + "name": "variableMappingDelegateExpression",
  436 + "isAttr": true,
  437 + "type": "String"
  438 + }
  439 + ]
  440 + },
  441 + {
  442 + "name": "ServiceTaskLike",
  443 + "extends": [
  444 + "bpmn:ServiceTask",
  445 + "bpmn:BusinessRuleTask",
  446 + "bpmn:SendTask",
  447 + "bpmn:MessageEventDefinition"
  448 + ],
  449 + "properties": [
  450 + {
  451 + "name": "expression",
  452 + "isAttr": true,
  453 + "type": "String"
  454 + },
  455 + {
  456 + "name": "class",
  457 + "isAttr": true,
  458 + "type": "String"
  459 + },
  460 + {
  461 + "name": "delegateExpression",
  462 + "isAttr": true,
  463 + "type": "String"
  464 + },
  465 + {
  466 + "name": "resultVariable",
  467 + "isAttr": true,
  468 + "type": "String"
  469 + }
  470 + ]
  471 + },
  472 + {
  473 + "name": "DmnCapable",
  474 + "extends": [
  475 + "bpmn:BusinessRuleTask"
  476 + ],
  477 + "properties": [
  478 + {
  479 + "name": "decisionRef",
  480 + "isAttr": true,
  481 + "type": "String"
  482 + },
  483 + {
  484 + "name": "decisionRefBinding",
  485 + "isAttr": true,
  486 + "type": "String",
  487 + "default": "latest"
  488 + },
  489 + {
  490 + "name": "decisionRefVersion",
  491 + "isAttr": true,
  492 + "type": "String"
  493 + },
  494 + {
  495 + "name": "mapDecisionResult",
  496 + "isAttr": true,
  497 + "type": "String",
  498 + "default": "resultList"
  499 + },
  500 + {
  501 + "name": "decisionRefTenantId",
  502 + "isAttr": true,
  503 + "type": "String"
  504 + }
  505 + ]
  506 + },
  507 + {
  508 + "name": "ExternalCapable",
  509 + "extends": [
  510 + "activiti:ServiceTaskLike"
  511 + ],
  512 + "properties": [
  513 + {
  514 + "name": "type",
  515 + "isAttr": true,
  516 + "type": "String"
  517 + },
  518 + {
  519 + "name": "topic",
  520 + "isAttr": true,
  521 + "type": "String"
  522 + }
  523 + ]
  524 + },
  525 + {
  526 + "name": "TaskPriorized",
  527 + "extends": [
  528 + "bpmn:Process",
  529 + "activiti:ExternalCapable"
  530 + ],
  531 + "properties": [
  532 + {
  533 + "name": "taskPriority",
  534 + "isAttr": true,
  535 + "type": "String"
  536 + }
  537 + ]
  538 + },
  539 + {
  540 + "name": "Properties",
  541 + "superClass": [
  542 + "Element"
  543 + ],
  544 + "meta": {
  545 + "allowedIn": [ "*" ]
  546 + },
  547 + "properties": [
  548 + {
  549 + "name": "values",
  550 + "type": "Property",
  551 + "isMany": true
  552 + }
  553 + ]
  554 + },
  555 + {
  556 + "name": "Property",
  557 + "superClass": [
  558 + "Element"
  559 + ],
  560 + "properties": [
  561 + {
  562 + "name": "id",
  563 + "type": "String",
  564 + "isAttr": true
  565 + },
  566 + {
  567 + "name": "name",
  568 + "type": "String",
  569 + "isAttr": true
  570 + },
  571 + {
  572 + "name": "value",
  573 + "type": "String",
  574 + "isAttr": true
  575 + }
  576 + ]
  577 + },
  578 + {
  579 + "name": "Connector",
  580 + "superClass": [
  581 + "Element"
  582 + ],
  583 + "meta": {
  584 + "allowedIn": [
  585 + "activiti:ServiceTaskLike"
  586 + ]
  587 + },
  588 + "properties": [
  589 + {
  590 + "name": "inputOutput",
  591 + "type": "InputOutput"
  592 + },
  593 + {
  594 + "name": "connectorId",
  595 + "type": "String"
  596 + }
  597 + ]
  598 + },
  599 + {
  600 + "name": "InputOutput",
  601 + "superClass": [
  602 + "Element"
  603 + ],
  604 + "meta": {
  605 + "allowedIn": [
  606 + "bpmn:FlowNode",
  607 + "activiti:Connector"
  608 + ]
  609 + },
  610 + "properties": [
  611 + {
  612 + "name": "inputOutput",
  613 + "type": "InputOutput"
  614 + },
  615 + {
  616 + "name": "connectorId",
  617 + "type": "String"
  618 + },
  619 + {
  620 + "name": "inputParameters",
  621 + "isMany": true,
  622 + "type": "InputParameter"
  623 + },
  624 + {
  625 + "name": "outputParameters",
  626 + "isMany": true,
  627 + "type": "OutputParameter"
  628 + }
  629 + ]
  630 + },
  631 + {
  632 + "name": "InputOutputParameter",
  633 + "properties": [
  634 + {
  635 + "name": "name",
  636 + "isAttr": true,
  637 + "type": "String"
  638 + },
  639 + {
  640 + "name": "value",
  641 + "isBody": true,
  642 + "type": "String"
  643 + },
  644 + {
  645 + "name": "definition",
  646 + "type": "InputOutputParameterDefinition"
  647 + }
  648 + ]
  649 + },
  650 + {
  651 + "name": "InputOutputParameterDefinition",
  652 + "isAbstract": true
  653 + },
  654 + {
  655 + "name": "List",
  656 + "superClass": [ "InputOutputParameterDefinition" ],
  657 + "properties": [
  658 + {
  659 + "name": "items",
  660 + "isMany": true,
  661 + "type": "InputOutputParameterDefinition"
  662 + }
  663 + ]
  664 + },
  665 + {
  666 + "name": "Map",
  667 + "superClass": [ "InputOutputParameterDefinition" ],
  668 + "properties": [
  669 + {
  670 + "name": "entries",
  671 + "isMany": true,
  672 + "type": "Entry"
  673 + }
  674 + ]
  675 + },
  676 + {
  677 + "name": "Entry",
  678 + "properties": [
  679 + {
  680 + "name": "key",
  681 + "isAttr": true,
  682 + "type": "String"
  683 + },
  684 + {
  685 + "name": "value",
  686 + "isBody": true,
  687 + "type": "String"
  688 + },
  689 + {
  690 + "name": "definition",
  691 + "type": "InputOutputParameterDefinition"
  692 + }
  693 + ]
  694 + },
  695 + {
  696 + "name": "Value",
  697 + "superClass": [
  698 + "InputOutputParameterDefinition"
  699 + ],
  700 + "properties": [
  701 + {
  702 + "name": "id",
  703 + "isAttr": true,
  704 + "type": "String"
  705 + },
  706 + {
  707 + "name": "name",
  708 + "isAttr": true,
  709 + "type": "String"
  710 + },
  711 + {
  712 + "name": "value",
  713 + "isBody": true,
  714 + "type": "String"
  715 + }
  716 + ]
  717 + },
  718 + {
  719 + "name": "Script",
  720 + "superClass": [ "InputOutputParameterDefinition" ],
  721 + "properties": [
  722 + {
  723 + "name": "scriptFormat",
  724 + "isAttr": true,
  725 + "type": "String"
  726 + },
  727 + {
  728 + "name": "resource",
  729 + "isAttr": true,
  730 + "type": "String"
  731 + },
  732 + {
  733 + "name": "value",
  734 + "isBody": true,
  735 + "type": "String"
  736 + }
  737 + ]
  738 + },
  739 + {
  740 + "name": "Field",
  741 + "superClass": [ "Element" ],
  742 + "meta": {
  743 + "allowedIn": [
  744 + "activiti:ServiceTaskLike",
  745 + "activiti:ExecutionListener",
  746 + "activiti:TaskListener"
  747 + ]
  748 + },
  749 + "properties": [
  750 + {
  751 + "name": "name",
  752 + "isAttr": true,
  753 + "type": "String"
  754 + },
  755 + {
  756 + "name": "expression",
  757 + "type": "String"
  758 + },
  759 + {
  760 + "name": "stringValue",
  761 + "isAttr": true,
  762 + "type": "String"
  763 + },
  764 + {
  765 + "name": "string",
  766 + "type": "String"
  767 + }
  768 + ]
  769 + },
  770 + {
  771 + "name": "InputParameter",
  772 + "superClass": [ "InputOutputParameter" ]
  773 + },
  774 + {
  775 + "name": "OutputParameter",
  776 + "superClass": [ "InputOutputParameter" ]
  777 + },
  778 + {
  779 + "name": "Collectable",
  780 + "isAbstract": true,
  781 + "extends": [ "bpmn:MultiInstanceLoopCharacteristics" ],
  782 + "superClass": [ "activiti:AsyncCapable" ],
  783 + "properties": [
  784 + {
  785 + "name": "collection",
  786 + "isAttr": true,
  787 + "type": "String"
  788 + },
  789 + {
  790 + "name": "elementVariable",
  791 + "isAttr": true,
  792 + "type": "String"
  793 + }
  794 + ]
  795 + },
  796 + {
  797 + "name": "FailedJobRetryTimeCycle",
  798 + "superClass": [ "Element" ],
  799 + "meta": {
  800 + "allowedIn": [
  801 + "activiti:AsyncCapable",
  802 + "bpmn:MultiInstanceLoopCharacteristics"
  803 + ]
  804 + },
  805 + "properties": [
  806 + {
  807 + "name": "body",
  808 + "isBody": true,
  809 + "type": "String"
  810 + }
  811 + ]
  812 + },
  813 + {
  814 + "name": "ExecutionListener",
  815 + "superClass": [ "Element" ],
  816 + "meta": {
  817 + "allowedIn": [
  818 + "bpmn:Task",
  819 + "bpmn:ServiceTask",
  820 + "bpmn:UserTask",
  821 + "bpmn:BusinessRuleTask",
  822 + "bpmn:ScriptTask",
  823 + "bpmn:ReceiveTask",
  824 + "bpmn:ManualTask",
  825 + "bpmn:ExclusiveGateway",
  826 + "bpmn:SequenceFlow",
  827 + "bpmn:ParallelGateway",
  828 + "bpmn:InclusiveGateway",
  829 + "bpmn:EventBasedGateway",
  830 + "bpmn:StartEvent",
  831 + "bpmn:IntermediateCatchEvent",
  832 + "bpmn:IntermediateThrowEvent",
  833 + "bpmn:EndEvent",
  834 + "bpmn:BoundaryEvent",
  835 + "bpmn:CallActivity",
  836 + "bpmn:SubProcess",
  837 + "bpmn:Process"
  838 + ]
  839 + },
  840 + "properties": [
  841 + {
  842 + "name": "expression",
  843 + "isAttr": true,
  844 + "type": "String"
  845 + },
  846 + {
  847 + "name": "class",
  848 + "isAttr": true,
  849 + "type": "String"
  850 + },
  851 + {
  852 + "name": "delegateExpression",
  853 + "isAttr": true,
  854 + "type": "String"
  855 + },
  856 + {
  857 + "name": "event",
  858 + "isAttr": true,
  859 + "type": "String"
  860 + },
  861 + {
  862 + "name": "script",
  863 + "type": "Script"
  864 + },
  865 + {
  866 + "name": "fields",
  867 + "type": "Field",
  868 + "isMany": true
  869 + }
  870 + ]
  871 + },
  872 + {
  873 + "name": "TaskListener",
  874 + "superClass": [ "Element" ],
  875 + "meta": {
  876 + "allowedIn": [
  877 + "bpmn:UserTask"
  878 + ]
  879 + },
  880 + "properties": [
  881 + {
  882 + "name": "expression",
  883 + "isAttr": true,
  884 + "type": "String"
  885 + },
  886 + {
  887 + "name": "class",
  888 + "isAttr": true,
  889 + "type": "String"
  890 + },
  891 + {
  892 + "name": "delegateExpression",
  893 + "isAttr": true,
  894 + "type": "String"
  895 + },
  896 + {
  897 + "name": "event",
  898 + "isAttr": true,
  899 + "type": "String"
  900 + },
  901 + {
  902 + "name": "script",
  903 + "type": "Script"
  904 + },
  905 + {
  906 + "name": "fields",
  907 + "type": "Field",
  908 + "isMany": true
  909 + }
  910 + ]
  911 + },
  912 + {
  913 + "name": "FormProperty",
  914 + "superClass": [ "Element" ],
  915 + "meta": {
  916 + "allowedIn": [
  917 + "bpmn:StartEvent",
  918 + "bpmn:UserTask"
  919 + ]
  920 + },
  921 + "properties": [
  922 + {
  923 + "name": "id",
  924 + "type": "String",
  925 + "isAttr": true
  926 + },
  927 + {
  928 + "name": "name",
  929 + "type": "String",
  930 + "isAttr": true
  931 + },
  932 + {
  933 + "name": "type",
  934 + "type": "String",
  935 + "isAttr": true
  936 + },
  937 + {
  938 + "name": "required",
  939 + "type": "String",
  940 + "isAttr": true
  941 + },
  942 + {
  943 + "name": "readable",
  944 + "type": "String",
  945 + "isAttr": true
  946 + },
  947 + {
  948 + "name": "writable",
  949 + "type": "String",
  950 + "isAttr": true
  951 + },
  952 + {
  953 + "name": "variable",
  954 + "type": "String",
  955 + "isAttr": true
  956 + },
  957 + {
  958 + "name": "expression",
  959 + "type": "String",
  960 + "isAttr": true
  961 + },
  962 + {
  963 + "name": "datePattern",
  964 + "type": "String",
  965 + "isAttr": true
  966 + },
  967 + {
  968 + "name": "default",
  969 + "type": "String",
  970 + "isAttr": true
  971 + },
  972 + {
  973 + "name": "values",
  974 + "type": "Value",
  975 + "isMany": true
  976 + }
  977 + ]
  978 + },
  979 + {
  980 + "name": "FormProperty",
  981 + "superClass": [ "Element" ],
  982 + "properties": [
  983 + {
  984 + "name": "id",
  985 + "type": "String",
  986 + "isAttr": true
  987 + },
  988 + {
  989 + "name": "label",
  990 + "type": "String",
  991 + "isAttr": true
  992 + },
  993 + {
  994 + "name": "type",
  995 + "type": "String",
  996 + "isAttr": true
  997 + },
  998 + {
  999 + "name": "datePattern",
  1000 + "type": "String",
  1001 + "isAttr": true
  1002 + },
  1003 + {
  1004 + "name": "defaultValue",
  1005 + "type": "String",
  1006 + "isAttr": true
  1007 + },
  1008 + {
  1009 + "name": "properties",
  1010 + "type": "Properties"
  1011 + },
  1012 + {
  1013 + "name": "validation",
  1014 + "type": "Validation"
  1015 + },
  1016 + {
  1017 + "name": "values",
  1018 + "type": "Value",
  1019 + "isMany": true
  1020 + }
  1021 + ]
  1022 + },
  1023 + {
  1024 + "name": "Validation",
  1025 + "superClass": [ "Element" ],
  1026 + "properties": [
  1027 + {
  1028 + "name": "constraints",
  1029 + "type": "Constraint",
  1030 + "isMany": true
  1031 + }
  1032 + ]
  1033 + },
  1034 + {
  1035 + "name": "Constraint",
  1036 + "superClass": [ "Element" ],
  1037 + "properties": [
  1038 + {
  1039 + "name": "name",
  1040 + "type": "String",
  1041 + "isAttr": true
  1042 + },
  1043 + {
  1044 + "name": "config",
  1045 + "type": "String",
  1046 + "isAttr": true
  1047 + }
  1048 + ]
  1049 + },
  1050 + {
  1051 + "name": "ConditionalEventDefinition",
  1052 + "isAbstract": true,
  1053 + "extends": [
  1054 + "bpmn:ConditionalEventDefinition"
  1055 + ],
  1056 + "properties": [
  1057 + {
  1058 + "name": "variableName",
  1059 + "isAttr": true,
  1060 + "type": "String"
  1061 + },
  1062 + {
  1063 + "name": "variableEvent",
  1064 + "isAttr": true,
  1065 + "type": "String"
  1066 + }
  1067 + ]
  1068 + }
  1069 + ],
  1070 + "emumerations": [ ]
  1071 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/descriptor/camundaDescriptor.json 0 → 100644
  View file @5bedff6
  1 +{
  2 + "name": "Camunda",
  3 + "uri": "http://camunda.org/schema/1.0/bpmn",
  4 + "prefix": "camunda",
  5 + "xml": {
  6 + "tagAlias": "lowerCase"
  7 + },
  8 + "associations": [],
  9 + "types": [
  10 + {
  11 + "name": "Definitions",
  12 + "isAbstract": true,
  13 + "extends": [
  14 + "bpmn:Definitions"
  15 + ],
  16 + "properties": [
  17 + {
  18 + "name": "diagramRelationId",
  19 + "isAttr": true,
  20 + "type": "String"
  21 + }
  22 + ]
  23 + },
  24 + {
  25 + "name": "InOutBinding",
  26 + "superClass": [
  27 + "Element"
  28 + ],
  29 + "isAbstract": true,
  30 + "properties": [
  31 + {
  32 + "name": "source",
  33 + "isAttr": true,
  34 + "type": "String"
  35 + },
  36 + {
  37 + "name": "sourceExpression",
  38 + "isAttr": true,
  39 + "type": "String"
  40 + },
  41 + {
  42 + "name": "target",
  43 + "isAttr": true,
  44 + "type": "String"
  45 + },
  46 + {
  47 + "name": "businessKey",
  48 + "isAttr": true,
  49 + "type": "String"
  50 + },
  51 + {
  52 + "name": "local",
  53 + "isAttr": true,
  54 + "type": "Boolean",
  55 + "default": false
  56 + },
  57 + {
  58 + "name": "variables",
  59 + "isAttr": true,
  60 + "type": "String"
  61 + }
  62 + ]
  63 + },
  64 + {
  65 + "name": "In",
  66 + "superClass": [
  67 + "InOutBinding"
  68 + ],
  69 + "meta": {
  70 + "allowedIn": [
  71 + "bpmn:CallActivity",
  72 + "bpmn:SignalEventDefinition"
  73 + ]
  74 + }
  75 + },
  76 + {
  77 + "name": "Out",
  78 + "superClass": [
  79 + "InOutBinding"
  80 + ],
  81 + "meta": {
  82 + "allowedIn": [
  83 + "bpmn:CallActivity"
  84 + ]
  85 + }
  86 + },
  87 + {
  88 + "name": "AsyncCapable",
  89 + "isAbstract": true,
  90 + "extends": [
  91 + "bpmn:Activity",
  92 + "bpmn:Gateway",
  93 + "bpmn:Event"
  94 + ],
  95 + "properties": [
  96 + {
  97 + "name": "async",
  98 + "isAttr": true,
  99 + "type": "Boolean",
  100 + "default": false
  101 + },
  102 + {
  103 + "name": "asyncBefore",
  104 + "isAttr": true,
  105 + "type": "Boolean",
  106 + "default": false
  107 + },
  108 + {
  109 + "name": "asyncAfter",
  110 + "isAttr": true,
  111 + "type": "Boolean",
  112 + "default": false
  113 + },
  114 + {
  115 + "name": "exclusive",
  116 + "isAttr": true,
  117 + "type": "Boolean",
  118 + "default": true
  119 + }
  120 + ]
  121 + },
  122 + {
  123 + "name": "JobPriorized",
  124 + "isAbstract": true,
  125 + "extends": [
  126 + "bpmn:Process",
  127 + "camunda:AsyncCapable"
  128 + ],
  129 + "properties": [
  130 + {
  131 + "name": "jobPriority",
  132 + "isAttr": true,
  133 + "type": "String"
  134 + }
  135 + ]
  136 + },
  137 + {
  138 + "name": "SignalEventDefinition",
  139 + "isAbstract": true,
  140 + "extends": [
  141 + "bpmn:SignalEventDefinition"
  142 + ],
  143 + "properties": [
  144 + {
  145 + "name": "async",
  146 + "isAttr": true,
  147 + "type": "Boolean",
  148 + "default": false
  149 + }
  150 + ]
  151 + },
  152 + {
  153 + "name": "ErrorEventDefinition",
  154 + "isAbstract": true,
  155 + "extends": [
  156 + "bpmn:ErrorEventDefinition"
  157 + ],
  158 + "properties": [
  159 + {
  160 + "name": "errorCodeVariable",
  161 + "isAttr": true,
  162 + "type": "String"
  163 + },
  164 + {
  165 + "name": "errorMessageVariable",
  166 + "isAttr": true,
  167 + "type": "String"
  168 + }
  169 + ]
  170 + },
  171 + {
  172 + "name": "Error",
  173 + "isAbstract": true,
  174 + "extends": [
  175 + "bpmn:Error"
  176 + ],
  177 + "properties": [
  178 + {
  179 + "name": "camunda:errorMessage",
  180 + "isAttr": true,
  181 + "type": "String"
  182 + }
  183 + ]
  184 + },
  185 + {
  186 + "name": "PotentialStarter",
  187 + "superClass": [
  188 + "Element"
  189 + ],
  190 + "properties": [
  191 + {
  192 + "name": "resourceAssignmentExpression",
  193 + "type": "bpmn:ResourceAssignmentExpression"
  194 + }
  195 + ]
  196 + },
  197 + {
  198 + "name": "FormSupported",
  199 + "isAbstract": true,
  200 + "extends": [
  201 + "bpmn:StartEvent",
  202 + "bpmn:UserTask"
  203 + ],
  204 + "properties": [
  205 + {
  206 + "name": "formHandlerClass",
  207 + "isAttr": true,
  208 + "type": "String"
  209 + },
  210 + {
  211 + "name": "formKey",
  212 + "isAttr": true,
  213 + "type": "String"
  214 + }
  215 + ]
  216 + },
  217 + {
  218 + "name": "TemplateSupported",
  219 + "isAbstract": true,
  220 + "extends": [
  221 + "bpmn:Process",
  222 + "bpmn:FlowElement"
  223 + ],
  224 + "properties": [
  225 + {
  226 + "name": "modelerTemplate",
  227 + "isAttr": true,
  228 + "type": "String"
  229 + },
  230 + {
  231 + "name": "modelerTemplateVersion",
  232 + "isAttr": true,
  233 + "type": "Integer"
  234 + }
  235 + ]
  236 + },
  237 + {
  238 + "name": "Initiator",
  239 + "isAbstract": true,
  240 + "extends": [ "bpmn:StartEvent" ],
  241 + "properties": [
  242 + {
  243 + "name": "initiator",
  244 + "isAttr": true,
  245 + "type": "String"
  246 + }
  247 + ]
  248 + },
  249 + {
  250 + "name": "ScriptTask",
  251 + "isAbstract": true,
  252 + "extends": [
  253 + "bpmn:ScriptTask"
  254 + ],
  255 + "properties": [
  256 + {
  257 + "name": "resultVariable",
  258 + "isAttr": true,
  259 + "type": "String"
  260 + },
  261 + {
  262 + "name": "resource",
  263 + "isAttr": true,
  264 + "type": "String"
  265 + }
  266 + ]
  267 + },
  268 + {
  269 + "name": "Process",
  270 + "isAbstract": true,
  271 + "extends": [
  272 + "bpmn:Process"
  273 + ],
  274 + "properties": [
  275 + {
  276 + "name": "candidateStarterGroups",
  277 + "isAttr": true,
  278 + "type": "String"
  279 + },
  280 + {
  281 + "name": "candidateStarterUsers",
  282 + "isAttr": true,
  283 + "type": "String"
  284 + },
  285 + {
  286 + "name": "versionTag",
  287 + "isAttr": true,
  288 + "type": "String"
  289 + },
  290 + {
  291 + "name": "historyTimeToLive",
  292 + "isAttr": true,
  293 + "type": "String"
  294 + },
  295 + {
  296 + "name": "isStartableInTasklist",
  297 + "isAttr": true,
  298 + "type": "Boolean",
  299 + "default": true
  300 + }
  301 + ]
  302 + },
  303 + {
  304 + "name": "EscalationEventDefinition",
  305 + "isAbstract": true,
  306 + "extends": [
  307 + "bpmn:EscalationEventDefinition"
  308 + ],
  309 + "properties": [
  310 + {
  311 + "name": "escalationCodeVariable",
  312 + "isAttr": true,
  313 + "type": "String"
  314 + }
  315 + ]
  316 + },
  317 + {
  318 + "name": "FormalExpression",
  319 + "isAbstract": true,
  320 + "extends": [
  321 + "bpmn:FormalExpression"
  322 + ],
  323 + "properties": [
  324 + {
  325 + "name": "resource",
  326 + "isAttr": true,
  327 + "type": "String"
  328 + }
  329 + ]
  330 + },
  331 + {
  332 + "name": "Assignable",
  333 + "extends": [ "bpmn:UserTask" ],
  334 + "properties": [
  335 + {
  336 + "name": "assignee",
  337 + "isAttr": true,
  338 + "type": "String"
  339 + },
  340 + {
  341 + "name": "candidateUsers",
  342 + "isAttr": true,
  343 + "type": "String"
  344 + },
  345 + {
  346 + "name": "candidateGroups",
  347 + "isAttr": true,
  348 + "type": "String"
  349 + },
  350 + {
  351 + "name": "dueDate",
  352 + "isAttr": true,
  353 + "type": "String"
  354 + },
  355 + {
  356 + "name": "followUpDate",
  357 + "isAttr": true,
  358 + "type": "String"
  359 + },
  360 + {
  361 + "name": "priority",
  362 + "isAttr": true,
  363 + "type": "String"
  364 + }
  365 + ]
  366 + },
  367 + {
  368 + "name": "CallActivity",
  369 + "extends": [ "bpmn:CallActivity" ],
  370 + "properties": [
  371 + {
  372 + "name": "calledElementBinding",
  373 + "isAttr": true,
  374 + "type": "String",
  375 + "default": "latest"
  376 + },
  377 + {
  378 + "name": "calledElementVersion",
  379 + "isAttr": true,
  380 + "type": "String"
  381 + },
  382 + {
  383 + "name": "calledElementVersionTag",
  384 + "isAttr": true,
  385 + "type": "String"
  386 + },
  387 + {
  388 + "name": "calledElementTenantId",
  389 + "isAttr": true,
  390 + "type": "String"
  391 + },
  392 + {
  393 + "name": "caseRef",
  394 + "isAttr": true,
  395 + "type": "String"
  396 + },
  397 + {
  398 + "name": "caseBinding",
  399 + "isAttr": true,
  400 + "type": "String",
  401 + "default": "latest"
  402 + },
  403 + {
  404 + "name": "caseVersion",
  405 + "isAttr": true,
  406 + "type": "String"
  407 + },
  408 + {
  409 + "name": "caseTenantId",
  410 + "isAttr": true,
  411 + "type": "String"
  412 + },
  413 + {
  414 + "name": "variableMappingClass",
  415 + "isAttr": true,
  416 + "type": "String"
  417 + },
  418 + {
  419 + "name": "variableMappingDelegateExpression",
  420 + "isAttr": true,
  421 + "type": "String"
  422 + }
  423 + ]
  424 + },
  425 + {
  426 + "name": "ServiceTaskLike",
  427 + "extends": [
  428 + "bpmn:ServiceTask",
  429 + "bpmn:BusinessRuleTask",
  430 + "bpmn:SendTask",
  431 + "bpmn:MessageEventDefinition"
  432 + ],
  433 + "properties": [
  434 + {
  435 + "name": "expression",
  436 + "isAttr": true,
  437 + "type": "String"
  438 + },
  439 + {
  440 + "name": "class",
  441 + "isAttr": true,
  442 + "type": "String"
  443 + },
  444 + {
  445 + "name": "delegateExpression",
  446 + "isAttr": true,
  447 + "type": "String"
  448 + },
  449 + {
  450 + "name": "resultVariable",
  451 + "isAttr": true,
  452 + "type": "String"
  453 + }
  454 + ]
  455 + },
  456 + {
  457 + "name": "DmnCapable",
  458 + "extends": [
  459 + "bpmn:BusinessRuleTask"
  460 + ],
  461 + "properties": [
  462 + {
  463 + "name": "decisionRef",
  464 + "isAttr": true,
  465 + "type": "String"
  466 + },
  467 + {
  468 + "name": "decisionRefBinding",
  469 + "isAttr": true,
  470 + "type": "String",
  471 + "default": "latest"
  472 + },
  473 + {
  474 + "name": "decisionRefVersion",
  475 + "isAttr": true,
  476 + "type": "String"
  477 + },
  478 + {
  479 + "name": "mapDecisionResult",
  480 + "isAttr": true,
  481 + "type": "String",
  482 + "default": "resultList"
  483 + },
  484 + {
  485 + "name": "decisionRefTenantId",
  486 + "isAttr": true,
  487 + "type": "String"
  488 + }
  489 + ]
  490 + },
  491 + {
  492 + "name": "ExternalCapable",
  493 + "extends": [
  494 + "camunda:ServiceTaskLike"
  495 + ],
  496 + "properties": [
  497 + {
  498 + "name": "type",
  499 + "isAttr": true,
  500 + "type": "String"
  501 + },
  502 + {
  503 + "name": "topic",
  504 + "isAttr": true,
  505 + "type": "String"
  506 + }
  507 + ]
  508 + },
  509 + {
  510 + "name": "TaskPriorized",
  511 + "extends": [
  512 + "bpmn:Process",
  513 + "camunda:ExternalCapable"
  514 + ],
  515 + "properties": [
  516 + {
  517 + "name": "taskPriority",
  518 + "isAttr": true,
  519 + "type": "String"
  520 + }
  521 + ]
  522 + },
  523 + {
  524 + "name": "Properties",
  525 + "superClass": [
  526 + "Element"
  527 + ],
  528 + "meta": {
  529 + "allowedIn": [ "*" ]
  530 + },
  531 + "properties": [
  532 + {
  533 + "name": "values",
  534 + "type": "Property",
  535 + "isMany": true
  536 + }
  537 + ]
  538 + },
  539 + {
  540 + "name": "Property",
  541 + "superClass": [
  542 + "Element"
  543 + ],
  544 + "properties": [
  545 + {
  546 + "name": "id",
  547 + "type": "String",
  548 + "isAttr": true
  549 + },
  550 + {
  551 + "name": "name",
  552 + "type": "String",
  553 + "isAttr": true
  554 + },
  555 + {
  556 + "name": "value",
  557 + "type": "String",
  558 + "isAttr": true
  559 + }
  560 + ]
  561 + },
  562 + {
  563 + "name": "Connector",
  564 + "superClass": [
  565 + "Element"
  566 + ],
  567 + "meta": {
  568 + "allowedIn": [
  569 + "camunda:ServiceTaskLike"
  570 + ]
  571 + },
  572 + "properties": [
  573 + {
  574 + "name": "inputOutput",
  575 + "type": "InputOutput"
  576 + },
  577 + {
  578 + "name": "connectorId",
  579 + "type": "String"
  580 + }
  581 + ]
  582 + },
  583 + {
  584 + "name": "InputOutput",
  585 + "superClass": [
  586 + "Element"
  587 + ],
  588 + "meta": {
  589 + "allowedIn": [
  590 + "bpmn:FlowNode",
  591 + "camunda:Connector"
  592 + ]
  593 + },
  594 + "properties": [
  595 + {
  596 + "name": "inputOutput",
  597 + "type": "InputOutput"
  598 + },
  599 + {
  600 + "name": "connectorId",
  601 + "type": "String"
  602 + },
  603 + {
  604 + "name": "inputParameters",
  605 + "isMany": true,
  606 + "type": "InputParameter"
  607 + },
  608 + {
  609 + "name": "outputParameters",
  610 + "isMany": true,
  611 + "type": "OutputParameter"
  612 + }
  613 + ]
  614 + },
  615 + {
  616 + "name": "InputOutputParameter",
  617 + "properties": [
  618 + {
  619 + "name": "name",
  620 + "isAttr": true,
  621 + "type": "String"
  622 + },
  623 + {
  624 + "name": "value",
  625 + "isBody": true,
  626 + "type": "String"
  627 + },
  628 + {
  629 + "name": "definition",
  630 + "type": "InputOutputParameterDefinition"
  631 + }
  632 + ]
  633 + },
  634 + {
  635 + "name": "InputOutputParameterDefinition",
  636 + "isAbstract": true
  637 + },
  638 + {
  639 + "name": "List",
  640 + "superClass": [ "InputOutputParameterDefinition" ],
  641 + "properties": [
  642 + {
  643 + "name": "items",
  644 + "isMany": true,
  645 + "type": "InputOutputParameterDefinition"
  646 + }
  647 + ]
  648 + },
  649 + {
  650 + "name": "Map",
  651 + "superClass": [ "InputOutputParameterDefinition" ],
  652 + "properties": [
  653 + {
  654 + "name": "entries",
  655 + "isMany": true,
  656 + "type": "Entry"
  657 + }
  658 + ]
  659 + },
  660 + {
  661 + "name": "Entry",
  662 + "properties": [
  663 + {
  664 + "name": "key",
  665 + "isAttr": true,
  666 + "type": "String"
  667 + },
  668 + {
  669 + "name": "value",
  670 + "isBody": true,
  671 + "type": "String"
  672 + },
  673 + {
  674 + "name": "definition",
  675 + "type": "InputOutputParameterDefinition"
  676 + }
  677 + ]
  678 + },
  679 + {
  680 + "name": "Value",
  681 + "superClass": [
  682 + "InputOutputParameterDefinition"
  683 + ],
  684 + "properties": [
  685 + {
  686 + "name": "id",
  687 + "isAttr": true,
  688 + "type": "String"
  689 + },
  690 + {
  691 + "name": "name",
  692 + "isAttr": true,
  693 + "type": "String"
  694 + },
  695 + {
  696 + "name": "value",
  697 + "isBody": true,
  698 + "type": "String"
  699 + }
  700 + ]
  701 + },
  702 + {
  703 + "name": "Script",
  704 + "superClass": [ "InputOutputParameterDefinition" ],
  705 + "properties": [
  706 + {
  707 + "name": "scriptFormat",
  708 + "isAttr": true,
  709 + "type": "String"
  710 + },
  711 + {
  712 + "name": "resource",
  713 + "isAttr": true,
  714 + "type": "String"
  715 + },
  716 + {
  717 + "name": "value",
  718 + "isBody": true,
  719 + "type": "String"
  720 + }
  721 + ]
  722 + },
  723 + {
  724 + "name": "Field",
  725 + "superClass": [ "Element" ],
  726 + "meta": {
  727 + "allowedIn": [
  728 + "camunda:ServiceTaskLike",
  729 + "camunda:ExecutionListener",
  730 + "camunda:TaskListener"
  731 + ]
  732 + },
  733 + "properties": [
  734 + {
  735 + "name": "name",
  736 + "isAttr": true,
  737 + "type": "String"
  738 + },
  739 + {
  740 + "name": "expression",
  741 + "type": "String"
  742 + },
  743 + {
  744 + "name": "stringValue",
  745 + "isAttr": true,
  746 + "type": "String"
  747 + },
  748 + {
  749 + "name": "string",
  750 + "type": "String"
  751 + }
  752 + ]
  753 + },
  754 + {
  755 + "name": "InputParameter",
  756 + "superClass": [ "InputOutputParameter" ]
  757 + },
  758 + {
  759 + "name": "OutputParameter",
  760 + "superClass": [ "InputOutputParameter" ]
  761 + },
  762 + {
  763 + "name": "Collectable",
  764 + "isAbstract": true,
  765 + "extends": [ "bpmn:MultiInstanceLoopCharacteristics" ],
  766 + "superClass": [ "camunda:AsyncCapable" ],
  767 + "properties": [
  768 + {
  769 + "name": "collection",
  770 + "isAttr": true,
  771 + "type": "String"
  772 + },
  773 + {
  774 + "name": "elementVariable",
  775 + "isAttr": true,
  776 + "type": "String"
  777 + }
  778 + ]
  779 + },
  780 + {
  781 + "name": "FailedJobRetryTimeCycle",
  782 + "superClass": [ "Element" ],
  783 + "meta": {
  784 + "allowedIn": [
  785 + "camunda:AsyncCapable",
  786 + "bpmn:MultiInstanceLoopCharacteristics"
  787 + ]
  788 + },
  789 + "properties": [
  790 + {
  791 + "name": "body",
  792 + "isBody": true,
  793 + "type": "String"
  794 + }
  795 + ]
  796 + },
  797 + {
  798 + "name": "ExecutionListener",
  799 + "superClass": [ "Element" ],
  800 + "meta": {
  801 + "allowedIn": [
  802 + "bpmn:Task",
  803 + "bpmn:ServiceTask",
  804 + "bpmn:UserTask",
  805 + "bpmn:BusinessRuleTask",
  806 + "bpmn:ScriptTask",
  807 + "bpmn:ReceiveTask",
  808 + "bpmn:ManualTask",
  809 + "bpmn:ExclusiveGateway",
  810 + "bpmn:SequenceFlow",
  811 + "bpmn:ParallelGateway",
  812 + "bpmn:InclusiveGateway",
  813 + "bpmn:EventBasedGateway",
  814 + "bpmn:StartEvent",
  815 + "bpmn:IntermediateCatchEvent",
  816 + "bpmn:IntermediateThrowEvent",
  817 + "bpmn:EndEvent",
  818 + "bpmn:BoundaryEvent",
  819 + "bpmn:CallActivity",
  820 + "bpmn:SubProcess",
  821 + "bpmn:Process"
  822 + ]
  823 + },
  824 + "properties": [
  825 + {
  826 + "name": "expression",
  827 + "isAttr": true,
  828 + "type": "String"
  829 + },
  830 + {
  831 + "name": "class",
  832 + "isAttr": true,
  833 + "type": "String"
  834 + },
  835 + {
  836 + "name": "delegateExpression",
  837 + "isAttr": true,
  838 + "type": "String"
  839 + },
  840 + {
  841 + "name": "event",
  842 + "isAttr": true,
  843 + "type": "String"
  844 + },
  845 + {
  846 + "name": "script",
  847 + "type": "Script"
  848 + },
  849 + {
  850 + "name": "fields",
  851 + "type": "Field",
  852 + "isMany": true
  853 + }
  854 + ]
  855 + },
  856 + {
  857 + "name": "TaskListener",
  858 + "superClass": [ "Element" ],
  859 + "meta": {
  860 + "allowedIn": [
  861 + "bpmn:UserTask"
  862 + ]
  863 + },
  864 + "properties": [
  865 + {
  866 + "name": "expression",
  867 + "isAttr": true,
  868 + "type": "String"
  869 + },
  870 + {
  871 + "name": "class",
  872 + "isAttr": true,
  873 + "type": "String"
  874 + },
  875 + {
  876 + "name": "delegateExpression",
  877 + "isAttr": true,
  878 + "type": "String"
  879 + },
  880 + {
  881 + "name": "event",
  882 + "isAttr": true,
  883 + "type": "String"
  884 + },
  885 + {
  886 + "name": "script",
  887 + "type": "Script"
  888 + },
  889 + {
  890 + "name": "fields",
  891 + "type": "Field",
  892 + "isMany": true
  893 + },
  894 + {
  895 + "name": "id",
  896 + "type": "String",
  897 + "isAttr": true
  898 + },
  899 + {
  900 + "name": "eventDefinitions",
  901 + "type": "bpmn:TimerEventDefinition",
  902 + "isMany": true
  903 + }
  904 + ]
  905 + },
  906 + {
  907 + "name": "FormProperty",
  908 + "superClass": [ "Element" ],
  909 + "meta": {
  910 + "allowedIn": [
  911 + "bpmn:StartEvent",
  912 + "bpmn:UserTask"
  913 + ]
  914 + },
  915 + "properties": [
  916 + {
  917 + "name": "id",
  918 + "type": "String",
  919 + "isAttr": true
  920 + },
  921 + {
  922 + "name": "name",
  923 + "type": "String",
  924 + "isAttr": true
  925 + },
  926 + {
  927 + "name": "type",
  928 + "type": "String",
  929 + "isAttr": true
  930 + },
  931 + {
  932 + "name": "required",
  933 + "type": "String",
  934 + "isAttr": true
  935 + },
  936 + {
  937 + "name": "readable",
  938 + "type": "String",
  939 + "isAttr": true
  940 + },
  941 + {
  942 + "name": "writable",
  943 + "type": "String",
  944 + "isAttr": true
  945 + },
  946 + {
  947 + "name": "variable",
  948 + "type": "String",
  949 + "isAttr": true
  950 + },
  951 + {
  952 + "name": "expression",
  953 + "type": "String",
  954 + "isAttr": true
  955 + },
  956 + {
  957 + "name": "datePattern",
  958 + "type": "String",
  959 + "isAttr": true
  960 + },
  961 + {
  962 + "name": "default",
  963 + "type": "String",
  964 + "isAttr": true
  965 + },
  966 + {
  967 + "name": "values",
  968 + "type": "Value",
  969 + "isMany": true
  970 + }
  971 + ]
  972 + },
  973 + {
  974 + "name": "FormData",
  975 + "superClass": [ "Element" ],
  976 + "meta": {
  977 + "allowedIn": [
  978 + "bpmn:StartEvent",
  979 + "bpmn:UserTask"
  980 + ]
  981 + },
  982 + "properties": [
  983 + {
  984 + "name": "fields",
  985 + "type": "FormField",
  986 + "isMany": true
  987 + },
  988 + {
  989 + "name": "businessKey",
  990 + "type": "String",
  991 + "isAttr": true
  992 + }
  993 + ]
  994 + },
  995 + {
  996 + "name": "FormField",
  997 + "superClass": [ "Element" ],
  998 + "properties": [
  999 + {
  1000 + "name": "id",
  1001 + "type": "String",
  1002 + "isAttr": true
  1003 + },
  1004 + {
  1005 + "name": "label",
  1006 + "type": "String",
  1007 + "isAttr": true
  1008 + },
  1009 + {
  1010 + "name": "type",
  1011 + "type": "String",
  1012 + "isAttr": true
  1013 + },
  1014 + {
  1015 + "name": "datePattern",
  1016 + "type": "String",
  1017 + "isAttr": true
  1018 + },
  1019 + {
  1020 + "name": "defaultValue",
  1021 + "type": "String",
  1022 + "isAttr": true
  1023 + },
  1024 + {
  1025 + "name": "properties",
  1026 + "type": "Properties"
  1027 + },
  1028 + {
  1029 + "name": "validation",
  1030 + "type": "Validation"
  1031 + },
  1032 + {
  1033 + "name": "values",
  1034 + "type": "Value",
  1035 + "isMany": true
  1036 + }
  1037 + ]
  1038 + },
  1039 + {
  1040 + "name": "Validation",
  1041 + "superClass": [ "Element" ],
  1042 + "properties": [
  1043 + {
  1044 + "name": "constraints",
  1045 + "type": "Constraint",
  1046 + "isMany": true
  1047 + }
  1048 + ]
  1049 + },
  1050 + {
  1051 + "name": "Constraint",
  1052 + "superClass": [ "Element" ],
  1053 + "properties": [
  1054 + {
  1055 + "name": "name",
  1056 + "type": "String",
  1057 + "isAttr": true
  1058 + },
  1059 + {
  1060 + "name": "config",
  1061 + "type": "String",
  1062 + "isAttr": true
  1063 + }
  1064 + ]
  1065 + },
  1066 + {
  1067 + "name": "ConditionalEventDefinition",
  1068 + "isAbstract": true,
  1069 + "extends": [
  1070 + "bpmn:ConditionalEventDefinition"
  1071 + ],
  1072 + "properties": [
  1073 + {
  1074 + "name": "variableName",
  1075 + "isAttr": true,
  1076 + "type": "String"
  1077 + },
  1078 + {
  1079 + "name": "variableEvents",
  1080 + "isAttr": true,
  1081 + "type": "String"
  1082 + }
  1083 + ]
  1084 + }
  1085 + ],
  1086 + "emumerations": [ ]
  1087 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/descriptor/flowableDescriptor.json 0 → 100644
  View file @5bedff6
  1 +{
  2 + "name": "Flowable",
  3 + "uri": "http://flowable.org/bpmn",
  4 + "prefix": "flowable",
  5 + "xml": {
  6 + "tagAlias": "lowerCase"
  7 + },
  8 + "associations": [],
  9 + "types": [
  10 + {
  11 + "name": "InOutBinding",
  12 + "superClass": ["Element"],
  13 + "isAbstract": true,
  14 + "properties": [
  15 + {
  16 + "name": "source",
  17 + "isAttr": true,
  18 + "type": "String"
  19 + },
  20 + {
  21 + "name": "sourceExpression",
  22 + "isAttr": true,
  23 + "type": "String"
  24 + },
  25 + {
  26 + "name": "target",
  27 + "isAttr": true,
  28 + "type": "String"
  29 + },
  30 + {
  31 + "name": "businessKey",
  32 + "isAttr": true,
  33 + "type": "String"
  34 + },
  35 + {
  36 + "name": "local",
  37 + "isAttr": true,
  38 + "type": "Boolean",
  39 + "default": false
  40 + },
  41 + {
  42 + "name": "variables",
  43 + "isAttr": true,
  44 + "type": "String"
  45 + }
  46 + ]
  47 + },
  48 + {
  49 + "name": "In",
  50 + "superClass": ["InOutBinding"],
  51 + "meta": {
  52 + "allowedIn": ["bpmn:CallActivity"]
  53 + }
  54 + },
  55 + {
  56 + "name": "Out",
  57 + "superClass": ["InOutBinding"],
  58 + "meta": {
  59 + "allowedIn": ["bpmn:CallActivity"]
  60 + }
  61 + },
  62 + {
  63 + "name": "AsyncCapable",
  64 + "isAbstract": true,
  65 + "extends": ["bpmn:Activity", "bpmn:Gateway", "bpmn:Event"],
  66 + "properties": [
  67 + {
  68 + "name": "async",
  69 + "isAttr": true,
  70 + "type": "Boolean",
  71 + "default": false
  72 + },
  73 + {
  74 + "name": "asyncBefore",
  75 + "isAttr": true,
  76 + "type": "Boolean",
  77 + "default": false
  78 + },
  79 + {
  80 + "name": "asyncAfter",
  81 + "isAttr": true,
  82 + "type": "Boolean",
  83 + "default": false
  84 + },
  85 + {
  86 + "name": "exclusive",
  87 + "isAttr": true,
  88 + "type": "Boolean",
  89 + "default": true
  90 + }
  91 + ]
  92 + },
  93 + {
  94 + "name": "JobPriorized",
  95 + "isAbstract": true,
  96 + "extends": ["bpmn:Process", "flowable:AsyncCapable"],
  97 + "properties": [
  98 + {
  99 + "name": "jobPriority",
  100 + "isAttr": true,
  101 + "type": "String"
  102 + }
  103 + ]
  104 + },
  105 + {
  106 + "name": "SignalEventDefinition",
  107 + "isAbstract": true,
  108 + "extends": ["bpmn:SignalEventDefinition"],
  109 + "properties": [
  110 + {
  111 + "name": "async",
  112 + "isAttr": true,
  113 + "type": "Boolean",
  114 + "default": false
  115 + }
  116 + ]
  117 + },
  118 + {
  119 + "name": "ErrorEventDefinition",
  120 + "isAbstract": true,
  121 + "extends": ["bpmn:ErrorEventDefinition"],
  122 + "properties": [
  123 + {
  124 + "name": "errorCodeVariable",
  125 + "isAttr": true,
  126 + "type": "String"
  127 + },
  128 + {
  129 + "name": "errorMessageVariable",
  130 + "isAttr": true,
  131 + "type": "String"
  132 + }
  133 + ]
  134 + },
  135 + {
  136 + "name": "Error",
  137 + "isAbstract": true,
  138 + "extends": ["bpmn:Error"],
  139 + "properties": [
  140 + {
  141 + "name": "flowable:errorMessage",
  142 + "isAttr": true,
  143 + "type": "String"
  144 + }
  145 + ]
  146 + },
  147 + {
  148 + "name": "PotentialStarter",
  149 + "superClass": ["Element"],
  150 + "properties": [
  151 + {
  152 + "name": "resourceAssignmentExpression",
  153 + "type": "bpmn:ResourceAssignmentExpression"
  154 + }
  155 + ]
  156 + },
  157 + {
  158 + "name": "FormSupported",
  159 + "isAbstract": true,
  160 + "extends": ["bpmn:StartEvent", "bpmn:UserTask"],
  161 + "properties": [
  162 + {
  163 + "name": "formHandlerClass",
  164 + "isAttr": true,
  165 + "type": "String"
  166 + },
  167 + {
  168 + "name": "formKey",
  169 + "isAttr": true,
  170 + "type": "String"
  171 + },
  172 + {
  173 + "name": "formType",
  174 + "isAttr": true,
  175 + "type": "String"
  176 + },
  177 + {
  178 + "name": "formReadOnly",
  179 + "isAttr": true,
  180 + "type": "Boolean",
  181 + "default": false
  182 + },
  183 + {
  184 + "name": "formInit",
  185 + "isAttr": true,
  186 + "type": "Boolean",
  187 + "default": true
  188 + }
  189 + ]
  190 + },
  191 + {
  192 + "name": "TemplateSupported",
  193 + "isAbstract": true,
  194 + "extends": ["bpmn:Process", "bpmn:FlowElement"],
  195 + "properties": [
  196 + {
  197 + "name": "modelerTemplate",
  198 + "isAttr": true,
  199 + "type": "String"
  200 + }
  201 + ]
  202 + },
  203 + {
  204 + "name": "Initiator",
  205 + "isAbstract": true,
  206 + "extends": ["bpmn:StartEvent"],
  207 + "properties": [
  208 + {
  209 + "name": "initiator",
  210 + "isAttr": true,
  211 + "type": "String"
  212 + }
  213 + ]
  214 + },
  215 + {
  216 + "name": "ScriptTask",
  217 + "isAbstract": true,
  218 + "extends": ["bpmn:ScriptTask"],
  219 + "properties": [
  220 + {
  221 + "name": "resultVariable",
  222 + "isAttr": true,
  223 + "type": "String"
  224 + },
  225 + {
  226 + "name": "resource",
  227 + "isAttr": true,
  228 + "type": "String"
  229 + }
  230 + ]
  231 + },
  232 + {
  233 + "name": "Process",
  234 + "isAbstract": true,
  235 + "extends": ["bpmn:Process"],
  236 + "properties": [
  237 + {
  238 + "name": "candidateStarterGroups",
  239 + "isAttr": true,
  240 + "type": "String"
  241 + },
  242 + {
  243 + "name": "candidateStarterUsers",
  244 + "isAttr": true,
  245 + "type": "String"
  246 + },
  247 + {
  248 + "name": "versionTag",
  249 + "isAttr": true,
  250 + "type": "String"
  251 + },
  252 + {
  253 + "name": "historyTimeToLive",
  254 + "isAttr": true,
  255 + "type": "String"
  256 + },
  257 + {
  258 + "name": "isStartableInTasklist",
  259 + "isAttr": true,
  260 + "type": "Boolean",
  261 + "default": true
  262 + }
  263 + ]
  264 + },
  265 + {
  266 + "name": "EscalationEventDefinition",
  267 + "isAbstract": true,
  268 + "extends": ["bpmn:EscalationEventDefinition"],
  269 + "properties": [
  270 + {
  271 + "name": "escalationCodeVariable",
  272 + "isAttr": true,
  273 + "type": "String"
  274 + }
  275 + ]
  276 + },
  277 + {
  278 + "name": "FormalExpression",
  279 + "isAbstract": true,
  280 + "extends": ["bpmn:FormalExpression"],
  281 + "properties": [
  282 + {
  283 + "name": "resource",
  284 + "isAttr": true,
  285 + "type": "String"
  286 + }
  287 + ]
  288 + },
  289 + {
  290 + "name": "Assignable",
  291 + "extends": ["bpmn:UserTask"],
  292 + "properties": [
  293 + {
  294 + "name": "assignee",
  295 + "isAttr": true,
  296 + "type": "String"
  297 + },
  298 + {
  299 + "name": "candidateUsers",
  300 + "isAttr": true,
  301 + "type": "String"
  302 + },
  303 + {
  304 + "name": "candidateGroups",
  305 + "isAttr": true,
  306 + "type": "String"
  307 + },
  308 + {
  309 + "name": "dueDate",
  310 + "isAttr": true,
  311 + "type": "String"
  312 + },
  313 + {
  314 + "name": "followUpDate",
  315 + "isAttr": true,
  316 + "type": "String"
  317 + },
  318 + {
  319 + "name": "priority",
  320 + "isAttr": true,
  321 + "type": "String"
  322 + }
  323 + ]
  324 + },
  325 + {
  326 + "name": "Assignee",
  327 + "supperClass": "Element",
  328 + "meta": {
  329 + "allowedIn": ["*"]
  330 + },
  331 + "properties": [
  332 + {
  333 + "name": "label",
  334 + "type": "String",
  335 + "isAttr": true
  336 + },
  337 + {
  338 + "name": "viewId",
  339 + "type": "Number",
  340 + "isAttr": true
  341 + }
  342 + ]
  343 + },
  344 + {
  345 + "name": "CallActivity",
  346 + "extends": ["bpmn:CallActivity"],
  347 + "properties": [
  348 + {
  349 + "name": "calledElementBinding",
  350 + "isAttr": true,
  351 + "type": "String",
  352 + "default": "latest"
  353 + },
  354 + {
  355 + "name": "calledElementVersion",
  356 + "isAttr": true,
  357 + "type": "String"
  358 + },
  359 + {
  360 + "name": "calledElementVersionTag",
  361 + "isAttr": true,
  362 + "type": "String"
  363 + },
  364 + {
  365 + "name": "calledElementTenantId",
  366 + "isAttr": true,
  367 + "type": "String"
  368 + },
  369 + {
  370 + "name": "caseRef",
  371 + "isAttr": true,
  372 + "type": "String"
  373 + },
  374 + {
  375 + "name": "caseBinding",
  376 + "isAttr": true,
  377 + "type": "String",
  378 + "default": "latest"
  379 + },
  380 + {
  381 + "name": "caseVersion",
  382 + "isAttr": true,
  383 + "type": "String"
  384 + },
  385 + {
  386 + "name": "caseTenantId",
  387 + "isAttr": true,
  388 + "type": "String"
  389 + },
  390 + {
  391 + "name": "variableMappingClass",
  392 + "isAttr": true,
  393 + "type": "String"
  394 + },
  395 + {
  396 + "name": "variableMappingDelegateExpression",
  397 + "isAttr": true,
  398 + "type": "String"
  399 + }
  400 + ]
  401 + },
  402 + {
  403 + "name": "ServiceTaskLike",
  404 + "extends": [
  405 + "bpmn:ServiceTask",
  406 + "bpmn:BusinessRuleTask",
  407 + "bpmn:SendTask",
  408 + "bpmn:MessageEventDefinition"
  409 + ],
  410 + "properties": [
  411 + {
  412 + "name": "expression",
  413 + "isAttr": true,
  414 + "type": "String"
  415 + },
  416 + {
  417 + "name": "class",
  418 + "isAttr": true,
  419 + "type": "String"
  420 + },
  421 + {
  422 + "name": "delegateExpression",
  423 + "isAttr": true,
  424 + "type": "String"
  425 + },
  426 + {
  427 + "name": "resultVariable",
  428 + "isAttr": true,
  429 + "type": "String"
  430 + }
  431 + ]
  432 + },
  433 + {
  434 + "name": "DmnCapable",
  435 + "extends": ["bpmn:BusinessRuleTask"],
  436 + "properties": [
  437 + {
  438 + "name": "decisionRef",
  439 + "isAttr": true,
  440 + "type": "String"
  441 + },
  442 + {
  443 + "name": "decisionRefBinding",
  444 + "isAttr": true,
  445 + "type": "String",
  446 + "default": "latest"
  447 + },
  448 + {
  449 + "name": "decisionRefVersion",
  450 + "isAttr": true,
  451 + "type": "String"
  452 + },
  453 + {
  454 + "name": "mapDecisionResult",
  455 + "isAttr": true,
  456 + "type": "String",
  457 + "default": "resultList"
  458 + },
  459 + {
  460 + "name": "decisionRefTenantId",
  461 + "isAttr": true,
  462 + "type": "String"
  463 + }
  464 + ]
  465 + },
  466 + {
  467 + "name": "ExternalCapable",
  468 + "extends": ["flowable:ServiceTaskLike"],
  469 + "properties": [
  470 + {
  471 + "name": "type",
  472 + "isAttr": true,
  473 + "type": "String"
  474 + },
  475 + {
  476 + "name": "topic",
  477 + "isAttr": true,
  478 + "type": "String"
  479 + }
  480 + ]
  481 + },
  482 + {
  483 + "name": "TaskPriorized",
  484 + "extends": ["bpmn:Process", "flowable:ExternalCapable"],
  485 + "properties": [
  486 + {
  487 + "name": "taskPriority",
  488 + "isAttr": true,
  489 + "type": "String"
  490 + }
  491 + ]
  492 + },
  493 + {
  494 + "name": "Properties",
  495 + "superClass": ["Element"],
  496 + "meta": {
  497 + "allowedIn": ["*"]
  498 + },
  499 + "properties": [
  500 + {
  501 + "name": "values",
  502 + "type": "Property",
  503 + "isMany": true
  504 + }
  505 + ]
  506 + },
  507 + {
  508 + "name": "Property",
  509 + "superClass": ["Element"],
  510 + "properties": [
  511 + {
  512 + "name": "id",
  513 + "type": "String",
  514 + "isAttr": true
  515 + },
  516 + {
  517 + "name": "name",
  518 + "type": "String",
  519 + "isAttr": true
  520 + },
  521 + {
  522 + "name": "value",
  523 + "type": "String",
  524 + "isAttr": true
  525 + }
  526 + ]
  527 + },
  528 + {
  529 + "name": "Button",
  530 + "superClass": ["Element"],
  531 + "meta": {
  532 + "allowedIn": ["bpmn:UserTask"]
  533 + },
  534 + "properties": [
  535 + {
  536 + "name": "id",
  537 + "type": "String",
  538 + "isAttr": true
  539 + },
  540 + {
  541 + "name": "name",
  542 + "type": "String",
  543 + "isAttr": true
  544 + },
  545 + {
  546 + "name": "code",
  547 + "type": "String",
  548 + "isAttr": true
  549 + },
  550 + {
  551 + "name": "isHide",
  552 + "type": "String",
  553 + "isAttr": true
  554 + },
  555 + {
  556 + "name": "next",
  557 + "type": "String",
  558 + "isAttr": true
  559 + },
  560 + {
  561 + "name": "sort",
  562 + "type": "Integer",
  563 + "isAttr": true
  564 + }
  565 + ]
  566 + },
  567 + {
  568 + "name": "Assignee",
  569 + "superClass": ["Element"],
  570 + "meta": {
  571 + "allowedIn": ["bpmn:UserTask"]
  572 + },
  573 + "properties": [
  574 + {
  575 + "name": "id",
  576 + "type": "String",
  577 + "isAttr": true
  578 + },
  579 + {
  580 + "name": "type",
  581 + "type": "String",
  582 + "isAttr": true
  583 + },
  584 + {
  585 + "name": "value",
  586 + "type": "String",
  587 + "isAttr": true
  588 + },
  589 + {
  590 + "name": "condition",
  591 + "type": "String",
  592 + "isAttr": true
  593 + },
  594 + {
  595 + "name": "operationType",
  596 + "type": "String",
  597 + "isAttr": true
  598 + },
  599 + {
  600 + "name": "sort",
  601 + "type": "Integer",
  602 + "isAttr": true
  603 + }
  604 + ]
  605 + },
  606 + {
  607 + "name": "Connector",
  608 + "superClass": ["Element"],
  609 + "meta": {
  610 + "allowedIn": ["flowable:ServiceTaskLike"]
  611 + },
  612 + "properties": [
  613 + {
  614 + "name": "inputOutput",
  615 + "type": "InputOutput"
  616 + },
  617 + {
  618 + "name": "connectorId",
  619 + "type": "String"
  620 + }
  621 + ]
  622 + },
  623 + {
  624 + "name": "InputOutput",
  625 + "superClass": ["Element"],
  626 + "meta": {
  627 + "allowedIn": ["bpmn:FlowNode", "flowable:Connector"]
  628 + },
  629 + "properties": [
  630 + {
  631 + "name": "inputOutput",
  632 + "type": "InputOutput"
  633 + },
  634 + {
  635 + "name": "connectorId",
  636 + "type": "String"
  637 + },
  638 + {
  639 + "name": "inputParameters",
  640 + "isMany": true,
  641 + "type": "InputParameter"
  642 + },
  643 + {
  644 + "name": "outputParameters",
  645 + "isMany": true,
  646 + "type": "OutputParameter"
  647 + }
  648 + ]
  649 + },
  650 + {
  651 + "name": "InputOutputParameter",
  652 + "properties": [
  653 + {
  654 + "name": "name",
  655 + "isAttr": true,
  656 + "type": "String"
  657 + },
  658 + {
  659 + "name": "value",
  660 + "isBody": true,
  661 + "type": "String"
  662 + },
  663 + {
  664 + "name": "definition",
  665 + "type": "InputOutputParameterDefinition"
  666 + }
  667 + ]
  668 + },
  669 + {
  670 + "name": "InputOutputParameterDefinition",
  671 + "isAbstract": true
  672 + },
  673 + {
  674 + "name": "List",
  675 + "superClass": ["InputOutputParameterDefinition"],
  676 + "properties": [
  677 + {
  678 + "name": "items",
  679 + "isMany": true,
  680 + "type": "InputOutputParameterDefinition"
  681 + }
  682 + ]
  683 + },
  684 + {
  685 + "name": "Map",
  686 + "superClass": ["InputOutputParameterDefinition"],
  687 + "properties": [
  688 + {
  689 + "name": "entries",
  690 + "isMany": true,
  691 + "type": "Entry"
  692 + }
  693 + ]
  694 + },
  695 + {
  696 + "name": "Entry",
  697 + "properties": [
  698 + {
  699 + "name": "key",
  700 + "isAttr": true,
  701 + "type": "String"
  702 + },
  703 + {
  704 + "name": "value",
  705 + "isBody": true,
  706 + "type": "String"
  707 + },
  708 + {
  709 + "name": "definition",
  710 + "type": "InputOutputParameterDefinition"
  711 + }
  712 + ]
  713 + },
  714 + {
  715 + "name": "Value",
  716 + "superClass": ["InputOutputParameterDefinition"],
  717 + "properties": [
  718 + {
  719 + "name": "id",
  720 + "isAttr": true,
  721 + "type": "String"
  722 + },
  723 + {
  724 + "name": "name",
  725 + "isAttr": true,
  726 + "type": "String"
  727 + },
  728 + {
  729 + "name": "value",
  730 + "isBody": true,
  731 + "type": "String"
  732 + }
  733 + ]
  734 + },
  735 + {
  736 + "name": "Script",
  737 + "superClass": ["InputOutputParameterDefinition"],
  738 + "properties": [
  739 + {
  740 + "name": "scriptFormat",
  741 + "isAttr": true,
  742 + "type": "String"
  743 + },
  744 + {
  745 + "name": "resource",
  746 + "isAttr": true,
  747 + "type": "String"
  748 + },
  749 + {
  750 + "name": "value",
  751 + "isBody": true,
  752 + "type": "String"
  753 + }
  754 + ]
  755 + },
  756 + {
  757 + "name": "Field",
  758 + "superClass": ["Element"],
  759 + "meta": {
  760 + "allowedIn": [
  761 + "flowable:ServiceTaskLike",
  762 + "flowable:ExecutionListener",
  763 + "flowable:TaskListener"
  764 + ]
  765 + },
  766 + "properties": [
  767 + {
  768 + "name": "name",
  769 + "isAttr": true,
  770 + "type": "String"
  771 + },
  772 + {
  773 + "name": "expression",
  774 + "type": "String"
  775 + },
  776 + {
  777 + "name": "stringValue",
  778 + "isAttr": true,
  779 + "type": "String"
  780 + },
  781 + {
  782 + "name": "string",
  783 + "type": "String"
  784 + }
  785 + ]
  786 + },
  787 + {
  788 + "name": "ChildField",
  789 + "superClass": ["Element"],
  790 + "properties": [
  791 + {
  792 + "name": "id",
  793 + "type": "String",
  794 + "isAttr": true
  795 + },
  796 + {
  797 + "name": "name",
  798 + "type": "String",
  799 + "isAttr": true
  800 + },
  801 + {
  802 + "name": "type",
  803 + "type": "String",
  804 + "isAttr": true
  805 + },
  806 + {
  807 + "name": "required",
  808 + "type": "String",
  809 + "isAttr": true
  810 + },
  811 + {
  812 + "name": "readable",
  813 + "type": "String",
  814 + "isAttr": true
  815 + },
  816 + {
  817 + "name": "writable",
  818 + "type": "String",
  819 + "isAttr": true
  820 + },
  821 + {
  822 + "name": "variable",
  823 + "type": "String",
  824 + "isAttr": true
  825 + },
  826 + {
  827 + "name": "expression",
  828 + "type": "String",
  829 + "isAttr": true
  830 + },
  831 + {
  832 + "name": "datePattern",
  833 + "type": "String",
  834 + "isAttr": true
  835 + },
  836 + {
  837 + "name": "default",
  838 + "type": "String",
  839 + "isAttr": true
  840 + },
  841 + {
  842 + "name": "values",
  843 + "type": "Value",
  844 + "isMany": true
  845 + }
  846 + ]
  847 + },
  848 + {
  849 + "name": "InputParameter",
  850 + "superClass": ["InputOutputParameter"]
  851 + },
  852 + {
  853 + "name": "OutputParameter",
  854 + "superClass": ["InputOutputParameter"]
  855 + },
  856 + {
  857 + "name": "Collectable",
  858 + "isAbstract": true,
  859 + "extends": ["bpmn:MultiInstanceLoopCharacteristics"],
  860 + "superClass": ["flowable:AsyncCapable"],
  861 + "properties": [
  862 + {
  863 + "name": "collection",
  864 + "isAttr": true,
  865 + "type": "String"
  866 + },
  867 + {
  868 + "name": "elementVariable",
  869 + "isAttr": true,
  870 + "type": "String"
  871 + }
  872 + ]
  873 + },
  874 + {
  875 + "name": "FailedJobRetryTimeCycle",
  876 + "superClass": ["Element"],
  877 + "meta": {
  878 + "allowedIn": [
  879 + "flowable:AsyncCapable",
  880 + "bpmn:MultiInstanceLoopCharacteristics"
  881 + ]
  882 + },
  883 + "properties": [
  884 + {
  885 + "name": "body",
  886 + "isBody": true,
  887 + "type": "String"
  888 + }
  889 + ]
  890 + },
  891 + {
  892 + "name": "ExecutionListener",
  893 + "superClass": ["Element"],
  894 + "meta": {
  895 + "allowedIn": [
  896 + "bpmn:Task",
  897 + "bpmn:ServiceTask",
  898 + "bpmn:UserTask",
  899 + "bpmn:BusinessRuleTask",
  900 + "bpmn:ScriptTask",
  901 + "bpmn:ReceiveTask",
  902 + "bpmn:ManualTask",
  903 + "bpmn:ExclusiveGateway",
  904 + "bpmn:SequenceFlow",
  905 + "bpmn:ParallelGateway",
  906 + "bpmn:InclusiveGateway",
  907 + "bpmn:EventBasedGateway",
  908 + "bpmn:StartEvent",
  909 + "bpmn:IntermediateCatchEvent",
  910 + "bpmn:IntermediateThrowEvent",
  911 + "bpmn:EndEvent",
  912 + "bpmn:BoundaryEvent",
  913 + "bpmn:CallActivity",
  914 + "bpmn:SubProcess",
  915 + "bpmn:Process"
  916 + ]
  917 + },
  918 + "properties": [
  919 + {
  920 + "name": "expression",
  921 + "isAttr": true,
  922 + "type": "String"
  923 + },
  924 + {
  925 + "name": "class",
  926 + "isAttr": true,
  927 + "type": "String"
  928 + },
  929 + {
  930 + "name": "delegateExpression",
  931 + "isAttr": true,
  932 + "type": "String"
  933 + },
  934 + {
  935 + "name": "event",
  936 + "isAttr": true,
  937 + "type": "String"
  938 + },
  939 + {
  940 + "name": "script",
  941 + "type": "Script"
  942 + },
  943 + {
  944 + "name": "fields",
  945 + "type": "Field",
  946 + "isMany": true
  947 + }
  948 + ]
  949 + },
  950 + {
  951 + "name": "TaskListener",
  952 + "superClass": ["Element"],
  953 + "meta": {
  954 + "allowedIn": ["bpmn:UserTask"]
  955 + },
  956 + "properties": [
  957 + {
  958 + "name": "expression",
  959 + "isAttr": true,
  960 + "type": "String"
  961 + },
  962 + {
  963 + "name": "class",
  964 + "isAttr": true,
  965 + "type": "String"
  966 + },
  967 + {
  968 + "name": "delegateExpression",
  969 + "isAttr": true,
  970 + "type": "String"
  971 + },
  972 + {
  973 + "name": "event",
  974 + "isAttr": true,
  975 + "type": "String"
  976 + },
  977 + {
  978 + "name": "script",
  979 + "type": "Script"
  980 + },
  981 + {
  982 + "name": "fields",
  983 + "type": "Field",
  984 + "isMany": true
  985 + }
  986 + ]
  987 + },
  988 + {
  989 + "name": "FormProperty",
  990 + "superClass": ["Element"],
  991 + "meta": {
  992 + "allowedIn": ["bpmn:StartEvent", "bpmn:UserTask"]
  993 + },
  994 + "properties": [
  995 + {
  996 + "name": "id",
  997 + "type": "String",
  998 + "isAttr": true
  999 + },
  1000 + {
  1001 + "name": "name",
  1002 + "type": "String",
  1003 + "isAttr": true
  1004 + },
  1005 + {
  1006 + "name": "type",
  1007 + "type": "String",
  1008 + "isAttr": true
  1009 + },
  1010 + {
  1011 + "name": "required",
  1012 + "type": "String",
  1013 + "isAttr": true
  1014 + },
  1015 + {
  1016 + "name": "readable",
  1017 + "type": "String",
  1018 + "isAttr": true
  1019 + },
  1020 + {
  1021 + "name": "writable",
  1022 + "type": "String",
  1023 + "isAttr": true
  1024 + },
  1025 + {
  1026 + "name": "variable",
  1027 + "type": "String",
  1028 + "isAttr": true
  1029 + },
  1030 + {
  1031 + "name": "expression",
  1032 + "type": "String",
  1033 + "isAttr": true
  1034 + },
  1035 + {
  1036 + "name": "datePattern",
  1037 + "type": "String",
  1038 + "isAttr": true
  1039 + },
  1040 + {
  1041 + "name": "default",
  1042 + "type": "String",
  1043 + "isAttr": true
  1044 + },
  1045 + {
  1046 + "name": "values",
  1047 + "type": "Value",
  1048 + "isMany": true
  1049 + },
  1050 + {
  1051 + "name": "children",
  1052 + "type": "ChildField",
  1053 + "isMany": true
  1054 + },
  1055 + {
  1056 + "name": "extensionElements",
  1057 + "type": "bpmn:ExtensionElements",
  1058 + "isMany": true
  1059 + }
  1060 + ]
  1061 + },
  1062 + {
  1063 + "name": "FormData",
  1064 + "superClass": ["Element"],
  1065 + "meta": {
  1066 + "allowedIn": ["bpmn:StartEvent", "bpmn:UserTask"]
  1067 + },
  1068 + "properties": [
  1069 + {
  1070 + "name": "fields",
  1071 + "type": "FormField",
  1072 + "isMany": true
  1073 + },
  1074 + {
  1075 + "name": "businessKey",
  1076 + "type": "String",
  1077 + "isAttr": true
  1078 + }
  1079 + ]
  1080 + },
  1081 + {
  1082 + "name": "FormField",
  1083 + "superClass": ["Element"],
  1084 + "properties": [
  1085 + {
  1086 + "name": "id",
  1087 + "type": "String",
  1088 + "isAttr": true
  1089 + },
  1090 + {
  1091 + "name": "label",
  1092 + "type": "String",
  1093 + "isAttr": true
  1094 + },
  1095 + {
  1096 + "name": "type",
  1097 + "type": "String",
  1098 + "isAttr": true
  1099 + },
  1100 + {
  1101 + "name": "datePattern",
  1102 + "type": "String",
  1103 + "isAttr": true
  1104 + },
  1105 + {
  1106 + "name": "defaultValue",
  1107 + "type": "String",
  1108 + "isAttr": true
  1109 + },
  1110 + {
  1111 + "name": "properties",
  1112 + "type": "Properties"
  1113 + },
  1114 + {
  1115 + "name": "validation",
  1116 + "type": "Validation"
  1117 + },
  1118 + {
  1119 + "name": "values",
  1120 + "type": "Value",
  1121 + "isMany": true
  1122 + }
  1123 + ]
  1124 + },
  1125 + {
  1126 + "name": "Validation",
  1127 + "superClass": ["Element"],
  1128 + "properties": [
  1129 + {
  1130 + "name": "constraints",
  1131 + "type": "Constraint",
  1132 + "isMany": true
  1133 + }
  1134 + ]
  1135 + },
  1136 + {
  1137 + "name": "Constraint",
  1138 + "superClass": ["Element"],
  1139 + "properties": [
  1140 + {
  1141 + "name": "name",
  1142 + "type": "String",
  1143 + "isAttr": true
  1144 + },
  1145 + {
  1146 + "name": "config",
  1147 + "type": "String",
  1148 + "isAttr": true
  1149 + }
  1150 + ]
  1151 + },
  1152 + {
  1153 + "name": "ConditionalEventDefinition",
  1154 + "isAbstract": true,
  1155 + "extends": ["bpmn:ConditionalEventDefinition"],
  1156 + "properties": [
  1157 + {
  1158 + "name": "variableName",
  1159 + "isAttr": true,
  1160 + "type": "String"
  1161 + },
  1162 + {
  1163 + "name": "variableEvent",
  1164 + "isAttr": true,
  1165 + "type": "String"
  1166 + }
  1167 + ]
  1168 + },
  1169 + {
  1170 + "name": "Condition",
  1171 + "superClass": ["Element"],
  1172 + "meta": {
  1173 + "allowedIn": ["bpmn:SequenceFlow"]
  1174 + },
  1175 + "properties": [
  1176 + {
  1177 + "name": "id",
  1178 + "type": "String",
  1179 + "isAttr": true
  1180 + },
  1181 + {
  1182 + "name": "field",
  1183 + "type": "String",
  1184 + "isAttr": true
  1185 + },
  1186 + {
  1187 + "name": "compare",
  1188 + "type": "String",
  1189 + "isAttr": true
  1190 + },
  1191 + {
  1192 + "name": "value",
  1193 + "type": "String",
  1194 + "isAttr": true
  1195 + },
  1196 + {
  1197 + "name": "logic",
  1198 + "type": "String",
  1199 + "isAttr": true
  1200 + },
  1201 + {
  1202 + "name": "sort",
  1203 + "type": "Integer",
  1204 + "isAttr": true
  1205 + }
  1206 + ]
  1207 + }
  1208 + ],
  1209 + "emumerations": []
  1210 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/extension-moddle/activiti/activitiExtension.js 0 → 100644
  View file @5bedff6
  1 +"use strict"
  2 +
  3 +import { some } from 'min-dash'
  4 +
  5 +// const some = require('min-dash').some
  6 +// const some = some
  7 +
  8 +const ALLOWED_TYPES = {
  9 + FailedJobRetryTimeCycle: ['bpmn:StartEvent', 'bpmn:BoundaryEvent', 'bpmn:IntermediateCatchEvent', 'bpmn:Activity'],
  10 + Connector: ['bpmn:EndEvent', 'bpmn:IntermediateThrowEvent'],
  11 + Field: ['bpmn:EndEvent', 'bpmn:IntermediateThrowEvent']
  12 +}
  13 +
  14 +function is (element, type) {
  15 + return element && typeof element.$instanceOf === "function" && element.$instanceOf(type)
  16 +}
  17 +
  18 +function exists (element) {
  19 + return element && element.length
  20 +}
  21 +
  22 +function includesType (collection, type) {
  23 + return (
  24 + exists(collection) &&
  25 + some(collection, function (element) {
  26 + return is(element, type)
  27 + })
  28 + )
  29 +}
  30 +
  31 +function anyType (element, types) {
  32 + return some(types, function (type) {
  33 + return is(element, type)
  34 + })
  35 +}
  36 +
  37 +function isAllowed (propName, propDescriptor, newElement) {
  38 + const name = propDescriptor.name,
  39 + types = ALLOWED_TYPES[name.replace(/activiti:/, '')]
  40 +
  41 + return name === propName && anyType(newElement, types)
  42 +}
  43 +
  44 +function ActivitiModdleExtension (eventBus) {
  45 + eventBus.on(
  46 + "property.clone",
  47 + function (context) {
  48 + const newElement = context.newElement,
  49 + propDescriptor = context.propertyDescriptor
  50 +
  51 + this.canCloneProperty(newElement, propDescriptor)
  52 + },
  53 + this
  54 + )
  55 +}
  56 +
  57 +ActivitiModdleExtension.$inject = ["eventBus"]
  58 +
  59 +ActivitiModdleExtension.prototype.canCloneProperty = function (newElement, propDescriptor) {
  60 + if (isAllowed("activiti:FailedJobRetryTimeCycle", propDescriptor, newElement)) {
  61 + return (
  62 + includesType(newElement.eventDefinitions, "bpmn:TimerEventDefinition") ||
  63 + includesType(newElement.eventDefinitions, "bpmn:SignalEventDefinition") ||
  64 + is(newElement.loopCharacteristics, "bpmn:MultiInstanceLoopCharacteristics")
  65 + )
  66 + }
  67 +
  68 + if (isAllowed("activiti:Connector", propDescriptor, newElement)) {
  69 + return includesType(newElement.eventDefinitions, "bpmn:MessageEventDefinition")
  70 + }
  71 +
  72 + if (isAllowed("activiti:Field", propDescriptor, newElement)) {
  73 + return includesType(newElement.eventDefinitions, "bpmn:MessageEventDefinition")
  74 + }
  75 +}
  76 +
  77 +// module.exports = ActivitiModdleExtension;
  78 +export default ActivitiModdleExtension
  79 +
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/extension-moddle/activiti/index.js 0 → 100644
  View file @5bedff6
  1 +/*
  2 + * @author igdianov
  3 + * address https://github.com/igdianov/activiti-bpmn-moddle
  4 + * */
  5 +
  6 +import activitiExtension from "./activitiExtension"
  7 +
  8 +export default {
  9 + __init__: ["ActivitiModdleExtension"],
  10 + ActivitiModdleExtension: ["type", activitiExtension]
  11 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/extension-moddle/camunda/extension.js 0 → 100644
  View file @5bedff6
  1 +"use strict"
  2 +
  3 +
  4 +import {
  5 + isFunction,
  6 + isObject,
  7 + some
  8 +} from 'min-dash'
  9 +
  10 +// const isFunction = isFunction,
  11 +// isObject = isObject,
  12 +// some = some
  13 +// const isFunction = require('min-dash').isFunction,
  14 +// isObject = require('min-dash').isObject,
  15 +// some = require('min-dash').some
  16 +
  17 +const WILDCARD = '*'
  18 +
  19 +function CamundaModdleExtension (eventBus) {
  20 + const self = this
  21 +
  22 + eventBus.on("moddleCopy.canCopyProperty", function (context) {
  23 + const property = context.property,
  24 + parent = context.parent
  25 +
  26 + return self.canCopyProperty(property, parent)
  27 + })
  28 +}
  29 +
  30 +CamundaModdleExtension.$inject = ["eventBus"]
  31 +
  32 +/**
  33 + * Check wether to disallow copying property.
  34 + */
  35 +CamundaModdleExtension.prototype.canCopyProperty = function (property, parent) {
  36 + // (1) check wether property is allowed in parent
  37 + if (isObject(property) && !isAllowedInParent(property, parent)) {
  38 + return false
  39 + }
  40 +
  41 + // (2) check more complex scenarios
  42 +
  43 + if (is(property, "camunda:InputOutput") && !this.canHostInputOutput(parent)) {
  44 + return false
  45 + }
  46 +
  47 + if (isAny(property, ["camunda:Connector", "camunda:Field"]) && !this.canHostConnector(parent)) {
  48 + return false
  49 + }
  50 +
  51 + if (is(property, "camunda:In") && !this.canHostIn(parent)) {
  52 + return false
  53 + }
  54 +}
  55 +
  56 +CamundaModdleExtension.prototype.canHostInputOutput = function (parent) {
  57 + // allowed in camunda:Connector
  58 + const connector = getParent(parent, 'camunda:Connector')
  59 +
  60 + if (connector) {
  61 + return true
  62 + }
  63 +
  64 + // special rules inside bpmn:FlowNode
  65 + const flowNode = getParent(parent, 'bpmn:FlowNode')
  66 +
  67 + if (!flowNode) {
  68 + return false
  69 + }
  70 +
  71 + if (isAny(flowNode, ["bpmn:StartEvent", "bpmn:Gateway", "bpmn:BoundaryEvent"])) {
  72 + return false
  73 + }
  74 +
  75 + return !(is(flowNode, "bpmn:SubProcess") && flowNode.get("triggeredByEvent"))
  76 +
  77 +
  78 +}
  79 +
  80 +CamundaModdleExtension.prototype.canHostConnector = function (parent) {
  81 + const serviceTaskLike = getParent(parent, 'camunda:ServiceTaskLike')
  82 +
  83 + if (is(serviceTaskLike, "bpmn:MessageEventDefinition")) {
  84 + // only allow on throw and end events
  85 + return getParent(parent, "bpmn:IntermediateThrowEvent") || getParent(parent, "bpmn:EndEvent")
  86 + }
  87 +
  88 + return true
  89 +}
  90 +
  91 +CamundaModdleExtension.prototype.canHostIn = function (parent) {
  92 + const callActivity = getParent(parent, 'bpmn:CallActivity')
  93 +
  94 + if (callActivity) {
  95 + return true
  96 + }
  97 +
  98 + const signalEventDefinition = getParent(parent, 'bpmn:SignalEventDefinition')
  99 +
  100 + if (signalEventDefinition) {
  101 + // only allow on throw and end events
  102 + return getParent(parent, "bpmn:IntermediateThrowEvent") || getParent(parent, "bpmn:EndEvent")
  103 + }
  104 +
  105 + return true
  106 +}
  107 +
  108 +// module.exports = CamundaModdleExtension;
  109 +export default CamundaModdleExtension
  110 +
  111 +// helpers //////////
  112 +
  113 +function is (element, type) {
  114 + return element && isFunction(element.$instanceOf) && element.$instanceOf(type)
  115 +}
  116 +
  117 +function isAny (element, types) {
  118 + return some(types, function (t) {
  119 + return is(element, t)
  120 + })
  121 +}
  122 +
  123 +function getParent (element, type) {
  124 + if (!type) {
  125 + return element.$parent
  126 + }
  127 +
  128 + if (is(element, type)) {
  129 + return element
  130 + }
  131 +
  132 + if (!element.$parent) {
  133 + return
  134 + }
  135 +
  136 + return getParent(element.$parent, type)
  137 +}
  138 +
  139 +function isAllowedInParent (property, parent) {
  140 + // (1) find property descriptor
  141 + const descriptor = property.$type && property.$model.getTypeDescriptor(property.$type)
  142 +
  143 + const allowedIn = descriptor && descriptor.meta && descriptor.meta.allowedIn
  144 +
  145 + if (!allowedIn || isWildcard(allowedIn)) {
  146 + return true
  147 + }
  148 +
  149 + // (2) check wether property has parent of allowed type
  150 + return some(allowedIn, function (type) {
  151 + return getParent(parent, type)
  152 + })
  153 +}
  154 +
  155 +function isWildcard (allowedIn) {
  156 + return allowedIn.indexOf(WILDCARD) !== -1
  157 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/extension-moddle/camunda/index.js 0 → 100644
  View file @5bedff6
  1 +"use strict"
  2 +
  3 +import extension from "./extension"
  4 +
  5 +export default {
  6 + __init__: ["camundaModdleExtension"],
  7 + camundaModdleExtension: ["type", extension]
  8 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/extension-moddle/flowable/flowableExtension.js 0 → 100644
  View file @5bedff6
  1 +"use strict"
  2 +
  3 +import { some } from 'min-dash'
  4 +
  5 +// const some = some
  6 +// const some = require('min-dash').some
  7 +
  8 +
  9 +
  10 +const ALLOWED_TYPES = {
  11 + FailedJobRetryTimeCycle: ['bpmn:StartEvent', 'bpmn:BoundaryEvent', 'bpmn:IntermediateCatchEvent', 'bpmn:Activity'],
  12 + Connector: ['bpmn:EndEvent', 'bpmn:IntermediateThrowEvent'],
  13 + Field: ['bpmn:EndEvent', 'bpmn:IntermediateThrowEvent']
  14 +}
  15 +
  16 +function is (element, type) {
  17 + return element && typeof element.$instanceOf === "function" && element.$instanceOf(type)
  18 +}
  19 +
  20 +function exists (element) {
  21 + return element && element.length
  22 +}
  23 +
  24 +function includesType (collection, type) {
  25 + return (
  26 + exists(collection) &&
  27 + some(collection, function (element) {
  28 + return is(element, type)
  29 + })
  30 + )
  31 +}
  32 +
  33 +function anyType (element, types) {
  34 + return some(types, function (type) {
  35 + return is(element, type)
  36 + })
  37 +}
  38 +
  39 +function isAllowed (propName, propDescriptor, newElement) {
  40 + const name = propDescriptor.name,
  41 + types = ALLOWED_TYPES[name.replace(/flowable:/, '')]
  42 +
  43 + return name === propName && anyType(newElement, types)
  44 +}
  45 +
  46 +function FlowableModdleExtension (eventBus) {
  47 + eventBus.on(
  48 + "property.clone",
  49 + function (context) {
  50 + const newElement = context.newElement,
  51 + propDescriptor = context.propertyDescriptor
  52 +
  53 + this.canCloneProperty(newElement, propDescriptor)
  54 + },
  55 + this
  56 + )
  57 +}
  58 +
  59 +FlowableModdleExtension.$inject = ["eventBus"]
  60 +
  61 +FlowableModdleExtension.prototype.canCloneProperty = function (newElement, propDescriptor) {
  62 + if (isAllowed("flowable:FailedJobRetryTimeCycle", propDescriptor, newElement)) {
  63 + return (
  64 + includesType(newElement.eventDefinitions, "bpmn:TimerEventDefinition") ||
  65 + includesType(newElement.eventDefinitions, "bpmn:SignalEventDefinition") ||
  66 + is(newElement.loopCharacteristics, "bpmn:MultiInstanceLoopCharacteristics")
  67 + )
  68 + }
  69 +
  70 + if (isAllowed("flowable:Connector", propDescriptor, newElement)) {
  71 + return includesType(newElement.eventDefinitions, "bpmn:MessageEventDefinition")
  72 + }
  73 +
  74 + if (isAllowed("flowable:Field", propDescriptor, newElement)) {
  75 + return includesType(newElement.eventDefinitions, "bpmn:MessageEventDefinition")
  76 + }
  77 +}
  78 +
  79 +// module.exports = FlowableModdleExtension;
  80 +export default FlowableModdleExtension
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/extension-moddle/flowable/index.js 0 → 100644
  View file @5bedff6
  1 +/*
  2 + * @author igdianov
  3 + * address https://github.com/igdianov/activiti-bpmn-moddle
  4 + * */
  5 +import flowableExtension from "./flowableExtension"
  6 +
  7 +export default {
  8 + __init__: ["FlowableModdleExtension"],
  9 + FlowableModdleExtension: ["type", flowableExtension]
  10 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/palette/CustomPalette.js 0 → 100644
  View file @5bedff6
  1 +import PaletteProvider from 'bpmn-js/lib/features/palette/PaletteProvider'
  2 +import { assign } from "min-dash"
  3 +
  4 +export default function CustomPalette (palette, create, elementFactory, spaceTool, lassoTool, handTool, globalConnect, translate) {
  5 + PaletteProvider.call(this, palette, create, elementFactory, spaceTool, lassoTool, handTool, globalConnect, translate, 2000)
  6 +}
  7 +
  8 +const F = function () { } // 核心，利用空对象作为中介；
  9 +F.prototype = PaletteProvider.prototype // 核心，将父类的原型赋值给空对象F；
  10 +
  11 +// 利用中介函数重写原型链方法
  12 +F.prototype.getPaletteEntries = function () {
  13 + const actions = {},
  14 + create = this._create,
  15 + elementFactory = this._elementFactory,
  16 + spaceTool = this._spaceTool,
  17 + lassoTool = this._lassoTool,
  18 + handTool = this._handTool,
  19 + globalConnect = this._globalConnect,
  20 + translate = this._translate
  21 +
  22 + function createAction (type, group, className, title, options) {
  23 + function createListener (event) {
  24 + const shape = elementFactory.createShape(assign({ type: type }, options))
  25 +
  26 + if (options) {
  27 + shape.businessObject.di.isExpanded = options.isExpanded
  28 + }
  29 +
  30 + create.start(event, shape)
  31 + }
  32 +
  33 + const shortType = type.replace(/^bpmn:/, '')
  34 +
  35 + return {
  36 + group: group,
  37 + className: className,
  38 + title: title || translate("Create {type}", { type: shortType }),
  39 + action: {
  40 + dragstart: createListener,
  41 + click: createListener
  42 + }
  43 + }
  44 + }
  45 +
  46 + function createSubprocess (event) {
  47 + const subProcess = elementFactory.createShape({
  48 + type: 'bpmn:SubProcess',
  49 + x: 0,
  50 + y: 0,
  51 + isExpanded: true
  52 + })
  53 +
  54 + const startEvent = elementFactory.createShape({
  55 + type: 'bpmn:StartEvent',
  56 + x: 40,
  57 + y: 82,
  58 + parent: subProcess
  59 + })
  60 +
  61 + create.start(event, [subProcess, startEvent], {
  62 + hints: {
  63 + autoSelect: [startEvent]
  64 + }
  65 + })
  66 + }
  67 +
  68 + function createParticipant (event) {
  69 + create.start(event, elementFactory.createParticipantShape())
  70 + }
  71 +
  72 + assign(actions, {
  73 + "hand-tool": {
  74 + group: "tools",
  75 + className: "bpmn-icon-hand-tool",
  76 + title: '激活抓手工具',
  77 + // title: translate("Activate the hand tool"),
  78 + action: {
  79 + click: function (event) {
  80 + handTool.activateHand(event)
  81 + }
  82 + }
  83 + },
  84 + "lasso-tool": {
  85 + group: "tools",
  86 + className: "bpmn-icon-lasso-tool",
  87 + title: translate("Activate the lasso tool"),
  88 + action: {
  89 + click: function (event) {
  90 + lassoTool.activateSelection(event)
  91 + }
  92 + }
  93 + },
  94 + "space-tool": {
  95 + group: "tools",
  96 + className: "bpmn-icon-space-tool",
  97 + title: translate("Activate the create/remove space tool"),
  98 + action: {
  99 + click: function (event) {
  100 + spaceTool.activateSelection(event)
  101 + }
  102 + }
  103 + },
  104 + "global-connect-tool": {
  105 + group: "tools",
  106 + className: "bpmn-icon-connection-multi",
  107 + title: translate("Activate the global connect tool"),
  108 + action: {
  109 + click: function (event) {
  110 + globalConnect.toggle(event)
  111 + }
  112 + }
  113 + },
  114 + "tool-separator": {
  115 + group: "tools",
  116 + separator: true
  117 + },
  118 + "create.start-event": createAction("bpmn:StartEvent", "event", "bpmn-icon-start-event-none", translate("Create StartEvent")),
  119 + "create.intermediate-event": createAction(
  120 + "bpmn:IntermediateThrowEvent",
  121 + "event",
  122 + "bpmn-icon-intermediate-event-none",
  123 + translate("Create Intermediate/Boundary Event")
  124 + ),
  125 + "create.end-event": createAction("bpmn:EndEvent", "event", "bpmn-icon-end-event-none", translate("Create EndEvent")),
  126 + "create.exclusive-gateway": createAction("bpmn:ExclusiveGateway", "gateway", "bpmn-icon-gateway-none", translate("Create Gateway")),
  127 + "create.user-task": createAction("bpmn:UserTask", "activity", "bpmn-icon-user-task", translate("Create User Task")),
  128 + "create.data-object": createAction("bpmn:DataObjectReference", "data-object", "bpmn-icon-data-object", translate("Create DataObjectReference")),
  129 + "create.data-store": createAction("bpmn:DataStoreReference", "data-store", "bpmn-icon-data-store", translate("Create DataStoreReference")),
  130 + "create.subprocess-expanded": {
  131 + group: "activity",
  132 + className: "bpmn-icon-subprocess-expanded",
  133 + title: translate("Create expanded SubProcess"),
  134 + action: {
  135 + dragstart: createSubprocess,
  136 + click: createSubprocess
  137 + }
  138 + },
  139 + "create.participant-expanded": {
  140 + group: "collaboration",
  141 + className: "bpmn-icon-participant",
  142 + title: translate("Create Pool/Participant"),
  143 + action: {
  144 + dragstart: createParticipant,
  145 + click: createParticipant
  146 + }
  147 + },
  148 + "create.group": createAction("bpmn:Group", "artifact", "bpmn-icon-group", translate("Create Group"))
  149 + })
  150 +
  151 + return actions
  152 +}
  153 +
  154 +CustomPalette.$inject = ["palette", "create", "elementFactory", "spaceTool", "lassoTool", "handTool", "globalConnect", "translate"]
  155 +
  156 +CustomPalette.prototype = new F() // 核心，将 F的实例赋值给子类；
  157 +CustomPalette.prototype.constructor = CustomPalette // 修复子类CustomPalette的构造器指向，防止原型链的混乱；
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/palette/index.js 0 → 100644
  View file @5bedff6
  1 +// import PaletteModule from "diagram-js/lib/features/palette";
  2 +// import CreateModule from "diagram-js/lib/features/create";
  3 +// import SpaceToolModule from "diagram-js/lib/features/space-tool";
  4 +// import LassoToolModule from "diagram-js/lib/features/lasso-tool";
  5 +// import HandToolModule from "diagram-js/lib/features/hand-tool";
  6 +// import GlobalConnectModule from "diagram-js/lib/features/global-connect";
  7 +// import translate from "diagram-js/lib/i18n/translate";
  8 +//
  9 +// import PaletteProvider from "./paletteProvider";
  10 +//
  11 +// export default {
  12 +// __depends__: [PaletteModule, CreateModule, SpaceToolModule, LassoToolModule, HandToolModule, GlobalConnectModule, translate],
  13 +// __init__: ["paletteProvider"],
  14 +// paletteProvider: ["type", PaletteProvider]
  15 +// };
  16 +
  17 +import CustomPalette from "./CustomPalette";
  18 +
  19 +export default {
  20 + __init__: ["paletteProvider"],
  21 + paletteProvider: ["type", CustomPalette]
  22 +};
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/palette/paletteProvider.js 0 → 100644
  View file @5bedff6
  1 +import { assign } from "min-dash"
  2 +
  3 +/**
  4 + * A palette provider for BPMN 2.0 elements.
  5 + */
  6 +export default function PaletteProvider (palette, create, elementFactory, spaceTool, lassoTool, handTool, globalConnect, translate) {
  7 + this._palette = palette
  8 + this._create = create
  9 + this._elementFactory = elementFactory
  10 + this._spaceTool = spaceTool
  11 + this._lassoTool = lassoTool
  12 + this._handTool = handTool
  13 + this._globalConnect = globalConnect
  14 + this._translate = translate
  15 +
  16 + palette.registerProvider(this)
  17 +}
  18 +
  19 +PaletteProvider.$inject = ["palette", "create", "elementFactory", "spaceTool", "lassoTool", "handTool", "globalConnect", "translate"]
  20 +
  21 +PaletteProvider.prototype.getPaletteEntries = function () {
  22 + const actions = {},
  23 + create = this._create,
  24 + elementFactory = this._elementFactory,
  25 + spaceTool = this._spaceTool,
  26 + lassoTool = this._lassoTool,
  27 + handTool = this._handTool,
  28 + globalConnect = this._globalConnect,
  29 + translate = this._translate
  30 +
  31 + function createAction (type, group, className, title, options) {
  32 + function createListener (event) {
  33 + const shape = elementFactory.createShape(assign({ type: type }, options))
  34 +
  35 + if (options) {
  36 + shape.businessObject.di.isExpanded = options.isExpanded
  37 + }
  38 +
  39 + create.start(event, shape)
  40 + }
  41 +
  42 + const shortType = type.replace(/^bpmn:/, '')
  43 +
  44 + return {
  45 + group: group,
  46 + className: className,
  47 + title: title || translate("Create {type}", { type: shortType }),
  48 + action: {
  49 + dragstart: createListener,
  50 + click: createListener
  51 + }
  52 + }
  53 + }
  54 +
  55 + function createSubprocess (event) {
  56 + const subProcess = elementFactory.createShape({
  57 + type: 'bpmn:SubProcess',
  58 + x: 0,
  59 + y: 0,
  60 + isExpanded: true
  61 + })
  62 +
  63 + const startEvent = elementFactory.createShape({
  64 + type: 'bpmn:StartEvent',
  65 + x: 40,
  66 + y: 82,
  67 + parent: subProcess
  68 + })
  69 +
  70 + create.start(event, [subProcess, startEvent], {
  71 + hints: {
  72 + autoSelect: [startEvent]
  73 + }
  74 + })
  75 + }
  76 +
  77 + function createParticipant (event) {
  78 + create.start(event, elementFactory.createParticipantShape())
  79 + }
  80 +
  81 + assign(actions, {
  82 + "hand-tool": {
  83 + group: "tools",
  84 + className: "bpmn-icon-hand-tool",
  85 + title: translate("Activate the hand tool"),
  86 + action: {
  87 + click: function (event) {
  88 + handTool.activateHand(event)
  89 + }
  90 + }
  91 + },
  92 + "lasso-tool": {
  93 + group: "tools",
  94 + className: "bpmn-icon-lasso-tool",
  95 + title: translate("Activate the lasso tool"),
  96 + action: {
  97 + click: function (event) {
  98 + lassoTool.activateSelection(event)
  99 + }
  100 + }
  101 + },
  102 + "space-tool": {
  103 + group: "tools",
  104 + className: "bpmn-icon-space-tool",
  105 + title: translate("Activate the create/remove space tool"),
  106 + action: {
  107 + click: function (event) {
  108 + spaceTool.activateSelection(event)
  109 + }
  110 + }
  111 + },
  112 + "global-connect-tool": {
  113 + group: "tools",
  114 + className: "bpmn-icon-connection-multi",
  115 + title: translate("Activate the global connect tool"),
  116 + action: {
  117 + click: function (event) {
  118 + globalConnect.toggle(event)
  119 + }
  120 + }
  121 + },
  122 + "tool-separator": {
  123 + group: "tools",
  124 + separator: true
  125 + },
  126 + "create.start-event": createAction("bpmn:StartEvent", "event", "bpmn-icon-start-event-none", translate("Create StartEvent")),
  127 + "create.intermediate-event": createAction(
  128 + "bpmn:IntermediateThrowEvent",
  129 + "event",
  130 + "bpmn-icon-intermediate-event-none",
  131 + translate("Create Intermediate/Boundary Event")
  132 + ),
  133 + "create.end-event": createAction("bpmn:EndEvent", "event", "bpmn-icon-end-event-none", translate("Create EndEvent")),
  134 + "create.exclusive-gateway": createAction("bpmn:ExclusiveGateway", "gateway", "bpmn-icon-gateway-none", translate("Create Gateway")),
  135 + "create.user-task": createAction("bpmn:UserTask", "activity", "bpmn-icon-user-task", translate("Create User Task")),
  136 + "create.data-object": createAction("bpmn:DataObjectReference", "data-object", "bpmn-icon-data-object", translate("Create DataObjectReference")),
  137 + "create.data-store": createAction("bpmn:DataStoreReference", "data-store", "bpmn-icon-data-store", translate("Create DataStoreReference")),
  138 + "create.subprocess-expanded": {
  139 + group: "activity",
  140 + className: "bpmn-icon-subprocess-expanded",
  141 + title: translate("Create expanded SubProcess"),
  142 + action: {
  143 + dragstart: createSubprocess,
  144 + click: createSubprocess
  145 + }
  146 + },
  147 + "create.participant-expanded": {
  148 + group: "collaboration",
  149 + className: "bpmn-icon-participant",
  150 + title: translate("Create Pool/Participant"),
  151 + action: {
  152 + dragstart: createParticipant,
  153 + click: createParticipant
  154 + }
  155 + },
  156 + "create.group": createAction("bpmn:Group", "artifact", "bpmn-icon-group", translate("Create Group"))
  157 + })
  158 +
  159 + return actions
  160 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/translate/customTranslate.js 0 → 100644
  View file @5bedff6
  1 +// import translations from "./zh";
  2 +//
  3 +// export default function customTranslate(template, replacements) {
  4 +// replacements = replacements || {};
  5 +//
  6 +// // Translate
  7 +// template = translations[template] || template;
  8 +//
  9 +// // Replace
  10 +// return template.replace(/{([^}]+)}/g, function(_, key) {
  11 +// let str = replacements[key];
  12 +// if (
  13 +// translations[replacements[key]] !== null &&
  14 +// translations[replacements[key]] !== "undefined"
  15 +// ) {
  16 +// // eslint-disable-next-line no-mixed-spaces-and-tabs
  17 +// str = translations[replacements[key]];
  18 +// // eslint-disable-next-line no-mixed-spaces-and-tabs
  19 +// }
  20 +// return str || "{" + key + "}";
  21 +// });
  22 +// }
  23 +
  24 +export default function customTranslate(translations) {
  25 + return function(template, replacements) {
  26 + replacements = replacements || {};
  27 + // Translate
  28 + template = translations[template] || template;
  29 +
  30 + // Replace
  31 + return template.replace(/{([^}]+)}/g, function(_, key) {
  32 + let str = replacements[key];
  33 + if (translations[replacements[key]] !== null && translations[replacements[key]] !== undefined) {
  34 + // eslint-disable-next-line no-mixed-spaces-and-tabs
  35 + str = translations[replacements[key]];
  36 + // eslint-disable-next-line no-mixed-spaces-and-tabs
  37 + }
  38 + return str || "{" + key + "}";
  39 + });
  40 + };
  41 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/plugins/translate/zh.js 0 → 100644
  View file @5bedff6
  1 +/**
  2 + * This is a sample file that should be replaced with the actual translation.
  3 + *
  4 + * Checkout https://github.com/bpmn-io/bpmn-js-i18n for a list of available
  5 + * translations and labels to translate.
  6 + */
  7 +export default {
  8 + // 添加部分
  9 + "Append EndEvent": "追加结束事件",
  10 + "Append Gateway": "追加网关",
  11 + "Append Task": "追加任务",
  12 + "Append Intermediate/Boundary Event": "追加中间抛出事件/边界事件",
  13 +
  14 + "Activate the global connect tool": "激活全局连接工具",
  15 + "Append {type}": "添加 {type}",
  16 + "Add Lane above": "在上面添加道",
  17 + "Divide into two Lanes": "分割成两个道",
  18 + "Divide into three Lanes": "分割成三个道",
  19 + "Add Lane below": "在下面添加道",
  20 + "Append compensation activity": "追加补偿活动",
  21 + "Change type": "修改类型",
  22 + "Connect using Association": "使用关联连接",
  23 + "Connect using Sequence/MessageFlow or Association": "使用顺序/消息流或者关联连接",
  24 + "Connect using DataInputAssociation": "使用数据输入关联连接",
  25 + Remove: "移除",
  26 + "Activate the hand tool": "激活抓手工具",
  27 + "Activate the lasso tool": "激活套索工具",
  28 + "Activate the create/remove space tool": "激活创建/删除空间工具",
  29 + "Create expanded SubProcess": "创建扩展子过程",
  30 + "Create IntermediateThrowEvent/BoundaryEvent": "创建中间抛出事件/边界事件",
  31 + "Create Pool/Participant": "创建池/参与者",
  32 + "Parallel Multi Instance": "并行多重事件",
  33 + "Sequential Multi Instance": "时序多重事件",
  34 + DataObjectReference: "数据对象参考",
  35 + DataStoreReference: "数据存储参考",
  36 + Loop: "循环",
  37 + "Ad-hoc": "即席",
  38 + "Create {type}": "创建 {type}",
  39 + Task: "任务",
  40 + "Send Task": "发送任务",
  41 + "Receive Task": "接收任务",
  42 + "User Task": "用户任务",
  43 + "Manual Task": "手工任务",
  44 + "Business Rule Task": "业务规则任务",
  45 + "Service Task": "服务任务",
  46 + "Script Task": "脚本任务",
  47 + "Call Activity": "调用活动",
  48 + "Sub Process (collapsed)": "子流程（折叠的）",
  49 + "Sub Process (expanded)": "子流程（展开的）",
  50 + "Start Event": "开始事件",
  51 + StartEvent: "开始事件",
  52 + "Intermediate Throw Event": "中间事件",
  53 + "End Event": "结束事件",
  54 + EndEvent: "结束事件",
  55 + "Create StartEvent": "创建开始事件",
  56 + "Create EndEvent": "创建结束事件",
  57 + "Create Task": "创建任务",
  58 + "Create User Task": "创建用户任务",
  59 + "Create Gateway": "创建网关",
  60 + "Create DataObjectReference": "创建数据对象",
  61 + "Create DataStoreReference": "创建数据存储",
  62 + "Create Group": "创建分组",
  63 + "Create Intermediate/Boundary Event": "创建中间/边界事件",
  64 + "Message Start Event": "消息开始事件",
  65 + "Timer Start Event": "定时开始事件",
  66 + "Conditional Start Event": "条件开始事件",
  67 + "Signal Start Event": "信号开始事件",
  68 + "Error Start Event": "错误开始事件",
  69 + "Escalation Start Event": "升级开始事件",
  70 + "Compensation Start Event": "补偿开始事件",
  71 + "Message Start Event (non-interrupting)": "消息开始事件（非中断）",
  72 + "Timer Start Event (non-interrupting)": "定时开始事件（非中断）",
  73 + "Conditional Start Event (non-interrupting)": "条件开始事件（非中断）",
  74 + "Signal Start Event (non-interrupting)": "信号开始事件（非中断）",
  75 + "Escalation Start Event (non-interrupting)": "升级开始事件（非中断）",
  76 + "Message Intermediate Catch Event": "消息中间捕获事件",
  77 + "Message Intermediate Throw Event": "消息中间抛出事件",
  78 + "Timer Intermediate Catch Event": "定时中间捕获事件",
  79 + "Escalation Intermediate Throw Event": "升级中间抛出事件",
  80 + "Conditional Intermediate Catch Event": "条件中间捕获事件",
  81 + "Link Intermediate Catch Event": "链接中间捕获事件",
  82 + "Link Intermediate Throw Event": "链接中间抛出事件",
  83 + "Compensation Intermediate Throw Event": "补偿中间抛出事件",
  84 + "Signal Intermediate Catch Event": "信号中间捕获事件",
  85 + "Signal Intermediate Throw Event": "信号中间抛出事件",
  86 + "Message End Event": "消息结束事件",
  87 + "Escalation End Event": "定时结束事件",
  88 + "Error End Event": "错误结束事件",
  89 + "Cancel End Event": "取消结束事件",
  90 + "Compensation End Event": "补偿结束事件",
  91 + "Signal End Event": "信号结束事件",
  92 + "Terminate End Event": "终止结束事件",
  93 + "Message Boundary Event": "消息边界事件",
  94 + "Message Boundary Event (non-interrupting)": "消息边界事件（非中断）",
  95 + "Timer Boundary Event": "定时边界事件",
  96 + "Timer Boundary Event (non-interrupting)": "定时边界事件（非中断）",
  97 + "Escalation Boundary Event": "升级边界事件",
  98 + "Escalation Boundary Event (non-interrupting)": "升级边界事件（非中断）",
  99 + "Conditional Boundary Event": "条件边界事件",
  100 + "Conditional Boundary Event (non-interrupting)": "条件边界事件（非中断）",
  101 + "Error Boundary Event": "错误边界事件",
  102 + "Cancel Boundary Event": "取消边界事件",
  103 + "Signal Boundary Event": "信号边界事件",
  104 + "Signal Boundary Event (non-interrupting)": "信号边界事件（非中断）",
  105 + "Compensation Boundary Event": "补偿边界事件",
  106 + "Exclusive Gateway": "互斥网关",
  107 + "Parallel Gateway": "并行网关",
  108 + "Inclusive Gateway": "相容网关",
  109 + "Complex Gateway": "复杂网关",
  110 + "Event based Gateway": "事件网关",
  111 + Transaction: "转运",
  112 + "Sub Process": "子流程",
  113 + "Event Sub Process": "事件子流程",
  114 + "Collapsed Pool": "折叠池",
  115 + "Expanded Pool": "展开池",
  116 +
  117 + // Errors
  118 + "no parent for {element} in {parent}": "在{parent}里，{element}没有父类",
  119 + "no shape type specified": "没有指定的形状类型",
  120 + "flow elements must be children of pools/participants": "流元素必须是池/参与者的子类",
  121 + "out of bounds release": "out of bounds release",
  122 + "more than {count} child lanes": "子道大于{count} ",
  123 + "element required": "元素不能为空",
  124 + "diagram not part of bpmn:Definitions": "流程图不符合bpmn规范",
  125 + "no diagram to display": "没有可展示的流程图",
  126 + "no process or collaboration to display": "没有可展示的流程/协作",
  127 + "element {element} referenced by {referenced}#{property} not yet drawn": "由{referenced}#{property}引用的{element}元素仍未绘制",
  128 + "already rendered {element}": "{element} 已被渲染",
  129 + "failed to import {element}": "导入{element}失败",
  130 + //属性面板的参数
  131 + Id: "编号",
  132 + Name: "名称",
  133 + General: "常规",
  134 + Details: "详情",
  135 + "Message Name": "消息名称",
  136 + Message: "消息",
  137 + Initiator: "创建者",
  138 + "Asynchronous Continuations": "持续异步",
  139 + "Asynchronous Before": "异步前",
  140 + "Asynchronous After": "异步后",
  141 + "Job Configuration": "工作配置",
  142 + Exclusive: "排除",
  143 + "Job Priority": "工作优先级",
  144 + "Retry Time Cycle": "重试时间周期",
  145 + Documentation: "文档",
  146 + "Element Documentation": "元素文档",
  147 + "History Configuration": "历史配置",
  148 + "History Time To Live": "历史的生存时间",
  149 + Forms: "表单",
  150 + "Form Key": "表单key",
  151 + "Form Fields": "表单字段",
  152 + "Business Key": "业务key",
  153 + "Form Field": "表单字段",
  154 + ID: "编号",
  155 + Type: "类型",
  156 + Label: "名称",
  157 + "Default Value": "默认值",
  158 + "Default Flow": "默认流转路径",
  159 + "Conditional Flow": "条件流转路径",
  160 + "Sequence Flow": "普通流转路径",
  161 + Validation: "校验",
  162 + "Add Constraint": "添加约束",
  163 + Config: "配置",
  164 + Properties: "属性",
  165 + "Add Property": "添加属性",
  166 + Value: "值",
  167 + Listeners: "监听器",
  168 + "Execution Listener": "执行监听",
  169 + "Event Type": "事件类型",
  170 + "Listener Type": "监听器类型",
  171 + "Java Class": "Java类",
  172 + Expression: "表达式",
  173 + "Must provide a value": "必须提供一个值",
  174 + "Delegate Expression": "代理表达式",
  175 + Script: "脚本",
  176 + "Script Format": "脚本格式",
  177 + "Script Type": "脚本类型",
  178 + "Inline Script": "内联脚本",
  179 + "External Script": "外部脚本",
  180 + Resource: "资源",
  181 + "Field Injection": "字段注入",
  182 + Extensions: "扩展",
  183 + "Input/Output": "输入/输出",
  184 + "Input Parameters": "输入参数",
  185 + "Output Parameters": "输出参数",
  186 + Parameters: "参数",
  187 + "Output Parameter": "输出参数",
  188 + "Timer Definition Type": "定时器定义类型",
  189 + "Timer Definition": "定时器定义",
  190 + Date: "日期",
  191 + Duration: "持续",
  192 + Cycle: "循环",
  193 + Signal: "信号",
  194 + "Signal Name": "信号名称",
  195 + Escalation: "升级",
  196 + Error: "错误",
  197 + "Link Name": "链接名称",
  198 + Condition: "条件名称",
  199 + "Variable Name": "变量名称",
  200 + "Variable Event": "变量事件",
  201 + "Specify more than one variable change event as a comma separated list.": "多个变量事件以逗号隔开",
  202 + "Wait for Completion": "等待完成",
  203 + "Activity Ref": "活动参考",
  204 + "Version Tag": "版本标签",
  205 + Executable: "可执行文件",
  206 + "External Task Configuration": "扩展任务配置",
  207 + "Task Priority": "任务优先级",
  208 + External: "外部",
  209 + Connector: "连接器",
  210 + "Must configure Connector": "必须配置连接器",
  211 + "Connector Id": "连接器编号",
  212 + Implementation: "实现方式",
  213 + "Field Injections": "字段注入",
  214 + Fields: "字段",
  215 + "Result Variable": "结果变量",
  216 + Topic: "主题",
  217 + "Configure Connector": "配置连接器",
  218 + "Input Parameter": "输入参数",
  219 + Assignee: "代理人",
  220 + "Candidate Users": "候选用户",
  221 + "Candidate Groups": "候选组",
  222 + "Due Date": "到期时间",
  223 + "Follow Up Date": "跟踪日期",
  224 + Priority: "优先级",
  225 + "The follow up date as an EL expression (e.g. ${someDate} or an ISO date (e.g. 2015-06-26T09:54:00)":
  226 + "跟踪日期必须符合EL表达式，如： ${someDate} ,或者一个ISO标准日期，如：2015-06-26T09:54:00",
  227 + "The due date as an EL expression (e.g. ${someDate} or an ISO date (e.g. 2015-06-26T09:54:00)":
  228 + "跟踪日期必须符合EL表达式，如： ${someDate} ,或者一个ISO标准日期，如：2015-06-26T09:54:00",
  229 + Variables: "变量",
  230 + "Candidate Starter Configuration": "候选人起动器配置",
  231 + "Candidate Starter Groups": "候选人起动器组",
  232 + "This maps to the process definition key.": "这映射到流程定义键。",
  233 + "Candidate Starter Users": "候选人起动器的用户",
  234 + "Specify more than one user as a comma separated list.": "指定多个用户作为逗号分隔的列表。",
  235 + "Tasklist Configuration": "Tasklist配置",
  236 + Startable: "启动",
  237 + "Specify more than one group as a comma separated list.": "指定多个组作为逗号分隔的列表。"
  238 +};
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/index.ts 0 → 100644
  View file @5bedff6
  1 +import { App } from 'vue'
  2 +import MyProcessDesigner from './designer'
  3 +import MyProcessPenal from './penal'
  4 +import MyProcessViewer from './designer/index2'
  5 +
  6 +const components = [MyProcessDesigner, MyProcessPenal, MyProcessViewer]
  7 +
  8 +// const install = function (Vue) {
  9 +// components.forEach(component => {
  10 +// Vue.component(component.name, component)
  11 +// })
  12 +// }
  13 +
  14 +// if (typeof window !== "undefined" && window.Vue) {
  15 +// install(window.Vue)
  16 +// }
  17 +// components.forEach(component => {
  18 +// Vue.component(component.name, component)
  19 +// })
  20 +const componentss = {
  21 + install: (Vue: App): void => {
  22 + components.forEach((component) => {
  23 + Vue.component(component.name, component)
  24 + })
  25 + }
  26 +}
  27 +// let version = "0.0.1"
  28 +export const MyPD = (app) => {
  29 + // export default {
  30 + // app.use(version)
  31 + // app.use(install)
  32 + // app.use(MyProcessDesigner)
  33 + // app.use(MyProcessPenal)
  34 + // app.use(MyProcessViewer)
  35 + // app.use(components)
  36 + app.use(componentss)
  37 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/palette/ProcessPalette.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="my-process-palette">
  3 + <div class="test-button" @click="addTask" @mousedown="addTask">测试任务</div>
  4 + <div class="test-container" id="palette-container">1</div>
  5 + </div>
  6 +</template>
  7 +
  8 +<script setup lang="ts" name="MyProcessPalette">
  9 +import { assign } from 'min-dash'
  10 +
  11 +const addTask = (event, options = {}) => {
  12 + const ElementFactory = window.bpmnInstances.elementFactory
  13 + const create = window.bpmnInstances.modeler.get('create')
  14 +
  15 + console.log(ElementFactory, create)
  16 +
  17 + const shape = ElementFactory.createShape(assign({ type: 'bpmn:UserTask' }, options))
  18 +
  19 + if (options) {
  20 + shape.businessObject.di.isExpanded = options.isExpanded
  21 + }
  22 +
  23 + console.log(event, 'event')
  24 + console.log(shape, 'shape')
  25 + create.start(event, shape)
  26 +}
  27 +</script>
  28 +
  29 +<style scoped lang="scss">
  30 +.my-process-palette {
  31 + box-sizing: border-box;
  32 + padding: 80px 20px 20px 20px;
  33 + .test-button {
  34 + box-sizing: border-box;
  35 + padding: 8px 16px;
  36 + border-radius: 4px;
  37 + border: 1px solid rgba(24, 144, 255, 0.8);
  38 + cursor: pointer;
  39 + }
  40 +}
  41 +</style>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="process-panel__container" :style="{ width: `${width}px` }">
  3 + <el-collapse v-model="activeTab">
  4 + <el-collapse-item name="base">
  5 + <!-- class="panel-tab__title" -->
  6 + <template #title>
  7 + <Icon icon="ep:info-filled" />
  8 + 常规</template
  9 + >
  10 + <ElementBaseInfo
  11 + :id-edit-disabled="idEditDisabled"
  12 + :business-object="elementBusinessObject"
  13 + :type="elementType"
  14 + :model="model"
  15 + />
  16 + </el-collapse-item>
  17 + <el-collapse-item name="condition" v-if="elementType === 'Process'" key="message">
  18 + <template #title><Icon icon="ep:comment" />消息与信号</template>
  19 + <signal-and-massage />
  20 + </el-collapse-item>
  21 + <el-collapse-item name="condition" v-if="conditionFormVisible" key="condition">
  22 + <template #title><Icon icon="ep:promotion" />流转条件</template>
  23 + <flow-condition :business-object="elementBusinessObject" :type="elementType" />
  24 + </el-collapse-item>
  25 + <el-collapse-item name="condition" v-if="formVisible" key="form">
  26 + <template #title><Icon icon="ep:list" />表单</template>
  27 + <!-- <element-form :id="elementId" :type="elementType" /> -->
  28 + 友情提示：使用
  29 + <router-link :to="{ path: '/bpm/manager/form' }"
  30 + ><el-link type="danger">流程表单</el-link>
  31 + </router-link>
  32 + 替代，提供更好的表单设计功能
  33 + </el-collapse-item>
  34 + <el-collapse-item name="task" v-if="elementType.indexOf('Task') !== -1" key="task">
  35 + <template #title><Icon icon="ep:checked" />任务</template>
  36 + <element-task :id="elementId" :type="elementType" />
  37 + </el-collapse-item>
  38 + <el-collapse-item
  39 + name="multiInstance"
  40 + v-if="elementType.indexOf('Task') !== -1"
  41 + key="multiInstance"
  42 + >
  43 + <template #title><Icon icon="ep:help-filled" />多实例</template>
  44 + <element-multi-instance :business-object="elementBusinessObject" :type="elementType" />
  45 + </el-collapse-item>
  46 + <el-collapse-item name="listeners" key="listeners">
  47 + <template #title><Icon icon="ep:bell-filled" />执行监听器</template>
  48 + <element-listeners :id="elementId" :type="elementType" />
  49 + </el-collapse-item>
  50 + <el-collapse-item name="taskListeners" v-if="elementType === 'UserTask'" key="taskListeners">
  51 + <template #title><Icon icon="ep:bell-filled" />任务监听器</template>
  52 + <user-task-listeners :id="elementId" :type="elementType" />
  53 + </el-collapse-item>
  54 + <el-collapse-item name="extensions" key="extensions">
  55 + <template #title><Icon icon="ep:circle-plus-filled" />扩展属性</template>
  56 + <element-properties :id="elementId" :type="elementType" />
  57 + </el-collapse-item>
  58 + <el-collapse-item name="other" key="other">
  59 + <template #title><Icon icon="ep:promotion" />其他</template>
  60 + <element-other-config :id="elementId" />
  61 + </el-collapse-item>
  62 + </el-collapse>
  63 + </div>
  64 +</template>
  65 +<script setup lang="ts" name="MyPropertiesPanel">
  66 +import ElementBaseInfo from './base/ElementBaseInfo.vue'
  67 +import ElementOtherConfig from './other/ElementOtherConfig.vue'
  68 +import ElementTask from './task/ElementTask.vue'
  69 +import ElementMultiInstance from './multi-instance/ElementMultiInstance.vue'
  70 +import FlowCondition from './flow-condition/FlowCondition.vue'
  71 +import SignalAndMassage from './signal-message/SignalAndMessage.vue'
  72 +import ElementListeners from './listeners/ElementListeners.vue'
  73 +import ElementProperties from './properties/ElementProperties.vue'
  74 +// import ElementForm from './form/ElementForm.vue'
  75 +import UserTaskListeners from './listeners/UserTaskListeners.vue'
  76 +import { provide, ref, watch, onBeforeUnmount, onMounted } from 'vue'
  77 +import { ElCollapse, ElCollapseItem, ElLink } from 'element-plus'
  78 +/**
  79 + * 侧边栏
  80 + * @Author MiyueFE
  81 + * @Home https://github.com/miyuesc
  82 + * @Date 2021年3月31日18:57:51
  83 + */
  84 +const props = defineProps({
  85 + bpmnModeler: Object,
  86 + prefix: {
  87 + type: String,
  88 + default: 'camunda'
  89 + },
  90 + width: {
  91 + type: Number,
  92 + default: 480
  93 + },
  94 + idEditDisabled: {
  95 + type: Boolean,
  96 + default: false
  97 + },
  98 + model: Object // 流程模型的数据
  99 +})
  100 +
  101 +const activeTab = ref('base')
  102 +const elementId = ref('')
  103 +const elementType = ref('')
  104 +const elementBusinessObject = ref({}) // 元素 businessObject 镜像，提供给需要做判断的组件使用
  105 +const conditionFormVisible = ref(false) // 流转条件设置
  106 +const formVisible = ref(false) // 表单配置
  107 +const bpmnElement = ref()
  108 +const timer = ref()
  109 +provide('prefix', props.prefix)
  110 +provide('width', props.width)
  111 +const initModels = () => {
  112 + // console.log(props, 'props')
  113 + // console.log(props.bpmnModeler, 'sakdjjaskdsajdkasdjkadsjk')
  114 + // 初始化 modeler 以及其他 moddle
  115 + // nextTick(() => {
  116 + if (!props.bpmnModeler) {
  117 + // 避免加载时 流程图 并未加载完成
  118 + timer.value = setTimeout(() => initModels(), 10)
  119 + return
  120 + }
  121 + if (timer.value) {
  122 + clearTimeout(timer.value)
  123 + window.bpmnInstances = {
  124 + modeler: props.bpmnModeler,
  125 + modeling: props.bpmnModeler.get('modeling'),
  126 + moddle: props.bpmnModeler.get('moddle'),
  127 + eventBus: props.bpmnModeler.get('eventBus'),
  128 + bpmnFactory: props.bpmnModeler.get('bpmnFactory'),
  129 + elementFactory: props.bpmnModeler.get('elementFactory'),
  130 + elementRegistry: props.bpmnModeler.get('elementRegistry'),
  131 + replace: props.bpmnModeler.get('replace'),
  132 + selection: props.bpmnModeler.get('selection')
  133 + }
  134 + }
  135 +
  136 + console.log(window.bpmnInstances, 'window.bpmnInstances')
  137 + getActiveElement()
  138 + // })
  139 +}
  140 +const getActiveElement = () => {
  141 + // 初始第一个选中元素 bpmn:Process
  142 + initFormOnChanged(null)
  143 + props.bpmnModeler.on('import.done', (e) => {
  144 + console.log(e, 'eeeee')
  145 + initFormOnChanged(null)
  146 + })
  147 + // 监听选择事件，修改当前激活的元素以及表单
  148 + props.bpmnModeler.on('selection.changed', ({ newSelection }) => {
  149 + initFormOnChanged(newSelection[0] || null)
  150 + })
  151 + props.bpmnModeler.on('element.changed', ({ element }) => {
  152 + // 保证 修改 "默认流转路径" 类似需要修改多个元素的事件发生的时候，更新表单的元素与原选中元素不一致。
  153 + if (element && element.id === elementId.value) {
  154 + initFormOnChanged(element)
  155 + }
  156 + })
  157 +}
  158 +// 初始化数据
  159 +const initFormOnChanged = (element) => {
  160 + let activatedElement = element
  161 + if (!activatedElement) {
  162 + activatedElement =
  163 + window.bpmnInstances.elementRegistry.find((el) => el.type === 'bpmn:Process') ??
  164 + window.bpmnInstances.elementRegistry.find((el) => el.type === 'bpmn:Collaboration')
  165 + }
  166 + if (!activatedElement) return
  167 + console.log(`
  168 + ----------
  169 + select element changed:
  170 + id: ${activatedElement.id}
  171 + type: ${activatedElement.businessObject.$type}
  172 + ----------
  173 + `)
  174 + console.log('businessObject: ', activatedElement.businessObject)
  175 + window.bpmnInstances.bpmnElement = activatedElement
  176 + bpmnElement.value = activatedElement
  177 + elementId.value = activatedElement.id
  178 + elementType.value = activatedElement.type.split(':')[1] || ''
  179 + elementBusinessObject.value = JSON.parse(JSON.stringify(activatedElement.businessObject))
  180 + conditionFormVisible.value = !!(
  181 + elementType.value === 'SequenceFlow' &&
  182 + activatedElement.source &&
  183 + activatedElement.source.type.indexOf('StartEvent') === -1
  184 + )
  185 + formVisible.value = elementType.value === 'UserTask' || elementType.value === 'StartEvent'
  186 +}
  187 +onMounted(() => {
  188 + setTimeout(() => {
  189 + initModels()
  190 + }, 100)
  191 +})
  192 +onBeforeUnmount(() => {
  193 + window.bpmnInstances = null
  194 + console.log(props, 'props1')
  195 + console.log(props.bpmnModeler, 'props.bpmnModeler1')
  196 +})
  197 +
  198 +watch(
  199 + () => elementId.value,
  200 + () => {
  201 + activeTab.value = 'base'
  202 + }
  203 +)
  204 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/base/ElementBaseInfo.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <el-form label-width="90px" :model="needProps" :rules="rules">
  4 + <div v-if="needProps.type == 'bpmn:Process'">
  5 + <!-- 如果是 Process 信息的时候，使用自定义表单 -->
  6 + <el-link
  7 + href="https://doc.iocoder.cn/bpm/#_3-%E6%B5%81%E7%A8%8B%E5%9B%BE%E7%A4%BA%E4%BE%8B"
  8 + type="danger"
  9 + target="_blank"
  10 + >如何实现实现会签、或签？</el-link
  11 + >
  12 + <el-form-item label="流程标识" prop="id">
  13 + <el-input
  14 + v-model="needProps.id"
  15 + placeholder="请输入流标标识"
  16 + :disabled="needProps.id !== undefined && needProps.id.length > 0"
  17 + @change="handleKeyUpdate"
  18 + />
  19 + </el-form-item>
  20 + <el-form-item label="流程名称" prop="name">
  21 + <el-input
  22 + v-model="needProps.name"
  23 + placeholder="请输入流程名称"
  24 + clearable
  25 + @change="handleNameUpdate"
  26 + />
  27 + </el-form-item>
  28 + </div>
  29 + <div v-else>
  30 + <el-form-item label="ID">
  31 + <el-input v-model="elementBaseInfo.id" clearable @change="updateBaseInfo('id')" />
  32 + </el-form-item>
  33 + <el-form-item label="名称">
  34 + <el-input v-model="elementBaseInfo.name" clearable @change="updateBaseInfo('name')" />
  35 + </el-form-item>
  36 + </div>
  37 + </el-form>
  38 + </div>
  39 +</template>
  40 +<script setup lang="ts" name="ElementBaseInfo">
  41 +import { ref, reactive, watch, onMounted, onBeforeUnmount, toRaw } from 'vue'
  42 +import { ElLink, ElForm, ElFormItem, ElInput } from 'element-plus'
  43 +const props = defineProps({
  44 + businessObject: Object,
  45 + model: Object // 流程模型的数据
  46 +})
  47 +const needProps = ref({})
  48 +const bpmnElement = ref()
  49 +const elementBaseInfo = ref({})
  50 +// 流程表单的下拉框的数据
  51 +// const forms = ref([])
  52 +// 流程模型的校验
  53 +const rules = reactive({
  54 + id: [{ required: true, message: '流程标识不能为空', trigger: 'blur' }],
  55 + name: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }]
  56 +})
  57 +
  58 +const resetBaseInfo = () => {
  59 + console.log(window, 'window')
  60 + console.log(bpmnElement.value, 'bpmnElement')
  61 +
  62 + bpmnElement.value = window?.bpmnInstances?.bpmnElement
  63 + console.log(bpmnElement.value, 'resetBaseInfo11111111111')
  64 + elementBaseInfo.value = bpmnElement.value.businessObject
  65 + needProps.value['type'] = bpmnElement.value.businessObject.$type
  66 + // elementBaseInfo.value['typess'] = bpmnElement.value.businessObject.$type
  67 +
  68 + // elementBaseInfo.value = JSON.parse(JSON.stringify(bpmnElement.value.businessObject))
  69 + console.log(elementBaseInfo.value, 'elementBaseInfo22222222222')
  70 +}
  71 +const handleKeyUpdate = (value) => {
  72 + // 校验 value 的值，只有 XML NCName 通过的情况下，才进行赋值。否则，会导致流程图报错，无法绘制的问题
  73 + if (!value) {
  74 + return
  75 + }
  76 + if (!value.match(/[a-zA-Z_][\-_.0-9a-zA-Z$]*/)) {
  77 + console.log('key 不满足 XML NCName 规则，所以不进行赋值')
  78 + return
  79 + }
  80 + console.log('key 满足 XML NCName 规则，所以进行赋值')
  81 +
  82 + // 在 BPMN 的 XML 中，流程标识 key，其实对应的是 id 节点
  83 + elementBaseInfo.value['id'] = value
  84 +
  85 + setTimeout(() => {
  86 + updateBaseInfo('id')
  87 + }, 100)
  88 +}
  89 +const handleNameUpdate = (value) => {
  90 + console.log(elementBaseInfo, 'elementBaseInfo')
  91 + if (!value) {
  92 + return
  93 + }
  94 + elementBaseInfo.value['name'] = value
  95 +
  96 + setTimeout(() => {
  97 + updateBaseInfo('name')
  98 + }, 100)
  99 +}
  100 +// const handleDescriptionUpdate=(value)=> {
  101 +// TODO 芋艿：documentation 暂时无法修改，后续在看看
  102 +// this.elementBaseInfo['documentation'] = value;
  103 +// this.updateBaseInfo('documentation');
  104 +// }
  105 +const updateBaseInfo = (key) => {
  106 + console.log(key, 'key')
  107 + // 触发 elementBaseInfo 对应的字段
  108 + const attrObj = Object.create(null)
  109 + // console.log(attrObj, 'attrObj')
  110 + attrObj[key] = elementBaseInfo.value[key]
  111 + // console.log(attrObj, 'attrObj111')
  112 + // const attrObj = {
  113 + // id: elementBaseInfo.value[key]
  114 + // // di: { id: `${elementBaseInfo.value[key]}_di` }
  115 + // }
  116 + console.log(elementBaseInfo, 'elementBaseInfo11111111111')
  117 + needProps.value = { ...elementBaseInfo.value, ...needProps.value }
  118 +
  119 + if (key === 'id') {
  120 + console.log('jinru')
  121 + console.log(window, 'window')
  122 + console.log(bpmnElement.value, 'bpmnElement')
  123 + console.log(toRaw(bpmnElement.value), 'bpmnElement')
  124 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  125 + id: elementBaseInfo.value[key],
  126 + di: { id: `${elementBaseInfo.value[key]}_di` }
  127 + })
  128 + } else {
  129 + console.log(attrObj, 'attrObj')
  130 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), attrObj)
  131 + }
  132 +}
  133 +onMounted(() => {
  134 + // 针对上传的 bpmn 流程图时，需要延迟 1 秒的时间，保证 key 和 name 的更新
  135 + setTimeout(() => {
  136 + console.log(props.model, 'props.model')
  137 + handleKeyUpdate(props.model.key)
  138 + handleNameUpdate(props.model.name)
  139 + console.log(props, 'propsssssssssssssssssssss')
  140 + }, 1000)
  141 +})
  142 +
  143 +watch(
  144 + () => props.businessObject,
  145 + (val) => {
  146 + console.log(val, 'val11111111111111111111')
  147 + if (val) {
  148 + // nextTick(() => {
  149 + resetBaseInfo()
  150 + // })
  151 + }
  152 + }
  153 +)
  154 +// watch(
  155 +// () => ({ ...props }),
  156 +// (oldVal, newVal) => {
  157 +// console.log(oldVal, 'oldVal')
  158 +// console.log(newVal, 'newVal')
  159 +// if (newVal) {
  160 +// needProps.value = newVal
  161 +// }
  162 +// },
  163 +// {
  164 +// immediate: true
  165 +// }
  166 +// )
  167 +// 'model.key': {
  168 +// immediate: false,
  169 +// handler: function (val) {
  170 +// this.handleKeyUpdate(val)
  171 +// }
  172 +// }
  173 +onBeforeUnmount(() => {
  174 + bpmnElement.value = null
  175 +})
  176 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/flow-condition/FlowCondition.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <el-form :model="flowConditionForm" label-width="90px" size="small">
  4 + <el-form-item label="流转类型">
  5 + <el-select v-model="flowConditionForm.type" @change="updateFlowType">
  6 + <el-option label="普通流转路径" value="normal" />
  7 + <el-option label="默认流转路径" value="default" />
  8 + <el-option label="条件流转路径" value="condition" />
  9 + </el-select>
  10 + </el-form-item>
  11 + <el-form-item label="条件格式" v-if="flowConditionForm.type === 'condition'" key="condition">
  12 + <el-select v-model="flowConditionForm.conditionType">
  13 + <el-option label="表达式" value="expression" />
  14 + <el-option label="脚本" value="script" />
  15 + </el-select>
  16 + </el-form-item>
  17 + <el-form-item
  18 + label="表达式"
  19 + v-if="flowConditionForm.conditionType && flowConditionForm.conditionType === 'expression'"
  20 + key="express"
  21 + >
  22 + <el-input
  23 + v-model="flowConditionForm.body"
  24 + style="width: 192px"
  25 + clearable
  26 + @change="updateFlowCondition"
  27 + />
  28 + </el-form-item>
  29 + <template
  30 + v-if="flowConditionForm.conditionType && flowConditionForm.conditionType === 'script'"
  31 + >
  32 + <el-form-item label="脚本语言" key="language">
  33 + <el-input v-model="flowConditionForm.language" clearable @change="updateFlowCondition" />
  34 + </el-form-item>
  35 + <el-form-item label="脚本类型" key="scriptType">
  36 + <el-select v-model="flowConditionForm.scriptType">
  37 + <el-option label="内联脚本" value="inlineScript" />
  38 + <el-option label="外部脚本" value="externalScript" />
  39 + </el-select>
  40 + </el-form-item>
  41 + <el-form-item
  42 + label="脚本"
  43 + v-if="flowConditionForm.scriptType === 'inlineScript'"
  44 + key="body"
  45 + >
  46 + <el-input
  47 + v-model="flowConditionForm.body"
  48 + type="textarea"
  49 + clearable
  50 + @change="updateFlowCondition"
  51 + />
  52 + </el-form-item>
  53 + <el-form-item
  54 + label="资源地址"
  55 + v-if="flowConditionForm.scriptType === 'externalScript'"
  56 + key="resource"
  57 + >
  58 + <el-input v-model="flowConditionForm.resource" clearable @change="updateFlowCondition" />
  59 + </el-form-item>
  60 + </template>
  61 + </el-form>
  62 + </div>
  63 +</template>
  64 +
  65 +<script setup lang="ts" name="FlowCondition">
  66 +import { ref, nextTick, watch, onBeforeUnmount, toRaw } from 'vue'
  67 +import { ElSelect, ElForm, ElFormItem, ElInput, ElOption } from 'element-plus'
  68 +
  69 +const props = defineProps({
  70 + businessObject: Object,
  71 + type: String
  72 +})
  73 +const flowConditionForm = ref({})
  74 +const bpmnElement = ref()
  75 +const bpmnElementSource = ref()
  76 +const bpmnElementSourceRef = ref()
  77 +const flowConditionRef = ref()
  78 +const resetFlowCondition = () => {
  79 + bpmnElement.value = window.bpmnInstances.bpmnElement
  80 + bpmnElementSource.value = bpmnElement.value.source
  81 + bpmnElementSourceRef.value = bpmnElement.value.businessObject.sourceRef
  82 + if (
  83 + bpmnElementSourceRef.value &&
  84 + bpmnElementSourceRef.value.default &&
  85 + bpmnElementSourceRef.value.default.id === this.bpmnElement.id
  86 + ) {
  87 + // 默认
  88 + flowConditionForm.value = { type: 'default' }
  89 + } else if (!bpmnElement.value.businessObject.conditionExpression) {
  90 + // 普通
  91 + flowConditionForm.value = { type: 'normal' }
  92 + } else {
  93 + // 带条件
  94 + const conditionExpression = bpmnElement.value.businessObject.conditionExpression
  95 + flowConditionForm.value = { ...conditionExpression, type: 'condition' }
  96 + // resource 可直接标识 是否是外部资源脚本
  97 + if (flowConditionForm.value.resource) {
  98 + // this.$set(this.flowConditionForm, "conditionType", "script");
  99 + // this.$set(this.flowConditionForm, "scriptType", "externalScript");
  100 + flowConditionForm.value['conditionType'] = 'script'
  101 + flowConditionForm.value['scriptType'] = 'externalScript'
  102 + return
  103 + }
  104 + if (conditionExpression.language) {
  105 + // this.$set(this.flowConditionForm, "conditionType", "script");
  106 + // this.$set(this.flowConditionForm, "scriptType", "inlineScript");
  107 + flowConditionForm.value['conditionType'] = 'script'
  108 + flowConditionForm.value['scriptType'] = 'inlineScript'
  109 +
  110 + return
  111 + }
  112 + // this.$set(this.flowConditionForm, "conditionType", "expression");
  113 + flowConditionForm.value['conditionType'] = 'expression'
  114 + }
  115 +}
  116 +const updateFlowType = (flowType) => {
  117 + // 正常条件类
  118 + if (flowType === 'condition') {
  119 + flowConditionRef.value = window.bpmnInstances.moddle.create('bpmn:FormalExpression')
  120 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  121 + conditionExpression: flowConditionRef.value
  122 + })
  123 + return
  124 + }
  125 + // 默认路径
  126 + if (flowType === 'default') {
  127 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  128 + conditionExpression: null
  129 + })
  130 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElementSource.value), {
  131 + default: bpmnElement.value
  132 + })
  133 + return
  134 + }
  135 + // 正常路径，如果来源节点的默认路径是当前连线时，清除父元素的默认路径配置
  136 + if (
  137 + bpmnElementSourceRef.value.default &&
  138 + bpmnElementSourceRef.value.default.id === bpmnElement.value.id
  139 + ) {
  140 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElementSource.value), {
  141 + default: null
  142 + })
  143 + }
  144 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  145 + conditionExpression: null
  146 + })
  147 +}
  148 +const updateFlowCondition = () => {
  149 + let { conditionType, scriptType, body, resource, language } = flowConditionForm.value
  150 + let condition
  151 + if (conditionType === 'expression') {
  152 + condition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', { body })
  153 + } else {
  154 + if (scriptType === 'inlineScript') {
  155 + condition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', { body, language })
  156 + // this.$set(this.flowConditionForm, "resource", "");
  157 + flowConditionForm.value['resource'] = ''
  158 + } else {
  159 + // this.$set(this.flowConditionForm, "body", "");
  160 + flowConditionForm.value['body'] = ''
  161 + condition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', {
  162 + resource,
  163 + language
  164 + })
  165 + }
  166 + }
  167 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  168 + conditionExpression: condition
  169 + })
  170 +}
  171 +
  172 +onBeforeUnmount(() => {
  173 + bpmnElement.value = null
  174 + bpmnElementSource.value = null
  175 + bpmnElementSourceRef.value = null
  176 +})
  177 +
  178 +watch(
  179 + () => props.businessObject,
  180 + (val) => {
  181 + if (val) {
  182 + nextTick(() => {
  183 + resetFlowCondition()
  184 + })
  185 + }
  186 + }
  187 +)
  188 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/form/ElementForm.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <el-form label-width="80px">
  4 + <el-form-item label="表单标识">
  5 + <el-input v-model="formKey" clearable @change="updateElementFormKey" />
  6 + </el-form-item>
  7 + <el-form-item label="业务标识">
  8 + <el-select v-model="businessKey" @change="updateElementBusinessKey">
  9 + <el-option v-for="i in fieldList" :key="i.id" :value="i.id" :label="i.label" />
  10 + <el-option label="无" value="" />
  11 + </el-select>
  12 + </el-form-item>
  13 + </el-form>
  14 +
  15 + <!--字段列表-->
  16 + <div class="element-property list-property">
  17 + <el-divider><Icon icon="ep:coin" /> 表单字段</el-divider>
  18 + <el-table :data="fieldList" max-height="240" border fit>
  19 + <el-table-column label="序号" type="index" width="50px" />
  20 + <el-table-column label="字段名称" prop="label" min-width="80px" show-overflow-tooltip />
  21 + <el-table-column
  22 + label="字段类型"
  23 + prop="type"
  24 + min-width="80px"
  25 + :formatter="(row) => fieldType[row.type] || row.type"
  26 + show-overflow-tooltip
  27 + />
  28 + <el-table-column
  29 + label="默认值"
  30 + prop="defaultValue"
  31 + min-width="80px"
  32 + show-overflow-tooltip
  33 + />
  34 + <el-table-column label="操作" width="90px">
  35 + <template #default="scope">
  36 + <el-button type="text" @click="openFieldForm(scope, scope.$index)">编辑</el-button>
  37 + <el-divider direction="vertical" />
  38 + <el-button type="text" style="color: #ff4d4f" @click="removeField(scope, scope.$index)"
  39 + >移除</el-button
  40 + >
  41 + </template>
  42 + </el-table-column>
  43 + </el-table>
  44 + </div>
  45 + <div class="element-drawer__button">
  46 + <XButton type="primary" proIcon="ep:plus" title="添加字段" @click="openFieldForm(null, -1)" />
  47 + </div>
  48 +
  49 + <!--字段配置侧边栏-->
  50 + <el-drawer
  51 + v-model="fieldModelVisible"
  52 + title="字段配置"
  53 + :size="`${width}px`"
  54 + append-to-body
  55 + destroy-on-close
  56 + >
  57 + <el-form :model="formFieldForm" label-width="90px">
  58 + <el-form-item label="字段ID">
  59 + <el-input v-model="formFieldForm.id" clearable />
  60 + </el-form-item>
  61 + <el-form-item label="类型">
  62 + <el-select
  63 + v-model="formFieldForm.typeType"
  64 + placeholder="请选择字段类型"
  65 + clearable
  66 + @change="changeFieldTypeType"
  67 + >
  68 + <el-option v-for="(value, key) of fieldType" :label="value" :value="key" :key="key" />
  69 + </el-select>
  70 + </el-form-item>
  71 + <el-form-item label="类型名称" v-if="formFieldForm.typeType === 'custom'">
  72 + <el-input v-model="formFieldForm.type" clearable />
  73 + </el-form-item>
  74 + <el-form-item label="名称">
  75 + <el-input v-model="formFieldForm.label" clearable />
  76 + </el-form-item>
  77 + <el-form-item label="时间格式" v-if="formFieldForm.typeType === 'date'">
  78 + <el-input v-model="formFieldForm.datePattern" clearable />
  79 + </el-form-item>
  80 + <el-form-item label="默认值">
  81 + <el-input v-model="formFieldForm.defaultValue" clearable />
  82 + </el-form-item>
  83 + </el-form>
  84 +
  85 + <!-- 枚举值设置 -->
  86 + <template v-if="formFieldForm.type === 'enum'">
  87 + <el-divider key="enum-divider" />
  88 + <p class="listener-filed__title" key="enum-title">
  89 + <span><Icon icon="ep:menu" />枚举值列表：</span>
  90 + <el-button type="primary" @click="openFieldOptionForm(null, -1, 'enum')"
  91 + >添加枚举值</el-button
  92 + >
  93 + </p>
  94 + <el-table :data="fieldEnumList" key="enum-table" max-height="240" border fit>
  95 + <el-table-column label="序号" width="50px" type="index" />
  96 + <el-table-column label="枚举值编号" prop="id" min-width="100px" show-overflow-tooltip />
  97 + <el-table-column label="枚举值名称" prop="name" min-width="100px" show-overflow-tooltip />
  98 + <el-table-column label="操作" width="90px">
  99 + <template #default="scope">
  100 + <el-button type="text" @click="openFieldOptionForm(scope, scope.$index, 'enum')"
  101 + >编辑</el-button
  102 + >
  103 + <el-divider direction="vertical" />
  104 + <el-button
  105 + type="text"
  106 + style="color: #ff4d4f"
  107 + @click="removeFieldOptionItem(scope, scope.$index, 'enum')"
  108 + >移除</el-button
  109 + >
  110 + </template>
  111 + </el-table-column>
  112 + </el-table>
  113 + </template>
  114 +
  115 + <!-- 校验规则 -->
  116 + <el-divider key="validation-divider" />
  117 + <p class="listener-filed__title" key="validation-title">
  118 + <span><Icon icon="ep:menu" />约束条件列表：</span>
  119 + <el-button type="primary" @click="openFieldOptionForm(null, -1, 'constraint')"
  120 + >添加约束</el-button
  121 + >
  122 + </p>
  123 + <el-table :data="fieldConstraintsList" key="validation-table" max-height="240" border fit>
  124 + <el-table-column label="序号" width="50px" type="index" />
  125 + <el-table-column label="约束名称" prop="name" min-width="100px" show-overflow-tooltip />
  126 + <el-table-column label="约束配置" prop="config" min-width="100px" show-overflow-tooltip />
  127 + <el-table-column label="操作" width="90px">
  128 + <template #default="scope">
  129 + <el-button type="text" @click="openFieldOptionForm(scope, scope.$index, 'constraint')"
  130 + >编辑</el-button
  131 + >
  132 + <el-divider direction="vertical" />
  133 + <el-button
  134 + type="text"
  135 + style="color: #ff4d4f"
  136 + @click="removeFieldOptionItem(scope, scope.$index, 'constraint')"
  137 + >移除</el-button
  138 + >
  139 + </template>
  140 + </el-table-column>
  141 + </el-table>
  142 +
  143 + <!-- 表单属性 -->
  144 + <el-divider key="property-divider" />
  145 + <p class="listener-filed__title" key="property-title">
  146 + <span><Icon icon="ep:menu" />字段属性列表：</span>
  147 + <el-button type="primary" @click="openFieldOptionForm(null, -1, 'property')"
  148 + >添加属性</el-button
  149 + >
  150 + </p>
  151 + <el-table :data="fieldPropertiesList" key="property-table" max-height="240" border fit>
  152 + <el-table-column label="序号" width="50px" type="index" />
  153 + <el-table-column label="属性编号" prop="id" min-width="100px" show-overflow-tooltip />
  154 + <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />
  155 + <el-table-column label="操作" width="90px">
  156 + <template #default="scope">
  157 + <el-button type="text" @click="openFieldOptionForm(scope, scope.$index, 'property')"
  158 + >编辑</el-button
  159 + >
  160 + <el-divider direction="vertical" />
  161 + <el-button
  162 + type="text"
  163 + style="color: #ff4d4f"
  164 + @click="removeFieldOptionItem(scope, scope.$index, 'property')"
  165 + >移除</el-button
  166 + >
  167 + </template>
  168 + </el-table-column>
  169 + </el-table>
  170 +
  171 + <!-- 底部按钮 -->
  172 + <div class="element-drawer__button">
  173 + <el-button>取 消</el-button>
  174 + <el-button type="primary" @click="saveField">保 存</el-button>
  175 + </div>
  176 + </el-drawer>
  177 +
  178 + <el-dialog
  179 + v-model="fieldOptionModelVisible"
  180 + :title="optionModelTitle"
  181 + width="600px"
  182 + append-to-body
  183 + destroy-on-close
  184 + >
  185 + <el-form :model="fieldOptionForm" label-width="96px">
  186 + <el-form-item label="编号/ID" v-if="fieldOptionType !== 'constraint'" key="option-id">
  187 + <el-input v-model="fieldOptionForm.id" clearable />
  188 + </el-form-item>
  189 + <el-form-item label="名称" v-if="fieldOptionType !== 'property'" key="option-name">
  190 + <el-input v-model="fieldOptionForm.name" clearable />
  191 + </el-form-item>
  192 + <el-form-item label="配置" v-if="fieldOptionType === 'constraint'" key="option-config">
  193 + <el-input v-model="fieldOptionForm.config" clearable />
  194 + </el-form-item>
  195 + <el-form-item label="值" v-if="fieldOptionType === 'property'" key="option-value">
  196 + <el-input v-model="fieldOptionForm.value" clearable />
  197 + </el-form-item>
  198 + </el-form>
  199 + <template #footer>
  200 + <el-button @click="fieldOptionModelVisible = false">取 消</el-button>
  201 + <el-button type="primary" @click="saveFieldOption">确 定</el-button>
  202 + </template>
  203 + </el-dialog>
  204 + </div>
  205 +</template>
  206 +
  207 +<script setup lang="ts" name="ElementForm">
  208 +import { ref, inject, watch, nextTick, toRaw } from 'vue'
  209 +import {
  210 + ElDialog,
  211 + ElForm,
  212 + ElFormItem,
  213 + ElSelect,
  214 + ElOption,
  215 + ElDivider,
  216 + ElTable,
  217 + ElTableColumn,
  218 + ElButton,
  219 + ElDrawer,
  220 + ElInput
  221 +} from 'element-plus'
  222 +const props = defineProps({
  223 + id: String,
  224 + type: String
  225 +})
  226 +const prefix = inject('prefix')
  227 +const width = inject('width')
  228 +
  229 +const formKey = ref('')
  230 +const businessKey = ref('')
  231 +const optionModelTitle = ref('')
  232 +const fieldList = ref([])
  233 +const formFieldForm = ref({})
  234 +const fieldType = ref({
  235 + long: '长整型',
  236 + string: '字符串',
  237 + boolean: '布尔类',
  238 + date: '日期类',
  239 + enum: '枚举类',
  240 + custom: '自定义类型'
  241 +})
  242 +const formFieldIndex = ref(-1) // 编辑中的字段， -1 为新增
  243 +const formFieldOptionIndex = ref(-1) // 编辑中的字段配置项， -1 为新增
  244 +const fieldModelVisible = ref(false)
  245 +const fieldOptionModelVisible = ref(false)
  246 +const fieldOptionForm = ref({}) // 当前激活的字段配置项数据
  247 +const fieldOptionType = ref('') // 当前激活的字段配置项弹窗 类型
  248 +const fieldEnumList = ref([]) // 枚举值列表
  249 +const fieldConstraintsList = ref([]) // 约束条件列表
  250 +const fieldPropertiesList = ref([]) // 绑定属性列表
  251 +const bpmnELement = ref()
  252 +const elExtensionElements = ref()
  253 +const formData = ref()
  254 +const otherExtensions = ref()
  255 +
  256 +const resetFormList = () => {
  257 + bpmnELement.value = window.bpmnInstances.bpmnElement
  258 + formKey.value = bpmnELement.value.businessObject.formKey
  259 + // 获取元素扩展属性 或者 创建扩展属性
  260 + elExtensionElements.value =
  261 + bpmnELement.value.businessObject.get('extensionElements') ||
  262 + window.bpmnInstances.moddle.create('bpmn:ExtensionElements', { values: [] })
  263 + // 获取元素表单配置 或者 创建新的表单配置
  264 + formData.value =
  265 + elExtensionElements.value.values.filter((ex) => ex.$type === `${prefix}:FormData`)?.[0] ||
  266 + window.bpmnInstances.moddle.create(`${prefix}:FormData`, { fields: [] })
  267 +
  268 + // 业务标识 businessKey， 绑定在 formData 中
  269 + businessKey.value = formData.value.businessKey
  270 +
  271 + // 保留剩余扩展元素，便于后面更新该元素对应属性
  272 + otherExtensions.value = elExtensionElements.value.values.filter(
  273 + (ex) => ex.$type !== `${prefix}:FormData`
  274 + )
  275 +
  276 + // 复制原始值，填充表格
  277 + fieldList.value = JSON.parse(JSON.stringify(formData.value.fields || []))
  278 +
  279 + // 更新元素扩展属性，避免后续报错
  280 + updateElementExtensions()
  281 +}
  282 +const updateElementFormKey = () => {
  283 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnELement.value), {
  284 + formKey: formKey.value
  285 + })
  286 +}
  287 +const updateElementBusinessKey = () => {
  288 + window.bpmnInstances.modeling.updateModdleProperties(toRaw(bpmnELement.value), formData.value, {
  289 + businessKey: businessKey.value
  290 + })
  291 +}
  292 +// 根据类型调整字段type
  293 +const changeFieldTypeType = (type) => {
  294 + // this.$set(this.formFieldForm, "type", type === "custom" ? "" : type);
  295 + formFieldForm.value['type'] = type === 'custom' ? '' : type
  296 +}
  297 +
  298 +// 打开字段详情侧边栏
  299 +const openFieldForm = (field, index) => {
  300 + formFieldIndex.value = index
  301 + if (index !== -1) {
  302 + const FieldObject = formData.value.fields[index]
  303 + formFieldForm.value = JSON.parse(JSON.stringify(field))
  304 + // 设置自定义类型
  305 + // this.$set(this.formFieldForm, "typeType", !this.fieldType[field.type] ? "custom" : field.type);
  306 + formFieldForm.value['typeType'] = !fieldType.value[field.type] ? 'custom' : field.type
  307 + // 初始化枚举值列表
  308 + field.type === 'enum' &&
  309 + (fieldEnumList.value = JSON.parse(JSON.stringify(FieldObject?.values || [])))
  310 + // 初始化约束条件列表
  311 + fieldConstraintsList.value = JSON.parse(
  312 + JSON.stringify(FieldObject?.validation?.constraints || [])
  313 + )
  314 + // 初始化自定义属性列表
  315 + fieldPropertiesList.value = JSON.parse(JSON.stringify(FieldObject?.properties?.values || []))
  316 + } else {
  317 + formFieldForm.value = {}
  318 + // 初始化枚举值列表
  319 + fieldEnumList.value = []
  320 + // 初始化约束条件列表
  321 + fieldConstraintsList.value = []
  322 + // 初始化自定义属性列表
  323 + fieldPropertiesList.value = []
  324 + }
  325 + fieldModelVisible.value = true
  326 +}
  327 +// 打开字段 某个 配置项 弹窗
  328 +const openFieldOptionForm = (option, index, type) => {
  329 + fieldOptionModelVisible.value = true
  330 + fieldOptionType.value = type
  331 + formFieldOptionIndex.value = index
  332 + if (type === 'property') {
  333 + fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
  334 + return (optionModelTitle.value = '属性配置')
  335 + }
  336 + if (type === 'enum') {
  337 + fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
  338 + return (optionModelTitle.value = '枚举值配置')
  339 + }
  340 + fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
  341 + return (optionModelTitle.value = '约束条件配置')
  342 +}
  343 +
  344 +// 保存字段 某个 配置项
  345 +const saveFieldOption = () => {
  346 + if (formFieldOptionIndex.value === -1) {
  347 + if (fieldOptionType.value === 'property') {
  348 + fieldPropertiesList.value.push(fieldOptionForm.value)
  349 + }
  350 + if (fieldOptionType.value === 'constraint') {
  351 + fieldConstraintsList.value.push(fieldOptionForm.value)
  352 + }
  353 + if (fieldOptionType.value === 'enum') {
  354 + fieldEnumList.value.push(fieldOptionForm.value)
  355 + }
  356 + } else {
  357 + fieldOptionType.value === 'property' &&
  358 + fieldPropertiesList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
  359 + fieldOptionType.value === 'constraint' &&
  360 + fieldConstraintsList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
  361 + fieldOptionType.value === 'enum' &&
  362 + fieldEnumList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
  363 + }
  364 + fieldOptionModelVisible.value = false
  365 + fieldOptionForm.value = {}
  366 +}
  367 +// 保存字段配置
  368 +const saveField = () => {
  369 + const { id, type, label, defaultValue, datePattern } = formFieldForm.value
  370 + const Field = window.bpmnInstances.moddle.create(`${prefix}:FormField`, { id, type, label })
  371 + defaultValue && (Field.defaultValue = defaultValue)
  372 + datePattern && (Field.datePattern = datePattern)
  373 + // 构建属性
  374 + if (fieldPropertiesList.value && fieldPropertiesList.value.length) {
  375 + const fieldPropertyList = fieldPropertiesList.value.map((fp) => {
  376 + return window.bpmnInstances.moddle.create(`${prefix}:Property`, {
  377 + id: fp.id,
  378 + value: fp.value
  379 + })
  380 + })
  381 + Field.properties = window.bpmnInstances.moddle.create(`${this.prefix}:Properties`, {
  382 + values: fieldPropertyList
  383 + })
  384 + }
  385 + // 构建校验规则
  386 + if (fieldConstraintsList.value && fieldConstraintsList.value.length) {
  387 + const fieldConstraintList = fieldConstraintsList.value.map((fc) => {
  388 + return window.bpmnInstances.moddle.create(`${prefix}:Constraint`, {
  389 + name: fc.name,
  390 + config: fc.config
  391 + })
  392 + })
  393 + Field.validation = window.bpmnInstances.moddle.create(`${prefix}:Validation`, {
  394 + constraints: fieldConstraintList
  395 + })
  396 + }
  397 + // 构建枚举值
  398 + if (fieldEnumList.value && fieldEnumList.value.length) {
  399 + Field.values = fieldEnumList.value.map((fe) => {
  400 + return window.bpmnInstances.moddle.create(`${prefix}:Value`, { name: fe.name, id: fe.id })
  401 + })
  402 + }
  403 + // 更新数组 与 表单配置实例
  404 + if (formFieldIndex.value === -1) {
  405 + fieldList.value.push(formFieldForm.value)
  406 + formData.value.fields.push(Field)
  407 + } else {
  408 + fieldList.value.splice(formFieldIndex.value, 1, formFieldForm.value)
  409 + formData.value.fields.splice(formFieldIndex.value, 1, Field)
  410 + }
  411 + updateElementExtensions()
  412 + fieldModelVisible.value = false
  413 +}
  414 +
  415 +// 移除某个 字段的 配置项
  416 +const removeFieldOptionItem = (option, index, type) => {
  417 + console.log(option, 'option')
  418 + if (type === 'property') {
  419 + fieldPropertiesList.value.splice(index, 1)
  420 + return
  421 + }
  422 + if (type === 'enum') {
  423 + fieldEnumList.value.splice(index, 1)
  424 + return
  425 + }
  426 + fieldConstraintsList.value.splice(index, 1)
  427 +}
  428 +// 移除 字段
  429 +const removeField = (field, index) => {
  430 + console.log(field, 'field')
  431 + fieldList.value.splice(index, 1)
  432 + formData.value.fields.splice(index, 1)
  433 + updateElementExtensions()
  434 +}
  435 +
  436 +const updateElementExtensions = () => {
  437 + // 更新回扩展元素
  438 + const newElExtensionElements = window.bpmnInstances.moddle.create(`bpmn:ExtensionElements`, {
  439 + values: otherExtensions.value.concat(formData.value)
  440 + })
  441 + // 更新到元素上
  442 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnELement.value), {
  443 + extensionElements: newElExtensionElements
  444 + })
  445 +}
  446 +
  447 +watch(
  448 + () => props.id,
  449 + (val) => {
  450 + val &&
  451 + val.length &&
  452 + nextTick(() => {
  453 + resetFormList()
  454 + })
  455 + },
  456 + { immediate: true }
  457 +)
  458 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/index.js 0 → 100644
  View file @5bedff6
  1 +import MyPropertiesPanel from "./PropertiesPanel.vue";
  2 +
  3 +MyPropertiesPanel.install = function(Vue) {
  4 + Vue.component(MyPropertiesPanel.name, MyPropertiesPanel);
  5 +};
  6 +
  7 +export default MyPropertiesPanel;
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/listeners/ElementListeners.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <el-table :data="elementListenersList" size="small" border>
  4 + <el-table-column label="序号" width="50px" type="index" />
  5 + <el-table-column label="事件类型" min-width="100px" prop="event" />
  6 + <el-table-column
  7 + label="监听器类型"
  8 + min-width="100px"
  9 + show-overflow-tooltip
  10 + :formatter="(row) => listenerTypeObject[row.listenerType]"
  11 + />
  12 + <el-table-column label="操作" width="100px">
  13 + <template #default="scope">
  14 + <el-button size="small" link @click="openListenerForm(scope.row, scope.$index)"
  15 + >编辑</el-button
  16 + >
  17 + <el-divider direction="vertical" />
  18 + <el-button
  19 + size="small"
  20 + link
  21 + style="color: #ff4d4f"
  22 + @click="removeListener(scope.row, scope.$index)"
  23 + >移除</el-button
  24 + >
  25 + </template>
  26 + </el-table-column>
  27 + </el-table>
  28 + <div class="element-drawer__button">
  29 + <XButton
  30 + type="primary"
  31 + preIcon="ep:plus"
  32 + title="添加监听器"
  33 + @click="openListenerForm(null)"
  34 + />
  35 + </div>
  36 +
  37 + <!-- 监听器 编辑/创建 部分 -->
  38 + <el-drawer
  39 + v-model="listenerFormModelVisible"
  40 + title="执行监听器"
  41 + :size="`${width}px`"
  42 + append-to-body
  43 + destroy-on-close
  44 + >
  45 + <el-form :model="listenerForm" label-width="96px" ref="listenerFormRef">
  46 + <el-form-item
  47 + label="事件类型"
  48 + prop="event"
  49 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  50 + >
  51 + <el-select v-model="listenerForm.event">
  52 + <el-option label="start" value="start" />
  53 + <el-option label="end" value="end" />
  54 + </el-select>
  55 + </el-form-item>
  56 + <el-form-item
  57 + label="监听器类型"
  58 + prop="listenerType"
  59 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  60 + >
  61 + <el-select v-model="listenerForm.listenerType">
  62 + <el-option
  63 + v-for="i in Object.keys(listenerTypeObject)"
  64 + :key="i"
  65 + :label="listenerTypeObject[i]"
  66 + :value="i"
  67 + />
  68 + </el-select>
  69 + </el-form-item>
  70 + <el-form-item
  71 + v-if="listenerForm.listenerType === 'classListener'"
  72 + label="Java类"
  73 + prop="class"
  74 + key="listener-class"
  75 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  76 + >
  77 + <el-input v-model="listenerForm.class" clearable />
  78 + </el-form-item>
  79 + <el-form-item
  80 + v-if="listenerForm.listenerType === 'expressionListener'"
  81 + label="表达式"
  82 + prop="expression"
  83 + key="listener-expression"
  84 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  85 + >
  86 + <el-input v-model="listenerForm.expression" clearable />
  87 + </el-form-item>
  88 + <el-form-item
  89 + v-if="listenerForm.listenerType === 'delegateExpressionListener'"
  90 + label="代理表达式"
  91 + prop="delegateExpression"
  92 + key="listener-delegate"
  93 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  94 + >
  95 + <el-input v-model="listenerForm.delegateExpression" clearable />
  96 + </el-form-item>
  97 + <template v-if="listenerForm.listenerType === 'scriptListener'">
  98 + <el-form-item
  99 + label="脚本格式"
  100 + prop="scriptFormat"
  101 + key="listener-script-format"
  102 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写脚本格式' }"
  103 + >
  104 + <el-input v-model="listenerForm.scriptFormat" clearable />
  105 + </el-form-item>
  106 + <el-form-item
  107 + label="脚本类型"
  108 + prop="scriptType"
  109 + key="listener-script-type"
  110 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请选择脚本类型' }"
  111 + >
  112 + <el-select v-model="listenerForm.scriptType">
  113 + <el-option label="内联脚本" value="inlineScript" />
  114 + <el-option label="外部脚本" value="externalScript" />
  115 + </el-select>
  116 + </el-form-item>
  117 + <el-form-item
  118 + v-if="listenerForm.scriptType === 'inlineScript'"
  119 + label="脚本内容"
  120 + prop="value"
  121 + key="listener-script"
  122 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写脚本内容' }"
  123 + >
  124 + <el-input v-model="listenerForm.value" clearable />
  125 + </el-form-item>
  126 + <el-form-item
  127 + v-if="listenerForm.scriptType === 'externalScript'"
  128 + label="资源地址"
  129 + prop="resource"
  130 + key="listener-resource"
  131 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写资源地址' }"
  132 + >
  133 + <el-input v-model="listenerForm.resource" clearable />
  134 + </el-form-item>
  135 + </template>
  136 + </el-form>
  137 + <el-divider />
  138 + <p class="listener-filed__title">
  139 + <span><Icon icon="ep:menu" />注入字段：</span>
  140 + <XButton type="primary" @click="openListenerFieldForm(null)" title="添加字段" />
  141 + </p>
  142 + <el-table
  143 + :data="fieldsListOfListener"
  144 + size="small"
  145 + max-height="240"
  146 + border
  147 + fit
  148 + style="flex: none"
  149 + >
  150 + <el-table-column label="序号" width="50px" type="index" />
  151 + <el-table-column label="字段名称" min-width="100px" prop="name" />
  152 + <el-table-column
  153 + label="字段类型"
  154 + min-width="80px"
  155 + show-overflow-tooltip
  156 + :formatter="(row) => fieldTypeObject[row.fieldType]"
  157 + />
  158 + <el-table-column
  159 + label="字段值/表达式"
  160 + min-width="100px"
  161 + show-overflow-tooltip
  162 + :formatter="(row) => row.string || row.expression"
  163 + />
  164 + <el-table-column label="操作" width="130px">
  165 + <template #default="scope">
  166 + <el-button size="small" link @click="openListenerFieldForm(scope.row, scope.$index)"
  167 + >编辑</el-button
  168 + >
  169 + <el-divider direction="vertical" />
  170 + <el-button
  171 + size="small"
  172 + link
  173 + style="color: #ff4d4f"
  174 + @click="removeListenerField(scope.row, scope.$index)"
  175 + >移除</el-button
  176 + >
  177 + </template>
  178 + </el-table-column>
  179 + </el-table>
  180 +
  181 + <div class="element-drawer__button">
  182 + <el-button @click="listenerFormModelVisible = false">取 消</el-button>
  183 + <el-button type="primary" @click="saveListenerConfig">保 存</el-button>
  184 + </div>
  185 + </el-drawer>
  186 +
  187 + <!-- 注入西段 编辑/创建 部分 -->
  188 + <el-dialog
  189 + title="字段配置"
  190 + v-model="listenerFieldFormModelVisible"
  191 + width="600px"
  192 + append-to-body
  193 + destroy-on-close
  194 + >
  195 + <el-form
  196 + :model="listenerFieldForm"
  197 + label-width="96spx"
  198 + ref="listenerFieldFormRef"
  199 + style="height: 136px"
  200 + >
  201 + <el-form-item
  202 + label="字段名称："
  203 + prop="name"
  204 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  205 + >
  206 + <el-input v-model="listenerFieldForm.name" clearable />
  207 + </el-form-item>
  208 + <el-form-item
  209 + label="字段类型："
  210 + prop="fieldType"
  211 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  212 + >
  213 + <el-select v-model="listenerFieldForm.fieldType">
  214 + <el-option
  215 + v-for="i in Object.keys(fieldTypeObject)"
  216 + :key="i"
  217 + :label="fieldTypeObject[i]"
  218 + :value="i"
  219 + />
  220 + </el-select>
  221 + </el-form-item>
  222 + <el-form-item
  223 + v-if="listenerFieldForm.fieldType === 'string'"
  224 + label="字段值："
  225 + prop="string"
  226 + key="field-string"
  227 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  228 + >
  229 + <el-input v-model="listenerFieldForm.string" clearable />
  230 + </el-form-item>
  231 + <el-form-item
  232 + v-if="listenerFieldForm.fieldType === 'expression'"
  233 + label="表达式："
  234 + prop="expression"
  235 + key="field-expression"
  236 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  237 + >
  238 + <el-input v-model="listenerFieldForm.expression" clearable />
  239 + </el-form-item>
  240 + </el-form>
  241 + <template #footer>
  242 + <el-button size="small" @click="listenerFieldFormModelVisible = false">取 消</el-button>
  243 + <el-button size="small" type="primary" @click="saveListenerFiled">确 定</el-button>
  244 + </template>
  245 + </el-dialog>
  246 + </div>
  247 +</template>
  248 +<script setup lang="ts" name="ElementListeners">
  249 +import { ref, inject, watch, nextTick } from 'vue'
  250 +import {
  251 + ElMessageBox,
  252 + ElTable,
  253 + ElTableColumn,
  254 + ElDivider,
  255 + ElOption,
  256 + ElSelect,
  257 + ElInput,
  258 + ElDrawer,
  259 + ElDialog,
  260 + ElForm,
  261 + ElFormItem
  262 +} from 'element-plus'
  263 +import { createListenerObject, updateElementExtensions } from '../../utils'
  264 +import { initListenerType, initListenerForm, listenerType, fieldType } from './utilSelf'
  265 +const props = defineProps({
  266 + id: String,
  267 + type: String
  268 +})
  269 +const prefix = inject('prefix')
  270 +const width = inject('width')
  271 +const elementListenersList = ref([]) // 监听器列表
  272 +const listenerForm = ref({}) // 监听器详情表单
  273 +const listenerFormModelVisible = ref(false) // 监听器 编辑 侧边栏显示状态
  274 +const fieldsListOfListener = ref([])
  275 +const listenerFieldForm = ref({}) // 监听器 注入字段 详情表单
  276 +const listenerFieldFormModelVisible = ref(false) // 监听器 注入字段表单弹窗 显示状态
  277 +const editingListenerIndex = ref(-1) // 监听器所在下标，-1 为新增
  278 +const editingListenerFieldIndex = ref(-1) // 字段所在下标，-1 为新增
  279 +const listenerTypeObject = ref(listenerType)
  280 +const fieldTypeObject = ref(fieldType)
  281 +const bpmnElement = ref()
  282 +const otherExtensionList = ref()
  283 +const bpmnElementListeners = ref()
  284 +const listenerFormRef = ref()
  285 +const listenerFieldFormRef = ref()
  286 +
  287 +const resetListenersList = () => {
  288 + bpmnElement.value = window.bpmnInstances.bpmnElement
  289 + otherExtensionList.value = []
  290 + bpmnElementListeners.value =
  291 + bpmnElement.value.businessObject?.extensionElements?.values?.filter(
  292 + (ex) => ex.$type === `${prefix}:ExecutionListener`
  293 + ) ?? []
  294 + elementListenersList.value = bpmnElementListeners.value.map((listener) =>
  295 + initListenerType(listener)
  296 + )
  297 +}
  298 +// 打开 监听器详情 侧边栏
  299 +const openListenerForm = (listener, index) => {
  300 + if (listener) {
  301 + listenerForm.value = initListenerForm(listener)
  302 + editingListenerIndex.value = index
  303 + } else {
  304 + listenerForm.value = {}
  305 + editingListenerIndex.value = -1 // 标记为新增
  306 + }
  307 + if (listener && listener.fields) {
  308 + fieldsListOfListener.value = listener.fields.map((field) => ({
  309 + ...field,
  310 + fieldType: field.string ? 'string' : 'expression'
  311 + }))
  312 + } else {
  313 + fieldsListOfListener.value = []
  314 + listenerForm.value['fields'] = []
  315 + }
  316 + // 打开侧边栏并清楚验证状态
  317 + listenerFormModelVisible.value = true
  318 + nextTick(() => {
  319 + if (listenerFormRef.value) listenerFormRef.value.clearValidate()
  320 + })
  321 +}
  322 +// 打开监听器字段编辑弹窗
  323 +const openListenerFieldForm = (field, index) => {
  324 + listenerFieldForm.value = field ? JSON.parse(JSON.stringify(field)) : {}
  325 + editingListenerFieldIndex.value = field ? index : -1
  326 + listenerFieldFormModelVisible.value = true
  327 + nextTick(() => {
  328 + if (listenerFieldFormRef.value) listenerFieldFormRef.value.clearValidate()
  329 + })
  330 +}
  331 +// 保存监听器注入字段
  332 +const saveListenerFiled = async () => {
  333 + let validateStatus = await listenerFieldFormRef.value.validate()
  334 + if (!validateStatus) return // 验证不通过直接返回
  335 + if (editingListenerFieldIndex.value === -1) {
  336 + fieldsListOfListener.value.push(listenerFieldForm.value)
  337 + listenerForm.value.fields.push(listenerFieldForm.value)
  338 + } else {
  339 + fieldsListOfListener.value.splice(editingListenerFieldIndex.value, 1, listenerFieldForm.value)
  340 + listenerForm.value.fields.splice(editingListenerFieldIndex.value, 1, listenerFieldForm.value)
  341 + }
  342 + listenerFieldFormModelVisible.value = false
  343 + nextTick(() => {
  344 + listenerFieldForm.value = {}
  345 + })
  346 +}
  347 +// 移除监听器字段
  348 +const removeListenerField = (field, index) => {
  349 + ElMessageBox.confirm('确认移除该字段吗？', '提示', {
  350 + confirmButtonText: '确 认',
  351 + cancelButtonText: '取 消'
  352 + })
  353 + .then(() => {
  354 + fieldsListOfListener.value.splice(index, 1)
  355 + listenerForm.value.fields.splice(index, 1)
  356 + })
  357 + .catch(() => console.info('操作取消'))
  358 +}
  359 +// 移除监听器
  360 +const removeListener = (listener, index) => {
  361 + ElMessageBox.confirm('确认移除该监听器吗？', '提示', {
  362 + confirmButtonText: '确 认',
  363 + cancelButtonText: '取 消'
  364 + })
  365 + .then(() => {
  366 + bpmnElementListeners.value.splice(index, 1)
  367 + elementListenersList.value.splice(index, 1)
  368 + updateElementExtensions(
  369 + bpmnElement.value,
  370 + otherExtensionList.value.concat(bpmnElementListeners.value)
  371 + )
  372 + })
  373 + .catch(() => console.info('操作取消'))
  374 +}
  375 +// 保存监听器配置
  376 +const saveListenerConfig = async () => {
  377 + let validateStatus = await listenerFormRef.value.validate()
  378 + if (!validateStatus) return // 验证不通过直接返回
  379 + const listenerObject = createListenerObject(listenerForm.value, false, prefix)
  380 + if (editingListenerIndex.value === -1) {
  381 + bpmnElementListeners.value.push(listenerObject)
  382 + elementListenersList.value.push(listenerForm.value)
  383 + } else {
  384 + bpmnElementListeners.value.splice(editingListenerIndex.value, 1, listenerObject)
  385 + elementListenersList.value.splice(editingListenerIndex.value, 1, listenerForm.value)
  386 + }
  387 + // 保存其他配置
  388 + otherExtensionList.value =
  389 + bpmnElement.value.businessObject?.extensionElements?.values?.filter(
  390 + (ex) => ex.$type !== `${prefix}:ExecutionListener`
  391 + ) ?? []
  392 + updateElementExtensions(
  393 + bpmnElement.value,
  394 + otherExtensionList.value.concat(bpmnElementListeners.value)
  395 + )
  396 + // 4. 隐藏侧边栏
  397 + listenerFormModelVisible.value = false
  398 + listenerForm.value = {}
  399 +}
  400 +
  401 +watch(
  402 + () => props.id,
  403 + (val) => {
  404 + val &&
  405 + val.length &&
  406 + nextTick(() => {
  407 + resetListenersList()
  408 + })
  409 + },
  410 + { immediate: true }
  411 +)
  412 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/listeners/UserTaskListeners.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <el-table :data="elementListenersList" size="small" border>
  4 + <el-table-column label="序号" width="50px" type="index" />
  5 + <el-table-column
  6 + label="事件类型"
  7 + min-width="80px"
  8 + show-overflow-tooltip
  9 + :formatter="(row) => listenerEventTypeObject[row.event]"
  10 + />
  11 + <el-table-column label="事件id" min-width="80px" prop="id" show-overflow-tooltip />
  12 + <el-table-column
  13 + label="监听器类型"
  14 + min-width="80px"
  15 + show-overflow-tooltip
  16 + :formatter="(row) => listenerTypeObject[row.listenerType]"
  17 + />
  18 + <el-table-column label="操作" width="90px">
  19 + <template #default="scope">
  20 + <el-button size="small" link @click="openListenerForm(scope.row, scope.$index)"
  21 + >编辑</el-button
  22 + >
  23 + <el-divider direction="vertical" />
  24 + <el-button
  25 + size="small"
  26 + link
  27 + style="color: #ff4d4f"
  28 + @click="removeListener(scope.row, scope.$index)"
  29 + >移除</el-button
  30 + >
  31 + </template>
  32 + </el-table-column>
  33 + </el-table>
  34 + <div class="element-drawer__button">
  35 + <XButton
  36 + size="small"
  37 + type="primary"
  38 + preIcon="ep:plus"
  39 + title="添加监听器"
  40 + @click="openListenerForm(null)"
  41 + />
  42 + </div>
  43 +
  44 + <!-- 监听器 编辑/创建 部分 -->
  45 + <el-drawer
  46 + v-model="listenerFormModelVisible"
  47 + title="任务监听器"
  48 + :size="`${width}px`"
  49 + append-to-body
  50 + destroy-on-close
  51 + >
  52 + <el-form size="small" :model="listenerForm" label-width="96px" ref="listenerFormRef">
  53 + <el-form-item
  54 + label="事件类型"
  55 + prop="event"
  56 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  57 + >
  58 + <el-select v-model="listenerForm.event">
  59 + <el-option
  60 + v-for="i in Object.keys(listenerEventTypeObject)"
  61 + :key="i"
  62 + :label="listenerEventTypeObject[i]"
  63 + :value="i"
  64 + />
  65 + </el-select>
  66 + </el-form-item>
  67 + <el-form-item
  68 + label="监听器ID"
  69 + prop="id"
  70 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  71 + >
  72 + <el-input v-model="listenerForm.id" clearable />
  73 + </el-form-item>
  74 + <el-form-item
  75 + label="监听器类型"
  76 + prop="listenerType"
  77 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  78 + >
  79 + <el-select v-model="listenerForm.listenerType">
  80 + <el-option
  81 + v-for="i in Object.keys(listenerTypeObject)"
  82 + :key="i"
  83 + :label="listenerTypeObject[i]"
  84 + :value="i"
  85 + />
  86 + </el-select>
  87 + </el-form-item>
  88 + <el-form-item
  89 + v-if="listenerForm.listenerType === 'classListener'"
  90 + label="Java类"
  91 + prop="class"
  92 + key="listener-class"
  93 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  94 + >
  95 + <el-input v-model="listenerForm.class" clearable />
  96 + </el-form-item>
  97 + <el-form-item
  98 + v-if="listenerForm.listenerType === 'expressionListener'"
  99 + label="表达式"
  100 + prop="expression"
  101 + key="listener-expression"
  102 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  103 + >
  104 + <el-input v-model="listenerForm.expression" clearable />
  105 + </el-form-item>
  106 + <el-form-item
  107 + v-if="listenerForm.listenerType === 'delegateExpressionListener'"
  108 + label="代理表达式"
  109 + prop="delegateExpression"
  110 + key="listener-delegate"
  111 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  112 + >
  113 + <el-input v-model="listenerForm.delegateExpression" clearable />
  114 + </el-form-item>
  115 + <template v-if="listenerForm.listenerType === 'scriptListener'">
  116 + <el-form-item
  117 + label="脚本格式"
  118 + prop="scriptFormat"
  119 + key="listener-script-format"
  120 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写脚本格式' }"
  121 + >
  122 + <el-input v-model="listenerForm.scriptFormat" clearable />
  123 + </el-form-item>
  124 + <el-form-item
  125 + label="脚本类型"
  126 + prop="scriptType"
  127 + key="listener-script-type"
  128 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请选择脚本类型' }"
  129 + >
  130 + <el-select v-model="listenerForm.scriptType">
  131 + <el-option label="内联脚本" value="inlineScript" />
  132 + <el-option label="外部脚本" value="externalScript" />
  133 + </el-select>
  134 + </el-form-item>
  135 + <el-form-item
  136 + v-if="listenerForm.scriptType === 'inlineScript'"
  137 + label="脚本内容"
  138 + prop="value"
  139 + key="listener-script"
  140 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写脚本内容' }"
  141 + >
  142 + <el-input v-model="listenerForm.value" clearable />
  143 + </el-form-item>
  144 + <el-form-item
  145 + v-if="listenerForm.scriptType === 'externalScript'"
  146 + label="资源地址"
  147 + prop="resource"
  148 + key="listener-resource"
  149 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写资源地址' }"
  150 + >
  151 + <el-input v-model="listenerForm.resource" clearable />
  152 + </el-form-item>
  153 + </template>
  154 +
  155 + <template v-if="listenerForm.event === 'timeout'">
  156 + <el-form-item label="定时器类型" prop="eventDefinitionType" key="eventDefinitionType">
  157 + <el-select v-model="listenerForm.eventDefinitionType">
  158 + <el-option label="日期" value="date" />
  159 + <el-option label="持续时长" value="duration" />
  160 + <el-option label="循环" value="cycle" />
  161 + <el-option label="无" value="null" />
  162 + </el-select>
  163 + </el-form-item>
  164 + <el-form-item
  165 + v-if="!!listenerForm.eventDefinitionType && listenerForm.eventDefinitionType !== 'null'"
  166 + label="定时器"
  167 + prop="eventTimeDefinitions"
  168 + key="eventTimeDefinitions"
  169 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写定时器配置' }"
  170 + >
  171 + <el-input v-model="listenerForm.eventTimeDefinitions" clearable />
  172 + </el-form-item>
  173 + </template>
  174 + </el-form>
  175 +
  176 + <el-divider />
  177 + <p class="listener-filed__title">
  178 + <span><Icon icon="ep:menu" />注入字段：</span>
  179 + <el-button size="small" type="primary" @click="openListenerFieldForm(null)"
  180 + >添加字段</el-button
  181 + >
  182 + </p>
  183 + <el-table
  184 + :data="fieldsListOfListener"
  185 + size="small"
  186 + max-height="240"
  187 + border
  188 + fit
  189 + style="flex: none"
  190 + >
  191 + <el-table-column label="序号" width="50px" type="index" />
  192 + <el-table-column label="字段名称" min-width="100px" prop="name" />
  193 + <el-table-column
  194 + label="字段类型"
  195 + min-width="80px"
  196 + show-overflow-tooltip
  197 + :formatter="(row) => fieldTypeObject[row.fieldType]"
  198 + />
  199 + <el-table-column
  200 + label="字段值/表达式"
  201 + min-width="100px"
  202 + show-overflow-tooltip
  203 + :formatter="(row) => row.string || row.expression"
  204 + />
  205 + <el-table-column label="操作" width="100px">
  206 + <template #default="scope">
  207 + <el-button size="small" link @click="openListenerFieldForm(scope.row, scope.$index)"
  208 + >编辑</el-button
  209 + >
  210 + <el-divider direction="vertical" />
  211 + <el-button
  212 + size="small"
  213 + link
  214 + style="color: #ff4d4f"
  215 + @click="removeListenerField(scope.row, scope.$index)"
  216 + >移除</el-button
  217 + >
  218 + </template>
  219 + </el-table-column>
  220 + </el-table>
  221 +
  222 + <div class="element-drawer__button">
  223 + <el-button size="small" @click="listenerFormModelVisible = false">取 消</el-button>
  224 + <el-button size="small" type="primary" @click="saveListenerConfig">保 存</el-button>
  225 + </div>
  226 + </el-drawer>
  227 +
  228 + <!-- 注入西段 编辑/创建 部分 -->
  229 + <el-dialog
  230 + title="字段配置"
  231 + v-model="listenerFieldFormModelVisible"
  232 + width="600px"
  233 + append-to-body
  234 + destroy-on-close
  235 + >
  236 + <el-form
  237 + :model="listenerFieldForm"
  238 + size="small"
  239 + label-width="96px"
  240 + ref="listenerFieldFormRef"
  241 + style="height: 136px"
  242 + >
  243 + <el-form-item
  244 + label="字段名称："
  245 + prop="name"
  246 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  247 + >
  248 + <el-input v-model="listenerFieldForm.name" clearable />
  249 + </el-form-item>
  250 + <el-form-item
  251 + label="字段类型："
  252 + prop="fieldType"
  253 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  254 + >
  255 + <el-select v-model="listenerFieldForm.fieldType">
  256 + <el-option
  257 + v-for="i in Object.keys(fieldTypeObject)"
  258 + :key="i"
  259 + :label="fieldTypeObject[i]"
  260 + :value="i"
  261 + />
  262 + </el-select>
  263 + </el-form-item>
  264 + <el-form-item
  265 + v-if="listenerFieldForm.fieldType === 'string'"
  266 + label="字段值："
  267 + prop="string"
  268 + key="field-string"
  269 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  270 + >
  271 + <el-input v-model="listenerFieldForm.string" clearable />
  272 + </el-form-item>
  273 + <el-form-item
  274 + v-if="listenerFieldForm.fieldType === 'expression'"
  275 + label="表达式："
  276 + prop="expression"
  277 + key="field-expression"
  278 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  279 + >
  280 + <el-input v-model="listenerFieldForm.expression" clearable />
  281 + </el-form-item>
  282 + </el-form>
  283 + <template #footer>
  284 + <el-button size="small" @click="listenerFieldFormModelVisible = false">取 消</el-button>
  285 + <el-button size="small" type="primary" @click="saveListenerFiled">确 定</el-button>
  286 + </template>
  287 + </el-dialog>
  288 + </div>
  289 +</template>
  290 +<script lang="ts" setup name="UserTaskListeners">
  291 +import { ref, inject, watch, nextTick } from 'vue'
  292 +import {
  293 + ElDialog,
  294 + ElForm,
  295 + ElFormItem,
  296 + ElSelect,
  297 + ElOption,
  298 + ElDivider,
  299 + ElTable,
  300 + ElTableColumn,
  301 + ElMessageBox,
  302 + ElButton,
  303 + ElDrawer
  304 +} from 'element-plus'
  305 +import { createListenerObject, updateElementExtensions } from '../../utils'
  306 +import { initListenerForm, initListenerType, eventType, listenerType, fieldType } from './utilSelf'
  307 +const props = defineProps({
  308 + id: String,
  309 + type: String
  310 +})
  311 +const prefix = inject('prefix')
  312 +const width = inject('width')
  313 +const elementListenersList = ref([])
  314 +const listenerEventTypeObject = ref(eventType)
  315 +const listenerTypeObject = ref(listenerType)
  316 +const listenerFormModelVisible = ref(false)
  317 +const listenerForm = ref({})
  318 +const fieldTypeObject = ref(fieldType)
  319 +const fieldsListOfListener = ref([])
  320 +const listenerFieldFormModelVisible = ref(false) // 监听器 注入字段表单弹窗 显示状态
  321 +const editingListenerIndex = ref(-1) // 监听器所在下标，-1 为新增
  322 +const editingListenerFieldIndex = ref(-1) // 字段所在下标，-1 为新增
  323 +const listenerFieldForm = ref({}) // 监听器 注入字段 详情表单
  324 +const bpmnElement = ref()
  325 +const bpmnElementListeners = ref()
  326 +const otherExtensionList = ref()
  327 +const listenerFormRef = ref()
  328 +const listenerFieldFormRef = ref()
  329 +
  330 +const resetListenersList = () => {
  331 + console.log(
  332 + window.bpmnInstances.bpmnElement,
  333 + 'window.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElement'
  334 + )
  335 + bpmnElement.value = window.bpmnInstances.bpmnElement
  336 + otherExtensionList.value = []
  337 + bpmnElementListeners.value =
  338 + bpmnElement.value.businessObject?.extensionElements?.values.filter(
  339 + (ex) => ex.$type === `${prefix}:TaskListener`
  340 + ) ?? []
  341 + elementListenersList.value = bpmnElementListeners.value.map((listener) =>
  342 + initListenerType(listener)
  343 + )
  344 +}
  345 +const openListenerForm = (listener, index) => {
  346 + if (listener) {
  347 + listenerForm.value = initListenerForm(listener)
  348 + editingListenerIndex.value = index
  349 + } else {
  350 + listenerForm.value = {}
  351 + editingListenerIndex.value = -1 // 标记为新增
  352 + }
  353 + if (listener && listener.fields) {
  354 + fieldsListOfListener.value = listener.fields.map((field) => ({
  355 + ...field,
  356 + fieldType: field.string ? 'string' : 'expression'
  357 + }))
  358 + } else {
  359 + fieldsListOfListener.value = []
  360 + listenerForm.value['fields'] = []
  361 + }
  362 + // 打开侧边栏并清楚验证状态
  363 + listenerFormModelVisible.value = true
  364 + nextTick(() => {
  365 + if (listenerFormRef.value) listenerFormRef.value.clearValidate()
  366 + })
  367 +}
  368 +// 移除监听器
  369 +const removeListener = (listener, index) => {
  370 + console.log(listener, 'listener')
  371 + ElMessageBox.confirm('确认移除该监听器吗？', '提示', {
  372 + confirmButtonText: '确 认',
  373 + cancelButtonText: '取 消'
  374 + })
  375 + .then(() => {
  376 + bpmnElementListeners.value.splice(index, 1)
  377 + elementListenersList.value.splice(index, 1)
  378 + updateElementExtensions(
  379 + bpmnElement.value,
  380 + otherExtensionList.value.concat(bpmnElementListeners.value)
  381 + )
  382 + })
  383 + .catch(() => console.info('操作取消'))
  384 +}
  385 +// 保存监听器
  386 +const saveListenerConfig = async () => {
  387 + let validateStatus = await listenerFormRef.value.validate()
  388 + if (!validateStatus) return // 验证不通过直接返回
  389 + const listenerObject = createListenerObject(listenerForm.value, true, prefix)
  390 + if (editingListenerIndex.value === -1) {
  391 + bpmnElementListeners.value.push(listenerObject)
  392 + elementListenersList.value.push(listenerForm.value)
  393 + } else {
  394 + bpmnElementListeners.value.splice(editingListenerIndex.value, 1, listenerObject)
  395 + elementListenersList.value.splice(editingListenerIndex.value, 1, listenerForm.value)
  396 + }
  397 + // 保存其他配置
  398 + otherExtensionList.value =
  399 + bpmnElement.value.businessObject?.extensionElements?.values?.filter(
  400 + (ex) => ex.$type !== `${prefix}:TaskListener`
  401 + ) ?? []
  402 + updateElementExtensions(
  403 + bpmnElement.value,
  404 + otherExtensionList.value.concat(bpmnElementListeners.value)
  405 + )
  406 + // 4. 隐藏侧边栏
  407 + listenerFormModelVisible.value = false
  408 + listenerForm.value = {}
  409 +}
  410 +// 打开监听器字段编辑弹窗
  411 +const openListenerFieldForm = (field, index) => {
  412 + listenerFieldForm.value = field ? JSON.parse(JSON.stringify(field)) : {}
  413 + editingListenerFieldIndex.value = field ? index : -1
  414 + listenerFieldFormModelVisible.value = true
  415 + nextTick(() => {
  416 + if (listenerFieldFormRef.value) listenerFieldFormRef.value.clearValidate()
  417 + })
  418 +}
  419 +// 保存监听器注入字段
  420 +const saveListenerFiled = async () => {
  421 + let validateStatus = await listenerFieldFormRef.value.validate()
  422 + if (!validateStatus) return // 验证不通过直接返回
  423 + if (editingListenerFieldIndex.value === -1) {
  424 + fieldsListOfListener.value.push(listenerFieldForm.value)
  425 + listenerForm.value.fields.push(listenerFieldForm.value)
  426 + } else {
  427 + fieldsListOfListener.value.splice(editingListenerFieldIndex.value, 1, listenerFieldForm.value)
  428 + listenerForm.value.fields.splice(editingListenerFieldIndex.value, 1, listenerFieldForm.value)
  429 + }
  430 + listenerFieldFormModelVisible.value = false
  431 + nextTick(() => {
  432 + listenerFieldForm.value = {}
  433 + })
  434 +}
  435 +// 移除监听器字段
  436 +const removeListenerField = (field, index) => {
  437 + console.log(field, 'field')
  438 + ElMessageBox.confirm('确认移除该字段吗？', '提示', {
  439 + confirmButtonText: '确 认',
  440 + cancelButtonText: '取 消'
  441 + })
  442 + .then(() => {
  443 + fieldsListOfListener.value.splice(index, 1)
  444 + listenerForm.value.fields.splice(index, 1)
  445 + })
  446 + .catch(() => console.info('操作取消'))
  447 +}
  448 +
  449 +watch(
  450 + () => props.id,
  451 + (val) => {
  452 + val &&
  453 + val.length &&
  454 + nextTick(() => {
  455 + resetListenersList()
  456 + })
  457 + },
  458 + { immediate: true }
  459 +)
  460 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/listeners/template.js 0 → 100644
  View file @5bedff6
  1 +export const template = isTaskListener => {
  2 + return `
  3 + <div class="panel-tab__content">
  4 + <el-table :data="elementListenersList" size="small" border>
  5 + <el-table-column label="序号" width="50px" type="index" />
  6 + <el-table-column label="事件类型" min-width="100px" prop="event" />
  7 + <el-table-column label="监听器类型" min-width="100px" show-overflow-tooltip :formatter="row => listenerTypeObject[row.listenerType]" />
  8 + <el-table-column label="操作" width="90px">
  9 + <template #default="scope">
  10 + <el-button size="small" type="text" @click="openListenerForm(scope, scope.$index)">编辑</el-button>
  11 + <el-divider direction="vertical" />
  12 + <el-button size="small" type="text" style="color: #ff4d4f" @click="removeListener(scope, scope.$index)">移除</el-button>
  13 + </template>
  14 + </el-table-column>
  15 + </el-table>
  16 + <div class="element-drawer__button">
  17 + <el-button size="small" type="primary" icon="el-icon-plus" @click="openListenerForm(null)">添加监听器</el-button>
  18 + </div>
  19 +
  20 + <!-- 监听器 编辑/创建 部分 -->
  21 + <el-drawer :visible.sync="listenerFormModelVisible" title="执行监听器" :size="width + 'px'" append-to-body destroy-on-close>
  22 + <el-form size="small" :model="listenerForm" label-width="96px" ref="listenerFormRef" @submit.native.prevent>
  23 + <el-form-item label="事件类型" prop="event" :rules="{ required: true, trigger: ['blur', 'change'] }">
  24 + <el-select v-model="listenerForm.event">
  25 + <el-option label="start" value="start" />
  26 + <el-option label="end" value="end" />
  27 + </el-select>
  28 + </el-form-item>
  29 + <el-form-item label="监听器类型" prop="listenerType" :rules="{ required: true, trigger: ['blur', 'change'] }">
  30 + <el-select v-model="listenerForm.listenerType">
  31 + <el-option v-for="i in Object.keys(listenerTypeObject)" :key="i" :label="listenerTypeObject[i]" :value="i" />
  32 + </el-select>
  33 + </el-form-item>
  34 + <el-form-item
  35 + v-if="listenerForm.listenerType === 'classListener'"
  36 + label="Java类"
  37 + prop="class"
  38 + key="listener-class"
  39 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  40 + >
  41 + <el-input v-model="listenerForm.class" clearable />
  42 + </el-form-item>
  43 + <el-form-item
  44 + v-if="listenerForm.listenerType === 'expressionListener'"
  45 + label="表达式"
  46 + prop="expression"
  47 + key="listener-expression"
  48 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  49 + >
  50 + <el-input v-model="listenerForm.expression" clearable />
  51 + </el-form-item>
  52 + <el-form-item
  53 + v-if="listenerForm.listenerType === 'delegateExpressionListener'"
  54 + label="代理表达式"
  55 + prop="delegateExpression"
  56 + key="listener-delegate"
  57 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  58 + >
  59 + <el-input v-model="listenerForm.delegateExpression" clearable />
  60 + </el-form-item>
  61 + <template v-if="listenerForm.listenerType === 'scriptListener'">
  62 + <el-form-item
  63 + label="脚本格式"
  64 + prop="scriptFormat"
  65 + key="listener-script-format"
  66 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写脚本格式' }"
  67 + >
  68 + <el-input v-model="listenerForm.scriptFormat" clearable />
  69 + </el-form-item>
  70 + <el-form-item
  71 + label="脚本类型"
  72 + prop="scriptType"
  73 + key="listener-script-type"
  74 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请选择脚本类型' }"
  75 + >
  76 + <el-select v-model="listenerForm.scriptType">
  77 + <el-option label="内联脚本" value="inlineScript" />
  78 + <el-option label="外部脚本" value="externalScript" />
  79 + </el-select>
  80 + </el-form-item>
  81 + <el-form-item
  82 + v-if="listenerForm.scriptType === 'inlineScript'"
  83 + label="脚本内容"
  84 + prop="value"
  85 + key="listener-script"
  86 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写脚本内容' }"
  87 + >
  88 + <el-input v-model="listenerForm.value" clearable />
  89 + </el-form-item>
  90 + <el-form-item
  91 + v-if="listenerForm.scriptType === 'externalScript'"
  92 + label="资源地址"
  93 + prop="resource"
  94 + key="listener-resource"
  95 + :rules="{ required: true, trigger: ['blur', 'change'], message: '请填写资源地址' }"
  96 + >
  97 + <el-input v-model="listenerForm.resource" clearable />
  98 + </el-form-item>
  99 + </template>
  100 + ${isTaskListener
  101 + ? "<el-form-item label='定时器类型' prop='eventDefinitionType' key='eventDefinitionType'>" +
  102 + "<el-select v-model='listenerForm.eventDefinitionType'>" +
  103 + "<el-option label='日期' value='date' />" +
  104 + "<el-option label='持续时长' value='duration' />" +
  105 + "<el-option label='循环' value='cycle' />" +
  106 + "<el-option label='无' value='' />" +
  107 + "</el-select>" +
  108 + "</el-form-item>" +
  109 + "<el-form-item v-if='!!listenerForm.eventDefinitionType' label='定时器' prop='eventDefinitions' key='eventDefinitions'>" +
  110 + "<el-input v-model='listenerForm.eventDefinitions' clearable />" +
  111 + "</el-form-item>"
  112 + : ""
  113 + }
  114 + </el-form>
  115 + <el-divider />
  116 + <p class="listener-filed__title">
  117 + <span><i class="el-icon-menu"></i>注入字段：</span>
  118 + <el-button size="small" type="primary" @click="openListenerFieldForm(null)">添加字段</el-button>
  119 + </p>
  120 + <el-table :data="fieldsListOfListener" size="small" max-height="240" border fit style="flex: none">
  121 + <el-table-column label="序号" width="50px" type="index" />
  122 + <el-table-column label="字段名称" min-width="100px" prop="name" />
  123 + <el-table-column label="字段类型" min-width="80px" show-overflow-tooltip :formatter="row => fieldTypeObject[row.fieldType]" />
  124 + <el-table-column label="字段值/表达式" min-width="100px" show-overflow-tooltip :formatter="row => row.string || row.expression" />
  125 + <el-table-column label="操作" width="100px">
  126 + <template #default="scope">
  127 + <el-button size="small" type="text" @click="openListenerFieldForm(scope, scope.$index)">编辑</el-button>
  128 + <el-divider direction="vertical" />
  129 + <el-button size="small" type="text" style="color: #ff4d4f" @click="removeListenerField(scope, scope.$index)">移除</el-button>
  130 + </template>
  131 + </el-table-column>
  132 + </el-table>
  133 +
  134 + <div class="element-drawer__button">
  135 + <el-button size="small" @click="listenerFormModelVisible = false">取 消</el-button>
  136 + <el-button size="small" type="primary" @click="saveListenerConfig">保 存</el-button>
  137 + </div>
  138 + </el-drawer>
  139 +
  140 + <!-- 注入西段 编辑/创建 部分 -->
  141 + <el-dialog title="字段配置" :visible.sync="listenerFieldFormModelVisible" width="600px" append-to-body destroy-on-close>
  142 + <el-form :model="listenerFieldForm" size="small" label-width="96px" ref="listenerFieldFormRef" style="height: 136px" @submit.native.prevent>
  143 + <el-form-item label="字段名称：" prop="name" :rules="{ required: true, trigger: ['blur', 'change'] }">
  144 + <el-input v-model="listenerFieldForm.name" clearable />
  145 + </el-form-item>
  146 + <el-form-item label="字段类型：" prop="fieldType" :rules="{ required: true, trigger: ['blur', 'change'] }">
  147 + <el-select v-model="listenerFieldForm.fieldType">
  148 + <el-option v-for="i in Object.keys(fieldTypeObject)" :key="i" :label="fieldTypeObject[i]" :value="i" />
  149 + </el-select>
  150 + </el-form-item>
  151 + <el-form-item
  152 + v-if="listenerFieldForm.fieldType === 'string'"
  153 + label="字段值："
  154 + prop="string"
  155 + key="field-string"
  156 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  157 + >
  158 + <el-input v-model="listenerFieldForm.string" clearable />
  159 + </el-form-item>
  160 + <el-form-item
  161 + v-if="listenerFieldForm.fieldType === 'expression'"
  162 + label="表达式："
  163 + prop="expression"
  164 + key="field-expression"
  165 + :rules="{ required: true, trigger: ['blur', 'change'] }"
  166 + >
  167 + <el-input v-model="listenerFieldForm.expression" clearable />
  168 + </el-form-item>
  169 + </el-form>
  170 + <template #footer>
  171 + <el-button size="small" @click="listenerFieldFormModelVisible = false">取 消</el-button>
  172 + <el-button size="small" type="primary" @click="saveListenerFiled">确 定</el-button>
  173 + </template>
  174 + </el-dialog>
  175 + </div>
  176 + `
  177 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/listeners/utilSelf.ts 0 → 100644
  View file @5bedff6
  1 +// 初始化表单数据
  2 +export function initListenerForm(listener) {
  3 + let self = {
  4 + ...listener
  5 + }
  6 + if (listener.script) {
  7 + self = {
  8 + ...listener,
  9 + ...listener.script,
  10 + scriptType: listener.script.resource ? 'externalScript' : 'inlineScript'
  11 + }
  12 + }
  13 + if (listener.event === 'timeout' && listener.eventDefinitions) {
  14 + if (listener.eventDefinitions.length) {
  15 + let k = ''
  16 + for (const key in listener.eventDefinitions[0]) {
  17 + console.log(listener.eventDefinitions, key)
  18 + if (key.indexOf('time') !== -1) {
  19 + k = key
  20 + self.eventDefinitionType = key.replace('time', '').toLowerCase()
  21 + }
  22 + }
  23 + console.log(k)
  24 + self.eventTimeDefinitions = listener.eventDefinitions[0][k].body
  25 + }
  26 + }
  27 + return self
  28 +}
  29 +
  30 +export function initListenerType(listener) {
  31 + let listenerType
  32 + if (listener.class) listenerType = 'classListener'
  33 + if (listener.expression) listenerType = 'expressionListener'
  34 + if (listener.delegateExpression) listenerType = 'delegateExpressionListener'
  35 + if (listener.script) listenerType = 'scriptListener'
  36 + return {
  37 + ...JSON.parse(JSON.stringify(listener)),
  38 + ...(listener.script ?? {}),
  39 + listenerType: listenerType
  40 + }
  41 +}
  42 +
  43 +export const listenerType = {
  44 + classListener: 'Java 类',
  45 + expressionListener: '表达式',
  46 + delegateExpressionListener: '代理表达式',
  47 + scriptListener: '脚本'
  48 +}
  49 +
  50 +export const eventType = {
  51 + create: '创建',
  52 + assignment: '指派',
  53 + complete: '完成',
  54 + delete: '删除',
  55 + update: '更新',
  56 + timeout: '超时'
  57 +}
  58 +
  59 +export const fieldType = {
  60 + string: '字符串',
  61 + expression: '表达式'
  62 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/multi-instance/ElementMultiInstance.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <el-form label-width="90px">
  4 + <el-form-item label="回路特性">
  5 + <el-select v-model="loopCharacteristics" @change="changeLoopCharacteristicsType">
  6 + <!--bpmn:MultiInstanceLoopCharacteristics-->
  7 + <el-option label="并行多重事件" value="ParallelMultiInstance" />
  8 + <el-option label="时序多重事件" value="SequentialMultiInstance" />
  9 + <!--bpmn:StandardLoopCharacteristics-->
  10 + <el-option label="循环事件" value="StandardLoop" />
  11 + <el-option label="无" value="Null" />
  12 + </el-select>
  13 + </el-form-item>
  14 + <template
  15 + v-if="
  16 + loopCharacteristics === 'ParallelMultiInstance' ||
  17 + loopCharacteristics === 'SequentialMultiInstance'
  18 + "
  19 + >
  20 + <el-form-item label="循环基数" key="loopCardinality">
  21 + <el-input
  22 + v-model="loopInstanceForm.loopCardinality"
  23 + clearable
  24 + @change="updateLoopCardinality"
  25 + />
  26 + </el-form-item>
  27 + <el-form-item label="集合" key="collection" v-show="false">
  28 + <el-input v-model="loopInstanceForm.collection" clearable @change="updateLoopBase" />
  29 + </el-form-item>
  30 + <el-form-item label="元素变量" key="elementVariable">
  31 + <el-input v-model="loopInstanceForm.elementVariable" clearable @change="updateLoopBase" />
  32 + </el-form-item>
  33 + <el-form-item label="完成条件" key="completionCondition">
  34 + <el-input
  35 + v-model="loopInstanceForm.completionCondition"
  36 + clearable
  37 + @change="updateLoopCondition"
  38 + />
  39 + </el-form-item>
  40 + <el-form-item label="异步状态" key="async">
  41 + <el-checkbox
  42 + v-model="loopInstanceForm.asyncBefore"
  43 + label="异步前"
  44 + @change="updateLoopAsync('asyncBefore')"
  45 + />
  46 + <el-checkbox
  47 + v-model="loopInstanceForm.asyncAfter"
  48 + label="异步后"
  49 + @change="updateLoopAsync('asyncAfter')"
  50 + />
  51 + <el-checkbox
  52 + v-model="loopInstanceForm.exclusive"
  53 + v-if="loopInstanceForm.asyncAfter || loopInstanceForm.asyncBefore"
  54 + label="排除"
  55 + @change="updateLoopAsync('exclusive')"
  56 + />
  57 + </el-form-item>
  58 + <el-form-item
  59 + label="重试周期"
  60 + prop="timeCycle"
  61 + v-if="loopInstanceForm.asyncAfter || loopInstanceForm.asyncBefore"
  62 + key="timeCycle"
  63 + >
  64 + <el-input v-model="loopInstanceForm.timeCycle" clearable @change="updateLoopTimeCycle" />
  65 + </el-form-item>
  66 + </template>
  67 + </el-form>
  68 + </div>
  69 +</template>
  70 +
  71 +<script setup lang="ts" name="ElementMultiInstance">
  72 +import { inject, ref, onBeforeUnmount, watch, toRaw } from 'vue'
  73 +import { ElForm, ElFormItem, ElSelect, ElOption, ElCheckbox, ElInput } from 'element-plus'
  74 +const props = defineProps({
  75 + businessObject: Object,
  76 + type: String
  77 +})
  78 +const prefix = inject('prefix')
  79 +const loopCharacteristics = ref('')
  80 +//默认配置，用来覆盖原始不存在的选项，避免报错
  81 +const defaultLoopInstanceForm = ref({
  82 + completionCondition: '',
  83 + loopCardinality: '',
  84 + extensionElements: [],
  85 + asyncAfter: false,
  86 + asyncBefore: false,
  87 + exclusive: false
  88 +})
  89 +const loopInstanceForm = ref({})
  90 +const bpmnElement = ref()
  91 +const multiLoopInstance = ref()
  92 +
  93 +const getElementLoop = (businessObject) => {
  94 + if (!businessObject.loopCharacteristics) {
  95 + loopCharacteristics.value = 'Null'
  96 + loopInstanceForm.value = {}
  97 + return
  98 + }
  99 + if (businessObject.loopCharacteristics.$type === 'bpmn:StandardLoopCharacteristics') {
  100 + loopCharacteristics.value = 'StandardLoop'
  101 + loopInstanceForm.value = {}
  102 + return
  103 + }
  104 + if (businessObject.loopCharacteristics.isSequential) {
  105 + loopCharacteristics.value = 'SequentialMultiInstance'
  106 + } else {
  107 + loopCharacteristics.value = 'ParallelMultiInstance'
  108 + }
  109 + // 合并配置
  110 + loopInstanceForm.value = {
  111 + ...defaultLoopInstanceForm.value,
  112 + ...businessObject.loopCharacteristics,
  113 + completionCondition: businessObject.loopCharacteristics?.completionCondition?.body ?? '',
  114 + loopCardinality: businessObject.loopCharacteristics?.loopCardinality?.body ?? ''
  115 + }
  116 + // 保留当前元素 businessObject 上的 loopCharacteristics 实例
  117 + multiLoopInstance.value = window.bpmnInstances.bpmnElement.businessObject.loopCharacteristics
  118 + // 更新表单
  119 + if (
  120 + businessObject.loopCharacteristics.extensionElements &&
  121 + businessObject.loopCharacteristics.extensionElements.values &&
  122 + businessObject.loopCharacteristics.extensionElements.values.length
  123 + ) {
  124 + loopInstanceForm.value['timeCycle'] =
  125 + businessObject.loopCharacteristics.extensionElements.values[0].body
  126 + }
  127 +}
  128 +const changeLoopCharacteristicsType = (type) => {
  129 + // this.loopInstanceForm = { ...this.defaultLoopInstanceForm }; // 切换类型取消原表单配置
  130 + // 取消多实例配置
  131 + if (type === 'Null') {
  132 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  133 + loopCharacteristics: null
  134 + })
  135 + return
  136 + }
  137 + // 配置循环
  138 + if (type === 'StandardLoop') {
  139 + const loopCharacteristicsObject = window.bpmnInstances.moddle.create(
  140 + 'bpmn:StandardLoopCharacteristics'
  141 + )
  142 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  143 + loopCharacteristics: loopCharacteristicsObject
  144 + })
  145 + multiLoopInstance.value = null
  146 + return
  147 + }
  148 + // 时序
  149 + if (type === 'SequentialMultiInstance') {
  150 + multiLoopInstance.value = window.bpmnInstances.moddle.create(
  151 + 'bpmn:MultiInstanceLoopCharacteristics',
  152 + { isSequential: true }
  153 + )
  154 + } else {
  155 + multiLoopInstance.value = window.bpmnInstances.moddle.create(
  156 + 'bpmn:MultiInstanceLoopCharacteristics',
  157 + { collection: '${coll_userList}' }
  158 + )
  159 + }
  160 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  161 + loopCharacteristics: multiLoopInstance.value
  162 + })
  163 +}
  164 +// 循环基数
  165 +const updateLoopCardinality = (cardinality) => {
  166 + let loopCardinality = null
  167 + if (cardinality && cardinality.length) {
  168 + loopCardinality = window.bpmnInstances.moddle.create('bpmn:FormalExpression', {
  169 + body: cardinality
  170 + })
  171 + }
  172 + window.bpmnInstances.modeling.updateModdleProperties(
  173 + toRaw(bpmnElement.value),
  174 + multiLoopInstance.value,
  175 + {
  176 + loopCardinality
  177 + }
  178 + )
  179 +}
  180 +// 完成条件
  181 +const updateLoopCondition = (condition) => {
  182 + let completionCondition = null
  183 + if (condition && condition.length) {
  184 + completionCondition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', {
  185 + body: condition
  186 + })
  187 + }
  188 + window.bpmnInstances.modeling.updateModdleProperties(
  189 + toRaw(bpmnElement.value),
  190 + multiLoopInstance.value,
  191 + {
  192 + completionCondition
  193 + }
  194 + )
  195 +}
  196 +// 重试周期
  197 +const updateLoopTimeCycle = (timeCycle) => {
  198 + const extensionElements = window.bpmnInstances.moddle.create('bpmn:ExtensionElements', {
  199 + values: [
  200 + window.bpmnInstances.moddle.create(`${prefix}:FailedJobRetryTimeCycle`, {
  201 + body: timeCycle
  202 + })
  203 + ]
  204 + })
  205 + window.bpmnInstances.modeling.updateModdleProperties(
  206 + toRaw(bpmnElement.value),
  207 + multiLoopInstance.value,
  208 + {
  209 + extensionElements
  210 + }
  211 + )
  212 +}
  213 +// 直接更新的基础信息
  214 +const updateLoopBase = () => {
  215 + window.bpmnInstances.modeling.updateModdleProperties(
  216 + toRaw(bpmnElement.value),
  217 + multiLoopInstance.value,
  218 + {
  219 + collection: loopInstanceForm.value.collection || null,
  220 + elementVariable: loopInstanceForm.value.elementVariable || null
  221 + }
  222 + )
  223 +}
  224 +// 各异步状态
  225 +const updateLoopAsync = (key) => {
  226 + const { asyncBefore, asyncAfter } = loopInstanceForm.value
  227 + let asyncAttr = Object.create(null)
  228 + if (!asyncBefore && !asyncAfter) {
  229 + // this.$set(this.loopInstanceForm, "exclusive", false);
  230 + loopInstanceForm.value['exclusive'] = false
  231 + asyncAttr = { asyncBefore: false, asyncAfter: false, exclusive: false, extensionElements: null }
  232 + } else {
  233 + asyncAttr[key] = loopInstanceForm.value[key]
  234 + }
  235 + window.bpmnInstances.modeling.updateModdleProperties(
  236 + toRaw(bpmnElement.value),
  237 + multiLoopInstance.value,
  238 + asyncAttr
  239 + )
  240 +}
  241 +
  242 +onBeforeUnmount(() => {
  243 + multiLoopInstance.value = null
  244 + bpmnElement.value = null
  245 +})
  246 +
  247 +watch(
  248 + () => props.type,
  249 + (val) => {
  250 + bpmnElement.value = window.bpmnInstances.bpmnElement
  251 + getElementLoop(val)
  252 + },
  253 + { immediate: true }
  254 +)
  255 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/other/ElementOtherConfig.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <div class="element-property input-property">
  4 + <div class="element-property__label">元素文档：</div>
  5 + <div class="element-property__value">
  6 + <el-input
  7 + type="textarea"
  8 + v-model="documentation"
  9 + resize="vertical"
  10 + :autosize="{ minRows: 2, maxRows: 4 }"
  11 + @input="updateDocumentation"
  12 + @blur="updateDocumentation"
  13 + />
  14 + </div>
  15 + </div>
  16 + </div>
  17 +</template>
  18 +
  19 +<script setup lang="ts" name="ElementOtherConfig">
  20 +import { ref, watch, nextTick, onBeforeUnmount, toRaw } from 'vue'
  21 +import { ElInput } from 'element-plus'
  22 +const props = defineProps({
  23 + id: String
  24 +})
  25 +const documentation = ref('')
  26 +const bpmnElement = ref()
  27 +const updateDocumentation = () => {
  28 + ;(bpmnElement.value && bpmnElement.value.id === props.id) ||
  29 + (bpmnElement.value = (window as any).bpmnInstances.elementRegistry.get(props.id))
  30 + const documentations = window.bpmnInstances.bpmnFactory.create('bpmn:Documentation', {
  31 + text: documentation.value
  32 + })
  33 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  34 + documentation: [documentations]
  35 + })
  36 +}
  37 +onBeforeUnmount(() => {
  38 + bpmnElement.value = null
  39 +})
  40 +
  41 +watch(
  42 + () => props.id,
  43 + (id) => {
  44 + if (id && id.length) {
  45 + nextTick(() => {
  46 + const documentations = window.bpmnInstances.bpmnElement.businessObject?.documentation
  47 + documentation.value = documentations && documentations.length ? documentations[0].text : ''
  48 + })
  49 + } else {
  50 + documentation.value = ''
  51 + }
  52 + },
  53 + { immediate: true }
  54 +)
  55 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/properties/ElementProperties.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <el-table :data="elementPropertyList" max-height="240" border fit>
  4 + <el-table-column label="序号" width="50px" type="index" />
  5 + <el-table-column label="属性名" prop="name" min-width="100px" show-overflow-tooltip />
  6 + <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />
  7 + <el-table-column label="操作" width="110px">
  8 + <template #default="scope">
  9 + <el-button link @click="openAttributesForm(scope.row, scope.$index)" size="small"
  10 + >编辑</el-button
  11 + >
  12 + <el-divider direction="vertical" />
  13 + <el-button
  14 + link
  15 + size="small"
  16 + style="color: #ff4d4f"
  17 + @click="removeAttributes(scope.row, scope.$index)"
  18 + >移除</el-button
  19 + >
  20 + </template>
  21 + </el-table-column>
  22 + </el-table>
  23 + <div class="element-drawer__button">
  24 + <XButton
  25 + type="primary"
  26 + preIcon="ep:plus"
  27 + title="添加属性"
  28 + @click="openAttributesForm(null, -1)"
  29 + />
  30 + </div>
  31 +
  32 + <el-dialog
  33 + v-model="propertyFormModelVisible"
  34 + title="属性配置"
  35 + width="600px"
  36 + append-to-body
  37 + destroy-on-close
  38 + >
  39 + <el-form :model="propertyForm" label-width="80px" ref="attributeFormRef">
  40 + <el-form-item label="属性名：" prop="name">
  41 + <el-input v-model="propertyForm.name" clearable />
  42 + </el-form-item>
  43 + <el-form-item label="属性值：" prop="value">
  44 + <el-input v-model="propertyForm.value" clearable />
  45 + </el-form-item>
  46 + </el-form>
  47 + <template #footer>
  48 + <el-button @click="propertyFormModelVisible = false">取 消</el-button>
  49 + <el-button type="primary" @click="saveAttribute">确 定</el-button>
  50 + </template>
  51 + </el-dialog>
  52 + </div>
  53 +</template>
  54 +
  55 +<script setup lang="ts" name="ElementProperties">
  56 +import { ref, inject, nextTick, watch, toRaw } from 'vue'
  57 +import {
  58 + ElMessageBox,
  59 + ElDialog,
  60 + ElButton,
  61 + ElForm,
  62 + ElFormItem,
  63 + ElTable,
  64 + ElTableColumn,
  65 + ElDivider,
  66 + ElInput
  67 +} from 'element-plus'
  68 +const props = defineProps({
  69 + id: String,
  70 + type: String
  71 +})
  72 +const prefix = inject('prefix')
  73 +// const width = inject('width')
  74 +
  75 +const elementPropertyList = ref([])
  76 +const propertyForm = ref({})
  77 +const editingPropertyIndex = ref(-1)
  78 +const propertyFormModelVisible = ref(false)
  79 +const bpmnElement = ref()
  80 +const otherExtensionList = ref()
  81 +const bpmnElementProperties = ref()
  82 +const bpmnElementPropertyList = ref()
  83 +const attributeFormRef = ref()
  84 +
  85 +const resetAttributesList = () => {
  86 + console.log(window, 'windowwindowwindowwindowwindowwindowwindow')
  87 + bpmnElement.value = window.bpmnInstances.bpmnElement
  88 + otherExtensionList.value = [] // 其他扩展配置
  89 + bpmnElementProperties.value =
  90 + // bpmnElement.value.businessObject?.extensionElements?.filter((ex) => {
  91 + bpmnElement.value.businessObject?.extensionElements?.values.filter((ex) => {
  92 + if (ex.$type !== `${prefix}:Properties`) {
  93 + otherExtensionList.value.push(ex)
  94 + }
  95 + return ex.$type === `${prefix}:Properties`
  96 + }) ?? []
  97 +
  98 + // 保存所有的 扩展属性字段
  99 + bpmnElementPropertyList.value = bpmnElementProperties.value.reduce(
  100 + (pre, current) => pre.concat(current.values),
  101 + []
  102 + )
  103 + // 复制 显示
  104 + elementPropertyList.value = JSON.parse(JSON.stringify(bpmnElementPropertyList.value ?? []))
  105 +}
  106 +const openAttributesForm = (attr, index) => {
  107 + editingPropertyIndex.value = index
  108 + propertyForm.value = index === -1 ? {} : JSON.parse(JSON.stringify(attr))
  109 + propertyFormModelVisible.value = true
  110 + nextTick(() => {
  111 + if (attributeFormRef.value) attributeFormRef.value.clearValidate()
  112 + })
  113 +}
  114 +const removeAttributes = (attr, index) => {
  115 + console.log(attr, 'attr')
  116 + ElMessageBox.confirm('确认移除该属性吗？', '提示', {
  117 + confirmButtonText: '确 认',
  118 + cancelButtonText: '取 消'
  119 + })
  120 + .then(() => {
  121 + elementPropertyList.value.splice(index, 1)
  122 + bpmnElementPropertyList.value.splice(index, 1)
  123 + // 新建一个属性字段的保存列表
  124 + const propertiesObject = window.bpmnInstances.moddle.create(`${prefix}:Properties`, {
  125 + values: bpmnElementPropertyList.value
  126 + })
  127 + updateElementExtensions(propertiesObject)
  128 + resetAttributesList()
  129 + })
  130 + .catch(() => console.info('操作取消'))
  131 +}
  132 +const saveAttribute = () => {
  133 + console.log(propertyForm.value, 'propertyForm.value')
  134 + const { name, value } = propertyForm.value
  135 + if (editingPropertyIndex.value !== -1) {
  136 + window.bpmnInstances.modeling.updateModdleProperties(
  137 + toRaw(bpmnElement.value),
  138 + toRaw(bpmnElementPropertyList.value)[toRaw(editingPropertyIndex.value)],
  139 + {
  140 + name,
  141 + value
  142 + }
  143 + )
  144 + } else {
  145 + // 新建属性字段
  146 + const newPropertyObject = window.bpmnInstances.moddle.create(`${prefix}:Property`, {
  147 + name,
  148 + value
  149 + })
  150 + // 新建一个属性字段的保存列表
  151 + const propertiesObject = window.bpmnInstances.moddle.create(`${prefix}:Properties`, {
  152 + values: bpmnElementPropertyList.value.concat([newPropertyObject])
  153 + })
  154 + updateElementExtensions(propertiesObject)
  155 + }
  156 + propertyFormModelVisible.value = false
  157 + resetAttributesList()
  158 +}
  159 +const updateElementExtensions = (properties) => {
  160 + const extensions = window.bpmnInstances.moddle.create('bpmn:ExtensionElements', {
  161 + values: otherExtensionList.value.concat([properties])
  162 + })
  163 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  164 + extensionElements: extensions
  165 + })
  166 +}
  167 +
  168 +watch(
  169 + () => props.id,
  170 + (val) => {
  171 + if (val) {
  172 + val && val.length && resetAttributesList()
  173 + }
  174 + },
  175 + { immediate: true }
  176 +)
  177 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/signal-message/SignalAndMessage.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <div class="panel-tab__content--title">
  4 + <span><Icon icon="ep:menu" style="margin-right: 8px; color: #555555" />消息列表</span>
  5 + <XButton type="primary" title="创建新消息" preIcon="ep:plus" @click="openModel('message')" />
  6 + </div>
  7 + <el-table :data="messageList" border>
  8 + <el-table-column type="index" label="序号" width="60px" />
  9 + <el-table-column label="消息ID" prop="id" max-width="300px" show-overflow-tooltip />
  10 + <el-table-column label="消息名称" prop="name" max-width="300px" show-overflow-tooltip />
  11 + </el-table>
  12 + <div
  13 + class="panel-tab__content--title"
  14 + style="padding-top: 8px; margin-top: 8px; border-top: 1px solid #eeeeee"
  15 + >
  16 + <span><Icon icon="ep:menu" style="margin-right: 8px; color: #555555" />信号列表</span>
  17 + <XButton type="primary" title="创建新信号" preIcon="ep:plus" @click="openModel('signal')" />
  18 + </div>
  19 + <el-table :data="signalList" border>
  20 + <el-table-column type="index" label="序号" width="60px" />
  21 + <el-table-column label="信号ID" prop="id" max-width="300px" show-overflow-tooltip />
  22 + <el-table-column label="信号名称" prop="name" max-width="300px" show-overflow-tooltip />
  23 + </el-table>
  24 +
  25 + <el-dialog
  26 + v-model="modelVisible"
  27 + :title="modelConfig.title"
  28 + :close-on-click-modal="false"
  29 + width="400px"
  30 + append-to-body
  31 + destroy-on-close
  32 + >
  33 + <el-form :model="modelObjectForm" label-width="90px">
  34 + <el-form-item :label="modelConfig.idLabel">
  35 + <el-input v-model="modelObjectForm.id" clearable />
  36 + </el-form-item>
  37 + <el-form-item :label="modelConfig.nameLabel">
  38 + <el-input v-model="modelObjectForm.name" clearable />
  39 + </el-form-item>
  40 + </el-form>
  41 + <template #footer>
  42 + <el-button @click="modelVisible = false">取 消</el-button>
  43 + <el-button type="primary" @click="addNewObject">保 存</el-button>
  44 + </template>
  45 + </el-dialog>
  46 + </div>
  47 +</template>
  48 +<script setup lang="ts" name="SignalAndMassage">
  49 +import {
  50 + ElMessage,
  51 + ElDialog,
  52 + ElForm,
  53 + ElFormItem,
  54 + ElTable,
  55 + ElTableColumn,
  56 + ElButton,
  57 + ElInput
  58 +} from 'element-plus'
  59 +import { ref, computed, onMounted } from 'vue'
  60 +const signalList = ref([])
  61 +const messageList = ref([])
  62 +const modelVisible = ref(false)
  63 +const modelType = ref('')
  64 +const modelObjectForm = ref({})
  65 +const rootElements = ref()
  66 +const messageIdMap = ref()
  67 +const signalIdMap = ref()
  68 +const modelConfig = computed(() => {
  69 + if (modelType.value === 'message') {
  70 + return { title: '创建消息', idLabel: '消息ID', nameLabel: '消息名称' }
  71 + } else {
  72 + return { title: '创建信号', idLabel: '信号ID', nameLabel: '信号名称' }
  73 + }
  74 +})
  75 +
  76 +const initDataList = () => {
  77 + console.log(window, 'window')
  78 + rootElements.value = window.bpmnInstances.modeler.getDefinitions().rootElements
  79 + messageIdMap.value = {}
  80 + signalIdMap.value = {}
  81 + messageList.value = []
  82 + signalList.value = []
  83 + rootElements.value.forEach((el) => {
  84 + if (el.$type === 'bpmn:Message') {
  85 + messageIdMap.value[el.id] = true
  86 + messageList.value.push({ ...el })
  87 + }
  88 + if (el.$type === 'bpmn:Signal') {
  89 + signalIdMap.value[el.id] = true
  90 + signalList.value.push({ ...el })
  91 + }
  92 + })
  93 +}
  94 +const openModel = (type) => {
  95 + modelType.value = type
  96 + modelObjectForm.value = {}
  97 + modelVisible.value = true
  98 +}
  99 +const addNewObject = () => {
  100 + if (modelType.value === 'message') {
  101 + if (messageIdMap.value[modelObjectForm.value.id]) {
  102 + ElMessage.error('该消息已存在，请修改id后重新保存')
  103 + }
  104 + const messageRef = window.bpmnInstances.moddle.create('bpmn:Message', modelObjectForm.value)
  105 + rootElements.value.push(messageRef)
  106 + } else {
  107 + if (signalIdMap.value[modelObjectForm.value.id]) {
  108 + ElMessage.error('该信号已存在，请修改id后重新保存')
  109 + }
  110 + const signalRef = window.bpmnInstances.moddle.create('bpmn:Signal', modelObjectForm.value)
  111 + rootElements.value.push(signalRef)
  112 + }
  113 + modelVisible.value = false
  114 + initDataList()
  115 +}
  116 +
  117 +onMounted(() => {
  118 + initDataList()
  119 +})
  120 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/task/ElementTask.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="panel-tab__content">
  3 + <el-form size="small" label-width="90px">
  4 + <el-form-item label="异步延续">
  5 + <el-checkbox
  6 + v-model="taskConfigForm.asyncBefore"
  7 + label="异步前"
  8 + @change="changeTaskAsync"
  9 + />
  10 + <el-checkbox v-model="taskConfigForm.asyncAfter" label="异步后" @change="changeTaskAsync" />
  11 + <el-checkbox
  12 + v-model="taskConfigForm.exclusive"
  13 + v-if="taskConfigForm.asyncAfter || taskConfigForm.asyncBefore"
  14 + label="排除"
  15 + @change="changeTaskAsync"
  16 + />
  17 + </el-form-item>
  18 + <component :is="witchTaskComponent" v-bind="$props" />
  19 + </el-form>
  20 + </div>
  21 +</template>
  22 +
  23 +<script setup lang="ts" name="ElementTaskConfig">
  24 +import { ref, watch, shallowRef } from 'vue'
  25 +import { ElForm, ElFormItem, ElCheckbox } from 'element-plus'
  26 +import UserTask from './task-components/UserTask.vue'
  27 +import ScriptTask from './task-components/ScriptTask.vue'
  28 +import ReceiveTask from './task-components/ReceiveTask.vue'
  29 +
  30 +const props = defineProps({
  31 + id: String,
  32 + type: String
  33 +})
  34 +const taskConfigForm = ref({
  35 + asyncAfter: false,
  36 + asyncBefore: false,
  37 + exclusive: false
  38 +})
  39 +const witchTaskComponent = shallowRef()
  40 +const installedComponent = ref({
  41 + // 手工任务与普通任务一致，不需要其他配置
  42 + // 接收消息任务，需要在全局下插入新的消息实例，并在该节点下的 messageRef 属性绑定该实例
  43 + // 发送任务、服务任务、业务规则任务共用一个相同配置
  44 + UserTask: 'UserTask', // 用户任务配置
  45 + ScriptTask: 'ScriptTask', // 脚本任务配置
  46 + ReceiveTask: 'ReceiveTask' // 消息接收任务
  47 +})
  48 +const bpmnElement = ref()
  49 +
  50 +const changeTaskAsync = () => {
  51 + if (!taskConfigForm.value.asyncBefore && !taskConfigForm.value.asyncAfter) {
  52 + taskConfigForm.value.exclusive = false
  53 + }
  54 + window.bpmnInstances.modeling.updateProperties(window.bpmnInstances.bpmnElement, {
  55 + ...taskConfigForm.value
  56 + })
  57 +}
  58 +
  59 +watch(
  60 + () => props.id,
  61 + () => {
  62 + bpmnElement.value = window.bpmnInstances.bpmnElement
  63 + taskConfigForm.value.asyncBefore = bpmnElement.value?.businessObject?.asyncBefore
  64 + taskConfigForm.value.asyncAfter = bpmnElement.value?.businessObject?.asyncAfter
  65 + taskConfigForm.value.exclusive = bpmnElement.value?.businessObject?.exclusive
  66 + },
  67 + { immediate: true }
  68 +)
  69 +watch(
  70 + () => props.type,
  71 + () => {
  72 + // witchTaskComponent.value = installedComponent.value[props.type]
  73 + if (props.type == installedComponent.value.UserTask) {
  74 + witchTaskComponent.value = UserTask
  75 + }
  76 + if (props.type == installedComponent.value.ScriptTask) {
  77 + witchTaskComponent.value = ScriptTask
  78 + }
  79 + if (props.type == installedComponent.value.ReceiveTask) {
  80 + witchTaskComponent.value = ReceiveTask
  81 + }
  82 + },
  83 + { immediate: true }
  84 +)
  85 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/task/task-components/ReceiveTask.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div style="margin-top: 16px">
  3 + <el-form-item label="消息实例">
  4 + <div
  5 + style="
  6 + display: flex;
  7 + align-items: center;
  8 + justify-content: space-between;
  9 + flex-wrap: nowrap;
  10 + "
  11 + >
  12 + <el-select v-model="bindMessageId" @change="updateTaskMessage">
  13 + <el-option
  14 + v-for="id in Object.keys(messageMap)"
  15 + :value="id"
  16 + :label="messageMap[id]"
  17 + :key="id"
  18 + />
  19 + </el-select>
  20 + <XButton
  21 + type="primary"
  22 + preIcon="ep:plus"
  23 + style="margin-left: 8px"
  24 + @click="openMessageModel"
  25 + />
  26 + </div>
  27 + </el-form-item>
  28 + <el-dialog
  29 + v-model="messageModelVisible"
  30 + :close-on-click-modal="false"
  31 + title="创建新消息"
  32 + width="400px"
  33 + append-to-body
  34 + destroy-on-close
  35 + >
  36 + <el-form :model="newMessageForm" size="small" label-width="90px">
  37 + <el-form-item label="消息ID">
  38 + <el-input v-model="newMessageForm.id" clearable />
  39 + </el-form-item>
  40 + <el-form-item label="消息名称">
  41 + <el-input v-model="newMessageForm.name" clearable />
  42 + </el-form-item>
  43 + </el-form>
  44 + <template #footer>
  45 + <el-button size="small" type="primary" @click="createNewMessage">确 认</el-button>
  46 + </template>
  47 + </el-dialog>
  48 + </div>
  49 +</template>
  50 +
  51 +<script setup lang="ts" name="ReceiveTask">
  52 +import { ref, watch, onBeforeUnmount, onMounted, nextTick, toRaw } from 'vue'
  53 +import { ElMessage, ElFormItem, ElDialog, ElForm, ElSelect, ElOption } from 'element-plus'
  54 +const props = defineProps({
  55 + id: String,
  56 + type: String
  57 +})
  58 +const bindMessageId = ref('')
  59 +const newMessageForm = ref({})
  60 +const messageMap = ref({})
  61 +const messageModelVisible = ref(false)
  62 +const bpmnElement = ref()
  63 +const bpmnMessageRefsMap = ref()
  64 +const bpmnRootElements = ref()
  65 +
  66 +const getBindMessage = () => {
  67 + bpmnElement.value = window.bpmnInstances.bpmnElement
  68 + bindMessageId.value = bpmnElement.value.businessObject?.messageRef?.id || '-1'
  69 +}
  70 +const openMessageModel = () => {
  71 + messageModelVisible.value = true
  72 + newMessageForm.value = {}
  73 +}
  74 +const createNewMessage = () => {
  75 + if (messageMap.value[newMessageForm.value.id]) {
  76 + ElMessage.error('该消息已存在，请修改id后重新保存')
  77 + return
  78 + }
  79 + const newMessage = window.bpmnInstances.moddle.create('bpmn:Message', newMessageForm.value)
  80 + bpmnRootElements.value.push(newMessage)
  81 + messageMap.value[newMessageForm.value.id] = newMessageForm.value.name
  82 + bpmnMessageRefsMap.value[newMessageForm.value.id] = newMessage
  83 + messageModelVisible.value = false
  84 +}
  85 +const updateTaskMessage = (messageId) => {
  86 + if (messageId === '-1') {
  87 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  88 + messageRef: null
  89 + })
  90 + } else {
  91 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  92 + messageRef: bpmnMessageRefsMap.value[messageId]
  93 + })
  94 + }
  95 +}
  96 +
  97 +onMounted(() => {
  98 + bpmnMessageRefsMap.value = Object.create(null)
  99 + bpmnRootElements.value = window.bpmnInstances.modeler.getDefinitions().rootElements
  100 + bpmnRootElements.value
  101 + .filter((el) => el.$type === 'bpmn:Message')
  102 + .forEach((m) => {
  103 + bpmnMessageRefsMap.value[m.id] = m
  104 + messageMap.value[m.id] = m.name
  105 + })
  106 + messageMap.value['-1'] = '无'
  107 +})
  108 +
  109 +onBeforeUnmount(() => {
  110 + bpmnElement.value = null
  111 +})
  112 +watch(
  113 + () => props.id,
  114 + () => {
  115 + bpmnElement.value = window.bpmnInstances.bpmnElement
  116 + nextTick(() => {
  117 + getBindMessage()
  118 + })
  119 + },
  120 + { immediate: true }
  121 +)
  122 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/task/task-components/ScriptTask.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div style="margin-top: 16px">
  3 + <el-form-item label="脚本格式">
  4 + <el-input
  5 + v-model="scriptTaskForm.scriptFormat"
  6 + clearable
  7 + @input="updateElementTask()"
  8 + @change="updateElementTask()"
  9 + />
  10 + </el-form-item>
  11 + <el-form-item label="脚本类型">
  12 + <el-select v-model="scriptTaskForm.scriptType">
  13 + <el-option label="内联脚本" value="inline" />
  14 + <el-option label="外部资源" value="external" />
  15 + </el-select>
  16 + </el-form-item>
  17 + <el-form-item label="脚本" v-show="scriptTaskForm.scriptType === 'inline'">
  18 + <el-input
  19 + v-model="scriptTaskForm.script"
  20 + type="textarea"
  21 + resize="vertical"
  22 + :autosize="{ minRows: 2, maxRows: 4 }"
  23 + clearable
  24 + @input="updateElementTask()"
  25 + @change="updateElementTask()"
  26 + />
  27 + </el-form-item>
  28 + <el-form-item label="资源地址" v-show="scriptTaskForm.scriptType === 'external'">
  29 + <el-input
  30 + v-model="scriptTaskForm.resource"
  31 + clearable
  32 + @input="updateElementTask()"
  33 + @change="updateElementTask()"
  34 + />
  35 + </el-form-item>
  36 + <el-form-item label="结果变量">
  37 + <el-input
  38 + v-model="scriptTaskForm.resultVariable"
  39 + clearable
  40 + @input="updateElementTask()"
  41 + @change="updateElementTask()"
  42 + />
  43 + </el-form-item>
  44 + </div>
  45 +</template>
  46 +
  47 +<script setup lang="ts" name="ScriptTask">
  48 +import { ref, watch, nextTick, onBeforeUnmount, toRaw } from 'vue'
  49 +import { ElInput, ElFormItem } from 'element-plus'
  50 +const props = defineProps({
  51 + id: String,
  52 + type: String
  53 +})
  54 +const defaultTaskForm = ref({
  55 + scriptFormat: '',
  56 + script: '',
  57 + resource: '',
  58 + resultVariable: ''
  59 +})
  60 +const scriptTaskForm = ref({})
  61 +const bpmnElement = ref()
  62 +
  63 +const resetTaskForm = () => {
  64 + for (let key in defaultTaskForm.value) {
  65 + let value = bpmnElement.value?.businessObject[key] || defaultTaskForm.value[key]
  66 + scriptTaskForm.value[key] = value
  67 + }
  68 + scriptTaskForm.value.scriptType = scriptTaskForm.value.script ? 'inline' : 'external'
  69 +}
  70 +const updateElementTask = () => {
  71 + let taskAttr = Object.create(null)
  72 + taskAttr.scriptFormat = scriptTaskForm.value.scriptFormat || null
  73 + taskAttr.resultVariable = scriptTaskForm.value.resultVariable || null
  74 + if (scriptTaskForm.value.scriptType === 'inline') {
  75 + taskAttr.script = scriptTaskForm.value.script || null
  76 + taskAttr.resource = null
  77 + } else {
  78 + taskAttr.resource = scriptTaskForm.value.resource || null
  79 + taskAttr.script = null
  80 + }
  81 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), taskAttr)
  82 +}
  83 +
  84 +onBeforeUnmount(() => {
  85 + bpmnElement.value = null
  86 +})
  87 +
  88 +watch(
  89 + () => props.id,
  90 + () => {
  91 + bpmnElement.value = window.bpmnInstances.bpmnElement
  92 + nextTick(() => {
  93 + resetTaskForm()
  94 + })
  95 + },
  96 + { immediate: true }
  97 +)
  98 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/task/task-components/UserTask.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div style="margin-top: 16px">
  3 + <!-- <el-form-item label="处理用户">-->
  4 + <!-- <el-select v-model="userTaskForm.assignee" @change="updateElementTask('assignee')">-->
  5 + <!-- <el-option v-for="ak in mockData" :key="'ass-' + ak" :label="`用户${ak}`" :value="`user${ak}`" />-->
  6 + <!-- </el-select>-->
  7 + <!-- </el-form-item>-->
  8 + <!-- <el-form-item label="候选用户">-->
  9 + <!-- <el-select v-model="userTaskForm.candidateUsers" multiple collapse-tags @change="updateElementTask('candidateUsers')">-->
  10 + <!-- <el-option v-for="uk in mockData" :key="'user-' + uk" :label="`用户${uk}`" :value="`user${uk}`" />-->
  11 + <!-- </el-select>-->
  12 + <!-- </el-form-item>-->
  13 + <!-- <el-form-item label="候选分组">-->
  14 + <!-- <el-select v-model="userTaskForm.candidateGroups" multiple collapse-tags @change="updateElementTask('candidateGroups')">-->
  15 + <!-- <el-option v-for="gk in mockData" :key="'ass-' + gk" :label="`分组${gk}`" :value="`group${gk}`" />-->
  16 + <!-- </el-select>-->
  17 + <!-- </el-form-item>-->
  18 + <el-form-item label="到期时间">
  19 + <el-input v-model="userTaskForm.dueDate" clearable @change="updateElementTask('dueDate')" />
  20 + </el-form-item>
  21 + <el-form-item label="跟踪时间">
  22 + <el-input
  23 + v-model="userTaskForm.followUpDate"
  24 + clearable
  25 + @change="updateElementTask('followUpDate')"
  26 + />
  27 + </el-form-item>
  28 + <el-form-item label="优先级">
  29 + <el-input v-model="userTaskForm.priority" clearable @change="updateElementTask('priority')" />
  30 + </el-form-item>
  31 + 友情提示：任务的分配规则，使用
  32 + <router-link target="_blank" :to="{ path: '/bpm/manager/model' }"
  33 + ><el-link type="danger">流程模型</el-link>
  34 + </router-link>
  35 + 下的【分配规则】替代，提供指定角色、部门负责人、部门成员、岗位、工作组、自定义脚本等 7
  36 + 种维护的任务分配维度，更加灵活！
  37 + </div>
  38 +</template>
  39 +
  40 +<script setup lang="ts" name="UserTask">
  41 +import { ref, watch, nextTick, onBeforeUnmount, toRaw } from 'vue'
  42 +import { ElLink, ElFormItem, ElInput } from 'element-plus'
  43 +const props = defineProps({
  44 + id: String,
  45 + type: String
  46 +})
  47 +const defaultTaskForm = ref({
  48 + assignee: '',
  49 + candidateUsers: [],
  50 + candidateGroups: [],
  51 + dueDate: '',
  52 + followUpDate: '',
  53 + priority: ''
  54 +})
  55 +const userTaskForm = ref({})
  56 +// const mockData=ref([1, 2, 3, 4, 5, 6, 7, 8, 9, 10])
  57 +const bpmnElement = ref()
  58 +const resetTaskForm = () => {
  59 + for (let key in defaultTaskForm.value) {
  60 + let value
  61 + if (key === 'candidateUsers' || key === 'candidateGroups') {
  62 + value = bpmnElement.value?.businessObject[key]
  63 + ? bpmnElement.value.businessObject[key].split(',')
  64 + : []
  65 + } else {
  66 + value = bpmnElement.value?.businessObject[key] || defaultTaskForm.value[key]
  67 + }
  68 + userTaskForm.value[key] = value
  69 + }
  70 +}
  71 +const updateElementTask = (key) => {
  72 + const taskAttr = Object.create(null)
  73 + if (key === 'candidateUsers' || key === 'candidateGroups') {
  74 + taskAttr[key] =
  75 + userTaskForm.value[key] && userTaskForm.value[key].length
  76 + ? userTaskForm.value[key].join()
  77 + : null
  78 + } else {
  79 + taskAttr[key] = userTaskForm.value[key] || null
  80 + }
  81 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), taskAttr)
  82 +}
  83 +
  84 +watch(
  85 + () => props.id,
  86 + () => {
  87 + bpmnElement.value = window.bpmnInstances.bpmnElement
  88 + nextTick(() => {
  89 + resetTaskForm()
  90 + })
  91 + },
  92 + { immediate: true }
  93 +)
  94 +onBeforeUnmount(() => {
  95 + bpmnElement.value = null
  96 +})
  97 +</script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/theme/element-variables.scss 0 → 100644
  View file @5bedff6
  1 +/* 改变主题色变量 */
  2 +$--color-primary: #1890ff;
  3 +$--color-danger: #ff4d4f;
  4 +
  5 +/* 改变 icon 字体路径变量，必需 */
  6 +$--font-path: '~element-ui/lib/theme-chalk/fonts';
  7 +
  8 +@import "~element-ui/packages/theme-chalk/src/index";
  9 +
  10 +.el-table td,
  11 +.el-table th {
  12 + color: #333;
  13 +}
  14 +.el-drawer__header {
  15 + padding: 16px 16px 8px 16px;
  16 + margin: 0;
  17 + line-height: 24px;
  18 + font-size: 18px;
  19 + color: #303133;
  20 + box-sizing: border-box;
  21 + border-bottom: 1px solid #e8e8e8;
  22 +}
  23 +div[class^="el-drawer"]:focus,
  24 +span:focus {
  25 + outline: none;
  26 +}
  27 +.el-drawer__body {
  28 + box-sizing: border-box;
  29 + padding: 16px;
  30 + width: 100%;
  31 + overflow-y: auto;
  32 +}
  33 +
  34 +.el-dialog {
  35 + margin-top: 50vh !important;
  36 + transform: translateY(-50%);
  37 + overflow: hidden;
  38 +}
  39 +.el-dialog__wrapper {
  40 + overflow: hidden;
  41 + max-height: 100vh;
  42 +}
  43 +.el-dialog__header {
  44 + padding: 16px 16px 8px 16px;
  45 + box-sizing: border-box;
  46 + border-bottom: 1px solid #e8e8e8;
  47 +}
  48 +.el-dialog__body {
  49 + padding: 16px;
  50 + max-height: 80vh;
  51 + box-sizing: border-box;
  52 + overflow-y: auto;
  53 +}
  54 +.el-dialog__footer {
  55 + padding: 16px;
  56 + box-sizing: border-box;
  57 + border-top: 1px solid #e8e8e8;
  58 +}
  59 +.el-dialog__close {
  60 + font-weight: 600;
  61 +}
  62 +.el-select {
  63 + width: 100%;
  64 +}
  65 +.el-divider:not(.el-divider--horizontal) {
  66 + margin: 0 8px ;
  67 +}
  68 +.el-divider.el-divider--horizontal {
  69 + margin: 16px 0;
  70 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/theme/index.scss 0 → 100644
  View file @5bedff6
  1 +@import "./process-designer.scss";
  2 +@import "./process-panel.scss";
0 3 \ No newline at end of file
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/theme/process-designer.scss 0 → 100644
  View file @5bedff6
  1 +@import 'bpmn-js-token-simulation/assets/css/bpmn-js-token-simulation.css';
  2 +@import 'bpmn-js-token-simulation/assets/css/font-awesome.min.css';
  3 +@import 'bpmn-js-token-simulation/assets/css/normalize.css';
  4 +
  5 +// 边框被 token-simulation 样式覆盖了
  6 +.djs-palette {
  7 + background: var(--palette-background-color);
  8 + border: solid 1px var(--palette-border-color) !important;
  9 + border-radius: 2px;
  10 +}
  11 +
  12 +.my-process-designer {
  13 + display: flex;
  14 + flex-direction: column;
  15 + width: 100%;
  16 + height: 100%;
  17 + box-sizing: border-box;
  18 + .my-process-designer__header {
  19 + width: 100%;
  20 + min-height: 36px;
  21 + .el-button {
  22 + text-align: center;
  23 + }
  24 + .el-button-group {
  25 + margin: 4px;
  26 + }
  27 + .el-tooltip__popper {
  28 + .el-button {
  29 + width: 100%;
  30 + text-align: left;
  31 + padding-left: 8px;
  32 + padding-right: 8px;
  33 + }
  34 + .el-button:hover {
  35 + background: rgba(64, 158, 255, 0.8);
  36 + color: #ffffff;
  37 + }
  38 + }
  39 + .align {
  40 + position: relative;
  41 + i {
  42 + &:after {
  43 + content: '|';
  44 + position: absolute;
  45 + // transform: rotate(90deg) translate(200%, 60%);
  46 + transform: rotate(180deg) translate(271%, -10%);
  47 + }
  48 + }
  49 + }
  50 + .align.align-left i {
  51 + transform: rotate(90deg);
  52 + }
  53 + .align.align-right i {
  54 + transform: rotate(-90deg);
  55 + }
  56 + .align.align-top i {
  57 + transform: rotate(180deg);
  58 + }
  59 + .align.align-bottom i {
  60 + transform: rotate(0deg);
  61 + }
  62 + .align.align-center i {
  63 + transform: rotate(0deg);
  64 + &:after {
  65 + // transform: rotate(90deg) translate(0, 60%);
  66 + transform: rotate(0deg) translate(-0%, -5%);
  67 + }
  68 + }
  69 + .align.align-middle i {
  70 + transform: rotate(-90deg);
  71 + &:after {
  72 + // transform: rotate(90deg) translate(0, 60%);
  73 + transform: rotate(0deg) translate(0, -10%);
  74 + }
  75 + }
  76 + }
  77 + .my-process-designer__container {
  78 + display: inline-flex;
  79 + width: 100%;
  80 + flex: 1;
  81 + .my-process-designer__canvas {
  82 + flex: 1;
  83 + height: 100%;
  84 + position: relative;
  85 + background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHBhdHRlcm4gaWQ9ImEiIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgcGF0dGVyblVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHBhdGggZD0iTTAgMTBoNDBNMTAgMHY0ME0wIDIwaDQwTTIwIDB2NDBNMCAzMGg0ME0zMCAwdjQwIiBmaWxsPSJub25lIiBzdHJva2U9IiNlMGUwZTAiIG9wYWNpdHk9Ii4yIi8+PHBhdGggZD0iTTQwIDBIMHY0MCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTBlMGUwIi8+PC9wYXR0ZXJuPjwvZGVmcz48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+')
  86 + repeat !important;
  87 + div.toggle-mode {
  88 + display: none;
  89 + }
  90 + }
  91 + .my-process-designer__property-panel {
  92 + height: 100%;
  93 + overflow: scroll;
  94 + overflow-y: auto;
  95 + z-index: 10;
  96 + * {
  97 + box-sizing: border-box;
  98 + }
  99 + }
  100 + svg {
  101 + width: 100%;
  102 + height: 100%;
  103 + min-height: 100%;
  104 + overflow: hidden;
  105 + }
  106 + }
  107 +}
  108 +
  109 +//侧边栏配置
  110 +// .djs-palette .two-column .open {
  111 +.open {
  112 + // .djs-palette.open {
  113 + .djs-palette-entries {
  114 + div[class^='bpmn-icon-']:before,
  115 + div[class*='bpmn-icon-']:before {
  116 + line-height: unset;
  117 + }
  118 + div.entry {
  119 + position: relative;
  120 + }
  121 + div.entry:hover {
  122 + &::after {
  123 + width: max-content;
  124 + content: attr(title);
  125 + vertical-align: text-bottom;
  126 + position: absolute;
  127 + right: -10px;
  128 + top: 0;
  129 + bottom: 0;
  130 + overflow: hidden;
  131 + transform: translateX(100%);
  132 + font-size: 0.5em;
  133 + display: inline-block;
  134 + text-decoration: inherit;
  135 + font-variant: normal;
  136 + text-transform: none;
  137 + background: #fafafa;
  138 + box-shadow: 0 0 6px #eeeeee;
  139 + border: 1px solid #cccccc;
  140 + box-sizing: border-box;
  141 + padding: 0 16px;
  142 + border-radius: 4px;
  143 + z-index: 100;
  144 + }
  145 + }
  146 + }
  147 +}
  148 +pre {
  149 + margin: 0;
  150 + height: 100%;
  151 + overflow: hidden;
  152 + max-height: calc(80vh - 32px);
  153 + overflow-y: auto;
  154 +}
  155 +.hljs {
  156 + word-break: break-word;
  157 + white-space: pre-wrap;
  158 +}
  159 +.hljs * {
  160 + font-family: Consolas, Monaco, monospace;
  161 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/theme/process-panel.scss 0 → 100644
  View file @5bedff6
  1 +.process-panel__container {
  2 + box-sizing: border-box;
  3 + padding: 0 8px;
  4 + border-left: 1px solid #eeeeee;
  5 + box-shadow: 0 0 8px #cccccc;
  6 + max-height: 100%;
  7 + overflow-y: scroll;
  8 +}
  9 +.panel-tab__title {
  10 + font-weight: 600;
  11 + padding: 0 8px;
  12 + font-size: 1.1em;
  13 + line-height: 1.2em;
  14 + i {
  15 + margin-right: 8px;
  16 + font-size: 1.2em;
  17 + }
  18 +}
  19 +.panel-tab__content {
  20 + width: 100%;
  21 + box-sizing: border-box;
  22 + border-top: 1px solid #eeeeee;
  23 + padding: 8px 16px;
  24 + .panel-tab__content--title {
  25 + display: flex;
  26 + justify-content: space-between;
  27 + padding-bottom: 8px;
  28 + span {
  29 + flex: 1;
  30 + text-align: left;
  31 + }
  32 + }
  33 +}
  34 +.element-property {
  35 + width: 100%;
  36 + display: flex;
  37 + align-items: flex-start;
  38 + margin: 8px 0;
  39 + .element-property__label {
  40 + display: block;
  41 + width: 90px;
  42 + text-align: right;
  43 + overflow: hidden;
  44 + padding-right: 12px;
  45 + line-height: 32px;
  46 + font-size: 14px;
  47 + box-sizing: border-box;
  48 + }
  49 + .element-property__value {
  50 + flex: 1;
  51 + line-height: 32px;
  52 + }
  53 + .el-form-item {
  54 + width: 100%;
  55 + margin-bottom: 0;
  56 + padding-bottom: 18px;
  57 + }
  58 +}
  59 +.list-property {
  60 + flex-direction: column;
  61 + .element-listener-item {
  62 + width: 100%;
  63 + display: inline-grid;
  64 + grid-template-columns: 16px auto 32px 32px;
  65 + grid-column-gap: 8px;
  66 + }
  67 + .element-listener-item + .element-listener-item {
  68 + margin-top: 8px;
  69 + }
  70 +}
  71 +.listener-filed__title {
  72 + display: inline-flex;
  73 + width: 100%;
  74 + justify-content: space-between;
  75 + align-items: center;
  76 + margin-top: 0;
  77 + span {
  78 + width: 200px;
  79 + text-align: left;
  80 + font-size: 14px;
  81 + }
  82 + i {
  83 + margin-right: 8px;
  84 + }
  85 +}
  86 +.element-drawer__button {
  87 + margin-top: 8px;
  88 + width: 100%;
  89 + display: inline-flex;
  90 + justify-content: space-around;
  91 +}
  92 +.element-drawer__button > .el-button {
  93 + width: 100%;
  94 +}
  95 +
  96 +.el-collapse-item__content {
  97 + padding-bottom: 0;
  98 +}
  99 +.el-input.is-disabled .el-input__inner {
  100 + color: #999999;
  101 +}
  102 +.el-form-item.el-form-item--mini {
  103 + margin-bottom: 0;
  104 + & + .el-form-item {
  105 + margin-top: 16px;
  106 + }
  107 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/utils.ts 0 → 100644
  View file @5bedff6
  1 +import { toRaw } from 'vue'
  2 +// 创建监听器实例
  3 +export function createListenerObject(options, isTask, prefix) {
  4 + const listenerObj = Object.create(null)
  5 + listenerObj.event = options.event
  6 + isTask && (listenerObj.id = options.id) // 任务监听器特有的 id 字段
  7 + switch (options.listenerType) {
  8 + case 'scriptListener':
  9 + listenerObj.script = createScriptObject(options, prefix)
  10 + break
  11 + case 'expressionListener':
  12 + listenerObj.expression = options.expression
  13 + break
  14 + case 'delegateExpressionListener':
  15 + listenerObj.delegateExpression = options.delegateExpression
  16 + break
  17 + default:
  18 + listenerObj.class = options.class
  19 + }
  20 + // 注入字段
  21 + if (options.fields) {
  22 + listenerObj.fields = options.fields.map((field) => {
  23 + return createFieldObject(field, prefix)
  24 + })
  25 + }
  26 + // 任务监听器的 定时器 设置
  27 + if (isTask && options.event === 'timeout' && !!options.eventDefinitionType) {
  28 + const timeDefinition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', {
  29 + body: options.eventTimeDefinitions
  30 + })
  31 + const TimerEventDefinition = window.bpmnInstances.moddle.create('bpmn:TimerEventDefinition', {
  32 + id: `TimerEventDefinition_${uuid(8)}`,
  33 + [`time${options.eventDefinitionType.replace(/^\S/, (s) => s.toUpperCase())}`]: timeDefinition
  34 + })
  35 + listenerObj.eventDefinitions = [TimerEventDefinition]
  36 + }
  37 + return window.bpmnInstances.moddle.create(
  38 + `${prefix}:${isTask ? 'TaskListener' : 'ExecutionListener'}`,
  39 + listenerObj
  40 + )
  41 +}
  42 +
  43 +// 创建 监听器的注入字段 实例
  44 +export function createFieldObject(option, prefix) {
  45 + const { name, fieldType, string, expression } = option
  46 + const fieldConfig = fieldType === 'string' ? { name, string } : { name, expression }
  47 + return window.bpmnInstances.moddle.create(`${prefix}:Field`, fieldConfig)
  48 +}
  49 +
  50 +// 创建脚本实例
  51 +export function createScriptObject(options, prefix) {
  52 + const { scriptType, scriptFormat, value, resource } = options
  53 + const scriptConfig =
  54 + scriptType === 'inlineScript' ? { scriptFormat, value } : { scriptFormat, resource }
  55 + return window.bpmnInstances.moddle.create(`${prefix}:Script`, scriptConfig)
  56 +}
  57 +
  58 +// 更新元素扩展属性
  59 +export function updateElementExtensions(element, extensionList) {
  60 + const extensions = window.bpmnInstances.moddle.create('bpmn:ExtensionElements', {
  61 + values: extensionList
  62 + })
  63 + window.bpmnInstances.modeling.updateProperties(toRaw(element), {
  64 + extensionElements: extensions
  65 + })
  66 +}
  67 +
  68 +// 创建一个id
  69 +export function uuid(length = 8, chars) {
  70 + let result = ''
  71 + const charsString = chars || '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'
  72 + for (let i = length; i > 0; --i) {
  73 + result += charsString[Math.floor(Math.random() * charsString.length)]
  74 + }
  75 + return result
  76 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/highlight/index.js 0 → 100644
  View file @5bedff6
  1 +const hljs = require("highlight.js/lib/core");
  2 +hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml"));
  3 +hljs.registerLanguage("json", require("highlight.js/lib/languages/json"));
  4 +
  5 +module.exports = hljs;
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/modules/custom-renderer/CustomRenderer.js 0 → 100644
  View file @5bedff6
  1 +import BpmnRenderer from "bpmn-js/lib/draw/BpmnRenderer";
  2 +
  3 +export default function CustomRenderer(config, eventBus, styles, pathMap, canvas, textRenderer) {
  4 + BpmnRenderer.call(this, config, eventBus, styles, pathMap, canvas, textRenderer, 2000);
  5 +
  6 + this.handlers["label"] = function() {
  7 + return null;
  8 + };
  9 +}
  10 +
  11 +const F = function() {}; // 核心，利用空对象作为中介；
  12 +F.prototype = BpmnRenderer.prototype; // 核心，将父类的原型赋值给空对象F；
  13 +CustomRenderer.prototype = new F(); // 核心，将 F的实例赋值给子类；
  14 +CustomRenderer.prototype.constructor = CustomRenderer; // 修复子类CustomRenderer的构造器指向，防止原型链的混乱；
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/modules/custom-renderer/index.js 0 → 100644
  View file @5bedff6
  1 +import CustomRenderer from "./CustomRenderer";
  2 +
  3 +export default {
  4 + __init__: ["customRenderer"],
  5 + customRenderer: ["type", CustomRenderer]
  6 +};
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/modules/rules/CustomRules.js 0 → 100644
  View file @5bedff6
  1 +import BpmnRules from "bpmn-js/lib/features/rules/BpmnRules";
  2 +import inherits from "inherits";
  3 +
  4 +export default function CustomRules(eventBus) {
  5 + BpmnRules.call(this, eventBus);
  6 +}
  7 +
  8 +inherits(CustomRules, BpmnRules);
  9 +
  10 +CustomRules.prototype.canDrop = function() {
  11 + return false;
  12 +};
  13 +
  14 +CustomRules.prototype.canMove = function() {
  15 + return false;
  16 +};
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/modules/rules/index.js 0 → 100644
  View file @5bedff6
  1 +import CustomRules from "./CustomRules";
  2 +
  3 +export default {
  4 + __init__: ["customRules"],
  5 + customRules: ["type", CustomRules]
  6 +};
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/translations.ts 0 → 100644
  View file @5bedff6
  1 +/**
  2 + * This is a sample file that should be replaced with the actual translation.
  3 + *
  4 + * Checkout https://github.com/bpmn-io/bpmn-js-i18n for a list of available
  5 + * translations and labels to translate.
  6 + */
  7 +export default {
  8 + 'Exclusive Gateway': 'Exklusives Gateway',
  9 + 'Parallel Gateway': 'Paralleles Gateway',
  10 + 'Inclusive Gateway': 'Inklusives Gateway',
  11 + 'Complex Gateway': 'Komplexes Gateway',
  12 + 'Event based Gateway': 'Ereignis-basiertes Gateway',
  13 + 'Message Start Event': '消息启动事件',
  14 + 'Timer Start Event': '定时启动事件',
  15 + 'Conditional Start Event': '条件启动事件',
  16 + 'Signal Start Event': '信号启动事件',
  17 + 'Error Start Event': '错误启动事件',
  18 + 'Escalation Start Event': '升级启动事件',
  19 + 'Compensation Start Event': '补偿启动事件',
  20 + 'Message Start Event (non-interrupting)': '消息启动事件 (非中断)',
  21 + 'Timer Start Event (non-interrupting)': '定时启动事件 (非中断)',
  22 + 'Conditional Start Event (non-interrupting)': '条件启动事件 (非中断)',
  23 + 'Signal Start Event (non-interrupting)': '信号启动事件 (非中断)',
  24 + 'Escalation Start Event (non-interrupting)': '升级启动事件 (非中断)'
  25 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/utils/directive/clickOutSide.js 0 → 100644
  View file @5bedff6
  1 +//outside.js
  2 +
  3 +const ctx = "@@clickoutsideContext";
  4 +
  5 +export default {
  6 + bind(el, binding, vnode) {
  7 + const ele = el;
  8 + const documentHandler = e => {
  9 + if (!vnode.context || ele.contains(e.target)) {
  10 + return false;
  11 + }
  12 + // 调用指令回调
  13 + if (binding.expression) {
  14 + vnode.context[el[ctx].methodName](e);
  15 + } else {
  16 + el[ctx].bindingFn(e);
  17 + }
  18 + };
  19 + // 将方法添加到ele
  20 + ele[ctx] = {
  21 + documentHandler,
  22 + methodName: binding.expression,
  23 + bindingFn: binding.value
  24 + };
  25 +
  26 + setTimeout(() => {
  27 + document.addEventListener("touchstart", documentHandler); // 为document绑定事件
  28 + });
  29 + },
  30 + update(el, binding) {
  31 + const ele = el;
  32 + ele[ctx].methodName = binding.expression;
  33 + ele[ctx].bindingFn = binding.value;
  34 + },
  35 + unbind(el) {
  36 + document.removeEventListener("touchstart", el[ctx].documentHandler); // 解绑
  37 + delete el[ctx];
  38 + }
  39 +};
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/utils/index.js 0 → 100644
  View file @5bedff6
  1 +export function debounce(fn, delay = 500) {
  2 + let timer;
  3 + return function(...args) {
  4 + if (timer) {
  5 + clearTimeout(timer);
  6 + timer = null;
  7 + }
  8 + timer = setTimeout(fn.bind(this, ...args), delay);
  9 + };
  10 +}
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/utils/log.js 0 → 100644
  View file @5bedff6
  1 +class Log {
  2 + static type = ["primary", "success", "warn", "error", "info"];
  3 +
  4 + static typeColor(type = "default") {
  5 + let color = "";
  6 + switch (type) {
  7 + case "primary":
  8 + color = "#2d8cf0";
  9 + break;
  10 + case "success":
  11 + color = "#19be6b";
  12 + break;
  13 + case "info":
  14 + color = "#909399";
  15 + break;
  16 + case "warn":
  17 + color = "#ff9900";
  18 + break;
  19 + case "error":
  20 + color = "#f03f14";
  21 + break;
  22 + case "default":
  23 + color = "#35495E";
  24 + break;
  25 + default:
  26 + color = type;
  27 + break;
  28 + }
  29 + return color;
  30 + }
  31 +
  32 + static print(text, type = "default", back = false) {
  33 + if (typeof text === "object") {
  34 + // 如果是對象則調用打印對象方式
  35 + console.dir(text);
  36 + return;
  37 + }
  38 + if (back) {
  39 + // 如果是打印帶背景圖的
  40 + console.log(`%c ${text} `, `background:${this.typeColor(type)}; padding: 2px; border-radius: 4px;color: #fff;`);
  41 + } else {
  42 + console.log(`%c ${text} `, `color: ${this.typeColor(type)};`);
  43 + }
  44 + }
  45 +
  46 + static pretty(title, text, type = "primary") {
  47 + if (typeof text === "object") {
  48 + console.log(
  49 + `%c ${title} %c`,
  50 + `background:${this.typeColor(type)};border:1px solid ${this.typeColor(type)}; padding: 1px; border-radius: 4px 0 0 4px; color: #fff;`
  51 + );
  52 + console.dir(text);
  53 + return;
  54 + }
  55 + console.log(
  56 + `%c ${title} %c ${text} %c`,
  57 + `background:${this.typeColor(type)};border:1px solid ${this.typeColor(type)}; padding: 1px; border-radius: 4px 0 0 4px; color: #fff;`,
  58 + `border:1px solid ${this.typeColor(type)}; padding: 1px; border-radius: 0 4px 4px 0; color: ${this.typeColor(type)};`,
  59 + "background:transparent"
  60 + );
  61 + }
  62 +}
  63 +export default Log;
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/src/utils/xml2json.js 0 → 100644
  View file @5bedff6
  1 +function xmlStr2XmlObj(xmlStr) {
  2 + let xmlObj = {};
  3 + if (document.all) {
  4 + const xmlDom = new window.ActiveXObject("Microsoft.XMLDOM");
  5 + xmlDom.loadXML(xmlStr);
  6 + xmlObj = xmlDom;
  7 + } else {
  8 + xmlObj = new DOMParser().parseFromString(xmlStr, "text/xml");
  9 + }
  10 + return xmlObj;
  11 +}
  12 +
  13 +function xml2json(xml) {
  14 + try {
  15 + let obj = {};
  16 + if (xml.children.length > 0) {
  17 + for (let i = 0; i < xml.children.length; i++) {
  18 + const item = xml.children.item(i);
  19 + const nodeName = item.nodeName;
  20 + if (typeof obj[nodeName] == "undefined") {
  21 + obj[nodeName] = xml2json(item);
  22 + } else {
  23 + if (typeof obj[nodeName].push == "undefined") {
  24 + const old = obj[nodeName];
  25 + obj[nodeName] = [];
  26 + obj[nodeName].push(old);
  27 + }
  28 + obj[nodeName].push(xml2json(item));
  29 + }
  30 + }
  31 + } else {
  32 + obj = xml.textContent;
  33 + }
  34 + return obj;
  35 + } catch (e) {
  36 + console.log(e.message);
  37 + }
  38 +}
  39 +
  40 +function xmlObj2json(xml) {
  41 + const xmlObj = xmlStr2XmlObj(xml);
  42 + console.log(xmlObj);
  43 + let jsonObj = {};
  44 + if (xmlObj.childNodes.length > 0) {
  45 + jsonObj = xml2json(xmlObj);
  46 + }
  47 + return jsonObj;
  48 +}
  49 +
  50 +export default xmlObj2json;
... ...
yudao-ui-admin-vue3/src/main.ts
  View file @5bedff6
... ... @@ -42,6 +42,16 @@ import &#39;./permission&#39;
42 42  
43 43 import { isDevMode } from '@/utils/env'
44 44  
  45 +import { MyPD } from '@/components/bpmnProcessDesigner/package/index.js'
  46 +import '@/components/bpmnProcessDesigner/package/theme/index.scss'
  47 +import 'bpmn-js/dist/assets/diagram-js.css'
  48 +import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
  49 +import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
  50 +import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
  51 +
  52 +import hljs from 'highlight.js' //导入代码高亮文件
  53 +import 'highlight.js/styles/github-gist.css' //导入代码高亮样式
  54 +
45 55 // 本地开发模式 全局引入 element-plus 样式，加快第一次进入速度
46 56 if (isDevMode()) {
47 57 console.info(isDevMode())
... ... @@ -52,8 +62,18 @@ if (isDevMode()) {
52 62 const setupAll = async () => {
53 63 const app = createApp(App)
54 64  
  65 + //自定义一个代码高亮指令
  66 + app.directive('highlight', function (el) {
  67 + const blocks = el.querySelectorAll('code')
  68 + blocks.forEach((block: any) => {
  69 + hljs.highlightBlock(block)
  70 + })
  71 + })
  72 +
55 73 await setupI18n(app)
56 74  
  75 + MyPD(app)
  76 +
57 77 setupStore(app)
58 78  
59 79 setupGlobCom(app)
... ...
yudao-ui-admin-vue3/src/router/modules/remaining.ts
  View file @5bedff6
... ... @@ -211,6 +211,18 @@ const remainingRouter: AppRouteRecordRaw[] = [
211 211 }
212 212 },
213 213 {
  214 + path: '/manager/model/edit',
  215 + component: () => import('@/views/bpm/model/modelEditor.vue'),
  216 + name: 'modelEditor',
  217 + meta: {
  218 + noCache: true,
  219 + hidden: true,
  220 + canTo: true,
  221 + title: '设计流程',
  222 + activeMenu: 'bpm/manager/model/design'
  223 + }
  224 + },
  225 + {
214 226 path: '/manager/definition',
215 227 component: () => import('@/views/bpm/definition/index.vue'),
216 228 name: 'BpmProcessDefinitionList',
... ...
yudao-ui-admin-vue3/src/types/auto-components.d.ts
  View file @5bedff6
... ... @@ -21,26 +21,29 @@ declare module &#39;@vue/runtime-core&#39; {
21 21 DictTag: typeof import('./../components/DictTag/src/DictTag.vue')['default']
22 22 Echart: typeof import('./../components/Echart/src/Echart.vue')['default']
23 23 Editor: typeof import('./../components/Editor/src/Editor.vue')['default']
24   - ElAvatar: typeof import('element-plus/es')['ElAvatar']
25 24 ElBadge: typeof import('element-plus/es')['ElBadge']
26 25 ElButton: typeof import('element-plus/es')['ElButton']
27 26 ElCard: typeof import('element-plus/es')['ElCard']
28   - ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
29 27 ElCol: typeof import('element-plus/es')['ElCol']
30 28 ElCollapseTransition: typeof import('element-plus/es')['ElCollapseTransition']
31 29 ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
32 30 ElDescriptions: typeof import('element-plus/es')['ElDescriptions']
33 31 ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
34   - ElDialog: typeof import('element-plus/es')['ElDialog']
35 32 ElDivider: typeof import('element-plus/es')['ElDivider']
36 33 ElDrawer: typeof import('element-plus/es')['ElDrawer']
37 34 ElDropdown: typeof import('element-plus/es')['ElDropdown']
38 35 ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
39 36 ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
  37 + ElementBaseInfo: typeof import('./../components/bpmnProcessDesigner/package/penal/base/ElementBaseInfo.vue')['default']
  38 + ElementForm: typeof import('./../components/bpmnProcessDesigner/package/penal/form/ElementForm.vue')['default']
  39 + ElementListeners: typeof import('./../components/bpmnProcessDesigner/package/penal/listeners/ElementListeners.vue')['default']
  40 + ElementMultiInstance: typeof import('./../components/bpmnProcessDesigner/package/penal/multi-instance/ElementMultiInstance.vue')['default']
  41 + ElementOtherConfig: typeof import('./../components/bpmnProcessDesigner/package/penal/other/ElementOtherConfig.vue')['default']
  42 + ElementProperties: typeof import('./../components/bpmnProcessDesigner/package/penal/properties/ElementProperties.vue')['default']
  43 + ElementTask: typeof import('./../components/bpmnProcessDesigner/package/penal/task/ElementTask.vue')['default']
40 44 ElForm: typeof import('element-plus/es')['ElForm']
41 45 ElFormItem: typeof import('element-plus/es')['ElFormItem']
42 46 ElIcon: typeof import('element-plus/es')['ElIcon']
43   - ElImage: typeof import('element-plus/es')['ElImage']
44 47 ElImageViewer: typeof import('element-plus/es')['ElImageViewer']
45 48 ElInput: typeof import('element-plus/es')['ElInput']
46 49 ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
... ... @@ -51,24 +54,19 @@ declare module &#39;@vue/runtime-core&#39; {
51 54 ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
52 55 ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
53 56 ElRow: typeof import('element-plus/es')['ElRow']
54   - ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
55 57 ElSelect: typeof import('element-plus/es')['ElSelect']
56 58 ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
57   - ElSpace: typeof import('element-plus/es')['ElSpace']
58 59 ElSwitch: typeof import('element-plus/es')['ElSwitch']
59   - ElTable: typeof import('element-plus/es')['ElTable']
60 60 ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
61 61 ElTabPane: typeof import('element-plus/es')['ElTabPane']
62 62 ElTabs: typeof import('element-plus/es')['ElTabs']
63 63 ElTag: typeof import('element-plus/es')['ElTag']
64   - ElTimeline: typeof import('element-plus/es')['ElTimeline']
65   - ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
66 64 ElTooltip: typeof import('element-plus/es')['ElTooltip']
67   - ElTransfer: typeof import('element-plus/es')['ElTransfer']
68 65 ElTree: typeof import('element-plus/es')['ElTree']
69 66 ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
70 67 ElUpload: typeof import('element-plus/es')['ElUpload']
71 68 Error: typeof import('./../components/Error/src/Error.vue')['default']
  69 + FlowCondition: typeof import('./../components/bpmnProcessDesigner/package/penal/flow-condition/FlowCondition.vue')['default']
72 70 Form: typeof import('./../components/Form/src/Form.vue')['default']
73 71 Highlight: typeof import('./../components/Highlight/src/Highlight.vue')['default']
74 72 Icon: typeof import('./../components/Icon/src/Icon.vue')['default']
... ... @@ -77,16 +75,25 @@ declare module &#39;@vue/runtime-core&#39; {
77 75 ImageViewer: typeof import('./../components/ImageViewer/src/ImageViewer.vue')['default']
78 76 Infotip: typeof import('./../components/Infotip/src/Infotip.vue')['default']
79 77 InputPassword: typeof import('./../components/InputPassword/src/InputPassword.vue')['default']
  78 + ProcessDesigner: typeof import('./../components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue')['default']
  79 + ProcessPalette: typeof import('./../components/bpmnProcessDesigner/package/palette/ProcessPalette.vue')['default']
  80 + ProcessViewer: typeof import('./../components/bpmnProcessDesigner/package/designer/ProcessViewer.vue')['default']
  81 + PropertiesPanel: typeof import('./../components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue')['default']
80 82 Qrcode: typeof import('./../components/Qrcode/src/Qrcode.vue')['default']
  83 + ReceiveTask: typeof import('./../components/bpmnProcessDesigner/package/penal/task/task-components/ReceiveTask.vue')['default']
81 84 RouterLink: typeof import('vue-router')['RouterLink']
82 85 RouterView: typeof import('vue-router')['RouterView']
  86 + ScriptTask: typeof import('./../components/bpmnProcessDesigner/package/penal/task/task-components/ScriptTask.vue')['default']
83 87 Search: typeof import('./../components/Search/src/Search.vue')['default']
  88 + SignalAndMessage: typeof import('./../components/bpmnProcessDesigner/package/penal/signal-message/SignalAndMessage.vue')['default']
84 89 Sticky: typeof import('./../components/Sticky/src/Sticky.vue')['default']
85 90 Table: typeof import('./../components/Table/src/Table.vue')['default']
86 91 Tooltip: typeof import('./../components/Tooltip/src/Tooltip.vue')['default']
87 92 UploadFile: typeof import('./../components/UploadFile/src/UploadFile.vue')['default']
88 93 UploadImg: typeof import('./../components/UploadFile/src/UploadImg.vue')['default']
89 94 UploadImgs: typeof import('./../components/UploadFile/src/UploadImgs.vue')['default']
  95 + UserTask: typeof import('./../components/bpmnProcessDesigner/package/penal/task/task-components/UserTask.vue')['default']
  96 + UserTaskListeners: typeof import('./../components/bpmnProcessDesigner/package/penal/listeners/UserTaskListeners.vue')['default']
90 97 Verify: typeof import('./../components/Verifition/src/Verify.vue')['default']
91 98 VerifyPoints: typeof import('./../components/Verifition/src/Verify/VerifyPoints.vue')['default']
92 99 VerifySlide: typeof import('./../components/Verifition/src/Verify/VerifySlide.vue')['default']
... ...
yudao-ui-admin-vue3/src/views/bpm/model/modelEditor.vue 0 → 100644
  View file @5bedff6
  1 +<template>
  2 + <div class="app-container">
  3 + <!-- 流程设计器，负责绘制流程等 -->
  4 + <!-- <myProcessDesigner -->
  5 + <my-process-designer
  6 + :key="`designer-${reloadIndex}`"
  7 + v-if="xmlString != undefined"
  8 + v-model="xmlString"
  9 + :value="xmlString"
  10 + v-bind="controlForm"
  11 + keyboard
  12 + ref="processDesigner"
  13 + @init-finished="initModeler"
  14 + :additionalModel="controlForm.additionalModel"
  15 + @save="save"
  16 + />
  17 + <!-- 流程属性器，负责编辑每个流程节点的属性 -->
  18 + <!-- <MyProcessPalette -->
  19 + <my-properties-panel
  20 + :key="`penal-${reloadIndex}`"
  21 + :bpmnModeler="modeler"
  22 + :prefix="controlForm.prefix"
  23 + class="process-panel"
  24 + :model="model"
  25 + />
  26 + </div>
  27 +</template>
  28 +
  29 +<script setup lang="ts">
  30 +import { ref, onMounted } from 'vue'
  31 +// import { translations } from '@/components/bpmnProcessDesigner/src/translations'
  32 +// 自定义元素选中时的弹出菜单（修改 默认任务 为 用户任务）
  33 +import CustomContentPadProvider from '@/components/bpmnProcessDesigner/package/designer/plugins/content-pad'
  34 +// 自定义左侧菜单（修改 默认任务 为 用户任务）
  35 +import CustomPaletteProvider from '@/components/bpmnProcessDesigner/package/designer/plugins/palette'
  36 +// import xmlObj2json from "./utils/xml2json";
  37 +// import myProcessDesigner from '@/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue'
  38 +// import MyProcessPalette from '@/components/bpmnProcessDesigner/package/palette/ProcessPalette.vue'
  39 +import { createModelApi, getModelApi, updateModelApi } from '@/api/bpm/model'
  40 +
  41 +import { useRouter } from 'vue-router'
  42 +import { ElMessage } from 'element-plus'
  43 +const router = useRouter()
  44 +
  45 +// 自定义侧边栏
  46 +// import MyProcessPanel from "../package/process-panel/ProcessPanel";
  47 +
  48 +const xmlString = ref(undefined) // BPMN XML
  49 +const modeler = ref(null)
  50 +const reloadIndex = ref(0)
  51 +// const controlDrawerVisible = ref(false)
  52 +// const translationsSelf = translations
  53 +const controlForm = ref({
  54 + simulation: true,
  55 + labelEditing: false,
  56 + labelVisible: false,
  57 + prefix: 'flowable',
  58 + headerButtonSize: 'mini',
  59 + additionalModel: [CustomContentPadProvider, CustomPaletteProvider]
  60 +})
  61 +// const addis = ref({
  62 +// CustomContentPadProvider,
  63 +// CustomPaletteProvider
  64 +// })
  65 +// 流程模型的信息
  66 +const model = ref({})
  67 +onMounted(() => {
  68 + // 如果 modelId 非空，说明是修改流程模型
  69 + const modelId = router.currentRoute.value.query && router.currentRoute.value.query.modelId
  70 + console.log(modelId, 'modelId')
  71 + if (modelId) {
  72 + // let data = '4b4909d8-97e7-11ec-8e20-862bc1a4a054'
  73 + getModelApi(modelId).then((response) => {
  74 + console.log(response, 'response')
  75 + xmlString.value = response.data.bpmnXml
  76 + model.value = {
  77 + ...response.data,
  78 + bpmnXml: undefined // 清空 bpmnXml 属性
  79 + }
  80 + // this.controlForm.processId = response.data.key
  81 +
  82 + // xmlString.value =
  83 + // '<?xml version="1.0" encoding="UTF-8"?>\n<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" id="diagram_Process_1645980650311" targetNamespace="http://activiti.org/bpmn"><bpmn2:process id="flowable_01" name="flowable测试" isExecutable="true"><bpmn2:startEvent id="Event_1iruxim"><bpmn2:outgoing>Flow_0804gmo</bpmn2:outgoing></bpmn2:startEvent><bpmn2:userTask id="task01" name="task01"><bpmn2:incoming>Flow_0804gmo</bpmn2:incoming><bpmn2:outgoing>Flow_0cx479x</bpmn2:outgoing></bpmn2:userTask><bpmn2:sequenceFlow id="Flow_0804gmo" sourceRef="Event_1iruxim" targetRef="task01" /><bpmn2:endEvent id="Event_1mdsccz"><bpmn2:incoming>Flow_0cx479x</bpmn2:incoming></bpmn2:endEvent><bpmn2:sequenceFlow id="Flow_0cx479x" sourceRef="task01" targetRef="Event_1mdsccz" /></bpmn2:process><bpmndi:BPMNDiagram id="BPMNDiagram_1"><bpmndi:BPMNPlane id="flowable_01_di" bpmnElement="flowable_01"><bpmndi:BPMNEdge id="Flow_0cx479x_di" bpmnElement="Flow_0cx479x"><di:waypoint x="440" y="350" /><di:waypoint x="492" y="350" /></bpmndi:BPMNEdge><bpmndi:BPMNEdge id="Flow_0804gmo_di" bpmnElement="Flow_0804gmo"><di:waypoint x="288" y="350" /><di:waypoint x="340" y="350" /></bpmndi:BPMNEdge><bpmndi:BPMNShape id="Event_1iruxim_di" bpmnElement="Event_1iruxim"><dc:Bounds x="252" y="332" width="36" height="36" /></bpmndi:BPMNShape><bpmndi:BPMNShape id="task01_di" bpmnElement="task01"><dc:Bounds x="340" y="310" width="100" height="80" /></bpmndi:BPMNShape><bpmndi:BPMNShape id="Event_1mdsccz_di" bpmnElement="Event_1mdsccz"><dc:Bounds x="492" y="332" width="36" height="36" /></bpmndi:BPMNShape></bpmndi:BPMNPlane></bpmndi:BPMNDiagram></bpmn2:definitions>'
  84 +
  85 + // model.value = {
  86 + // key: 'flowable_01',
  87 + // name: 'flowable测试',
  88 + // description: 'ooxx',
  89 + // category: '1',
  90 + // formType: 10,
  91 + // formId: 11,
  92 + // formCustomCreatePath: null,
  93 + // formCustomViewPath: null,
  94 + // id: '4b4909d8-97e7-11ec-8e20-862bc1a4a054',
  95 + // createTime: 1645978019795,
  96 + // bpmnXml: undefined // 清空 bpmnXml 属性
  97 + // }
  98 + // console.log(modeler.value, 'modeler11111111')
  99 + })
  100 + }
  101 +})
  102 +const initModeler = (item) => {
  103 + setTimeout(() => {
  104 + modeler.value = item
  105 + console.log(item, 'initModeler方法modeler')
  106 + console.log(modeler.value, 'initModeler方法modeler')
  107 + // controlForm.value.prefix = '2222'
  108 + }, 10)
  109 +}
  110 +
  111 +const save = (bpmnXml) => {
  112 + const data = {
  113 + ...model.value,
  114 + bpmnXml: bpmnXml // this.bpmnXml 只是初始化流程图，后续修改无法通过它获得
  115 + }
  116 + console.log(data, 'data')
  117 +
  118 + // 修改的提交
  119 + if (data.id) {
  120 + updateModelApi(data).then((response) => {
  121 + console.log(response, 'response')
  122 + // this.$modal.msgSuccess("修改成功")
  123 + ElMessage.success('修改成功')
  124 +
  125 + // 跳转回去
  126 + close()
  127 + })
  128 + return
  129 + }
  130 + // 添加的提交
  131 + createModelApi(data).then((response) => {
  132 + console.log(response, 'response1')
  133 + // this.$modal.msgSuccess("保存成功")
  134 + ElMessage.success('保存成功')
  135 + // 跳转回去
  136 + close()
  137 + })
  138 +}
  139 +/** 关闭按钮 */
  140 +const close = () => {
  141 + // this.$tab.closeOpenPage({ path: "/bpm/manager/model" })
  142 + router.push({ path: '/bpm/manager/model' })
  143 +}
  144 +</script>
  145 +
  146 +<style lang="scss">
  147 +//body {
  148 +// overflow: hidden;
  149 +// margin: 0;
  150 +// box-sizing: border-box;
  151 +//}
  152 +//.app {
  153 +// width: 100%;
  154 +// height: 100%;
  155 +// box-sizing: border-box;
  156 +// display: inline-grid;
  157 +// grid-template-columns: 100px auto max-content;
  158 +//}
  159 +.demo-control-bar {
  160 + position: fixed;
  161 + right: 8px;
  162 + bottom: 8px;
  163 + z-index: 1;
  164 + .open-control-dialog {
  165 + width: 48px;
  166 + height: 48px;
  167 + display: flex;
  168 + align-items: center;
  169 + justify-content: center;
  170 + border-radius: 4px;
  171 + font-size: 32px;
  172 + background: rgba(64, 158, 255, 1);
  173 + color: #ffffff;
  174 + cursor: pointer;
  175 + }
  176 +}
  177 +
  178 +// TODO 芋艿：去掉多余的 faq
  179 +//.info-tip {
  180 +// position: fixed;
  181 +// top: 40px;
  182 +// right: 500px;
  183 +// z-index: 10;
  184 +// color: #999999;
  185 +//}
  186 +
  187 +.control-form {
  188 + .el-radio {
  189 + width: 100%;
  190 + line-height: 32px;
  191 + }
  192 +}
  193 +.element-overlays {
  194 + box-sizing: border-box;
  195 + padding: 8px;
  196 + background: rgba(0, 0, 0, 0.6);
  197 + border-radius: 4px;
  198 + color: #fafafa;
  199 +}
  200 +
  201 +.my-process-designer {
  202 + height: calc(100vh - 84px);
  203 +}
  204 +.process-panel__container {
  205 + position: absolute;
  206 + right: 0;
  207 + top: 55px;
  208 + height: calc(100vh - 84px);
  209 +}
  210 +</style>
... ...
yudao-ui-admin/src/components/bpmnProcessDesigner/package/penal/base/ElementBaseInfo.vue
  View file @5bedff6
1 1 <template>
2 2 <div class="panel-tab__content">
3   - <el-form size="mini" label-width="90px" :model="model" :rules="rules" @submit.native.prevent>
4   - <div v-if="elementBaseInfo.$type === 'bpmn:Process'"> <!-- 如果是 Process 信息的时候，使用自定义表单 -->
5   - <el-link href="https://doc.iocoder.cn/bpm/#_3-%E6%B5%81%E7%A8%8B%E5%9B%BE%E7%A4%BA%E4%BE%8B"
6   - type="danger" target="_blank">如何实现实现会签、或签？</el-link>
  3 + <el-form
  4 + size="mini"
  5 + label-width="90px"
  6 + :model="model"
  7 + :rules="rules"
  8 + @submit.native.prevent
  9 + >
  10 + <div v-if="elementBaseInfo.$type === 'bpmn:Process'">
  11 + <!-- 如果是 Process 信息的时候，使用自定义表单 -->
  12 + <el-link
  13 + href="https://doc.iocoder.cn/bpm/#_3-%E6%B5%81%E7%A8%8B%E5%9B%BE%E7%A4%BA%E4%BE%8B"
  14 + type="danger"
  15 + target="_blank"
  16 + >如何实现实现会签、或签？</el-link
  17 + >
7 18 <el-form-item label="流程标识" prop="key">
8   - <el-input v-model="model.key" placeholder="请输入流标标识"
9   - :disabled="model.id !== undefined && model.id.length > 0" @change="handleKeyUpdate" />
  19 + <el-input
  20 + v-model="model.key"
  21 + placeholder="请输入流标标识"
  22 + :disabled="model.id !== undefined && model.id.length > 0"
  23 + @change="handleKeyUpdate"
  24 + />
10 25 </el-form-item>
11 26 <el-form-item label="流程名称" prop="name">
12   - <el-input v-model="model.name" placeholder="请输入流程名称" clearable @change="handleNameUpdate" />
  27 + <el-input
  28 + v-model="model.name"
  29 + placeholder="请输入流程名称"
  30 + clearable
  31 + @change="handleNameUpdate"
  32 + />
13 33 </el-form-item>
14 34 </div>
15 35 <div v-else>
16 36 <el-form-item label="ID">
17   - <el-input v-model="elementBaseInfo.id" clearable @change="updateBaseInfo('id')"/>
  37 + <el-input
  38 + v-model="elementBaseInfo.id"
  39 + clearable
  40 + @change="updateBaseInfo('id')"
  41 + />
18 42 </el-form-item>
19 43 <el-form-item label="名称">
20   - <el-input v-model="elementBaseInfo.name" clearable @change="updateBaseInfo('name')" />
  44 + <el-input
  45 + v-model="elementBaseInfo.name"
  46 + clearable
  47 + @change="updateBaseInfo('name')"
  48 + />
21 49 </el-form-item>
22 50 </div>
23 51 </el-form>
... ... @@ -31,7 +59,7 @@ export default {
31 59 businessObject: Object,
32 60 model: Object, // 流程模型的数据
33 61 },
34   - data() {
  62 + data () {
35 63 return {
36 64 elementBaseInfo: {},
37 65 // 流程表单的下拉框的数据
... ... @@ -41,14 +69,14 @@ export default {
41 69 key: [{ required: true, message: "流程标识不能为空", trigger: "blur" }],
42 70 name: [{ required: true, message: "流程名称不能为空", trigger: "blur" }],
43 71 },
44   - };
  72 + }
45 73 },
46 74 watch: {
47 75 businessObject: {
48 76 immediate: false,
49   - handler: function(val) {
  77 + handler: function (val) {
50 78 if (val) {
51   - this.$nextTick(() => this.resetBaseInfo());
  79 + this.$nextTick(() => this.resetBaseInfo())
52 80 }
53 81 }
54 82 },
... ... @@ -59,7 +87,7 @@ export default {
59 87 // }
60 88 // }
61 89 },
62   - created() {
  90 + created () {
63 91 // 针对上传的 bpmn 流程图时，需要延迟 1 秒的时间，保证 key 和 name 的更新
64 92 setTimeout(() => {
65 93 this.handleKeyUpdate(this.model.key)
... ... @@ -67,53 +95,53 @@ export default {
67 95 }, 1000)
68 96 },
69 97 methods: {
70   - resetBaseInfo() {
71   - this.bpmnElement = window?.bpmnInstances?.bpmnElement;
72   - this.elementBaseInfo = JSON.parse(JSON.stringify(this.bpmnElement.businessObject));
  98 + resetBaseInfo () {
  99 + this.bpmnElement = window?.bpmnInstances?.bpmnElement
  100 + this.elementBaseInfo = JSON.parse(JSON.stringify(this.bpmnElement.businessObject))
73 101 },
74   - handleKeyUpdate(value) {
  102 + handleKeyUpdate (value) {
75 103 // 校验 value 的值，只有 XML NCName 通过的情况下，才进行赋值。否则，会导致流程图报错，无法绘制的问题
76 104 if (!value) {
77   - return;
  105 + return
78 106 }
79 107 if (!value.match(/[a-zA-Z_][\-_.0-9a-zA-Z$]*/)) {
80   - console.log('key 不满足 XML NCName 规则，所以不进行赋值');
81   - return;
  108 + console.log('key 不满足 XML NCName 规则，所以不进行赋值')
  109 + return
82 110 }
83   - console.log('key 满足 XML NCName 规则，所以进行赋值');
  111 + console.log('key 满足 XML NCName 规则，所以进行赋值')
84 112  
85 113 // 在 BPMN 的 XML 中，流程标识 key，其实对应的是 id 节点
86   - this.elementBaseInfo['id'] = value;
87   - this.updateBaseInfo('id');
  114 + this.elementBaseInfo['id'] = value
  115 + this.updateBaseInfo('id')
88 116 },
89   - handleNameUpdate(value) {
  117 + handleNameUpdate (value) {
90 118 if (!value) {
91 119 return
92 120 }
93   - this.elementBaseInfo['name'] = value;
94   - this.updateBaseInfo('name');
  121 + this.elementBaseInfo['name'] = value
  122 + this.updateBaseInfo('name')
95 123 },
96   - handleDescriptionUpdate(value) {
  124 + handleDescriptionUpdate (value) {
97 125 // TODO 芋艿：documentation 暂时无法修改，后续在看看
98 126 // this.elementBaseInfo['documentation'] = value;
99 127 // this.updateBaseInfo('documentation');
100 128 },
101   - updateBaseInfo(key) {
  129 + updateBaseInfo (key) {
102 130 // 触发 elementBaseInfo 对应的字段
103   - const attrObj = Object.create(null);
104   - attrObj[key] = this.elementBaseInfo[key];
  131 + const attrObj = Object.create(null)
  132 + attrObj[key] = this.elementBaseInfo[key]
105 133 if (key === "id") {
106 134 window.bpmnInstances.modeling.updateProperties(this.bpmnElement, {
107 135 id: this.elementBaseInfo[key],
108 136 di: { id: `${this.elementBaseInfo[key]}_di` }
109   - });
  137 + })
110 138 } else {
111   - window.bpmnInstances.modeling.updateProperties(this.bpmnElement, attrObj);
  139 + window.bpmnInstances.modeling.updateProperties(this.bpmnElement, attrObj)
112 140 }
113 141 }
114 142 },
115   - beforeDestroy() {
116   - this.bpmnElement = null;
  143 + beforeDestroy () {
  144 + this.bpmnElement = null
117 145 }
118 146 };
119 147 </script>
... ...