From d01abf6abe303193472230e2ee981f2ddc55b575 Mon Sep 17 00:00:00 2001
From: zhangyu <zhangyu@geedgenetworks.com>
Date: Wed, 23 Mar 2022 16:04:14 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E6=B7=BB=E5=8A=A0=E8=87=AA?=
 =?UTF-8?q?=E5=AE=9A=E4=B9=89=20loading=E6=8C=87=E4=BB=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 nezha-fronted/src/assets/css/common.scss         |  3 +++
 nezha-fronted/src/assets/css/common/loading.scss |  5 +++++
 nezha-fronted/src/components/common/js/tools.js  |  7 +++++--
 nezha-fronted/src/components/layout/home.vue     | 10 ++++++++--
 4 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/nezha-fronted/src/assets/css/common.scss b/nezha-fronted/src/assets/css/common.scss
index 2bd0c8f84..1fee0debe 100644
--- a/nezha-fronted/src/assets/css/common.scss
+++ b/nezha-fronted/src/assets/css/common.scss
@@ -374,6 +374,9 @@ td .nz-icon-gear:before{
   color: $--color-text-regular !important;
   box-shadow: none !important;
 }
+.loading-hide {
+  display: none;
+}
 input, textarea {
   font-family: Inter-Regular !important;
 }
diff --git a/nezha-fronted/src/assets/css/common/loading.scss b/nezha-fronted/src/assets/css/common/loading.scss
index 63658822c..91ba5125a 100644
--- a/nezha-fronted/src/assets/css/common/loading.scss
+++ b/nezha-fronted/src/assets/css/common/loading.scss
@@ -1,5 +1,10 @@
 // https://github.com/loadingio/css-spinner/tree/master/dist 从当前链接现在在 在tools.js 的myLoading 进行判断处理
 // 高度 宽度 等细节 记得处理
+
+loading-hide{
+  display: none;
+}
+
 // 1
 .lds-dual-ring,
 .lds-dual-ring:after {
diff --git a/nezha-fronted/src/components/common/js/tools.js b/nezha-fronted/src/components/common/js/tools.js
index 8cf1614f7..ed29b4643 100644
--- a/nezha-fronted/src/components/common/js/tools.js
+++ b/nezha-fronted/src/components/common/js/tools.js
@@ -117,6 +117,8 @@ function myLoadingFunction (el, binding, vnode) {
       return
     }
     //  若果是true创建一个div
+    const divBox = document.createElement('div')
+    divBox.setAttribute('class', 'el-loading-mask')
     const div = document.createElement('div')
     div.style.textAlign = 'center'
     if (binding.modifiers.scaleMin) {
@@ -138,12 +140,13 @@ function myLoadingFunction (el, binding, vnode) {
       newDiv1.setAttribute('class', 'el-loading-spinner')
       div.appendChild(newDiv1)
     }
+    divBox.appendChild(div)
     //  插入到被绑定的元素内部
-    el.appendChild(div)
+    el.appendChild(divBox)
     //  div内部加入内容
     // div.innerHTML = '加载中...'
     //  el 元素设置相对定位   div设置绝对定位
-    el.setAttribute('class', 'elrelative')
+    el.setAttribute('class', 'el-loading-parent--relative')
     //  设置绝对定位
     div.setAttribute('class', className)
   } else {
diff --git a/nezha-fronted/src/components/layout/home.vue b/nezha-fronted/src/components/layout/home.vue
index 557ed36dc..88c3739fe 100644
--- a/nezha-fronted/src/components/layout/home.vue
+++ b/nezha-fronted/src/components/layout/home.vue
@@ -3,7 +3,7 @@
     <left-menu @refresh="refresh"></left-menu>
     <div ref="body" class="body">
       <Header></Header>
-      <container v-if="containerShow" ref="container"></container>
+      <container v-if="containerShow" ref="container" v-my-loading:ldsFacebook="myLoading"></container>
     </div>
     <!--web-ssh-->
     <web-ssh ref="webSsh"></web-ssh>
@@ -35,7 +35,8 @@ export default {
   },
   data () {
     return {
-      containerShow: true
+      containerShow: true,
+      myLoading: true
     }
   },
   methods: {
@@ -43,6 +44,11 @@ export default {
       this.$store.commit('setIsRouteLive')
     }
   },
+  mounted () {
+    // setInterval(() => {
+    //   this.myLoading = !this.myLoading
+    // }, 1000)
+  },
   destroyed () {
     localStorage.removeItem('moduleProjectId')
     localStorage.removeItem('endpointProjectId')