54 lines
6.8 KiB
JavaScript
54 lines
6.8 KiB
JavaScript
import{g as F,r as I,_ as H,c5 as q,bE as X,W as Y,b1 as j,k as J,m as K,n as v,t as N,J as x,F as $,p as C,az as Q,E as Z,ak as ee,l as T,V as te,bF as ne}from"./vendor/index.CRpmXtWV.js";import{d as oe,R as A,x as ae,p as se,_ as ie}from"../index.D-NvtsOM.js";import{l as re}from"./neInfo.DNMxf4Rh.js";import{g as le}from"./topology.MJW1k77f.js";import{a as de,b as ce,e as ue,c as pe,d as fe,f as ge,n as me}from"./registerNode.C2fezJFu.js";import{u as ve}from"./useNeOptions.D0m5KK0B.js";import{W as he}from"./ws-websocket.Bq7KFeli.js";import"./configParam.AWgeHloX.js";const ye={class:"button-container",style:{"margin-bottom":"-12px"}},Se=F({__name:"index",setup(we){const{t:a}=oe(),{fnNeRestart:B,fnNeStop:G,fnNeLogFile:L}=ve(),b=new he,R=I(void 0),f=H({group:"5GC System Architecture",data:{combos:[],edges:[],nodes:[]}}),g=["5GC","DN","UE","Base","lan","lan1","lan2","lan3","lan4","lan5","lan6","lan7","LAN","NR"],d=I(null),O=new q({offsetX:6,offseY:10,itemTypes:["node"],getContent(o){if(!o)return a("views.monitor.topologyBuild.graphNotInfo");const{id:t,label:n,neState:e}=o.item?.getModel();return g.includes(t)?`<div><span>${n||t}</span></div>`:e?`
|
||
<div
|
||
style="
|
||
display: flex;
|
||
flex-direction: column;
|
||
width: 140px;
|
||
"
|
||
>
|
||
<h3 style="margin-bottom: 8px">
|
||
${a("views.monitor.topology.name")}:
|
||
${e.neName??"--"}
|
||
</h3>
|
||
<div id="restart" style="cursor: pointer; margin-bottom: 4px">
|
||
> ${a("views.configManage.neManage.restart")}
|
||
</div>
|
||
<div id="stop" style="cursor: pointer; margin-bottom: 4px;">
|
||
> ${a("views.configManage.neManage.stop")}
|
||
</div>
|
||
<div id="log" style="cursor: pointer; margin-bottom: 4px;">
|
||
> ${a("views.configManage.neManage.log")}
|
||
</div>
|
||
</div>
|
||
`:`<div><span>${n||t}</span></div>`},handleMenuClick(o,t){const{neInfo:n}=t?.getModel(),{neName:e,neType:r,neId:c}=n;switch(o.id){case"restart":B({neName:e,neType:r,neId:c});break;case"stop":G({neName:e,neType:r,neId:c});break;case"log":L({neType:r,neId:c});break}}}),V=new X({offsetX:10,offsetY:20,getContent(o){if(!o)return a("views.monitor.topologyBuild.graphNotInfo");const{id:t,label:n,neState:e}=o.item?.getModel();return g.includes(t)?`<div><span>${n||t}</span></div>`:e?`
|
||
<div
|
||
style="
|
||
display: flex;
|
||
flex-direction: column;
|
||
width: 200px;
|
||
"
|
||
>
|
||
<div><strong>${a("views.monitor.topology.state")}：</strong><span>
|
||
${e.online?a("views.monitor.topology.normalcy"):a("views.monitor.topology.exceptions")}
|
||
</span></div>
|
||
<div><strong>${a("views.monitor.topology.refreshTime")}：</strong><span>
|
||
${e.refreshTime??"--"}
|
||
</span></div>
|
||
<div>========================</div>
|
||
<div><strong>ID：</strong><span>${e.neId}</span></div>
|
||
<div><strong>${a("views.monitor.topology.name")}：</strong><span>
|
||
${e.neName??"--"}
|
||
</span></div>
|
||
<div><strong>IP：</strong><span>${e.neIP}</span></div>
|
||
<div><strong>${a("views.monitor.topology.version")}：</strong><span>
|
||
${e.version??"--"}
|
||
</span></div>
|
||
<div><strong>${a("views.monitor.topology.serialNum")}：</strong><span>
|
||
${e.sn??"--"}
|
||
</span></div>
|
||
<div><strong>${a("views.monitor.topology.expiryDate")}：</strong><span>
|
||
${e.expire??"--"}
|
||
</span></div>
|
||
</div>
|
||
`:`<div><span>${n||t}</span></div>`},itemTypes:["node"]});function z(){de(),ce(),ue(),pe(),fe(),ge(),me()}function P(o,t){if(!o)return;const{clientHeight:n,clientWidth:e}=o;z();const r=new ne({container:o,width:e,height:n,fitCenter:!0,fitView:!0,fitViewPadding:[40],autoPaint:!0,modes:{default:["drag-combo","drag-canvas","zoom-canvas","collapse-expand-combo"]},groupByTypes:!1,nodeStateStyles:{selected:{fill:"transparent"}},plugins:[O,V],animate:!0,animateCfg:{duration:500,easing:"linearEasing"}});r.data(t),r.render(),d.value=r;var c=new ResizeObserver(function(y){y.forEach(function(s){d.value&&(d.value.changeSize(s.contentRect.width,s.contentRect.height-30),d.value.fitCenter())})});return c.observe(o),r}function D(o=!1){Promise.all([le(f.group),re({bandStatus:!1})]).then(t=>{const n=t[0],e=t[1];if(n.code===A&&Array.isArray(n.data.nodes)&&n.data.nodes.length>0&&e.code===A&&Array.isArray(e.data)&&e.data.length>0)return{graphData:n.data,neList:e.data};T.message.warning({content:a("views.monitor.topology.noData"),duration:5})}).then(t=>{if(!t)return;const{combos:n,edges:e,nodes:r}=t.graphData,c=r.filter(s=>{Reflect.set(s,"neState",{online:!1});const u=s.id;return!!(t.neList.some(l=>(Reflect.set(s,"neInfo",l.neType===u?l:{}),l.neType===u))||g.includes(u))}),y=e.filter(s=>{const u=s.source,p=s.target,l=c.some(i=>i.id===u),m=c.some(i=>i.id===p);return!!(l&&m||l&&g.includes(p)||m&&g.includes(u))});n.forEach(s=>{const u=s.children;return s.children=u.filter(p=>c.some(l=>l.id===p.id)),s}),f.data={combos:n,edges:y,nodes:c}}).finally(()=>{f.data.length<0||(o?d.value.read(f.data):P(R.value,f.data),clearInterval(h.value),h.value=null,M().finally(()=>{h.value=setInterval(()=>{M()},1e4)}))})}const h=I(null);async function M(){for(const o of f.data.nodes){if(g.includes(o.id))continue;const{neType:t,neId:n}=o.neInfo;!t||!n||b.send({requestId:`${t}_${n}`,type:"ne_state",data:{neType:t,neId:n}})}}function U(o){console.error(o)}function W(o){const{code:t,requestId:n,data:e}=o;if(t===ae){console.warn(o.msg);return}if(!n)return;const[r,c]=n.split("_"),{combos:y,edges:s,nodes:u}=f.data,p=u.find(i=>i.id===r),l=Object.assign(p.neState,e,{refreshTime:se(e.refreshTime,"HH:mm:ss"),online:!!e.cpu}),m=d.value.findById(p.id);if(m){const i=l.online?"#52c41a":"#f5222d";p.type.startsWith("image")?(p.label!==l.neName&&d.value.updateItem(m,{label:l.neName}),d.value.setItemState(m,"top-right-dot",i)):(d.value.updateItem(m,{label:l.neName,style:{fill:i,stroke:i}}),d.value.setItemState(m,"stroke",l.online))}for(const i of s){const E=i.source,k=i.target,S=u.find(_=>_.id===E),w=u.find(_=>_.id===k);S&&w&&d.value.setItemState(i.id,"circle-move",S.neState.online&&w.neState.online),S&&g.includes(k)&&d.value.setItemState(i.id,"line-dash",S.neState.online),w&&g.includes(E)&&d.value.setItemState(i.id,"line-dash",w.neState.online)}}return Y(()=>{D(!1);const o={url:"/ws",onmessage:W,onerror:U};b.connect(o)}),j(()=>{b.close(),clearInterval(h.value),h.value=null}),(o,t)=>{const n=te,e=T.Button,r=T.Card;return J(),K(C(ee),null,{default:v(()=>[N(r,{bordered:!1,"body-style":{marginBottom:"24px"},size:"small"},{title:v(()=>[x("div",ye,[x("span",null,$(C(a)("views.monitor.topologyBuild.graphGroup"))+"： "+$(f.group),1)])]),extra:v(()=>[N(e,{type:"default",onClick:t[0]||(t[0]=Q(c=>D(!0),["prevent"]))},{icon:v(()=>[N(n)]),default:v(()=>[Z(" "+$(C(a)("common.reloadText")),1)]),_:1})]),default:v(()=>[x("div",{ref_key:"graphG6Dom",ref:R,class:"chart"},null,512)]),_:1})]),_:1})}}}),Re=ie(Se,[["__scopeId","data-v-4c615be7"]]);export{Re as default};
|