OMC/fe.ems.vue3
1
0
Fork 0
Code Issues Releases 3 Activity

fix: 看板UDM签约数据获取x2问题

Browse Source
This commit is contained in:
TsMask
2024-12-23 20:05:13 +08:00
parent 41e37766b7
commit b7da976819
1 changed files with 187 additions and 164 deletions
Download Patch File Download Diff File Expand all files Collapse all files

255
src/views/dashboard/overview/index.vue
View File

@@ -102,111 +102,82 @@ function fnGetNeState() {
/**获取概览信息 */ /**获取概览信息 */
async function fnGetSkim() { async function fnGetSkim() {
// console.log(neCascaderOptions.value);
// const resArr = await Promise.allSettled([
// listUDMSub({
// neid: '001',
// pageNum: 1,
// pageSize: 1,
// }),
// listUENumBySMF('001'),
// listUENumByIMS('001'),
// listBase5G({
// neType: 'AMF',
// neId: '001',
// }),
// listBase5G({
// neType: 'MME',
// neId: '001',
// }),
// ]);
// if (resArr[0].status === 'fulfilled') {
// const res0 = resArr[0].value;
// if (res0.code === RESULT_CODE_SUCCESS) {
// skimState.udmSubNum = res0.total;
// }
// }
// if (resArr[1].status === 'fulfilled') {
// const res1 = resArr[1].value;
// if (res1.code === RESULT_CODE_SUCCESS) {
// skimState.smfUeNum = res1.data;
// }
// }
// if (resArr[2].status === 'fulfilled') {
// const res2 = resArr[2].value;
// if (res2.code === RESULT_CODE_SUCCESS) {
// skimState.imsUeNum = res2.data;
// }
// }
// if (resArr[3].status === 'fulfilled') {
// const res3 = resArr[3].value;
// if (res3.code === RESULT_CODE_SUCCESS) {
// skimState.gnbNum = res3.total;
// skimState.gnbUeNum = 0;
// res3.rows.map((item: any) => {
// skimState.gnbUeNum += item.ueNum;
// });
// }
// }
// if (resArr[4].status === 'fulfilled') {
// const res4 = resArr[4].value;
// if (res4.code === RESULT_CODE_SUCCESS) {
// skimState.enbNum = res4.total;
// skimState.enbUeNum = 0;
// res4.rows.map((item: any) => {
// skimState.enbUeNum += item.ueNum;
// });
// }
// }
const neHandlers = new Map([ const neHandlers = new Map([
['UDM', { [
request: (neId: string) => listUDMSub({ neid: neId, pageNum: 1, pageSize: 1 }), 'UDM',
process: (res: any) => res.code === RESULT_CODE_SUCCESS && (skimState.udmSubNum += res.total) {
}], request: (neId: string) =>
['SMF', { listUDMSub({ neId: neId, pageNum: 1, pageSize: 1 }),
process: (res: any) =>
res.code === RESULT_CODE_SUCCESS &&
(skimState.udmSubNum += res.total),
},
],
[
'SMF',
{
request: (neId: string) => listUENumBySMF(neId), request: (neId: string) => listUENumBySMF(neId),
process: (res: any) => res.code === RESULT_CODE_SUCCESS && (skimState.smfUeNum += res.data) process: (res: any) =>
}], res.code === RESULT_CODE_SUCCESS && (skimState.smfUeNum += res.data),
['IMS', { },
],
[
'IMS',
{
request: (neId: string) => listUENumByIMS(neId), request: (neId: string) => listUENumByIMS(neId),
process: (res: any) => res.code === RESULT_CODE_SUCCESS && (skimState.imsUeNum += res.data) process: (res: any) =>
}], res.code === RESULT_CODE_SUCCESS && (skimState.imsUeNum += res.data),
['AMF', { },
],
[
'AMF',
{
request: (neId: string) => listBase5G({ neType: 'AMF', neId }), request: (neId: string) => listBase5G({ neType: 'AMF', neId }),
process: (res: any) => { process: (res: any) => {
if (res.code === RESULT_CODE_SUCCESS) { if (res.code === RESULT_CODE_SUCCESS) {
skimState.gnbNum += res.total; skimState.gnbNum += res.total;
skimState.gnbUeNum += res.rows.reduce((sum: number, item: any) => sum + item.ueNum, 0); skimState.gnbUeNum += res.rows.reduce(
(sum: number, item: any) => sum + item.ueNum,
0
);
} }
} },
}], },
['MME', { ],
[
'MME',
{
request: (neId: string) => listBase5G({ neType: 'MME', neId }), request: (neId: string) => listBase5G({ neType: 'MME', neId }),
process: (res: any) => { process: (res: any) => {
if (res.code === RESULT_CODE_SUCCESS) { if (res.code === RESULT_CODE_SUCCESS) {
skimState.enbNum += res.total; skimState.enbNum += res.total;
skimState.enbUeNum += res.rows.reduce((sum: number, item: any) => sum + item.ueNum, 0); skimState.enbUeNum += res.rows.reduce(
(sum: number, item: any) => sum + item.ueNum,
0
);
} }
} },
}] },
],
]); ]);
const requests = neCascaderOptions.value.flatMap((ne: any) => const requests = neCascaderOptions.value.flatMap(
ne.children?.map((child: any) => { (ne: any) =>
ne.children
?.map((child: any) => {
const handler = neHandlers.get(child.neType); const handler = neHandlers.get(child.neType);
return handler ? { return handler
? {
promise: handler.request(child.neId), promise: handler.request(child.neId),
process: handler.process process: handler.process,
} : null; }
}).filter(Boolean) || [] : null;
})
.filter(Boolean) || []
); );
const results = await Promise.allSettled(requests.map(r => r.promise)); const results = await Promise.allSettled(requests.map(r => r.promise));
// 重置 // 重置
Object.assign(skimState, { Object.assign(skimState, {
udmSubNum: 0, udmSubNum: 0,
@@ -215,7 +186,7 @@ async function fnGetSkim() {
gnbNum: 0, gnbNum: 0,
gnbUeNum: 0, gnbUeNum: 0,
enbNum: 0, enbNum: 0,
enbUeNum: 0 enbUeNum: 0,
}); });
results.forEach((result, index) => { results.forEach((result, index) => {
if (result.status === 'fulfilled') { if (result.status === 'fulfilled') {
@@ -293,8 +264,9 @@ const getPopupContainer = () => {
}; };
onMounted(() => { onMounted(() => {
neInfoStore
neInfoStore.fnNelist().then(res => { .fnNelist()
.then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) { if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.data.length > 0) { if (res.data.length > 0) {
let arr: Record<string, any>[] = []; let arr: Record<string, any>[] = [];
@@ -313,9 +285,7 @@ onMounted(() => {
// 过滤不可用的网元 // 过滤不可用的网元
neCascaderOptions.value = neInfoStore.getNeCascaderOptions.filter( neCascaderOptions.value = neInfoStore.getNeCascaderOptions.filter(
(item: any) => { (item: any) => {
return ['UDM', 'SMF', 'IMS', 'AMF', 'MME'].includes( return ['UDM', 'SMF', 'IMS', 'AMF', 'MME'].includes(item.value);
item.value
);
} }
); );
if (neCascaderOptions.value.length === 0) { if (neCascaderOptions.value.length === 0) {
@@ -336,9 +306,8 @@ onMounted(() => {
.finally(() => { .finally(() => {
fnGetSkim().then(() => { fnGetSkim().then(() => {
loadData(); loadData();
}) });
}) });
}); });
onBeforeUnmount(() => { onBeforeUnmount(() => {
@@ -352,7 +321,11 @@ onBeforeUnmount(() => {
<template> <template>
<div class="viewport" ref="viewportDom"> <div class="viewport" ref="viewportDom">
<div class="brand"> <div class="brand">
<div class="brand-title" @click="toggle" :title="t('views.dashboard.overview.fullscreen')"> <div
class="brand-title"
@click="toggle"
:title="t('views.dashboard.overview.fullscreen')"
>
{{ t('views.dashboard.overview.title') }} {{ t('views.dashboard.overview.title') }}
<FullscreenExitOutlined v-if="isFullscreen" /> <FullscreenExitOutlined v-if="isFullscreen" />
<FullscreenOutlined v-else /> <FullscreenOutlined v-else />
@@ -369,17 +342,27 @@ onBeforeUnmount(() => {
{{ t('views.dashboard.overview.skim.userTitle') }} {{ t('views.dashboard.overview.skim.userTitle') }}
</h3> </h3>
<div class="data"> <div class="data">
<div class="item toRouter" @click="fnToRouter('Sub_2010')" :title="t('views.dashboard.overview.toRouter')"> <div
class="item toRouter"
@click="fnToRouter('Sub_2010')"
:title="t('views.dashboard.overview.toRouter')"
>
<div> <div>
<UserOutlined style="color: #4096ff; margin-right: 8px; font-size: 1.1rem" /> <UserOutlined
style="color: #4096ff; margin-right: 8px; font-size: 1.1rem"
/>
{{ skimState.udmSubNum }} {{ skimState.udmSubNum }}
</div> </div>
<span> <span>
{{ t('views.dashboard.overview.skim.users') }} {{ t('views.dashboard.overview.skim.users') }}
</span> </span>
</div> </div>
<div class="item toRouter" @click="fnToRouter('Ims_2080')" :title="t('views.dashboard.overview.toRouter')" <div
style="margin: 0 12px"> class="item toRouter"
@click="fnToRouter('Ims_2080')"
:title="t('views.dashboard.overview.toRouter')"
style="margin: 0 12px"
>
<div> <div>
<img :src="svgUserIMS" style="width: 18px; margin-right: 8px" /> <img :src="svgUserIMS" style="width: 18px; margin-right: 8px" />
{{ skimState.imsUeNum }} {{ skimState.imsUeNum }}
@@ -388,7 +371,11 @@ onBeforeUnmount(() => {
{{ t('views.dashboard.overview.skim.imsUeNum') }} {{ t('views.dashboard.overview.skim.imsUeNum') }}
</span> </span>
</div> </div>
<div class="item toRouter" @click="fnToRouter('Ue_2081')" :title="t('views.dashboard.overview.toRouter')"> <div
class="item toRouter"
@click="fnToRouter('Ue_2081')"
:title="t('views.dashboard.overview.toRouter')"
>
<div> <div>
<img :src="svgUserSMF" style="width: 18px; margin-right: 8px" /> <img :src="svgUserSMF" style="width: 18px; margin-right: 8px" />
{{ skimState.smfUeNum }} {{ skimState.smfUeNum }}
@@ -407,18 +394,29 @@ onBeforeUnmount(() => {
{{ t('views.dashboard.overview.skim.baseTitle') }} {{ t('views.dashboard.overview.skim.baseTitle') }}
</h3> </h3>
<div class="data"> <div class="data">
<div class="item toRouter" @click="fnToRouter('Base5G_2082', { neType: 'AMF' })" <div
:title="t('views.dashboard.overview.toRouter')"> class="item toRouter"
@click="fnToRouter('Base5G_2082', { neType: 'AMF' })"
:title="t('views.dashboard.overview.toRouter')"
>
<div style="align-items: flex-start"> <div style="align-items: flex-start">
<img :src="svgBase" style="width: 18px; margin-right: 8px; height: 2rem" /> <img
:src="svgBase"
style="width: 18px; margin-right: 8px; height: 2rem"
/>
{{ skimState.gnbNum }} {{ skimState.gnbNum }}
</div> </div>
<span>{{ t('views.dashboard.overview.skim.gnbBase') }}</span> <span>{{ t('views.dashboard.overview.skim.gnbBase') }}</span>
</div> </div>
<div class="item toRouter" @click="fnToRouter('Base5G_2082', { neType: 'AMF' })" <div
:title="t('views.dashboard.overview.toRouter')"> class="item toRouter"
@click="fnToRouter('Base5G_2082', { neType: 'AMF' })"
:title="t('views.dashboard.overview.toRouter')"
>
<div style="align-items: flex-start"> <div style="align-items: flex-start">
<UserOutlined style="color: #4096ff; margin-right: 8px; font-size: 1.1rem" /> <UserOutlined
style="color: #4096ff; margin-right: 8px; font-size: 1.1rem"
/>
{{ skimState.gnbUeNum }} {{ skimState.gnbUeNum }}
</div> </div>
<span>{{ t('views.dashboard.overview.skim.gnbUeNum') }}</span> <span>{{ t('views.dashboard.overview.skim.gnbUeNum') }}</span>
@@ -433,18 +431,29 @@ onBeforeUnmount(() => {
{{ t('views.dashboard.overview.skim.baseTitle') }} {{ t('views.dashboard.overview.skim.baseTitle') }}
</h3> </h3>
<div class="data"> <div class="data">
<div class="item toRouter" @click="fnToRouter('Base5G_2082', { neType: 'MME' })" <div
:title="t('views.dashboard.overview.toRouter')"> class="item toRouter"
@click="fnToRouter('Base5G_2082', { neType: 'MME' })"
:title="t('views.dashboard.overview.toRouter')"
>
<div style="align-items: flex-start"> <div style="align-items: flex-start">
<img :src="svgBase" style="width: 18px; margin-right: 8px; height: 2rem" /> <img
:src="svgBase"
style="width: 18px; margin-right: 8px; height: 2rem"
/>
{{ skimState.enbNum }} {{ skimState.enbNum }}
</div> </div>
<span>{{ t('views.dashboard.overview.skim.enbBase') }}</span> <span>{{ t('views.dashboard.overview.skim.enbBase') }}</span>
</div> </div>
<div class="item toRouter" @click="fnToRouter('Base5G_2082', { neType: 'MME' })" <div
:title="t('views.dashboard.overview.toRouter')"> class="item toRouter"
@click="fnToRouter('Base5G_2082', { neType: 'MME' })"
:title="t('views.dashboard.overview.toRouter')"
>
<div style="align-items: flex-start"> <div style="align-items: flex-start">
<UserOutlined style="color: #4096ff; margin-right: 8px; font-size: 1.1rem" /> <UserOutlined
style="color: #4096ff; margin-right: 8px; font-size: 1.1rem"
/>
{{ skimState.enbUeNum }} {{ skimState.enbUeNum }}
</div> </div>
<span>{{ t('views.dashboard.overview.skim.enbUeNum') }}</span> <span>{{ t('views.dashboard.overview.skim.enbUeNum') }}</span>
@@ -497,8 +506,11 @@ onBeforeUnmount(() => {
<!-- 网络拓扑 --> <!-- 网络拓扑 -->
<div class="topology panel"> <div class="topology panel">
<div class="inner"> <div class="inner">
<h3 class="toRouter" @click="fnToRouter('TopologyArchitecture_2128')" <h3
:title="t('views.dashboard.overview.toRouter')"> class="toRouter"
@click="fnToRouter('TopologyArchitecture_2128')"
:title="t('views.dashboard.overview.toRouter')"
>
<span> <span>
<ApartmentOutlined style="color: #68d8fe" />&nbsp;&nbsp; <ApartmentOutlined style="color: #68d8fe" />&nbsp;&nbsp;
{{ t('views.dashboard.overview.topology.title') }} {{ t('views.dashboard.overview.topology.title') }}
@@ -528,10 +540,17 @@ onBeforeUnmount(() => {
<!-- 筛选 --> <!-- 筛选 -->
<div class="filter"> <div class="filter">
<span :data-key="v" :class="{ active: upfTFActive === v }" v-for="v in ['0', '7', '30']" :key="v" @click="() => { <span
:data-key="v"
:class="{ active: upfTFActive === v }"
v-for="v in ['0', '7', '30']"
:key="v"
@click="
() => {
upfTFActive = v; upfTFActive = v;
} }
"> "
>
{{ {{
v === '0' v === '0'
? '24' + t('common.units.hour') ? '24' + t('common.units.hour')
@@ -564,7 +583,11 @@ onBeforeUnmount(() => {
<!-- 告警统计 --> <!-- 告警统计 -->
<div class="alarmType panel"> <div class="alarmType panel">
<div class="inner"> <div class="inner">
<h3 class="toRouter" @click="fnToRouter('HistoryAlarm_2097')" :title="t('views.dashboard.overview.toRouter')"> <h3
class="toRouter"
@click="fnToRouter('HistoryAlarm_2097')"
:title="t('views.dashboard.overview.toRouter')"
>
<PieChartOutlined style="color: #68d8fe" />&nbsp;&nbsp; <PieChartOutlined style="color: #68d8fe" />&nbsp;&nbsp;
{{ t('views.dashboard.overview.alarmTypeBar.alarmSum') }} {{ t('views.dashboard.overview.alarmTypeBar.alarmSum') }}
</h3> </h3>