BJ_ZTEITS-Developers / parking-cloud-yudao

Commit b704aae49b50b7b0e8f2e0b49299d512a53a6d3e

Authored by gexinzhineng/gxzn27
1 parent 3ce663c7

报错基本解决，数据绑定还有些错误

Inline Side-by-side
Showing 16 changed files with 171 additions and 132 deletions
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue
  View file @b704aae
1 1 <template>
2   - <div class="process-panel__container" :style="{ width: `${width}px;` }">
  2 + <div class="process-panel__container" :style="{ width: `${width}px` }">
3 3 <el-collapse v-model="activeTab">
4 4 <el-collapse-item name="base">
5 5 <!-- class="panel-tab__title" -->
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/base/ElementBaseInfo.vue
  View file @b704aae
... ... @@ -45,7 +45,7 @@ const props = defineProps({
45 45 model: Object // 流程模型的数据
46 46 })
47 47 const needProps = ref({})
48   -let bpmnElement
  48 +const bpmnElement = ref()
49 49 const elementBaseInfo = ref({})
50 50 // 流程表单的下拉框的数据
51 51 // const forms = ref([])
... ... @@ -57,12 +57,12 @@ const rules = reactive({
57 57  
58 58 const resetBaseInfo = () => {
59 59 console.log(window, 'window')
60   - console.log(bpmnElement, 'bpmnElement')
  60 + console.log(bpmnElement.value, 'bpmnElement')
61 61  
62   - bpmnElement = window?.bpmnInstances?.bpmnElement
63   - console.log(bpmnElement, 'resetBaseInfo11111111111')
64   - elementBaseInfo.value = bpmnElement.businessObject
65   - needProps.value['type'] = bpmnElement.businessObject.$type
  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 66 // elementBaseInfo.value['typess'] = bpmnElement.value.businessObject.$type
67 67  
68 68 // elementBaseInfo.value = JSON.parse(JSON.stringify(bpmnElement.value.businessObject))
... ... @@ -81,7 +81,10 @@ const handleKeyUpdate = (value) =&gt; {
81 81  
82 82 // 在 BPMN 的 XML 中，流程标识 key，其实对应的是 id 节点
83 83 elementBaseInfo.value['id'] = value
84   - updateBaseInfo('id')
  84 +
  85 + setTimeout(() => {
  86 + updateBaseInfo('id')
  87 + }, 100)
85 88 }
86 89 const handleNameUpdate = (value) => {
87 90 console.log(elementBaseInfo, 'elementBaseInfo')
... ... @@ -89,7 +92,10 @@ const handleNameUpdate = (value) =&gt; {
89 92 return
90 93 }
91 94 elementBaseInfo.value['name'] = value
92   - updateBaseInfo('name')
  95 +
  96 + setTimeout(() => {
  97 + updateBaseInfo('name')
  98 + }, 100)
93 99 }
94 100 // const handleDescriptionUpdate=(value)=> {
95 101 // TODO 芋艿：documentation 暂时无法修改，后续在看看
... ... @@ -113,15 +119,15 @@ const updateBaseInfo = (key) =&gt; {
113 119 if (key === 'id') {
114 120 console.log('jinru')
115 121 console.log(window, 'window')
116   - console.log(bpmnElement, 'bpmnElement')
117   - console.log(toRaw(bpmnElement), 'bpmnElement')
118   - window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement), {
  122 + console.log(bpmnElement.value, 'bpmnElement')
  123 + console.log(toRaw(bpmnElement.value), 'bpmnElement')
  124 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
119 125 id: elementBaseInfo.value[key],
120 126 di: { id: `${elementBaseInfo.value[key]}_di` }
121 127 })
122 128 } else {
123 129 console.log(attrObj, 'attrObj')
124   - window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement), attrObj)
  130 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), attrObj)
