qiangyanwen
/
monit_frontend
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add test

This commit is contained in:
qiangyanwen 2022-11-27 13:39:08 +08:00
parent a352073f39
commit 5f5a98f11d
1 changed files with 100 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
src/view/Monit.vue
View File

@ -30,7 +30,8 @@
<script setup> <script setup>
import {onMounted, reactive, ref} from "vue"; import {onMounted, reactive, ref} from "vue";
import {Cpu, SysInfo,disk} from "@/api/monitor" import {Cpu, SysInfo, disk} from "@/api/monitor"
let sysparams = reactive({ let sysparams = reactive({
count: 0, count: 0,
name: "", name: "",
@ -94,24 +95,25 @@ const columns = [{
}, { }, {
title: '已使用(G)', title: '已使用(G)',
dataIndex: 'used', dataIndex: 'used',
},{ }, {
title: "剩余(G)", title: "剩余(G)",
dataIndex: "free", dataIndex: "free",
} }
]; ];
onMounted(()=>{ onMounted(() => {
QuerySys() QuerySys()
QueryCpu() QueryCpu()
QueryDisk() QueryDisk()
setInterval(()=>{ setInterval(() => {
QuerySys(); QuerySys();
QueryCpu(); QueryCpu();
},5000) }, 5000)
}) })
function QuerySys() { function QuerySys() {
SysInfo().then((response)=>{ SysInfo().then((response) => {
if (response.code===200){ if (response.code === 200) {
let {count,name,current_time,start_time} = response.data let {count, name, current_time, start_time} = response.data
sysparams.count = count sysparams.count = count
sysparams.name = name sysparams.name = name
sysparams.current_time = current_time sysparams.current_time = current_time
@ -120,11 +122,12 @@ function QuerySys() {
} }
}) })
} }
const QueryCpu =()=>{
Cpu().then((rep)=>{ const QueryCpu = () => {
let {cpu_percent} =rep.data Cpu().then((rep) => {
option.series.forEach((data)=>{ let {cpu_percent} = rep.data
data.data.forEach((key)=>{ option.series.forEach((data) => {
data.data.forEach((key) => {
key.value = cpu_percent key.value = cpu_percent
}) })
}) })
@ -133,9 +136,9 @@ const QueryCpu =()=>{
}) })
} }
const data = reactive([]) const data = reactive([])
const QueryDisk = ()=>{ const QueryDisk = () => {
disk().then((resp)=>{ disk().then((resp) => {
resp.data.map((par,index)=>{ resp.data.map((par, index) => {
let params = { let params = {
key: String(index), key: String(index),
device: par.device, device: par.device,
@ -144,7 +147,7 @@ const QueryDisk = ()=>{
free: par.free, free: par.free,
} }
if(index < 5){ if (index < 5) {
data.push(params) data.push(params)
} }
@ -161,7 +164,8 @@ const QueryDisk = ()=>{
height: 300px; height: 300px;
width: 300px; width: 300px;
} }
.echarts{
.echarts {
width: 270px; width: 270px;
} }
@ -172,33 +176,39 @@ const QueryDisk = ()=>{
height: 85%; height: 85%;
width: 100%; width: 100%;
background-color: #42EBFF; background-color: #42EBFF;
overflow-x:scroll; overflow-x: scroll;
} }
p{
p {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
} }
#components-table-demo-size h4 { #components-table-demo-size h4 {
margin-bottom: 16px; margin-bottom: 16px;
} }
.disk{
.disk {
border: 1px solid #f5f5f5; border: 1px solid #f5f5f5;
height:100% height: 100%
} }
.memory{
.memory {
border: 1px solid #f5f5f5; border: 1px solid #f5f5f5;
height:100%; height: 100%;
} }
.sys{
.sys {
border: 1px solid #f5f5f5; border: 1px solid #f5f5f5;
height:100% height: 100%
} }
.cpu{
.cpu {
border: 1px solid #f5f5f5; border: 1px solid #f5f5f5;
height:100%; height: 100%;
} }