From ccb52ea94fe0c233d3c135e16da60484c83174ed Mon Sep 17 00:00:00 2001 From: lai <371757574@qq.com> Date: Fri, 22 Nov 2024 17:27:27 +0800 Subject: [PATCH] =?UTF-8?q?=E8=BF=87=E6=BB=A4=E6=97=A0=E8=87=AA=E5=AE=9A?= =?UTF-8?q?=E4=B9=89=E6=8C=87=E6=A0=87=E7=9A=84=E7=BD=91=E5=85=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/perfManage/kpiCReport/index.vue | 146 +++++++++++++--------- 1 file changed, 87 insertions(+), 59 deletions(-) diff --git a/src/views/perfManage/kpiCReport/index.vue b/src/views/perfManage/kpiCReport/index.vue index 612884fe..fd342b4d 100644 --- a/src/views/perfManage/kpiCReport/index.vue +++ b/src/views/perfManage/kpiCReport/index.vue @@ -82,12 +82,19 @@ let queryRangePicker = ref<[string, string]>(['', '']); /**时间选择 */ const ranges = ref([ - {label:t('views.perfManage.customTarget.sixHoursAgo'),value:[dayjs().subtract(6, 'hours'), - dayjs(),]}, - {label:t('views.perfManage.customTarget.threeHoursAgo'),value:[dayjs().subtract(3, 'hours'), - dayjs(),]}, - {label:t('views.monitor.monitor.today'),value:[dayjs().startOf('day'), dayjs()]}, -]) + { + label: t('views.perfManage.customTarget.sixHoursAgo'), + value: [dayjs().subtract(6, 'hours'), dayjs()], + }, + { + label: t('views.perfManage.customTarget.threeHoursAgo'), + value: [dayjs().subtract(3, 'hours'), dayjs()], + }, + { + label: t('views.monitor.monitor.today'), + value: [dayjs().startOf('day'), dayjs()], + }, +]); /**表格字段列 */ let tableColumns = ref([]); @@ -203,6 +210,13 @@ const kpiColors = new Map(); //legend表格数据 const kpiStats: any = ref([]); +// 添加一个函数来获取当前主题下的网格线颜色 +function getSplitLineColor() { + return document.documentElement.getAttribute('data-theme') === 'dark' + ? '#333333' + : '#E8E8E8'; // 亮色模式返回 undefined，使用默认颜色 +} + // 添加表格列定义 const statsColumns: TableColumnType[] = [ { @@ -316,6 +330,7 @@ function fnGetListTitle() { tableState.data = []; tableColumns.value = []; tableColumnsDnd.value = []; + kpiStats.value = []; //清空数据 fnRanderChartData(); return false; } @@ -390,6 +405,11 @@ function fnGetList() { content: t('common.noData'), duration: 2, }); + tableState.data = []; + tableColumns.value = []; + tableColumnsDnd.value = []; + kpiStats.value = []; //清空数据 + fnRanderChartData(); return false; } return true; @@ -548,7 +568,7 @@ function fnRanderChartData() { for (const item of orgData) { const keys = Object.keys(item); - console.log(keys,item);// + //console.log(keys,item);// for (const y of chartDataYSeriesData) { for (const key of keys) { if (y.key === key) { @@ -582,18 +602,6 @@ function fnRanderChartData() { ); } -/**图表折线显示全部 */ -function fnLegendSelected(bool: any) { - for (const key of Object.keys(chartLegendSelected)) { - chartLegendSelected[key] = bool; - } - kpiChart.value.setOption({ - legend: { - selected: chartLegendSelected, - }, - }); -} - /**图表实时统计 */ function fnRealTimeSwitch(bool: any) { if (bool) { @@ -703,54 +711,74 @@ function handleRowClick(record: any) { onMounted(() => { // 目前支持的 AMF AUSF MME MOCNGW NSSF SMF UDM UPF PCF // 获取网元网元列表 - neInfoStore.fnNelist().then(res => { + listCustom({ status: 'Active' }).then((res: any) => { if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) { - if (res.data.length > 0) { - // 过滤不可用的网元 - neCascaderOptions.value = neInfoStore.getNeCascaderOptions.filter( - (item: any) => { - return !['OMC', 'NSSF', 'NEF', 'NRF', 'LMF', 'N3IWF'].includes( - item.value + if (!res.data.length) { + message.warning({ + content: '无可用的自定义指标,请先添加自定义指标', + duration: 2, + }); + return false; + } + let typeArr: any = []; + res.data.forEach((item: any) => { + typeArr.push(item.neType); + }); + neInfoStore.fnNelist().then(res => { + if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) { + if (res.data.length > 0) { + // 过滤不可用的网元 + neCascaderOptions.value = neInfoStore.getNeCascaderOptions.filter( + (item: any) => { + return typeArr.includes(item.value); + } ); + if (neCascaderOptions.value.length === 0) { + message.warning({ + content: t('common.noData'), + duration: 2, + }); + return; + } + // 无查询参数neType时 默认选择UPF + const queryNeType = (route.query.neType as string) || 'UPF'; + const item = neCascaderOptions.value.find( + s => s.value === queryNeType + ); + if (item && item.children) { + const info = item.children[0]; + state.neType = [info.neType, info.neId]; + queryParams.neType = info.neType; + queryParams.neId = info.neId; + } else { + const info = neCascaderOptions.value[0].children[0]; + state.neType = [info.neType, info.neId]; + queryParams.neType = info.neType; + queryParams.neId = info.neId; + } + + // 查询当前小时 + + const now = new Date(); + now.setMinutes(0, 0, 0); + // 设置起始时间为整点前一小时 + const startTime = new Date(now); + startTime.setHours(now.getHours() - 1); + queryRangePicker.value[0] = `${startTime.getTime()}`; + // 设置结束时间为整点 + const endTime = new Date(now); + endTime.setMinutes(59, 59, 59); + queryRangePicker.value[1] = `${endTime.getTime()}`; + fnGetListTitle(); + // 绘图 + fnRanderChart(); } - ); - if (neCascaderOptions.value.length === 0) { + } else { message.warning({ content: t('common.noData'), duration: 2, }); - return; } - // 无查询参数neType时 默认选择UPF - const queryNeType = (route.query.neType as string) || 'UPF'; - const item = neCascaderOptions.value.find(s => s.value === queryNeType); - if (item && item.children) { - const info = item.children[0]; - state.neType = [info.neType, info.neId]; - queryParams.neType = info.neType; - queryParams.neId = info.neId; - } else { - const info = neCascaderOptions.value[0].children[0]; - state.neType = [info.neType, info.neId]; - queryParams.neType = info.neType; - queryParams.neId = info.neId; - } - - // 查询当前小时 - - const now = new Date(); - now.setMinutes(0, 0, 0); - queryRangePicker.value[0] = `${now.getTime()}`; - now.setMinutes(59, 59, 59); - queryRangePicker.value[1] = `${now.getTime()}`; - fnGetListTitle(); - // 绘图 - fnRanderChart(); - } - } else { - message.warning({ - content: t('common.noData'), - duration: 2, }); } });