From e4a56d68e087fb57d06d93b725ae9764b451f092 Mon Sep 17 00:00:00 2001 From: TsMask <340112800@qq.com> Date: Mon, 28 Oct 2024 16:53:34 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E7=BD=91=E5=85=83=E6=80=BB=E8=A7=88?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E5=8F=98=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/configManage/neOverview/index.vue | 122 ++++++++++---------- 1 file changed, 63 insertions(+), 59 deletions(-) diff --git a/src/views/configManage/neOverview/index.vue b/src/views/configManage/neOverview/index.vue index 03e50f1f..ab00250a 100644 --- a/src/views/configManage/neOverview/index.vue +++ b/src/views/configManage/neOverview/index.vue @@ -2,8 +2,7 @@ import { PageContainer } from 'antdv-pro-layout'; import { ColumnsType } from 'ant-design-vue/es/table'; import { message } from 'ant-design-vue/es'; -import { reactive, toRaw, ref, onMounted, onBeforeUnmount, markRaw } from 'vue'; -import { listMain } from '@/api/index'; +import { reactive, ref, onMounted, onBeforeUnmount, markRaw } from 'vue'; import useI18n from '@/hooks/useI18n'; import { TooltipComponent } from 'echarts/components'; import { GaugeChart } from 'echarts/charts'; @@ -15,6 +14,8 @@ import { LabelLayout } from 'echarts/features'; import { useRoute } from 'vue-router'; import useAppStore from '@/store/modules/app'; import useDictStore from '@/store/modules/dict'; +import { listAllNeInfo } from '@/api/ne/neInfo'; +import { parseDateToStr } from '@/utils/date-utils'; const { getDict } = useDictStore(); const appStore = useAppStore(); const route = useRoute(); @@ -52,54 +53,61 @@ let indexColor = ref([ let tableColumns: ColumnsType = [ { title: t('views.index.object'), - dataIndex: 'name', - align: 'center', - key: 'status', + dataIndex: 'neName', + align: 'left', }, { title: t('views.index.realNeStatus'), - dataIndex: 'status', - align: 'center', - customRender(opt) { - if (opt.value == 'Normal') return t('views.index.normal'); - return t('views.index.abnormal'); - }, + dataIndex: 'serverState', + align: 'left', + key: 'status', }, { title: t('views.index.reloadTime'), - dataIndex: 'refresh', - align: 'center', + dataIndex: 'serverState', + align: 'left', + customRender(opt) { + if (opt.value?.refreshTime) return parseDateToStr(opt.value?.refreshTime); + return '-'; + }, }, { title: t('views.index.version'), - dataIndex: 'version', - align: 'center', + dataIndex: 'serverState', + align: 'left', + customRender(opt) { + return opt.value?.version || '-'; + }, }, { title: t('views.index.serialNum'), - dataIndex: 'serialNum', - align: 'center', + dataIndex: 'serverState', + align: 'left', + customRender(opt) { + return opt.value?.sn || '-'; + }, }, { title: t('views.index.expiryDate'), - dataIndex: 'expiryDate', - align: 'center', + dataIndex: 'serverState', + align: 'left', + customRender(opt) { + return opt.value?.expire || '-'; + }, }, { title: t('views.index.ipAddress'), - dataIndex: 'ipAddress', - key: 'groupName', - align: 'center', + dataIndex: 'serverState', + align: 'left', + customRender(opt) { + return opt.value?.neIP || '-'; + }, }, ]; /**表格状态类型 */ type TabeStateType = { /**加载等待 */ loading: boolean; - /**紧凑型 */ - size: string; - /**搜索栏 */ - seached: boolean; /**记录数据 */ data: object[]; /**勾选记录 */ @@ -109,8 +117,6 @@ type TabeStateType = { /**表格状态 */ let tableState: TabeStateType = reactive({ loading: false, - size: 'middle', - seached: false, data: [], selectedRowKeys: [], }); @@ -130,12 +136,8 @@ type nfStateType = { hostName: string; /**操作系统信息 */ osInfo: string; - /**数据库信息 */ - dbInfo: string; /**IP地址 */ ipAddress: string; - /**端口 */ - port: number; /**版本 */ version: string; /**CPU利用率 */ @@ -154,9 +156,7 @@ type nfStateType = { let pronInfo: nfStateType = reactive({ hostName: '5gc', osInfo: 'Linux 5gc 4.15.0-112-generic 2020 x86_64 GNU/Linux', - dbInfo: 'db v9.9.9', ipAddress: '-', - port: 33030, version: '-', cpuUse: '-', memoryUse: '-', @@ -169,8 +169,8 @@ let pronInfo: nfStateType = reactive({ function fnGetList(one: boolean) { if (tableState.loading) return; one && (tableState.loading = true); - listMain().then(res => { - tableState.data = res; + listAllNeInfo({ bandStatus: true }).then(res => { + tableState.data = res.data; tableState.loading = false; var rightNum = 0; var errorNum = 0; @@ -253,17 +253,14 @@ const closeDrawer = () => { function rowClick(record: any, index: any) { return { onClick: (event: any) => { - if ( - toRaw(record).status == '异常' || - toRaw(record).status == 'Abnormal' - ) { + let pronData = JSON.parse(JSON.stringify(record.serverState)); + if (!pronData.online) { message.error(t('views.index.neStatus'), 2); return false; } else { - let pronData = toRaw(record); - const totalMemInKB = pronData.memUsage?.totalMem; - const nfUsedMemInKB = pronData.memUsage?.nfUsedMem; - const sysMemUsageInKB = pronData.memUsage?.sysMemUsage; + const totalMemInKB = pronData.mem?.totalMem; + const nfUsedMemInKB = pronData.mem?.nfUsedMem; + const sysMemUsageInKB = pronData.mem?.sysMemUsage; // 将KB转换为MB const totalMemInMB = Math.round((totalMemInKB / 1024) * 100) / 100; @@ -273,19 +270,17 @@ function rowClick(record: any, index: any) { //渲染详细信息 pronInfo = { - hostName: pronData.hostName, - osInfo: pronData.osInfo, - dbInfo: pronData.dbInfo, - ipAddress: pronData.ipAddress, - port: pronData.port, + hostName: pronData.hostname, + osInfo: pronData.os, + ipAddress: pronData.neIP, version: pronData.version, cpuUse: - pronData.name + + pronData.neName + ':' + - pronData.cpuUsage?.nfCpuUsage / 100 + + pronData.cpu?.nfCpuUsage / 100 + '%; ' + 'SYS:' + - pronData.cpuUsage?.sysCpuUsage / 100 + + pronData.cpu?.sysCpuUsage / 100 + '%', memoryUse: 'Total:' + @@ -298,8 +293,8 @@ function rowClick(record: any, index: any) { sysMemUsageInMB + 'MB', capability: pronData.capability, - serialNum: pronData.serialNum, - expiryDate: pronData.expiryDate, + serialNum: pronData.sn, + expiryDate: pronData.expire, }; } open.value = true; @@ -379,6 +374,7 @@ onBeforeUnmount(() => { { > - +
- +