From 45ddf23e332f12b917842ba151c8924477ad127c Mon Sep 17 00:00:00 2001
From: WeiFeng-mindinsight <huangweifeng4@huawei.com>
Date: Tue, 1 Sep 2020 10:28:17 +0800
Subject: [PATCH] UI fix bug that loading massage disappear in large graph

---
 .../ui/src/views/train-manage/graph.vue       | 33 ++++++++++++++-----
 1 file changed, 24 insertions(+), 9 deletions(-)

diff --git a/mindinsight/ui/src/views/train-manage/graph.vue b/mindinsight/ui/src/views/train-manage/graph.vue
index a929f2ba..a661c8b2 100644
--- a/mindinsight/ui/src/views/train-manage/graph.vue
+++ b/mindinsight/ui/src/views/train-manage/graph.vue
@@ -895,13 +895,19 @@ export default {
      * @param {String} name Name of the current node (also the ID of the node)
      */
     dealDoubleClick(name) {
-      name = name.replace('_unfold', '');
-      if (this.allGraphData[name].isUnfold) {
-        this.selectedNode.name = name;
-        this.deleteNamespace(name);
-      } else {
-        this.queryGraphData(name);
-      }
+      this.loading.info = this.$t('graph.queryLoading');
+      this.loading.show = true;
+      this.$nextTick(() => {
+        setTimeout(() => {
+          name = name.replace('_unfold', '');
+          if (this.allGraphData[name].isUnfold) {
+            this.selectedNode.name = name;
+            this.deleteNamespace(name);
+          } else {
+            this.queryGraphData(name);
+          }
+        }, 200);
+      });
     },
     /**
      * Default method of the graph rendering adjustment. Set the node format.
@@ -2519,7 +2525,12 @@ export default {
             this.loading.info = this.$t('graph.searchLoading');
             this.loading.show = true;
             this.selectedNode.name = option.value;
-            this.layoutNamescope(parentId, true);
+
+            this.$nextTick(() => {
+              setTimeout(() => {
+                this.layoutNamescope(parentId, true);
+              }, 500);
+            });
           }
         }
       } else {
@@ -2622,7 +2633,11 @@ export default {
             } else {
               this.loading.info = this.$t('graph.searchLoading');
               this.loading.show = true;
-              this.layoutNamescope(data.scope_name, true);
+              this.$nextTick(() => {
+                setTimeout(() => {
+                  this.layoutNamescope(data.scope_name, true);
+                }, 200);
+              });
             }
           }
         }