src/pages/home/home.vue

@@ -219,6 +219,7 @@ export default {
                         "clientIDetail",
                         this.devDevice[0].clientId
                     );
+                    uni.setStorageSync("northAngle", item.northAngle);
                     uni.navigateTo({
                         url:
                             "/pagesA/deviceDetail/deviceDetail?devItem=" +

src/pagesA/deviceDetail/deviceDetail.vue

@@ -7,80 +7,65 @@
         <view class="radar-box">
             <view
                 :style="{
-                    width: `${length / 200}px`,
-                    height: `${width / 200}px`,
-                    position: 'relative',
-                    transform: `scale(${zoomTimes})`,
-                    border: `${9 / zoomTimes}rpx solid #333333`,
+                    width: `${length}rpx`,
+                    height: `${width}rpx`,
+                    position: 'absolute',
+                    top: '50%',
+                    left: '50%',
+                    transform: `translate(calc(-50% + ${
+                        xOffset / 2
+                    }rpx), calc(-50% + ${yOffset / 2}rpx))`,
+                    border: `9rpx solid #333333`,
                 }"
-                :class="[
-                    width < 25500 && length < 25000 ? 'tranStyle' : 'center',
-                ]"
+                class="tranStyle"
             >
-                <template v-if="modules.length > 0">
+            </view>
+            <template v-if="modules.length > 0">
+                <view
+                    v-for="(item, index) in modules"
+                    :key="index"
+                    class="moduleContent"
+                >
                     <view
-                        v-for="(item, index) in modules"
-                        :key="index"
-                        class="moduleContent"
+                        :class="item.type"
+                        :style="{
+                            width: `${item.width}rpx`,
+                            height: `${item.length}rpx`,
+                            top: `${item.top}rpx`,
+                            left: `${item.left}rpx`,
+                            transform: `rotate(${item.rotate}deg)`,
+                            'transform-origin': 'center center',
+                            zIndex: 4444,
+                        }"
                     >
-                        <view
-                            :class="item.type"
-                            :style="{
-                                width: `${item.width / 2}px`,
-                                height: `${item.length / 2}px`,
-                                top: `${item.top / 2}px`,
-                                left: `${item.left / 2}px`,
-                                transform: `rotate(${item.rotate}deg)`,
-                                'transform-origin': 'center center',
-                                zIndex: 4444,
-                            }"
-                        >
-                            <image
-                                style="
-                                    width: 100%;
-                                    height: 100%;
-                                    display: block;
-                                "
-                                :src="`../../static/furnitures/${item.type}.png`"
-                                mode=""
-                            />
-                        </view>
-                    </view>
-                </template>
-                <template>
-                    <view v-for="item in targetPoints" :key="item.id">
                         <image
-                            class="action-icon-M"
-                            :style="{
-                                position: 'absolute',
-                                transform: `translate3d(${
-                                    item.displayX / 2
-                                }px, ${
-                                    -item.displayY / 2
-                                }px, 0) translate(-50%, -50%) scale(${
-                                    1.5 / zoomTimes
-                                })`,
-                                zIndex: 9999,
-                                transition: 'transform 1s linear',
-                                willChange: 'transform',
-                            }"
-                            :src="`../../static/${lnbAction}.png`"
+                            style="width: 100%; height: 100%; display: block"
+                            :src="`../../static/furnitures/${item.type}.png`"
                             mode=""
                         />
                     </view>
-                </template>
-            </view>
-
-            <image
-                class="redar-pic"
-                src="../../static/rander.png"
-                mode=""
-                :style="{
-                    transform: `translate(${-xOffset}rpx, ${-yOffset}rpx) rotate(${
-                        devInfo.northAngle
-                    }deg)`,
-                }"
-            />
+                </view>
+            </template>
+            <template>
+                <image
+                    v-for="item in targetPoints"
+                    :key="item.id"
+                    class="action-icon-M"
+                    :src="`../../static/${lnbAction}.png`"
+                    :style="{
+                        position: 'absolute',
+                        transform: `translate(-50%, -50%) translate3d(${item.displayX}rpx, ${item.displayY}rpx, 0)`,
+                        transition: 'transform 1s linear',
+                        willChange: 'transform',
+                        zIndex: 9999,
+                        top: '0',
+                        left: '0',
+                        width: '50rpx',
+                        height: '50rpx',
+                    }"
+                />
+            </template>
+            <image class="redar-pic" src="../../static/rander.png" mode="" />
         </view>
 
         <view class="switchBox">
