From ca891f367c5b23ea841695c50ddbb7f08ae23292 Mon Sep 17 00:00:00 2001
From: 648540858 <648540858@qq.com>
Date: 星期一, 24 十月 2022 15:20:35 +0800
Subject: [PATCH] 首页改造完成,待添加系统信息
---
web_src/src/components/console.vue | 57 +++++++++++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 49 insertions(+), 8 deletions(-)
diff --git a/web_src/src/components/console.vue b/web_src/src/components/console.vue
index f663aaa..352989f 100644
--- a/web_src/src/components/console.vue
+++ b/web_src/src/components/console.vue
@@ -2,6 +2,10 @@
<div id="app" style="width: 100%">
<div class="page-header">
<div class="page-title">鎺у埗鍙�</div>
+ <div class="page-header-btn">
+ <el-button icon="el-icon-info" size="mini" style="margin-right: 1rem;" type="primary" @click="showInfo">骞冲彴淇℃伅
+ </el-button>
+ </div>
</div>
<el-row style="width: 100%">
<el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
@@ -14,7 +18,7 @@
<el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
<div class="control-cell" id="WorkThreadsLoad" >
<div style="width:100%; height:100%; ">
- <consoleMem ref="consoleMem"></consoleMem>
+ <consoleResource ref="consoleResource"></consoleResource>
</div>
</div>
</el-col>
@@ -28,26 +32,25 @@
<el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
<div class="control-cell" id="WorkThreadsLoad" >
<div style="width:100%; height:100%; ">
- <consoleCPU></consoleCPU>
+
+ <consoleMem ref="consoleMem"></consoleMem>
</div>
</div>
</el-col>
<el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
<div class="control-cell" id="WorkThreadsLoad" >
<div style="width:100%; height:100%; ">
- <consoleCPU></consoleCPU>
+ <consoleNodeLoad ref="consoleNodeLoad"></consoleNodeLoad>
</div>
</div>
</el-col>
<el-col :xl="{ span: 8 }" :lg="{ span: 8 }" :md="{ span: 12 }" :sm="{ span: 12 }" :xs="{ span: 24 }" >
<div class="control-cell" id="WorkThreadsLoad" >
<div style="width:100%; height:100%; ">
- <consoleCPU></consoleCPU>
+ <consoleDisk ref="consoleDisk"></consoleDisk>
</div>
</div>
</el-col>
-
-
</el-row>
</div>
</template>
@@ -57,6 +60,9 @@
import consoleCPU from './console/ConsoleCPU.vue'
import consoleMem from './console/ConsoleMEM.vue'
import consoleNet from './console/ConsoleNet.vue'
+import consoleNodeLoad from './console/ConsoleNodeLoad.vue'
+import consoleDisk from './console/ConsoleDisk.vue'
+import consoleResource from './console/ConsoleResource.vue'
import echarts from 'echarts';
@@ -67,7 +73,10 @@
uiHeader,
consoleCPU,
consoleMem,
- consoleNet
+ consoleNet,
+ consoleNodeLoad,
+ consoleDisk,
+ consoleResource,
},
data() {
return {
@@ -76,7 +85,10 @@
},
created() {
this.getSystemInfo();
+ this.getLoad();
+ this.getResourceInfo();
this.loopForSystemInfo();
+
},
destroyed() {
},
@@ -87,8 +99,10 @@
}
this.timer = setTimeout(()=>{
this.getSystemInfo();
+ this.getLoad();
this.timer = null;
this.loopForSystemInfo()
+ this.getResourceInfo()
}, 2000)
},
getSystemInfo: function (){
@@ -99,11 +113,38 @@
if (res.data.code === 0) {
this.$refs.consoleCPU.setData(res.data.data.cpu)
this.$refs.consoleMem.setData(res.data.data.mem)
- this.$refs.consoleNet.setData(res.data.data.net)
+ this.$refs.consoleNet.setData(res.data.data.net, res.data.data.netTotal)
+ this.$refs.consoleDisk.setData(res.data.data.disk)
}
}).catch( (error)=> {
});
+ },
+ getLoad: function (){
+ this.$axios({
+ method: 'get',
+ url: `/api/server/media_server/load`,
+ }).then( (res)=> {
+ if (res.data.code === 0) {
+ this.$refs.consoleNodeLoad.setData(res.data.data)
+ }
+ }).catch( (error)=> {
+ });
+ },
+ getResourceInfo: function (){
+ this.$axios({
+ method: 'get',
+ url: `/api/server/resource/info`,
+ }).then( (res)=> {
+ if (res.data.code === 0) {
+ this.$refs.consoleResource.setData(res.data.data)
+ }
+ }).catch( (error)=> {
+ });
+ },
+ showInfo: function (){
+
}
+
}
};
</script>
--
Gitblit v1.8.0