From 5504e96696e5c21bdc9ee5530f2a66eb8223f9dd Mon Sep 17 00:00:00 2001
From: hsyhhssyy <hsyhhssyy@gmail.com>
Date: Sat, 22 Jun 2024 14:17:38 +0000
Subject: [PATCH] store

---
 src/desktop/views/room/WaitingRoomBase.vue |  8 ++
 src/mobile/components/ChatBoard.vue        |  4 +-
 src/mobile/views/GameBase.vue              |  3 +
 src/mobile/views/game/CypherChallenge.vue  | 85 +++++++++-------------
 src/mobile/views/game/SchulteGrid.vue      |  6 ++
 src/mobile/views/game/SkinGuess.vue        | 10 +++
 src/mobile/views/room/WaitingRoomBase.vue  | 34 +++++++--
 7 files changed, 91 insertions(+), 59 deletions(-)

diff --git a/src/desktop/views/room/WaitingRoomBase.vue b/src/desktop/views/room/WaitingRoomBase.vue
index 4ef7fb3..3e7bd01 100644
--- a/src/desktop/views/room/WaitingRoomBase.vue
+++ b/src/desktop/views/room/WaitingRoomBase.vue
@@ -190,6 +190,10 @@ async function gameStartedListener(response: SignalrResponse) {
         return
     }
 
