From 3ef6140cf27cf47748f3438bb5d999369f4518ca Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@163.com>
Date: Tue, 13 Aug 2019 11:28:15 +0800
Subject: [PATCH] =?UTF-8?q?feat(#I10KST):=20=E7=BD=91=E7=AB=99=E5=88=86?=
 =?UTF-8?q?=E6=9E=90=E9=A1=B5=E9=9D=A2=E5=A2=9E=E5=8A=A0=E6=AD=A3=E5=9C=A8?=
 =?UTF-8?q?=E5=8A=A0=E8=BD=BD=E4=B8=AD=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#Comment
comment #I10KST

#Issue
close https://gitee.com/LongbowEnterprise/dashboard/issues?id=I10KST
---
 Bootstrap.Admin/Views/Admin/Analyse.cshtml | 26 ++++++++++++++++++----
 Bootstrap.Admin/wwwroot/js/analyse.js      |  3 +++
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/Bootstrap.Admin/Views/Admin/Analyse.cshtml b/Bootstrap.Admin/Views/Admin/Analyse.cshtml
index 99ded02e..706d33b3 100644
--- a/Bootstrap.Admin/Views/Admin/Analyse.cshtml
+++ b/Bootstrap.Admin/Views/Admin/Analyse.cshtml
@@ -12,7 +12,6 @@
         <link href="~/lib/bootstrap-table/bootstrap-table.min.css" rel="stylesheet" />
     </environment>
     <style>
-
         .card .card-body {
             padding-bottom: 15px;
         }
@@ -20,6 +19,19 @@
         .spark {
             position: absolute;
         }
+
+        .loading {
+            position: absolute;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 178px;
+            width: 100%;
+        }
+
+            .loading span {
+                margin-left: 10px;
+            }
     </style>
 }
 @section javascript {
@@ -84,7 +96,9 @@
     </div>
     <div class="card-body">
         <div id="trace" class="spark"></div>
-        <div id="traceChart" style="height: 178px"></div>
+        <div id="traceLoading" class="loading"><i class="fa fa-spinner fa-pulse"></i><span>正在加载...请稍等</span></div>
+        <div id="traceChart" style="height: 178px">
+        </div>
     </div>
 </div>
 <div class="card">
@@ -93,7 +107,9 @@
     </div>
     <div class="card-body">
         <div id="login" class="spark"></div>
-        <div id="loginChart" style="height: 178px"></div>
+        <div id="loginLoading" class="loading"><i class="fa fa-spinner fa-pulse"></i><span>正在加载...请稍等</span></div>
+        <div id="loginChart" style="height: 178px">
+        </div>
     </div>
 </div>
 <div class="card">
@@ -102,6 +118,8 @@
     </div>
     <div class="card-body">
         <div id="log" class="spark"></div>
-        <div id="logChart" style="height: 178px"></div>
+        <div id="logLoading" class="loading"><i class="fa fa-spinner fa-pulse"></i><span>正在加载...请稍等</span></div>
+        <div id="logChart" style="height: 178px">
+        </div>
     </div>
 </div>
diff --git a/Bootstrap.Admin/wwwroot/js/analyse.js b/Bootstrap.Admin/wwwroot/js/analyse.js
index 58f3d899..b78acb87 100644
--- a/Bootstrap.Admin/wwwroot/js/analyse.js
+++ b/Bootstrap.Admin/wwwroot/js/analyse.js
@@ -96,6 +96,7 @@ $(function () {
                 }
             });
             var loginChart = echarts.init(document.getElementById('loginChart'));
+            $('#loginLoading').addClass('d-none');
             loginChart.setOption(op);
         }
     });
@@ -122,6 +123,7 @@ $(function () {
                 ]
             });
             var logChart = echarts.init(document.getElementById('logChart'));
+            $('#logLoading').addClass('d-none');
             logChart.setOption(op);
         }
     });
@@ -148,6 +150,7 @@ $(function () {
                 ]
             });
             var traceChart = echarts.init(document.getElementById('traceChart'));
+            $('#traceLoading').addClass('d-none');
             traceChart.setOption(op);
         }
     });