From 127fd54ea358edd232eacaf032335e5f197bb34c Mon Sep 17 00:00:00 2001 From: zhangxiaomeng <1362468712@qq.com> Date: Wed, 5 Feb 2025 14:22:17 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B7=B3=E8=BD=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- kcui/src/view/Graph.vue | 181 +++++++++++++++++++++++++++++++----------------- 1 file changed, 116 insertions(+), 65 deletions(-) diff --git a/kcui/src/view/Graph.vue b/kcui/src/view/Graph.vue index 703df7d..1bd7ea5 100644 --- a/kcui/src/view/Graph.vue +++ b/kcui/src/view/Graph.vue @@ -2,6 +2,12 @@
跳转1
+
关键字:
+ +
+ 查询 +
@@ -9,35 +15,50 @@
- - - -
-
-

请输入分支内容

- - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 取 消 + 提 交 + + - - - - -
-
@@ -46,15 +67,15 @@ import {getgraphInfo, test} from "@/api/login"; import VisGraph from '@/assets/js/graphvis.min.20241008.js' import LayoutFactory from '@/assets/js/graphvis.layout.min.js' import {config} from '@/assets/defaultConfig.js' -import {addNode} from "@/api/file"; +import {addNode, getFileIdByDocId} from "@/api/file"; export default { // eslint-disable-next-line vue/multi-word-component-names - name: 'Graph', + name: 'Home', data() { - return{ - infos:[], - demoData:{}, + return { + infos: [], + demoData: {}, graphData: { nodes: [], links: [] @@ -69,23 +90,46 @@ export default { newBranchFileId: '', newBranchLevel: null, newBranchParentId: '', - newBranchRelation:'' - + newBranchRelation: '', + typeValue: '', + keywords: '', } }, - methods:{ - goBook(){ - this.$router.push({name:'Book',query: {id:'1'}}) + methods: { + goBook() { + this.$router.push({name: 'Book', query: {id: '1'}}) }, onCreated(editor) { this.editor = Object.seal(editor) // 一定要用 Object.seal() ，否则会报错 }, - getInfo(){ - var data = {} - getgraphInfo(data).then((res)=>{ - this.zhengl(res.data); + // getInfo(){ + // var data = {} + // getgraphInfo(data).then((res)=>{ + // this.zhengl(res.data); + // + // }) + // }, + getInfo() { + + this.data = undefined; + if (this.keywords != '' && this.keywords != undefined) { + this.visGraph.clearAll(); + let params = { + nodename: this.keywords, + }; + getgraphInfo(params).then((res) => { + this.zhengl(res.data); + }) + } else { + + let params = {}; + + getgraphInfo(params).then((res) => { + this.zhengl(res.data); + }) + } + - }) }, async drawGraphData() { this.graphData = this.demoData; @@ -122,14 +166,27 @@ export default { }; this.visGraph = new VisGraph(document.getElementById('graph-panel'), configWithEvents); }, - showPopup(node) { + async showPopup(node) { console.log("o----------") console.log(node) this.selectedNode = node; this.newBranchParentId = node.properties.docId; - this.newBranchLevel = parseInt(node.properties.level) + 1; + this.newBranchLevel = parseInt(node.properties.level) + 1; + + try { + const response = await this.getFileIdByDocId({docId: node.properties.docId}); + this.newBranchFileId = response.fileId; + } catch (error) { + console.error('Failed to fetch file ID:', error); + alert('无法获取文件ID，请稍后再试。'); + return; + } + this.isModalVisible = true; // 显示模态框 }, + getFileIdByDocId(data) { + return getFileIdByDocId(data); + }, closeModal() { this.isModalVisible = false; this.newBranchContent = ''; @@ -160,7 +217,7 @@ export default { const newNode = { id: newNodeId, label: content, - properties: { name: content, docId: newNodeId, level: this.newBranchLevel }, + properties: {name: content, docId: newNodeId, level: this.newBranchLevel}, ...this.getNodeStyle(this.newBranchLevel) // 根据层级应用样式 }; const newLink = { @@ -234,7 +291,7 @@ export default { var allOne = "" console.log(nodeList) - if(nodeList!=undefined){ + if (nodeList != undefined) { allOne = nodeList[0].docId for (let a = 0; a < nodeList.length; a++) { const group = parseInt(nodeList[a].group, 10); @@ -243,7 +300,7 @@ export default { nodes.push({ id: nodeList[a].id, label: nodeList[a].name, - properties: { name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne, leve: nodeList[a].group }, + properties: {name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne, leve: nodeList[a].group}, ...style // 展开 style 对象以应用样式属性 }); } @@ -252,7 +309,7 @@ export default { // var allOne = nodeList[0].docId - if(lineList!=undefined){ + if (lineList != undefined) { for (let b = 0; b < lineList.length; b++) { var bbb = {name: lineList[b].relate} @@ -276,34 +333,28 @@ export default { }, getNodeStyle(group) { const styles = [ - { size: 450, color: '227,203,0', font: 'normal 70px Arial', fontColor: '255,255,255' }, - { size: 350, width: 350, height: 300, color: '47,47,230', font: 'normal 68px Arial', fontColor: '255,255,255' }, - { size: 300, width: 300, height: 250, color: '255,138,0', font: 'normal 50px Arial', fontColor: '255,255,255' }, - { size: 250, width: 250, height: 250, color: '30,255,0', font: 'normal 40px Arial', fontColor: '0,0,0' }, - { size: 200, width: 200, height: 200, color: '248,143,248', font: 'normal 32px Arial', fontColor: '255,255,255' }, - { size: 150, width: 150, height: 150, color: '65,154,255', font: 'normal 30px Arial', fontColor: '255,255,255' }, - { size: 100, width: 100, height: 100, color: '0,228,255', font: 'normal 28px Arial', fontColor: '0,0,0' } + {size: 450, color: '227,203,0', font: 'normal 70px Arial', fontColor: '255,255,255'}, + {size: 350, width: 350, height: 300, color: '47,47,230', font: 'normal 68px Arial', fontColor: '255,255,255'}, + {size: 300, width: 300, height: 250, color: '255,138,0', font: 'normal 50px Arial', fontColor: '255,255,255'}, + {size: 250, width: 250, height: 250, color: '30,255,0', font: 'normal 40px Arial', fontColor: '0,0,0'}, + {size: 200, width: 200, height: 200, color: '248,143,248', font: 'normal 32px Arial', fontColor: '255,255,255'}, + {size: 150, width: 150, height: 150, color: '65,154,255', font: 'normal 30px Arial', fontColor: '255,255,255'}, + {size: 100, width: 100, height: 100, color: '0,228,255', font: 'normal 28px Arial', fontColor: '0,0,0'} ]; return styles[group] || {}; }, - // doLogin(){ - // userLogin().then((res)=>{ - // console.log(res); - // this.testInfo(); - // this.getInfo(); - // }) - // }, testInfo(){ test().then((res)=>{ console.log(res); }) } + }, - mounted() { - this.testInfo(); - this.getInfo(); + mounted() { + this.testInfo(); + this.getInfo(); } }