系统监控-服务监控增加进度条颜色，解决.NETCore服务显示小数不正确的问题

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 }