From e27ad466091fc5a9b642bbc7d37f79f8b35ada45 Mon Sep 17 00:00:00 2001
From: chenjinsong <523037378@qq.com>
Date: Wed, 8 Sep 2021 21:44:29 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Decharts=E5=9B=BE?=
 =?UTF-8?q?=E8=A1=A8=E5=B0=BA=E5=AF=B8=E5=BC=82=E5=B8=B8=E7=9A=84=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/chart.scss                  | 11 ++++++++---
 src/components/charts/ChartMap.vue         |  2 +-
 src/components/charts/ChartSingleValue.vue |  2 +-
 src/components/charts/ChartTable.vue       |  2 +-
 src/components/charts/EchartsFrame.vue     |  2 +-
 5 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/assets/css/chart.scss b/src/assets/css/chart.scss
index e390e466..a2d23b45 100644
--- a/src/assets/css/chart.scss
+++ b/src/assets/css/chart.scss
@@ -19,6 +19,12 @@
     font-weight:900;
   }
 }
+.cn-chart__single-value {
+  .chart__loading {
+    top: 0;
+    height: 100%;
+  }
+}
 .chart__loading {
   position: absolute;
   height: calc(100% - 50px);
@@ -28,9 +34,8 @@
 
   i {
     position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
+    left: calc(50% - 15px);
+    top: calc(50% - 15px);
     font-size: 30px;
     color: #aaa;
   }
diff --git a/src/components/charts/ChartMap.vue b/src/components/charts/ChartMap.vue
index 92fd40be..a09d27d2 100644
--- a/src/components/charts/ChartMap.vue
+++ b/src/components/charts/ChartMap.vue
@@ -12,7 +12,7 @@
     <div class="cn-chart__body">
       <slot></slot>
     </div>
-    <div class="cn-chart__body chart__loading" v-show="loading">
+    <div class="chart__loading" v-show="loading">
       <i class="el-icon-loading"></i>
     </div>
     <div class="cn-chart__footer">
diff --git a/src/components/charts/ChartSingleValue.vue b/src/components/charts/ChartSingleValue.vue
index 4633078c..00dcc35d 100644
--- a/src/components/charts/ChartSingleValue.vue
+++ b/src/components/charts/ChartSingleValue.vue
@@ -4,7 +4,7 @@
     <div class="single-value-icon__box" >
       <div class="single-value__icon"><i :class="icon"></i></div>
     </div>
-    <div class="single-value__content chart__loading" style="height: 100%; width: 100%;" v-show="loading">
+    <div class="chart__loading" v-show="loading">
       <i class="el-icon-loading"></i>
     </div>
     <div class="single-value__content" v-if="type === 51">
diff --git a/src/components/charts/ChartTable.vue b/src/components/charts/ChartTable.vue
index d0507bb4..c37c3d82 100644
--- a/src/components/charts/ChartTable.vue
+++ b/src/components/charts/ChartTable.vue
@@ -9,7 +9,7 @@
         <slot name="operations"></slot>
       </div>
     </div>
-    <div class="cn-chart__body chart__loading" v-show="loading">
+    <div class="chart__loading" v-show="loading">
       <i class="el-icon-loading"></i>
     </div>
     <div class="cn-chart__body" v-no-data="noData">
diff --git a/src/components/charts/EchartsFrame.vue b/src/components/charts/EchartsFrame.vue
index 96b9194f..1ec0e35d 100644
--- a/src/components/charts/EchartsFrame.vue
+++ b/src/components/charts/EchartsFrame.vue
@@ -12,7 +12,7 @@
     <div class="cn-chart__body" :class="{'pie-with-table': isPieWithTable}" v-no-data="noData">
       <slot></slot>
     </div>
-    <div class="cn-chart__body chart__loading" v-show="loading">
+    <div class="chart__loading" v-show="loading">
       <i class="el-icon-loading"></i>
     </div>
     <div class="cn-chart__footer" v-if="layout.indexOf(layoutConstant.FOOTER) > -1 && !noData" :class="{'pie-with-table': isPieWithTable}">