From 7d57b0fef0f220dfe7c868ce1113a7ce6eb6c468 Mon Sep 17 00:00:00 2001
From: suerprisePlus <15810472099@163.com>
Date: 星期三, 21 八月 2024 11:23:06 +0800
Subject: [PATCH] 添加本地矢量地图服务，初始化视角切换
---
src/components/RuoYi/Msgger/index.vue | 96 +++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 90 insertions(+), 6 deletions(-)
diff --git a/src/components/RuoYi/Msgger/index.vue b/src/components/RuoYi/Msgger/index.vue
index 3fd0286..dfe2880 100644
--- a/src/components/RuoYi/Msgger/index.vue
+++ b/src/components/RuoYi/Msgger/index.vue
@@ -1,32 +1,116 @@
<template>
- <div class="msgBox" @click="setShowMenuClick">
+ <div class="msgBox" @click.stop="setShowMenuClick(true)">
<i style="font-size: 20px;" class="el-icon-chat-line-round"></i>
<el-badge v-show="msgCount > 0" :value="msgCount" class="item">
</el-badge>
+ <el-dialog title="寮傚父淇℃伅" :visible.sync="dialogVisible" width="30%" :show-close="false">
+ <el-table :data="msgData" style="width: 100%">
+ <el-table-column prop="msg" label="璁惧鍚嶇О">
+ </el-table-column>
+ <el-table-column prop="point" label="璁惧浣嶇疆">
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" width="100">
+ <template slot-scope="scope">
+ <el-button @click="handleClick(scope.row)" type="text" size="small">鏌ョ湅</el-button>
+ <el-button @click="handleClick2(scope.row)" type="text" size="small">鍒嗗彂</el-button></el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <span slot="footer" class="dialog-footer">
+ <el-button @click.stop="dialogVisible = false">鍏� 闂�</el-button>
+ </span>
+ <el-dialog width="30%" title="浣嶇疆" :visible.sync="innerVisible" append-to-body>
+ <div style="height: 540px">
+ <olMap v-if="innerVisible" :parentData="parentData"></olMap>
+ </div>
+ </el-dialog>
+ </el-dialog>
</div>
</template>
<script>
+
+import olMap from '@/components/mapOl/index.vue';
+
export default {
name: 'RouYiMsg',
+ components: {
+ olMap
+ },
data() {
return {
- msgCount: 0,
- dialogVisible: false
+ msgCount: 1,
+ dialogVisible: false,
+ dialogFlag: false,
+ wsSocket: null,
+ innerVisible: false,
+ msgData: [{
+ msg: "鍙樺帇鍣ㄦ晠闅�",
+ point: "POINT (112.56978672907 37.8558881392881)"
+ }],
+ parentData: null,
}
},
methods: {
- setShowMenuClick() {
+ handleClick2(row) {
+ this.$message({
+ showClose: true,
+ message: '宸插垎鍙戝埌鐩稿叧璐熻矗浜�',
+ type: 'success'
+ });
+ },
+ handleClick(row) {
+ const obj = {
+ val: row,
+ type: 'point',
+ isShow: false,
+ }
+ this.parentData = JSON.stringify([obj])
+ this.innerVisible = true
+ },
+ setShowMenuClick(res) {
+
this.dialogVisible = true
+
+
},
handleClose() {
this.dialogVisible = false
- }
+ },
+ createSocket() {
+ this.wsSocket = new WebSocket(config.pySocket);
+ this.wsSocket.onopen = (event) => {
+ console.log('WebSocket杩炴帴鎴愬姛');
+ };
+ this.wsSocket.onmessage = (event) => {
+
+ if (event.data != "杩炴帴鎴愬姛") {
+ const obj = JSON.parse(event.data);
+ if (obj.mes) {
+ this.setShowMsg(obj)
+ }
+ }
+ // 澶勭悊鎺ユ敹鍒扮殑娑堟伅
+ };
+ },
+ setShowMsg(res) {
+ const filter = this.msgData.filter(item => {
+ if (item.msg == res.msg && item.point == res.point) {
+ return item;
+ }
+ })
+ if (filter.length > 0) return;
+ this.msgData.push(res)
+ this.msgCount = this.msgData.length;
+
+ },
},
mounted() {
- console.log(123);
+ if (!this.wsSocket) {
+ this.createSocket();
+ }
},
}
--
Gitblit v1.9.3