From 8319f67b9bec1d19c06eaa4216f0f34c67e3afb1 Mon Sep 17 00:00:00 2001 From: feige <feige@qq.com> Date: 星期日, 10 九月 2023 10:08:25 +0800 Subject: [PATCH] Merge branch 'master' of http://47.93.189.255:8099/r/zhangshi_app_web --- ruoyi-ui/src/views/mindMap/index.vue | 134 ++++++++++++++++++++++++++++++++++---------- 1 files changed, 104 insertions(+), 30 deletions(-) diff --git a/ruoyi-ui/src/views/mindMap/index.vue b/ruoyi-ui/src/views/mindMap/index.vue index d43ecd7..5f1fd1a 100644 --- a/ruoyi-ui/src/views/mindMap/index.vue +++ b/ruoyi-ui/src/views/mindMap/index.vue @@ -1,20 +1,32 @@ <template> <div class="app-container"> - <h1 style="font-size: 21px;">{{ greeting +'锛�' + user.userName }}</h1> + <div class="text" > + <h1 style="font-size: 21px;margin-left: 0">{{ greeting +'锛�' + user.userName }}</h1></div> <div class="image-container"> <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 "/> + </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 +35,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 +76,88 @@ getUserProfile().then(response => { this.user = response.data; }); - listRootAll().then(response =>{ + listRoot(4).then(response =>{ this.rootList =response.data; - console.log(this.rootList) + + const mindMapData = this.rootList[0]; + + // 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": '', + "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": '', + "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: -20px;*/ } +.text{ + background-color: #FEF7FC; + opacity: 0.75; + margin-top: -20px; + padding: 20px; - -.top-image { - width: 50%; - /*height: 100%;*/ - object-fit: cover; - position: absolute; - top: 0; - right: 0; - opacity: 1; } - -.bottom-image { - z-index: 1; /* 璁剧疆搴曞眰鍥剧墖鐨勫眰绾т负1 */ - width: 100%; - height: 100%; +.image-container { /*position: absolute;*/ - top: 0; + position: fixed; + top: 50px; + left: 50px; + width: 100%; + height: 100%; + z-index: -1; } - +.mind-map-container{ + position: fixed; + z-index: 2; + opacity: 0.8; + margin-top: 50px; + margin-left: 50px; + background-color: transparent; +} +.top-image { + width: 100%; + height: 100%; + object-fit: cover; + position: static; + opacity: 0.8; +} </style> -- Gitblit v1.9.1