From 8a201d7e97387e36a88dd8f28b36f8b62b6d3781 Mon Sep 17 00:00:00 2001
From: "YUN-PC5\\user" <bmdzh11713@163.com>
Date: Thu, 7 Dec 2023 16:14:21 +0800
Subject: [PATCH] =?UTF-8?q?=E7=B3=BB=E7=BB=9F=E7=9B=91=E6=8E=A7-=E6=9C=8D?=
 =?UTF-8?q?=E5=8A=A1=E7=9B=91=E6=8E=A7=E5=A2=9E=E5=8A=A0=E8=BF=9B=E5=BA=A6?=
 =?UTF-8?q?=E6=9D=A1=E9=A2=9C=E8=89=B2=EF=BC=8C=E8=A7=A3=E5=86=B3.NETCore?=
 =?UTF-8?q?=E6=9C=8D=E5=8A=A1=E6=98=BE=E7=A4=BA=E5=B0=8F=E6=95=B0=E4=B8=8D?=
 =?UTF-8?q?=E6=AD=A3=E7=A1=AE=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/monitor/server/index.vue | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/views/monitor/server/index.vue b/src/views/monitor/server/index.vue
index 279f814..0ee244f 100644
--- a/src/views/monitor/server/index.vue
+++ b/src/views/monitor/server/index.vue
@@ -13,7 +13,7 @@
           <div class="col-item">
             <div class="title">CPU使用率</div>
             <div class="content">
-              <el-progress type="dashboard" :percentage="parseFloat(server.cpu.cpuRate)" />
+              <el-progress type="dashboard" :percentage="parseFloat(server.cpu.cpuRate)" :color="colors" />
             </div>
             <div class="footer" v-if="server.sys">{{ server.sys.cpuNum }} 核心</div>
           </div>
@@ -30,7 +30,7 @@
               </template>
 
               <div class="content">
-                <el-progress type="dashboard" :percentage="parseFloat(server.cpu.ramRate)" />
+                <el-progress type="dashboard" :percentage="parseFloat(server.cpu.ramRate)" :color="colors" />
               </div>
             </el-tooltip>
             <div class="footer">{{ server.cpu.usedRam }} / {{ server.cpu.totalRAM }}</div>
@@ -39,7 +39,7 @@
           <div class="col-item">
             <div class="title">.NETCore服务</div>
             <div class="content">
-              <el-progress type="dashboard" :percentage="parseFloat(appPercent)" />
+              <el-progress type="dashboard" :percentage="parseFloat(appPercent)" :color="colors" />
             </div>
             <div class="footer" v-if="server.app">{{ server.app.appRAM }}</div>
           </div>
@@ -63,7 +63,7 @@
                   </div>
                 </template>
                 <div class="content">
-                  <el-progress type="dashboard" :percentage="parseFloat(sysFile.availablePercent)" />
+                  <el-progress type="dashboard" :percentage="parseFloat(sysFile.availablePercent)" :color="colors" />
                 </div>
               </el-tooltip>
             </div>
@@ -242,6 +242,13 @@ function clear() {
   clearInterval(intervalId.value)
   intervalId.value = null
 }
+const colors = [
+  { color: '#409EFF', percentage: 20 },
+  { color: '#95d475', percentage: 40 },
+  { color: '#67C23A', percentage: 60 },
+  { color: '#E6A23C', percentage: 80 },
+  { color: '#F56C6C', percentage: 100 }
+]
 watch(
   () => server.value,
   (val) => {
@@ -250,7 +257,8 @@ watch(
       const totalRam = val.cpu.totalRAM.replace('GB', '') * 1024
 
       const p = appRam / totalRam
-      appPercent.value = p.toFixed(2)
+      appPercent.value = (p * 100).toFixed(2)
+      console.log('appPercent', appPercent.value)
     }
   },
   { immediate: true }