From bd40473c9c634005bc7e62e7fc901bcd8b598fa0 Mon Sep 17 00:00:00 2001 From: feige <feige@qq.com> Date: 星期五, 02 二月 2024 15:20:26 +0800 Subject: [PATCH] 提交了修改 --- ruoyi-ui/src/views/mindMap/index.vue | 141 +++++++++++++++++++++++++++++++++++++---------- 1 files changed, 111 insertions(+), 30 deletions(-) diff --git a/ruoyi-ui/src/views/mindMap/index.vue b/ruoyi-ui/src/views/mindMap/index.vue index d43ecd7..2cba0b6 100644 --- a/ruoyi-ui/src/views/mindMap/index.vue +++ b/ruoyi-ui/src/views/mindMap/index.vue @@ -1,20 +1,34 @@ <template> <div class="app-container"> - <h1 style="font-size: 21px;">{{ greeting +'锛�' + user.userName }}</h1> - <div class="image-container"> + <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/zhang.png" alt="Top Image"> - <img class="bottom-image" src="../../assets/images/bkg.png" alt="Bottom Image"> </div> + <superMindmap v-if="showMindMap" :active='active' :data="mapData" @activeChange="activeChange" class="mind-map-container "> + + </superMindmap> + </div> </template> <script> import { getUserProfile } from "@/api/system/user"; -import { listRootAll } from "@/api/root/index"; +import { listRootAll ,listRoot} from "@/api/root/index"; +import * as d3 from 'd3'; +// 瀵煎叆鎬濈淮瀵煎浘鏁版嵁 +import MapData from '../components/MapData.js' +// 瀵煎叆鎬濈淮瀵煎浘缁勪欢 +import superMindmap from '../components/superMindmap.vue' + export default { + components:{superMindmap}, name: "index", data() { return { + active: '', + mapData: null, + showMindMap: false, user: {}, greeting: "", rootList:[] @@ -23,8 +37,28 @@ mounted() { this.setGreeting(); this.getUser(); + // this.mapData = MapData.webMap + + // console.log(this.mapData) + // console.log('sssssssssssssssssss') }, + methods: { + // 鐐瑰嚮鎬濈淮瀵煎浘鑺傜偣鍚庯紝瑙﹀彂鍙橀噺鏇存柊 + activeChange(newLabel) { + this.active = newLabel + this.reloadMindMap() + }, + // 閲嶈浇鎬濈淮瀵煎浘 + reloadMindMap() { + this.showMindMap = false + this.$nextTick( + () => { + this.showMindMap = true + } + ) + }, + setGreeting() { const currentTime = new Date(); const currentHour = currentTime.getHours(); @@ -44,46 +78,93 @@ getUserProfile().then(response => { this.user = response.data; }); - listRootAll().then(response =>{ + listRoot(5).then(response =>{ this.rootList =response.data; - console.log(this.rootList) + + const mindMapData = this.rootList[0]; + console.log(mindMapData) + // console.log(this.drawData(mindMapData)) + this.mapData = this.drawData(mindMapData) + this.showMindMap = true }) - } - } + }, + drawData(mpdata) { + if (mpdata == null) + return null; + var data = { + "label": mpdata['spouse'] != null ? eval(mpdata['spouse']).nickName : '', + "prop": mpdata['nickName'], + "url": 'https://www.bendudu.com:8080/'+mpdata['url'], + // "purl": 'https://www.bendudu.com:8080/'+mpdata['spouse'], + "id": mpdata['userId'], + "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": 'https://www.bendudu.com:8080/'+mpdata['childList'][i]['url'], + "id": mpdata['childList'][i]['userId'], + "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; + }, + + } +}; </script> <style scoped> .app-container{ - background-color: #FEF7FC; -} - -.image-container { position: relative; - width: 100%; - height: 100%; + background-color: transparent; + /*padding-left: -30px;*/ + margin-top:-30px; + margin-left: -20px; } - - -.top-image { - width: 50%; - /*height: 100%;*/ - object-fit: cover; +.text{ + opacity: 0.75; + padding: 10px; +} +.image-container { position: absolute; - top: 0; - right: 0; - opacity: 1; + /*position: fixed;*/ + top: 50px; + /*left:-20px;*/ + width: 110%; + height: 100%; + z-index: -1; } -.bottom-image { - z-index: 1; /* 璁剧疆搴曞眰鍥剧墖鐨勫眰绾т负1 */ +.mind-map-container{ + /*position: fixed;*/ + + overflow: auto; + z-index: 1; + opacity: 1; + margin-top: 5%; + margin-left: 12%; + /*background-color: transparent;*/ +} +.top-image { width: 100%; height: 100%; - /*position: absolute;*/ - top: 0; + object-fit: cover; + position: static; + opacity: 0.8; + overflow: auto; } - - </style> -- Gitblit v1.9.1