From b168fd54a45b8ba3b610ec92cbdad1559ebcdd9e Mon Sep 17 00:00:00 2001
From: chenlimao <web_wei_328@163.com>
Date: Tue, 12 May 2026 17:00:47 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E6=AF=94=E8=B5=9B=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E6=96=B0=E5=A2=9E=E8=AE=BE=E5=A4=87=E5=B7=B2=E7=A6=BB?=
 =?UTF-8?q?=E7=BA=BF=E5=BC=B9=E7=AA=97=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/melee-battle.vue | 50 ++++++++++++++++++++++++++++++++++++--
 src/pages/team-battle.vue  | 50 ++++++++++++++++++++++++++++++++++++--
 2 files changed, 96 insertions(+), 4 deletions(-)

diff --git a/src/pages/melee-battle.vue b/src/pages/melee-battle.vue
index b102bd7..5350b3b 100644
--- a/src/pages/melee-battle.vue
+++ b/src/pages/melee-battle.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted, onBeforeUnmount } from "vue";
+import { ref, onMounted, onBeforeUnmount, watch } from "vue";
 import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import BowTarget from "@/components/BowTarget.vue";
@@ -10,19 +10,31 @@ import SButton from "@/components/SButton.vue";
 import Avatar from "@/components/Avatar.vue";
 import ScreenHint from "@/components/ScreenHint.vue";
 import TestDistance from "@/components/TestDistance.vue";
+import SModal from "@/components/SModal.vue";
 import audioManager from "@/audioManager";
 import { getBattleAPI, laserCloseAPI } from "@/apis";
 import { MESSAGETYPESV2 } from "@/constants";
 import useStore from "@/store";
 import { storeToRefs } from "pinia";
 const store = useStore();
-const { user } = storeToRefs(store);
+const { user, online } = storeToRefs(store);
 const title = ref("");
 const start = ref(null);
 const battleId = ref("");
 /** 对战模式：1=好友约战 2=排位赛，用于结算页跳转判断 */
 const way = ref(0);
 const currentRound = ref(1);
+/** 控制设备离线提示弹窗的显示状态 */
+const showOfflineModal = ref(false);
+
+/**
+ * 监听设备在线状态，大乱斗比赛进行中设备离线时弹窗提示用户
+ */
+watch(online, (newVal, oldVal) => {
+  if (!newVal && oldVal && start.value === true) {
+    showOfflineModal.value = true;
+  }
+});
 const tips = ref("即将开始...");
 const players = ref([]);
 const playersSorted = ref([]);
@@ -208,6 +220,19 @@ onShow(async () => {
           <text>20秒后开始下半场</text>
         </view>
       </ScreenHint>
+      <!-- 设备离线提示弹窗 -->
+      <SModal
+        :show="showOfflineModal"
+        :noBg="true"
+        height="360rpx"
+        :onClose="() => (showOfflineModal = false)"
+      >
+        <view class="offline-modal">
+          <text class="offline-title">设备已离线</text>
+          <text class="offline-desc">检测到设备已断开连接，请检查设备后继续比赛</text>
+          <SButton @click="showOfflineModal = false">我知道了</SButton>
+        </view>
+      </SModal>
     </view>
   </Container>
 </template>
@@ -217,4 +242,25 @@ onShow(async () => {
   width: 100%;
   height: 100%;
 }
+
+.offline-modal {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 60rpx 40rpx 40rpx;
+  gap: 24rpx;
+}
+
+.offline-title {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #FED847;
+}
+
+.offline-desc {
+  font-size: 28rpx;
+  color: #CCCCCC;
+  text-align: center;
+  line-height: 1.6;
+}
 </style>
diff --git a/src/pages/team-battle.vue b/src/pages/team-battle.vue
index 6c3a3ff..d88d3de 100644
--- a/src/pages/team-battle.vue
+++ b/src/pages/team-battle.vue
@@ -1,5 +1,5 @@
 <script setup>
-import {ref, onMounted, onBeforeUnmount, nextTick} from "vue";
+import {ref, onMounted, onBeforeUnmount, nextTick, watch} from "vue";
 import {onLoad, onShow, onHide} from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import BattleHeader from "@/components/BattleHeader.vue";
@@ -11,6 +11,7 @@ import RoundEndTip from "@/components/RoundEndTip.vue";
 import TestDistance from "@/components/TestDistance.vue";
 import TeamAvatars from "@/components/TeamAvatars.vue";
 import ShootProgress2 from "@/components/ShootProgress2.vue";
+import SModal from "@/components/SModal.vue";
 import {laserCloseAPI, getBattleAPI} from "@/apis";
 import {MESSAGETYPESV2} from "@/constants";
 import audioManager from "@/audioManager";
@@ -18,7 +19,7 @@ import useStore from "@/store";
 import {storeToRefs} from "pinia";
 
 const store = useStore();
-const {user} = storeToRefs(store);
+const {user, online} = storeToRefs(store);
 const start = ref(null);
 const tips = ref("");
 const battleId = ref("");
@@ -44,6 +45,17 @@ const updateRemainSecond = ref(0);
 const battleWay = ref(0);
 /** 上一次处理的 ToSomeoneShoot 关键字段，用于去重过滤重复消息 */
 const lastToSomeoneShootKey = ref("");
+/** 控制设备离线提示弹窗的显示状态 */
+const showOfflineModal = ref(false);
+
+/**
+ * 监听设备在线状态，比赛进行中设备离线时弹窗提示用户
+ */
+watch(online, (newVal, oldVal) => {
+  if (!newVal && oldVal && start.value === true) {
+    showOfflineModal.value = true;
+  }
+});
 
 const recoverData = (battleInfo, {force = false, arrowOnly = false} = {}) => {
   try {
@@ -314,6 +326,19 @@ onShow(async () => {
             :onAutoClose="()=>{ showRoundTip = false}"
         />
       </ScreenHint>
+      <!-- 设备离线提示弹窗 -->
+      <SModal
+          :show="showOfflineModal"
+          :noBg="true"
+          height="360rpx"
+          :onClose="() => (showOfflineModal = false)"
+      >
+        <view class="offline-modal">
+          <text class="offline-title">设备已离线</text>
+          <text class="offline-desc">检测到设备已断开连接，请检查设备后继续比赛</text>
+          <SButton @click="showOfflineModal = false">我知道了</SButton>
+        </view>
+      </SModal>
     </view>
   </Container>
 </template>
@@ -331,4 +356,25 @@ onShow(async () => {
   margin-top: -2%;
   margin-bottom: 6%;
 }
+
+.offline-modal {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 60rpx 40rpx 40rpx;
+  gap: 24rpx;
+}
+
+.offline-title {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #FED847;
+}
+
+.offline-desc {
+  font-size: 28rpx;
+  color: #CCCCCC;
+  text-align: center;
+  line-height: 1.6;
+}
 </style>