+    await jumpToGameRoom()
+}
+
+async function jumpToGameRoom(){
     if (gameRoomData.value?.gameType) {
         const gameData = gameTypeMap.value[gameRoomData.value?.gameType]
         await router.push(gameData.route + "game/" + roomId)
@@ -258,7 +262,11 @@ watch(
 )
 
 onMounted(async () => {
+    gameRoomData.value = await getGame(roomId)
 
+    if(gameRoomData.value?.isStarted) {
+        await jumpToGameRoom()
+    }
 })
 
 onUnmounted(async () => {
diff --git a/src/mobile/components/ChatBoard.vue b/src/mobile/components/ChatBoard.vue
index c0ce3de..810b919 100644
--- a/src/mobile/components/ChatBoard.vue
+++ b/src/mobile/components/ChatBoard.vue
@@ -127,7 +127,9 @@ async function sendMessage() {
     inputMessage.value = ''
 }
 
-async function chatListener(response: SignalrResponse) {
+async function chatListener(response: SignalrResponse) {    
+    if (response.GameId != props.roomId) return //多标签页环境可能出现多个房间同开的情况
+
     const player = props.players.find((p) => p.id === response.UserId)
     if (player) {
 
diff --git a/src/mobile/views/GameBase.vue b/src/mobile/views/GameBase.vue
index 639a964..e00dc30 100644
--- a/src/mobile/views/GameBase.vue
+++ b/src/mobile/views/GameBase.vue
@@ -79,6 +79,7 @@ async function endGame(){
 }
 
 function gameCompletedListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
     isCompleted.value = true
 }
 
@@ -87,6 +88,8 @@ async function gameClosedListener(response: SignalrResponse) {
 }
 
 function gameInfoListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+    
     gameInfoData.value = response;
     if (isGameInfoReceiving.value == true) {
         isGameInfoReceiving.value = false
diff --git a/src/mobile/views/game/CypherChallenge.vue b/src/mobile/views/game/CypherChallenge.vue
index bba593e..8fa8d03 100644
--- a/src/mobile/views/game/CypherChallenge.vue
+++ b/src/mobile/views/game/CypherChallenge.vue
@@ -1,42 +1,40 @@
 <template>
     <game-base ref="base" :room-id="roomId" :input-handler="sendMove" :players="players" @on-loaded="load">
         <div style="height: 100%" class="game-card">
-            <n-modal v-model:show="settlementDialogShown" :mask-closable="false">
-                <div class="overlay-card">
-                    <n-flex justify="center">
-                        <div class="correct-answer">
-                            正确答案：{{ lastQuestion?.CharacterName }}
-                        </div>
-                    </n-flex>
-                    <result-table :currentQuestion="lastQuestion" :playersMap="playersMap" :headers="headers"
-                        :showAnswer="true"></result-table>
-                    <next-question :room-id="roomId" :active="settlementCountdownActive"
-                        @on-next-question="moveToNextQuestion" :show-close="true"
-                        @on-close-result-popup="closeResultPopup" :game="game" :players="players"></next-question>
-
-                </div>
-            </n-modal>
-            <div>
-                <div class="game-panel">
-                    <hit-effect ref="hit"></hit-effect>
-                    <div class="game-body">
-                        <div :bordered="false" size="small" class="answer-list">
-                            <!-- <icon-button :icon="SendOne" type="success" @click="test">test</icon-button> -->
-                            <div class="property-revealed">
-                                <div v-for="header in headers" class="property-header">
-                                    <div class="property-value">
-                                        {{ header + ":" }} {{ currentQuestion.CharacterProperties[header] || '???' }}
-                                    </div>
+            <hit-effect ref="hit"></hit-effect>
+            <div class="game-panel" :style="{ 'display': settlementDialogShown ? 'flex' : 'none' }">
+                <n-flex justify="center">
+                    <div class="correct-answer">
+                        正确答案：{{ lastQuestion?.CharacterName }}
+                    </div>
+                </n-flex>
+                <result-table :currentQuestion="lastQuestion" :playersMap="playersMap" :headers="headers"
+                    :showAnswer="true"></result-table>
+                <next-question :room-id="roomId" :active="settlementCountdownActive"
+                        @on-next-question="moveToNextQuestion" :show-close="false" 
+                        :game="game" :players="players"></next-question>
+            </div>
+            <div class="game-panel" :style="{ 'display': !settlementDialogShown ? 'flex' : 'none' }">
+                <div class="game-body">
+                    <div :bordered="false" size="small" class="answer-list">
+                        <!-- <icon-button :icon="SendOne" type="success" @click="test">test</icon-button> -->
+                        <div class="property-revealed">
+                            <div v-for="header in headers" class="property-header">
+                                <div class="property-value" v-if="header!=='未知线索'">
+                                    {{ currentQuestion.CharacterProperties[header] || '???' }}
+                                </div>
+                                <div class="property-value" v-if="header==='未知线索'">
+                                    {{ header }} : ???
                                 </div>
                             </div>
                         </div>
-                        <result-table :currentQuestion="currentQuestion" :playersMap="playersMap" :headers="headers"
-                            :showAnswer="false"></result-table>
-
                     </div>
+                    <result-table :currentQuestion="currentQuestion" :playersMap="playersMap" :headers="headers"
+                        :showAnswer="false"></result-table>
+
                 </div>
             </div>
-            <div style="display: hidden;">
+            <div style="display: none;">
                 <amiya-face @on-hit="onFaceHit"></amiya-face>
             </div>
         </div>
@@ -181,6 +179,8 @@ function sendMove(content: string) {
 }
 
 function receiveMoveListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     const player = players.value.find((p) => p.id === response.Payload.PlayerId)
 
     if (response.Game) {
@@ -214,6 +214,8 @@ function receiveMoveListener(response: SignalrResponse) {
 }
 
 function gameInfoListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     if (response.Game) {
         game.value = response.Game
     }
@@ -229,6 +231,8 @@ function gameInfoListener(response: SignalrResponse) {
 }
 
 function gameCompletedListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     game.value = response.Game
     prepareNextQuestion()
 }
@@ -254,14 +258,13 @@ onUnmounted(() => {
 </script>
 
 <style lang="scss" scoped>
-$guideHeight: 160px;
 
 .game-card {
     position: relative;
     overflow: hidden;
 
     .game-panel {
-        height: calc(100% - $guideHeight);
+        height: 100%;
         background: url(@/assets/images/cypherChallenge/loading.jpg) center / cover no-repeat;
         border-radius: 4px;
         padding: 5px 5px;
@@ -321,24 +324,6 @@ $guideHeight: 160px;
 
         }
     }
-
-    .game-guide {
-        height: $guideHeight;
-        display: flex;
-        align-items: flex-end;
-        padding-bottom: 30px;
-
-        .amiya-face {
-            width: 120px;
-            height: 100%;
-            background: center bottom / 100% no-repeat;
-            margin-right: 10px;
-        }
-
-        .amiya-chat {
-            height: fit-content;
-        }
-    }
 }
 
 .overlay-card {
diff --git a/src/mobile/views/game/SchulteGrid.vue b/src/mobile/views/game/SchulteGrid.vue
index 369152d..b6d46b2 100644
--- a/src/mobile/views/game/SchulteGrid.vue
+++ b/src/mobile/views/game/SchulteGrid.vue
@@ -94,6 +94,8 @@ async function sendMove(content: string) {
 }
 
 function receiveMoveListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     const player = players.value.find((p) => p.id === response.Payload.PlayerId)
     const result = response.Payload.Result
     const characterName = response.Payload.CharacterName
@@ -171,6 +173,8 @@ function receiveMoveListener(response: SignalrResponse) {
 
 
 function gameCompletedListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     const answers = response.Payload.RemainingAnswers
     if (isCompleted.value === false) {
         isCompleted.value = true
@@ -212,6 +216,8 @@ function pushRemainingAnswers(answers: any) {
 }
 
 async function gameInfoListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+    
     if (expandedData.value.length == 0) {
         const grid = response.Payload.Grid
         if (grid.length > 0) {
diff --git a/src/mobile/views/game/SkinGuess.vue b/src/mobile/views/game/SkinGuess.vue
index 0afacb5..5d91527 100644
--- a/src/mobile/views/game/SkinGuess.vue
+++ b/src/mobile/views/game/SkinGuess.vue
@@ -372,6 +372,8 @@ function sendMove(content: string) {
 }
 
 const hintListener = (response: any) => {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     questionList.value[response.Payload.CurrentQuestionIndex].HintLevel = response.Payload.HintLevel;
     updateImage();
 
@@ -385,6 +387,8 @@ const hintListener = (response: any) => {
 }
 
 const giveUpListener = (response: any) => {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     base.value.pushMessage({
         userId: response.Payload.PlayerId,
         content: '房主选择放弃本题',
@@ -400,6 +404,8 @@ const giveUpListener = (response: any) => {
 }
 
 function receiveMoveListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     const player = players.value.find((p) => p.id === response.Payload.PlayerId)
 
     if (response.Game) {
@@ -425,6 +431,8 @@ function receiveMoveListener(response: SignalrResponse) {
 }
 
 function gameInfoListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     if (response.Game) {
         game.value = response.Game
     }
@@ -440,6 +448,8 @@ function gameInfoListener(response: SignalrResponse) {
 }
 
 function gameCompletedListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+    
     game.value = response.Game
     prepareNextQuestion()
 }
diff --git a/src/mobile/views/room/WaitingRoomBase.vue b/src/mobile/views/room/WaitingRoomBase.vue
index 8d6e73c..9b123ac 100644
--- a/src/mobile/views/room/WaitingRoomBase.vue
+++ b/src/mobile/views/room/WaitingRoomBase.vue
@@ -111,7 +111,16 @@ watch( computed(() => props.settings), (value:any) => {
 
 let getGameInterval: any = null
 
+async function jumpToGameRoom(){
+    if (gameRoomData.value?.gameType) {
+        const gameData = gameTypeMap.value[gameRoomData.value?.gameType]
+        await router.push(gameData.route + "game/" + roomId)
+    }
+}
+
 async function gameInfoListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     const playerList = response.PlayerList
 
     isHost.value = response.Game.CreatorId == userId
@@ -126,7 +135,7 @@ async function gameInfoListener(response: SignalrResponse) {
     })
 
     if (response.Game.IsStarted) {
-        await gameStartedListener()
+        await jumpToGameRoom()
     }
 }
 
@@ -135,6 +144,8 @@ async function playerJoinedListener() {
 }
 
 async function playerLeftListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     const playerId = response.LeavingPlayerId
     const method = response.LeavingMethod
 
@@ -147,19 +158,22 @@ async function playerLeftListener(response: SignalrResponse) {
 }
 
 async function gameSettingsChangedListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
     const settings = response.Settings
     emits('onSettingsLoaded', settings)
 }
 
-async function gameStartedListener() {
-    if (gameRoomData.value?.gameType) {
-        const gameData = gameTypeMap.value[gameRoomData.value?.gameType]
-        await router.push(gameData.route + "game/" + roomId)
-    }
+async function gameStartedListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
+    await jumpToGameRoom()
 }
 
-async function gameClosedListener() {
-    await toast('房间已关闭', 'warning')
+async function gameClosedListener(response: SignalrResponse) {
+    if (response.Game.Id != roomId) return //多标签页环境可能出现多个房间同开的情况
+
+    await toast('房间已被关闭', 'warning')
     await router.push('/regular-home')
 }
 
@@ -214,6 +228,10 @@ watch(
 
 onMounted(async () => {
     gameRoomData.value = await getGame(roomId)
+
+    if(gameRoomData.value?.isStarted) {
+        await jumpToGameRoom()
+    }
 })
 
 onUnmounted(async () => {