perf: optimization workflow interactive

Author: wangdan-fit2cloud

ui/src/views/application-workflow/index.vue

@@ -174,20 +174,25 @@ const isSave = ref(false)
 const showHistory = ref(false)
 const disablePublic = ref(false)
 const currentVersion = ref<any>({})
+const cloneWorkFlow = ref(null)
 
 function back() {
-  MsgConfirm(t('common.tip'), t('views.applicationWorkflow.tip.saveMessage'), {
-    confirmButtonText: t('views.applicationWorkflow.setting.exitSave'),
-    cancelButtonText: t('views.applicationWorkflow.setting.exit'),
-    type: 'warning',
-    distinguishCancelAndClose: true
-  })
-    .then(() => {
-      saveApplication(true, true)
-    })
-    .catch((action: Action) => {
-      action === 'cancel' && router.push({ path: `/application/${id}/WORK_FLOW/overview` })
+  if (JSON.stringify(cloneWorkFlow.value) !== JSON.stringify(getGraphData())) {
+    MsgConfirm(t('common.tip'), t('views.applicationWorkflow.tip.saveMessage'), {
+      confirmButtonText: t('views.applicationWorkflow.setting.exitSave'),
+      cancelButtonText: t('views.applicationWorkflow.setting.exit'),
+      type: 'warning',
+      distinguishCancelAndClose: true
     })
+      .then(() => {
+        saveApplication(true, true)
+      })
+      .catch((action: Action) => {
+        action === 'cancel' && router.push({ path: `/application/${id}/WORK_FLOW/overview` })
+      })
+  } else {
+    router.push({ path: `/application/${id}/WORK_FLOW/overview` })
+  }
 }
 function clickoutsideHistory() {
   if (!disablePublic.value) {
@@ -357,6 +362,7 @@ function getDetail() {
     workflowRef.value?.clearGraphData()
     nextTick(() => {
       workflowRef.value?.render(detail.value.work_flow)
+      cloneWorkFlow.value = getGraphData()
     })
   })
 }
@@ -366,15 +372,20 @@ function saveApplication(bool?: boolean, back?: boolean) {
     work_flow: getGraphData()
   }
   loading.value = back || false
-  application.asyncPutApplication(id, obj).then((res) => {
-    saveTime.value = new Date()
-    if (bool) {
-      MsgSuccess(t('common.saveSuccess'))
-      if (back) {
-        router.push({ path: `/application/${id}/WORK_FLOW/overview` })
+  application
+    .asyncPutApplication(id, obj)
+    .then((res) => {
+      saveTime.value = new Date()
+      if (bool) {
+        MsgSuccess(t('common.saveSuccess'))
+        if (back) {
+          router.push({ path: `/application/${id}/WORK_FLOW/overview` })
+        }
       }
-    }
-  })
+    })
+    .catch(() => {
+      loading.value = false
+    })
 }
 
 /**

ui/src/workflow/common/data.ts

@@ -17,17 +17,14 @@ export const startNode = {
         }
       ],
       globalFields: [
+        { label: t('views.applicationWorkflow.nodes.startNode.currentTime'), value: 'time' },
         {
-          value: 'time',
-          label: t('views.applicationWorkflow.nodes.startNode.currentTime')
+          label: t('views.application.applicationForm.form.historyRecord.label'),
+          value: 'history_context'
         },
         {
-          value: 'history_context',
-          label: t('views.application.applicationForm.form.historyRecord.label')
-        },
-        {
-          value: 'chat_id',
-          label: t('chat.chatId')
+          label: t('chat.chatId'),
+          value: 'chat_id'
         }
       ]
     },

ui/src/workflow/nodes/variable-assign-node/index.vue

@@ -9,6 +9,7 @@
       ref="replyNodeFormRef"
       hide-required-asterisk
     >
+    <el-scrollbar max-height="750" @wheel="wheel">
       <template v-for="(item, index) in form_data.variable_list" :key="item.id">
         <el-card shadow="never" class="card-never mb-8" style="--el-card-padding: 12px">
           <el-form-item :label="$t('views.applicationWorkflow.variable.label')">
@@ -127,17 +128,18 @@
               />
             </el-form-item>
           </div>
-
-          <NodeCascader
-            v-else
-            ref="nodeCascaderRef2"
-            :nodeModel="nodeModel"
-            class="w-full"
-            :placeholder="$t('views.applicationWorkflow.variable.placeholder')"
-            v-model="item.reference"
-          />
+          <el-form-item v-else>
+            <NodeCascader
+              ref="nodeCascaderRef2"
+              :nodeModel="nodeModel"
+              class="w-full"
+              :placeholder="$t('views.applicationWorkflow.variable.placeholder')"
+              v-model="item.reference"
+            />
+          </el-form-item>
         </el-card>
       </template>
+    </el-scrollbar>
       <el-button link type="primary" @click="addVariable">
         <el-icon class="mr-4">
           <Plus />