125 131 }
126 132 }
127 133 onMounted(() => {
... ... @@ -165,6 +171,6 @@ watch(
165 171 // }
166 172 // }
167 173 onBeforeUnmount(() => {
168   - bpmnElement = null
  174 + bpmnElement.value = null
169 175 })
170 176 </script>
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/flow-condition/FlowCondition.vue
  View file @b704aae
... ... @@ -63,7 +63,7 @@
63 63 </template>
64 64  
65 65 <script setup lang="ts" name="FlowCondition">
66   -import { ref, nextTick, watch, onBeforeUnmount } from 'vue'
  66 +import { ref, nextTick, watch, onBeforeUnmount, toRaw } from 'vue'
67 67 import { ElSelect, ElForm, ElFormItem, ElInput, ElOption } from 'element-plus'
68 68  
69 69 const props = defineProps({
... ... @@ -117,17 +117,17 @@ const updateFlowType = (flowType) =&gt; {
117 117 // 正常条件类
118 118 if (flowType === 'condition') {
119 119 flowConditionRef.value = window.bpmnInstances.moddle.create('bpmn:FormalExpression')
120   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  120 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
121 121 conditionExpression: flowConditionRef.value
122 122 })
123 123 return
124 124 }
125 125 // 默认路径
126 126 if (flowType === 'default') {
127   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  127 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
128 128 conditionExpression: null
129 129 })
130   - window.bpmnInstances.modeling.updateProperties(bpmnElementSource.value, {
  130 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElementSource.value), {
131 131 default: bpmnElement.value
132 132 })
133 133 return
... ... @@ -137,11 +137,11 @@ const updateFlowType = (flowType) =&gt; {
137 137 bpmnElementSourceRef.value.default &&
138 138 bpmnElementSourceRef.value.default.id === bpmnElement.value.id
139 139 ) {
140   - window.bpmnInstances.modeling.updateProperties(bpmnElementSource.value, {
  140 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElementSource.value), {
141 141 default: null
142 142 })
143 143 }
144   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  144 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
145 145 conditionExpression: null
146 146 })
147 147 }
... ... @@ -164,7 +164,7 @@ const updateFlowCondition = () =&gt; {
164 164 })
165 165 }
166 166 }
167   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  167 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
168 168 conditionExpression: condition
169 169 })
170 170 }
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/form/ElementForm.vue
  View file @b704aae
... ... @@ -205,7 +205,7 @@
205 205 </template>
206 206  
207 207 <script setup lang="ts" name="ElementForm">
208   -import { ref, inject, watch, nextTick } from 'vue'
  208 +import { ref, inject, watch, nextTick, toRaw } from 'vue'
209 209 import {
210 210 ElDialog,
211 211 ElForm,
... ... @@ -280,10 +280,12 @@ const resetFormList = () =&gt; {
280 280 updateElementExtensions()
281 281 }
282 282 const updateElementFormKey = () => {
283   - window.bpmnInstances.modeling.updateProperties(bpmnELement.value, { formKey: formKey.value })
  283 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnELement.value), {
  284 + formKey: formKey.value
  285 + })
284 286 }
285 287 const updateElementBusinessKey = () => {
286   - window.bpmnInstances.modeling.updateModdleProperties(bpmnELement.value, formData.value, {
  288 + window.bpmnInstances.modeling.updateModdleProperties(toRaw(bpmnELement.value), formData.value, {
287 289 businessKey: businessKey.value
288 290 })
289 291 }
... ... @@ -437,7 +439,7 @@ const updateElementExtensions = () =&gt; {
437 439 values: otherExtensions.value.concat(formData.value)
438 440 })
439 441 // 更新到元素上
440   - window.bpmnInstances.modeling.updateProperties(bpmnELement.value, {
  442 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnELement.value), {
441 443 extensionElements: newElExtensionElements
442 444 })
443 445 }
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/listeners/ElementListeners.vue
  View file @b704aae
