Simon
2 lines
14 KiB
JavaScript
2 lines
14 KiB
JavaScript
import{d as U,af as te,o as Q,al as J,a as oe,X as Z,b as v,c as C,e as o,r as N,a4 as ee,i as m,f as a,w as s,j as D,ad as ae,g as A,av as ne,aw as le,ax as se,V as G,a2 as W,t as w,U as F,ay as ie,W as K,n as re,h as H,a5 as X,az as de,aA as ue,v as pe,E as ce,aa as _e,aB as ge}from"./index-DY_T097o.js";import{i as me}from"./index-Bb6yjXMn.js";import{_ as M}from"./_plugin-vue_export-helper-DlAUqK2U.js";import{a as fe}from"./index-DAqMmgYa.js";const ve={class:"graph-canvas"},j="#07C160",B="#f59e0b",ye="#9ca3af",Y="#c0c4cc",q="#3b82f6",he=U({__name:"GraphCanvas",props:{graphData:{},loading:{type:Boolean}},emits:["node-click"],setup(y,{expose:c,emit:h}){const d=y,S=h,g=N(null);let l=null,b=null,u=[],i=[],_={nodeTypes:["issue","action"],relationTypes:["LEADS_TO","RELATES_TO","CAN_JUMP_TO"]},n="";function z(){return{tooltip:{formatter:r=>r.dataType==="node"?`<b>${r.data.name}</b><br/>类型: ${r.data.nodeType}`:r.dataType==="edge"?r.data.relationType||"关系":r.name},legend:[{data:[{name:"Issue",itemStyle:{color:j}},{name:"Action",itemStyle:{color:B}},{name:"Relation",itemStyle:{color:ye,opacity:.3}}],orient:"vertical",right:10,top:10,selected:{Issue:!0,Action:!0,Relation:!1},textStyle:{fontSize:12}}],series:[{type:"graph",layout:"force",roam:!0,focusNodeAdjacency:!0,force:{repulsion:300,gravity:.1,edgeLength:[100,250],layoutAnimation:!0},categories:[{name:"Issue",itemStyle:{color:j}},{name:"Action",itemStyle:{color:B}}],label:{show:!0,position:"right",fontSize:11,color:"#303133"},lineStyle:{color:Y,width:1.5,curveness:.3},emphasis:{focus:"adjacency",lineStyle:{width:4},label:{show:!0}},data:[],links:[]}]}}function $(r){u=(r.nodes||[]).map(p=>({id:p.id,name:p.name||p.id,nodeType:p.type,category:p.type==="issue"?0:1,symbolSize:p.type==="issue"?28:22,itemStyle:{color:p.type==="issue"?j:B},properties:p.properties||{},rawData:p,draggable:!0})),i=(r.links||[]).map(p=>({source:p.source,target:p.target,relationType:p.type,weight:p.weight,lineStyle:{color:Y,width:Math.max(.5,(p.weight||1)*1.5),curveness:.3},rawData:p}))}function O(){const r=u.filter(f=>_.nodeTypes.includes(f.nodeType)),p=new Set(r.map(f=>f.id)),E=i.filter(f=>_.relationTypes.includes(f.relationType)&&p.has(f.source)&&p.has(f.target));let x;return n?x=r.map(f=>f.name.toLowerCase().includes(n.toLowerCase())?{...f,itemStyle:{...f.itemStyle,borderColor:q,borderWidth:3,shadowBlur:10,shadowColor:q}}:{...f,itemStyle:{...f.itemStyle,opacity:.15}}):x=r,{nodes:x,links:E}}function e(){if(!l)return;const{nodes:r,links:p}=O();l.setOption({series:[{data:r,links:p}]})}function t(){if(!g.value||!d.graphData)return;l||(l=me(g.value),l.on("click",x=>{var f;x.dataType==="node"&&((f=x.data)!=null&&f.rawData)&&S("node-click",x.data.rawData)})),$(d.graphData);const r=z(),{nodes:p,links:E}=O();r.series[0].data=p,r.series[0].links=E,l.setOption(r,!0)}function k(r){n=(r==null?void 0:r.trim())||"",e()}function R(){n="",e()}function I(){l==null||l.resize()}function L(r){_={...r},e()}function T(){l&&l.dispatchAction({type:"graphRoam",seriesIndex:0,zoom:1.3,originX:l.getWidth()/2,originY:l.getHeight()/2})}function V(){l&&l.dispatchAction({type:"graphRoam",seriesIndex:0,zoom:1/1.3,originX:l.getWidth()/2,originY:l.getHeight()/2})}function P(){l&&l.dispatchAction({type:"restore"})}return c({highlightSearch:k,restoreAllNodes:R,resize:I,applyFilter:L,zoomIn:T,zoomOut:V,zoomReset:P}),te(()=>d.graphData,()=>{J(()=>t())},{deep:!0}),Q(()=>{d.graphData&&J(()=>t()),g.value&&(b=new ResizeObserver(()=>{l==null||l.resize()}),b.observe(g.value))}),oe(()=>{b==null||b.disconnect(),b=null,l&&(l.dispose(),l=null)}),(r,p)=>{const E=ee("loading");return Z((v(),C("div",ve,[o("div",{ref_key:"chartContainer",ref:g,class:"graph-canvas__chart"},null,512)])),[[E,y.loading]])}}}),be=M(he,[["__scopeId","data-v-c818f9fe"]]),we={class:"graph-toolbar"},Ce={class:"graph-toolbar__group"},ke={class:"graph-toolbar__group"},Te={class:"graph-toolbar__group"},Se=U({__name:"GraphToolbar",emits:["search","filter-change","zoom-in","zoom-out","zoom-reset"],setup(y,{emit:c}){const h=c,d=N(""),S=N(["issue","action"]),g=N(["LEADS_TO","RELATES_TO","CAN_JUMP_TO"]);let l=null;function b(){l&&clearTimeout(l),l=setTimeout(()=>{h("search",d.value)},300)}function u(){d.value="",h("search","")}function i(){h("filter-change",{nodeTypes:S.value,relationTypes:g.value})}return(_,n)=>{const z=m("el-icon"),$=m("el-input"),O=m("el-divider"),e=m("el-checkbox"),t=m("el-checkbox-group"),k=m("el-option"),R=m("el-select"),I=m("el-button"),L=m("el-button-group");return v(),C("div",we,[a($,{modelValue:d.value,"onUpdate:modelValue":n[0]||(n[0]=T=>d.value=T),placeholder:"搜索节点名称...",size:"default",clearable:"",style:{width:"240px"},onInput:b,onClear:u},{prefix:s(()=>[a(z,null,{default:s(()=>[a(D(ae))]),_:1})]),_:1},8,["modelValue"]),a(O,{direction:"vertical"}),o("div",Ce,[n[9]||(n[9]=o("span",{class:"graph-toolbar__label"},"节点类型",-1)),a(t,{modelValue:S.value,"onUpdate:modelValue":n[1]||(n[1]=T=>S.value=T),onChange:i},{default:s(()=>[a(e,{label:"issue"},{default:s(()=>[...n[6]||(n[6]=[o("span",{class:"graph-toolbar__dot",style:{background:"#07C160"}},null,-1),A(" Issue ",-1)])]),_:1}),a(e,{label:"action"},{default:s(()=>[...n[7]||(n[7]=[o("span",{class:"graph-toolbar__dot",style:{background:"#f59e0b"}},null,-1),A(" Action ",-1)])]),_:1}),a(e,{label:"relation",disabled:""},{default:s(()=>[...n[8]||(n[8]=[o("span",{class:"graph-toolbar__dot",style:{background:"#9ca3af",opacity:"0.3"}},null,-1),A(" Relation ",-1)])]),_:1})]),_:1},8,["modelValue"])]),a(O,{direction:"vertical"}),o("div",ke,[n[10]||(n[10]=o("span",{class:"graph-toolbar__label"},"关系类型",-1)),a(R,{modelValue:g.value,"onUpdate:modelValue":n[2]||(n[2]=T=>g.value=T),multiple:"","collapse-tags":"","collapse-tags-tooltip":"",placeholder:"选择关系类型",size:"default",style:{width:"260px"},onChange:i},{default:s(()=>[a(k,{label:"LEADS_TO",value:"LEADS_TO"}),a(k,{label:"RELATES_TO",value:"RELATES_TO"}),a(k,{label:"CAN_JUMP_TO",value:"CAN_JUMP_TO"}),a(k,{label:"DERIVED_FROM",value:"DERIVED_FROM",disabled:""})]),_:1},8,["modelValue"])]),a(O,{direction:"vertical"}),o("div",Te,[n[11]||(n[11]=o("span",{class:"graph-toolbar__label"},"缩放",-1)),a(L,null,{default:s(()=>[a(I,{size:"default",onClick:n[3]||(n[3]=T=>h("zoom-in"))},{default:s(()=>[a(z,null,{default:s(()=>[a(D(ne))]),_:1})]),_:1}),a(I,{size:"default",onClick:n[4]||(n[4]=T=>h("zoom-out"))},{default:s(()=>[a(z,null,{default:s(()=>[a(D(le))]),_:1})]),_:1}),a(I,{size:"default",onClick:n[5]||(n[5]=T=>h("zoom-reset"))},{default:s(()=>[a(z,null,{default:s(()=>[a(D(se))]),_:1})]),_:1})]),_:1})])])}}}),ze=M(Se,[["__scopeId","data-v-2ed6d8aa"]]),Oe={class:"node-detail-panel"},Ne={key:0,class:"node-detail-panel__empty"},Ae={class:"node-detail-panel__header"},Ie=["title"],De={class:"node-detail-panel__section"},$e={class:"node-detail-panel__uuid"},xe={key:0,class:"node-detail-panel__section"},Re={class:"node-detail-panel__section"},Le={class:"node-detail-panel__section-title"},Ee={class:"node-detail-panel__count"},Ve={key:0,class:"node-detail-panel__no-relations"},Fe={key:1,class:"node-detail-panel__relation-list"},Ue={class:"node-detail-panel__relation-direction"},Me={key:0,class:"node-detail-panel__relation-weight"},Pe=U({__name:"NodeDetailPanel",props:{node:{},links:{},nodes:{}},setup(y){const c=y,h={issue:"#07C160",action:"#f59e0b",relation:"#9ca3af"},d=F(()=>c.node&&h[c.node.type]||"#909399"),S=F(()=>{var u;return(u=c.node)!=null&&u.properties?Object.entries(c.node.properties).filter(([i])=>!["name","type","id"].includes(i)).map(([i,_])=>({key:i,value:_})):[]}),g=F(()=>{const u=new Map;for(const i of c.nodes)u.set(i.id,i);return u}),l=F(()=>{if(!c.node)return[];const u=c.node.id,i=[];for(const _ of c.links)if(_.source===u){const n=g.value.get(_.target);i.push({type:_.type,weight:_.weight??null,sourceName:c.node.name,targetName:(n==null?void 0:n.name)||_.target,direction:"outgoing"})}else if(_.target===u){const n=g.value.get(_.source);i.push({type:_.type,weight:_.weight??null,sourceName:(n==null?void 0:n.name)||_.source,targetName:c.node.name,direction:"incoming"})}return i});function b(u){return u==null?"—":Array.isArray(u)?u.join(", "):typeof u=="object"?JSON.stringify(u):String(u)}return(u,i)=>{const _=m("el-icon"),n=m("el-descriptions-item"),z=m("el-descriptions"),$=m("el-tag"),O=m("el-scrollbar");return v(),C("div",Oe,[y.node?(v(),C(G,{key:1},[o("div",Ae,[o("span",{class:"node-detail-panel__type-badge",style:W({background:d.value+"20",color:d.value})},w(y.node.type),5),o("h3",{class:"node-detail-panel__name",title:y.node.name},w(y.node.name),9,Ie)]),a(O,{class:"node-detail-panel__scroll"},{default:s(()=>[o("div",De,[i[1]||(i[1]=o("div",{class:"node-detail-panel__section-title"},"基本属性",-1)),a(z,{column:1,border:"",size:"small"},{default:s(()=>[a(n,{label:"名称"},{default:s(()=>[A(w(y.node.name),1)]),_:1}),a(n,{label:"类型"},{default:s(()=>[o("span",{class:"node-detail-panel__type-tag",style:W({background:d.value+"20",color:d.value})},w(y.node.type),5)]),_:1}),a(n,{label:"UUID"},{default:s(()=>[o("span",$e,w(y.node.id),1)]),_:1})]),_:1})]),S.value.length>0?(v(),C("div",xe,[i[2]||(i[2]=o("div",{class:"node-detail-panel__section-title"},"其他属性",-1)),a(z,{column:1,border:"",size:"small"},{default:s(()=>[(v(!0),C(G,null,K(S.value,e=>(v(),re(n,{key:e.key,label:e.key},{default:s(()=>[A(w(b(e.value)),1)]),_:2},1032,["label"]))),128))]),_:1})])):H("",!0),o("div",Re,[o("div",Le,[i[3]||(i[3]=A(" 关联关系 ",-1)),o("span",Ee," ("+w(l.value.length)+") ",1)]),l.value.length===0?(v(),C("div",Ve," 暂无关联关系 ")):(v(),C("div",Fe,[(v(!0),C(G,null,K(l.value,(e,t)=>(v(),C("div",{key:t,class:"node-detail-panel__relation-item"},[o("div",Ue,[o("span",{class:X(["node-detail-panel__relation-node",{"node-detail-panel__relation-node--current":e.direction==="outgoing"}])},w(e.sourceName),3),a(_,{class:"node-detail-panel__relation-arrow"},{default:s(()=>[a(D(de))]),_:1}),o("span",{class:X(["node-detail-panel__relation-node",{"node-detail-panel__relation-node--current":e.direction==="incoming"}])},w(e.targetName),3)]),a($,{size:"small",type:"info",effect:"plain"},{default:s(()=>[A(w(e.type),1)]),_:2},1024),e.weight!==void 0&&e.weight!==null?(v(),C("span",Me," w: "+w(e.weight.toFixed(2)),1)):H("",!0)]))),128))]))])]),_:1})],64)):(v(),C("div",Ne,[a(_,{size:40,color:"#c0c4cc"},{default:s(()=>[a(D(ie))]),_:1}),i[0]||(i[0]=o("p",null,"点击图谱中的节点查看详情",-1))]))])}}}),Ge=M(Pe,[["__scopeId","data-v-4fea2bd1"]]);function je(y){return fe.get("/admin/knowledge-iteration/graph",{params:y})}const Be={class:"topology-preview-page"},Ze={class:"topology-preview-page__header"},He={class:"topology-preview-page__header-actions"},Je={class:"topology-preview-page__stats-bar"},We={class:"topology-preview-page__stat-item"},Ke={class:"topology-preview-page__stat-value"},Xe={class:"topology-preview-page__stat-item"},Ye={class:"topology-preview-page__stat-value"},qe={class:"topology-preview-page__stat-item"},Qe={class:"topology-preview-page__stat-value"},et={class:"topology-preview-page__stat-item"},tt={class:"topology-preview-page__stat-value"},ot={class:"topology-preview-page__main"},at={class:"topology-preview-page__canvas-wrapper","element-loading-text":"加载图谱数据..."},nt={key:0,class:"topology-preview-page__empty"},lt={class:"topology-preview-page__detail-wrapper"},st=U({__name:"TopologyPreview",setup(y){const c=N(!1),h=N(""),d=N(null),S=N(null),g=N(null),l=pe({totalNodes:0,issueCount:0,actionCount:0,linkCount:0});async function b(){c.value=!0,S.value=null;try{const e={limit:200};h.value.trim()&&(e.issue_name=h.value.trim());const t=await je(e),k={nodes:(t==null?void 0:t.nodes)||[],links:(t==null?void 0:t.links)||[]};d.value=k,u(k)}catch(e){console.error("获取图谱数据失败:",e),ce.error((e==null?void 0:e.message)||"获取图谱数据失败"),d.value={nodes:[],links:[]},u(d.value)}finally{c.value=!1}}function u(e){l.totalNodes=e.nodes.length,l.issueCount=e.nodes.filter(t=>t.type==="issue").length,l.actionCount=e.nodes.filter(t=>t.type==="action").length,l.linkCount=e.links.length}function i(e){var t,k;e?(k=g.value)==null||k.highlightSearch(e):(t=g.value)==null||t.restoreAllNodes()}function _(e){var t;(t=g.value)==null||t.applyFilter(e)}function n(e){S.value=e}function z(){var e;(e=g.value)==null||e.zoomIn()}function $(){var e;(e=g.value)==null||e.zoomOut()}function O(){var e;(e=g.value)==null||e.zoomReset()}return Q(()=>{b()}),(e,t)=>{var T,V;const k=m("el-input"),R=m("el-icon"),I=m("el-button"),L=ee("loading");return v(),C("div",Be,[o("div",Ze,[t[2]||(t[2]=o("h2",null,"🔍 知识图谱拓扑预览",-1)),o("div",He,[a(k,{modelValue:h.value,"onUpdate:modelValue":t[0]||(t[0]=P=>h.value=P),placeholder:"按 Issue 名称筛选子图（留空查全图）",size:"default",style:{width:"280px"},clearable:"",onChange:b},null,8,["modelValue"]),a(I,{loading:c.value,onClick:b},{default:s(()=>[a(R,null,{default:s(()=>[a(D(_e))]),_:1}),t[1]||(t[1]=A(" 刷新 ",-1))]),_:1},8,["loading"])])]),o("div",Je,[o("div",We,[o("span",Ke,w(l.totalNodes),1),t[3]||(t[3]=o("span",{class:"topology-preview-page__stat-label"},"节点总数",-1))]),o("div",Xe,[t[4]||(t[4]=o("span",{class:"topology-preview-page__stat-dot",style:{background:"#07C160"}},null,-1)),o("span",Ye,w(l.issueCount),1),t[5]||(t[5]=o("span",{class:"topology-preview-page__stat-label"},"Issue",-1))]),o("div",qe,[t[6]||(t[6]=o("span",{class:"topology-preview-page__stat-dot",style:{background:"#f59e0b"}},null,-1)),o("span",Qe,w(l.actionCount),1),t[7]||(t[7]=o("span",{class:"topology-preview-page__stat-label"},"Action",-1))]),o("div",et,[o("span",tt,w(l.linkCount),1),t[8]||(t[8]=o("span",{class:"topology-preview-page__stat-label"},"关系数",-1))])]),a(ze,{onSearch:i,onFilterChange:_,onZoomIn:z,onZoomOut:$,onZoomReset:O}),o("div",ot,[Z((v(),C("div",at,[!c.value&&(!d.value||d.value.nodes.length===0)?(v(),C("div",nt,[a(R,{size:48,color:"#c0c4cc"},{default:s(()=>[a(D(ge))]),_:1}),t[10]||(t[10]=o("p",{class:"topology-preview-page__empty-title"},"暂无图谱数据",-1)),t[11]||(t[11]=o("p",{class:"topology-preview-page__empty-desc"}," Neo4j 可能未启动或知识库尚未同步图谱数据 ",-1)),a(I,{type:"primary",plain:"",onClick:b},{default:s(()=>[...t[9]||(t[9]=[A(" 重新加载 ",-1)])]),_:1})])):H("",!0),Z(a(be,{ref_key:"graphCanvasRef",ref:g,"graph-data":d.value,loading:c.value,onNodeClick:n},null,8,["graph-data","loading"]),[[ue,!c.value&&d.value&&d.value.nodes.length>0]])])),[[L,c.value]]),o("div",lt,[a(Ge,{node:S.value,links:((T=d.value)==null?void 0:T.links)||[],nodes:((V=d.value)==null?void 0:V.nodes)||[]},null,8,["node","links","nodes"])])])])}}}),pt=M(st,[["__scopeId","data-v-4fe1139a"]]);export{pt as default};
|