diff --git a/public/assets/noData.png b/public/assets/noData.png new file mode 100644 index 0000000..cf9cdd5 Binary files /dev/null and b/public/assets/noData.png differ diff --git a/src/models/apiurl.js b/src/models/apiurl.js index b0cad56..fd8d091 100644 --- a/src/models/apiurl.js +++ b/src/models/apiurl.js @@ -15,16 +15,23 @@ const guishiPro = '/shzh/ptjstest' const shengUrl2Pro = '' const nmjPro = '/shzh/jcsj' - - - const jsapi = { - ptjs: { czrz: shengUrlPro + '/prod-api/baseplat-system/operlog/hb/list', czdbl: guishiPro + '/monitor/summary', + export:guishiPro + '/monitor/export/', resource:guishiPro + '/resource/page', - treeList:shengUrlPro + "/prod-api/baseplat-basic/hb/village/getChild/" + treeList: shengUrlPro + "/prod-api/baseplat-basic/hb/village/getChild/", + cpuPage: guishiPro + '/cpu/page', + cpuQuery: guishiPro + '/cpu/list/query', + memoryQuery: guishiPro + '/memory/list/query', + diskQuery: guishiPro + '/disk/list/query', + memoryPage: guishiPro + '/memory/page', + diskPage: guishiPro + '/disk/page', + diskList: guishiPro + '/disk/list', + realCpu: guishiPro + '/cpu/latest', + realMemory: guishiPro + '/memory/latest', + realDisk: guishiPro + '/disk/latest', }, service: { diff --git a/src/models/session/index.js b/src/models/session/index.js index b8ee523..a036e41 100644 --- a/src/models/session/index.js +++ b/src/models/session/index.js @@ -274,7 +274,14 @@ const session = { id:121, redirect: "/ptjs/czrz", parent_id: -1, name: "平台监视", type: 1, order: 1, children: [ { id: 402, path: "/ptjs/czrz", parent_id: 500, name: "操作日志", type: 0, order: 1}, { id: 403, path: "/ptjs/czdbl", parent_id: 500, name: "测站到报率", type: 0, order: 1}, - { id: 404, path: "/ptjs/zysy", parent_id: 500, name: "资源使用", type: 0, order: 1}, + { + id: 404, path: "/ptjs/zysy", parent_id: 500, name: "资源使用", type: 0, order: 1, + children: [ + // { id: 407, path: "/ptjs/zysy/ls", parent_id: 500, name: "历史", type: 0, order: 1 }, + { id: 405, path: "/ptjs/zysy/sssj", parent_id: 500, name: "实时数据", type: 0, order: 1 }, + { id: 406, path: "/ptjs/zysy/lssj", parent_id: 500, name: "历史数据", type: 0, order: 1 }, + ] + }, ] }, diff --git a/src/routes.js b/src/routes.js index fe55fe3..3e07c70 100644 --- a/src/routes.js +++ b/src/routes.js @@ -44,8 +44,13 @@ const routes = [ // 测站到报率 { path: '/ptjs/czdbl', exact: true, component: lazy(() => import('./views/Ptjs/Czdbl')) }, + // 资源使用-实时数据 + { path: '/ptjs/zysy/sssj', exact: true, component: lazy(() => import('./views/Ptjs/Sssj')) }, + // 资源使用-历史数据 + { path: '/ptjs/zysy/lssj', exact: true, component: lazy(() => import('./views/Ptjs/Lssj')) }, + // 资源使用 - { path: '/ptjs/zysy', exact: true, component: lazy(() => import('./views/Ptjs/Zysy')) }, + { path: '/ptjs/zysy/ls', exact: true, component: lazy(() => import('./views/Ptjs/Zysy')) }, //监测站点 { path: '/jczd/zdbg', exact: true, component: lazy(() => import('./views/Jczd/Bg')) }, { path: '/jczd/zdsp', exact: true, component: lazy(() => import('./views/Jczd/Sp')) }, diff --git a/src/views/Ptjs/Czdbl/dblOption.js b/src/views/Ptjs/Czdbl/dblOption.js index b234666..42fdba2 100644 --- a/src/views/Ptjs/Czdbl/dblOption.js +++ b/src/views/Ptjs/Czdbl/dblOption.js @@ -68,7 +68,8 @@ export default function dblOption(sellist,selday) { }, saveAsImage: { show: true, - title: '保存为图片' + name:'日到报率详情', + title: '保存为图片' } } }, diff --git a/src/views/Ptjs/Czdbl/index.js b/src/views/Ptjs/Czdbl/index.js index 6717a23..01b96a1 100644 --- a/src/views/Ptjs/Czdbl/index.js +++ b/src/views/Ptjs/Czdbl/index.js @@ -3,7 +3,7 @@ import { Card, message, Table, Space, Button, Spin, Tree } from 'antd'; import ToolBar from './toolbar.js'; import ToolBottom from './toolBottom.js'; import apiurl from '../../../models/apiurl' -import { xyt_httpget2, httpPostFile } from "../../../utils/request"; +import { xyt_httpget2, httpPostFile,httpGetFile } from "../../../utils/request"; import { exportFile } from '../../../utils/tools' import { resJson } from './res.js'; import ReactEcharts from 'echarts-for-react'; @@ -410,6 +410,20 @@ export default function Czrz() { return node; }) } + + // 山洪数据映射 + const dataUpdate = (data) => { + return data.map(item => { + if (item.adcd == '420391000000000') { + item.adcd = '420381450000000'; + item.adnm = '武当山'; + } + if (item.adcd == '421303000000000') { + item.adcd = '421302000000000'; + } + return item + }) + } const onLoadData = async ({ key, children }) => { if (key.substr(4) != '00000000000') { return @@ -417,8 +431,10 @@ export default function Czrz() { try { const res = await xyt_httpget2(apiurl.ptjs.treeList + key) if (res.code == 200) { + const filterData =res.data.filter(item => item.adcd != '420891000000000') + const results = dataUpdate(filterData) setTreeList(origin => - updateTreeData(origin, key, res.data.map(item => ({ ...item, isLeaf: true }))) + updateTreeData(origin, key, results.map(item => ({ ...item, isLeaf: true }))) ) } } catch (error) { @@ -472,11 +488,11 @@ export default function Czrz() { } // 下载测站离线表 const download = () => { - // httpPostFile(apiurl.service.yjgx.downLoad, params).then((res) => { - // if (res) { - // exportFile('测站离线表.xlsx', res.data) - // } - // }) + httpGetFile(apiurl.ptjs.export + '?' + `tm=${SearchBottom.operTime}`).then((res) => { + if (res) { + exportFile('测站离线表.xlsx', res.data) + } + }) } useEffect(() => { if (searchVal) { diff --git a/src/views/Ptjs/Czdbl/qsOption.js b/src/views/Ptjs/Czdbl/qsOption.js index a7f9c57..d5a853a 100644 --- a/src/views/Ptjs/Czdbl/qsOption.js +++ b/src/views/Ptjs/Czdbl/qsOption.js @@ -88,7 +88,9 @@ export default function qsOption(timeList, listObj, hbobj, list) { chartTimeList[idx] = str.substring(5, 10); }); -console.log("miny",minY); + console.log("chartTimeList", chartTimeList); + console.log("addSerise",addSerise.data); + return { @@ -150,6 +152,7 @@ console.log("miny",minY); }, saveAsImage: { show: true, + name:'到报率变化趋势', title: '保存为图片' } } diff --git a/src/views/Ptjs/Lssj/index.js b/src/views/Ptjs/Lssj/index.js new file mode 100644 index 0000000..2461968 --- /dev/null +++ b/src/views/Ptjs/Lssj/index.js @@ -0,0 +1,275 @@ +import React, { useState, useMemo } from 'react' +import { Card, Tabs,Table } from "antd"; +import ReactEcharts from 'echarts-for-react'; +import ToolBar from './toolbar'; +import zyOptions from './qsOption' +import moment from 'moment'; +import NormalSelect from '../../../components/Form/NormalSelect'; +import usePageTable from '../../../components/Crud/usePageTable.js' +import { findPage2 } from '../../../components/Crud/_.js' +import apiurl from '../../../models/apiurl' +import { httppost,httpget } from '../../../utils/request.js'; +import { useEffect } from 'react'; +export default function Lssj() { + const [searchVal, setSearchVal] = useState(false) + const [cbOptions, setCbOptions] = useState([]) + const [cbValue, setCbValue] = useState("/") + const [optionsData, setOptionsData] = useState([]) + const cpuColumn = [ + { + title: '时间', + dataIndex: 'tm', + key: 'tm', + width: 120, + align: "center", + }, + { + title: '用户态CPU时间(s)', + dataIndex: 'userTime', + key: 'userTime', + width: 120, + align: "center", + }, + { + title: '系统态CPU时间(s)', + dataIndex: 'system', + key: 'system', + width: 120, + align: "center", + }, + { + title: '空闲态CPU时间(s)', + dataIndex: 'idle', + key: 'idle', + width: 120, + align: "center", + },{ + title: 'I/O等待时间(s)', + dataIndex: 'iowait', + key: 'iowait', + width: 120, + align: "center", + }, + { + title: 'CPU使用率(%)', + dataIndex: 'rate', + key: 'rate', + width: 120, + align: "center", + }, + ] + const ncColumn = [ + { + title: '时间', + dataIndex: 'tm', + key: 'tm', + width: 120, + align: "center", + }, + { + title: '总内存(MB)', + dataIndex: 'totalSpace', + key: 'totalSpace', + width: 120, + align: "center", + }, + { + title: '已用内存(MB)', + dataIndex: 'usedSpace', + key: 'usedSpace', + width: 120, + align: "center", + }, + { + title: '可用内存(MB)', + dataIndex: 'freeSpace', + key: 'freeSpace', + width: 120, + align: "center", + }, + { + title: '内存使用率(%)', + dataIndex: 'rate', + key: 'rate', + width: 120, + align: "center", + }, + ] + const ccColumn = [ + { + title: '时间', + dataIndex: 'tm', + key: 'tm', + width: 120, + align: "center", + }, + { + title: '挂载点', + dataIndex: 'mount', + key: 'mount', + width: 120, + align: "center", + }, + { + title: '磁盘名称', + dataIndex: 'name', + key: 'name', + width: 120, + align: "center", + }, + { + title: '总磁盘量(GB)', + dataIndex: 'totalSpace', + key: 'totalSpace', + width: 120, + align: "center", + }, + { + title: '已用磁盘量(GB)', + dataIndex: 'usedSpace', + key: 'usedSpace', + width: 120, + align: "center", + }, + { + title: '可用磁盘量(GB)', + dataIndex: 'freeSpace', + key: 'freeSpace', + width: 120, + align: "center", + }, + { + title: '磁盘使用率(%)', + dataIndex: 'rate', + key: 'rate', + width: 120, + align: "center", + }, + ] + + const url = useMemo(() => { + if (searchVal) { + switch (searchVal.type) { + case 0: + return apiurl.ptjs.cpuPage + case 1: + return apiurl.ptjs.memoryPage + case 2: + return apiurl.ptjs.diskPage + } + } else { + return apiurl.ptjs.cpuPage + } + },[searchVal]) + const { tableProps, search, refresh } = usePageTable((params) => findPage2(url, params)) + + const options = useMemo(() => { + if (searchVal && optionsData.length >0) { + return zyOptions(optionsData || [],searchVal.type) + } else { + return zyOptions() + } + }, [searchVal,optionsData]) + + const newColumns = useMemo(() => { + if (searchVal) { + switch (searchVal.type) { + case 0: + return cpuColumn + case 1: + return ncColumn + case 2: + return ccColumn + } + + } else { + return cpuColumn + } + }, [searchVal]) + + + const getDiskList = async () => { + try { + const res = await httpget(apiurl.ptjs.diskList) + if (res.code == 200) { + setCbOptions(res.data.map(item => ({ label: item.mount, value: item.mount }))) + } + } catch (error) { + console.log(error); + } + } + + // 获取cpu整个时间范围内数据 + const getTotalList = async (params,url) => { + try { + const res = await httppost(url,params) + if (res.code == 200) { + const result = res.data.map(item => ({...item,tm:moment(item.tm).format('HH:mm:ss')})) + setOptionsData(result) + } + } catch (error) { + console.log(error); + } + } + useEffect(() => { + if (searchVal) { + const params = { + ...searchVal, + mount: searchVal?.type == 2 ? cbValue :undefined + }; + search(params) + const url = searchVal.type == 0 ? apiurl.ptjs.cpuQuery : + searchVal.type == 1 ? apiurl.ptjs.memoryQuery : + searchVal.type == 2 ? apiurl.ptjs.diskQuery : + apiurl.ptjs.cpuQuery + getTotalList({...params,type:undefined},url) + } + }, [searchVal,cbValue]) + useEffect(() => { + getDiskList(); + }, []) + + + + return ( +
+ +
+ + 资源使用 +
+ + {optionsData.length > 0 && tableProps.dataSource.length > 0 ? + <> +
+ + {searchVal.type == 2 &&
+ { + setCbValue(value) + }} + value={cbValue} + style={{ width: '230px' }} />
} +
+ + : + + } + + + + + ) +} diff --git a/src/views/Ptjs/Lssj/qsOption.js b/src/views/Ptjs/Lssj/qsOption.js new file mode 100644 index 0000000..bc88448 --- /dev/null +++ b/src/views/Ptjs/Lssj/qsOption.js @@ -0,0 +1,84 @@ + +import { color } from "echarts"; +import moment from "moment" +export default function qsOption(data=[],type=0) { + const minY = Math.ceil(Math.min(...data?.map(item => item.rate))); + const maxY = Math.floor(Math.max(...data?.map(item => item.rate))); + const name = type == 0 ? 'CPU使用率' : + type == 1 ? '内存使用率' : + type == 2 ? '存储使用率' : 'CPU使用率' + const chartType = type != 0 ? 'bar' : 'line'; + return { + legend: { + show: true, + top:10 + }, + grid: { + left: '4%', + right: '4%', + bottom: '8%', + + }, + tooltip: { + trigger: 'axis', + formatter: function (params) { + if (params.length > 0) { + var result = params[0].name + "
"; + params.forEach(function (item) { + if (item.value) { + result += + item.marker + + " " + + item.seriesName + + " : " + + item.value + + "%
"; + } + }); + return result; + } + } + }, + xAxis: { + type: 'category', + data: data.map(item => item.tm), + axisLabel: { + interval: 0 + } + }, + yAxis: { + name: name, + type: 'value', + axisLabel: { + formatter: '{value}%' + }, + min: minY, + max: maxY, + axisLine: { + show: true, + }, + axisTick: { + show: true, + } + }, + series: [ + { + name:name, + type: chartType, + itemStyle: { + normal: { + color:'#02a7f0', + label: { + show: false, + formatter: '{c}%' + }, + labelLine: { + show: true + } + } + }, + data: data.map(item => item.rate) + } + ] + } +} \ No newline at end of file diff --git a/src/views/Ptjs/Lssj/toolbar.js b/src/views/Ptjs/Lssj/toolbar.js new file mode 100644 index 0000000..d169cce --- /dev/null +++ b/src/views/Ptjs/Lssj/toolbar.js @@ -0,0 +1,108 @@ +import React, { useEffect, useState } from 'react'; +import { Form, Input, Button, DatePicker } from 'antd'; +import NormalSelect from '../../../components/Form/NormalSelect'; +import dayjs from 'dayjs'; +import { FileTextOutlined } from '@ant-design/icons'; +const { RangePicker } = DatePicker; + +const ToolBar = ({ setToolVal }) => { + const [showIcon, setShowIcon] = useState(false) + const selectList=[ + {key:'最近1小时',value:1}, + {key:'最近1天',value:2}, + {key:'最近7天',value:3}, + {key:'最近1个月',value:4}, + ] + const Stypes = [ + { label: 'CPU', value: 0 }, + { label: '内存', value: 1 }, + { label: '存储', value: 2 }, + ]; + const [form] = Form.useForm(); + + const onFinish = (values) => { + if (values.tm) { + values.stm = values.tm[0] ? dayjs(values.tm[0]).format('YYYY-MM-DD HH:mm:ss') : ""; + values.etm = values.tm[1] ? dayjs(values.tm[1]).format('YYYY-MM-DD HH:mm:ss') : ""; + delete values.tm + } + setToolVal(values); + } + + const selectTime = (params)=>{ + let tmValue=[] + if(params === 1){ + tmValue=[dayjs().subtract(1, 'hours'), + dayjs() + ] + }else if(params ===2){ + tmValue=[dayjs().subtract(1, 'days'), + dayjs() + ] + }else if(params ===3){ + tmValue=[dayjs().subtract(7, 'days'), + dayjs() + ] + }else if(params ===4){ + tmValue=[dayjs().subtract(1, 'months'), + dayjs() + ] + } + form.setFieldsValue({...params,tm:tmValue}) + } + + const onValuesChange = (values, allValues) => { + if (allValues.tm) { + allValues.stm = allValues.tm[0] ? dayjs(allValues.tm[0]).format('YYYY-MM-DD HH:mm:ss') : ""; + allValues.etm = allValues.tm[1] ? dayjs(allValues.tm[1]).format('YYYY-MM-DD HH:mm:ss') : ""; + delete allValues.operTime + } + console.log(values,allValues); + setToolVal(allValues) + } + useEffect(() => { + const tm = [dayjs().subtract(1, 'hours'), dayjs()]; + form.setFieldsValue({ tm, type: 0 }) + const stm = tm[0].format('YYYY-MM-DD HH:mm:ss'); + const etm = tm[1].format('YYYY-MM-DD HH:mm:ss'); + setToolVal({type:0,stm,etm}) + }, []) + return ( +
+
+ + + + + + + + + + + + + +
{ + setShowIcon(!showIcon) + }} + > + + {showIcon &&
+ {selectList.map((item)=>{ + return
selectTime(item.value)}>{item.key}
+ })} +
} +
+
+ ); +} + +export default ToolBar; \ No newline at end of file diff --git a/src/views/Ptjs/Sssj/Cpu.js b/src/views/Ptjs/Sssj/Cpu.js new file mode 100644 index 0000000..e096676 --- /dev/null +++ b/src/views/Ptjs/Sssj/Cpu.js @@ -0,0 +1,123 @@ +import React from 'react' +import { Descriptions } from 'antd' +import './index.less' +export default function Cpu({data}) { + return ( +
+ + + {data?.cpuVendor} + + + {data?.cpuName} + + + {data?.cpuFamily} + + + {data?.cpuModel} + + + {data?.cpuStepping} + + + {data?.processorId} + + + {data?.cpu64bit ? '是':'否'} + + + {data?.cpuVendorFreq} + + + {data?.logicalProcessorCount} + + + {data?.physicalProcessorCount} + + + {data?.systemCpuLoad} + + + {data?.maxFreq} + + + {data?.cacheSize} + + + {/*
+
CPU
+
AMD
+
+
+
+
+
+
+
利用率
+
20%
+
+
+
速度
+
3.15GHZ
+
+
+
+
+
进程
+
20%
+
+
+
线程
+
20%
+
+
句柄
+
20%
+
+
+
+
+
正常运行时间
+
20%
+
+ +
+
+
+
+
基准速度：
+
2.00GHZ
+
+
+
插槽：
+
1
+
+
+
内核：
+
8
+
+
+
逻辑处理器：
+
8
+
+
+
虚拟化：
+
已启用
+
+
+
L1缓存：
+
512
+
+
+
L2缓存：
+
512
+
+
+
L3缓存：
+
512
+
+
+
*/} +
+ ) +} diff --git a/src/views/Ptjs/Sssj/Disk.js b/src/views/Ptjs/Sssj/Disk.js new file mode 100644 index 0000000..4b80956 --- /dev/null +++ b/src/views/Ptjs/Sssj/Disk.js @@ -0,0 +1,151 @@ +import React from 'react' +import { Table } from 'antd' +import './index.less' +import { render } from '@testing-library/react'; +export default function Disk({ data }) { + + // 工具函数：格式化字节大小 + const formatBytes = (bytes, decimals = 2) => { + if (bytes === 0) return '0 Bytes'; + + const k = 1024; // 1 KB = 1024 Bytes + const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']; + const i = Math.floor(Math.log(bytes) / Math.log(k)); // 计算单位索引 + + // 格式化数值并保留指定小数位数 + return `${parseFloat((bytes / Math.pow(k, i)).toFixed(decimals))} ${sizes[i]}`; + }; + const newColumns = [ + { + title: '序号', + dataIndex: 'index', + key: 'index', + width: 60, + render: (_, record, index) => index + 1, + }, + { + title: '文件存储名', + dataIndex: 'name', + key: 'name', + width: 120, + + }, + { + title: '挂载点路径', + dataIndex: 'mount', + key: 'mount', + width: 120, + }, { + title: '文件系统类型', + dataIndex: 'type', + key: 'type', + width: 120, + }, { + title: '总空间大小', + dataIndex: 'totalSpace', + key: 'totalSpace', + width: 120, + render: (v) => {formatBytes(v)} + }, { + title: '可用空间大小', + dataIndex: 'totalSpace', + key: 'totalSpace', + width: 120, + render: (v) => {formatBytes(v)} + + }, + { + title: '空闲空间大小', + dataIndex: 'freeSpace', + key: 'freeSpace', + width: 120, + render: (v) => {formatBytes(v)} + + }, + ] + return ( +
+
存储信息
+
+ {/*
+
CPU
+
AMD
+
+
+
+
+
+
+
利用率
+
20%
+
+
+
速度
+
3.15GHZ
+
+
+
+
+
进程
+
20%
+
+
+
线程
+
20%
+
+
句柄
+
20%
+
+
+
+
+
正常运行时间
+
20%
+
+ +
+
+
+
+
基准速度：
+
2.00GHZ
+
+
+
插槽：
+
1
+
+
+
内核：
+
8
+
+
+
逻辑处理器：
+
8
+
+
+
虚拟化：
+
已启用
+
+
+
L1缓存：
+
512
+
+
+
L2缓存：
+
512
+
+
+
L3缓存：
+
512
+
+
+
*/} + + ) +} diff --git a/src/views/Ptjs/Sssj/Memory.js b/src/views/Ptjs/Sssj/Memory.js new file mode 100644 index 0000000..7468d3c --- /dev/null +++ b/src/views/Ptjs/Sssj/Memory.js @@ -0,0 +1,104 @@ +import React from 'react' +import { Descriptions } from 'antd' +import './index.less' +export default function Memory({ data }) { + + return ( +
+ + + {data?.virtualMemory?.swapTotal} + + + {data?.virtualMemory?.swapUsed} + + + {data?.virtualMemory?.swapPagesIn} + + + {data?.virtualMemory?.swapPagesOut} + + + {data?.virtualMemory?.virtualMax} + + + {data?.virtualMemory?.virtualInUse} + + + + {/*
+
CPU
+
AMD
+
+
+
+
+
+
+
利用率
+
20%
+
+
+
速度
+
3.15GHZ
+
+
+
+
+
进程
+
20%
+
+
+
线程
+
20%
+
+
句柄
+
20%
+
+
+
+
+
正常运行时间
+
20%
+
+ +
+
+
+
+
基准速度：
+
2.00GHZ
+
+
+
插槽：
+
1
+
+
+
内核：
+
8
+
+
+
逻辑处理器：
+
8
+
+
+
虚拟化：
+
已启用
+
+
+
L1缓存：
+
512
+
+
+
L2缓存：
+
512
+
+
+
L3缓存：
+
512
+
+
+
*/} +
+ ) +} diff --git a/src/views/Ptjs/Sssj/index.js b/src/views/Ptjs/Sssj/index.js new file mode 100644 index 0000000..f8c0fab --- /dev/null +++ b/src/views/Ptjs/Sssj/index.js @@ -0,0 +1,61 @@ +import React,{useState,useEffect} from 'react' +import { Card, Tabs } from "antd" +import Cpu from './Cpu'; +import Memory from './Memory.js'; +import Disk from './Disk.js'; +import apiurl from '../../../models/apiurl' +import { httppost,httpget } from '../../../utils/request.js'; +export default function Sssj() { + const items = [ + { + key: '1', + label: 'CPU', + children: '', + }, + { + key: '2', + label: '内存', + children: '', + }, + { + key: '3', + label: '存储', + children: '', + }, + ]; + const [objData, setObjData] = useState({}) + const [tabs, setTabs] = useState('1'); + const getCpuReal = async (tabs) => { + const url = tabs == '1' ? apiurl.ptjs.realCpu : + tabs == '2' ? apiurl.ptjs.realMemory : + tabs == '3' ? apiurl.ptjs.realDisk : + apiurl.ptjs.realCpu; + try { + const res = await httpget(url) + if (res.code == 200) { + setObjData(res.data) + } + } catch (error) { + console.log(error); + } + } + useEffect(() => { + getCpuReal(tabs) + }, [tabs]) + + return ( +
+ +
+ + 资源使用 +
+ setTabs(e)}/> + {tabs === '1' && } + {tabs === '2' && } + {tabs === '3' && } + + +
+ ) +} diff --git a/src/views/Ptjs/Sssj/index.less b/src/views/Ptjs/Sssj/index.less new file mode 100644 index 0000000..3706b15 --- /dev/null +++ b/src/views/Ptjs/Sssj/index.less @@ -0,0 +1,16 @@ +.resourceTitle{ + display: flex; + justify-content: space-between; + padding: 0 10px; +} +.echarts-resource-box{ + width: 100%; + height: 440px; +} +.cpu-list{ + display: flex; + column-gap: 10px; + .left{ + + } +} \ No newline at end of file