diff --git a/src/views/dashboard/overview/hooks/useWS.ts b/src/views/dashboard/overview/hooks/useWS.ts index 854a122b..9eb10fac 100644 --- a/src/views/dashboard/overview/hooks/useWS.ts +++ b/src/views/dashboard/overview/hooks/useWS.ts @@ -1,6 +1,6 @@ import { RESULT_CODE_ERROR } from '@/constants/result-constants'; import { OptionsType, WS } from '@/plugins/ws-websocket'; -import { onBeforeUnmount, onMounted } from 'vue'; +import { onBeforeUnmount, onMounted, ref } from 'vue'; import { eventListParse, eventItemParseAndPush, @@ -15,6 +15,12 @@ import { import { topologyReset, neStateParse } from './useTopology'; import PQueue from 'p-queue'; +/**UPF-的Id */ +export const upfWhoId = ref('001'); + +/**UPF-的RmUid */ +export const upfWhoRmUid = ref(''); + /**websocket连接 */ export default function useWS() { const ws = new WS(); @@ -33,13 +39,12 @@ export default function useWS() { /**接收数据后回调 */ function wsMessage(res: Record) { - // console.log(res); + //console.log(res); const { code, requestId, data } = res; if (code === RESULT_CODE_ERROR) { console.warn(res.msg); return; } - // 网元状态 if (requestId && requestId.startsWith('neState')) { const neType = requestId.split('_')[1]; @@ -92,9 +97,10 @@ export default function useWS() { if (!data?.groupId) { return; } + switch (data.groupId) { // kpiEvent 指标UPF - case '12': + case '12_' + upfWhoRmUid.value: if (data.data) { upfFlowParse(data.data); } @@ -135,13 +141,12 @@ export default function useWS() { return; } upfTotalFlow.value[index].requestFlag = true; - ws.send({ requestId: `1030_${day}`, type: 'upf_tf', data: { neType: 'UPF', - neId: '001', + neId: upfWhoId.value, day: day, }, }); @@ -191,6 +196,31 @@ export default function useWS() { }); } + /**重新发送至UPF 12_rmUid */ + function reSendUPF(rmUid: string) { + upfWhoRmUid.value = rmUid; + ws.close(); + const options: OptionsType = { + url: '/ws', + params: { + /**订阅通道组 + * + * 指标UPF (GroupID:12) + * AMF_UE会话事件(GroupID:1010) + * MME_UE会话事件(GroupID:1011) + * IMS_CDR会话事件(GroupID:1005) + */ + subGroupID: '12_' + rmUid + ',1010,1005', + }, + onmessage: wsMessage, + onerror: wsError, + }; + setTimeout(() => { + // 在这里进行重新连接WebSocket的操作 + ws.connect(options); + }, 1000); //延迟1秒 + } + onMounted(() => { const options: OptionsType = { url: '/ws', @@ -202,7 +232,7 @@ export default function useWS() { * MME_UE会话事件(GroupID:1011) * IMS_CDR会话事件(GroupID:1005) */ - subGroupID: '12,1010,1011,1005', + subGroupID: '12_' + upfWhoRmUid.value + ',1010,1005', }, onmessage: wsMessage, onerror: wsError, @@ -221,5 +251,6 @@ export default function useWS() { wsSend, userActivitySend, upfTFSend, + reSendUPF, }; } diff --git a/src/views/dashboard/overview/index.vue b/src/views/dashboard/overview/index.vue index 60a2e1ee..e41987bb 100644 --- a/src/views/dashboard/overview/index.vue +++ b/src/views/dashboard/overview/index.vue @@ -21,6 +21,8 @@ import { neStateRequestMap, } from './hooks/useTopology'; import { upfTotalFlow, upfTFActive } from './hooks/useUPFTotalFlow'; +import { upfWhoId, upfWhoRmUid } from './hooks/useWS'; + import { useFullscreen } from '@vueuse/core'; import useWS from './hooks/useWS'; import useAppStore from '@/store/modules/app'; @@ -32,12 +34,12 @@ import useNeInfoStore from '@/store/modules/neinfo'; const router = useRouter(); const appStore = useAppStore(); const { t } = useI18n(); -const { wsSend, userActivitySend, upfTFSend } = useWS(); +const { wsSend, userActivitySend, upfTFSend, reSendUPF } = useWS(); /**网元参数 */ let neOtions = ref[]>([]); -/**网元Id */ +/**UPF网元Id */ let neRealId = ref; /**概览状态类型 */ @@ -193,6 +195,16 @@ function fnToRouter(name: string, query?: any) { router.push({ name, query }); } +// UPF实时流量下拉框选择 +function fnSelectNe(value: any, option: any) { + neRealId = value; + upfWhoId.value = value; + reSendUPF(option.rmUid); + upfTotalFlow.value.map((item: any) => { + item.requestFlag = false; + }); +} + onMounted(() => { fnGetSkim().then(() => { loadData(); @@ -206,12 +218,14 @@ onMounted(() => { let arr: Record[] = []; res.data.forEach(i => { if (i.neType === 'UPF') { - arr.push({ value: i.neId, label: i.neName }); + arr.push({ value: i.neId, label: i.neName, rmUid: i.rmUid }); } }); + //arr.push({ value: '002', label: 'UPF_002', rmUid: '4400HXUPF002' }); neOtions.value = arr; if (arr.length > 0) { neRealId = arr[0].value; + reSendUPF(arr[0].rmUid); } } } else { @@ -243,7 +257,9 @@ onBeforeUnmount(() => { -
{{ appStore.appName }}
+
+ {{ appStore.appName }} +
@@ -399,7 +415,8 @@ onBeforeUnmount(() => { v-model:value="neRealId" :options="neOtions" class="toDeep" - style="width: 100px; color: #fff;" + style="width: 100px; color: #fff" + @change="fnSelectNe" />
@@ -519,8 +536,6 @@ onBeforeUnmount(() => { - - diff --git a/src/views/index/tenantUPF.vue b/src/views/index/tenantUPF.vue index 5993ff27..1445ba3c 100644 --- a/src/views/index/tenantUPF.vue +++ b/src/views/index/tenantUPF.vue @@ -22,9 +22,10 @@ import { upfFlowParse, } from '../dashboard/overview/hooks/useUPFTotalFlow'; -import { parseSizeFromKbs } from '@/utils/parse-utils'; -import { onBeforeMount } from 'vue'; -import { onBeforeUnmount } from 'vue'; +import { upfWhoRmUid } from '../dashboard/overview/hooks/useWS'; +import useWS from '../dashboard/overview/hooks/useWS'; +const { reSendUPF } = useWS(); + const { t } = useI18n(); echarts.use([ @@ -219,6 +220,9 @@ function fnGetInitData() { }) .then(res => { if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) { + if (res.data.length > 0) { + reSendUPF(res.data[0].rmUID); + } for (const item of res.data) { upfFlowParse(item); } diff --git a/src/views/system/tenant/index.vue b/src/views/system/tenant/index.vue index f5c45f66..3ec39607 100644 --- a/src/views/system/tenant/index.vue +++ b/src/views/system/tenant/index.vue @@ -12,7 +12,6 @@ import { delDept, addDept, updateDept, - listDeptExcludeChild, } from '@/api/system/tenant'; import useDictStore from '@/store/modules/dict'; import { parseDateToStr } from '@/utils/date-utils';