... ... @@ -249,7 +249,7 @@
249 249 </div>
250 250 </template>
251 251 <script setup lang="ts" name="ElementListeners">
252   -import { ref, inject, watch, nextTick } from 'vue'
  252 +import { ref, inject, watch, nextTick, toRaw } from 'vue'
253 253 import {
254 254 ElMessageBox,
255 255 ElTable,
... ... @@ -288,8 +288,10 @@ const listenerFormRef = ref()
288 288 const listenerFieldFormRef = ref()
289 289  
290 290 const resetListenersList = () => {
  291 + console.log(window, 'window')
291 292 bpmnElement.value = window.bpmnInstances.bpmnElement
292 293 otherExtensionList.value = []
  294 + console.log(bpmnElement.value, 'bpmnElement.value')
293 295 bpmnElementListeners.value =
294 296 bpmnElement.value.businessObject?.extensionElements?.values?.filter(
295 297 (ex) => ex.$type === `${prefix}:ExecutionListener`
... ... @@ -394,14 +396,15 @@ const saveListenerConfig = async () =&gt; {
394 396 bpmnElement.value.businessObject?.extensionElements?.values?.filter(
395 397 (ex) => ex.$type !== `${prefix}:ExecutionListener`
396 398 ) ?? []
397   - console.log(bpmnElement.value.height, 'bpmnElement.value')
  399 + console.log(bpmnElement.value, 'bpmnElement.value')
  400 + console.log(toRaw(bpmnElement.value), 'toRawtoRawtoRawtoRawtoRaw')
398 401 console.log(
399 402 otherExtensionList.value.concat(bpmnElementListeners.value),
400 403 'otherExtensionList.value.concat(bpmnElementListeners.value).value'
401 404 )
402 405 updateElementExtensions(
403   - bpmnElement.value,
404   - otherExtensionList.value.concat(bpmnElementListeners.value)
  406 + toRaw(bpmnElement.value),
  407 + toRaw(otherExtensionList.value.concat(bpmnElementListeners.value))
405 408 )
406 409 // 4. 隐藏侧边栏
407 410 listenerFormModelVisible.value = false
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/listeners/UserTaskListeners.vue
  View file @b704aae
... ... @@ -331,6 +331,10 @@ const listenerFormRef = ref()
331 331 const listenerFieldFormRef = ref()
332 332  
333 333 const resetListenersList = () => {
  334 + console.log(
  335 + window.bpmnInstances.bpmnElement,
  336 + 'window.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElementwindow.bpmnInstances.bpmnElement'
  337 + )
334 338 bpmnElement.value = window.bpmnInstances.bpmnElement
335 339 otherExtensionList.value = []
336 340 bpmnElementListeners.value =
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/listeners/utilSelf.js deleted
View file @3ce663c
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 (let 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/listeners/utilSelf.ts 0 → 100644
  View file @b704aae
  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
  View file @b704aae
... ... @@ -69,7 +69,7 @@
69 69 </template>
70 70  
71 71 <script setup lang="ts" name="ElementMultiInstance">
72   -import { inject, ref, onBeforeUnmount, watch } from 'vue'
  72 +import { inject, ref, onBeforeUnmount, watch, toRaw } from 'vue'
73 73 import { ElForm, ElFormItem, ElSelect, ElOption, ElCheckbox, ElInput } from 'element-plus'
74 74 const props = defineProps({
75 75 businessObject: Object,
... ... @@ -129,7 +129,9 @@ const changeLoopCharacteristicsType = (type) =&gt; {
129 129 // this.loopInstanceForm = { ...this.defaultLoopInstanceForm }; // 切换类型取消原表单配置
130 130 // 取消多实例配置
131 131 if (type === 'Null') {
132   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, { loopCharacteristics: null })
  132 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
  133 + loopCharacteristics: null
  134 + })
133 135 return
134 136 }
135 137 // 配置循环
... ... @@ -137,7 +139,7 @@ const changeLoopCharacteristicsType = (type) =&gt; {
137 139 const loopCharacteristicsObject = window.bpmnInstances.moddle.create(
138 140 'bpmn:StandardLoopCharacteristics'
139 141 )
140   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  142 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
141 143 loopCharacteristics: loopCharacteristicsObject
142 144 })
143 145 multiLoopInstance.value = null
... ... @@ -155,7 +157,7 @@ const changeLoopCharacteristicsType = (type) =&gt; {
155 157 { collection: '${coll_userList}' }
156 158 )
157 159 }
158   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  160 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
159 161 loopCharacteristics: multiLoopInstance.value
160 162 })
161 163 }
... ... @@ -167,9 +169,13 @@ const updateLoopCardinality = (cardinality) =&gt; {
167 169 body: cardinality
168 170 })
169 171 }
170   - window.bpmnInstances.modeling.updateModdleProperties(bpmnElement.value, multiLoopInstance.value, {
171   - loopCardinality
172   - })
  172 + window.bpmnInstances.modeling.updateModdleProperties(
  173 + toRaw(bpmnElement.value),
  174 + multiLoopInstance.value,
  175 + {
  176 + loopCardinality
  177 + }
  178 + )
