From 559f0776123a2205863b5787d5b8e1e012d397d3 Mon Sep 17 00:00:00 2001 From: suerprisePlus <15810472099@163.com> Date: 星期三, 23 十月 2024 15:29:34 +0800 Subject: [PATCH] 灾害效果修改 --- src/views/visualization/index.vue | 102 ++++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 88 insertions(+), 14 deletions(-) diff --git a/src/views/visualization/index.vue b/src/views/visualization/index.vue index 6a77f43..d69f69d 100644 --- a/src/views/visualization/index.vue +++ b/src/views/visualization/index.vue @@ -25,10 +25,20 @@ <atlas v-if="isShow == '鐭ヨ瘑鍥捐氨'"></atlas> <analysis v-if="isShow == '鏁版嵁鍒嗘瀽'"></analysis> <statistics v-if="isShow == '鏁版嵁缁熻'"></statistics> - <line-loss v-if="isShow == '鏁板瓧绾挎崯'"></line-loss> + <line-loss v-if="isShow == '閰嶇綉杩愭'"></line-loss> + <semanticFunction v-if="isShow == '璇箟鍔熻兘'"></semanticFunction> </div> </div> + </div> + <div v-show="showMsgFlag" @click="ShowMenuList" class="elBadge" + :disabled="$store.state.mapLayers.msgList.length == 0"> + <el-badge :value="$store.state.mapLayers.msgList.length" class="item"> + <i class="el-icon-chat-dot-square"></i> + </el-badge> + </div> + <div class="msgList" v-show="!showMsgFlag"> + <msg-list @childData="receiveDataFromChild"></msg-list> </div> </div> </template> @@ -42,10 +52,20 @@ import analysis from '@/views/visual/analysis/index.vue' import lineLoss from './lineLoss.vue'; import statistics from '@/views/visual/statistics/index.vue' +import semanticFunction from '@/views/dataManager/semanticFunction/index.vue' +import msgList from './msgList.vue'; +import { point } from '@turf/turf'; export default { components: { mapView, leftMenu, - rightMenu, bottomMenu, atlas, analysis, statistics, lineLoss + rightMenu, + bottomMenu, + atlas, + analysis, + statistics, + lineLoss, + semanticFunction, + msgList }, data() { return { @@ -53,11 +73,13 @@ showInfo: false, wsSocket: null, rightChartData: {}, - leftChartData:{}, + leftChartData: {}, + showMsgFlag: true } }, beforeDestroy() { if (this.wsSocket) { + this.wsSocket.close(); this.wsSocket.onclose = () => { console.log('WebSocket杩炴帴鍏抽棴'); this.wsSocket = null @@ -71,6 +93,16 @@ } }, methods: { + receiveDataFromChild(data) { + console.log(data); + + this.showMsgFlag = true + }, + ShowMenuList() { + if (this.$store.state.mapLayers.msgList.length == 0) return; + this.showMsgFlag = !this.showMsgFlag + + }, createSocket() { this.wsSocket = new WebSocket(config.pySocket); this.wsSocket.onopen = (event) => { @@ -81,17 +113,32 @@ if (event.data != "杩炴帴鎴愬姛") { const obj = JSON.parse(event.data) - - - this.leftChartData = { - type: 'left1', - val: obj + if (obj.type == "rain") { + this.$store.state.mapLayers.disasterRain.val = [obj] + } else if (obj.type == "snow") { + this.$store.state.mapLayers.disasterSnow.val = [obj] + } else if (obj.type == "fire") { + this.$store.state.mapLayers.disasterFire.val = [obj] + } else if (obj.type == "error") { + this.$store.state.mapLayers.msgList + if (this.$store.state.mapLayers.msgList.length == 0) { + this.$store.state.mapLayers.msgList.push(obj) + } else { + var rs = this.$store.state.mapLayers.msgList; + var st = rs.filter(item => { + if (item.msg == obj.msg && item.point == obj.point && item.line == obj.line) { + return item + } + }) + if (st.length <= 0) { + this.$store.state.mapLayers.msgList.push(obj) + } + + } } + + } - - - - // 澶勭悊鎺ユ敹鍒扮殑娑堟伅 }; }, childData(res) { @@ -126,7 +173,7 @@ } .leftMenu { - width: 15%; + width: 12%; top: 90px; left: 10px; height: calc(100% - 180px); @@ -135,7 +182,7 @@ } .rightMenu { - width: 15%; + width: 12%; top: 90px; right: 10px; height: calc(100% - 180px); @@ -151,6 +198,33 @@ bottom: 0px; } + .elBadge { + // width: 15%; + top: 90px; + right: 16%; + z-index: 40; + padding: 10px; + position: absolute; + background: url(~@/assets/images/treeClose.png)no-repeat; + background-size: 100% 100%; + + .el-icon-chat-dot-square { + color: white; + font-size: 22px; + margin-right: 5px; + } + } + + .msgList { + width: 15%; + top: 90px; + right: 16%; + z-index: 40; + position: absolute; + + height: 30%; + } + .visualInfo { width: 60%; height: 60%; -- Gitblit v1.9.3