zhangzengfei
2022-07-20 4a800a8fc83c6bd1f86a8e847b079a51a7532c09
src/pages/systemMonitor/index/App.vue
@@ -28,7 +28,9 @@
            @click="activeTab = 1"
          >
            <div class="title">应用单元</div>
            <div class="subtitle">正在进行{{ 1 }}个应用单元</div>
            <div class="subtitle">
              正在进行{{ appProcessData.length }}个应用单元
            </div>
            <span
              class="iconfont icon"
              :style="activeTab == 1 ? {} : { color: '#fff' }"
@@ -49,13 +51,13 @@
            stripe
            class="tableBox"
          >
            <el-table-column label="名称" width="180">
            <el-table-column label="名称" width="231">
              <template slot-scope="scope">
                <span class="iconfont icon">&#xe74d;</span>
                <span>{{ scope.row.desc }} </span>
              </template>
            </el-table-column>
            <el-table-column label="CPU" width="180">
            <el-table-column label="CPU">
              <template slot-scope="scope">
                <span>{{ scope.row.cpu.toFixed(2) }} %</span>
              </template>
@@ -65,13 +67,16 @@
                <span>{{ scope.row.mem.toFixed(2) }} %</span>
              </template>
            </el-table-column>
            <el-table-column prop="disk" label="硬盘"></el-table-column>
            <!-- <el-table-column
              prop="disk"
              label="硬盘"
              width="150"
            ></el-table-column> -->
            <el-table-column label="算力">
              <template slot-scope="scope">
                <span>{{ scope.row.gpu }} M</span>
              </template>
            </el-table-column>
            <el-table-column prop="net" label="网络"></el-table-column>
          </el-table>
        </div>
@@ -84,24 +89,24 @@
          <el-table
            :data="appProcessData"
            style="width: 100%"
           :header-cell-style="'background: #F2F2F7;color: #333333;height: 40px;font-size: 16px;'"
            :header-cell-style="'background: #F2F2F7;color: #333333;height: 40px;font-size: 16px;'"
            stripe
            class="tableBox"
          >
            <el-table-column
              prop="desc"
              label="名称"
              width="180"
            ></el-table-column>
            <el-table-column
              prop="cpu"
              label="CPU"
              width="180"
            ></el-table-column>
            <el-table-column prop="mem" label="内存"></el-table-column>
            <el-table-column prop="disk" label="硬盘"></el-table-column>
            <el-table-column prop="desc" label="名称"></el-table-column>
            <el-table-column prop="cpu" label="CPU">
              <template slot-scope="scope">
                <span>{{ scope.row.cpu.toFixed(2) }} %</span>
              </template>
            </el-table-column>
            <el-table-column prop="mem" label="内存">
              <template slot-scope="scope">
                <span>{{ scope.row.mem.toFixed(2) }} %</span>
              </template>
            </el-table-column>
            <!--   <el-table-column prop="disk" label="硬盘"></el-table-column>
            <el-table-column prop="gpu" label="算力"></el-table-column>
            <el-table-column prop="net" label="网络"></el-table-column>
            <el-table-column prop="net" label="网络"></el-table-column> -->
          </el-table>
        </div>
      </el-tab-pane>
@@ -280,15 +285,18 @@
          <span class="iconfont icon">&#xe944;</span>
          服务</span
        >
        <el-table :data="vasystemServicesData"
        :header-cell-style="'color: #333333;height: 40px;font-size: 16px;'"
            stripe
            class="tableBox"
        <el-table
          :data="vasystemServicesData"
          :header-cell-style="'color: #333333;height: 40px;font-size: 16px;'"
          stripe
          class="tableBox"
        >
          <el-table-column label="名称" show-overflow-tooltip>
            <template slot-scope="scope">
              <div class="name_container">
                <span class="iconfont icon">&#xe74d;</span>
              <span>{{ scope.row.name }}</span>
                <span>{{ scope.row.name }}</span>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="状态" prop="status">
@@ -396,6 +404,7 @@
            lineStyle: {
              width: 1,
              type: "solid",
              color: "rgb(242,242,242)",
            },
          },
        },
@@ -410,6 +419,11 @@
          },
          axisTick: {
            show: false,
          },
          splitLine: {
            lineStyle: {
              color: "rgb(242,242,242)",
            },
          },
        },
        series: [
@@ -560,13 +574,11 @@
          rsp.data.disk.forEach((d) => {
            if (d.name in this.disks) {
              this.disks[d.name].readBytes = this.disks[d.name].readBytes.slice(
                1
              );
              this.disks[d.name].readBytes =
                this.disks[d.name].readBytes.slice(1);
              this.disks[d.name].readBytes.push(d.readBytes);
              this.disks[d.name].writeBytes = this.disks[
                d.name
              ].writeBytes.slice(1);
              this.disks[d.name].writeBytes =
                this.disks[d.name].writeBytes.slice(1);
              this.disks[d.name].writeBytes.push(d.writeBytes);
            } else {
              this.disks[d.name] = {};
@@ -716,6 +728,12 @@
  box-sizing: border-box;
  background-color: #fff;
  height: 100%;
  .name_container {
    text-align: left;
    margin-left: 38%;
  }
  .el-table th.el-table__cell.is-leaf,
  .el-table td.el-table__cell {
    border-bottom: none;
@@ -911,6 +929,7 @@
  }
  .column-right {
    background-color: #fff;
    overflow-y: auto;
    overflow-x: auto;
  }