|
@@ -10,22 +10,58 @@
|
|
|
<el-col :span="24" class="top">
|
|
|
<el-col :span="6" class="left"> 当前状态</el-col>
|
|
|
<el-col :span="10" class="under">
|
|
|
- <el-radio v-model="radio" label="1">活跃用户</el-radio>
|
|
|
- <el-radio v-model="radio" label="2">活跃节点</el-radio>
|
|
|
- <el-radio v-model="radio" label="3">活跃应用</el-radio>
|
|
|
+ <el-radio-group v-model="radio" @change="changeType">
|
|
|
+ <el-radio label="1">活跃用户</el-radio>
|
|
|
+ <el-radio label="2">活跃节点</el-radio>
|
|
|
+ <el-radio label="3">活跃应用</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
</el-col>
|
|
|
- <el-col :span="8" class="right">更新时间:2020-5-19_00:00:00</el-col>
|
|
|
+ <el-col :span="8" class="right">更新时间:{{ toDay }}</el-col>
|
|
|
</el-col>
|
|
|
<el-col :span="24" class="table">
|
|
|
- <el-table :data="tableData" border style="width: 100%">
|
|
|
- <el-table-column type="index" label="序号" width="50" align="center"> </el-table-column>
|
|
|
- <el-table-column prop="name" label="用户" align="center"> </el-table-column>
|
|
|
- <el-table-column prop="yingxing" label="运行作业" align="center"> </el-table-column>
|
|
|
- <el-table-column prop="paidui" label="排队作业" align="center"> </el-table-column>
|
|
|
- <el-table-column prop="heshu" label="运行核数" align="center"> </el-table-column>
|
|
|
- <el-table-column prop="diaduiheshu" label="排队核数" align="center"> </el-table-column>
|
|
|
- <el-table-column prop="huoyue" label="活跃结点" align="center"> </el-table-column>
|
|
|
- </el-table>
|
|
|
+ <span v-if="radio == '1'">
|
|
|
+ <el-table :data="hyyh" border style="width: 100%">
|
|
|
+ <el-table-column type="index" label="序号" width="50" align="center"> </el-table-column>
|
|
|
+ <el-table-column prop="user" label="用户" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="pr" label="进程调度" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="ni" label="进程nice值" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <!-- <el-table-column prop="virt" label="虚拟内存" align="center" show-overflow-tooltip> </el-table-column> -->
|
|
|
+ <el-table-column prop="res" label="驻留内存" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="shr" label="共享内存" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="s" label="进程状态" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="cpu" label="CPU时间" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="mem" label="物理内存" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="command" label="进程指令" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <!-- <el-table-column prop="time" label="全部CPU时间" align="center" show-overflow-tooltip> </el-table-column> -->
|
|
|
+ </el-table>
|
|
|
+ </span>
|
|
|
+ <span v-else-if="radio == '2'">
|
|
|
+ <el-table :data="hyjd" border style="width: 100%">
|
|
|
+ <el-table-column type="index" label="序号" width="50" align="center"> </el-table-column>
|
|
|
+ <el-table-column prop="uname" label="用户" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="jobs" label="运行作业" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="physmem" label="作业占用内存" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="np" label="可用核数" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="ncpus" label="运行核数" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="node" label="活跃结点" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </span>
|
|
|
+ <span v-else-if="radio == '3'">
|
|
|
+ <el-table :data="hyyy" border style="width: 100%">
|
|
|
+ <el-table-column type="index" label="序号" width="50" align="center"> </el-table-column>
|
|
|
+ <el-table-column prop="user" label="应用" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="pr" label="进程调度" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="ni" label="进程nice值" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <!-- <el-table-column prop="virt" label="虚拟内存" align="center" show-overflow-tooltip> </el-table-column> -->
|
|
|
+ <el-table-column prop="res" label="驻留内存" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="shr" label="共享内存" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="s" label="进程状态" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="cpu" label="CPU时间" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="mem" label="物理内存" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <el-table-column prop="command" label="进程指令" align="center" show-overflow-tooltip> </el-table-column>
|
|
|
+ <!-- <el-table-column prop="time" label="全部CPU时间" align="center" show-overflow-tooltip> </el-table-column> -->
|
|
|
+ </el-table>
|
|
|
+ </span>
|
|
|
</el-col>
|
|
|
</el-col>
|
|
|
</el-col>
|
|
@@ -35,6 +71,8 @@
|
|
|
|
|
|
<script>
|
|
|
import { mapState, createNamespacedHelpers } from 'vuex';
|
|
|
+const { mapActions: topmessage } = createNamespacedHelpers('topmessage');
|
|
|
+import moment from 'moment';
|
|
|
export default {
|
|
|
name: 'sign',
|
|
|
props: {
|
|
@@ -43,15 +81,58 @@ export default {
|
|
|
components: {},
|
|
|
data: function() {
|
|
|
return {
|
|
|
+ // 显示类型
|
|
|
radio: '1',
|
|
|
- tableData: [
|
|
|
- { name: '测试', yingxing: '0', heshu: '0', paidui: '0', diaduiheshu: '230', huoyue: 'era' },
|
|
|
- { name: '测试', yingxing: '0', heshu: '0', paidui: '0', diaduiheshu: '230', huoyue: 'era' },
|
|
|
- ],
|
|
|
+ // 活跃用户
|
|
|
+ hyyh: [],
|
|
|
+ // 活跃结点
|
|
|
+ hyjd: [],
|
|
|
+ // 活跃应用
|
|
|
+ hyyy: [],
|
|
|
+ toDay: '',
|
|
|
+ serveTime: true,
|
|
|
};
|
|
|
},
|
|
|
- created() {},
|
|
|
- methods: {},
|
|
|
+ async created() {
|
|
|
+ let toDay = moment().format('YYYY-MM-DD HH:mm:ss');
|
|
|
+ this.$set(this, `toDay`, toDay);
|
|
|
+ await this.search();
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.channel();
|
|
|
+ if (this.serveTime) {
|
|
|
+ this.searchNode();
|
|
|
+ this.searchNode = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...topmessage(['query', 'querytwo']),
|
|
|
+ async search({ skip = 0, limit = 300, ...info } = {}) {
|
|
|
+ let res = await this.query({ skip, limit, ...info });
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ this.$set(this, `hyyh`, res.data);
|
|
|
+ this.$set(this, `hyyy`, res.data.reverse());
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 页面一次性请求
|
|
|
+ async searchNode() {
|
|
|
+ let res = await this.querytwo();
|
|
|
+ },
|
|
|
+ channel() {
|
|
|
+ this.$stomp({
|
|
|
+ [`/exchange/service_count/nodes`]: this.onMessage,
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onMessage(message) {
|
|
|
+ let data = JSON.parse(message.body).filter(i => i.node != 'gpu01');
|
|
|
+ this.$set(this, 'hyjd', data);
|
|
|
+ },
|
|
|
+ // 选择类型
|
|
|
+ changeType(label) {
|
|
|
+ this.$set(this, `radio`, label);
|
|
|
+ console.log(this.radio);
|
|
|
+ },
|
|
|
+ },
|
|
|
computed: {
|
|
|
...mapState(['user']),
|
|
|
pageTitle() {
|
|
@@ -89,7 +170,7 @@ export default {
|
|
|
.info {
|
|
|
border-top: 2px solid #054982;
|
|
|
background-image: linear-gradient(0deg, #c4e0ec, #f0f7fa);
|
|
|
- min-height: 700px;
|
|
|
+ min-height: 695px;
|
|
|
.top {
|
|
|
height: 50px;
|
|
|
line-height: 50px;
|
|
@@ -110,6 +191,10 @@ export default {
|
|
|
float: right;
|
|
|
}
|
|
|
}
|
|
|
+ .table {
|
|
|
+ height: 641px;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
}
|
|
|
/deep/.el-radio {
|
|
|
color: #606266;
|