优化mqtt的使用

src/components/Mqtt/mqttComp.vue

@@ -47,16 +47,20 @@ export default {
       handler(newTopics) {
         if (!this.client || !this.isConnected) return;
 
+        const newTopicNames = newTopics.map((t) =>
+        typeof t === "string" ? t : t.topic
+      );
         // 取消订阅已经移除的 topic
         this.subscribedTopics.forEach((t) => {
-          if (!newTopics.includes(t)) {
+          if (!newTopicNames.includes(t)) {
             this.unsubscribeTopic(t);
           }
         });
 
         // 订阅新增 topic
         newTopics.forEach((t) => {
-          if (!this.subscribedTopics.includes(t)) {
+          const topic = typeof t === "string" ? t : t.topic;
+          if (!this.subscribedTopics.includes(topic)) {
             this.subscribeTopic(t);
           }
         });
@@ -111,25 +115,32 @@ export default {
     },
 
     // 订阅单个 topic
-    subscribeTopic(topic) {
+    subscribeTopic(t) {
       if (!this.client || !this.isConnected) {
-        console.warn("MQTT 未连接，无法订阅:", topic);
+        console.warn("MQTT 未连接，无法订阅:", t);
         return;
       }
+
+      // 兼容字符串和对象
+      const topic = typeof t === "string" ? t : t.topic;
+      const qos = typeof t === "string" ? 0 : (t.qos || 0);
+
       if (!topic || this.subscribedTopics.includes(topic)) return;
 
-      this.client.subscribe(topic, (err) => {
+      this.client.subscribe(topic, { qos }, (err) => {
         if (!err) {
-          console.log("订阅成功:", topic);
+          console.log(`订阅成功: ${topic}, QoS=${qos}`);
           this.subscribedTopics.push(topic);
-          this.$emit("topic-subscribed", topic);
+          this.$emit("topic-subscribed", { topic, qos });
         }
       });
     },
 
     // 取消订阅单个 topic
-    unsubscribeTopic(topic) {
+    unsubscribeTopic(t) {
       if (!this.client || !this.isConnected) return;
+      // 兼容字符串和对象
+      const topic = typeof t === "string" ? t : t.topic;
       if (!topic || !this.subscribedTopics.includes(topic)) return;
 
       this.client.unsubscribe(topic, (err) => {
@@ -142,15 +153,18 @@ export default {
     },
 
     // 发布消息
-    publish(topic, message) {
+    publish(topic, message, qos = 0, retain = false) {
       if (!this.client || !this.isConnected) {
         console.warn("MQTT 未连接，消息未发送:", topic);
         return;
       }
-      console.log("sdfdsf",typeof message === "object");
       
       const payload = typeof message === "object" ? JSON.stringify(message) : String(message);
-      this.client.publish(topic, payload);
+       this.client.publish(topic, payload, { qos, retain }, (err) => {
+        if (!err) {
+          console.log(`消息已发布: ${topic}, QoS=${qos}, Retain=${retain}`);
+        }
+      });
     },
 
     // 断开连接，取消所有订阅

src/components/OlMap/index.vue

@@ -466,6 +466,7 @@ export default {
         if (this.poseInitEnable) {
           let feature = this.map.forEachFeatureAtPixel(evt.pixel, (feature) => feature);
           let coord;
+          let nid = feature.getId ? feature.getId() : null;
           if (feature && feature.getGeometry().getType() == 'Point') {
             // 如果不为空并且是点位,则直接取这个点位的坐标
             coord = feature.getGeometry().getCoordinates();
@@ -479,7 +480,7 @@ export default {
             isDrawing = true;
           } else {
             // 结束绘制，计算航向角并清理预览
-            this.completeDrawing(startPoint, coord);
+            this.completeDrawing(startPoint, coord, nid);
             this.roadmap_src.removeFeature(this.arrowFeature)
             this.arrowFeature = null;
             isDrawing = false;
@@ -1667,7 +1668,7 @@ export default {
       snapeFeature.setStyle(style);
     },
     // 完成绘制方法
-    completeDrawing(start, end) {
+    completeDrawing(start, end, nid) {  
       // 计算航向角
       const bearing = this.calculateBearing(start, end);
       // 移除预览虚线
@@ -1675,7 +1676,7 @@ export default {
         this.roadmap_src.removeFeature(this.previewFeature);
         this.previewFeature = null;
       }
-      this.$emit('initNavigationResult', start, bearing.toFixed(2),)
+      this.$emit('initNavigationResult', start, bearing.toFixed(2),nid)
     },
     // 计算航向角
     calculateBearing(start, end) {

src/views/map/maplist/navigation.vue

@@ -217,7 +217,7 @@
 								style="height: 20px;width: 5px;background-color: #6565FC;margin-right: 5px;border-radius: 4px 4px 0 0;">
 							</div><span>当前地图</span>
 						</div>
-						<span class="info-dra_content">shanghai</span>
+						<span class="info-dra_content">{{mapName}}</span>
 					</div>
 					<div style="margin-bottom: 20px;">
 						<div class="info-dra_title">
@@ -271,8 +271,10 @@ export default {
 	},
 	data() {
 		return {
-			topics:[this.$mqttPrefix+'/localization/action/init/reply',
-							this.$mqttPrefix + '/localization/pose'],
+			topics:[
+				{ topic: this.$mqttPrefix+'/localization/action/init/reply', qos: 2, retain: false },
+				{ topic:this.$mqttPrefix + '/localization/pose'}
+				],
 			activeIndex: -1, // 默认为没有激活的项
 			settingDrawer: false,
 			pointDrawer: false,
@@ -699,21 +701,16 @@ export default {
 		 * @param position 坐标
 		 * @param angle 角度
 		 */
-		initNavigationResult(position, angle) {
+		initNavigationResult(position, angle, nid) {
 			const prefix = process.env.VUE_APP_PNS_MQTT_PROXY;
-			console.log("prefix:"+prefix);
-			
+			let num = nid.split("_")[1];// 获取点位id编号
 			this.$refs.mqtt.publish(prefix + "/localization/action/init", {
-    "timestamp" : 123456,
-    "args"      : [
-        {
-
-		"nid"  : 7
-           
-        }
-    ]
-}
-		);
+					"timestamp" : 123456,
+					"args"      : [
+							{"nid"  : Number(num)}
+					]
+				},2,false
+			);
 			console.log(position);
 			console.log(angle);
 		}