地图动态打点

pages/210/deviceControl/index.vue

@@ -702,7 +702,7 @@
 				this.mqttClient.connect(() => {
 					console.log('MQTT 连接成功，开始订阅主题');
 					// 订阅来自设备的状态更新
-					const statusTopic = `A/${this.itemInfo.id}`;
+					const statusTopic = `A/${this.itemInfo.deviceImei}`;
 					this.mqttClient.subscribe(statusTopic, (payload) => {
 						console.log(`收到来自 ${statusTopic} 的消息:`, payload);
 						// uni.showModal({

pages/6170/deviceControl/index.vue

@@ -307,15 +307,23 @@
 			},
 			// *******定位******
 			gpsPosition(item) {
+				// 添加调试日志
 				uni.navigateTo({
 					url: '/pages/common/map/index',
-					events: {
-						ack: function(data) {}
-					},
 					success: (res) => {
-						res.eventChannel.emit('MapData', {
+						// 确保使用深拷贝
-							data: item
+						const mapData = {
-						});
+							deviceLocation: {
+								longitude: String(item.longitude), // 强制转为字符串
+								latitude: String(item.latitude),
+								deviceImage: item.devicePic || '',
+								deviceName: item.deviceImei || ''
+							}
+						}
+						res.eventChannel.emit('MapData', JSON.parse(JSON.stringify(mapData)))
+					},
+					fail: (err) => {
+				
 					}
 				})
 			},
@@ -661,12 +669,6 @@
 						});
 					}
 				})
