From 1eb1522eb39f58603155302f072e2ead3045d2ef Mon Sep 17 00:00:00 2001
From: feige <feige@qq.com>
Date: 星期二, 25 十一月 2025 09:57:49 +0800
Subject: [PATCH] 修改信息
---
ruoyi-ui/src/views/mindMap/index.vue | 285 +++++++++++++++++++++++++++++++-------------------------
1 files changed, 159 insertions(+), 126 deletions(-)
diff --git a/ruoyi-ui/src/views/mindMap/index.vue b/ruoyi-ui/src/views/mindMap/index.vue
index 970362a..836007f 100644
--- a/ruoyi-ui/src/views/mindMap/index.vue
+++ b/ruoyi-ui/src/views/mindMap/index.vue
@@ -1,12 +1,28 @@
<template>
<div class="app-container">
- <h1 style="font-size: 21px;">{{ greeting +'锛�' + user.userName }}</h1>
- <div class="image-container">
- <img class="top-image" src="../../assets/images/zhang.png" alt="Top Image">
+ <el-select
+ v-model="selectedClan"
+ placeholder="璇烽�夋嫨瀹舵棌"
+ @change="handleClanChange"
+ style="margin-bottom: 20px; width: 200px;"
+ >
+ <el-option
+ v-for="clan in clanList"
+ :key="clan.id"
+ :label="clan.name"
+ :value="clan.id"
+ >
+ </el-option>
+ </el-select>
+ 6565565665
+<!-- <div class="text" style="background-color: #FEF7FC;" >
+ <h1 style="font-size: 21px;">{{ greeting +'锛�' + user.userName }}</h1></div> -->
+ <div class="image-container" style="background-color: #FEF7FC;">
+ <img class="top-image" src="../../assets/images/awd.png" alt="Top Image">
</div>
+ <superMindmap v-if="showMindMap" :active='active' :data="mapData" @activeChange="activeChange" class="mind-map-container ">
-
- <superMindmap v-if="showMindMap" :active='active' :data="mapData" @activeChange="activeChange"/>
+ </superMindmap>
</div>
</template>
@@ -15,10 +31,10 @@
import { getUserProfile } from "@/api/system/user";
import { listRootAll ,listRoot} from "@/api/root/index";
import * as d3 from 'd3';
- // 瀵煎叆鎬濈淮瀵煎浘鏁版嵁
- import MapData from '../components/MapData.js'
- // 瀵煎叆鎬濈淮瀵煎浘缁勪欢
- import superMindmap from '../components/superMindmap.vue'
+// 瀵煎叆鎬濈淮瀵煎浘鏁版嵁
+import MapData from '../components/MapData.js'
+// 瀵煎叆鎬濈淮瀵煎浘缁勪欢
+import superMindmap from '../components/superMindmap.vue'
export default {
components:{superMindmap},
@@ -30,11 +46,15 @@
showMindMap: false,
user: {},
greeting: "",
- rootList:[]
+ rootList:[],
+ // 鏂板瀹舵棌鍒楄〃
+ clanList: [],
+ // 鏂板褰撳墠閫変腑鐨勫鏃� ID
+ selectedClan: null
};
},
mounted() {
- this.setGreeting();
+ // this.setGreeting();
this.getUser();
// this.mapData = MapData.webMap
@@ -42,25 +62,21 @@
// console.log('sssssssssssssssssss')
},
-
-
-
methods: {
// 鐐瑰嚮鎬濈淮瀵煎浘鑺傜偣鍚庯紝瑙﹀彂鍙橀噺鏇存柊
- activeChange(newLabel) {
- this.active = newLabel
- this.reloadMindMap()
- },
- // 閲嶈浇鎬濈淮瀵煎浘
- reloadMindMap() {
- this.showMindMap = false
- this.$nextTick(
- () => {
- this.showMindMap = true
- }
- )
- },
-
+ activeChange(newLabel) {
+ this.active = newLabel
+ this.reloadMindMap()
+ },
+ // 閲嶈浇鎬濈淮瀵煎浘
+ reloadMindMap() {
+ this.showMindMap = false
+ this.$nextTick(
+ () => {
+ this.showMindMap = true
+ }
+ )
+ },
setGreeting() {
const currentTime = new Date();
@@ -81,132 +97,151 @@
getUserProfile().then(response => {
this.user = response.data;
});
- listRoot(4).then(response =>{
+ let clanId = this.$store.state.user.clanId
+ // alert(clanId)
+ listRoot(10,clanId).then(response =>{
this.rootList =response.data;
const mindMapData = this.rootList[0];
-
-
- // console.log(this.drawData(mindMapData))
+ console.log(mindMapData)
+ // for(let i = 0; i < )
+ console.log('9999')
+ // console.log(this.drawData(mindMapData))
this.mapData = this.drawData(mindMapData)
this.showMindMap = true
})
},
- drawData(mpdata)
- {
- if(mpdata==null)
- return null
+
+ // 鍔犺浇瀵瑰簲瀹舵棌鐨勫璋卞浘鏁版嵁
+ loadMindMapData(clanId) {
+ listRoot(10, clanId).then(response => {
+ this.rootList = response.data;
+ const mindMapData = this.rootList[0];
+ console.log(mindMapData);
+ console.log('9999');
+ this.mapData = this.drawData(mindMapData);
+ this.showMindMap = true;
+ });
+ },
+
+ // 澶勭悊瀹舵棌閫夋嫨鍙樺寲
+ handleClanChange(clanId) {
+ this.loadMindMapData(clanId);
+ },
+
+ drawData(mpdata) {
+ let tp = "https://www.bendudu.com:8080/profile/upload/2023/03/19/test7_20230319222030A007.jpg"
+ if (mpdata == null)
+ return null;
+
var data = {
- "label": mpdata['nickName'],
+ "label": mpdata['spouse'] != null ? eval(mpdata['spouse']).nickName : '',
"prop": mpdata['nickName'],
- "url": '',
- "link": '',
- "children":[]
- }
- if(eval(mpdata['spouse'])!=null)
- data['link'] = eval(mpdata['spouse']).nickName
- if(mpdata['childList']!=null){
- for(var i = 0; i < mpdata['childList'].length; i++)
- {
- var dt = {
- "label": mpdata['childList'][i]['nickName'],
- "prop": mpdata['childList'][i]['nickName'],
- "url": '',
- "link": "",
- "children":[]
+ "url": mpdata['url'] != null ? 'https://www.bendudu.com:8080/' + mpdata['url'] : tp,
+ "purl": mpdata['spouse'] != null ? (mpdata['spouse'].url != null ? 'https://www.bendudu.com:8080/' + mpdata['spouse'].url : tp) : tp,
+ "id": mpdata['userId'],
+ "spid": mpdata['spouseId'] != null ? mpdata['spouseId'] : '',
+ "link": mpdata['nickName'],
+ "children": []
+ };
+
+ if (mpdata['childList'] != null) {
+ for (var i = 0; i < mpdata['childList'].length; i++) {
+ var dt = {
+ "label": mpdata['childList'][i]['spouse'] != null ? eval(mpdata['childList'][i]['spouse']).nickName : "",
+ "prop": mpdata['childList'][i]['nickName'],
+ "url": mpdata['childList'][i]['url'] != null ? 'https://www.bendudu.com:8080/' + mpdata['childList'][i]['url'] : tp,
+ "id": mpdata['childList'][i]['userId'],
+ "spid": mpdata['childList'][i]['spouseId'] != null ? mpdata['childList'][i]['spouseId'] : '',
+ "purl": (mpdata['childList'][i]['spouse'] != null) ? (mpdata['childList'][i]['spouse'].url != null ? 'https://www.bendudu.com:8080/' + mpdata['childList'][i]['spouse'].url : tp) : tp,
+ "link": mpdata['childList'][i]['nickName'],
+ "children": []
+ };
+ if (mpdata['childList'][i]['childList'] != null) {
+ for (var j = 0; j < mpdata['childList'][i]['childList'].length; j++) {
+ dt['children'].push(this.drawData(mpdata['childList'][i]['childList'][j]));
+ }
+ }
+ data['children'].push(dt);
}
- if(eval(mpdata['childList'][i]['spouse'])!=null)
- dt['link'] = eval(mpdata['childList'][i]['spouse']).nickName
- if(mpdata['childList'][i]['childList']!=null)
- {
- for(var j = 0; j < mpdata['childList'][i]['childList'].length;j++)
- dt['children'].push(this.drawData(mpdata['childList'][i]['childList'][j]))
- }
- data['children'].push(dt)
}
+ return data;
+ },
+ drawData(mpdata) {
+ let tp = "https://www.bendudu.com:8080/profile/upload/2023/03/19/test7_20230319222030A007.jpg"
+ if (mpdata == null)
+ return null;
+
+ var data = {
+ "label": mpdata['spouse'] != null ? eval(mpdata['spouse']).nickName : '',
+ "prop": mpdata['nickName'],
+ "url": mpdata['url']!=null?'https://www.bendudu.com:8080/'+mpdata['url']:tp,
+ "purl": mpdata['spouse'] != null ? (mpdata['spouse'].url!=null? 'https://www.bendudu.com:8080/'+mpdata['spouse'].url:tp):tp,
+ "id": mpdata['userId'],
+ "spid": mpdata['spouseId'] != null ? mpdata['spouseId'] : '',
+ "link": mpdata['nickName'],
+ "children": []
+ };
+
+ if (mpdata['childList'] != null) {
+ for (var i = 0; i < mpdata['childList'].length; i++) {
+ var dt = {
+ "label": mpdata['childList'][i]['spouse'] != null ? eval(mpdata['childList'][i]['spouse']).nickName : "",
+ "prop": mpdata['childList'][i]['nickName'],
+ "url": mpdata['childList'][i]['url']!=null?'https://www.bendudu.com:8080/'+mpdata['childList'][i]['url']:tp,
+ "id": mpdata['childList'][i]['userId'],
+ "spid": mpdata['childList'][i]['spouseId'] != null ? mpdata['childList'][i]['spouseId'] : '',
+ "purl": (mpdata['childList'][i]['spouse'] != null ) ?( mpdata['childList'][i]['spouse'].url!= null?'https://www.bendudu.com:8080/'+mpdata['childList'][i]['spouse'].url:tp):tp,
+ "link": mpdata['childList'][i]['nickName'],
+ "children": []
+ };
+ if (mpdata['childList'][i]['childList'] != null) {
+ for (var j = 0; j < mpdata['childList'][i]['childList'].length; j++) {
+ dt['children'].push(this.drawData(mpdata['childList'][i]['childList'][j]));
+ }
+ }
+ data['children'].push(dt);
+ }
}
return data;
},
- drawMindMap() {
- const mindMapData = this.rootList[0]; // 浠巖ootList涓幏鍙栨暟鎹�
- console.log(mindMapData)
- // 娓呴櫎鐜版湁鐨凷VG鍏冪礌
- // d3.select("#mind-map svg").remove();
-
- // // 鍒涘缓涓�涓柊鐨� div 鍏冪礌浣滀负鍖呰９鎬濈淮瀵煎浘鐨勫鍣�
- // const mindMapContainer = document.createElement("div");
- // mindMapContainer.setAttribute("id", "mind-map-container");
- // mindMapContainer.style.position = "absolute";
- // mindMapContainer.style.top = "0";
- // mindMapContainer.style.left = "0";
- // mindMapContainer.style.width = "100%";
- // mindMapContainer.style.height = "100%";
- // mindMapContainer.style.zIndex = "1";
-
- // // 灏嗘�濈淮瀵煎浘瀹瑰櫒鎻掑叆鍒� image-container 涓�
- // document.querySelector(".image-container").appendChild(mindMapContainer);
-
- // // 鍒涘缓SVG鍏冪礌锛岃缃搴﹀拰楂樺害
- // const svg = d3.select("#mind-map-container")
- // .append("svg")
- // .attr("class", "svg-container") // 娣诲姞 className
- // .attr("width", "100%")
- // .attr("height", "100%");
-
- // // 鍒涘缓鏍硅妭鐐�
- // const root = d3.hierarchy(mindMapData);
- // const treeLayout = d3.tree().size([500, 400]); // 璁剧疆鏍戠姸甯冨眬鐨勫昂瀵�
- // treeLayout(root);
-
- // // 鍒涘缓閾炬帴绾�
- // svg.selectAll(".link")
- // .data(root.descendants().slice(1))
- // .enter()
- // .append("path")
- // .attr("class", "link")
- // .attr("d", d => {
- // return "M" + d.x + "," + d.y + "C" + (d.x + d.parent.x) / 2 + "," + d.y + " " +
- // (d.x + d.parent.x) / 2 + "," + d.parent.y + " " + d.parent.x + "," + d.parent.y;
- // });
-
- // // 鍒涘缓鑺傜偣
- // const nodes = svg.selectAll(".node")
- // .data(root.descendants())
- // .enter()
- // .append("g")
- // .attr("class", "node")
- // .attr("transform", d => "translate(" + d.x + "," + d.y + ")");
-
- // nodes.append("circle")
- // .attr("r", 10);
-
- // nodes.append("text")
- // .attr("dx", 12)
- // .attr("dy", 5)
- // .text(d => d.data.nickName);
- }
}
};
</script>
<style scoped>
.app-container{
- background-color: #FEF7FC;
position: relative;
+ background-color: transparent;
+ /*padding-left: -30px;*/
+ margin-top:-30px;
+ margin-left: -20px;
}
-
+.text{
+ opacity: 0.75;
+ padding: 10px;
+}
.image-container {
position: absolute;
- width: 100%;
+ /*position: fixed;*/
+ top: 50px;
+ /*left:-20px;*/
+ width: 110%;
height: 100%;
z-index: -1;
}
.mind-map-container{
- z-index: 2;
- opacity: 0.5;
+ /*position: fixed;*/
+
+ overflow: auto;
+ z-index: 1;
+ opacity: 1;
+ margin-top: 5%;
+ margin-left: 12%;
+ /*background-color: transparent;*/
}
.top-image {
width: 100%;
@@ -214,8 +249,6 @@
object-fit: cover;
position: static;
opacity: 0.8;
+ overflow: auto;
}
-
-
-
</style>
--
Gitblit v1.9.1