BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 3ce663c7a5894e193fc0c57567840ff46eca2db6

Authored by gexinzhineng/gxzn27
1 parent a03f702f

bug

Inline Side-by-side
Showing 9 changed files with 89 additions and 63 deletions
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
  View file @3ce663c
... ... @@ -7,22 +7,24 @@
7 7 <XButton preIcon="ep:folder-opened" title="打开文件" @click="refFile.click()" />
8 8 <el-tooltip effect="light" placement="bottom">
9 9 <template #content>
10   - <XButton type="text" title="下载为XML文件" @click="downloadProcessAsXml()" />
11   - <br />
  10 + <div style="color: #409eff">
  11 + <el-button link @click="downloadProcessAsXml()">下载为XML文件</el-button>
  12 + <br />
12 13  
13   - <XButton type="text" title="下载为SVG文件" @click="downloadProcessAsSvg()" />
14   - <br />
  14 + <el-button link @click="downloadProcessAsSvg()">下载为SVG文件</el-button>
  15 + <br />
15 16  
16   - <XButton type="text" title="下载为BPMN文件" @click="downloadProcessAsBpmn()" />
  17 + <el-button link @click="downloadProcessAsBpmn()">下载为BPMN文件</el-button>
  18 + </div>
17 19 </template>
18 20 <XButton title="下载文件" preIcon="ep:download" />
19 21 </el-tooltip>
20 22 <el-tooltip effect="light">
21 23 <XButton preIcon="ep:view" title="浏览" />
22 24 <template #content>
23   - <el-button type="text" @click="previewProcessXML">预览XML</el-button>
  25 + <el-button link @click="previewProcessXML">预览XML</el-button>
24 26 <br />
25   - <el-button type="text" @click="previewProcessJson">预览JSON</el-button>
  27 + <el-button link @click="previewProcessJson">预览JSON</el-button>
