testcase

src/api/monitor.js

@@ -0,0 +1,9 @@
+import {get} from "@/utils/request";
+// 获取磁盘信息
+export let disk =()=>{return get("/sys/disk")}
+//获取系统信息
+export let SysInfo =()=>{return get("sys/info")}
+//获取cpu信息
+export let Cpu = ()=>{return get("sys/cpu")}
+//获取内存信息
+export let get_memory =()=>{return get("sys/memory")}

src/api/user.js

@@ -1,9 +1,3 @@
-import {get,post} from "@/utils/request";
+import {post} from "@/utils/request";
 
-let Login = (json)=>{
- return post("/login",json)
-}
-
-export {
- Login
-}
+export let Login = (json)=>{return post("/login",json)}

src/utils/request.js

@@ -4,7 +4,7 @@ import {useRouter} from "vue-router";
 import NProgress from "nprogress"
 
 const service = axios.create({
- baseURL: 'http://192.168.10.80:8000/api',
+ baseURL: 'http://192.168.0.107:8000/api',
  timeout: 5000
 });
 const router = useRouter()

src/view/Monit.vue

@@ -1,5 +1,15 @@
 <template>
  <div class="charts" style="background: #fff; padding: 15px">
+
+ <a-card title="系统信息" :bordered="false">
+ <p>系统用户：qiangyanwen</p>
+ <p>在线用户：1</p>
+ <p>系统当前时间：2022-08-22 14:55:43</p>
+ <p>系统开机时间：2022-08-22 14:55:43</p>
+ </a-card>
+ <a-card title="磁盘信息" :bordered="false">
+ <p></p>
+ </a-card>
  <a-card title="cpu使用率" :bordered="false">
  <echarts class="chart" :option="option"/>
  </a-card>
@@ -36,7 +46,6 @@ const option = ref({
  }
  ]
 })
-
 const memory = ref({
  tooltip: {
  formatter: '{a} <br/>{b} : {c}%'
@@ -76,7 +85,14 @@ const memory = ref({
 }
 
 .charts {
+ display: flex;
+ justify-content: space-between;
+ flex-wrap: wrap
+}
+p{
  display: flex;
  justify-content: flex-start;
+ font-size: 16px;
+ font-weight: bold;
 }
 </style>