From b7d50f2945d43d6fe87b72772915ff79ccc64b5e Mon Sep 17 00:00:00 2001
From: xlsea <m@xlsea.cn>
Date: Mon, 4 Mar 2024 17:34:18 +0800
Subject: [PATCH] =?UTF-8?q?fix:=203.1.0.=20=E5=B7=A5=E4=BD=9C=E6=B5=81?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E6=96=B0=E5=A2=9E=E5=8A=A0=E8=BD=BD=E6=95=88?=
 =?UTF-8?q?=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/views/job/form/WorkFlow.vue | 46 +++++++++++++++++++-----
 1 file changed, 38 insertions(+), 8 deletions(-)

diff --git a/frontend/src/views/job/form/WorkFlow.vue b/frontend/src/views/job/form/WorkFlow.vue
index 71b70ac9..75586e3a 100644
--- a/frontend/src/views/job/form/WorkFlow.vue
+++ b/frontend/src/views/job/form/WorkFlow.vue
@@ -1,11 +1,14 @@
 <template>
-  <iframe
-    ref="iframe"
-    :src="`${mode === 'production' ? baseUrl : ''}/lib/index.html?id=${id}&mode=${mode}&x1c2Hdd6=${value}`"
-    marginwidth="0"
-    frameborder="no"
-    :style="`width: 100%;height:calc(99vh - 60px)`"
-  />
+  <a-spin :spinning="spinning" tip=" 工作流正在加载中">
+    <a-icon slot="indicator" type="loading" style="font-size: 58px; top: 39%" spin />
+    <iframe
+      ref="iframe"
+      :src="`${mode === 'production' ? baseUrl : ''}/lib/index.html?id=${id}&mode=${mode}&x1c2Hdd6=${value}`"
+      marginwidth="0"
+      frameborder="no"
+      :style="`width: 100%;height:calc(99vh - 60px)`"
+    />
+  </a-spin>
 </template>
 
 <script>
@@ -21,11 +24,14 @@ export default {
   data () {
     return {
       id: '',
+      spinning: true,
       mode: process.env.NODE_ENV,
-      baseUrl: process.env.VUE_APP_API_BASE_URL
+      baseUrl: process.env.VUE_APP_API_BASE_URL,
+      indicator: <a-icon type="loading" style="font-size: 36px" spin />
     }
   },
   mounted () {
+    this.iframeLoad()
     this.id = this.$route.query.id
   },
   created () {
@@ -58,6 +64,22 @@ export default {
           this.update()
         }
       }
+    },
+    iframeLoad () {
+      const that = this
+      const iframe = this.$refs.iframe
+      // 处理兼容行问题 兼容IE
+      if (iframe.attachEvent) {
+        iframe.attachEvent('onload', function () {
+          // iframe加载完毕以后执行操作
+          that.spinning = false
+        })
+      } else {
+        iframe.onload = function () {
+          // iframe加载完毕以后执行操作
+          that.spinning = false
+        }
+      }
     }
   }
 }
@@ -71,4 +93,12 @@ export default {
 .ant-layout-footer {
   display: none;
 }
+
+.ant-spin-text {
+  font-size: 20px;
+}
+
+.ant-spin-nested-loading > div > .ant-spin {
+  top: 23%;
+}
 </style>