From fe30731334a78192fcb68dc32a2bef84dba64f8a Mon Sep 17 00:00:00 2001
From: tanghucheng <tanghucheng@easycorp.ltd>
Date: Tue, 3 Jan 2023 09:44:18 +0800
Subject: [PATCH] * Add loading style for ajaxGetServiceStatus.

---
 module/zahost/css/view.css       | 3 ++-
 module/zahost/js/view.js         | 5 +++++
 module/zahost/view/view.html.php | 2 +-
 module/zanode/css/view.css       | 5 +++--
 module/zanode/js/view.js         | 6 +++++-
 module/zanode/view/view.html.php | 7 +++----
 6 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/module/zahost/css/view.css b/module/zahost/css/view.css
index 3fa66474b0..ebc4b1ff72 100644
--- a/module/zahost/css/view.css
+++ b/module/zahost/css/view.css
@@ -13,6 +13,7 @@
 .fail{color:red;}
 .dot-symbol{padding-right:10px;}
 #statusContainer{margin:0px 0px 10px 0px;}
-#checkServiceStatus{background-color:unset;}
+#checkServiceStatus{background-color: #ffffff;}
+#checkServiceStatus:hover{background-color: #f0fdfb;}
 .service-check{margin-top: 0px;}
 .checkStatus{color: #313c52;}
diff --git a/module/zahost/js/view.js b/module/zahost/js/view.js
index aaaa2fb28c..c452fffd48 100644
--- a/module/zahost/js/view.js
+++ b/module/zahost/js/view.js
@@ -1,6 +1,7 @@
 ajaxGetServiceStatus();
 function ajaxGetServiceStatus()
 {
+    $('#serviceContent').addClass('loading');
     $.get(createLink('zahost', 'ajaxGetServiceStatus', 'hostID=' + hostID), function(response)
     {
         var resultData = JSON.parse(response);
@@ -31,6 +32,10 @@ function ajaxGetServiceStatus()
             $('.result .init-fail').addClass('hide')
             $('.result .init-success').removeClass('hide')
         }
+
+        setTimeout(function() {
+            $('#serviceContent').removeClass('loading');
+        }, 500);
     });
     return
 
diff --git a/module/zahost/view/view.html.php b/module/zahost/view/view.html.php
index 2811489b2c..e6377146c4 100644
--- a/module/zahost/view/view.html.php
+++ b/module/zahost/view/view.html.php
@@ -102,7 +102,7 @@
           <?php echo $lang->zahost->init->statusTitle;?>
           <button type='button' id='checkServiceStatus' class='btn btn-info'><i class="icon icon-refresh"></i> <span class='checkStatus'><?php echo $lang->zahost->init->checkStatus;?></span></button>
         </div>
-        <div class="detail-content article-content">
+        <div class="detail-content article-content load-indicator" id='serviceContent'>
           <div class="main-row">
             <div id="statusContainer">
               <div class="text-kvm"><span class="dot-symbol fail"> ●</span><span>KVM</span></div>
diff --git a/module/zanode/css/view.css b/module/zanode/css/view.css
index dbe31a9571..f1c5a6595d 100644
--- a/module/zanode/css/view.css
+++ b/module/zanode/css/view.css
@@ -12,6 +12,7 @@
 .service-status{margin-top: 10px;}
 .vnc-detail{height: 60vh;min-height: 550px;}
 .vnc-mask{width: 100%;height:100%;background-color: rgba(0,0,0,0);position: absolute;z-index: 1;}
-#checkServiceStatus{background-color:unset;}
+#checkServiceStatus{background-color: #ffffff;}
+#checkServiceStatus:hover{background-color: #f0fdfb;}
 .checkStatus{color: #313c52;}
-.node-not-wrap{white-space: nowrap;}
\ No newline at end of file
+.node-not-wrap{white-space: nowrap;}
diff --git a/module/zanode/js/view.js b/module/zanode/js/view.js
index 4811670c3e..2510bcf79f 100644
--- a/module/zanode/js/view.js
+++ b/module/zanode/js/view.js
@@ -2,6 +2,7 @@ var checkInterval;
 var intervalTimes = 0;
 
 $('#checkServiceStatus').click(function(){
+    $('#serviceContent').addClass('loading');
     $.get(createLink('zanode', 'ajaxGetServiceStatus', 'nodeID=' + nodeID), function(response)
     {
         var resultData = JSON.parse(response);
@@ -91,6 +92,9 @@ $('#checkServiceStatus').click(function(){
             $('.init-success').show();
             // $('.init-fail').hide();
         }
+        setTimeout(function() {
+            $('#serviceContent').removeClass('loading');
+        }, 500);
     });
     return
 })
@@ -161,4 +165,4 @@ $(function(){
         }
         $('#checkServiceStatus').trigger("click")
     }, 2000);
-})
\ No newline at end of file
+})
diff --git a/module/zanode/view/view.html.php b/module/zanode/view/view.html.php
index 0f89e69f12..e5c282e0fb 100644
--- a/module/zanode/view/view.html.php
+++ b/module/zanode/view/view.html.php
@@ -110,7 +110,7 @@ $account = strpos($zanode->osName, "windows") ? $config->zanode->defaultWinAccou
           </div>
         </div>
       </div>
-      
+
       <?php
       $canBeChanged = common::canBeChanged('zanode', $zanode);
       if ($canBeChanged) $actionFormLink = $this->createLink('action', 'comment', "objectType=zanode&objectID=$zanode->id");
@@ -122,7 +122,7 @@ $account = strpos($zanode->osName, "windows") ? $config->zanode->defaultWinAccou
             <?php echo $lang->zanode->init->statusTitle; ?>
             <button type='button' id='checkServiceStatus' class='btn btn-info'><i class="icon icon-refresh"></i> <span class='checkStatus'><?php echo $lang->zanode->init->checkStatus;?></span></button>
           </div>
-          <div class="detail-content statusContainer">
+          <div class="detail-content statusContainer load-indicator" id='serviceContent'>
             <div class="service-status">
               <span class='dot-symbol dot-zenagent text-danger'>●</span>
               <span>&nbsp;&nbsp;ZenAgent &nbsp;
@@ -139,7 +139,6 @@ $account = strpos($zanode->osName, "windows") ? $config->zanode->defaultWinAccou
             <div class="status-notice">
               <span class='init-success hide'><?php echo sprintf($lang->zanode->init->initSuccessNoticeTitle, "<a href='https://www.zentao.net/book/zentaopms/971.html'>{$lang->zanode->manual}</a>", html::a(helper::createLink('testcase', 'automation', "", '', true), $lang->zanode->automation, '', "class='iframe' title='{$lang->zanode->automation}' data-width='50%'", '')); ?></span>
               <span class='init-fail hide'><?php echo $lang->zanode->init->initFailNoticeTitle . '<br/>' . $lang->zanode->init->initFailNoticeDesc;?></span>
-              
             </div>
           </div>
         </div>
@@ -200,4 +199,4 @@ $account = strpos($zanode->osName, "windows") ? $config->zanode->defaultWinAccou
     <div id='mainActions' class='main-actions'>
       <?php common::printPreAndNext($browseLink); ?>
     </div>
-    <?php include '../../common/view/footer.html.php'; ?>
\ No newline at end of file
+    <?php include '../../common/view/footer.html.php'; ?>