-				// const topic = `device/command/${this.deviceID}/message`;
-				// this.mqttClient.publish(topic, this.messageToSend);
-				// uni.showToast({
-				// 	title: '消息已发送',
-				// 	icon: 'success'
-				// });
 			},
 			// 统一处理返回方法
 			handleDeviceData(res, isFromShared = false) {
@@ -745,7 +747,7 @@
 				this.mqttClient.connect(() => {
 					console.log('MQTT 连接成功，开始订阅主题');
 					// 订阅来自设备的状态更新
-					const statusTopic = `A/${this.deviceID}`;
+					const statusTopic = `A/${this.itemInfo.deviceImei}`;
 					this.mqttClient.subscribe(statusTopic, (payload) => {
 						console.log(`收到来自 ${statusTopic} 的消息:`, payload);
 						// ✅ 发送全局事件通知主页面更新
@@ -928,12 +930,14 @@
 		color: rgba(255, 255, 255, 0.6);
 		text-align: end;
 	}
+
 	.locationGPS {
-		width:88%;
+		width: 88%;
 		text-align: end;
 		float: right;
-		line-height:50rpx;
+		line-height: 50rpx;
 	}
+
 	.control-card {
 		background-color: rgb(26, 26, 26);
 		border-radius: 16rpx;

pages/common/map/index.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script>
-export default {
+	export default {
 		data() {
 			return {
 				loading: true
@@ -22,11 +22,11 @@ export default {
 				this.loading = false
 			}
 		}
-}
+	}
 </script>
 
 <script module="amap" lang="renderjs">
-export default {
+	export default {
 		data() {
 			return {
 				markers: [],
@@ -83,21 +83,26 @@ export default {
 					this.map.on('complete', () => {
 						document.getElementById('amapContainer').style.opacity = 1
 						this.$ownerInstance.callMethod('hideLoading')
-          
 						// 添加标记点
-          const wuhanPoints = [
+						const wuhanPoints = [{
-            { lnglat: [114.404, 30.507], name: "华中科技大学" },
+								lnglat: [114.404, 30.507],
-            { lnglat: [114.428, 30.476], name: "光谷金融港" },
+								name: "华中科技大学"
-            { lnglat: [114.433, 30.504], name: "武汉东站" }
+							},
+							{
+								lnglat: [114.428, 30.476],
+								name: "光谷金融港"
+							},
+							{
+								lnglat: [114.433, 30.504],
+								name: "武汉东站"
+							}
 						]
 						wuhanPoints.forEach(point => {
 							this.addMarker(point.lnglat, point.name)
 						})
 					})
-
 					// 创建自定义弹窗
 					this.createCustomPopup()
-
 				} catch (e) {
 					console.error('初始化失败:', e)
 					this.$ownerInstance.callMethod('hideLoading')
@@ -122,11 +127,9 @@ export default {
 					map: this.map,
 					icon: 'https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png',
 				})
-      
 				marker.on('click', () => {
 					this.showCustomPopup(position, title)
 				})
-      
 				this.markers.push(marker)
 				return marker
 			},
@@ -137,7 +140,6 @@ export default {
 				this.customPopup.style.display = 'block'
 				this.customPopup.style.left = `${pixel.x}px`
 				this.customPopup.style.top = `${pixel.y}px`
-      
 				this.map.on('click', this.hideCustomPopup)
 			},
 
@@ -149,41 +151,41 @@ export default {
 			}
 		},
 		onLoad(options) {
+			console.log(options,'optionsoptions');
 			const eventChannel = this.getOpenerEventChannel();
-  	// 监听 'detailData' 事件，获取传过来的数据
 			eventChannel.on('MapData', (data) => {
-		console.log(data,'data');
+				console.log(data, 'data');
 			})
 		}
-}
+	}
 </script>
 
 <style>
-/* 基础样式 */
+	/* 基础样式 */
-.map-container {
+	.map-container {
 		width: 100%;
 		height: 100vh;
 		position: relative;
 		overflow: hidden;
-}
+	}
 
-.map-background {
+	.map-background {
 		position: absolute;
 		width: 100%;
 		height: 100%;
 		background: #121212;
 		z-index: 1;
-}
+	}
 
-.map-wrapper {
+	.map-wrapper {
 		width: 100%;
 		height: 100%;
 		position: relative;
 		z-index: 2;
-}
+	}
 
-/* 加载提示 */
+	/* 加载提示 */
-.loading-mask {
+	.loading-mask {
 		position: absolute;
 		top: 0;
 		left: 0;
@@ -194,38 +196,38 @@ export default {
 		justify-content: center;
 		align-items: center;
 		z-index: 999;
-}
+	}
 
-.loading-content {
+	.loading-content {
-  color: rgba(255,255,255,0.9);
+		color: rgba(255, 255, 255, 0.9);
 		font-size: 16px;
 		padding: 12px 24px;
-  background: rgba(0,0,0,0.7);
+		background: rgba(0, 0, 0, 0.7);
 		border-radius: 8px;
-}
+	}
 
-/* 弹窗样式 */
+	/* 弹窗样式 */
-.custom-map-popup {
+	.custom-map-popup {
 		position: absolute;
 		z-index: 9999;
 		transform: translate(-50%, -100%);
 		min-width: 200rpx;
 		pointer-events: none;
 		animation: popupFadeIn 0.3s ease-out;
-}
+	}
 
-.popup-content {
+	.popup-content {
-  background: rgba(18,45,74,0.95);
+		background: rgba(18, 45, 74, 0.95);
 		border-radius: 16rpx;
 		padding: 12rpx 24rpx;
 		color: #fff;
 		font-size: 14px;
 		text-align: center;
-  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
+		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
-  border: 1px solid rgba(255,255,255,0.1);
+		border: 1px solid rgba(255, 255, 255, 0.1);
-}
+	}
 
-.popup-content:after {
+	.popup-content:after {
 		content: '';
 		position: absolute;
 		bottom: -8px;
@@ -233,11 +235,18 @@ export default {
 		transform: translateX(-50%);
 		border-width: 8px 8px 0;
 		border-style: solid;
-  border-color: rgba(18,45,74,0.95) transparent transparent;
+		border-color: rgba(18, 45, 74, 0.95) transparent transparent;
-}
+	}
 
-@keyframes popupFadeIn {
+	@keyframes popupFadeIn {
-  from { opacity: 0; transform: translate(-50%, -90%); }
+		from {
-  to { opacity: 1; transform: translate(-50%, -100%); }
+			opacity: 0;
-}
+			transform: translate(-50%, -90%);
+		}
+
+		to {
+			opacity: 1;
+			transform: translate(-50%, -100%);
+		}
+	}
 </style>