@@ -437,11 +422,16 @@ export default {
             fallingEventChange: null,
             lnbActionJudean: false,
             setIntervalVal: null,
+
+            // 重新计算雷达坐标位置
+            x_radar: 200,
+            y_radar: 200,
         };
     },
     computed: {},
 
     methods: {
+        // 获取设备信息
         getdevInfo(devId) {
             this.$http
                 .get(`wap/device/queryDeviceInfoById`, {
@@ -452,16 +442,15 @@ export default {
                         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.width = Math.abs(
+                            this.devInfo.yyEnd - this.devInfo.yyStart
+                        );
+                        this.length = Math.abs(
+                            this.devInfo.xxEnd - this.devInfo.xxStart
+                        );
                         this.statusLight = this.devInfo.statusLight;
                         this.calculate(this.width, this.length);
+                        this.calculateOffest();
                         // 设备分享权限判断
                         this.shareJudge =
                             this.devInfo.userId == uni.getStorageSync("userId")
@@ -479,10 +468,16 @@ export default {
                 })
                 .then((res) => {
                     if (res.data.data) {
+                        res.data.data.furnitures.forEach((item) => {
+                            item.left = this.x_radar + item.x;
+                            item.top = this.y_radar - item.y;
+                        });
+
                         this.modules = res.data.data.furnitures;
                     }
                 });
         },
+        // 处理设备状态灯
         handleLightChange(e) {
             let newValue = e.detail.value == true ? 1 : 0;
             this.$http
@@ -902,12 +897,13 @@ export default {
             });
         },
 
+        // 处理点位消息
         handleMessage(topic, message, clientId) {
             // 清除不活动定时器
             clearTimeout(this.inactivityTimer);
             this.inactivityTimer = setTimeout(() => {
                 this.targetPoints = {};
-                console.log("没有点位，消除点位数据");
+                // console.log("没有点位，消除点位数据");
             }, 1500);
             // 验证topic格式
             const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
@@ -915,7 +911,7 @@ export default {
 
             try {
                 const data = JSON.parse(message.toString());
-                console.log(data.tracker_targets, "点位消息");
+                // console.log(data.tracker_targets, "点位消息");
                 if (data.health) {
                     if (
                         data.health.breath_rpm ||
@@ -980,6 +976,41 @@ export default {
                         (item) => item !== null && item !== undefined
                     );
                 }
+                // console.log(
+                //     this.targetPoints,
+                //     this.devInfo,
+                //     "更新后的点位数据111"
+                // );
+                // this.targetPoints = this.targetPoints.map((point) => {
+                //     return this.rotatePoint(
+                //         point,
+                //         [this.x_radar, this.y_radar],
+                //         this.devInfo.northAngle
+                //     );
+                // });
+
+                // if (Array.isArray(this.targetPoints)) {
+                //     // 多个点
+                //     this.targetPoints = this.targetPoints.map((p) => {
+                //         return this.rotatePoint(
+                //             p,
+                //             [this.x_radar, this.y_radar],
+                //             uni.getStorageSync("northAngle")
+                //         );
+                //     });
+                // } else if (
+                //     this.targetPoints &&
+                //     typeof this.targetPoints === "object"
+                // ) {
+                //     // 单个点
+                //     this.targetPoints = this.rotatePoint(
+                //         this.targetPoints,
+                //         [this.x_radar, this.y_radar],
+                //         uni.getStorageSync("northAngle")
+                //     );
+                // }
+
+                // console.log(this.targetPoints, "更新后的点位数据333");
             }
         },
         createNewTargetPoint(x, y, z, id) {
@@ -988,8 +1019,8 @@ export default {
                 y,
                 z,
                 id,
-                displayX: x - Number(this.devInfo.xxStart),
-                displayY: y - Number(this.devInfo.yyEnd),
+                displayX: this.x_radar + x,
+                displayY: this.y_radar - y,
                 lastX: x,
                 lastY: y,
             };
@@ -1007,43 +1038,96 @@ export default {
                     z,
                     lastX: x,
                     lastY: y,
-                    displayX: x - Number(this.devInfo.xxStart),
-                    displayY: y - Number(this.devInfo.yyEnd),
+                    displayX: this.x_radar + x,
+                    displayY: this.y_radar - y,
                 };
             }
 
             return existingPoint;
         },
+
+        rotatePoint(point, radar, angle) {
+            console.log(point, radar, angle, "rotatePoint");
+            const [cx, cy] = radar;
+            const dx = point.displayX - cx;
+            const dy = point.displayY - cy;
+            let nx, ny;
+
+            switch (angle) {
+                case 0:
+                    nx = dx;
+                    ny = dy;
+                    break;
+                case 90:
+                    nx = dy;
+                    ny = -dx;
+                    break;
+                case 180:
+                    nx = -dx;
+                    ny = -dy;
+                    break;
+                case 270:
+                    nx = -dy;
+                    ny = dx;
+                    break;
+                default:
+                    throw new Error("angle must be 0, 90, 180, 270");
+            }
+
+            // ✅ 更新点坐标
+            point.displayX = cx + nx;
+            point.displayY = cy + ny;
+            return point;
+        },
+
         // 计算缩放比例
         calculate(width, length) {
             let zoomTime = width > length ? width : length;
             let practical = zoomTime / 100;
             this.zoomTimes = 710 / practical;
-            // this.normalizeZoomTimes(this.zoomTimes);
             this.zoomTimes = this.zoomTimes - 0.2;
             this.zoomTimes = Number(this.zoomTimes.toFixed(2));
-            this.xOffset = this.devInfo.xxStart + this.devInfo.xxEnd;
-            this.yOffset = -(this.devInfo.yyStart + this.devInfo.yyEnd);
             console.log(this.xOffset, this.yOffset, this.zoomTimes, "偏移量");
             this.lnbActionJudean = true;
         },
-        normalizeZoomTimes(num) {
-            const intPart = Math.floor(num);
-            const decimalPart = num - intPart;
-            let result;
-            if (decimalPart >= 0.1 && decimalPart < 0.5) {
-                result = intPart;
-            } else if (decimalPart >= 0.5 && decimalPart < 0.9) {
-                result = intPart + 0.5;
-            } else {
-                result = num;
+        calculateOffest() {
+            let xxStart = "";
+            let xxEnd = "";
+            let yyStart = "";
+            let yyEnd = "";
+
+            if (this.devInfo.northAngle == 0) {
+                xxStart = this.devInfo.xxStart;
+                xxEnd = this.devInfo.xxEnd;
+                yyStart = this.devInfo.yyStart;
+                yyEnd = this.devInfo.yyEnd;
             }
-            return Math.round(result * 100) / 100;
+            if (this.devInfo.northAngle == 90) {
+                xxStart = this.devInfo.xxStart;
+                xxEnd = this.devInfo.xxEnd;
+                yyStart = -this.devInfo.yyEnd;
+                yyEnd = -this.devInfo.yyStart;
+            }
+            if (this.devInfo.northAngle == 180) {
+                xxStart = -this.devInfo.xxEnd;
+                xxEnd = -this.devInfo.xxStart;
+                yyStart = -this.devInfo.yyEnd;
+                yyEnd = -this.devInfo.yyStart;
+            }
+            if (this.devInfo.northAngle == 270) {
+                xxStart = -this.devInfo.xxEnd;
+                xxEnd = -this.devInfo.xxStart;
+                yyStart = this.devInfo.yyStart;
+                yyEnd = this.devInfo.yyEnd;
+            }
+            this.xOffset = xxStart + xxEnd;
+            this.yOffset = -(yyStart + yyEnd);
         },
 
         formatTime(time) {
             return time ? time.slice(11, 19) : "暂无";
         },
+        // 订阅消息,处理mqtt消息
         initSubscriptions() {
             const topicList = [
                 {
@@ -1186,6 +1270,7 @@ export default {
         });
     },
     onHide() {
+        // MqttService.dataConnected = false;
         this.showModle = false;
     },
 };
@@ -1214,52 +1299,18 @@ export default {
     .radar-box {
         margin: 0 auto;
         position: relative;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        width: 710rpx;
-        height: 710rpx;
+        // display: flex;
+        // align-items: center;
+        // justify-content: center;
+        width: 400rpx;
+        height: 400rpx;
         background: #ffffff;
         border-radius: 37.5rpx;
         box-sizing: border-box;
-
-        .center {
-            position: absolute;
-            overflow: hidden;
-            border: none;
-            background-repeat: no-repeat;
-            background-position: center;
-            &::before {
-                content: "";
-                position: absolute;
-                inset: 0;
-                background: url("https://hflnxx.oss-cn-shanghai.aliyuncs.com/IMAGE/20250919/toilet_bg.png")
-                    no-repeat center;
-                background-size: 100% 100%;
-                z-index: 0;
-            }
-
-            .moduleContent {
-                position: relative;
-
-                view {
-                    position: absolute;
-                }
-
-                .module-img {
-                    width: 100%;
-                    height: 100%;
-                    display: block;
-                }
-            }
-        }
         .tranStyle {
             position: absolute;
-            overflow: hidden;
             background-color: #fff;
             border: none;
-            // outline: 10rpx solid #333333;
-            // background-image: url("https://hflnxx.oss-cn-shanghai.aliyuncs.com/IMAGE/20250919/toilet_bg.png");
             background-repeat: no-repeat;
             background-position: center;
             &::before {
@@ -1268,25 +1319,21 @@ export default {
                 inset: 0;
                 background: url("https://hflnxx.oss-cn-shanghai.aliyuncs.com/IMAGE/20250919/toilet_bg.png")
                     no-repeat center;
-                background-size: 100% 100%;
+                background-size: 150% 150%;
                 z-index: 0; // 在最底层
             }
-            .moduleContent {
-                // overflow: hidden;
-
-                // position: relative;
-                view {
-                    position: absolute;
-                }
+        }
+        .moduleContent {
+            view {
+                position: absolute;
+            }
 
-                .module-img {
-                    width: 100%;
-                    height: 100%;
-                    display: block;
-                }
+            .module-img {
+                width: 100%;
+                height: 100%;
+                display: block;
             }
         }
-
         .action-icon-G {
             position: absolute;
             width: 100rpx;
@@ -1295,16 +1342,21 @@ export default {
 
         .action-icon-M {
             // position: absolute;
-            width: 50rpx;
-            height: 50rpx;
+            // width: 50rpx;
+            // height: 50rpx;
+            // transform: translate(-50%, -50%);
+            // transition: transform 1s linear;
+            // will-change: transform;
+            // z-index: 9999;
         }
         .redar-pic {
             position: absolute;
-            // left: 50%;
-            // top: 50%;
-            width: 60rpx;
-            height: 60rpx;
-            transform: translate(-50%, -50%); /* 先居中 */
+            top: 50%;
+            left: 50%;
+            width: 40rpx;
+            height: 40rpx;
+            transform: translate(-50%, -50%);
+            z-index: 20;
         }
     }
 

src/pagesA/deviceSetting/deviceSetting.vue

@@ -284,11 +284,11 @@ export default {
         queryOtaList() {
             this.$http.get("wap/device/OTA/query", {}).then((res) => {
                 this.otaListName = res.data.data;
-                // this.otaList = this.filterFilesByVersion(
-                //     res.data.data,
-                //     this.devInfo.hardware
-                // );
-                // this.otaListName = this.otaList.map((ele) => ele.fileName);
+                this.otaList = this.filterFilesByVersion(
+                    res.data.data,
+                    this.devInfo.hardware
+                );
+                this.otaListName = this.otaList.map((ele) => ele.fileName);
             });
         },
         bindPickerChangeTwo(e) {
@@ -313,7 +313,7 @@ export default {
                 .then((res) => {
                     if (res.data.code == 200) {
                         uni.showToast({
-                            title: "设备升级成功",
+                            title: "设备升级中...",
                             icon: "success",
                             duration: 1500,
                         });

src/pagesA/devices/devices.vue

@@ -104,6 +104,7 @@ export default {
         gotoPath(item) {
             uni.setStorageSync("devIdDetail", item.devId);
             uni.setStorageSync("clientIDetail", item.clientId);
+            uni.setStorageSync("northAngle", item.northAngle);
             uni.navigateTo({
                 url:
                     "/pagesA/deviceDetail/deviceDetail?devItem=" +

src/pagesA/roomSetting/roomSetting.vue

@@ -4,79 +4,72 @@
             <view class="radar-box">
                 <view
                     :style="{
-                        width: `${length / 200}px`,
-                        height: `${width / 200}px`,
-                        position: 'relative',
+                        width: `${length}rpx`,
+                        height: `${width}rpx`,
+                        position: 'absolute',
+                        top: '50%',
+                        left: '50%',
+                        transform: `translate(calc(-50% + ${
+                            xOffset / 2
+                        }rpx), calc(-50% + ${yOffset / 2}rpx))`,
+                        border: `9rpx solid #333333`,
                     }"
-                    :class="[
-                        width < 25500 && length < 25000
-                            ? 'tranStyle'
-                            : 'center',
-                    ]"
+                    class="tranStyle"
+                >
+                </view>
+
+                <view
+                    v-for="(item, index) in modules"
+                    :key="index"
+                    class="moduleContent"
                 >
                     <view
-                        v-for="(item, index) in modules"
-                        :key="index"
-                        class="moduleContent"
+                        :class="item.type"
+                        :style="{
+                            width: `${item.width}rpx`,
+                            height: `${item.length}rpx`,
+                            top: `${item.top}rpx`,
+                            left: `${item.left}rpx`,
+                            transform: `rotate(${item.rotate}deg)`,
+                            'transform-origin': 'center center',
+                        }"
+                        @touchmove.prevent="onTouchMove(index, $event)"
+                        @touchstart="onTouchStart(index, $event)"
+                        @touchend="onTouchEnd(index, $event)"
                     >
-                        <view
-                            :class="item.type"
-                            :style="{
-                                width: `${item.width / 2}px`,
-                                height: `${item.length / 2}px`,
-                                top: `${item.top / 2}px`,
-                                left: `${item.left / 2}px`,
-                                transform: `rotate(${item.rotate}deg)`,
-                                'transform-origin': 'center center',
-                            }"
-                            @touchmove.prevent="onTouchMove(index, $event)"
-                            @touchstart="onTouchStart(index, $event)"
-                            @touchend="onTouchEnd(index, $event)"
-                        >
-                            <image
-                                class="module-img"
-                                :src="`../../static/furnitures/${item.type}.png`"
-                                mode=""
-                            />
-                        </view>
+                        <image
+                            class="module-img"
+                            :src="`../../static/furnitures/${item.type}.png`"
+                            mode=""
+                        />
                     </view>
-                    <template>
-                        <view v-for="item in targetPoints" :key="item.id">
-                            <image
-                                class="action-icon-M"
-                                :style="{
-                                    position: 'absolute',
-                                    transform: `translate3d(${
-                                        item.displayX / 2
-                                    }px, ${
-                                        -item.displayY / 2
-                                    }px, 0) translate(-50%, -50%) scale(${
-                                        1.5 / 2
-                                    })`,
-                                    zIndex: 9999,
-                                    transition: 'transform 1s linear',
-                                    willChange: 'transform',
-                                }"
-                                :src="`../../static/${lnbAction}.png`"
-                                mode=""
-                            />
-                        </view>
-                    </template>
                 </view>
 
-                <!-- <image
-                class="redar-pic"
-                src="../../static/rander.png"
-                mode=""
-                :style="{
-                    transform:
-                        'translate(' +
-                        -xOffset / 100 +
-                        'rpx,' +
-                        -yOffset / 100 +
-                        'rpx)',
-                }"
-            /> -->
+                <template>
+                    <image
+                        v-for="item in targetPoints"
+                        :key="item.id"
+                        class="action-icon-M"
+                        :src="`../../static/${lnbAction}.png`"
+                        :style="{
+                            position: 'absolute',
+                            transform: `translate(-50%, -50%) translate3d(${item.displayX}rpx, ${item.displayY}rpx, 0)`,
+                            transition: 'transform 1s linear',
+                            willChange: 'transform',
+                            zIndex: 9999,
+                            top: '0',
+                            left: '0',
+                            width: '50rpx',
+                            height: '50rpx',
+                        }"
+                    />
+                </template>
+
+                <image
+                    class="redar-pic"
+                    src="../../static/rander.png"
+                    mode=""
+                />
             </view>
             <view class="airbody">
                 <view class="header_top">
@@ -414,6 +407,10 @@ export default {
             top: 0,
             clientIdProp: null,
             clientId: null,
+
+            // 重新计算雷达坐标位置
+            x_radar: 200,
+            y_radar: 200,
         };
     },
     computed: {},
@@ -425,10 +422,10 @@ export default {
             const currentY = event.touches[0].clientY;
             const deltaX = Math.round(currentX - startX);
             const deltaY = Math.round(currentY - startY);
-            let x = Math.round(
-                this.xxStart + event.currentTarget.offsetLeft * 2
-            );
-            let y = Math.round(this.yyEnd - event.currentTarget.offsetTop * 2);
+            // let x = Math.round(
+            //     this.xxStart + event.currentTarget.offsetLeft * 2
+            // );
+            // let y = Math.round(this.yyEnd - event.currentTarget.offsetTop * 2);
 
             // 创建新数组避免直接修改原数组
             const updatedModules = [...this.modules];
@@ -440,8 +437,8 @@ export default {
                 top: Math.round(
                     updatedModules[this.draggingIndex].top + deltaY
                 ),
-                x,
-                y,
+                // x,
+                // y,
             };
 
             // Vue 的响应式更新
@@ -473,8 +470,8 @@ export default {
                 type: featuriesType,
                 width: 0,
                 length: 0,
-                top: 0,
-                left: 0,
+                top: 200,
+                left: 200,
                 rotate: 0,
             };
             switch (featuriesType) {
@@ -646,6 +643,15 @@ export default {
         },
 
         saveRoom() {
+            console.log(this.modules, 9999);
+
+            if (this.modules.length > 0) {
+                this.modules.forEach((item) => {
+                    item.x = item.left - this.x_radar;
+                    item.y = this.y_radar - item.top;
+                });
+            }
+
             this.$http
                 .post(
                     "wap/room/saveRoom",
@@ -692,21 +698,13 @@ export default {
                 .then((res) => {
                     if (res.data.data) {
                         this.devInfo = res.data.data;
-                        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;
-
-                        console.log(this.xOffset, this.yOffset, 9999);
+                        this.width = Math.abs(
+                            this.devInfo.yyEnd - this.devInfo.yyStart
+                        );
+                        this.length = Math.abs(
+                            this.devInfo.xxEnd - this.devInfo.xxStart
+                        );
+                        this.calculateOffest();
                         this.statusLight = this.devInfo.statusLight;
                         this.xxStart = this.devInfo.xxStart;
                         this.xxEnd = this.devInfo.xxEnd;
@@ -723,6 +721,39 @@ export default {
                     console.log(err, 8888);
                 });
         },
+
+        calculateOffest() {
+            let xxStart = "";
+            let xxEnd = "";
+            let yyStart = "";
+            let yyEnd = "";
+            if (this.devInfo.northAngle == 0) {
+                xxStart = this.devInfo.xxStart;
+                xxEnd = this.devInfo.xxEnd;
+                yyStart = this.devInfo.yyStart;
+                yyEnd = this.devInfo.yyEnd;
+            }
+            if (this.devInfo.northAngle == 90) {
+                xxStart = this.devInfo.xxStart;
+                xxEnd = this.devInfo.xxEnd;
+                yyStart = -this.devInfo.yyEnd;
+                yyEnd = -this.devInfo.yyStart;
+            }
+            if (this.devInfo.northAngle == 180) {
+                xxStart = -this.devInfo.xxEnd;
+                xxEnd = -this.devInfo.xxStart;
+                yyStart = -this.devInfo.yyEnd;
+                yyEnd = -this.devInfo.yyStart;
+            }
+            if (this.devInfo.northAngle == 270) {
+                xxStart = -this.devInfo.xxEnd;
+                xxEnd = -this.devInfo.xxStart;
+                yyStart = this.devInfo.yyStart;
+                yyEnd = this.devInfo.yyEnd;
+            }
+            this.xOffset = xxStart + xxEnd;
+            this.yOffset = -(yyStart + yyEnd);
+        },
         getRoomInfo(devId) {
             this.$http
                 .get(`wap/room/readRoom`, {
@@ -740,7 +771,7 @@ export default {
             clearTimeout(this.inactivityTimer);
             this.inactivityTimer = setTimeout(() => {
                 this.targetPoints = {};
-                console.log("长时间没有点位消除");
+                // console.log("长时间没有点位消除");
             }, 1500);
             // 验证topic格式
             const match = topic.match(/^\/dev\/(.+)\/tracker_targets$/);
@@ -807,6 +838,7 @@ export default {
                     ...this.targetPoints,
                     ...newTargetPoints,
                 };
+                // console.log(this.targetPoints, "更新后的点位数据2222");
                 if (Array.isArray(this.targetPoints)) {
                     this.targetPoints = this.targetPoints.filter(
                         (item) => item !== null && item !== undefined
@@ -820,8 +852,8 @@ export default {
                 y,
                 z,
                 id,
-                displayX: x - Number(this.xxStart),
-                displayY: y - Number(this.yyEnd),
+                displayX: this.x_radar + x,
+                displayY: this.y_radar - y,
                 lastX: x,
                 lastY: y,
             };
@@ -839,13 +871,94 @@ export default {
                     z,
                     lastX: x,
                     lastY: y,
-                    displayX: x - Number(this.xxStart),
-                    displayY: y - Number(this.yyEnd),
+                    displayX: this.x_radar + x,
+                    displayY: this.y_radar - y,
                 };
             }
 
             return existingPoint;
         },
+        initSubscriptions() {
+            const topicList = [
+                {
+                    topic: `/dev/${this.clientId}/tracker_targets`,
+                    key: "unsubscribeFn",
+                    callback: (message, msgTopic) => {
+                        const dataMatch = msgTopic.match(
+                            /^\/dev\/(.+)\/tracker_targets$/
+                        );
+                        const cmdMatch = msgTopic.match(
+                            /^\/mps\/wx_(.+)\/notice$/
+                        );
+                        if (dataMatch && dataMatch[1] === this.clientId) {
+                            this.handleMessage(
+                                msgTopic,
+                                message,
+                                this.clientId
+                            );
+                        } else if (cmdMatch) {
+                            this.$refs.alarmModel.hanOtherMessage(
+                                msgTopic,
+                                message
+                            );
+                        }
+                    },
+                },
+                {
+                    topic: `/dev/${this.clientId}/falling_event_change`,
+                    key: "fallingEventChange",
+                    callback: (message, msgTopic) => {
+                        const dataMatch = msgTopic.match(
+                            /^\/dev\/(.+)\/falling_event_change$/
+                        );
+                        if (dataMatch && dataMatch[1] === this.clientId) {
+                            const dataMessage = JSON.parse(message.toString());
+                            console.log(dataMessage, 888888);
+                            if (dataMessage.falling == 1) {
+                                this.falling = dataMessage.falling;
+                                this.lnbAction = "actionWarn";
+                            } else if (
+                                dataMessage.falling == 2 ||
+                                dataMessage.falling == 3
+                            ) {
+                                this.falling = dataMessage.falling;
+                                this.lnbAction = "actionSerious";
+                            } else {
+                                this.lnbAction = "action8";
+                            }
+                        }
+                    },
+                },
+            ];
+
+            topicList.forEach((item) => {
+                // 避免重复订阅
+                if (this[item.key]) return;
+
+                const subscribeFunc = () => {
+                    const unsubscribe = MqttService.subscribe(
+                        "DATA",
+                        item.topic,
+                        item.callback
+                    );
+                    if (unsubscribe) {
+                        this[item.key] = unsubscribe;
+                        console.log(`✅ 已成功订阅主题: ${item.topic}`);
+                    }
+                };
+
+                if (MqttService.dataConnected) {
+                    subscribeFunc();
+                } else {
+                    // MQTT 未连接，等待重连成功再订阅
+                    const handler = () => {
+                        subscribeFunc();
+                        uni.$off("mqttData-ready", handler);
+                    };
+                    uni.$on("mqttData-ready", handler);
+                }
+            });
+        },
     },
     onLoad(options) {
         this.devId = options.devId;
@@ -856,32 +969,50 @@ export default {
         this.getRoomInfo(this.devId);
     },
     onShow() {
-        const topic = `/dev/${this.clientId}/tracker_targets`;
-        // 使用 MqttService.subscribe 管理订阅
-        this.unsubscribeFn = MqttService.subscribe(
-            "DATA",
-            topic,
-            (message, msgTopic) => {
-                // console.log(`接收到 ${msgTopic} 消息:`, message);
-                // 处理消息
-                const dataMatch = msgTopic.match(
-                    /^\/dev\/(.+)\/tracker_targets$/
-                );
-                if (dataMatch && dataMatch[1] === this.clientId) {
-                    this.handleMessage(msgTopic, message, this.clientId);
-                }
-            }
-        );
-        if (this.unsubscribeFn) {
-            console.log(`✅ 已成功订阅主题: ${topic}`);
+        // const topic = `/dev/${this.clientId}/tracker_targets`;
+        // this.unsubscribeFn = MqttService.subscribe(
+        //     "DATA",
+        //     topic,
+        //     (message, msgTopic) => {
+        //         const dataMatch = msgTopic.match(
+        //             /^\/dev\/(.+)\/tracker_targets$/
+        //         );
+        //         if (dataMatch && dataMatch[1] === this.clientId) {
+        //             this.handleMessage(msgTopic, message, this.clientId);
+        //         }
+        //     }
+        // );
+        // if (this.unsubscribeFn) {
+        //     console.log(`✅ 已成功订阅主题: ${topic}`);
+        // }
+        if (MqttService.dataConnected && MqttService.dataClient) {
+            // 已连接，直接订阅
+            this.initSubscriptions();
         }
     },
 
     onHide() {
-        if (this.unsubscribeFn) {
-            this.unsubscribeFn();
-            this.unsubscribeFn = null;
-        }
+        ["unsubscribeFn", "fallingEventChange"].forEach((key) => {
+            if (this[key]) {
+                this[key]();
+                this[key] = null;
+            }
+        });
+    },
+    onUnload() {
+        // 清理定时器
+        clearTimeout(this.autoPlayinterval);
+        // 清理自动滑动定时器
+        clearInterval(this.setIntervalVal);
+        this.setIntervalVal = null;
+        this.autoPlayinterval = null;
+        // 取消订阅
+        ["unsubscribeFn", "fallingEventChange"].forEach((key) => {
+            if (this[key]) {
+                this[key]();
+                this[key] = null;
+            }
+        });
     },
 };
 </script>
@@ -892,46 +1023,17 @@ export default {
     background: #f4f4f4;
     .header_two {
         width: 750rpx;
-        border-bottom-left-radius: 35rpx;
-        border-bottom-right-radius: 35rpx;
+        padding-top: 20rpx;
         background: linear-gradient(180deg, #faede2 0%, #ffffff 100%);
         .radar-box {
             margin: 0 auto;
             position: relative;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            width: 710rpx;
-            height: 710rpx;
+            width: 400rpx;
+            height: 400rpx;
             background: #ffffff;
             border-radius: 37.5rpx;
             box-sizing: border-box;
 
-            .center {
-                position: absolute;
-                overflow: hidden;
-                background-color: #fff;
-                border: 8rpx solid #333333;
-                background-image: url("https://hflnxx.oss-cn-shanghai.aliyuncs.com/IMAGE/20250919/toilet_bg.png");
-                background-repeat: no-repeat;
-                background-position: center;
-                transform: scale(1.3);
-
-                .moduleContent {
-                    position: relative;
-
-                    view {
-                        position: absolute;
-                    }
-
-                    .module-img {
-                        width: 100%;
-                        height: 100%;
-                        display: block;
-                    }
-                }
-            }
-
             .tranStyle {
                 position: absolute;
                 overflow: hidden;
@@ -940,21 +1042,16 @@ export default {
                 background-image: url("https://hflnxx.oss-cn-shanghai.aliyuncs.com/IMAGE/20250919/toilet_bg.png");
                 background-repeat: no-repeat;
                 background-position: center;
-                transform: scale(2.3);
-
-                .moduleContent {
-                    // overflow: hidden;
-
-                    // position: relative;
-                    view {
-                        position: absolute;
-                    }
+            }
+            .moduleContent {
+                view {
+                    position: absolute;
+                }
 
-                    .module-img {
-                        width: 100%;
-                        height: 100%;
-                        display: block;
-                    }
+                .module-img {
+                    width: 100%;
+                    height: 100%;
+                    display: block;
                 }
             }
 
@@ -971,11 +1068,12 @@ export default {
             }
             .redar-pic {
                 position: absolute;
-                left: 50%;
                 top: 50%;
+                left: 50%;
                 width: 40rpx;
                 height: 40rpx;
-                transform: translate(-50%, -50%); /* 先居中 */
+                transform: translate(-50%, -50%);
+                z-index: 20;
             }
         }
 

src/pagesA/sharePages/sharePages.vue

@@ -117,7 +117,7 @@ export default {
                         }, 1500);
                     } else {
                         uni.showToast({
-                            title: res.data.message,
+                            title: "该链接已失效",
                             icon: "none",
                             duration: 1500,
                         });
@@ -152,7 +152,7 @@ export default {
                         }, 1500);
                     } else {
                         uni.showToast({
-                            title: res.data.message,
+                            title: "该链接已失效",
                             icon: "none",
                             duration: 1500,
                         });

旋转点.js → src/utils/rotatePoint.js

@@ -1,6 +1,6 @@
 /**
  * point: [x, y]
- * radar: [radarX, radarY]
+ * radar: [radarX, radarY]  //雷达在画布的坐标 目前是200,200
  * angle: 0, 90, 180, 270 顺时针旋转角度
  * 返回旋转后的点 [x2, y2]
  */
@@ -35,14 +35,20 @@ function rotatePoint(point, radar, angle) {
     return [cx + nx, cy + ny];
 }
 
+// ✅ 导出函数
+export default rotatePoint;
+
+
+
+
 // 测试
-const point = [3, 2];
-const radar = [2, 1];
+// const point = [3, 2];
+// const radar = [2, 1];
 
-[0, 90, 180, 270].forEach(angle => {
-    const newPoint = rotatePoint(point, radar, angle);
-    console.log(`angle=${angle}:`, newPoint);
-});
+// [0, 90, 180, 270].forEach(angle => {
+//     const newPoint = rotatePoint(point, radar, angle);
+//     console.log(`angle=${angle}:`, newPoint);
+// });
 // 预期输出
 // angle=0: [3, 2]
 // angle=90: [2, 0]