173 179 }
174 180 // 完成条件
175 181 const updateLoopCondition = (condition) => {
... ... @@ -179,9 +185,13 @@ const updateLoopCondition = (condition) =&gt; {
179 185 body: condition
180 186 })
181 187 }
182   - window.bpmnInstances.modeling.updateModdleProperties(bpmnElement.value, multiLoopInstance.value, {
183   - completionCondition
184   - })
  188 + window.bpmnInstances.modeling.updateModdleProperties(
  189 + toRaw(bpmnElement.value),
  190 + multiLoopInstance.value,
  191 + {
  192 + completionCondition
  193 + }
  194 + )
185 195 }
186 196 // 重试周期
187 197 const updateLoopTimeCycle = (timeCycle) => {
... ... @@ -192,16 +202,24 @@ const updateLoopTimeCycle = (timeCycle) =&gt; {
192 202 })
193 203 ]
194 204 })
195   - window.bpmnInstances.modeling.updateModdleProperties(bpmnElement.value, multiLoopInstance.value, {
196   - extensionElements
197   - })
  205 + window.bpmnInstances.modeling.updateModdleProperties(
  206 + toRaw(bpmnElement.value),
  207 + multiLoopInstance.value,
  208 + {
  209 + extensionElements
  210 + }
  211 + )
198 212 }
199 213 // 直接更新的基础信息
200 214 const updateLoopBase = () => {
201   - window.bpmnInstances.modeling.updateModdleProperties(bpmnElement.value, multiLoopInstance.value, {
202   - collection: loopInstanceForm.value.collection || null,
203   - elementVariable: loopInstanceForm.value.elementVariable || null
204   - })
  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 + )
