fix

src/App.vue

@@ -26,9 +26,9 @@ export default {
   display: none;
 }
 .backg {
-  background-image: linear-gradient(to top, rgba(255,255,255, 0), rgba(255, 255, 255, 0)), url("./assets/knowledge/backgrand_picture.png");
-  background-repeat: no-repeat;
+  background-image: url("./assets/knowledge/backgrand_picture.png");
   background-size: 100% 100%;
-  margin-top: -170px;
+  /* margin-top: -170px; */
+  background-attachment:fixed;
 }
 </style>

src/views/index.vue

@@ -24,29 +24,27 @@
     <el-col :span="12" class="card-box">
     <el-row>
       <el-card>
-        <div slot="header"><span>CPU</span></div>
+        <div slot="header" style="color:#bfcbd9"><span>CPU</span></div>
         <div class="el-table el-table--enable-row-hover el-table--medium">
           <table cellspacing="0" style="width: 100%;">
             <thead>
             <tr>
               <th class="el-table__cell is-leaf"><div class="cell">属性</div></th>
               <th class="el-table__cell is-leaf"><div class="cell">值</div></th>
+              <th class="el-table__cell is-leaf"><div class="cell">属性</div></th>
+              <th class="el-table__cell is-leaf"><div class="cell">值</div></th>
             </tr>
             </thead>
             <tbody>
             <tr>
               <td class="el-table__cell is-leaf"><div class="cell">核心数</div></td>
               <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.cpuNum }}</div></td>
-            </tr>
-            <tr>
               <td class="el-table__cell is-leaf"><div class="cell">用户使用率</div></td>
               <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.used }}%</div></td>
             </tr>
             <tr>
               <td class="el-table__cell is-leaf"><div class="cell">系统使用率</div></td>
               <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div></td>
-            </tr>
-            <tr>
               <td class="el-table__cell is-leaf"><div class="cell">当前空闲率</div></td>
               <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.free }}%</div></td>
             </tr>
@@ -61,7 +59,7 @@
             <span>内存信息</span>
           </div>
           <div class="el-table el-table--enable-row-hover el-table--medium">
-            <div ref="usedmemory" style="height: 420px" />
+            <div ref="usedmemory" style="height: 280px" />
           </div>
         </el-card>
       </el-row>
@@ -187,6 +185,8 @@
         direction: 'rtl',
         searchNum: '',
         server: [],
+        // 统计命令信息
+        // commandstats: null,
         // 使用内存
         usedmemory: null,
         // cache信息
@@ -326,90 +326,6 @@
             color1: 'green',
             color2: 'green',
           },
-          {
-            id: 13,
-            num: '13',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 14,
-            num: '14',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 15,
-            num: '15',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 16,
-            num: '16',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 17,
-            num: '17',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 18,
-            num: '18',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 19,
-            num: '19',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 20,
-            num: '20',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 21,
-            num: '21',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 22,
-            num: '22',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 23,
-            num: '23',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          },
-          {
-            id: 24,
-            num: '24',
-            name: '健康',
-            color1: 'green',
-            color2: 'green',
-          }
         ],
         numList: []
       }
@@ -429,25 +345,25 @@
       getCache() {
         getCache().then((response) => {
           this.cache = response.data;
-          this.commandstats = echarts.init(this.$refs.commandstats, "macarons");
-          this.commandstats.setOption({
-            tooltip: {
-              trigger: "item",
-              formatter: "{a} <br/>{b} : {c} ({d}%)",
-            },
-            series: [
-              {
-                name: "命令",
-                type: "pie",
-                roseType: "radius",
-                radius: [15, 95],
-                center: ["50%", "38%"],
-                data: response.data.commandStats,
-                animationEasing: "cubicInOut",
-                animationDuration: 1000,
-              }
-            ]
-          });
+          // this.commandstats = echarts.init(this.$refs.commandstats, "macarons");
+          // this.commandstats.setOption({
+          //   tooltip: {
+          //     trigger: "item",
+          //     formatter: "{a} <br/>{b} : {c} ({d}%)",
+          //   },
+          //   series: [
+          //     {
+          //       name: "命令",
+          //       type: "pie",
+          //       roseType: "radius",
+          //       radius: [15, 95],
+          //       center: ["50%", "38%"],
+          //       data: response.data.commandStats,
+          //       animationEasing: "cubicInOut",
+          //       animationDuration: 1000,
+          //     }
+          //   ]
+          // });
           this.usedmemory = echarts.init(this.$refs.usedmemory, "macarons");
           this.usedmemory.setOption({
             tooltip: {