添加游戏中途挂起，返回同步数据

2025-07-22 15:47:07 +08:00
parent e5a28fd4ac
commit eb1c2f7f41
6 changed files with 330 additions and 232 deletions
--- a/src/pages/battle-result.vue
+++ b/src/pages/battle-result.vue
@@ -30,7 +30,6 @@ const checkBowData = () => {
 };
 onMounted(async () => {
  const battleInfo = uni.getStorageSync("last-battle");
-  console.log("----battleInfo", battleInfo);
  data.value = battleInfo;
  const mine = battleInfo.playerStats.find((p) => p.id === user.value.id);
  rank.value =
@@ -144,7 +143,7 @@ onUnmounted(() => {
    </block>
    <view class="battle-e">
      <image src="../static/row-yellow-bg.png" mode="widthFix" />
-      <Avatar v-if="data.mode === 1" :src="user.avatar" :size="40" />
+      <Avatar :src="user.avatar" :size="40" />
      <text v-if="data.battleMode === 1">
        经验 {{ totalPoints > 0 ? "+" + totalPoints : totalPoints }}
      </text>
--- a/src/pages/battle-room.vue
+++ b/src/pages/battle-room.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { ref, watch, onMounted, onUnmounted } from "vue";
-import { onLoad } from "@dcloudio/uni-app";
+import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import PlayerSeats from "@/components/PlayerSeats.vue";
 import Guide from "@/components/Guide.vue";
@@ -17,7 +17,14 @@ import ScreenHint from "@/components/ScreenHint.vue";
 import RoundEndTip from "@/components/RoundEndTip.vue";
 import TestDistance from "@/components/TestDistance.vue";
 import PlayerScore from "@/components/PlayerScore.vue";
-import { getRoomAPI, destroyRoomAPI, exitRoomAPI, startRoomAPI } from "@/apis";
+import {
+  getRoomAPI,
+  destroyRoomAPI,
+  exitRoomAPI,
+  startRoomAPI,
+  getCurrentGameAPI,
+} from "@/apis";
+import { isGameEnded } from "@/util";
 import { MESSAGETYPES, roundsName, getMessageTypeName } from "@/constants";
 import useStore from "@/store";
 import { storeToRefs } from "pinia";
@@ -55,6 +62,7 @@ const halfTimeTip = ref(false);
 const isFinalShoot = ref(false);
 const total = ref(15);
 const battleType = ref(0);
+const isEnded = ref(false);

 watch(
  () => [players.value, playersScores.value],
@@ -71,11 +79,7 @@ watch(
  }
 );

-onLoad(async (options) => {
-  if (options.battleId) {
-    const battleInfo = uni.getStorageSync("current-battle");
-    console.log("----battleInfo", battleInfo);
-    if (battleInfo) {
+function recoverData(battleInfo) {
  battleId.value = battleInfo.id;
  battleType.value = battleInfo.config.mode;
  step.value = 2;
@@ -169,6 +173,7 @@ onLoad(async (options) => {
      }
    });
    if (battleInfo.status === 2) {
+      startCount.value = true;
      const remain = Date.now() / 1000 - battleInfo.startTime;
      console.log(`当前局已进行${remain}秒`);
      tips.value = battleInfo.halfGame
@@ -186,6 +191,14 @@ onLoad(async (options) => {
    }
  }
 }
+
+onLoad(async (options) => {
+  if (options.battleId) {
+    const battleInfo = uni.getStorageSync("current-battle");
+    if (battleInfo) {
+      recoverData(battleInfo);
+      uni.removeStorageSync("last-awake-time");
+    }
  }
  if (options.roomNumber) {
    roomNumber.value = options.roomNumber;
@@ -439,6 +452,7 @@ async function onReceiveMessage(messages = []) {
          ...msg.groupUserStatus.blueTeam,
        ].forEach((player) => {
          playersScores.value[player.id] = player.arrows;
+          if (p.id === user.value.id) scores.value = [...p.arrows];
        });
        startCount.value = false;
        halfTimeTip.value = true;
@@ -453,11 +467,17 @@ async function onReceiveMessage(messages = []) {
          });
          uni.navigateBack();
        } else {
+          isEnded.value = true;
          uni.redirectTo({
            url: `/pages/battle-result?battleId=${msg.id}`,
          });
        }
      }
+      if (msg.constructor === MESSAGETYPES.BackToGame) {
+        if (msg.battleInfo && uni.getStorageSync("last-awake-time")) {
+          recoverData(msg.battleInfo);
+        }
+      }
    }
  });
 }
@@ -503,6 +523,16 @@ onUnmounted(() => {
    exitRoomAPI(roomNumber.value);
  }
 });
+onShow(async () => {
+  if (battleId.value) {
+    if (!isEnded.value && (await isGameEnded())) return;
+    const lastAwakeTime = uni.getStorageSync("last-awake-time");
+    if (lastAwakeTime) await getCurrentGameAPI();
+  }
+});
+onHide(() => {
+  uni.setStorageSync("last-awake-time", Date.now());
+});
 </script>

 <template>
--- a/src/pages/melee-match.vue
+++ b/src/pages/melee-match.vue
@@ -13,7 +13,8 @@ import Avatar from "@/components/Avatar.vue";
 import ScreenHint from "@/components/ScreenHint.vue";
 import Matching from "@/components/Matching.vue";
 import TestDistance from "@/components/TestDistance.vue";
-import { matchGameAPI } from "@/apis";
+import { getCurrentGameAPI, matchGameAPI } from "@/apis";
+import { isGameEnded } from "@/util";
 import { MESSAGETYPES, getMessageTypeName } from "@/constants";
 import useStore from "@/store";
 import { storeToRefs } from "pinia";
@@ -34,6 +35,7 @@ const playersSorted = ref([]);
 const playersScores = ref({});
 const halfTimeTip = ref(false);
 const onComplete = ref(null);
+const isEnded = ref(false);

 watch(
  () => [players.value, playersScores.value],
@@ -50,11 +52,7 @@ watch(
  }
 );

-onLoad(async (options) => {
-  if (options.battleId) {
-    const battleInfo = uni.getStorageSync("current-battle");
-    console.log("----battleInfo", battleInfo);
-    if (battleInfo) {
+function recoverData(battleInfo) {
  battleId.value = battleInfo.id;
  players.value = [...battleInfo.blueTeam, ...battleInfo.redTeam];
  players.value.forEach((p) => {
@@ -75,6 +73,7 @@ onLoad(async (options) => {
    start.value = true;
  }
  if (battleInfo.status === 2) {
+    startCount.value = true;
    // 这里的开始时间不是游戏开始时间，而是上半场或者下半场或者中场的开始时间，还要根据状态来判断
    tips.value = battleInfo.halfGame
      ? "下半场：请再射6箭"
@@ -90,6 +89,15 @@ onLoad(async (options) => {
    }, 200);
  }
 }
+
+onLoad(async (options) => {
+  if (options.battleId) {
+    const battleInfo = uni.getStorageSync("current-battle");
+    if (battleInfo) {
+      recoverData(battleInfo);
+      console.log("remove last time");
+      uni.removeStorageSync("last-awake-time");
+    }
  } else {
    gameType.value = options.gameType;
    teamSize.value = options.teamSize;
@@ -148,6 +156,7 @@ async function onReceiveMessage(messages = []) {
      [...msg.groupUserStatus.redTeam, ...msg.groupUserStatus.blueTeam].forEach(
        (player) => {
          playersScores.value[player.id] = player.arrows;
+          if (p.id === user.value.id) scores.value = [...p.arrows];
        }
      );
      startCount.value = false;
@@ -163,11 +172,17 @@ async function onReceiveMessage(messages = []) {
        });
        uni.navigateBack();
      } else {
+        isEnded.value = true;
        uni.redirectTo({
          url: `/pages/battle-result?battleId=${msg.id}`,
        });
      }
    }
+    if (msg.constructor === MESSAGETYPES.BackToGame) {
+      if (msg.battleInfo && uni.getStorageSync("last-awake-time")) {
+        recoverData(msg.battleInfo);
+      }
+    }
  });
 }
 const onBack = () => {
@@ -177,7 +192,6 @@ const onBack = () => {
    uni.$showHint(3);
  }
 };
-onShow(() => {});
 onMounted(() => {
  uni.setKeepScreenOn({
    keepScreenOn: true,
@@ -193,6 +207,16 @@ onUnmounted(() => {
    matchGameAPI(false, gameType.value, teamSize.value);
  }
 });
+onShow(async () => {
+  if (battleId.value) {
+    if (!isEnded.value && (await isGameEnded())) return;
+    const lastAwakeTime = uni.getStorageSync("last-awake-time");
+    if (lastAwakeTime) await getCurrentGameAPI();
+  }
+});
+onHide(() => {
+  uni.setStorageSync("last-awake-time", Date.now());
+});
 </script>

 <template>
--- a/src/pages/team-match.vue
+++ b/src/pages/team-match.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { ref, onMounted, onUnmounted } from "vue";
-import { onLoad } from "@dcloudio/uni-app";
+import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import BattleHeader from "@/components/BattleHeader.vue";
 import Guide from "@/components/Guide.vue";
@@ -14,7 +14,8 @@ import SButton from "@/components/SButton.vue";
 import Matching from "@/components/Matching.vue";
 import RoundEndTip from "@/components/RoundEndTip.vue";
 import TestDistance from "@/components/TestDistance.vue";
-import { matchGameAPI } from "@/apis";
+import { getCurrentGameAPI, matchGameAPI } from "@/apis";
+import { isGameEnded } from "@/util";
 import { MESSAGETYPES, roundsName, getMessageTypeName } from "@/constants";
 import useStore from "@/store";
 import { storeToRefs } from "pinia";
@@ -42,12 +43,9 @@ const bluePoints = ref(0);
 const showRoundTip = ref(false);
 const onComplete = ref(null);
 const isFinalShoot = ref(false);
+const isEnded = ref(false);

-onLoad(async (options) => {
-  if (options.battleId) {
-    const battleInfo = uni.getStorageSync("current-battle");
-    console.log("----battleInfo", battleInfo);
-    if (battleInfo) {
+function recoverData(battleInfo) {
  battleId.value = battleInfo.id;
  redTeam.value = battleInfo.redTeam;
  blueTeam.value = battleInfo.blueTeam;
@@ -125,6 +123,12 @@ onLoad(async (options) => {
    }
  }
 }
+
+onLoad(async (options) => {
+  if (options.battleId) {
+    const battleInfo = uni.getStorageSync("current-battle");
+    if (battleInfo) recoverData(battleInfo);
+    uni.removeStorageSync("last-awake-time");
  } else {
    gameType.value = options.gameType;
    teamSize.value = options.teamSize;
@@ -235,11 +239,17 @@ async function onReceiveMessage(messages = []) {
        });
        uni.navigateBack();
      } else {
+        isEnded.value = true;
        uni.redirectTo({
          url: `/pages/battle-result?battleId=${msg.id}`,
        });
      }
    }
+    if (msg.constructor === MESSAGETYPES.BackToGame) {
+      if (msg.battleInfo && uni.getStorageSync("last-awake-time")) {
+        recoverData(msg.battleInfo);
+      }
+    }
  });
 }
 const onBack = () => {
@@ -264,6 +274,16 @@ onUnmounted(() => {
    matchGameAPI(false, gameType.value, teamSize.value);
  }
 });
+onShow(async () => {
+  if (battleId.value) {
+    if (!isEnded.value && (await isGameEnded())) return;
+    const lastAwakeTime = uni.getStorageSync("last-awake-time");
+    if (lastAwakeTime) await getCurrentGameAPI();
+  }
+});
+onHide(() => {
+  uni.setStorageSync("last-awake-time", Date.now());
+});
 </script>

 <template>
--- a/src/util.js
+++ b/src/util.js
@@ -1,4 +1,5 @@
 import websocket from "@/websocket";
+import { isGamingAPI } from "@/apis";

 export const formatTimestamp = (timestamp) => {
  const date = new Date(timestamp * 1000);
@@ -264,3 +265,17 @@ export const wxShare = async () => {
    });
  }
 };
+
+export const isGameEnded = async () => {
+  const isGaming = await isGamingAPI();
+  if (!isGaming) {
+    uni.showToast({
+      title: "比赛已结束",
+      icon: "none",
+    });
+    setTimeout(() => {
+      uni.navigateBack();
+    }, 1000);
+  }
+  return !isGaming;
+};
--- a/src/websocket.js
+++ b/src/websocket.js
@@ -28,8 +28,18 @@ function createWebSocket(token, onMessage) {
    const msg = data.data.updates[0];
    if (!msg) return;
    if (msg.constructor === MESSAGETYPES.BackToGame) {
+      const pages = getCurrentPages();
+      const currentPage = pages[pages.length - 1];
+      if (
+        currentPage.route === "pages/battle-room" ||
+        currentPage.route === "pages/team-match" ||
+        currentPage.route === "pages/melee-match"
+      ) {
+        return;
+      }
      const { battleInfo } = msg;
      uni.setStorageSync("current-battle", battleInfo);
+      console.log("----battleInfo", battleInfo);
      // 约战
      if (battleInfo.config.battleMode === 1) {
        uni.navigateTo({