diff --git a/src/apis.js b/src/apis.js index 8780cae..801f502 100644 --- a/src/apis.js +++ b/src/apis.js @@ -126,28 +126,40 @@ export const getGameAPI = async (battleId) => { }); const { battleStats = {}, playerStats = {} } = result; const data = { - winner: battleStats.winner, - redTotal: battleStats.redTotal, - blueTotal: battleStats.blueTotal, - roundsData: {}, - redPlayers: {}, - bluePlayers: {}, + mode: battleStats.mode, }; - playerStats.forEach((item) => { - const { playerBattleStats = {}, roundRecords = [] } = item; - if (playerBattleStats.team === 0) { - data.redPlayers[playerBattleStats.playerId] = playerBattleStats; - } - if (playerBattleStats.team === 1) { - data.bluePlayers[playerBattleStats.playerId] = playerBattleStats; - } - roundRecords.forEach((round) => { - data.roundsData[round.roundNumber] = { - ...data.roundsData[round.roundNumber], - [round.playerId]: round.arrowHistory, - }; + if (battleStats.mode === 1) { + data.winner = battleStats.winner; + data.redTotal = battleStats.redTotal; + data.blueTotal = battleStats.blueTotal; + data.roundsData = {}; + data.redPlayers = {}; + data.bluePlayers = {}; + playerStats.forEach((item) => { + const { playerBattleStats = {}, roundRecords = [] } = item; + if (playerBattleStats.team === 0) { + data.redPlayers[playerBattleStats.playerId] = playerBattleStats; + } + if (playerBattleStats.team === 1) { + data.bluePlayers[playerBattleStats.playerId] = playerBattleStats; + } + roundRecords.forEach((round) => { + data.roundsData[round.roundNumber] = { + ...data.roundsData[round.roundNumber], + [round.playerId]: round.arrowHistory, + }; + }); }); - }); + } + if (battleStats.mode === 2) { + data.players = []; + playerStats.forEach((item) => { + data.players.push({ + ...item.playerBattleStats, + arrowHistory: item.roundRecords[0].arrowHistory, + }) + }); + } console.log("game result:", result); console.log("format data:", data); return data; diff --git a/src/components/MeleeResult.vue b/src/components/MeleeResult.vue index ef21608..2eebb4c 100644 --- a/src/components/MeleeResult.vue +++ b/src/components/MeleeResult.vue @@ -1,7 +1,12 @@ @@ -52,6 +58,7 @@ const rowCount = new Array(6).fill(0); } .container > image:first-child { width: 30px; + height: 30px; border: 1px solid #fff3; border-radius: 50%; margin-right: 10px; @@ -80,7 +87,7 @@ const rowCount = new Array(6).fill(0); border-bottom: 1px solid #fff3; } .container > text:nth-child(4) { - width: 50px; + width: 40px; text-align: right; } diff --git a/src/constants.js b/src/constants.js index 8d2be92..fd052f5 100644 --- a/src/constants.js +++ b/src/constants.js @@ -3,6 +3,7 @@ export const MESSAGETYPES = { ShootSyncMePracticeID: parseInt("0xD88AE05E"), // 3632980062 WaitForAllReady: parseInt("0x615C13BE"), // 1633424318 AllReady: parseInt("0x1CCB49FD"), // 483084797 + MeleeAllReady: parseInt("0x37132BD5"), // 924003285 ShootResult: parseInt("0xAA0795E2"), // 2852623842 CurrentRoundEnded: parseInt("0x3E2CE041"), // 1043128385 ToSomeoneShoot: parseInt("0x077ACD1A"), // 125488410 diff --git a/src/pages/battle-result.vue b/src/pages/battle-result.vue index 648f118..601a943 100644 --- a/src/pages/battle-result.vue +++ b/src/pages/battle-result.vue @@ -4,6 +4,7 @@ import { onLoad } from "@dcloudio/uni-app"; import { getGameAPI } from "@/apis"; import TeamResult from "@/components/TeamResult.vue"; import MeleeResult from "@/components/MeleeResult.vue"; +import Avatar from "@/components/Avatar.vue"; import useStore from "@/store"; import { storeToRefs } from "pinia"; const store = useStore(); @@ -18,14 +19,15 @@ const show = ref(false); onLoad(async (options) => { battleId.value = options.battleId; const result = await getGameAPI( - options.battleId || "BATTLE-1749386862250435325-854" + // options.battleId || "BATTLE-1749386862250435325-854" + options.battleId || "BATTLE-1749397329251504706-197" ); data.value = result; - if (result.redPlayers[user.value.id]) { + if (result.mode === 1 && result.redPlayers[user.value.id]) { totalPoints.value = result.redTotal; ifWin.value = result.winner === 0; } - if (result.bluePlayers[user.value.id]) { + if (result.mode === 1 && result.bluePlayers[user.value.id]) { totalPoints.value = result.redTotal; ifWin.value = result.winner === 1; } @@ -44,26 +46,98 @@ onMounted(async () => {}); src="../static/winner-yellow.png" mode="widthFix" /> - - - - - - - {{ ifWin && data.winner === 1 ? "蓝队" : "红队" }}获胜 - 强势登顶，荣耀加冕 - - + + + + + + + + {{ ifWin && data.winner === 1 ? "蓝队" : "红队" }}获胜 + 强势登顶，荣耀加冕 + + + + + + + + + + + + + + + + + {{ index + 1 }} + + + {{ player.name }} + 钻石三级 + + {{ player.totalRings }} + 环 + + + + 经验 +{{ totalPoints }} - 你是朋友中的佼佼者哦 - + 你是朋友中的佼佼者哦 + 好成绩！全国排位赛等着你！ + 查看靶纸 退出 - - + + @@ -77,6 +151,7 @@ onMounted(async () => {}); flex-direction: column; align-items: center; justify-content: center; + /* z-index: -1; */ } .tag { position: absolute; @@ -87,14 +162,14 @@ onMounted(async () => {}); .container > view { position: relative; } -.container > view:nth-child(2) { +.header-team { width: 80%; margin: 10px; } -.container > view:nth-child(2) > image { +.header-team > image { width: 20vw; } -.container > view:nth-child(3) { +.battle-winner { width: 100%; height: 38%; display: flex; @@ -104,32 +179,32 @@ onMounted(async () => {}); color: #fff9; font-size: 14px; } -.container > view:nth-child(3) > image { +.battle-winner > image { position: absolute; width: 100vw; top: 0; left: 0; } -.container > view:nth-child(3) > image:nth-child(2) { +.battle-winner > image:nth-child(2) { top: 6vw; } -.container > view:nth-child(3) > text:nth-child(3) { +.battle-winner > text:nth-child(3) { font-size: 30px; margin: 10px; font-weight: bold; color: #fed847; } -.container > view:nth-child(4) { +.battle-e { width: 100%; height: 60px; margin: 20px 0; } -.container > view:nth-child(4) > image { +.battle-e > image { position: absolute; width: 100vw; top: 45%; } -.container > view:nth-child(4) > text { +.battle-e > text { position: absolute; width: 100%; font-size: 30px; @@ -137,19 +212,19 @@ onMounted(async () => {}); text-align: center; top: 54%; } -.container > text:nth-child(5) { +.description { margin: 50px 0; font-size: 14px; color: #fed847; width: 100%; text-align: center; } -.container > view:nth-child(6) { +.op-btn { width: 100%; display: flex; justify-content: center; } -.container > view:nth-child(6) > view { +.op-btn > view { width: 36%; margin: 0 10px; background-color: #fed847; @@ -157,8 +232,85 @@ onMounted(async () => {}); padding: 10px 0; text-align: center; } -.container > view:nth-child(6) > view:last-child { +.op-btn > view:last-child { color: #fff; background-color: #757575; } +.header-melee { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + margin-bottom: 30px; +} +.header-melee > view { + height: 1px; + background-color: #fff3; + width: 18%; +} +.header-melee > image { + width: 27%; + margin: 0 20px; +} +.players { + color: #fff3; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + width: calc(100% - 60px); + height: 300px; + margin: 0 30px; +} +.players > view { + width: 100%; + height: 60px; + flex: 0 0 auto; + overflow: hidden; + position: relative; + background-color: #ffffff1a; + display: flex; + align-items: center; +} +.player-bg { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; +} +.player-bg { + position: absolute; + width: 100%; + top: 0; + left: 0; + z-index: -1; +} +.player-crown { + width: 27px; + margin: 0 15px; +} +.view-crown { + width: 27px; + height: 27px; + line-height: 27px; + text-align: center; + border-radius: 50%; + margin: 0 15px; + color: #fff; + background-color: #676767; +} +.player-title { + display: flex; + flex-direction: column; + margin-left: 15px; + width: calc(100% - 160px); +} +.player-title > text:first-child { + color: #fff; + margin-bottom: 3px; +} +.player-title > text:last-child { + font-size: 13px; +} diff --git a/src/pages/melee-match.vue b/src/pages/melee-match.vue index d7ee6f6..acd6f11 100644 --- a/src/pages/melee-match.vue +++ b/src/pages/melee-match.vue @@ -6,10 +6,14 @@ import BowTarget from "@/components/BowTarget.vue"; import ShootProgress from "@/components/ShootProgress.vue"; import PlayersRow from "@/components/PlayersRow.vue"; import Timer from "@/components/Timer.vue"; -import BattleFooter from "@/components/BattleFooter.vue"; +import PlayerScore from "@/components/PlayerScore.vue"; import SButton from "@/components/SButton.vue"; import { matchGameAPI, readyGameAPI } from "@/apis"; -import { MESSAGETYPES, roundsName } from "@/constants"; +import { MESSAGETYPES } from "@/constants"; +import useStore from "@/store"; +import { storeToRefs } from "pinia"; +const store = useStore(); +const { user } = storeToRefs(store); const gameType = ref(0); const teamSize = ref(0); const matching = ref(false); @@ -19,14 +23,10 @@ const currentRound = ref(1); const totalRounds = ref(0); const power = ref(0); const scores = ref([]); -const redTeam = ref([]); -const blueTeam = ref([]); -const currentShooterId = ref(0); const tips = ref("即将开始..."); -const seq = ref(0); const timerSeq = ref(0); -const roundResults = ref([ -]); +const players = ref([]); +const playersScores = ref({}); onLoad((options) => { gameType.value = options.gameType; @@ -66,41 +66,36 @@ async function onReceiveMessage(content) { // 这里会掉多次; timerSeq.value += 1; battleId.value = msg.id; - redTeam.value = msg.groupUserStatus.redTeam; - blueTeam.value = msg.groupUserStatus.blueTeam; - totalRounds.value = msg.groupUserStatus.config.maxRounds; + players.value = [ + ...msg.groupUserStatus.redTeam, + ...msg.groupUserStatus.blueTeam, + ]; + players.value.forEach((p) => { + playersScores.value[p.id] = []; + }); + } + if (!start.value && msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) { + scores.value.push(msg.target); + power.value = msg.target.battery; } if (msg.id !== battleId.value) return; - if (msg.constructor === MESSAGETYPES.AllReady) { + if (msg.constructor === MESSAGETYPES.MeleeAllReady) { + totalRounds.value = msg.groupUserStatus.config.maxRounds; start.value = true; timerSeq.value = 0; - } - if (msg.constructor === MESSAGETYPES.ToSomeoneShoot) { + tips.value = "请在90秒内射完12支箭"; scores.value = []; - seq.value += 1; - currentShooterId.value = msg.userId; - if (redTeam.value[0].id === currentShooterId.value) { - tips.value = `请红队射箭-第${roundsName[currentRound.value]}轮`; - } else { - tips.value = `请蓝队射箭-第${roundsName[currentRound.value]}轮`; - } } if (msg.constructor === MESSAGETYPES.ShootResult) { - scores.value = [msg.target]; - } - if (msg.constructor === MESSAGETYPES.CurrentRoundEnded) { - const result = msg.preRoundResult; - scores.value = []; - currentShooterId.value = 0; - if (result.currentRound > 0 && result.currentRound < totalRounds.value) { - // 开始下一轮; - roundResults.value = result.roundResults; - currentRound.value = result.currentRound + 1; + if (msg.userId === user.value.id) { + scores.value = [msg.target]; + power.value = msg.target.battery; } + playersScores.value[msg.userId].push(msg.target); } if (msg.constructor === MESSAGETYPES.MatchOver) { uni.redirectTo({ - url: "/pages/battle-result?battleId=" + msg.id, + url: `/pages/battle-result?battleId=${msg.id}&winner=${msg.endStatus.winner}&gameType=${gameType.value}`, }); } }); @@ -117,25 +112,29 @@ onUnmounted(() => {