fix: 看板拓扑网元状态移动index统一ws

This commit is contained in:
TsMask
2024-01-29 20:05:01 +08:00
parent b312e5e9b5
commit 50a146f922
2 changed files with 47 additions and 48 deletions

View File

@@ -14,9 +14,7 @@ import {
notNeNodes,
} from '../../hooks/useTopology';
import useI18n from '@/hooks/useI18n';
import useWS from '../../hooks/useWS';
const { t } = useI18n();
const { wsSend } = useWS();
/**图DOM节点实例对象 */
const graphG6Dom = ref<HTMLElement | undefined>(undefined);
@@ -239,41 +237,12 @@ function fnGraphDataLoad(reload: boolean = false) {
} else {
handleRanderGraph(graphG6Dom.value, graphState.data);
}
fnGetState(); // 获取网元状态
});
}
/**网元状态定时器 */
const stateTimeout = ref<any>(null);
/**查询网元状态 */
async function fnGetState() {
clearTimeout(stateTimeout.value);
// 获取节点状态
for (const node of graphState.data.nodes) {
if (notNeNodes.includes(node.id)) continue;
const { neType, neId } = node.neInfo;
if (!neType || !neId) continue;
wsSend({
requestId: `neState_${neType}_${neId}`,
type: 'ne_state',
data: {
neType: neType,
neId: neId,
},
});
}
stateTimeout.value = setTimeout(() => fnGetState(), 10_000);
}
onMounted(() => {
fnGraphDataLoad(false);
});
onBeforeUnmount(() => {
clearTimeout(stateTimeout.value);
});
</script>
<template>

View File

@@ -12,7 +12,7 @@ import { listSub } from '@/api/neUser/sub';
import { listUENum } from '@/api/neUser/ue';
import { listBase5G } from '@/api/neUser/base5G';
import { graphNodeClickID } from './hooks/useTopology';
import { graphNodeClickID, graphState, notNeNodes } from './hooks/useTopology';
import { upfTotalFlow, upfTFActive } from './hooks/useUPFTotalFlow';
import { useFullscreen } from '@vueuse/core';
import useWS from './hooks/useWS';
@@ -46,6 +46,50 @@ const { isFullscreen, toggle } = useFullscreen(viewportDom);
/**10s调度器 */
const stateInterval = ref<any>(null);
/**网元状态定时器 */
const stateTimeout = ref<any>(null);
/**查询网元状态 */
async function fnGetState() {
clearTimeout(stateTimeout.value);
// 获取节点状态
for (const node of graphState.data.nodes) {
if (notNeNodes.includes(node.id)) continue;
const { neType, neId } = node.neInfo;
if (!neType || !neId) continue;
wsSend({
requestId: `neState_${neType}_${neId}`,
type: 'ne_state',
data: {
neType: neType,
neId: neId,
},
});
}
stateTimeout.value = setTimeout(() => fnGetState(), 5_000);
}
function InitData() {
cdrEventSend();
ueEventSend();
upfTFSend(0);
upfTFSend(7);
upfTFSend(30);
fnGetState(); // 获取网元状态
stateInterval.value = setInterval(() => {
upfTFActive.value = upfTFActive.value >= 2 ? 0 : upfTFActive.value + 1;
if (upfTFActive.value === 0) {
upfTFSend(7);
} else if (upfTFActive.value === 1) {
upfTFSend(30);
} else if (upfTFActive.value === 2) {
upfTFSend(0);
}
}, 10_000);
}
onMounted(() => {
Promise.allSettled([
listSub({
@@ -86,26 +130,12 @@ onMounted(() => {
}
})
.finally(() => {
cdrEventSend();
ueEventSend();
upfTFSend(0);
upfTFSend(7);
upfTFSend(30);
stateInterval.value = setInterval(() => {
upfTFActive.value = upfTFActive.value >= 2 ? 0 : upfTFActive.value + 1;
if (upfTFActive.value === 0) {
upfTFSend(7);
} else if (upfTFActive.value === 1) {
upfTFSend(30);
} else if (upfTFActive.value === 2) {
upfTFSend(0);
}
}, 10_000);
InitData();
});
});
onBeforeUnmount(() => {
clearTimeout(stateTimeout.value);
clearTimeout(stateInterval.value);
});
</script>