205 223 }
206 224 // 各异步状态
207 225 const updateLoopAsync = (key) => {
... ... @@ -215,7 +233,7 @@ const updateLoopAsync = (key) =&gt; {
215 233 asyncAttr[key] = loopInstanceForm.value[key]
216 234 }
217 235 window.bpmnInstances.modeling.updateModdleProperties(
218   - bpmnElement.value,
  236 + toRaw(bpmnElement.value),
219 237 multiLoopInstance.value,
220 238 asyncAttr
221 239 )
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/other/ElementOtherConfig.vue
  View file @b704aae
... ... @@ -17,7 +17,7 @@
17 17 </template>
18 18  
19 19 <script setup lang="ts" name="ElementOtherConfig">
20   -import { ref, watch, nextTick, onBeforeUnmount } from 'vue'
  20 +import { ref, watch, nextTick, onBeforeUnmount, toRaw } from 'vue'
21 21 import { ElInput } from 'element-plus'
22 22 const props = defineProps({
23 23 id: String
... ... @@ -25,15 +25,26 @@ const props = defineProps({
25 25 const documentation = ref('')
26 26 const bpmnElement = ref()
27 27 const updateDocumentation = () => {
  28 + console.log(props, 'props')
  29 + console.log(window, 'window')
  30 + console.log(
  31 + window.bpmnInstances.elementRegistry.get(props.id),
  32 + 'window.bpmnInstances.elementRegistry.get(props.id)'
  33 + )
  34 + console.log(bpmnElement.value, 'bpmnElement.value ')
28 35 if (bpmnElement.value && bpmnElement.value.id === props.id) {
29   - bpmnElement.value = window.bpmnInstances.elementRegistry.get(props.id)
  36 + bpmnElement.value = window?.bpmnInstances.elementRegistry.get(props.id)
30 37 }
  38 + console.log(
  39 + bpmnElement.value,
  40 + 'bpmnElement.value bpmnElement.value bpmnElement.value bpmnElement.value bpmnElement.value bpmnElement.value '
  41 + )
31 42 // (bpmnElement.value && bpmnElement.value.id === props.id) ||
32 43 // (bpmnElement.value = window.bpmnInstances.elementRegistry.get(props.id))
33 44 const documentations = window.bpmnInstances.bpmnFactory.create('bpmn:Documentation', {
34 45 text: documentation.value
35 46 })
36   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  47 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
37 48 documentation: [documentations]
38 49 })
39 50 }
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/properties/ElementProperties.vue
  View file @b704aae
... ... @@ -13,7 +13,7 @@
13 13 <el-button
14 14 type="text"
15 15 style="color: #ff4d4f"
16   - @click="removeAttributes(scope.roww, scope.$index)"
  16 + @click="removeAttributes(scope.row, scope.$index)"
17 17 >移除</el-button
18 18 >
19 19 </template>
... ... @@ -52,7 +52,7 @@
52 52 </template>
53 53  
54 54 <script setup lang="ts" name="ElementProperties">
55   -import { ref, inject, nextTick, watch } from 'vue'
  55 +import { ref, inject, nextTick, watch, toRaw } from 'vue'
56 56 import {
57 57 ElMessageBox,
58 58 ElDialog,
... ... @@ -131,8 +131,8 @@ const saveAttribute = () =&gt; {
131 131 const { name, value } = propertyForm.value
132 132 if (editingPropertyIndex.value !== -1) {
133 133 window.bpmnInstances.modeling.updateModdleProperties(
134   - bpmnElement.value,
135   - bpmnElementPropertyList.value[editingPropertyIndex.value],
  134 + toRaw(bpmnElement.value),
  135 + toRaw(bpmnElementPropertyList.value)[toRaw(editingPropertyIndex.value)],
136 136 {
137 137 name,
138 138 value
... ... @@ -157,7 +157,7 @@ const updateElementExtensions = (properties) =&gt; {
157 157 const extensions = window.bpmnInstances.moddle.create('bpmn:ExtensionElements', {
158 158 values: otherExtensionList.value.concat([properties])
159 159 })
160   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  160 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
161 161 extensionElements: extensions
162 162 })
163 163 }
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/task/task-components/ReceiveTask.vue
  View file @b704aae
... ... @@ -50,7 +50,7 @@
50 50 </template>
51 51  
52 52 <script setup lang="ts" name="ReceiveTask">
53   -import { ref, watch, onBeforeUnmount, onMounted, nextTick } from 'vue'
  53 +import { ref, watch, onBeforeUnmount, onMounted, nextTick, toRaw } from 'vue'
54 54 import { ElMessage, ElFormItem, ElDialog, ElForm, ElSelect, ElOption } from 'element-plus'
55 55 const props = defineProps({
56 56 id: String,
... ... @@ -85,11 +85,11 @@ const createNewMessage = () =&gt; {
85 85 }
86 86 const updateTaskMessage = (messageId) => {
87 87 if (messageId === '-1') {
88   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  88 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
89 89 messageRef: null
90 90 })
91 91 } else {
92   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, {
  92 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), {
93 93 messageRef: bpmnMessageRefsMap.value[messageId]
94 94 })
95 95 }
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/task/task-components/ScriptTask.vue
  View file @b704aae
... ... @@ -45,7 +45,7 @@
45 45 </template>
46 46  
47 47 <script setup lang="ts" name="ScriptTask">
48   -import { ref, watch, nextTick, onBeforeUnmount } from 'vue'
  48 +import { ref, watch, nextTick, onBeforeUnmount, toRaw } from 'vue'
49 49 import { ElInput, ElFormItem } from 'element-plus'
50 50 const props = defineProps({
51 51 id: String,
... ... @@ -78,7 +78,7 @@ const updateElementTask = () =&gt; {
78 78 taskAttr.resource = scriptTaskForm.value.resource || null
79 79 taskAttr.script = null
80 80 }
81   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, taskAttr)
  81 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), taskAttr)
82 82 }
83 83  
84 84 onBeforeUnmount(() => {
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/penal/task/task-components/UserTask.vue
  View file @b704aae
... ... @@ -38,7 +38,7 @@
38 38 </template>
39 39  
40 40 <script setup lang="ts" name="UserTask">
41   -import { ref, watch, nextTick, onBeforeUnmount } from 'vue'
  41 +import { ref, watch, nextTick, onBeforeUnmount, toRaw } from 'vue'
42 42 import { ElLink, ElFormItem, ElInput } from 'element-plus'
43 43 const props = defineProps({
44 44 id: String,
... ... @@ -78,7 +78,7 @@ const updateElementTask = (key) =&gt; {
78 78 } else {
79 79 taskAttr[key] = userTaskForm.value[key] || null
80 80 }
81   - window.bpmnInstances.modeling.updateProperties(bpmnElement.value, taskAttr)
  81 + window.bpmnInstances.modeling.updateProperties(toRaw(bpmnElement.value), taskAttr)
82 82 }
83 83  
84 84 watch(
... ...
yudao-ui-admin-vue3/src/components/bpmnProcessDesigner/package/utils.ts
  View file @b704aae
  1 +import { toRaw } from 'vue'
1 2 // 创建监听器实例
2 3 export function createListenerObject(options, isTask, prefix) {
3 4 const listenerObj = Object.create(null)
... ... @@ -59,12 +60,9 @@ export function updateElementExtensions(element, extensionList) {
59 60 const extensions = window.bpmnInstances.moddle.create('bpmn:ExtensionElements', {
60 61 values: extensionList
61 62 })
62   - console.log(element, 'elementelementelementelement')
63   - console.log(extensions.values, 'extensionsextensionsextensions')
64   - window.bpmnInstances.modeling.updateProperties(element, {
  63 + window.bpmnInstances.modeling.updateProperties(toRaw(element), {
65 64 extensionElements: extensions.values
66 65 })
67   - console.log('ssss')
68 66 }
69 67  
70 68 // 创建一个id
... ...
yudao-ui-admin-vue3/src/views/bpm/model/modelEditor.vue
  View file @b704aae
... ... @@ -27,7 +27,7 @@
27 27 </template>
28 28  
29 29 <script setup lang="ts">
30   -import { ref, onMounted, onBeforeMount } from 'vue'
  30 +import { ref, onMounted } 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'
... ... @@ -64,9 +64,6 @@ const controlForm = ref({
64 64 // })
65 65 // 流程模型的信息
66 66 const model = ref({})
67   -onBeforeMount(() => {
68   - // window.bpmnInstances = {}
69   -})
70 67 onMounted(() => {
71 68 // 如果 modelId 非空，说明是修改流程模型
72 69 const modelId = router.currentRoute.value.query && router.currentRoute.value.query.modelId
... ...