26 28 </template>
27 29 </el-tooltip>
28 30 <el-tooltip
... ... @@ -594,10 +596,9 @@ const elementsAlign = (align) =&gt; {
594 596 const Align = bpmnModeler.get('alignElements')
595 597 const Selection = bpmnModeler.get('selection')
596 598 const SelectedElements = Selection.get()
597   - console.log(SelectedElements, 'SelectedElements')
598 599 if (!SelectedElements || SelectedElements.length <= 1) {
599 600 ElMessage.warning('请按住 Shift 键选择多个元素对齐')
600   - // alert('请按住 Ctrl 键选择多个元素对齐')
  601 + // alert('请按住 Ctrl 键选择多个元素对齐
601 602 return
602 603 }
603 604 ElMessageBox.confirm('自动对齐可能造成图形变形，是否继续？', '警告', {
... ... @@ -636,7 +637,10 @@ const previewProcessJson = () =&gt; {
636 637 }
637 638 /* ------------------------------------------------ 芋道源码 methods ------------------------------------------------------ */
638 639 const processSave = async () => {
  640 + console.log(bpmnModeler, 'bpmnModelerbpmnModelerbpmnModelerbpmnModeler')
639 641 const { err, xml } = await bpmnModeler.saveXML()
  642 + console.log(err, 'errerrerrerrerr')
  643 + console.log(xml, 'xmlxmlxmlxmlxml')
640 644 // 读取异常时抛出异常
641 645 if (err) {
642 646 // this.$modal.msgError('保存模型失败，请重试！')
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue
  View file @3ce663c
... ... @@ -89,7 +89,7 @@ const props = defineProps({
89 89 },
90 90 width: {
91 91 type: Number,
92   - default: 500
  92 + default: 480
93 93 },
94 94 idEditDisabled: {
95 95 type: Boolean,
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/base/ElementBaseInfo.vue
  View file @3ce663c
... ... @@ -45,7 +45,7 @@ const props = defineProps({
45 45 model: Object // 流程模型的数据
46 46 })
47 47 const needProps = ref({})
48   -const bpmnElement = ref()
  48 +let bpmnElement
49 49 const elementBaseInfo = ref({})
50 50 // 流程表单的下拉框的数据
51 51 // const forms = ref([])
... ... @@ -59,10 +59,10 @@ const resetBaseInfo = () =&gt; {
59 59 console.log(window, 'window')
60 60 console.log(bpmnElement, 'bpmnElement')
61 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
  62 + bpmnElement = window?.bpmnInstances?.bpmnElement
  63 + console.log(bpmnElement, 'resetBaseInfo11111111111')
  64 + elementBaseInfo.value = bpmnElement.businessObject
  65 + needProps.value['type'] = bpmnElement.businessObject.$type
66 66 // elementBaseInfo.value['typess'] = bpmnElement.value.businessObject.$type
67 67  
68 68 // elementBaseInfo.value = JSON.parse(JSON.stringify(bpmnElement.value.businessObject))
... ... @@ -113,15 +113,15 @@ const updateBaseInfo = (key) =&gt; {
113 113 if (key === 'id') {
114 114 console.log('jinru')
115 115 console.log(window, 'window')
116   - console.log(bpmnElement.value, 'bpmnElement')
117   - console.log(toRaw(bpmnElement.value), 'bpmnElement')
118   - window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  116 + console.log(bpmnElement, 'bpmnElement')
  117 + console.log(toRaw(bpmnElement), 'bpmnElement')
  118 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement), {
119 119 id: elementBaseInfo.value[key],
120 120 di: { id: `${elementBaseInfo.value[key]}_di` }
121 121 })
122 122 } else {
123 123 console.log(attrObj, 'attrObj')
124   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, attrObj)
  124 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement), attrObj)
125 125 }
126 126 }
127 127 onMounted(() => {
... ... @@ -165,6 +165,6 @@ watch(
165 165 // }
166 166 // }
167 167 onBeforeUnmount(() => {
168   - bpmnElement.value = null
  168 + bpmnElement = null
169 169 })
170 170 </script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/listeners/ElementListeners.vue
  View file @3ce663c
... ... @@ -11,13 +11,12 @@
11 11 />
12 12 <el-table-column label="操作" width="90px">
13 13 <template #default="scope">
14   - <el-button size="small" type="text" @click="openListenerForm(scope.row, scope.$index)"
  14 + <el-button size="small" @click="openListenerForm(scope.row, scope.$index)"
15 15 >编辑</el-button
16 16 >
17 17 <el-divider direction="vertical" />
18 18 <el-button
19 19 size="small"
20   - type="text"
21 20 style="color: #ff4d4f"
22 21 @click="removeListener(scope.row, scope.$index)"
23 22 >移除</el-button
... ... @@ -395,10 +394,15 @@ const saveListenerConfig = async () =&gt; {
395 394 bpmnElement.value.businessObject?.extensionElements?.values?.filter(
396 395 (ex) => ex.$type !== `${prefix}:ExecutionListener`
397 396 ) ?? []
398   - // updateElementExtensions(
399   - // bpmnElement.value,
400   - // otherExtensionList.value.concat(bpmnElementListeners.value)
401   - // )
  397 + console.log(bpmnElement.value.height, 'bpmnElement.value')
  398 + console.log(
  399 + otherExtensionList.value.concat(bpmnElementListeners.value),
  400 + 'otherExtensionList.value.concat(bpmnElementListeners.value).value'
  401 + )
  402 + updateElementExtensions(
  403 + bpmnElement.value,
  404 + otherExtensionList.value.concat(bpmnElementListeners.value)
  405 + )
402 406 // 4. 隐藏侧边栏
403 407 listenerFormModelVisible.value = false
404 408 listenerForm.value = {}
... ... @@ -407,6 +411,7 @@ const saveListenerConfig = async () =&gt; {
407 411 watch(
408 412 () => props.id,
409 413 (val) => {
  414 + console.log(val, 'propsId变化')
410 415 val &&
411 416 val.length &&
412 417 nextTick(() => {
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/other/ElementOtherConfig.vue
  View file @3ce663c
... ... @@ -25,13 +25,16 @@ const props = defineProps({
25 25 const documentation = ref('')
26 26 const bpmnElement = ref()
27 27 const updateDocumentation = () => {
28   - ;(bpmnElement.value && bpmnElement.value.id === props.id) ||
29   - (bpmnElement.value = window.bpmnInstances.elementRegistry.get(props.id))
30   - const documentation = window.bpmnInstances.bpmnFactory.create('bpmn:Documentation', {
  28 + if (bpmnElement.value && bpmnElement.value.id === props.id) {
  29 + bpmnElement.value = window.bpmnInstances.elementRegistry.get(props.id)
  30 + }
  31 + // (bpmnElement.value && bpmnElement.value.id === props.id) ||
  32 + // (bpmnElement.value = window.bpmnInstances.elementRegistry.get(props.id))
  33 + const documentations = window.bpmnInstances.bpmnFactory.create('bpmn:Documentation', {
31 34 text: documentation.value
32 35 })
33 36 window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
34   - documentation: [documentation]
  37 + documentation: [documentations]
35 38 })
36 39 }
37 40 onBeforeUnmount(() => {
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/properties/ElementProperties.vue
  View file @3ce663c
... ... @@ -6,12 +6,14 @@
6 6 <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />
7 7 <el-table-column label="操作" width="90px">
8 8 <template #default="scope">
9   - <el-button type="text" @click="openAttributesForm(scope, scope.$index)">编辑</el-button>
  9 + <el-button type="text" @click="openAttributesForm(scope.row, scope.$index)"
  10 + >编辑</el-button
  11 + >
10 12 <el-divider direction="vertical" />
11 13 <el-button
12 14 type="text"
13 15 style="color: #ff4d4f"
14   - @click="removeAttributes(scope, scope.$index)"
  16 + @click="removeAttributes(scope.roww, scope.$index)"
15 17 >移除</el-button
16 18 >
17 19 </template>
... ... @@ -84,10 +86,10 @@ const resetAttributesList = () =&gt; {
84 86 otherExtensionList.value = [] // 其他扩展配置
85 87 bpmnElementProperties.value =
86 88 bpmnElement.value.businessObject?.extensionElements?.values?.filter((ex) => {
87   - if (ex.$type !== `${prefix.value}:Properties`) {
  89 + if (ex.$type !== `${prefix}:Properties`) {
88 90 otherExtensionList.value.push(ex)
89 91 }
90   - return ex.$type === `${prefix.value}:Properties`
  92 + return ex.$type === `${prefix}:Properties`
91 93 }) ?? []
92 94  
93 95 // 保存所有的 扩展属性字段
... ... @@ -116,7 +118,7 @@ const removeAttributes = (attr, index) =&gt; {
116 118 elementPropertyList.value.splice(index, 1)
117 119 bpmnElementPropertyList.value.splice(index, 1)
118 120 // 新建一个属性字段的保存列表
119   - const propertiesObject = window.bpmnInstances.moddle.create(`${prefix.value}:Properties`, {
  121 + const propertiesObject = window.bpmnInstances.moddle.create(`${prefix}:Properties`, {
120 122 values: bpmnElementPropertyList.value
121 123 })
122 124 updateElementExtensions(propertiesObject)
... ... @@ -125,8 +127,8 @@ const removeAttributes = (attr, index) =&gt; {
125 127 .catch(() => console.info('操作取消'))
126 128 }
127 129 const saveAttribute = () => {
  130 + console.log(propertyForm.value, 'propertyForm.value')
128 131 const { name, value } = propertyForm.value
129   - console.log(bpmnElementPropertyList.value)
130 132 if (editingPropertyIndex.value !== -1) {
131 133 window.bpmnInstances.modeling.updateModdleProperties(
132 134 bpmnElement.value,
... ... @@ -138,12 +140,12 @@ const saveAttribute = () =&gt; {
138 140 )
139 141 } else {
140 142 // 新建属性字段
141   - const newPropertyObject = window.bpmnInstances.moddle.create(`${prefix.value}:Property`, {
  143 + const newPropertyObject = window.bpmnInstances.moddle.create(`${prefix}:Property`, {
142 144 name,
143 145 value
144 146 })
145 147 // 新建一个属性字段的保存列表
146   - const propertiesObject = window.bpmnInstances.moddle.create(`${prefix.value}:Properties`, {
  148 + const propertiesObject = window.bpmnInstances.moddle.create(`${prefix}:Properties`, {
147 149 values: bpmnElementPropertyList.value.concat([newPropertyObject])
148 150 })
149 151 updateElementExtensions(propertiesObject)
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/utils.js renamed to yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/utils.ts
  View file @3ce663c
1 1 // 创建监听器实例
2   -export function createListenerObject (options, isTask, prefix) {
  2 +export function createListenerObject(options, isTask, prefix) {
3 3 const listenerObj = Object.create(null)
4 4 listenerObj.event = options.event
5 5 isTask && (listenerObj.id = options.id) // 任务监听器特有的 id 字段
6 6 switch (options.listenerType) {
7   - case "scriptListener":
  7 + case 'scriptListener':
8 8 listenerObj.script = createScriptObject(options, prefix)
9 9 break
10   - case "expressionListener":
  10 + case 'expressionListener':
11 11 listenerObj.expression = options.expression
12 12 break
13   - case "delegateExpressionListener":
  13 + case 'delegateExpressionListener':
14 14 listenerObj.delegateExpression = options.delegateExpression
15 15 break
16 16 default:
... ... @@ -18,54 +18,59 @@ export function createListenerObject (options, isTask, prefix) {
18 18 }
19 19 // 注入字段
20 20 if (options.fields) {
21   - listenerObj.fields = options.fields.map(field => {
  21 + listenerObj.fields = options.fields.map((field) => {
22 22 return createFieldObject(field, prefix)
23 23 })
24 24 }
25 25 // 任务监听器的 定时器 设置
26   - if (isTask && options.event === "timeout" && !!options.eventDefinitionType) {
27   - const timeDefinition = window.bpmnInstances.moddle.create("bpmn:FormalExpression", { body: options.eventTimeDefinitions })
28   - const TimerEventDefinition = window.bpmnInstances.moddle.create("bpmn:TimerEventDefinition", {
  26 + if (isTask && options.event === 'timeout' && !!options.eventDefinitionType) {
  27 + const timeDefinition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', {
  28 + body: options.eventTimeDefinitions
  29 + })
  30 + const TimerEventDefinition = window.bpmnInstances.moddle.create('bpmn:TimerEventDefinition', {
29 31 id: `TimerEventDefinition_${uuid(8)}`,
30   - [`time${options.eventDefinitionType.replace(/^\S/, s => s.toUpperCase())}`]: timeDefinition
  32 + [`time${options.eventDefinitionType.replace(/^\S/, (s) => s.toUpperCase())}`]: timeDefinition
31 33 })
32 34 listenerObj.eventDefinitions = [TimerEventDefinition]
33 35 }
34   - return window.bpmnInstances.moddle.create(`${prefix}:${isTask ? "TaskListener" : "ExecutionListener"}`, listenerObj)
  36 + return window.bpmnInstances.moddle.create(
  37 + `${prefix}:${isTask ? 'TaskListener' : 'ExecutionListener'}`,
  38 + listenerObj
  39 + )
35 40 }
36 41  
37 42 // 创建 监听器的注入字段 实例
38   -export function createFieldObject (option, prefix) {
  43 +export function createFieldObject(option, prefix) {
39 44 const { name, fieldType, string, expression } = option
40   - const fieldConfig = fieldType === "string" ? { name, string } : { name, expression }
  45 + const fieldConfig = fieldType === 'string' ? { name, string } : { name, expression }
41 46 return window.bpmnInstances.moddle.create(`${prefix}:Field`, fieldConfig)
42 47 }
43 48  
44 49 // 创建脚本实例
45   -export function createScriptObject (options, prefix) {
  50 +export function createScriptObject(options, prefix) {
46 51 const { scriptType, scriptFormat, value, resource } = options
47   - const scriptConfig = scriptType === "inlineScript" ? { scriptFormat, value } : { scriptFormat, resource }
  52 + const scriptConfig =
  53 + scriptType === 'inlineScript' ? { scriptFormat, value } : { scriptFormat, resource }
48 54 return window.bpmnInstances.moddle.create(`${prefix}:Script`, scriptConfig)
49 55 }
50 56  
51 57 // 更新元素扩展属性
52   -export function updateElementExtensions (element, extensionList) {
53   - console.log(element, 'element')
54   - console.log(extensionList, 'extensionList')
55   - const extensions = window.bpmnInstances.moddle.create("bpmn:ExtensionElements", {
  58 +export function updateElementExtensions(element, extensionList) {
  59 + const extensions = window.bpmnInstances.moddle.create('bpmn:ExtensionElements', {
56 60 values: extensionList
57 61 })
58   - console.log(extensions, 'extensionsextensions')
59   - console.log(window.bpmnInstances.modeling, 'window.bpmnInstances.modeling')
  62 + console.log(element, 'elementelementelementelement')
  63 + console.log(extensions.values, 'extensionsextensionsextensions')
60 64 window.bpmnInstances.modeling.updateProperties(element, {
61 65 extensionElements: extensions.values
62 66 })
  67 + console.log('ssss')
63 68 }
64 69  
65 70 // 创建一个id
66   -export function uuid (length = 8, chars) {
67   - let result = ""
68   - let charsString = chars || "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ"
  71 +export function uuid(length = 8, chars) {
  72 + let result = ''
  73 + const charsString = chars || '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'
69 74 for (let i = length; i > 0; --i) {
70 75 result += charsString[Math.floor(Math.random() * charsString.length)]
71 76 }
... ...
yudao-ui-admin-vue3/src/types/auto-components.d.ts
  View file @3ce663c
... ... @@ -46,10 +46,12 @@ declare module &#39;@vue/runtime-core&#39; {
46 46 ElIcon: typeof import('element-plus/es')['ElIcon']
47 47 ElImageViewer: typeof import('element-plus/es')['ElImageViewer']
48 48 ElInput: typeof import('element-plus/es')['ElInput']
  49 + ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
49 50 ElLink: typeof import('element-plus/es')['ElLink']
50 51 ElOption: typeof import('element-plus/es')['ElOption']
51 52 ElPopover: typeof import('element-plus/es')['ElPopover']
52 53 ElRadio: typeof import('element-plus/es')['ElRadio']
  54 + ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
53 55 ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
54 56 ElRow: typeof import('element-plus/es')['ElRow']
55 57 ElSelect: typeof import('element-plus/es')['ElSelect']
... ... @@ -60,6 +62,7 @@ declare module &#39;@vue/runtime-core&#39; {
60 62 ElTabs: typeof import('element-plus/es')['ElTabs']
61 63 ElTag: typeof import('element-plus/es')['ElTag']
62 64 ElTooltip: typeof import('element-plus/es')['ElTooltip']
  65 + ElTree: typeof import('element-plus/es')['ElTree']
63 66 ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
64 67 ElUpload: typeof import('element-plus/es')['ElUpload']
65 68 Error: typeof import('./../components/Error/src/Error.vue')['default']
... ...
yudao-ui-admin-vue3/src/views/bpm/model/modelEditor.vue
  View file @3ce663c
... ... @@ -27,7 +27,7 @@
27 27 </template>
28 28  
29 29 <script setup lang="ts">
30   -import { ref, onMounted } from 'vue'
  30 +import { ref, onMounted, onBeforeMount } from 'vue'
31 31 // import { translations } from '@/components/bpmnProcessDesigner/src/translations'
32 32 // 自定义元素选中时的弹出菜单（修改 默认任务 为 用户任务）
33 33 import CustomContentPadProvider from '@/components/bpmnProcessDesigner/package/designer/plugins/content-pad'
... ... @@ -39,7 +39,7 @@ import CustomPaletteProvider from &#39;@/components/bpmnProcessDesigner/package/desi
39 39 import { createModelApi, getModelApi, updateModelApi } from '@/api/bpm/model'
40 40  
41 41 import { useRouter } from 'vue-router'
42   -import { onBeforeMount } from 'vue'
  42 +import { ElMessage } from 'element-plus'
43 43 const router = useRouter()
44 44  
45 45 // 自定义侧边栏
... ... @@ -115,12 +115,15 @@ const save = (bpmnXml) =&gt; {
115 115 ...model.value,
116 116 bpmnXml: bpmnXml // this.bpmnXml 只是初始化流程图，后续修改无法通过它获得
117 117 }
  118 + console.log(data, 'data')
118 119  
119 120 // 修改的提交
120 121 if (data.id) {
121 122 updateModelApi(data).then((response) => {
122 123 console.log(response, 'response')
123 124 // this.$modal.msgSuccess("修改成功")
  125 + ElMessage.success('修改成功')
  126 +
124 127 // 跳转回去
125 128 close()
126 129 })
... ... @@ -130,6 +133,7 @@ const save = (bpmnXml) =&gt; {
130 133 createModelApi(data).then((response) => {
131 134 console.log(response, 'response1')
132 135 // this.$modal.msgSuccess("保存成功")
  136 + ElMessage.success('保存成功')
133 137 // 跳转回去
134 138 close()
135 139 })
... ...