| | |
| | | @click="activeTab = 1" |
| | | > |
| | | <div class="title">应用单元</div> |
| | | <div class="subtitle">正在进行{{ appProcessData.length }}个应用单元</div> |
| | | <div class="subtitle"> |
| | | 正在进行{{ appProcessData.length }}个应用单元 |
| | | </div> |
| | | <span |
| | | class="iconfont icon" |
| | | :style="activeTab == 1 ? {} : { color: '#fff' }" |
| | |
| | | stripe |
| | | class="tableBox" |
| | | > |
| | | <el-table-column label="名称" width="180"> |
| | | <el-table-column label="名称" width="231"> |
| | | <template slot-scope="scope"> |
| | | <span class="iconfont icon"></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> |
| | |
| | | <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> |
| | | |
| | |
| | | <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> |
| | |
| | | <span class="iconfont icon"></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"></span> |
| | | <span>{{ scope.row.name }}</span> |
| | | <span>{{ scope.row.name }}</span> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="状态" prop="status"> |
| | |
| | | lineStyle: { |
| | | width: 1, |
| | | type: "solid", |
| | | color: "rgb(242,242,242)", |
| | | }, |
| | | }, |
| | | }, |
| | |
| | | }, |
| | | axisTick: { |
| | | show: false, |
| | | }, |
| | | splitLine: { |
| | | lineStyle: { |
| | | color: "rgb(242,242,242)", |
| | | }, |
| | | }, |
| | | }, |
| | | series: [ |
| | |
| | | |
| | | 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] = {}; |
| | |
| | | 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; |
| | |
| | | } |
| | | |
| | | .column-right { |
| | | background-color: #fff; |
| | | overflow-y: auto; |
| | | overflow-x: auto; |
| | | } |