提交设备详情

src/pagesA/deviceDetail/deviceDetail.vue

@@ -473,6 +473,7 @@ export default {
             mqttClientOne: false,
             mqttData: null,
             showModle: false,
+            mqttMessageBound: false,
         };
     },
     computed: {},
@@ -998,65 +999,52 @@ export default {
         }, 3000);
         this.getCurrentDate();
 
-        this.clientId = uni.getStorageSync("clientIDetail");
+        this.clientId = clientId;
         console.log(this.clientId, "clientIDetail");
 
-        if (this.$mqttClientData) {
-            this.$mqttClientData.subscribe(
+        this.clientId = clientId;
+
+        const bindMqtt = (mqttClientData) => {
+            // 订阅 topic
+            mqttClientData.subscribe(
                 `/dev/${this.clientId}/tracker_targets`,
                 (err) => {
                     if (err) console.error("DATA MQTT 订阅失败", err);
                     else
                         console.log(
-                            `DATA MQTT 订阅成功: /dev/${clientId}/tracker_targets`
+                            `DATA MQTT 订阅成功: /dev/${this.clientId}/tracker_targets`
                         );
                 }
             );
-            this.$mqttClientData.on("message", (topic, message) => {
-                console.log("topicDeviceDetail", topic, message);
-                const dataMatch = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-                const cmdMatch = topic.match(/^\/mps\/wx_(.+)\/notice$/);
-                if (dataMatch) {
-                    if (dataMatch[1] === this.clientId) {
-                        this.handleMessage(topic, message, this.clientId);
-                    } else {
-                        // console.log(
-                        //     "非本页面 clientId 的点位消息，忽略:",
-                        //     topic
-                        // );
-                    }
-                } else if (cmdMatch) {
-                    this.$refs.alarmModel.hanOtherMessage(topic, message);
-                }
-            });
-            console.log("开始接受mqttDATA消息111");
-        } else {
-            uni.$once("mqttClientData-ready", () => {
-                console.log("开始接受mqttDATA消息222");
-                this.$mqttClientData.subscribe(
-                    `/dev/${this.clientId}/tracker_targets`,
-                    (err) => {
-                        if (err) console.error("DATA MQTT 订阅失败", err);
-                        else
-                            console.log(
-                                `DATA MQTT 订阅成功: /dev/${clientId}/tracker_targets`
-                            );
-                    }
-                );
-                this.$mqttClientData.on("message", (topic, message) => {
+
+            // 只绑定一次 message 回调
+            if (!this.mqttMessageBound) {
+                mqttClientData.on("message", (topic, message) => {
                     console.log("topicDeviceDetail", topic, message);
                     const dataMatch = topic.match(
                         /^\/dev\/(.+)\/tracker_targets$/
                     );
                     const cmdMatch = topic.match(/^\/mps\/wx_(.+)\/notice$/);
-                    if (dataMatch) {
-                        if (dataMatch[1] === this.clientId) {
-                            this.handleMessage(topic, message, this.clientId);
-                        }
+                    if (dataMatch && dataMatch[1] === this.clientId) {
+                        this.handleMessage(topic, message, this.clientId);
                     } else if (cmdMatch) {
-                        this.$refs.alarmModel.hanOtherMessage(topic, message);
+                        this.$refs.alarmModel?.hanOtherMessage?.(
+                            topic,
+                            message
+                        );
                     }
                 });
+                this.mqttMessageBound = true;
+            }
+        };
+
+        // 如果客户端已存在
+        if (this.$mqttClientData) {
+            bindMqtt(this.$mqttClientData);
+        } else {
+            // 客户端未创建时等待 ready
+            uni.$once("mqttClientData-ready", (mqttClientData) => {
+                bindMqtt(mqttClientData);
             });
         }
     },

www.vue

@@ -1,3458 +1,24 @@
-跳至内容
-历史聊天记录
-
-您说：
-我现在代码有两个分支，一个是twoMqtt 另外一个是 master 现在需要把twoMqtt的代码合并到master上面
-ChatGPT 说：
-你现在是要把 twoMqtt 分支的代码合并进 master 分支。这里给你一套完整操作流程（假设你是用 Git 命令行 来管理的）：
-
-方法一：直接合并（merge）
-先切换到 master 分支
-
-git checkout master
-拉取最新代码（确保本地和远程同步）
-
-git pull origin master
-把 twoMqtt 分支合并进来
-
-git merge twoMqtt
-如果有冲突，解决冲突后再执行：
-
-git add .
-git commit
-最后推送到远程仓库：
-
-git push origin master
-方法二：使用 rebase（保持提交历史更干净）
-切换到 twoMqtt 分支
-
-git checkout twoMqtt
-更新 twoMqtt 分支并基于最新的 master 变基：
-
-git fetch origin
-git rebase origin/master
-切换回 master：
-
-git checkout master
-合并 twoMqtt（现在是快进合并，历史更直线）：
-
-git merge twoMqtt
-git push origin master
-👉 建议：
-
-如果你想保留 twoMqtt 的开发分支历史，用 merge。
-
-如果你想让 master 历史干净整齐，用 rebase。
-
-要不要我帮你写一份 具体命令步骤脚本（直接复制执行即可），还是你想用 IDE（比如 VS Code / IDEA）的图形界面操作？
-
-您说：
-我用uniapp开发了小程序， 需要连接两个mqtt ，一个是全局需要连接的，另外一个是到单个页面才需要连接的，怎么在小程序一开始进入的时候就开始连接两个mqtt
-ChatGPT 说：
-已更新保存的记忆
-要在 UniApp 小程序中同时连接两个 MQTT，你可以在小程序初始化时就开始连接一个全局的 MQTT，然后在特定页面中连接另一个 MQTT。以下是一个基本的思路：
-
-1. 全局 MQTT 连接
-你可以在 App.vue 或 main.js 中创建一个全局的 MQTT 客户端连接，在整个小程序生命周期内保持连接。
-
-示例代码：
-main.js（初始化全局 MQTT 客户端）
-
-import mqtt from 'mqtt'; // 引入 mqtt.js 库
-
-// 创建一个全局的 MQTT 客户端
-const clientGlobal = mqtt.connect('wss://your-global-mqtt-server'); 
-
-clientGlobal.on('connect', function () {
-    console.log('Global MQTT connected');
-    // 订阅或其他操作
-    clientGlobal.subscribe('global/topic');
-});
-
-clientGlobal.on('message', function (topic, message) {
-    console.log('Global MQTT message received:', message.toString());
-});
-
-// 将客户端绑定到全局
-Vue.prototype.$clientGlobal = clientGlobal;
-2. 页面级 MQTT 连接
-在需要时再连接第二个 MQTT，例如进入某个页面时。
-
-示例代码：
-页面 script 部分（在某个页面才连接另一个 MQTT）
-
-export default {
-    data() {
-        return {
-            clientPage: null, // 页面特有的 MQTT 客户端
-        };
-    },
-    onShow() {
-        this.connectPageMqtt();
-    },
-    onHide() {
-        if (this.clientPage) {
-            this.clientPage.end(); // 页面隐藏时关闭 MQTT 连接
-        }
-    },
-    methods: {
-        // 页面级别的 MQTT 连接
-        connectPageMqtt() {
-            this.clientPage = mqtt.connect('wss://your-page-specific-mqtt-server'); 
-
-            this.clientPage.on('connect', () => {
-                console.log('Page MQTT connected');
-                // 订阅页面相关的 topic
-                this.clientPage.subscribe('page/topic');
-            });
-
-            this.clientPage.on('message', (topic, message) => {
-                console.log('Page MQTT message received:', message.toString());
-            });
-        }
-    }
-};
-3. 小程序生命周期管理
-全局 MQTT 客户端 clientGlobal 会在整个小程序生命周期内有效。
-
-页面级 MQTT 客户端 clientPage 只会在页面显示时创建，在页面隐藏时关闭，避免浪费资源。
-
-4. 资源管理
-当用户离开某个页面时，最好清理掉不再需要的 MQTT 连接。你可以在 onHide 或 onUnload 生命周期方法中关闭连接。
-
-这样，你就能在小程序启动时连接一个全局的 MQTT，然后根据页面需要再连接另一个 MQTT 连接了。
-
-您说：
-那这个全局mqtt连接之后，怎么传到其他vue组件消息里面
-ChatGPT 说：
-要将全局 MQTT 客户端 clientGlobal 传递到其他 Vue 组件中，你可以通过 Vue 的 全局属性 或 Vuex 来实现。这里给你两种方法，你可以根据需要选择：
-
-方法 1：通过 Vue 原型传递（适用于全局共享）
-在 main.js 中，已将 clientGlobal 绑定到 Vue 原型上，那么其他组件就可以通过 this.$clientGlobal 访问全局的 MQTT 客户端。
-
-示例代码：
-main.js（绑定全局 MQTT 到 Vue 原型）
-
-import Vue from 'vue';
-import App from './App';
-import mqtt from 'mqtt'; // 引入mqtt库
-
-// 创建全局 MQTT 客户端
-const clientGlobal = mqtt.connect('wss://your-global-mqtt-server');
-
-clientGlobal.on('connect', () => {
-    console.log('Global MQTT connected');
-    clientGlobal.subscribe('global/topic');
-});
-
-clientGlobal.on('message', (topic, message) => {
-    console.log('Global MQTT message received:', message.toString());
-    // 可以将收到的消息通过事件或者 Vuex 推送到其他组件
-});
-
-// 将 MQTT 客户端绑定到 Vue 原型上
-Vue.prototype.$clientGlobal = clientGlobal;
-
-Vue.config.productionTip = false;
-
-App.mpType = 'app';
-
-const app = new Vue({
-    ...App
-});
-app.$mount();
-组件中访问全局 MQTT 客户端：
-
-export default {
-    data() {
-        return {
-            message: '',
-        };
-    },
-    mounted() {
-        // 直接通过 this.$clientGlobal 来访问全局 MQTT 客户端
-        this.$clientGlobal.on('message', (topic, message) => {
-            // 处理收到的消息
-            this.message = message.toString();
-        });
-    },
-    methods: {
-        publishMessage() {
-            // 使用全局 MQTT 客户端发布消息
-            this.$clientGlobal.publish('global/topic', 'Hello from this component');
-        }
-    }
-};
-解释：
-通过 this.$clientGlobal 可以在任何组件中直接访问到全局的 MQTT 客户端。
-
-clientGlobal.on('message', ...) 监听来自全局订阅的消息。
-
-方法 2：通过 Vuex 管理（适用于复杂的状态管理）
-如果你的应用较为复杂，使用 Vuex 进行状态管理可能更加方便。你可以将全局 MQTT 客户端放在 Vuex 的 state 中，并通过 mutations 来更新其他组件中的数据。
-
-1. 安装 Vuex（如果没有的话）
-npm install vuex --save
-2. 配置 Vuex
-在 store.js 中存储全局 MQTT 客户端：
-
-store.js：
-
-import Vue from 'vue';
-import Vuex from 'vuex';
-import mqtt from 'mqtt';
-
-Vue.use(Vuex);
-
-const clientGlobal = mqtt.connect('wss://your-global-mqtt-server');
-
-const store = new Vuex.Store({
-    state: {
-        mqttClient: clientGlobal,
-        messages: []  // 用来存储接收到的消息
-    },
-    mutations: {
-        addMessage(state, message) {
-            state.messages.push(message);
-        }
-    },
-    actions: {
-        connectMqtt({ state }) {
-            state.mqttClient.on('connect', () => {
-                console.log('Global MQTT connected');
-                state.mqttClient.subscribe('global/topic');
-            });
-
-            state.mqttClient.on('message', (topic, message) => {
-                console.log('Received message:', message.toString());
-                // 触发 mutation 更新 state 中的消息
-                state.messages.push(message.toString());
-            });
-        },
-        publishMessage({ state }, message) {
-            state.mqttClient.publish('global/topic', message);
-        }
-    }
-});
-
-export default store;
-3. 在 main.js 中引入 Vuex
-import Vue from 'vue';
-import App from './App';
-import store from './store';  // 引入 Vuex store
-
-Vue.config.productionTip = false;
-
-App.mpType = 'app';
-
-const app = new Vue({
-    store,  // 注册 Vuex
-    ...App
-});
-app.$mount();
-4. 在组件中访问 MQTT 客户端和消息
-组件中使用 Vuex 来访问全局 MQTT 客户端：
-
-export default {
-    computed: {
-        // 获取 Vuex 中的消息
-        messages() {
-            return this.$store.state.messages;
-        }
-    },
-    mounted() {
-        // 通过 Vuex 动作来启动 MQTT 连接
-        this.$store.dispatch('connectMqtt');
-    },
-    methods: {
-        sendMessage() {
-            const message = 'Hello from Vuex component';
-            this.$store.dispatch('publishMessage', message);
-        }
-    }
-};
-解释：
-全局的 MQTT 客户端被存储在 Vuex 的 state.mqttClient 中。
-
-通过 Vuex 的 mutations 来更新消息。
-
-组件通过计算属性或 dispatch 来获取和操作全局 MQTT 数据。
-
-总结：
-方法 1：适合简单的全局共享。通过 this.$clientGlobal 直接访问 MQTT 客户端。
-
-方法 2：适合大型应用或有复杂状态管理的场景，使用 Vuex 管理全局状态并在各组件间共享。
-
-如果你的小程序需要更细致的状态管理，推荐使用 Vuex；否则，简单的全局属性方式就足够了。
-
-您说：
-  if (this.mqttClientFlag) {
-                console.log("主题已订阅");
-                return;
-            }
-            const THRESHOLD = 2;
-            const params = {
-                keepalive: 6000,
-                clean: true,
-                connectTimeout: 30 * 1000,
-                clientId:
-                    "xcx_mqtt_cmd1" +
-                    uni.getStorageSync("userId") +
-                    Math.random().toString(16).substring(2, 8),
-                username: "lnradar",
-                password: "lnradar",
-                // 微信小程序特定配置
-                wsOptions: {
-                    WebSocket: function (url) {
-                        return wx.connectSocket({
-                            url: url,
-                            header: {
-                                "content-type": "application/json",
-                            },
-                            protocols: ["mqtt"],
-                        });
-                    },
-                },
-                reconnectPeriod: 0,
-                rejectUnauthorized: false, // 仅开发环境使用，生产环境应设为true或移除
-            };
-            let client = "";
-            let selectedService = uni.getStorageSync("sercviceChoice");
-            if (!selectedService || selectedService == "aloneServe") {
-                if (__wxConfig.envVersion == "develop") {
-                    client = mqtt.connect(
-                        "wxs://cmd.radar-power.cn/mqtt/",
-                        params
-                    );
-                }
-                if (__wxConfig.envVersion == "trial") {
-                    client = mqtt.connect(
-                        "wxs://cmd.radar-power.cn/mqtt/",
-                        params
-                    );
-                }
-            }
-            // 存储client引用以便后续操作
-            this.mqttClientTwo = client;
-            client.on("connect", () => {
-                console.log("MQTT连接成功");
-                this.mqttClientFlag = true;
-                let userId = uni.getStorageSync("userId");
-                client.subscribe(/mps/wx_${userId}/notice, (err) => {
-                    if (err) {
-                        console.error("订阅失败", err);
-                    } else {
-                        console.log(
-                            成功订阅设备主题: /mps/wx_${userId}/notice
-                        );
-                    }
-                });
-            });
-            client.on("disconnect", () => {
-                console.log("MQTT不在连接");
-            });
-            client.on("error", (err) => {
-                this.mqttClientFlag = false;
-                setTimeout(() => {
-                    this.connectMQTTwo();
-                }, 1000);
-            });
-
-            client.on("reconnect", () => {});
-
-            client.on("close", () => {});
-
-            client.on("message", (topic, message) => {
-                console.log(JSON.parse(message.toString()), "8870");
-                // 处理点位消息
-                let userId = uni.getStorageSync("userId");
-                const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
-                const match = topic.match(noticeMatch);
-                if (!match) return;
-                this.alarmModel = true;
-                const data = JSON.parse(message.toString());
-                this.clientId = data.clientId;
-                this.devName = data.devName;
-                this.sn = data.clientId;
-                this.eventListId = data.eventListId;
-                this.getVoipAuthor(this.clientId, userId);
-                console.log(data, topic, "接收到消息222:");
-                console.log(
-                    "接收到消息:",
-                    this.clientId,
-                    this.devName,
-                    this.sn,
-                    this.eventListId,
-                    data
-                );
-                const now = new Date();
-                const year = now.getFullYear();
-                const month = (now.getMonth() + 1).toString().padStart(2, "0");
-                const day = now.getDate().toString().padStart(2, "0");
-                const hours = now.getHours().toString().padStart(2, "0");
-                const minutes = now.getMinutes().toString().padStart(2, "0");
-                const formattedTime = ${year}-${month}-${day} ${hours}:${minutes};
-                this.nowTime = formattedTime;
-                console.log("isWmpf:", isWmpf);
-                if (!isWmpf) {
-                    console.log("isWmpf:", isWmpf);
-                    this.getVoipDevices();
-                }
-                console.log("接收到消息:", topic, data);
-            });
-      优化这个代码，把这个放到 main.js里面
-ChatGPT 说：
-为了优化这个代码并将其放到 main.js 里，我们需要做一些调整，使得 MQTT 客户端连接逻辑能够在全局生效，并且在需要的地方能够共享客户端实例。我们可以将 MQTT 客户端的连接和配置逻辑抽象出来，放入 main.js 或其他全局管理文件中，并通过 Vue 的原型（Vue.prototype）来共享 mqttClient。
-
-步骤：
-创建一个单独的 mqtt.js 配置文件 来集中管理 MQTT 客户端连接。
-
-将 MQTT 客户端配置和订阅逻辑提取到 main.js，以便在整个应用中共享。
-
-1. 创建 mqtt.js 配置文件
-首先，我们将 MQTT 客户端的配置提取到一个单独的文件 mqtt.js，这样便于在 main.js 中统一管理和连接。
-
-mqtt.js
-
-import mqtt from 'mqtt';  // 引入 mqtt 库
-
-export function createMqttClient() {
-    const params = {
-        keepalive: 6000,
-        clean: true,
-        connectTimeout: 30 * 1000,
-        clientId:
-            "xcx_mqtt_cmd1" +
-            uni.getStorageSync("userId") +
-            Math.random().toString(16).substring(2, 8),
-        username: "lnradar",
-        password: "lnradar",
-        wsOptions: {
-            WebSocket: function (url) {
-                return wx.connectSocket({
-                    url: url,
-                    header: {
-                        "content-type": "application/json",
-                    },
-                    protocols: ["mqtt"],
-                });
-            },
-        },
-        reconnectPeriod: 0,
-        rejectUnauthorized: false,  // 仅开发环境使用，生产环境应设为 true 或移除
-    };
-
-    let client = "";
-    const selectedService = uni.getStorageSync("sercviceChoice");
-
-    if (!selectedService || selectedService == "aloneServe") {
-        if (__wxConfig.envVersion == "develop" || __wxConfig.envVersion == "trial") {
-            client = mqtt.connect("wxs://cmd.radar-power.cn/mqtt/", params);
-        }
-    }
-
-    client.on("connect", () => {
-        console.log("MQTT连接成功");
-        const userId = uni.getStorageSync("userId");
-        client.subscribe(`/mps/wx_${userId}/notice`, (err) => {
-            if (err) {
-                console.error("订阅失败", err);
-            } else {
-                console.log(`成功订阅设备主题: /mps/wx_${userId}/notice`);
-            }
-        });
-    });
-
-    client.on("message", (topic, message) => {
-        console.log("接收到消息:", JSON.parse(message.toString()));
-        const userId = uni.getStorageSync("userId");
-        const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
-        const match = topic.match(noticeMatch);
-        if (!match) return;
-        // 处理消息
-    });
-
-    client.on("error", (err) => {
-        console.error("MQTT连接错误:", err);
-        // 连接失败时重新尝试连接
-        setTimeout(() => {
-            createMqttClient();  // 重新连接
-        }, 1000);
-    });
-
-    client.on("disconnect", () => {
-        console.log("MQTT断开连接");
-    });
-
-    return client;
-}
-2. 在 main.js 中使用这个文件
-在 main.js 中引入并调用 createMqttClient 函数，初始化 MQTT 客户端，并将其绑定到 Vue 实例的原型中，这样在其他组件中就可以通过 this.$mqttClient 访问全局的 MQTT 客户端。
-
-main.js
-
-import Vue from 'vue';
-import App from './App';
-import { createMqttClient } from './mqtt';  // 引入 mqtt 配置文件
-
-Vue.config.productionTip = false;
-
-App.mpType = 'app';
-
-// 创建 MQTT 客户端
-const mqttClient = createMqttClient();
-
-// 将 mqttClient 绑定到 Vue 原型上，使其在任何组件中都能访问
-Vue.prototype.$mqttClient = mqttClient;
-
-const app = new Vue({
-    ...App
-});
-app.$mount();
-3. 在组件中访问全局 MQTT 客户端
-现在你可以在任何组件中通过 this.$mqttClient 来访问全局的 MQTT 客户端。
-
-示例：在页面组件中使用
-export default {
-    data() {
-        return {
-            message: ''
-        };
-    },
-    mounted() {
-        // 通过全局 MQTT 客户端订阅主题或监听消息
-        this.$mqttClient.on("message", (topic, message) => {
-            console.log("接收到消息:", JSON.parse(message.toString()));
-            this.message = message.toString();  // 处理消息
-        });
-    },
-    methods: {
-        sendMessage() {
-            // 通过全局 MQTT 客户端发布消息
-            this.$mqttClient.publish('/mps/wx_someUserId/notice', 'Hello MQTT!');
-        }
-    }
-};
-4. 优化和其他注意事项
-断线重连：在 client.on("error") 中处理了重连逻辑。如果 MQTT 连接失败，createMqttClient 会在 1 秒后自动重新连接。
-
-存储和状态管理：你可以在全局存储 client 实例和其连接状态，方便在其他组件中进行处理。
-
-消息处理：在 client.on("message") 事件中，处理接收到的 MQTT 消息。
-
-总结：
-将 MQTT 客户端的配置和连接逻辑抽象到一个单独的文件 mqtt.js，在 main.js 中调用并全局共享。
-
-在组件中通过 this.$mqttClient 访问并操作 MQTT 客户端，实现跨组件的共享和通信。
-
-优化了 MQTT 客户端连接逻辑，并通过 createMqttClient 函数实现自动重连。
-
-您说：
-转成微信小程序里面，为什么微信小程序启动 并没有打印的消息
-ChatGPT 说：
-微信小程序在启动时没有打印 MQTT 消息，可能是以下几个原因导致的。我们可以根据这些可能性逐步排查：
-
-1. uni.getStorageSync 和 __wxConfig 的问题
-在微信小程序环境中，使用 uni.getStorageSync 或 __wxConfig 获取存储或环境变量时，如果没有正确设置或者返回了 undefined，可能会影响你的 MQTT 客户端连接。你可以在 createMqttClient 中加入一些日志打印，确认是否获取到正确的存储值。
-
-排查：
-确保 uni.getStorageSync("userId") 和 uni.getStorageSync("sercviceChoice") 返回了正确的值。
-
-确保 __wxConfig.envVersion 返回了预期的环境值。
-
-2. WebSocket 配置问题
-微信小程序中使用 WebSocket 时，需要正确配置 WebSocket 的 URL 和选项。如果 WebSocket 连接失败或者配置错误，client.on("connect") 不会被触发。
-
-排查：
-检查 WebSocket URL 是否正确。使用 wxs:// 协议时，要确保目标服务器支持 WebSocket 连接。
-
-确保你的 WebSocket 配置选项（如 wsOptions）是正确的，微信小程序的 WebSocket 连接有些细节要注意。
-
-你可以在 WebSocket 的连接函数中加上日志，确认连接是否成功：
-
-wsOptions: {
-    WebSocket: function (url) {
-        const socket = wx.connectSocket({
-            url: url,
-            header: {
-                "content-type": "application/json",
-            },
-            protocols: ["mqtt"],
-        });
-
-        socket.onOpen(() => {
-            console.log("WebSocket 连接成功");
-        });
-
-        socket.onError((err) => {
-            console.error("WebSocket 连接失败", err);
-        });
-
-        return socket;
-    },
-}
-3. 异步连接问题
-如果 MQTT 客户端连接的初始化逻辑发生在小程序的生命周期内的某些阶段（比如 onLaunch 或 onShow），而连接时间较长，可能会导致你在尝试连接时没有成功或者异步没有完成。
-
-排查：
-你可以在 client.on("connect") 之前加上一些 console.log，确保代码执行顺序正确。
-
-同时也可以在 client.on("connect") 中加上延迟日志，查看是否在连接过程中有时间延迟。
-
-4. 微信小程序的调试模式
-微信小程序在开发模式下会有一些限制，例如不允许通过 console.log 打印所有类型的日志（特别是一些对象）。你可以尝试使用 wx.getSystemInfoSync() 获取设备信息，确认是否运行在预期的环境下。
-
-排查：
-检查是否启用了微信小程序的 调试模式。
-
-你可以尝试使用 wx.showModal 或 wx.showToast 等方法来替代 console.log，确认是否能正确执行。
-
-5. 未触发 client.on('connect')
-可能 MQTT 客户端没有成功连接，导致没有触发 client.on('connect') 事件。
-
-排查：
-在连接逻辑前后添加 console.log 打印，确认是否成功进入连接逻辑。
-
-检查 mqtt.connect 方法是否被调用，并且返回的 client 对象是否有效。
-
-完整优化后的代码示例（加强了日志输出）
-import mqtt from 'mqtt';  // 引入mqtt库
-
-export function createMqttClient() {
-    const params = {
-        keepalive: 6000,
-        clean: true,
-        connectTimeout: 30 * 1000,
-        clientId:
-            "xcx_mqtt_cmd1" +
-            uni.getStorageSync("userId") +
-            Math.random().toString(16).substring(2, 8),
-        username: "lnradar",
-        password: "lnradar",
-        wsOptions: {
-            WebSocket: function (url) {
-                const socket = wx.connectSocket({
-                    url: url,
-                    header: {
-                        "content-type": "application/json",
-                    },
-                    protocols: ["mqtt"],
-                });
-
-                socket.onOpen(() => {
-                    console.log("WebSocket 连接成功");
-                });
-
-                socket.onError((err) => {
-                    console.error("WebSocket 连接失败", err);
-                });
-
-                return socket;
-            },
-        },
-        reconnectPeriod: 0,
-        rejectUnauthorized: false,
-    };
-
-    let client = "";
-    const selectedService = uni.getStorageSync("sercviceChoice");
-    const userId = uni.getStorageSync("userId");
-
-    if (!selectedService || selectedService == "aloneServe") {
-        if (__wxConfig.envVersion == "develop" || __wxConfig.envVersion == "trial") {
-            console.log("Connecting to MQTT...");
-            client = mqtt.connect("wxs://cmd.radar-power.cn/mqtt/", params);
-        }
-    }
-
-    // 连接成功后订阅主题
-    client.on("connect", () => {
-        console.log("MQTT连接成功");
-        client.subscribe(`/mps/wx_${userId}/notice`, (err) => {
-            if (err) {
-                console.error("订阅失败", err);
-            } else {
-                console.log(`成功订阅设备主题: /mps/wx_${userId}/notice`);
-            }
-        });
-    });
-
-    // 处理消息
-    client.on("message", (topic, message) => {
-        console.log("接收到消息:", JSON.parse(message.toString()));
-        const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
-        const match = topic.match(noticeMatch);
-        if (!match) return;
-        // 处理消息
-    });
-
-    // 连接错误时的处理
-    client.on("error", (err) => {
-        console.error("MQTT连接错误:", err);
-        // 连接失败时重新尝试连接
-        setTimeout(() => {
-            createMqttClient();
-        }, 1000);
-    });
-
-    client.on("disconnect", () => {
-        console.log("MQTT断开连接");
-    });
-
-    return client;
-}
-调试建议：
-确认 WebSocket 连接是否成功：检查 WebSocket URL 和连接状态。
-
-检查 uni.getStorageSync 的返回值：确保 userId 和 sercviceChoice 都正确。
-
-使用 wx.showToast 或 wx.showModal 代替 console.log，查看是否有提示信息。
-
-确认环境配置：确认小程序的环境版本（__wxConfig.envVersion）是否正确，且目标 URL 正确。
-
-如果依然没有打印信息，可以尝试在不同生命周期（如 onLaunch 或 onShow）进行调试，确保 MQTT 连接逻辑处于合适的执行时机。
-
-您说：
-app.js错误:
- ReferenceError: Buffer is not defined
-    at Object../node_modules/mqtt-packet/constants.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:24710)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)
-    at Object../node_modules/mqtt-packet/parser.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:25016)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)
-    at Object../node_modules/mqtt-packet/mqtt.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:24918)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)
-    at Object../node_modules/mqtt/lib/client.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:26870)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)
-    at Object../node_modules/mqtt/lib/connect/index.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:28899)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)(env: Windows,mp,1.06.2504010; lib: 3.0.2)
-ReferenceError: Buffer is not defined
-    at Object../node_modules/mqtt-packet/constants.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:24710)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)
-    at Object../node_modules/mqtt-packet/parser.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:25016)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)
-    at Object../node_modules/mqtt-packet/mqtt.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:24918)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)
-    at Object../node_modules/mqtt/lib/client.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:26870)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)
-    at Object../node_modules/mqtt/lib/connect/index.js (vendor.js?t=wechat&s=1757576099962&v=56798fe96744e45150ddce682150378b:28899)
-    at __webpack_require__ (runtime.js?t=wechat&s=1757576099962&v=a42169603b4d70b441de0554184e9dc3:26)(env: Windows,mp,1.06.2504010; lib: 3.0.2)
-ChatGPT 说：
-这个错误 ReferenceError: Buffer is not defined 是因为 Buffer 是 Node.js 的全局对象之一，在微信小程序中是不可用的。MQTT 的库（如 mqtt.js）在实现时可能依赖于 Buffer 来处理二进制数据，但微信小程序并不支持 Node.js 的一些核心模块。
-
-解决方案
-你可以使用以下几种方法来解决这个问题：
-
-1. 使用 mqtt 适配版库
-一些专门为微信小程序开发的 MQTT 库已经做了适配，避免了 Buffer 等 Node.js 特性。你可以使用 mqtt 的适配版（例如 mqtt-wx）来替代原版 mqtt.js。
-
-安装 mqtt-wx：
-
-npm install mqtt-wx --save
-修改代码使用 mqtt-wx：
-
-在 main.js 中替换掉 mqtt 库的引用：
-
-import mqtt from 'mqtt-wx';  // 引入微信小程序适配版的 mqtt 库
-这样就能避免 Buffer 问题，使用适配过的库来建立 MQTT 连接。
-
-2. 手动 Polyfill Buffer
-如果你仍然希望使用原版的 mqtt.js，你可以手动引入 Buffer 的 Polyfill。通过使用 buffer 库，你可以模拟 Node.js 中的 Buffer，使其能在微信小程序中使用。
-
-安装 buffer 库：
-
-npm install buffer --save
-在 main.js 中引入 Buffer polyfill：
-
-在 main.js 顶部加入以下代码来引入 Buffer 的 polyfill：
-
-import { Buffer } from 'buffer';  // 引入 Buffer polyfill
-
-// 将 Buffer 替换为全局对象
-global.Buffer = Buffer;
-这样，Buffer 就会在微信小程序中可用，解决依赖 Buffer 的问题。
-
-3. 修改 mqtt.js 配置
-如果你选择保留原版的 mqtt.js，你还可以检查 mqtt.js 配置中的 WebSocket 是否与微信小程序兼容。微信小程序对 WebSocket 连接有一些特定的要求，需要确保 WebSocket 配置正确。
-
-4. 调试 mqtt 连接代码
-确保你已正确配置 WebSocket 的 URL 和参数。微信小程序的 WebSocket 连接需要使用 wxs:// 协议，而不是 ws:// 或 wss://。
-
-const client = mqtt.connect('wxs://your-mqtt-server.com/mqtt', params);
-总结
-最简单的解决方案是使用 mqtt-wx 库，它是专为微信小程序适配的版本。
-
-如果你想继续使用原版 mqtt.js，可以手动引入 Buffer 的 polyfill 库。
-
-确保 WebSocket 配置正确，使用 wxs:// 协议进行连接。
-
-试试看其中的一种解决方案，应该能解决你遇到的 Buffer is not defined 错误。如果问题仍然存在，可以进一步检查 WebSocket 配置或其他相关依赖。
-
-您说：
-WebSocket connection to 'wss://cmd.radar-power.cn/mqtt/' failed: WebSocket is closed before the connection is established.
-ChatGPT 说：
-这个错误 WebSocket connection to 'wss://cmd.radar-power.cn/mqtt/' failed: WebSocket is closed before the connection is established 表明 WebSocket 连接在建立之前就被关闭了。这通常有几个原因，以下是一些常见的排查步骤和解决方案：
-
-1. WebSocket URL 配置问题
-首先确认 WebSocket URL 是否正确，确保服务器支持 wss:// 协议，并且端口号和路径正确。
-
-检查 URL 格式：确保 wss://cmd.radar-power.cn/mqtt/ URL 正确并支持 WebSocket 协议。
-
-端口号：确认 WebSocket 服务器端口是否为 443（即 wss:// 协议），如果是非标准端口，需要保证目标服务器的端口开放。
-
-2. 检查 WebSocket 服务器是否支持 WSS
-确保你连接的 WebSocket 服务器支持 wss://（加密的 WebSocket 连接）。如果服务器没有正确配置支持加密连接，你将无法建立 WebSocket 连接。
-
-3. 检查服务器端配置
-CORS（跨域资源共享）问题：服务器可能会阻止来自微信小程序的 WebSocket 连接。确保服务器端允许来自微信小程序的 WebSocket 连接。
-
-SSL/TLS 配置问题：如果服务器使用 HTTPS，确保服务器的 SSL 证书配置正确且有效。
-
-4. 小程序端 WebSocket 配置
-微信小程序的 WebSocket 配置可能会有些限制，确保你正确配置了 WebSocket 参数。特别是，微信小程序使用 wx.connectSocket 来创建 WebSocket 连接。
-
-确保你已经正确地设置了 WebSocket 的选项：
-
-const socket = wx.connectSocket({
-    url: 'wss://cmd.radar-power.cn/mqtt/',
-    header: {
-        "content-type": "application/json",
-    },
-    protocols: ["mqtt"],
-});
-5. 查看微信小程序的网络请求日志
-在微信开发者工具中打开 调试模式，查看控制台的输出。确保没有其他的错误或警告信息可以帮助你进一步排查问题。
-
-6. WebSocket 连接事件处理
-确保你正确处理了 WebSocket 连接的事件，特别是 onOpen 和 onError，查看连接状态，是否有具体的错误信息。
-
-const socket = wx.connectSocket({
-    url: 'wss://cmd.radar-power.cn/mqtt/',
-    header: {
-        "content-type": "application/json",
-    },
-    protocols: ["mqtt"],
-});
-
-socket.onOpen(() => {
-    console.log('WebSocket 连接成功');
-});
-
-socket.onError((err) => {
-    console.error('WebSocket 连接失败:', err);
-});
-
-socket.onClose(() => {
-    console.log('WebSocket 连接关闭');
-});
-7. 尝试手动调试 WebSocket
-你可以尝试在微信开发者工具中手动调试 WebSocket 连接。打开微信开发者工具的 网络 面板，看看是否有 WebSocket 连接请求被发送，并查看服务器的响应。
-
-8. 服务器端重试机制
-有时，服务器端也可能会因为一些临时问题而拒绝连接。你可以在客户端实现一个简单的重试机制。
-
-function connectMqtt() {
-    const socket = wx.connectSocket({
-        url: 'wss://cmd.radar-power.cn/mqtt/',
-        header: {
-            "content-type": "application/json",
-        },
-        protocols: ["mqtt"],
-    });
-
-    socket.onOpen(() => {
-        console.log('WebSocket 连接成功');
-        // 连接成功后执行订阅操作
-    });
-
-    socket.onError((err) => {
-        console.error('WebSocket 连接失败:', err);
-        setTimeout(connectMqtt, 1000);  // 连接失败，1秒后重试
-    });
-
-    socket.onClose(() => {
-        console.log('WebSocket 连接关闭');
-        setTimeout(connectMqtt, 1000);  // 连接关闭，1秒后重试
-    });
-}
-
-// 启动连接
-connectMqtt();
-9. 检查 WebSocket 客户端版本和依赖
-确认你所使用的 mqtt.js 版本和 wx.connectSocket 兼容，并且你的 WebSocket 客户端依赖没有问题。如果使用的是 mqtt.js，建议使用专门为小程序适配过的版本，如 mqtt-wx。
-
-总结：
-确认 WebSocket URL 和端口正确。
-
-确认 WebSocket 服务器支持 WSS 并配置正确。
-
-检查服务器端的 CORS 和 SSL 配置。
-
-确保微信小程序端的 WebSocket 配置正确，并处理了相关事件。
-
-如果问题依然存在，可以使用调试工具查看更详细的错误信息。
-
-您说：
-const params = {
-                keepalive: 6000,
-                clean: true,
-                connectTimeout: 30 * 1000,
-                clientId:
-                    "xcx_mqtt_data1" +
-                    this.clientIdProp +
-                    Date.now() +
-                    "_" +
-                    Math.random().toString(16).substring(2, 8),
-                username: "lnradar",
-                password: "lnradar",
-                // 微信小程序特定配置
-                wsOptions: {
-                    WebSocket: function (url) {
-                        return wx.connectSocket({
-                            url: url,
-                            header: {
-                                "content-type": "application/json",
-                            },
-                            protocols: ["mqtt"],
-                        });
-                    },
-                },
-                reconnectPeriod: 0,
-                rejectUnauthorized: false,
-            };修改这个参数 把这个mqtt重连的时间缩短一点
-ChatGPT 说：
-你现在的配置里
-
-reconnectPeriod: 0
-意思是 禁用自动重连，所以一旦断开不会自动重连。
-
-如果你想缩短重连时间，可以把 reconnectPeriod 设置为一个较小的毫秒数，比如 1 秒（1000 ms） 或者 3 秒（3000 ms）。
-
-修改后的参数：
-
-const params = {
-    keepalive: 6000,
-    clean: true,
-    connectTimeout: 30 * 1000,
-    clientId:
-        "xcx_mqtt_data1" +
-        this.clientIdProp +
-        Date.now() +
-        "_" +
-        Math.random().toString(16).substring(2, 8),
-    username: "lnradar",
-    password: "lnradar",
-    // 微信小程序特定配置
-    wsOptions: {
-        WebSocket: function (url) {
-            return wx.connectSocket({
-                url: url,
-                header: {
-                    "content-type": "application/json",
-                },
-                protocols: ["mqtt"],
-            });
-        },
-    },
-    reconnectPeriod: 2000,  // 设置为 2 秒重连一次
-    rejectUnauthorized: false,
-};
-推荐值
-1000 → 每 1 秒重连
-
-2000 → 每 2 秒重连
-
-5000 → 每 5 秒重连
-
-👉 你想让我帮你加上 最大重试次数（比如超过 10 次就停止），还是保持无限重连？
-
-您说：
-connectTimeout是什么意思
-ChatGPT 说：
-这个参数你问得好 👍，在 mqtt.js 里：
-
-connectTimeout
-单位：毫秒 (ms)
-
-含义：客户端在尝试连接到 MQTT 服务器时的超时时间。
-
-作用：如果在设定时间内（比如 30 秒）没有建立成功连接，就会触发 error 或 close 事件。
-
-举例说明
-connectTimeout: 30 * 1000 // 30 秒
-表示：
-客户端在 30 秒内如果没有连上 MQTT 服务器，就认为连接失败，然后会触发错误/断开逻辑（如果设置了 reconnectPeriod，会进入重连）。
-
-一般设置建议
-3000 ~ 5000 ms（3~5 秒）：网络环境比较稳定时，推荐设置小一些。
-
-10000 ~ 30000 ms（10~30 秒）：在弱网环境下，可以设置大一些，避免过早判定连接失败。
-
-👉 结合你的场景（微信小程序 + MQTT），我建议你把 connectTimeout 调整到 5000~10000 毫秒，再配合 reconnectPeriod: 2000，就能比较快地检测到失败并自动重连。
-
-要不要我帮你把 完整优化版的 params 配置写给你，适合小程序里跑的？
-
-您说：
-WebSocket connection to 'wss://data.radar-power.cn/mqtt/' failed: WebSocket is closed before the connection is established.
-ChatGPT 说：
-你这个报错：
-
-WebSocket connection to 'wss://data.radar-power.cn/mqtt/' failed: 
-WebSocket is closed before the connection is established.
-说明微信小程序还没连上 MQTT 服务，连接就被关闭了。这个问题一般不是 params 写错，而是以下几个原因👇
-
-常见原因排查
-1. 协议 / 端口问题
-微信小程序只允许使用 wss:// 安全 WebSocket。
-
-服务端必须支持 MQTT over WebSocket，并且开启对应端口。
-
-你写的：
-
-wss://data.radar-power.cn/mqtt/
-要确认：
-
-data.radar-power.cn 的 Nginx 或 EMQX/EMQTT 配置里，有开启 WebSocket 协议。
-
-端口通常是 443（默认 HTTPS），而不是 1883 或 8083。
-
-2. 服务器证书问题
-微信小程序强制校验证书，必须用 有效的 CA 签发证书（不能用自签名证书）。
-
-如果证书不合法，就会直接关闭连接。
-
-👉 建议用浏览器打开：
-
-https://data.radar-power.cn/mqtt/
-看看是否报证书错误。
-
-3. 路径配置
-很多 MQTT WebSocket 服务的路径不是 /mqtt/，而是 /mqtt（没有最后的 /），或者 /ws。
-
-比如 EMQX 默认：wss://domain:8084/mqtt
-
-Mosquitto 可能是：/mqtt 或 /ws
-
-你需要确认服务器端的 WebSocket 路径。
-
-4. 小程序配置
-在小程序中，WebSocket 必须写在 downloadFile / uploadFile / connectSocket 域名白名单里。
-
-打开小程序后台 → 开发管理 → 开发设置 → 服务器域名
-
-在 socket 合法域名里加上：
-
-wss://data.radar-power.cn
-否则即使代码对，微信也会拒绝连接。
-
-建议修改代码测试
-你现在的配置可以先这样试：
-
-const client = mqtt.connect("wss://data.radar-power.cn/mqtt", {
-    clientId: "wx_mqtt_" + Date.now(),
-    username: "lnradar",
-    password: "lnradar",
-    connectTimeout: 5000,   // 5 秒超时
-    reconnectPeriod: 2000,  // 2 秒重连
-    wsOptions: {
-        WebSocket: function (url) {
-            return wx.connectSocket({
-                url: url,
-                protocols: ["mqtt"]
-            });
-        },
-    },
-});
-⚡️我建议你先确认三件事：
-
-wss://data.radar-power.cn/mqtt 在浏览器能正常握手吗？
-
-小程序后台是否配置了合法的 socket 域名？
-
-MQTT 服务端（EMQX/Mosquitto）WebSocket 是否启用？
-
-要不要我帮你写个 快速验证脚本，你可以在浏览器里先测试 wss://data.radar-power.cn/mqtt 是否能正常握手？
-
-您说：
-放在onLOad里面去加载连接可以嘛
-ChatGPT 说：
-可以放在 onLoad 里连，但是要注意 ⚠️：
-
-📌 区别
-全局 MQTT（需要整个小程序都保持连接） 👉 最好放在 App.onLaunch 里，这样只初始化一次，整个生命周期都能用。
-
-页面级 MQTT（只在某个页面才需要连接） 👉 可以放在该页面的 onLoad 里，进入页面时建立连接，离开页面时（onUnload）断开连接，避免占用资源。
-
-✅ 示例（页面级）
-export default {
-  data() {
-    return {
-      client: null,
-    };
-  },
-
-  onLoad() {
-    console.log("页面加载，开始连接 MQTT...");
-    this.connectMqtt();
-  },
-
-  onUnload() {
-    if (this.client) {
-      this.client.end();
-      console.log("页面卸载，MQTT 断开连接");
-    }
-  },
-
-  methods: {
-    connectMqtt() {
-      const client = mqtt.connect("wss://data.radar-power.cn/mqtt", {
-        clientId: "wx_mqtt_" + Date.now(),
-        username: "lnradar",
-        password: "lnradar",
-        connectTimeout: 5000,
-        reconnectPeriod: 2000,
-        wsOptions: {
-          WebSocket: function (url) {
-            return wx.connectSocket({
-              url: url,
-              protocols: ["mqtt"]
-            });
-          },
-        },
-      });
-
-      client.on("connect", () => {
-        console.log("MQTT 连接成功");
-        client.subscribe("/test/topic");
-      });
-
-      client.on("message", (topic, message) => {
-        console.log("收到消息:", topic, message.toString());
-      });
-
-      client.on("error", (err) => {
-        console.error("MQTT 连接错误:", err);
-      });
-
-      this.client = client;
-    }
-  }
-}
-🚀 总结
-如果是 全局必须存在的连接（比如告警、实时数据），放 App.onLaunch。
-
-如果是 页面专用的连接（比如某个页面需要监听设备），放 onLoad，并在 onUnload 里断开。
-
-要不要我帮你整理一个 全局 + 页面级 MQTT 并存的最佳实践？这样你的小程序里两个 MQTT 就能同时管理。
-
-您说：
-import mqtt from './mqtt';
-
-export function createMqttClient() {
-    const params = {
-        keepalive: 6000,
-        clean: true,
-        connectTimeout: 30 * 1000,
-        clientId:
-            "xcx_mqtt_cmd1" +
-            uni.getStorageSync("userId") +
-            Math.random().toString(16).substring(2, 8),
-        username: "lnradar",
-        password: "lnradar",
-        wsOptions: {
-            WebSocket: function (url) {
-                return wx.connectSocket({
-                    url: url,
-                    header: {
-                        "content-type": "application/json",
-                    },
-                    protocols: ["mqtt"],
-                });
-            },
-        },
-    };
-
-    let client = "";
-    // const selectedService = uni.getStorageSync("sercviceChoice");
-    // if (!selectedService || selectedService == "aloneServe") {
-    //     if (__wxConfig.envVersion == "develop") {
-    //         client = mqtt.connect("wxs://cmd.radar-power.cn/mqtt/", params);
-    //     }
-    //     if (__wxConfig.envVersion == "trial") {
-    //         client = mqtt.connect("wxs://cmd.radar-power.cn/mqtt/", params);
-    //     }
-    //     client = mqtt.connect("wxs://cmd.radar-power.cn/mqtt/", params);
-    // }
-    client = mqtt.connect("wxs://cmd.radar-power.cn/mqtt/", params);
-
-    client.on("connect", () => {
-        console.log("MQTTCMD连接成功");
-        const userId = uni.getStorageSync("userId");
-        client.subscribe(/mps/wx_${userId}/notice, (err) => {
-            if (err) {
-                console.error("订阅失败", err);
-            } else {
-                console.log(成功订阅设备主题: /mps/wx_${userId}/notice);
-            }
-        });
-    });
-
-    client.on("message", (topic, message) => {
-        console.log("topic", topic, message);
-        console.log("接收到消息:", JSON.parse(message.toString()));
-        const userId = uni.getStorageSync("userId");
-        const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
-        const match = topic.match(noticeMatch);
-        if (!match) return;
-        // 处理消息
-    });
-
-    client.on("error", (err) => {
-        console.error("MQTT连接错误:", err);
-        // 连接失败时重新尝试连接
-        setTimeout(() => {
-            createMqttClient();  // 重新连接
-        }, 1000);
-    });
-
-    client.on("disconnect", () => {
-        console.log("MQTT断开连接");
-    });
-
-    return client;
-}这个代码重新优化  新增下个的mqtt 使得可以同时连接两个    this.mqttClienTwoFlag = false;
-            if (this.mqttClienTwoFlag) {
-                console.log("主题已订阅");
-                return;
-            }
-            const THRESHOLD = 2;
-            const params = {
-                keepalive: 6000,
-                clean: true,
-                connectTimeout: 30 * 1000,
-                clientId:
-                    "xcx_mqtt_data1" +
-                    this.clientIdProp +
-                    Date.now() +
-                    "_" +
-                    Math.random().toString(16).substring(2, 8),
-                username: "lnradar",
-                password: "lnradar",
-                // 微信小程序特定配置
-                wsOptions: {
-                    WebSocket: function (url) {
-                        return wx.connectSocket({
-                            url: url,
-                            header: {
-                                "content-type": "application/json",
-                            },
-                            protocols: ["mqtt"],
-                        });
-                    },
-                },
-            };
-            let clientTwo = "";
-            let selectedService = uni.getStorageSync("sercviceChoice");
-            if (!selectedService || selectedService == "aloneServe") {
-                if (__wxConfig.envVersion == "develop") {
-                    clientTwo = mqtt.connect(
-                        "wxs://data.radar-power.cn/mqtt/",
-                        params
-                    );
-                }
-                if (__wxConfig.envVersion == "trial") {
-                    clientTwo = mqtt.connect(
-                        "wxs://data.radar-power.cn/mqtt/",
-                        params
-                    );
-                }
-            }
-            clientTwo = mqtt.connect("wxs://data.radar-power.cn/mqtt/", params);
-            console.log("主题开始订阅5555");
-            // 存储client引用以便后续操作
-            this.mqttClientOne = clientTwo;
-            clientTwo.on("connect", () => {
-                console.log("MQTT_DATA连接成功");
-                this.mqttClienTwoFlag = true;
-                if (this.clientIdProp !== null) {
-                    clientTwo.subscribe(
-                        /dev/${this.clientIdProp}/tracker_targets,
-                        (err) => {
-                            if (err) {
-                                console.error("订阅clientId失败", err);
-                            } else {
-                                console.log(
-                                    成功订阅设备主题: /dev/${this.clientIdProp}/dsp_data
-                                );
-                            }
-                        }
-                    );
-                }
-                console.log(this.clientIdProp);
-            });
-            clientTwo.on("disconnect", () => {
-                console.log("MQTT不在连接");
-            });
-            clientTwo.on("error", (err) => {
-                this.mqttClienTwoFlag = false;
-                setTimeout(() => {
-                    this.connectMqtt();
-                }, 1000);
-            });
-
-            clientTwo.on("reconnect", () => {});
-
-            clientTwo.on("close", () => {});
-
-            clientTwo.on("message", (topic, message) => {
-                // 处理点位消息
-                if (this.clientIdProp !== null) {
-                    this.handleMessage(topic, message, this.clientIdProp);
-                }
-            }); 
-
-ChatGPT 说：
-明白了，你希望把 两个 MQTT 连接（一个 CMD，一个 DATA）整合成一个可复用的模块，同时支持在微信小程序里全局管理，并且每个连接都能独立订阅和处理消息。下面是优化后的示例实现：
-
-// mqttService.js
-import mqtt from './mqtt';
-
-let mqttClientCmd = null;   // 全局 CMD MQTT
-let mqttClientData = null;  // 全局 DATA MQTT
-
-let mqttCmdConnected = false;
-let mqttDataConnected = false;
-
-/**
- * 创建 CMD MQTT 连接
- */
-export function createMqttCmd(userId) {
-    if (mqttCmdConnected) {
-        console.log("CMD MQTT 已连接");
-        return mqttClientCmd;
-    }
-
-    const params = {
-        keepalive: 6000,
-        clean: true,
-        connectTimeout: 10000,
-        clientId: "xcx_mqtt_cmd1_" + userId + "_" + Date.now(),
-        username: "lnradar",
-        password: "lnradar",
-        wsOptions: {
-            WebSocket: (url) => wx.connectSocket({ url, protocols: ["mqtt"] })
-        },
-        reconnectPeriod: 2000,  // 自动重连周期
-    };
-
-    mqttClientCmd = mqtt.connect("wxs://cmd.radar-power.cn/mqtt/", params);
-
-    mqttClientCmd.on("connect", () => {
-        console.log("CMD MQTT 连接成功");
-        mqttCmdConnected = true;
-        mqttClientCmd.subscribe(`/mps/wx_${userId}/notice`, (err) => {
-            if (err) console.error("CMD MQTT 订阅失败", err);
-            else console.log("CMD MQTT 订阅成功");
-        });
-    });
-
-    mqttClientCmd.on("message", (topic, message) => {
-        console.log("CMD MQTT 消息:", topic, message.toString());
-        // 可以在这里分发消息到全局状态或 Vuex
-    });
-
-    mqttClientCmd.on("error", (err) => {
-        console.error("CMD MQTT 错误", err);
-        mqttCmdConnected = false;
-    });
-
-    mqttClientCmd.on("disconnect", () => {
-        console.log("CMD MQTT 断开连接");
-        mqttCmdConnected = false;
-    });
-
-    return mqttClientCmd;
-}
-
-/**
- * 创建 DATA MQTT 连接
- */
-export function createMqttData(clientIdProp) {
-    if (mqttDataConnected) {
-        console.log("DATA MQTT 已连接");
-        return mqttClientData;
-    }
-
-    const params = {
-        keepalive: 6000,
-        clean: true,
-        connectTimeout: 10000,
-        clientId: "xcx_mqtt_data1_" + clientIdProp + "_" + Date.now(),
-        username: "lnradar",
-        password: "lnradar",
-        wsOptions: {
-            WebSocket: (url) => wx.connectSocket({ url, protocols: ["mqtt"] })
-        },
-        reconnectPeriod: 2000,
-    };
-
-    mqttClientData = mqtt.connect("wxs://data.radar-power.cn/mqtt/", params);
-
-    mqttClientData.on("connect", () => {
-        console.log("DATA MQTT 连接成功");
-        mqttDataConnected = true;
-        if (clientIdProp) {
-            mqttClientData.subscribe(`/dev/${clientIdProp}/tracker_targets`, (err) => {
-                if (err) console.error("DATA MQTT 订阅失败", err);
-                else console.log(`DATA MQTT 订阅成功: /dev/${clientIdProp}/tracker_targets`);
-            });
-        }
-    });
-
-    mqttClientData.on("message", (topic, message) => {
-        console.log("DATA MQTT 消息:", topic, message.toString());
-        if (clientIdProp) {
-            handleDataMessage(topic, message, clientIdProp);
-        }
-    });
-
-    mqttClientData.on("error", (err) => {
-        console.error("DATA MQTT 错误", err);
-        mqttDataConnected = false;
-    });
-
-    mqttClientData.on("disconnect", () => {
-        console.log("DATA MQTT 断开连接");
-        mqttDataConnected = false;
-    });
-
-    return mqttClientData;
-}
-
-/**
- * DATA 消息处理函数
- */
-function handleDataMessage(topic, message, clientIdProp) {
-    try {
-        const data = JSON.parse(message.toString());
-        console.log("处理 DATA 消息:", topic, data, clientIdProp);
-        // TODO: 这里可以更新页面状态或调用 Vuex/全局事件
-    } catch (err) {
-        console.error("解析 DATA MQTT 消息失败", err);
-    }
-}
-🔹 使用方法
-在 App.vue 或 main.js 初始化全局 CMD 连接：
-
-import { createMqttCmd, createMqttData } from './mqttService';
-
-App({
-  onLaunch() {
-    const userId = uni.getStorageSync("userId");
-    createMqttCmd(userId);  // 全局 CMD MQTT
-  }
-});
-在页面 onLoad 初始化 DATA 连接（只在页面有效）：
-
-import { createMqttData } from '../../mqttService';
-
-export default {
-  onLoad() {
-    const clientIdProp = this.clientIdProp;
-    createMqttData(clientIdProp);
-  }
-}
-✅ 优点：
-
-CMD 与 DATA 分开管理，互不影响。
-
-自动重连 (reconnectPeriod) 设置为 2 秒。
-
-全局 CMD 连接在 App 生命周期内保持，页面 DATA 连接仅在页面需要时建立。
-
-消息处理分开，方便扩展。
-
-可返回 mqttClient 对象，用于后续订阅/发布。
-
-如果你愿意，我可以帮你再 加上 Vue 组件订阅 DATA 或 CMD 消息的事件机制，这样任何组件都能收到 MQTT 消息，而不需要直接引用 mqtt 客户端对象。
-
-你希望我帮你加吗？
-
-您说：
-在main.js里面同时挂载两个 import { createMqttClient } from './utils/globalMqtt'; 这种形式，然后在页面上使用
-ChatGPT 说：
-明白了，你想在 main.js 里同时挂载两个 MQTT 客户端（CMD 和 DATA），然后在页面里直接使用。下面是一个优化示例，结合你之前的需求和小程序特性：
-
-1️⃣ main.js 全局挂载两个 MQTT
-import { createMqttCmd, createMqttData } from './utils/globalMqtt';
-
-App({
-  globalData: {
-    mqttCmd: null,
-    mqttData: null
-  },
-
-  onLaunch() {
-    const userId = uni.getStorageSync("userId");
-    const clientIdProp = uni.getStorageSync("clientIdProp"); // 或者其他标识
-
-    // 全局 CMD MQTT
-    this.globalData.mqttCmd = createMqttCmd(userId);
-
-    // 全局 DATA MQTT
-    this.globalData.mqttData = createMqttData(clientIdProp);
-  }
-});
-2️⃣ 页面使用全局 MQTT
-在页面里直接通过 getApp().globalData 获取客户端实例：
-
-export default {
-  data() {
-    return {
-      mqttCmd: null,
-      mqttData: null
-    };
-  },
-
-  onLoad() {
-    const app = getApp();
-
-    // 获取全局 MQTT 客户端
-    this.mqttCmd = app.globalData.mqttCmd;
-    this.mqttData = app.globalData.mqttData;
-
-    // 订阅 DATA 的消息（页面专属逻辑）
-    if (this.mqttData) {
-      this.mqttData.on("message", (topic, message) => {
-        console.log("页面收到 DATA MQTT 消息:", topic, message.toString());
-      });
-    }
-
-    // 订阅 CMD 的消息（页面可以选择订阅）
-    if (this.mqttCmd) {
-      this.mqttCmd.on("message", (topic, message) => {
-        console.log("页面收到 CMD MQTT 消息:", topic, message.toString());
-      });
-    }
-  }
-};
-3️⃣ 优点
-CMD 和 DATA MQTT 在 App.globalData 里统一管理。
-
-页面通过 getApp().globalData 直接使用，不用每个页面重复创建。
-
-DATA MQTT 可以在页面级别处理消息，CMD MQTT 可以保持全局状态。
-
-自动重连、订阅逻辑都在 globalMqtt.js 里封装，页面更简洁。
-
-我可以帮你写一个 完整的 globalMqtt.js 封装模板，支持：
-
-同时 CMD / DATA MQTT
-
-自动重连
-
-页面订阅消息事件
-这样你在 main.js 挂载一次，所有页面都可以直接使用。
-
-你希望我直接写这个版本吗？
-
-您说：
-clientIdProp需要到页面里面去传
-ChatGPT 说：
-明白了，你希望 DATA MQTT 的 clientIdProp 需要从页面传入，而 CMD MQTT 是全局固定的。针对这个需求，可以优化 globalMqtt.js 和 main.js 的结构，让 DATA MQTT 按需初始化，同时保持 CMD MQTT 全局。
-
-1️⃣ globalMqtt.js 封装
-import mqtt from './mqtt';
-
-let mqttClientCmd = null;   // 全局 CMD MQTT
-let mqttClientData = null;  // DATA MQTT（按页面传入 clientIdProp 初始化）
-
-let mqttCmdConnected = false;
-let mqttDataConnected = false;
-
-/**
- * 创建全局 CMD MQTT
- */
-export function createMqttCmd(userId) {
-    if (mqttCmdConnected) return mqttClientCmd;
-
-    const params = {
-        keepalive: 6000,
-        clean: true,
-        connectTimeout: 10000,
-        clientId: "xcx_mqtt_cmd1_" + userId + "_" + Date.now(),
-        username: "lnradar",
-        password: "lnradar",
-        wsOptions: { WebSocket: (url) => wx.connectSocket({ url, protocols: ["mqtt"] }) },
-        reconnectPeriod: 2000
-    };
-
-    mqttClientCmd = mqtt.connect("wxs://cmd.radar-power.cn/mqtt/", params);
-
-    mqttClientCmd.on("connect", () => {
-        console.log("CMD MQTT 连接成功");
-        mqttCmdConnected = true;
-        mqttClientCmd.subscribe(`/mps/wx_${userId}/notice`, (err) => {
-            if (err) console.error("CMD MQTT 订阅失败", err);
-            else console.log("CMD MQTT 订阅成功");
-        });
-    });
-
-    mqttClientCmd.on("message", (topic, message) => {
-        console.log("CMD MQTT 消息:", topic, message.toString());
-    });
-
-    mqttClientCmd.on("error", (err) => { mqttCmdConnected = false; console.error(err); });
-    mqttClientCmd.on("disconnect", () => { mqttCmdConnected = false; console.log("CMD MQTT 断开"); });
-
-    return mqttClientCmd;
-}
-
-/**
- * 创建 DATA MQTT（需要页面传入 clientIdProp）
- */
-export function createMqttData(clientIdProp) {
-    if (!clientIdProp) {
-        console.warn("DATA MQTT 创建失败：缺少 clientIdProp");
-        return null;
-    }
-
-    if (mqttDataConnected) return mqttClientData;
-
-    const params = {
-        keepalive: 6000,
-        clean: true,
-        connectTimeout: 10000,
-        clientId: "xcx_mqtt_data1_" + clientIdProp + "_" + Date.now(),
-        username: "lnradar",
-        password: "lnradar",
-        wsOptions: { WebSocket: (url) => wx.connectSocket({ url, protocols: ["mqtt"] }) },
-        reconnectPeriod: 2000
-    };
-
-    mqttClientData = mqtt.connect("wxs://data.radar-power.cn/mqtt/", params);
-
-    mqttClientData.on("connect", () => {
-        console.log("DATA MQTT 连接成功");
-        mqttDataConnected = true;
-        mqttClientData.subscribe(`/dev/${clientIdProp}/tracker_targets`, (err) => {
-            if (err) console.error("DATA MQTT 订阅失败", err);
-            else console.log(`DATA MQTT 订阅成功: /dev/${clientIdProp}/tracker_targets`);
-        });
-    });
-
-    mqttClientData.on("message", (topic, message) => {
-        console.log("DATA MQTT 消息:", topic, message.toString());
-        handleDataMessage(topic, message, clientIdProp);
-    });
-
-    mqttClientData.on("error", (err) => { mqttDataConnected = false; console.error(err); });
-    mqttClientData.on("disconnect", () => { mqttDataConnected = false; console.log("DATA MQTT 断开"); });
-
-    return mqttClientData;
-}
-
-/**
- * DATA 消息处理
- */
-function handleDataMessage(topic, message, clientIdProp) {
-    try {
-        const data = JSON.parse(message.toString());
-        console.log("处理 DATA 消息:", topic, data, clientIdProp);
-        // TODO: 页面或全局事件分发
-    } catch (err) {
-        console.error("解析 DATA 消息失败", err);
-    }
-}
-2️⃣ main.js 初始化全局 CMD MQTT
-import { createMqttCmd } from './utils/globalMqtt';
-
-App({
-  globalData: {
-    mqttCmd: null,
-  },
-
-  onLaunch() {
-    const userId = uni.getStorageSync("userId");
-    this.globalData.mqttCmd = createMqttCmd(userId);
-  }
-});
-3️⃣ 页面按需创建 DATA MQTT
-import { createMqttData } from '../../utils/globalMqtt';
-
-export default {
-  data() {
-    return {
-      mqttData: null,
-    };
-  },
-
-  onLoad() {
-    const clientIdProp = this.clientIdProp || uni.getStorageSync("clientIdProp");
-    this.mqttData = createMqttData(clientIdProp);
-
-    if (this.mqttData) {
-      this.mqttData.on("message", (topic, message) => {
-        console.log("页面收到 DATA MQTT 消息:", topic, message.toString());
-      });
-    }
-  },
-
-  onUnload() {
-    if (this.mqttData) {
-      this.mqttData.end(); // 页面卸载时断开 DATA MQTT
-      this.mqttData = null;
-      console.log("页面 DATA MQTT 已断开");
-    }
-  }
-};
-✅ 优点：
-
-CMD MQTT 全局统一管理，整个小程序生命周期保持连接。
-
-DATA MQTT 页面级按需初始化，需要 clientIdProp。
-
-页面可以单独订阅 DATA 消息，不影响全局 CMD MQTT。
-
-自动重连、错误处理都封装在 globalMqtt.js。
-
-如果你希望，我可以帮你进一步 改造成事件分发模式，让 CMD 和 DATA MQTT 的消息直接推送到任意页面组件，而不用在每个页面手动 on("message")。
-
-你希望我帮你加吗？
-
-您说：
- this.mqttData.on("message", (topic, message) => {
-                console.log("topic", topic, message);
-
-                const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-                if (!match || match[1] !== clientId) {
-                    
-                };
-
-                this.handleMessage(topic, message, clientId);
-            });
-        }    如果不是 这个点位消息  mounted() {
-        console.log("开始接受消息", "8870");
-        // 通过全局 MQTT 客户端订阅主题或监听消息
-        this.$mqttClient.on("message", (topic, message) => {
-            console.log("接收到消息CMD:", JSON.parse(message.toString()));
-            console.log(JSON.parse(message.toString()), "8870");
-            // 处理点位消息
-            let userId = uni.getStorageSync("userId");
-            const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
-            const match = topic.match(noticeMatch);
-            if (!match) return;
-            this.alarmModel = true;
-            const data = JSON.parse(message.toString());
-            this.clientId = data.clientId;
-            this.devName = data.devName;
-            this.sn = data.clientId;
-            this.eventListId = data.eventListId;
-            this.getVoipAuthor(this.clientId, userId);
-            console.log(data, topic, "接收到消息222:");
-            console.log(
-                "接收到消息:",
-                this.clientId,
-                this.devName,
-                this.sn,
-                this.eventListId,
-                data
-            );
-            const now = new Date();
-            const year = now.getFullYear();
-            const month = (now.getMonth() + 1).toString().padStart(2, "0");
-            const day = now.getDate().toString().padStart(2, "0");
-            const hours = now.getHours().toString().padStart(2, "0");
-            const minutes = now.getMinutes().toString().padStart(2, "0");
-            const formattedTime = ${year}-${month}-${day} ${hours}:${minutes};
-            this.nowTime = formattedTime;
-            console.log("isWmpf:", isWmpf);
-            if (!isWmpf) {
-                console.log("isWmpf:", isWmpf);
-                this.getVoipDevices();
-            }
-            console.log("接收到消息:", topic, data);
-        });
-    }, 用这个处理
-ChatGPT 说：
-明白了，你希望把 CMD MQTT 消息 和 DATA MQTT 消息 分开处理，同时对 DATA MQTT 做 点位消息过滤，如果不是当前 clientId 的点位消息就忽略。下面是优化后的 Vue 组件 mounted() 处理示例，结合你原来的逻辑：
-
-mounted() {
-    console.log("开始接受消息", "8870");
-
-    const clientId = this.clientIdProp; // 当前页面或点位标识
-    const userId = uni.getStorageSync("userId");
-
-    // 监听全局 CMD MQTT 消息
-    if (this.$mqttClient) {
-        this.$mqttClient.on("message", (topic, message) => {
-            try {
-                const data = JSON.parse(message.toString());
-                console.log("接收到消息CMD:", data);
-
-                const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
-                const match = topic.match(noticeMatch);
-                if (!match) return; // 不是 CMD 主题，忽略
-
-                // 处理 CMD 消息
-                this.alarmModel = true;
-                this.clientId = data.clientId;
-                this.devName = data.devName;
-                this.sn = data.clientId;
-                this.eventListId = data.eventListId;
-
-                this.getVoipAuthor(this.clientId, userId);
-
-                // 格式化当前时间
-                const now = new Date();
-                const formattedTime = `${now.getFullYear()}-${(now.getMonth()+1).toString().padStart(2,'0')}-${now.getDate().toString().padStart(2,'0')} ${now.getHours().toString().padStart(2,'0')}:${now.getMinutes().toString().padStart(2,'0')}`;
-                this.nowTime = formattedTime;
-
-                // 页面逻辑处理
-                if (!isWmpf) {
-                    this.getVoipDevices();
-                }
-
-                console.log("CMD消息处理完成:", topic, data);
-            } catch (err) {
-                console.error("解析 CMD MQTT 消息失败:", err);
-            }
-        });
-    }
-
-    // 监听 DATA MQTT 消息
-    if (this.mqttData) {
-        this.mqttData.on("message", (topic, message) => {
-            try {
-                const data = JSON.parse(message.toString());
-                console.log("接收到消息DATA:", topic, data);
-
-                // 只处理当前页面 clientId 的点位消息
-                const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-                if (!match || match[1] !== clientId) {
-                    console.log("非本页面点位消息，忽略:", topic);
-                    return;
-                }
-
-                // 调用页面处理函数
-                this.handleMessage(topic, message, clientId);
-
-            } catch (err) {
-                console.error("解析 DATA MQTT 消息失败:", err);
-            }
-        });
-    }
-}
-✅ 优化点
-CMD 和 DATA MQTT 分开处理，逻辑清晰。
-
-DATA MQTT 只处理当前页面的点位消息，其他消息直接忽略。
-
-使用 try/catch 防止消息解析失败导致整个页面报错。
-
-时间格式化逻辑保留在 CMD 消息里。
-
-可以直接调用 this.handleMessage() 处理 DATA 消息。
-
-如果你需要，我可以帮你把 CMD 和 DATA MQTT 消息处理逻辑进一步封装成事件总线，这样页面只订阅事件而不直接操作 MQTT 客户端，代码会更干净、可维护。
-
-你希望我帮你封装吗？
-
-您说：
-TypeError: Cannot read property '1' of null
-    at MqttClient.<anonymous> (deviceDetail.js:1151)
-    at emitThree (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14902)
-    at MqttClient.emit (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14907)
-    at MqttClient._handlePublish (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14353)
-    at MqttClient._handlePacket (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14184)
-    at work (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14176)
-    at Writable.writable._write (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14176)
-    at doWrite (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:15794)
-    at writeOrBuffer (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:15794)
-    at Writable.write (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:15786)(env: Windows,mp,1.06.2504010; lib: 3.0.2)
-ChatGPT 说：
-你这个报错：
-
-TypeError: Cannot read property '1' of null
-一般出现在你调用 topic.match(...) 时，返回了 null，然后直接访问 match[1]。在你的代码里，就是这一段：
-
-const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-if (!match || match[1] !== clientId) {
-    // ...
-}
-this.handleMessage(topic, message, clientId);
-如果 topic.match 返回 null，然后你直接访问 match[1] 就会报错。
-
-原因
-DATA MQTT 发送的消息可能 不符合 /dev/{clientId}/tracker_targets 的正则。
-
-或者 topic 为空或格式错误。
-
-解决方法
-加严格判断 match 是否存在再访问：
-
-const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-if (!match) {
-    console.log("非 tracker_targets 消息，忽略:", topic);
-    return;
-}
-
-// 只处理当前 clientId 的消息
-if (match[1] !== clientId) {
-    console.log("不是当前页面 clientId 消息，忽略:", topic);
-    return;
-}
-
-// 安全调用处理函数
-this.handleMessage(topic, message, clientId);
-或者更简洁写成：
-
-const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/) || [];
-if (match[1] !== clientId) return;
-this.handleMessage(topic, message, clientId);
-✅ 要点：
-
-所有 match 都要先判断是否为 null。
-
-DATA MQTT 可能会发其它主题消息，需要过滤。
-
-CMD MQTT 也一样，正则匹配之前先检查是否 match 为 null。
-
-我可以帮你把你页面里的 CMD + DATA MQTT 消息处理 整合成一个安全版本，保证不会再出现 Cannot read property '1' of null 错误，并且保留原有点位过滤逻辑。
-
-你希望我直接写吗？
-
-您说：
- console.log("topic", topic, message);
-                const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-                if (!match) {
-                    this.$refs.alarmModel.hanOtherMessage(topic, message);
-                    // return;
-                }
-                if (match[1] == clientId) {
-                    this.handleMessage(topic, message, clientId);
-                }  TypeError: Cannot read property '1' of null
-    at MqttClient.<anonymous> (deviceDetail.js:1155)
-    at emitThree (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14902)
-    at MqttClient.emit (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14907)
-    at MqttClient._handlePublish (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14353)
-    at MqttClient._handlePacket (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14184)
-    at work (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14176)
-    at Writable.writable._write (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:14176)
-    at doWrite (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:15794)
-    at writeOrBuffer (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:15794)
-    at Writable.write (vendor.js?t=wechat&s=1757582451702&v=d7553f48816ce18250533caa038ff578:15786)(env: Windows,mp,1.06.2504010; lib: 3.0.2)
-ChatGPT 说：
-明白了，你这次报错原因和之前类似：
-
-const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-if (!match) {
-    this.$refs.alarmModel.hanOtherMessage(topic, message);
-}
-if (match[1] == clientId) {
-    this.handleMessage(topic, message, clientId);
-}
-问题是：当 match === null 的时候，你调用了 match[1]，即使前面 if (!match) 处理了，也会继续往下执行，因为你 没有 return 或 else，所以报了 Cannot read property '1' of null。
-
-安全写法
-console.log("topic", topic, message);
-
-const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-
-if (!match) {
-    // 非 tracker_targets 消息
-    this.$refs.alarmModel.hanOtherMessage(topic, message);
-    return; // 一定要 return，否则下面的 match[1] 会报错
-}
-
-// 只处理当前 clientId 的点位消息
-if (match[1] === clientId) {
-    this.handleMessage(topic, message, clientId);
-}
-关键点
-match === null 时必须 return 或 else 分支，不能直接访问 match[1]。
-
-DATA MQTT 可能发其它主题消息，要做严格过滤。
-
-这样就不会再报 Cannot read property '1' of null。
-
-如果你希望，我可以帮你把 CMD + DATA MQTT 的消息处理 都改成 安全统一版本，同时支持 非点位消息交给 alarmModel 处理，避免每次都写重复判断。
-
-你希望我帮你改吗？
-
-您说：
-帮我改
-ChatGPT 说：
-好的，我帮你把 CMD + DATA MQTT 消息处理改成一个 安全统一版本，保证：
-
-DATA MQTT 只处理当前页面 clientId 的点位消息，其它消息交给 alarmModel.hanOtherMessage 处理。
-
-CMD MQTT 只处理 /mps/wx_{userId}/notice 的消息。
-
-避免 match[1] of null 报错。
-
-包含日志输出，方便调试。
-
-Vue 页面 mounted() 示例
-mounted() {
-    console.log("开始接受 MQTT 消息");
-
-    const clientId = this.clientIdProp; // 当前页面点位标识
-    const userId = uni.getStorageSync("userId");
-
-    // ------------------ CMD MQTT 消息 ------------------
-    if (this.$mqttClient) {
-        this.$mqttClient.on("message", (topic, message) => {
-            try {
-                const data = JSON.parse(message.toString());
-                console.log("CMD MQTT 消息:", topic, data);
-
-                const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
-                const match = topic.match(noticeMatch);
-
-                if (!match) {
-                    console.log("非 CMD 主题消息，忽略:", topic);
-                    return;
-                }
-
-                // 处理 CMD 消息
-                this.alarmModel = true;
-                this.clientId = data.clientId;
-                this.devName = data.devName;
-                this.sn = data.clientId;
-                this.eventListId = data.eventListId;
-
-                this.getVoipAuthor(this.clientId, userId);
-
-                // 格式化时间
-                const now = new Date();
-                this.nowTime = `${now.getFullYear()}-${(now.getMonth()+1).toString().padStart(2,'0')}-${now.getDate().toString().padStart(2,'0')} ${now.getHours().toString().padStart(2,'0')}:${now.getMinutes().toString().padStart(2,'0')}`;
-
-                if (!isWmpf) this.getVoipDevices();
-
-            } catch (err) {
-                console.error("解析 CMD MQTT 消息失败:", err);
-            }
-        });
-    }
-
-    // ------------------ DATA MQTT 消息 ------------------
-    if (this.mqttData) {
-        this.mqttData.on("message", (topic, message) => {
-            try {
-                console.log("DATA MQTT 消息:", topic, message.toString());
-                const data = JSON.parse(message.toString());
-
-                const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-                
-                if (!match) {
-                    // 非点位消息交给 alarmModel 处理
-                    if (this.$refs.alarmModel && this.$refs.alarmModel.hanOtherMessage) {
-                        this.$refs.alarmModel.hanOtherMessage(topic, message);
-                    }
-                    return;
-                }
-
-                // 只处理当前页面 clientId 的点位消息
-                if (match[1] === clientId) {
-                    this.handleMessage(topic, message, clientId);
-                } else {
-                    console.log("不是当前页面 clientId 的点位消息，忽略:", topic);
-                }
-
-            } catch (err) {
-                console.error("解析 DATA MQTT 消息失败:", err);
-            }
-        });
-    }
-}
-✅ 优化点
-严格判断 match 是否为 null，避免报错。
-
-DATA MQTT 非当前点位消息统一交给 alarmModel 处理。
-
-CMD MQTT 消息只处理 /mps/wx_{userId}/notice 主题。
-
-加了完整日志输出，方便调试。
-
-我可以帮你进一步把 CMD + DATA MQTT 消息统一封装成一个事件分发总线，页面只需订阅事件就能收到消息，无需直接操作 MQTT 客户端，这样以后页面更干净。
-
-你希望我帮你做这个封装吗？
-
-您说：
- console.log("topic", topic, message);
-                const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-
-                const noticeMatch = /^\/mps\/wx_(.+)\/notice$/;
-                const matchTwo = topic.match(noticeMatch);
-
-                if (!match) {
-                    this.$refs.alarmModel.hanOtherMessage(topic, message);
-                    // return;
-                }
-                if (match[1] == clientId) {
-                    this.handleMessage(topic, message, clientId);
-                }重新改一下
-ChatGPT 说：
-明白，你希望把 DATA MQTT 和 CMD MQTT 的匹配都放在同一个地方，同时保证 不会访问 match[1] 出错。这里给你改成一个安全、统一的写法：
-
-console.log("topic", topic, message);
-
-// DATA MQTT 点位消息匹配
-const dataMatch = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-
-// CMD MQTT 消息匹配
-const cmdMatch = topic.match(/^\/mps\/wx_(.+)\/notice$/);
-
-// 处理 DATA MQTT 消息
-if (dataMatch) {
-    // 只处理当前页面 clientId 的点位消息
-    if (dataMatch[1] === clientId) {
-        this.handleMessage(topic, message, clientId);
-    } else {
-        console.log("非本页面 clientId 的点位消息，忽略:", topic);
-    }
-} else if (cmdMatch) {
-    // 处理 CMD 消息
-    const data = JSON.parse(message.toString());
-    this.alarmModel = true;
-    this.clientId = data.clientId;
-    this.devName = data.devName;
-    this.sn = data.clientId;
-    this.eventListId = data.eventListId;
-    this.getVoipAuthor(this.clientId, uni.getStorageSync("userId"));
-
-    console.log("CMD 消息处理完成:", topic, data);
-} else {
-    // 其它消息交给 alarmModel 处理
-    if (this.$refs.alarmModel && this.$refs.alarmModel.hanOtherMessage) {
-        this.$refs.alarmModel.hanOtherMessage(topic, message);
-    }
-}
-✅ 优化点：
-严格判断 match 是否存在，避免访问 match[1] 报错。
-
-DATA MQTT 只处理 当前 clientId 的点位消息。
-
-CMD MQTT 匹配 /mps/wx_{userId}/notice 主题。
-
-其它不匹配的消息统一交给 alarmModel.hanOtherMessage。
-
-日志清晰，方便调试。
-
-如果你需要，我可以帮你把 整个页面 mounted() 的 MQTT 订阅逻辑 完整改成这个安全版本，一次性处理 CMD + DATA + 非点位消息。
-
-你希望我直接帮你改吗？
-
-您说：
-
- error  in ./src/main.js
-
-Syntax Error: TypeError: Cannot read properties of undefined (reading 'buildError')
-
-ChatGPT 说：
-你这个报错：
-
-error  in ./src/main.js
-
-Syntax Error: TypeError: Cannot read properties of undefined (reading 'buildError')
-说明 Webpack / Babel 在编译 main.js 的时候直接挂掉，而不是运行时错误。通常有以下几个可能原因：
-
-🔎 常见原因
-语法错误
-
-少了大括号、括号或逗号。
-
-import/export 写错。
-
-在 main.js 里直接写了不合法的 JavaScript。
-
-插件/loader 问题
-
-你项目里用到的 vue-loader、babel-loader 或者 @babel/core 版本不兼容。
-
-比如某些语法（??, ?., ES2022特性）不支持。
-
-main.js 引入文件报错
-
-如果你在 main.js 里 import { createMqttClient } from './utils/globalMqtt'，但是 globalMqtt.js 里面导出方式不对，就可能触发这个错误。
-
-✅ 建议排查步骤
-先定位是哪一行 main.js 报错
-在终端完整错误信息里应该有 line number，看看是第几行。
-
-检查 import/export
-确认 globalMqtt.js 里是这样导出的：
-
-export function createMqttClient(options) {
-    // ...
-}
-而不是 module.exports = {...}，否则 import { createMqttClient } 会是 undefined。
-
-尝试改成默认导出
-如果你只导出一个函数，可以写：
-
-// globalMqtt.js
-export default function createMqttClient(options) {
-    // ...
-}
-然后在 main.js 里：
-
-import createMqttClient from './utils/globalMqtt'
-看一下 Node 版本和 Babel
-
-Node 版本建议 >=16。
-
-Babel 插件里要有 @babel/plugin-proposal-optional-chaining 等。
-
-⚡我建议你把 main.js 和 utils/globalMqtt.js 的代码贴给我，我能帮你直接改成不会触发 buildError 的版本。
-
-要不要你把这两个文件贴出来？
-
-您说：
-import Vue from 'vue'
-import App from './App'
-import './uni.promisify.adaptor'
-// import {
-//     createMqttClient
-// } from "./utils/globalMqtt";
-
-import { createMqttClient, mqttClientData } from './utils/globalMqtt';
-
-
-import {
-    http
-} from "./components/js_sdk/index";
-
-import alarModel from "./components/component/alarModel.vue";
-import tenMinutes from './components/component/tenMinutes.vue';
-
-Vue.component('alarModel', alarModel);
-Vue.component('tenMinutes', tenMinutes);
-
-Vue.prototype.$http = http;
-
-// 挂载mqtt
-const mqttClient = createMqttClient();
-Vue.prototype.$mqttClient = mqttClient;
-// 挂载data连接
-const mqttClientData = mqttClientData();
-Vue.prototype.$mqttClientData = mqttClientData;
-
-// 挂载处理时间的方法
-function timestampToTime(value, type = 0) {
-    var time = new Date(value);
-    var year = time.getFullYear();
-    var month = time.getMonth() + 1;
-    var date = time.getDate();
-    var hour = time.getHours();
-    var minute = time.getMinutes();
-    var second = time.getSeconds();
-
-    // 补零
-    month = month < 10 ? "0" + month : month;
-    date = date < 10 ? "0" + date : date;
-    hour = hour < 10 ? "0" + hour : hour;
-    minute = minute < 10 ? "0" + minute : minute;
-    second = second < 10 ? "0" + second : second;
-
-    var arr = [
-        year + "-" + month + "-" + date,
-        year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second,
-        year + "年" + month + "月" + date + "日",
-        year + "年" + month + "月" + date + " " + hour + ":" + minute + ":" + second,
-        hour + ":" + minute + ":" + second,
-        year + "-" + month + "-" + date + " " + hour + ":" + minute,
-        month + "月" + date + "日" + hour + ":" + minute,
-    ]
-    return arr[type];
-}
-
-Vue.prototype.$time = timestampToTime;
-
-
-Vue.config.productionTip = false;
-if (__wxConfig.envVersion == 'develop') {
-    Vue.prototype.uploadimg = 'https://api.radar-power.asia:4443';
-
-}
-if (__wxConfig.envVersion == 'trial') {
-    Vue.prototype.upload = 'https://api.radar-power.asia:4443';
-}
-if (__wxConfig.envVersion == 'release') {
-    Vue.prototype.uploadimg = 'https://api.radar-power.asia:4443';
-}
-App.mpType = "app";
-
-const app = new Vue({
-    ...App,
-});
-app.$mount();
-ChatGPT 说：
-👌 明白了，你这里 main.js 出问题的关键在这一段：
-
-import { createMqttClient, mqttClientData } from './utils/globalMqtt';
-
-// ...
-const mqttClient = createMqttClient();
-Vue.prototype.$mqttClient = mqttClient;
-
-// ❌ 这里错了
-const mqttClientData = mqttClientData();
-Vue.prototype.$mqttClientData = mqttClientData;
-问题点
-你 同时用 import 导入了 mqttClientData，又在下面 const mqttClientData = mqttClientData(); 重新声明了一个同名常量。
-这样等于你在 main.js 里写了 自己调用自己，导致编译报错。
-
-JS 引擎在编译时会直接崩掉，Webpack 就报了：
-
-TypeError: Cannot read properties of undefined (reading 'buildError')
-✅ 修复方法
-要么你在 globalMqtt.js 里导出一个函数，要么导出一个实例。建议你分清楚：
-
-如果你想导出两个函数：
-// globalMqtt.js
-export function createMqttClient() {
-    // ...
-}
-export function createMqttClientData() {
-    // ...
-}
-然后在 main.js：
-
-import { createMqttClient, createMqttClientData } from './utils/globalMqtt';
-
-const mqttClient = createMqttClient();
-Vue.prototype.$mqttClient = mqttClient;
-
-const mqttClientData = createMqttClientData();
-Vue.prototype.$mqttClientData = mqttClientData;
-如果你只想导出一个对象：
-// globalMqtt.js
-export const mqttClientData = createMqttClient(); 
-那 main.js 就直接用：
-
-import { createMqttClient, mqttClientData } from './utils/globalMqtt';
-
-Vue.prototype.$mqttClient = createMqttClient();
-Vue.prototype.$mqttClientData = mqttClientData; // 直接用，不要再执行函数
-⚡ 现在你的 main.js 报错就是 变量命名冲突。
-要么改 import { mqttClientData } → import { createMqttClientData }，
-要么把下面的 const mqttClientData = mqttClientData(); 删除。
-
-要不要我帮你把 globalMqtt.js 的导出和 main.js 的调用方式改成一套标准的？这样不会再冲突。
-
-您说：
-import { createMqttClient, mqttClientData } from './utils/globalMqtt';帮我改一下这个错误
-ChatGPT 说：
-👌 那我帮你直接改成标准写法。
-你的 globalMqtt.js 里面应该是导出了一个函数 createMqttClient，但是 mqttClientData 你现在是写错的。
-
-改法一（推荐：两个函数形式）
-globalMqtt.js
-// utils/globalMqtt.js
-export function createMqttClient() {
-    // 创建第一个 MQTT 连接
-    // ...
-}
-
-export function createMqttClientData() {
-    // 创建第二个 MQTT 连接（专门用来收数据）
-    // ...
-}
-main.js
-import Vue from 'vue'
-import App from './App'
-import './uni.promisify.adaptor'
-
-import { createMqttClient, createMqttClientData } from './utils/globalMqtt'
-
-// 挂载全局 MQTT
-const mqttClient = createMqttClient()
-Vue.prototype.$mqttClient = mqttClient
-
-// 挂载数据 MQTT
-const mqttClientData = createMqttClientData()
-Vue.prototype.$mqttClientData = mqttClientData
-改法二（如果 mqttClientData 本身就是一个实例）
-globalMqtt.js
-export function createMqttClient() {
-    // ...
-}
-
-export const mqttClientData = createMqttClient(); // 直接导出一个实例
-main.js
-import Vue from 'vue'
-import App from './App'
-import './uni.promisify.adaptor'
-
-import { createMqttClient, mqttClientData } from './utils/globalMqtt'
-
-// 挂载全局 MQTT
-Vue.prototype.$mqttClient = createMqttClient()
-
-// 直接用导出的实例
-Vue.prototype.$mqttClientData = mqttClientData
-⚡ 你现在的错误就是因为写了：
-
-const mqttClientData = mqttClientData();
-等于调用了自己，直接崩。
-
-要么你在 globalMqtt.js 里导出一个 函数 createMqttClientData，要么导出一个 实例 mqttClientData，再根据上面两种写法改。
-
-👉 你 globalMqtt.js 里面现在是导出函数，还是直接导出对象？我可以帮你改成最合适的版本。
-
-您说：
-[worker] reportRealtimeAction:fail not support
-ChatGPT 说：
-这个报错：
-
-[worker] reportRealtimeAction:fail not support
-其实不是你的代码逻辑错了，而是 微信小程序运行环境 输出的一个提示信息。📢
-
-产生原因
-reportRealtimeAction 是 微信小游戏 / 部分小游戏 SDK 里用到的 API。
-
-你现在是在 小程序环境（非小游戏），所以它会提示 not support，但是不会影响正常功能。
-
-一般是在使用 WebSocket / MQTT、canvas 或某些第三方库的时候触发，因为这些库里有兼容小游戏的逻辑。
-
-怎么处理
-可以忽略
-这个报错不会影响小程序的 MQTT/WebSocket 正常运行，只是控制台打印，看着闹心而已。
-
-关闭调试面板打印
-在微信开发者工具 → 设置 → 项目设置 → 关闭“显示不支持的 API 提示”。
-
-条件判断屏蔽（如果用到相关 API）
-
-if (wx.reportRealtimeAction) {
-    wx.reportRealtimeAction({ /* ... */ })
-}
-⚡ 总结：
-这个不是你 mqtt 代码的问题，不会影响连接和消息处理，属于微信开发工具的提示，可以直接忽略。
-
-要不要我帮你把 MQTT 代码里可能触发 reportRealtimeAction 的地方定位出来？
-
-这个提示：
-
-[worker] reportRealtimeAction:fail not support
-不是你代码写错了，而是 微信开发者工具 / 小程序运行环境自己打印的提示。
-
-✅ 原因
-reportRealtimeAction 是 小游戏相关 API。
-
-你现在运行在 小程序 环境里，这个 API 根本不支持，所以就报 not support。
-
-常见于引入 WebSocket/MQTT、canvas、第三方库 的时候，库里面做了小游戏兼容，就会触发这个提示。
-
-✅ 解决办法
-直接忽略
-它不会影响 MQTT/WebSocket 正常连接，只是个提示。
-
-关闭提示
-在微信开发者工具 → 设置 → 项目设置 → 把 “显示不支持的 API 提示” 关掉。
-
-防御性写法（如果你代码里真的用到了）：
-
-if (wx.reportRealtimeAction) {
-    wx.reportRealtimeAction({ ... })
-}
-👉 所以，这个提示 不需要改你的 MQTT 代码，也不会影响运行。
-要不要我帮你扫一下你的 mqtt 相关文件，看看是不是里面引用了小游戏的 API？
-
-这个
-
-[worker] reportRealtimeAction:fail not support
-其实不是你写的代码报错，而是 微信小程序运行环境在控制台给的提示。
-
-为什么会出现？
-reportRealtimeAction 是 小游戏 API，在小程序里压根不支持。
-
-有些库（比如 mqtt.js、ws 兼容层、canvas 库）会尝试调用它，于是小程序环境就提示 not support。
-
-不会影响 MQTT/WebSocket 正常使用。
-
-怎么处理？
-忽略它：只是提示，不影响功能。
-
-关闭提示：微信开发者工具 → 设置 → 项目设置 → 关掉“显示不支持的 API 提示”。
-
-加兼容判断（如果是你代码里用到的 API）：
-
-if (wx.reportRealtimeAction) {
-    wx.reportRealtimeAction({ ... })
-}
-⚡结论：这个报错 不用改你的 MQTT 代码，它不会影响连接和消息接收。
-
-要不要我帮你在 `
-
-您说：
-<script>
-import * as echarts from "../../uni_modules/lime-echart/static/echarts.min";
-import mqtt from "../../utils/mqtt";
-// import { createMqttData } from "../../utils/globalMqtt";
-import { createMqttData } from "../../utils/globalMqtt";
-
-export default {
-    data() {
-        return {
-            clientId: "",
-            width: 0, //检测区域宽度
-            length: 0, //检测区域长度
-            xOffset: 0,
-            yOffset: 0,
-            devInfo: "",
-            actionName: "",
-            startDate: "",
-            endDate: "",
-            softWare: "",
-            statusLight: 0,
-            currentDate: new Date().getTime(),
-            lnbAction: "action8",
-            wsj: false,
-            todayWcTimes: "",
-            stayDetail: "",
-            todayDate: "",
-            dev_id: "",
-            nowTime: "",
-            devName: "",
-            devType: "",
-            localPhone: uni.getStorageSync("phone"),
-            startArr: [],
-            freQuenceList: [],
-            // mqtt相关
-            currentIndex: 0,
-            modules: [],
-            autoPlayinterval: "",
-            choiceVisible: "",
-            // 手机号分享授权模块
-            shareModel: false,
-            alarmModel: false,
-            sharedPhone: "",
-            messageFlag: true,
-            serviceNumberFlag: true,
-            voipFlag: true,
-            // mqtt模块
-            targetPoints: {},
-            inactivityTimer: null,
-            left: 0,
-            top: 0,
-            clientIdProp: null,
-            breathRate: "",
-            breathShow: false,
-            breathRpmList: [],
-            option: {
-                title: [
-                    {
-                        text: "呼吸率曲线",
-                        left: "center",
-                        top: 20,
-                        textStyle: { fontSize: 14 },
-                    },
-                    {
-                        text: "BPM: 0 次/分钟",
-                        left: "center",
-                        top: 50,
-                        textStyle: { fontSize: 12, color: "#805246" },
-                    },
-                    {
-                        text: "时间 (秒)",
-                        left: "right",
-                        top: "bottom",
-                        textStyle: { fontSize: 12, color: "#888888" },
-                    },
-                ],
-                grid: { left: 60, right: 20, top: 80, bottom: 50 },
-                xAxis: {
-                    type: "category",
-                    data: Array.from({ length: 60 }, (_, i) => i + 1),
-                    boundaryGap: false,
-                    splitLine: { show: false },
-                },
-                yAxis: {
-                    type: "value",
-                    min: 0,
-                    max: 40,
-                    name: "呼吸率（次）",
-                    nameLocation: "end",
-                    nameGap: 20,
-                    nameTextStyle: { fontSize: 12, color: "#888888" },
-                    splitLine: { show: true },
-                },
-                series: [
-                    {
-                        type: "line",
-                        smooth: true,
-                        symbol: "none",
-                        lineStyle: { color: "#805246", width: 2 },
-                        data: Array(60).fill(0),
-                    },
-                ],
-                animation: true,
-                animationDuration: 100,
-            },
-            index: 0,
-            loopTimer: null,
-            mqttClienTwoFlag: false,
-            mqttClientOne: false,
-            mqttData: null,
-            showModle: false,
-        };
-    },
-    computed: {},
-
-    methods: {
-        getdevInfo(devId) {
-            this.$http
-                .get(wap/device/queryDeviceInfoById, {
-                    devId: devId,
-                })
-                .then((res) => {
-                    if (res.data.data) {
-                        this.devInfo = res.data.data;
-                        this.devType = this.devInfo.devType;
-
-                        this.width =
-                            Math.abs(
-                                this.devInfo.yyEnd - this.devInfo.yyStart
-                            ) * 100;
-                        this.length =
-                            Math.abs(
-                                this.devInfo.xxEnd - this.devInfo.xxStart
-                            ) * 100;
-                        this.xOffset =
-                            (this.devInfo.xxStart + this.devInfo.xxEnd) * 50;
-                        this.yOffset =
-                            -(this.devInfo.yyStart + this.devInfo.yyEnd) * 50;
-                        this.statusLight = this.devInfo.statusLight;
-                    }
-                })
-
-                .catch((err) => {});
-        },
-        getdevRoomInfo(devId) {
-            this.$http
-                .get(wap/room/readRoom, {
-                    devId: devId,
-                })
-                .then((res) => {
-                    if (res.data.data) {
-                        this.modules = res.data.data.furnitures;
-                    }
-                });
-        },
-        handleLightChange(e) {
-            let newValue = e.detail.value == true ? 1 : 0;
-            this.$http
-                .post(wap/device/statusLight, {
-                    statusLight: newValue,
-                    devId: this.devInfo.devId,
-                })
-                .then((res) => {
-                    if (res.data.code == 200) {
-                        uni.showToast({
-                            title: "操作成功",
-                            icon: "success",
-                        });
-                        this.statusLight = newValue;
-                    } else {
-                        wx.showToast({
-                            title: res.data.message,
-                            icon: "none",
-                        });
-                    }
-                });
-        },
-
-        // 分享功能模块
-        shareDevice() {
-            this.choiceVisible = true;
-        },
-        onShareConfirm() {
-            if (!this.sharedPhone) {
-                uni.showModal({
-                    content: "请填写手机号!",
-                    showCancel: false,
-                });
-                return;
-            }
-            let reg_tel =
-                /^(13[0-9]|14[01456879]|15[0-3,5-9]|16[2567]|17[0-8]|18[0-9]|19[0-3,5-9])\d{8}$/;
-            if (!reg_tel.test(this.sharedPhone)) {
-                uni.showModal({
-                    content: "请填写正确手机号!",
-                    showCancel: false,
-                });
-                return;
-            }
-            let shareParam = {
-                sharerUserId: uni.getStorageSync("userId"),
-                devId: this.devInfo.devId,
-                sharerPhone: uni.getStorageSync("phone"),
-                sharedUserId: "",
-                sharedPhone: this.sharedPhone,
-                messageFlag: this.messageFlag == true ? 0 : 1,
-                serviceNumberFlag: this.serviceNumberFlag == true ? 0 : 1,
-                voipFlag: this.voipFlag == true ? 0 : 1,
-            };
-
-            this.$http
-                .post("wap/share/deviceShare", shareParam, {
-                    header: {
-                        "Content-Type": "application/json;charset=UTF-8",
-                    },
-                })
-                .then((res) => {
-                    if (res.data.code == 200) {
-                        uni.showToast({
-                            title: "分享成功",
-                            icon: "success",
-                            duration: 1500,
-                        });
-                    } else {
-                        uni.showToast({
-                            title: res.data.message,
-                            icon: "none",
-                            duration: 1500,
-                        });
-                    }
-                });
-            this.shareModel = false;
-        },
-        closeChoice() {
-            this.choiceVisible = false;
-        },
-        handlePhoneAnalysis() {
-            this.choiceVisible = false;
-            this.shareModel = true;
-        },
-        handleLinkShare() {
-            this.choiceVisible = false;
-            uni.navigateTo({
-                url:
-                    "/pagesA/linkShare/linkShare?devInfo=" +
-                    JSON.stringify(this.devInfo),
-            });
-        },
-        smChange() {
-            this.messageFlag = !this.messageFlag;
-        },
-        snChange() {
-            this.serviceNumberFlag = !this.serviceNumberFlag;
-        },
-        vfChange() {
-            this.voipFlag = !this.voipFlag;
-        },
-        gotoSetting() {
-            if (this.devInfo.online == 0) {
-                uni.showToast({
-                    title: "离线设备不支持设置",
-                    icon: "none",
-                });
-                return;
-            }
-            uni.navigateTo({
-                url:
-                    "/pagesA/deviceSetting/deviceSetting?devInfo=" +
-                    JSON.stringify(this.devInfo),
-            });
-        },
-        getFrequency(clientId) {
-            this.$http
-                .post(wap/stats/alarmEventsQuery, {
-                    clientId: clientId,
-                    createTimeStart: this.$time(new Date()),
-                    createTimeEnd: this.$time(new Date()),
-                    eventType: 1,
-                })
-                .then((res) => {
-                    if (res.data.code == 200) {
-                        if (res.data.data.rows.length > 0) {
-                            this.freQuenceList = this.parseJsonToObjects(
-                                res.data.data.rows
-                            );
-                        } else {
-                            this.freQuenceList = [];
-                        }
-                    } else {
-                        wx.showToast({
-                            title: res.data.message,
-                            icon: "none",
-                        });
-                    }
-                });
-        },
-        parseJsonToObjects(jsonArray) {
-            return jsonArray.map((item) => {
-                // 解析info字段的JSON字符串
-                let infoData = {};
-                try {
-                    infoData = JSON.parse(item.info);
-                } catch (e) {
-                    console.error("Failed to parse info JSON:", e);
-                }
-
-                return {
-                    id: item.id,
-                    clientId: item.clientId,
-                    tenantId: item.tenantId,
-                    devName: item.devName,
-                    uuid: item.uuid,
-                    planUuid: item.planUuid,
-                    eventType: item.eventType,
-                    info: infoData,
-                    isHandle: item.isHandle,
-                    createTime: item.createTime,
-                    remark: item.remark,
-                };
-            });
-        },
-        // 健康闹钟方法
-        healthAlarm() {
-            uni.navigateTo({
-                url:
-                    "/pagesA/healthAlarm/healthAlarm?devInfo=" +
-                    JSON.stringify(this.devInfo),
-            });
-        },
-        onSwiperChange(event) {
-            const current = event.detail.current;
-            const totalItems = this.freQuenceList.length;
-            if (current === totalItems - 1) {
-                this.autoplay = false;
-            }
-            this.currentIndex = current;
-        },
-
-        autoSwipe() {
-            if (this.freQuenceList && this.freQuenceList.length > 0) {
-                setInterval(() => {
-                    let nextIndex = this.currentIndex + 1;
-                    if (nextIndex >= this.freQuenceList.length) {
-                        nextIndex = 0; // 循环到第一个项目
-                    }
-                    this.currentIndex = nextIndex;
-                }, 3000); // 每3秒自动滚动一次
-            }
-        },
-        discrepancy() {
-            uni.navigateTo({
-                url:
-                    "/pagesA/discrepancy/discrepancy?freQuenceList=" +
-                    JSON.stringify(this.freQuenceList),
-            });
-        },
-        getCurrentDate() {
-            const now = new Date();
-            this.currentDate = ${now.getFullYear()}-${
-                now.getMonth() + 1
-            }月${now.getDate().toString().padStart(2, "0")}日;
-        },
-        receptionChange(val) {
-            this.targetPoints = val;
-        },
-        receptHealth(val) {
-            this.breathRate = val;
-            this.setEcharts(val);
-        },
-
-        // echarts图表模块
-
-        getOption(list) {
-            // 固定 X 轴 [0 ~ 60]
-            const xData = Array.from({ length: 61 }, (_, i) => i);
-            const recent = list.slice(-61);
-            const data = new Array(61).fill(null);
-            for (let i = 0; i < recent.length; i++) {
-                data[i] = recent[i];
-            }
-
-            return {
-                title: [
-                    { text: "呼吸率曲线", left: "center", top: 20 },
-                    {
-                        text: BPM: ${recent[recent.length - 1] || 0} 次/分钟,
-                        left: "center",
-                        top: 50,
-                        textStyle: { fontSize: 12, color: "#805246" },
-                    },
-                    {
-                        text: "时间 (秒)",
-                        left: "right",
-                        top: "bottom",
-                        textStyle: {
-                            fontSize: 10,
-                            color: "#888888",
-                            fontWeight: "normal",
-                        },
-                    },
-                ],
-                grid: { left: 60, right: 20, top: 80, bottom: 50 },
-                xAxis: {
-                    type: "category",
-                    data: xData,
-                    boundaryGap: false,
-                },
-                yAxis: {
-                    type: "value",
-                    min: 0,
-                    max: 40,
-                    name: "呼吸率（次）",
-                    nameLocation: "end",
-                    nameGap: 20,
-                    nameTextStyle: {
-                        fontSize: 10,
-                        color: "#888888",
-                        fontWeight: "normal",
-                    },
-                    splitLine: { show: true },
-                },
-                series: [
-                    {
-                        type: "line",
-                        smooth: true,
-                        symbol: "none",
-                        data: data,
-                        showSymbol: false,
-                        lineStyle: { color: "#7a4e42", width: 2 },
-                    },
-                ],
-            };
-        },
-
-        getFrenEcharts() {
-            if (this.breathRate === "" || this.breathRate === null) {
-                uni.showToast({
-                    title: "暂无呼吸率",
-                    icon: "none",
-                    duration: 1500,
-                });
-                return;
-            }
-            this.breathShow = true;
-            this.$nextTick(() => {
-                this.initChart();
-            });
-        },
-        initChart() {
-            if (!this.$refs.chartRef) return;
-            if (this.chartInstance) {
-                this.chartInstance.dispose();
-                this.chartInstance = null;
-            }
-            this.$refs.chartRef.init(echarts, (chart) => {
-                this.chartInstance = chart;
-                chart.setOption(this.option, true);
-            });
-        },
-        setEcharts(val) {
-            if (!Array.isArray(this.breathRpmList)) {
-                this.breathRpmList = [];
-            }
-            this.breathRpmList.push(val);
-            if (!this.chartInstance) return;
-            const option = this.getOption(this.breathRpmList);
-            this.chartInstance.setOption(option, { notMerge: true });
-        },
-        saveBreath() {
-            const chart = this.$refs.chartRef;
-            if (!chart) {
-                uni.showToast({ title: "图表未渲染", icon: "none" });
-                return;
-            }
-            chart.canvasToTempFilePath({
-                success: (res) => {
-                    uni.saveImageToPhotosAlbum({
-                        filePath: res.tempFilePath,
-                        success: () => {
-                            uni.showToast({
-                                title: "保存成功",
-                                icon: "success",
-                            });
-                        },
-                        fail: (err) => {
-                            uni.showToast({
-                                title: "保存失败",
-                                icon: "none",
-                            });
-                        },
-                    });
-                },
-                fail: (err) => {
-                    uni.showToast({
-                        title: "导出失败",
-                        icon: "none",
-                    });
-                },
-            });
-        },
-
-        handleMessage(topic, message, clientId) {
-            // 清除不活动定时器
-            clearTimeout(this.inactivityTimer);
-            this.inactivityTimer = setTimeout(() => {
-                this.targetPoints = {};
-            }, 1500);
-            // 验证topic格式
-            const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-            if (!match || match[1] !== clientId) return;
-
-            try {
-                const data = JSON.parse(message.toString());
-                if (data.health) {
-                    if (
-                        data.health.breath_rpm ||
-                        data.health.breath_rpm === 0
-                    ) {
-                        this.receptHealth(Math.floor(data.health.breath_rpm));
-                    } else {
-                    }
-                }
-                this.processTrackerData(data.tracker_targets);
-                // console.log(data.tracker_targets, "MQTT消息解析成功22222");
-            } catch (e) {
-                console.error("MQTT消息解析失败", e);
-            }
-        },
-
-        processTrackerData(arr) {
-            if (Array.isArray(arr) && arr.length > 0 && Array.isArray(arr[0])) {
-                this.targetPoints = {};
-                const currentIds = new Set();
-                const newTargetPoints = {};
-                // 处理每个追踪目标
-                arr.forEach((item) => {
-                    if (!Array.isArray(item) || item.length < 4) return;
-
-                    const [x, y, z, id] = item;
-                    currentIds.add(id.toString());
-
-                    // 处理新点或更新现有点
-                    if (!this.targetPoints[id]) {
-                        newTargetPoints[id] = this.createNewTargetPoint(
-                            x,
-                            y,
-                            z,
-                            id
-                        );
-                    } else {
-                        newTargetPoints[id] = this.updateExistingTargetPoint(
-                            this.targetPoints[id],
-                            x,
-                            y,
-                            z,
-                            2
-                        );
-                    }
-                });
-
-                // 移除不存在的点
-                Object.keys(this.targetPoints).forEach((id) => {
-                    if (!currentIds.has(id)) {
-                        delete this.targetPoints[id];
-                    }
-                });
-
-                // 更新目标点
-                this.targetPoints = {
-                    ...this.targetPoints,
-                    ...newTargetPoints,
-                };
-                if (Array.isArray(this.targetPoints)) {
-                    this.targetPoints = this.targetPoints.filter(
-                        (item) => item !== null && item !== undefined
-                    );
-                }
-            }
-        },
-        createNewTargetPoint(x, y, z, id) {
-            return {
-                x,
-                y,
-                z,
-                id,
-                displayX: x,
-                displayY: y,
-                lastX: x,
-                lastY: y,
-            };
-        },
-        updateExistingTargetPoint(existingPoint, x, y, z, THRESHOLD) {
-            const dx = x - existingPoint.lastX;
-            const dy = y - existingPoint.lastY;
-            const distance = Math.sqrt(dx * dx + dy * dy);
-
-            if (distance > THRESHOLD) {
-                return {
-                    ...existingPoint,
-                    x,
-                    y,
-                    z,
-                    lastX: x,
-                    lastY: y,
-                    displayX: x,
-                    displayY: y,
-                };
-            }
-
-            return existingPoint;
-        },
-
-        closemqtTwo() {
-            this.mqttClienTwoFlag = false;
-            if (this.mqttClientOne) {
-                this.mqttClientOne.end();
-                this.mqttClientOne = null;
-            }
-        },
-    },
-    onShow() {
-        //   mqttClientData.subscribe(/dev/${clientIdProp}/tracker_targets, (err) => {
-        //         if (err) console.error("DATA MQTT 订阅失败", err);
-        //         else console.log(DATA MQTT 订阅成功: /dev/${clientIdProp}/tracker_targets);
-        //     });
-        //     mqttClientData.unsubscribe(/dev/${clientIdProp}/tracker_targets, (err) => {
-        //         if (err) console.error("DATA MQTT 取消订阅失败", err);
-        //         else console.log(DATA MQTT 取消订阅成功: /dev/${clientIdProp}/tracker_targets);
-        //     });
-
-        this.clientId = uni.getStorageSync("clientIDetail");
-        console.log(this.clientId, "clientId");
-        this.todayDate = this.$time(new Date(), 2);
-        this.showModle = true;
-
-        this.$mqttClientData.subscribe(
-            /dev/${this.clientId}/tracker_targets,
-            (err) => {
-                if (err) {
-                    console.error("订阅失败", err);
-                } else {
-                    console.log(
-                        成功订阅设备主题:/dev/${this.clientId}/tracker_targets
-                    );
-                }
-            }
-        );
-        this.$mqttClientData.on("message", (topic, message) => {
-            console.log(topic, 7777);
-            const dataMatch = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-            const cmdMatch = topic.match(/^\/mps\/wx_(.+)\/notice$/);
-            if (dataMatch) {
-                if (dataMatch[1] === this.clientId) {
-                    this.handleMessage(topic, message, this.clientId);
-                } else {
-                    console.log("非本页面 clientId 的点位消息，忽略:", topic);
-                }
-            } else if (cmdMatch) {
-                this.$refs.alarmModel.hanOtherMessage(topic, message);
-            }
-        });
-
-        // this.mqttData = createMqttData(this.clientId);
-        // if (this.mqttData) {
-        //     this.mqttData.on("message", (topic, message) => {
-        //         console.log("topicDeviceDetail", topic, message);
-        //         const dataMatch = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-        //         const cmdMatch = topic.match(/^\/mps\/wx_(.+)\/notice$/);
-        //         if (dataMatch) {
-        //             if (dataMatch[1] === this.clientId) {
-        //                 this.handleMessage(topic, message, this.clientId);
-        //             } else {
-        //                 console.log(
-        //                     "非本页面 clientId 的点位消息，忽略:",
-        //                     topic
-        //                 );
-        //             }
-        //         } else if (cmdMatch) {
-        //             this.$refs.alarmModel.hanOtherMessage(topic, message);
-        //         }
-        //     });
-        // }
-    },
-    onLoad(options) {
-        const devItem = JSON.parse(options.devItem);
-        const { devId, clientId } = devItem;
-
-        this.getFrequency(clientId);
-        this.getdevInfo(devId);
-        this.getdevRoomInfo(devId);
-        this.autoPlayinterval = setTimeout(() => {
-            this.autoSwipe();
-        }, 3000);
-        this.getCurrentDate();
-    },
-    onUnload() {
-        this.inactivityTimer = null;
-        this.autoPlayinterval = null;
-        this.showModle = false;
-        uni.setStorageSync("clientIDetail", null);
-        // if (this.mqttData) {
-        //     this.mqttData.end();
-        //     this.mqttData = null;
-        //     console.log("页面 DATA MQTT 已断开");
-        // }
-        this.$mqttClientData.unsubscribe(
-            /dev/${this.clientId}/tracker_targets,
-            (err) => {
-                if (err) console.error("DATA MQTT 取消订阅失败", err);
-                else
-                    console.log(
-                        DATA MQTT 取消订阅成功: /dev/${this.clientId}/tracker_targets
-                    );
-            }
-        );
-    },
-    onHide() {
-        console.log("onHide");
-        this.inactivityTimer = null;
-        this.autoPlayinterval = null;
-        this.showModle = false;
-        uni.setStorageSync("clientIDetail", null);
-        this.$mqttClientData.unsubscribe(
-            /dev/${this.clientId}/tracker_targets,
-            (err) => {
-                if (err) console.error("DATA MQTT 取消订阅失败", err);
-                else
-                    console.log(
-                        DATA MQTT 取消订阅成功: /dev/${this.clientId}/tracker_targets
-                    );
-            }
-        );
-    },
-};
-</script>看一下这个代码，修改这个逻辑
-ChatGPT 说：
-我看了一遍你的代码，主要问题在 MQTT 订阅和消息处理逻辑。目前你的写法有几个隐患：
-
-onShow 里面直接绑定了 this.$mqttClientData.on("message", ...)，每次进入页面都会重新注册监听器，如果用户多次进入退出，就会重复触发。
-
-unsubscribe 虽然写了，但 message 监听器没有解绑，还是会被触发。
-
-你在 onShow 和 onLoad 都写了和 MQTT 有关的逻辑，容易混乱。
-
-🔧 建议修改逻辑
-在 onLoad 初始化数据，不做订阅。
-
-在 onShow 订阅并绑定 message 监听器。
-
-在 onHide / onUnload 里取消订阅 + 移除监听器。
-
-改造后的代码核心部分（只改 MQTT 相关）
-export default {
-    data() {
-        return {
-            clientId: "",
-            ...
-            mqttMessageHandler: null, // 存放回调，方便解绑
-        };
-    },
-
-    methods: {
-        handleMqttMessage(topic, message) {
-            console.log("收到MQTT消息:", topic);
-
-            const dataMatch = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-            const cmdMatch = topic.match(/^\/mps\/wx_(.+)\/notice$/);
-
-            if (dataMatch) {
-                if (dataMatch[1] === this.clientId) {
-                    this.handleMessage(topic, message, this.clientId);
-                } else {
-                    console.log("忽略非本设备的点位消息:", topic);
-                }
-            } else if (cmdMatch) {
-                this.$refs.alarmModel.hanOtherMessage(topic, message);
-            }
-        },
-    },
-
-    onShow() {
-        this.clientId = uni.getStorageSync("clientIDetail");
-        console.log("进入页面 clientId=", this.clientId);
-
-        if (!this.clientId) return;
-
-        // 订阅
-        this.$mqttClientData.subscribe(
-            `/dev/${this.clientId}/tracker_targets`,
-            (err) => {
-                if (err) {
-                    console.error("订阅失败", err);
-                } else {
-                    console.log(`成功订阅: /dev/${this.clientId}/tracker_targets`);
-                }
-            }
-        );
-
-        // 保存回调，方便后面解绑
-        this.mqttMessageHandler = (topic, message) => {
-            this.handleMqttMessage(topic, message);
-        };
-        this.$mqttClientData.on("message", this.mqttMessageHandler);
-    },
-
-    onHide() {
-        console.log("页面隐藏，取消订阅");
-        if (this.clientId) {
-            this.$mqttClientData.unsubscribe(
-                `/dev/${this.clientId}/tracker_targets`,
-                (err) => {
-                    if (err) console.error("取消订阅失败", err);
-                    else console.log(`取消订阅成功: /dev/${this.clientId}/tracker_targets`);
-                }
-            );
-        }
-        if (this.mqttMessageHandler) {
-            this.$mqttClientData.off("message", this.mqttMessageHandler);
-            this.mqttMessageHandler = null;
-        }
-    },
-
-    onUnload() {
-        console.log("页面卸载，清理MQTT订阅和监听器");
-        this.onHide(); // 直接复用取消订阅逻辑
-        uni.setStorageSync("clientIDetail", null);
-    },
-};
-✅ 改造效果
-每次进入页面只会绑定一次 message 回调，不会堆积。
-
-退出页面（onHide 或 onUnload）时会彻底解绑，避免内存泄漏。
-
-逻辑清晰：
-
-onLoad → 初始化参数/数据
-
-onShow → 开始订阅
-
-onHide/onUnload → 取消订阅 + 移除监听
-
-要不要我帮你把 完整文件替换版 改好，保持和你现在的结构一致（我把 onLoad/onShow/onHide/onUnload 里多余的部分也整理一下）？
-
-您说：
-可以，帮我整理一下
-ChatGPT 说：
-好的 👍 我帮你把 完整页面代码整理好，主要优化了 MQTT 订阅/取消订阅逻辑，避免你之前遇到的 message 重复触发、match 报错等问题。
-
-🔧 完整优化版（deviceDetail.vue / .js）
-export default {
-    data() {
-        return {
-            clientId: "",
-            devName: "",
-            sn: "",
-            eventListId: "",
-            nowTime: "",
-            alarmModel: false,
-            mqttMessageHandler: null, // 存放回调，方便解绑
-        };
-    },
-
-    methods: {
-        // 处理点位消息
-        handleMessage(topic, message, clientId) {
-            try {
-                const data = JSON.parse(message.toString());
-                console.log("点位消息处理:", topic, data, clientId);
-                // TODO: 在这里写你的点位消息逻辑
-            } catch (e) {
-                console.error("解析点位消息失败:", e, message);
-            }
-        },
-
-        // 处理其他消息
-        handleOtherMessage(topic, message) {
-            try {
-                const data = JSON.parse(message.toString());
-                console.log("处理其他消息:", topic, data);
-                this.$refs.alarmModel.hanOtherMessage(topic, data);
-            } catch (e) {
-                console.error("解析其他消息失败:", e, message);
-            }
-        },
-
-        // MQTT 统一消息处理
-        handleMqttMessage(topic, message) {
-            console.log("收到MQTT消息:", topic);
-
-            const trackerMatch = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
-            const noticeMatch = topic.match(/^\/mps\/wx_(.+)\/notice$/);
-
-            if (trackerMatch) {
-                if (trackerMatch[1] === this.clientId) {
-                    this.handleMessage(topic, message, this.clientId);
-                } else {
-                    console.log("忽略非当前设备的点位消息:", topic);
-                }
-            } else if (noticeMatch) {
-                this.handleOtherMessage(topic, message);
-            } else {
-                console.log("未匹配到已知主题:", topic);
-            }
-        },
-    },
-
-    onLoad() {
-        // 初始化 clientId
-        this.clientId = uni.getStorageSync("clientIDetail");
-        console.log("页面 onLoad, clientId=", this.clientId);
-    },
-
-    onShow() {
-        console.log("页面 onShow, 开始订阅MQTT");
-
-        if (!this.clientId) {
-            console.warn("未找到 clientId，跳过订阅");
-            return;
-        }
-
-        // 订阅 tracker_targets 主题
-        this.$mqttClientData.subscribe(
-            `/dev/${this.clientId}/tracker_targets`,
-            (err) => {
-                if (err) {
-                    console.error("订阅失败", err);
-                } else {
-                    console.log(`成功订阅: /dev/${this.clientId}/tracker_targets`);
-                }
-            }
-        );
-
-        // 绑定消息监听器（避免重复绑定）
-        this.mqttMessageHandler = (topic, message) => {
-            this.handleMqttMessage(topic, message);
-        };
-        this.$mqttClientData.on("message", this.mqttMessageHandler);
-    },
-
-    onHide() {
-        console.log("页面 onHide, 取消订阅MQTT");
-
-        if (this.clientId) {
-            this.$mqttClientData.unsubscribe(
-                `/dev/${this.clientId}/tracker_targets`,
-                (err) => {
-                    if (err) {
-                        console.error("取消订阅失败", err);
-                    } else {
-                        console.log(
-                            `取消订阅成功: /dev/${this.clientId}/tracker_targets`
-                        );
-                    }
-                }
-            );
-        }
-
-        // 移除消息监听器
-        if (this.mqttMessageHandler) {
-            this.$mqttClientData.off("message", this.mqttMessageHandler);
-            this.mqttMessageHandler = null;
-        }
-    },
-
-    onUnload() {
-        console.log("页面 onUnload, 清理MQTT");
-        this.onHide(); // 复用取消订阅逻辑
-        uni.setStorageSync("clientIDetail", null);
-    },
-};
+export default { data() { return { clientId: "", mqttClientData: null,
+mqttMessageBound: false, // 确保 message 事件只绑定一次 }; }, onLoad(options) {
+const devItem = JSON.parse(options.devItem); this.clientId =
+uni.getStorageSync("clientIDetail") || devItem.clientId; // 获取全局 MQTT 客户端
+this.mqttClientData = this.$mqttClientData; // 如果还没创建或者未连接，等待连接
+ready if (!this.mqttClientData || !this.mqttClientData.mqttDataConnected) {
+uni.$once("mqttData-ready", (mqtt) => { this.mqttClientData = mqtt;
+this.subscribeMqttData(); }); } else { this.subscribeMqttData(); } }, methods: {
+subscribeMqttData() { const mqtt = this.mqttClientData; if (!mqtt) return; //
+只绑定一次 message 回调 if (!this.mqttMessageBound) { mqtt.on("message", (topic,
+message) => { console.log("收到消息:", topic, message.toString()); const
+dataMatch = topic.match(/^\/dev\/(.+)\/tracker_targets$/); const cmdMatch =
+topic.match(/^\/mps\/wx_(.+)\/notice$/); if (dataMatch && dataMatch[1] ===
+this.clientId) { this.handleMessage(topic, message, this.clientId); } else if
+(cmdMatch) { this.$refs.alarmModel?.hanOtherMessage?.(topic, message); } });
+this.mqttMessageBound = true; } // 如果已连接，立即订阅 if
+(mqtt.mqttDataConnected) { mqtt.subscribeTopic(this.clientId); } else { //
+未连接时监听 connect 再订阅 mqtt.on("connect", () => { console.log("DATA MQTT
+连接成功，订阅 topic"); mqtt.subscribeTopic(this.clientId); }); } }, },
+onUnload() { // 页面卸载取消订阅 if (this.mqttClientData) {
+this.mqttClientData.unsubscribe(`/dev/${this.clientId}/tracker_targets`, (err)
+=> { if (err) console.error("取消订阅失败", err); else
+console.log(`取消订阅成功: /dev/${this.clientId}/tracker_targets`); }); }
+this.mqttMessageBound = false; }, };