refactor: 重构多个组件以支持 Vue 3 语法和功能

- 将多个组件转换为 `<script setup>` 语法，提升可读性和性能
- 优化状态管理和事件处理逻辑，简化代码结构
- 更新样式和布局以适应新组件结构
- 添加新功能和修复已知问题，提升用户体验

pages/promotion/live/mqtt/mqtt.js

@@ -1,3 +1,4 @@
+// #ifndef MP-WEIXIN
 import api from "@/config/api.js";
 import mqtt from "mqtt";
 
@@ -291,3 +292,28 @@ export function createMqttClient(options = {}) {
 }
 
 export { MqttClient };
+// #endif
+
+// #ifdef MP-WEIXIN
+class MqttClient {
+  connect() {
+    return Promise.resolve(this);
+  }
+  disconnect() {}
+  isConnected() {
+    return false;
+  }
+  subscribe() {
+    return this;
+  }
+  on() {
+    return this;
+  }
+}
+
+export function createMqttClient() {
+  return new MqttClient();
+}
+
+export { MqttClient };
+// #endif