laoma/shoot-miniprograms
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: laoma:new-race-mode
Branches Tags
laoma:main laoma:select-target laoma:new-race-mode laoma:development laoma:new-home laoma:ios-ui laoma:feature-points-book laoma:feature-xvx
..
compare: laoma:development
Branches Tags
laoma:select-target laoma:new-race-mode laoma:development laoma:new-home laoma:ios-ui laoma:feature-points-book laoma:feature-xvx laoma:main

1 Commits
new-race-m ... developmen

Author SHA1 Message Date
kron
75c7df0e9c fix bug 2026-01-15 15:51:16 +08:00
59 changed files with 2018 additions and 1374 deletions
Expand all files Collapse all files

3
.vscode/settings.json vendored
View File

@@ -1,3 +0,0 @@
{
"i18n-ally.localesPaths": []
}

144
src/apis.js
View File

@@ -6,7 +6,7 @@ try {
switch (envVersion) {
case "develop": // 开发版
// BASE_URL = "http://192.168.1.30:8000/api/shoot";
// BASE_URL = "http://192.168.1.242:8000/api/shoot";
BASE_URL = "https://apitest.shelingxingqiu.com/api/shoot";
break;
case "trial": // 体验版
@@ -196,23 +196,18 @@ export const getMyDevicesAPI = () => {
return request("GET", "/user/device/getBindings");
};
export const createPractiseAPI = (arrows, time) => {
export const createPractiseAPI = (arrows, mode) => {
return request("POST", "/user/practice/create", {
shootNumber: arrows,
shootTime: time,
arrows,
mode,
});
};
export const startPractiseAPI = () => {
return request("POST", "/user/practice/begin");
};
export const endPractiseAPI = () => {
return request("POST", "/user/practice/stop");
};
export const getPractiseAPI = async (id) => {
return request("GET", `/user/practice/get?id=${id}`);
const result = await request("GET", `/user/practice/get?id=${id}`);
const data = { ...(result.UserPracticeRound || {}) };
if (data.arrows) data.arrows = JSON.parse(data.arrows);
return data;
};
export const createRoomAPI = (gameType, teamSize) => {
@@ -260,7 +255,6 @@ export const matchGameAPI = (match, gameType, teamSize) => {
match,
gameType,
teamSize,
readyTime: 1.5,
});
};
@@ -270,6 +264,78 @@ export const readyGameAPI = (battleId) => {
});
};
export const getGameAPI = async (battleId) => {
const result = await request("POST", "/user/battle/detail", {
id: battleId,
});
if (!result.battleStats) return {};
const {
battleStats = {},
playerStats = {},
goldenRoundRecords = [],
} = result;
const data = {
id: battleId,
mode: battleStats.mode, // 1.几V几 2.大乱斗
gameMode: battleStats.gameMode, // 1.约战 2.排位
teamSize: battleStats.teamSize,
};
if (battleStats && battleStats.mode === 1) {
data.winner = battleStats.winner;
data.roundsData = {};
data.redPlayers = {};
data.bluePlayers = {};
data.mvps = [];
data.goldenRounds =
goldenRoundRecords && goldenRoundRecords.length ? goldenRoundRecords : [];
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;
}
if (playerBattleStats.mvp) {
data.mvps.push(playerBattleStats);
}
roundRecords.forEach((round) => {
data.roundsData[round.roundNumber] = {
...data.roundsData[round.roundNumber],
[round.playerId]: round.arrowHistory,
};
});
});
const totalRounds = Object.keys(data.roundsData).length;
(goldenRoundRecords || []).forEach((item, index) => {
item.arrowHistory.forEach((arrow) => {
if (!data.roundsData[totalRounds + index + 1]) {
data.roundsData[totalRounds + index + 1] = {};
}
if (!data.roundsData[totalRounds + index + 1][arrow.playerId]) {
data.roundsData[totalRounds + index + 1][arrow.playerId] = [];
}
data.roundsData[totalRounds + index + 1][arrow.playerId].push(arrow);
});
});
data.mvps.sort((a, b) => b.totalRings - a.totalRings);
}
if (battleStats && battleStats.mode === 2) {
data.players = [];
playerStats.forEach((item) => {
data.players.push({
...item.playerBattleStats,
arrowHistory: item.roundRecords[0].arrowHistory,
});
});
data.players = data.players.sort((a, b) => b.totalScore - a.totalScore);
}
// console.log("game result:", result);
// console.log("format data:", data);
return data;
};
export const simulShootAPI = (device_id, x, y) => {
const data = {
device_id,
@@ -282,12 +348,39 @@ export const simulShootAPI = (device_id, x, y) => {
};
export const getBattleListAPI = async (page, battleType) => {
const data = [];
const result = await request("POST", "/user/battle/details/list", {
page,
pageSize: 10,
battleType,
modeType: 0,
});
return result.list;
(result.Battles || []).forEach((item) => {
let name = "";
if (item.battleStats.mode === 1) {
name = `${item.playerStats.length / 2}V${item.playerStats.length / 2}`;
}
if (item.battleStats.mode === 2) {
name = `${item.playerStats.length}人大乱斗`;
}
data.push({
name,
battleId: item.battleStats.battleId,
mode: item.battleStats.mode,
createdAt: item.battleStats.createdAt,
gameEndAt: item.battleStats.gameEndAt,
winner: item.battleStats.winner,
players: item.playerStats
.map((p) => p.playerBattleStats)
.sort((a, b) => b.totalScore - a.totalScore),
redPlayers: item.playerStats
.filter((p) => p.playerBattleStats.team === 0)
.map((p) => p.playerBattleStats),
bluePlayers: item.playerStats
.filter((p) => p.playerBattleStats.team === 1)
.map((p) => p.playerBattleStats),
});
});
return data;
};
export const getRankListAPI = () => {
@@ -324,6 +417,12 @@ export const getUserGameState = () => {
return request("GET", "/user/state");
};
export const getCurrentGameAPI = async () => {
uni.$emit("update-header-loading", true);
const result = await request("GET", "/user/join/battle");
return result.currentGame || {};
};
export const getPointBookConfigAPI = async () => {
return request("GET", "/user/score/sheet/option");
};
@@ -453,16 +552,3 @@ export const getReadyAPI = (roomId) => {
roomId,
});
};
export const getBattleAPI = async (battleId) => {
return request("POST", "/user/match/info", {
id: battleId,
});
};
export const kickPlayerAPI = (number, userId) => {
return request("POST", "/user/room/kicking", {
number,
userId,
});
};

3
src/audioManager.js
View File

@@ -59,7 +59,6 @@ export const audioFils = {
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxin69nj1xh7yfz.mp3",
"10环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxinnvsx0tt7ksa.mp3",
X环: "https://static.shelingxingqiu.com/attachment/2026-02-09/dga8puwekpe2gmtbu4.mp3",
向上调整:
"https://static.shelingxingqiu.com/attachment/2025-11-12/de6ellf5pfvu3l8dhr.mp3",
向右上调整:
@@ -133,7 +132,7 @@ class AudioManager {
this.localFileCache = uni.getStorageSync("audio_local_files") || {};
// 启动时自动清理过期的缓存文件（URL 已不在 audioFils 中的文件）
this.cleanObsoleteCache();
this.initAudios();
}

14
src/canvas.js
View File

@@ -1,5 +1,3 @@
import { formatTimestamp } from "@/util";
const loadImage = (src) =>
new Promise((resolve, reject) => {
try {
@@ -637,7 +635,7 @@ export function renderScores(ctx, arrows = [], bgImg) {
}
renderText(
ctx,
item.ringX ? "X" : item.ring,
item.ring,
18,
"#fed847",
29.5 + (i % 9) * 30,
@@ -659,7 +657,7 @@ export function renderScores(ctx, arrows = [], bgImg) {
}
renderText(
ctx,
item.ringX ? "X" : item.ring,
item.ring,
23,
"#fed847",
43 + rowIndex * 42,
@@ -739,7 +737,9 @@ export async function sharePractiseData(canvasId, type, user, data) {
let subTitle = "正式开启弓箭手之路";
if (type > 1) {
subTitle = `今日弓箭练习打卡 ${formatTimestamp(data.startTime)}`;
subTitle = `今日弓箭练习打卡 ${data.createdAt
.split(" ")[0]
.replaceAll("-", ".")}`;
}
ctx.drawImage(titleImg, (width - 160) / 2, 160, 160, 40);
@@ -748,14 +748,14 @@ export async function sharePractiseData(canvasId, type, user, data) {
renderText(ctx, subTitle, 18, "#fff", width / 2, 224, "center");
renderText(ctx, "共", 14, "#fff", 122, 300);
const totalRing = data.details.reduce((last, next) => last + next.ring, 0);
const totalRing = data.arrows.reduce((last, next) => last + next.ring, 0);
renderText(ctx, totalRing, 14, "#fed847", 148, 300, "center");
renderText(ctx, "环", 14, "#fff", 161, 300);
renderLine(ctx, 77);
renderLine(ctx, 185);
renderScores(ctx, data.details, scoreBgImg);
renderScores(ctx, data.arrows, scoreBgImg);
ctx.drawImage(qrCodeImg, width * 0.06, height * 0.87, 52, 52);
renderText(ctx, "射灵平台", 12, "#fff", width * 0.26, height * 0.9);

19
src/components/BackToGame.vue
View File

@@ -2,7 +2,7 @@
import { ref, watch, onMounted, onBeforeUnmount } from "vue";
import { onShow } from "@dcloudio/uni-app";
import { getBattleAPI, getUserGameState } from "@/apis";
import { getCurrentGameAPI, getUserGameState } from "@/apis";
import { debounce } from "@/util";
import useStore from "@/store";
@@ -44,21 +44,10 @@ const onClick = debounce(async () => {
if (loading.value) return;
try {
loading.value = true;
const result = await getBattleAPI();
if (result && result.matchId) {
if (game.value.inBattle) {
await uni.$checkAudio();
if (result.mode <= 3) {
uni.navigateTo({
url: `/pages/team-battle?battleId=${result.matchId}`,
});
} else {
uni.navigateTo({
url: `/pages/melee-battle?battleId=${result.matchId}`,
});
}
return;
}
if (game.value.roomID) {
const result = await getCurrentGameAPI();
} else if (game.value.roomID) {
uni.navigateTo({
url: "/pages/battle-room?roomNumber=" + game.value.roomID,
});

15
src/components/BattleFooter.vue
View File

@@ -22,10 +22,9 @@ const props = defineProps({
},
});
const normalRounds = computed(() => {
const count = props.roundResults.findIndex((item) => !!item.ifGold);
return count > 0 ? count : props.roundResults.length;
});
const normalRounds = computed(
() => props.roundResults.length - props.goldenRound
);
</script>
<template>
@@ -60,8 +59,8 @@ const normalRounds = computed(() => {
</block>
<view>
<text>{{
result.shoots[1] && result.shoots[1].length
? result.shoots[1]
result.blueArrows.length
? result.blueArrows
.map((item) => item.ring)
.reduce((last, next) => last + next, 0)
: ""
@@ -95,8 +94,8 @@ const normalRounds = computed(() => {
</block>
<view>
<text>{{
result.shoots[2] && result.shoots[2].length
? result.shoots[2]
result.redArrows.length
? result.redArrows
.map((item) => item.ring)
.reduce((last, next) => last + next, 0)
: ""

2
src/components/BattleHeader.vue
View File

@@ -73,7 +73,7 @@ defineProps({
<text class="player-name">{{ player.name }}</text>
</view>
<image
v-if="winner === 2"
v-if="winner === 0"
src="../static/winner-badge.png"
mode="widthFix"
class="right-winner-badge"

10
src/components/BowData.vue
View File

@@ -49,16 +49,16 @@ const props = defineProps({
<view class="desc">
<text>{{ arrows.length }}</text>
<text>支箭，共</text>
<text>{{ arrows.reduce((a, b) => a + (b.ring || 0), 0) }}</text>
<text>{{ arrows.reduce((a, b) => a + b.ring, 0) }}</text>
<text>环</text>
</view>
<ScorePanel
:completeEffect="false"
:rowCount="total === 12 ? 6 : 9"
:rowCount="arrows.length === 12 ? 6 : 9"
:total="total"
:arrows="arrows"
:margin="total === 12 ? 4 : 1"
:fontSize="total === 12 ? 25 : 22"
:scores="arrows.map((a) => a.ring)"
:margin="arrows.length === 12 ? 4 : 1"
:fontSize="arrows.length === 12 ? 25 : 22"
/>
</view>
</template>

48
src/components/BowTarget.vue
View File

@@ -2,7 +2,7 @@
import { ref, watch, onMounted, onBeforeUnmount, computed } from "vue";
import PointSwitcher from "@/components/PointSwitcher.vue";
import { MESSAGETYPES, MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPES } from "@/constants";
import { simulShootAPI } from "@/apis";
import useStore from "@/store";
import { storeToRefs } from "pinia";
@@ -92,10 +92,7 @@ const simulShoot = async () => {
if (device.value.deviceId) await simulShootAPI(device.value.deviceId);
};
const simulShoot2 = async () => {
if (device.value.deviceId) {
const r1 = Math.random() > 0.5 ? 0.01 : 0.02;
await simulShootAPI(device.value.deviceId, r1, r1);
}
if (device.value.deviceId) await simulShootAPI(device.value.deviceId, 1, 1);
};
const env = computed(() => {
@@ -111,26 +108,28 @@ const arrowStyle = computed(() => {
};
});
async function onReceiveMessage(message) {
if (Array.isArray(message)) return;
if (message.type === MESSAGETYPESV2.ShootResult && message.shootData) {
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (
message.shootData.playerId === user.value.id &&
!message.shootData.ring &&
message.shootData.angle >= 0
msg.constructor === MESSAGETYPES.ShootSyncMeArrowID ||
msg.constructor === MESSAGETYPES.ShootResult
) {
angle.value = null;
setTimeout(() => {
if (props.scores[0]) {
circleColor.value =
message.shootData.playerId === props.scores[0].playerId
? "#ff4444"
: "#1840FF";
}
angle.value = message.shootData.angle;
}, 200);
if (
msg.userId === user.value.id &&
!msg.target.ring &&
msg.target.angle >= 0
) {
angle.value = null;
setTimeout(() => {
if (props.scores[0]) {
circleColor.value =
msg.userId === props.scores[0].playerId ? "#ff4444" : "#1840FF";
}
angle.value = msg.target.angle;
}, 200);
}
}
}
});
}
onMounted(() => {
@@ -183,8 +182,7 @@ onBeforeUnmount(() => {
left: calcRealX(latestOne.ring ? latestOne.x : 0, 28),
top: calcRealY(latestOne.ring ? latestOne.y : 0, 28),
}"
>{{ latestOne.ringX ? "X" : latestOne.ring || "未上靶"
}}<text v-if="latestOne.ring">环</text>
>{{ latestOne.ring || "未上靶" }}<text v-if="latestOne.ring">环</text>
</view>
<view
v-if="
@@ -207,7 +205,7 @@ onBeforeUnmount(() => {
left: calcRealX(bluelatestOne.ring ? bluelatestOne.x : 0, 28),
top: calcRealY(bluelatestOne.ring ? bluelatestOne.y : 0, 28),
}"
>{{ bluelatestOne.ringX ? "X" : bluelatestOne.ring || "未上靶"
>{{ bluelatestOne.ring || "未上靶"
}}<text v-if="bluelatestOne.ring">环</text></view
>
<block v-for="(bow, index) in scores" :key="index">

22
src/components/Container.vue
View File

@@ -5,7 +5,7 @@ import AppBackground from "@/components/AppBackground.vue";
import Header from "@/components/Header.vue";
import ScreenHint from "@/components/ScreenHint.vue";
import BackToGame from "@/components/BackToGame.vue";
import { laserAimAPI, getBattleAPI } from "@/apis";
import { getCurrentGameAPI, laserAimAPI } from "@/apis";
import { capsuleHeight, debounce } from "@/util";
import AudioManager from "@/audioManager";
const props = defineProps({
@@ -111,19 +111,15 @@ const backToGame = debounce(async () => {
try {
isLoading.value = true;
const result = await getBattleAPI();
if (result && result.matchId) {
await checkAudioProgress();
if (result.mode <= 3) {
uni.navigateTo({
url: `/pages/team-battle?battleId=${result.matchId}`,
});
} else {
uni.navigateTo({
url: `/pages/melee-battle?battleId=${result.matchId}`,
});
}
const game = await getCurrentGameAPI();
if (!game || !game.gameId) {
uni.showToast({
title: "没有进行中的对局",
icon: "none",
});
}
showHint.value = false;
} catch (error) {
console.error("获取当前游戏失败:", error);
} finally {

27
src/components/CreateRoom.vue
View File

@@ -32,23 +32,18 @@ const createRoom = debounce(async () => {
if (battleMode.value === 2) size = 10;
if (battleMode.value === 3) size = 4;
if (battleMode.value === 4) size = 6;
try {
const result = await createRoomAPI(
battleMode.value === 2 ? 2 : 1,
battleMode.value === 2 ? 10 : size
);
if (result.number) {
props.onConfirm();
await joinRoomAPI(result.number);
uni.navigateTo({
url: "/pages/battle-room?roomNumber=" + result.number,
});
}
} catch (error) {
console.log(error);
} finally {
loading.value = false;
const result = await createRoomAPI(
battleMode.value === 2 ? 2 : 1,
battleMode.value === 2 ? 10 : size
);
if (result.number) {
props.onConfirm();
await joinRoomAPI(result.number);
uni.navigateTo({
url: "/pages/battle-room?roomNumber=" + result.number,
});
}
loading.value = false;
});
</script>
<template>

23
src/components/Header.vue
View File

@@ -56,6 +56,7 @@ const signin = () => {
};
const loading = ref(false);
const showLoader = ref(false);
const pointBook = ref(null);
const showProgress = ref(false);
const heat = ref(0);
@@ -79,12 +80,20 @@ onMounted(() => {
pointBook.value = uni.getStorageSync("last-point-book");
}
}
if (
currentPage.route === "pages/team-battle" ||
currentPage.route === "pages/melee-match"
) {
showLoader.value = true;
}
if (currentPage.route === "pages/team-battle") {
showProgress.value = true;
}
uni.$on("update-header-loading", updateLoading);
uni.$on("update-hot", updateHot);
});
onBeforeUnmount(() => {
uni.$off("update-header-loading", updateLoading);
uni.$off("update-hot", updateHot);
});
</script>
@@ -152,6 +161,12 @@ onBeforeUnmount(() => {
</view>
</block>
</view>
<image
:style="{ opacity: showLoader && loading ? 0 : 0 }"
src="../static/btn-loading.png"
mode="widthFix"
class="loading"
/>
<view v-if="pointBook" class="point-book-info">
<text>{{ pointBook.bowType.name }}</text>
<text>{{ pointBook.distance }} 米</text>
@@ -215,6 +230,14 @@ onBeforeUnmount(() => {
font-size: 16px;
color: #fff;
}
.loading {
width: 20px;
height: 20px;
margin-left: 10px;
transition: all 0.3s ease;
background-blend-mode: darken;
animation: rotate 2s linear infinite;
}
.point-book-info {
color: #333;
position: fixed;

111
src/components/HeaderProgress.vue
View File

@@ -1,7 +1,7 @@
<script setup>
import { ref, watch, onMounted, onBeforeUnmount } from "vue";
import audioManager from "@/audioManager";
import { MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPES } from "@/constants";
import { getDirectionText } from "@/util";
import useStore from "@/store";
@@ -26,8 +26,9 @@ watch(
let key = [];
if (newVal.includes("重回")) return;
if (currentRoundEnded.value) {
currentRound.value += 1;
// 播放当前轮次语音
key.push(`第${["一", "二", "三", "四", "五"][currentRound.value]}轮`);
key.push(`第${["一", "二", "三", "四", "五"][currentRound.value - 1]}轮`);
}
key.push(
newVal.includes("你")
@@ -46,42 +47,80 @@ const updateSound = () => {
audioManager.setMuted(!sound.value);
};
async function onReceiveMessage(message) {
async function onReceiveMessage(messages = []) {
if (ended.value) return;
if (Array.isArray(message)) return;
const { type, mode, current, shootData } = message;
if (type === MESSAGETYPESV2.BattleStart) {
melee.value = Boolean(mode > 3);
totalShot.value = mode === 1 ? 3 : 2;
currentRoundEnded.value = true;
audioManager.play("比赛开始");
} else if (type === MESSAGETYPESV2.BattleEnd) {
audioManager.play("比赛结束");
} else if (type === MESSAGETYPESV2.ShootResult) {
if (melee.value && current.playerId !== user.value.id) return;
if (current.playerId === user.value.id) currentShot.value++;
if (message.shootData) {
let key = [];
key.push(
shootData.ring
? `${shootData.ringX ? "X" : shootData.ring}环`
: "未上靶"
);
if (shootData.angle !== null)
key.push(`向${getDirectionText(shootData.angle)}调整`);
audioManager.play(key, false);
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.ShootResult) {
if (melee.value && msg.userId !== user.value.id) return;
if (msg.userId === user.value.id) currentShot.value++;
if (msg.battleInfo && msg.userId === user.value.id) {
const players = [
...(msg.battleInfo.blueTeam || []),
...(msg.battleInfo.redTeam || []),
];
const currentPlayer = players.find((p) => p.id === msg.userId);
currentShot.value = 0;
try {
if (
currentPlayer &&
currentPlayer.shotHistory &&
currentPlayer.shotHistory[msg.battleInfo.currentRound]
) {
currentShot.value =
currentPlayer.shotHistory[msg.battleInfo.currentRound].length;
}
} catch (_) {}
}
if (!halfTime.value && msg.target) {
let key = [];
key.push(msg.target.ring ? `${msg.target.ring}环` : "未上靶");
if (!msg.target.ring)
key.push(`向${getDirectionText(msg.target.angle)}调整`);
audioManager.play(key);
}
} else if (msg.constructor === MESSAGETYPES.InvalidShot) {
if (msg.userId === user.value.id) {
uni.showToast({
title: "距离不足，无效",
icon: "none",
});
audioManager.play("射击无效");
}
} else if (msg.constructor === MESSAGETYPES.AllReady) {
const { config } = msg.groupUserStatus;
if (config && config.mode === 1) {
totalShot.value = config.teamSize === 2 ? 3 : 2;
}
currentRoundEnded.value = true;
audioManager.play("比赛开始");
} else if (msg.constructor === MESSAGETYPES.MeleeAllReady) {
melee.value = true;
halfTime.value = false;
audioManager.play("比赛开始");
} else if (msg.constructor === MESSAGETYPES.CurrentRoundEnded) {
currentShot.value = 0;
if (msg.preRoundResult && msg.preRoundResult.currentRound) {
currentRound.value = msg.preRoundResult.currentRound;
currentRoundEnded.value = true;
}
} else if (msg.constructor === MESSAGETYPES.HalfTimeOver) {
halfTime.value = true;
audioManager.play("中场休息");
} else if (msg.constructor === MESSAGETYPES.MatchOver) {
audioManager.play("比赛结束");
} else if (msg.constructor === MESSAGETYPES.FinalShoot) {
totalShot.value = 0;
audioManager.play("决金箭轮");
tips.value = "即将开始...";
currentRoundEnded.value = false;
} else if (msg.constructor === MESSAGETYPES.MatchOver) {
ended.value = true;
} else if (msg.constructor === MESSAGETYPES.BackToGame) {
if (msg.battleInfo) {
melee.value = msg.battleInfo.config.mode === 2;
}
}
} else if (type === MESSAGETYPESV2.NewRound) {
currentShot.value = 0;
currentRound.value = current.round;
currentRoundEnded.value = true;
} else if (type === MESSAGETYPESV2.InvalidShot) {
uni.showToast({
title: "距离不足，无效",
icon: "none",
});
audioManager.play("射击无效");
}
});
}
const playSound = (key) => {

17
src/components/PlayerScore.vue
View File

@@ -3,7 +3,7 @@ import useStore from "@/store";
import { storeToRefs } from "pinia";
const { user } = storeToRefs(useStore());
const props = defineProps({
defineProps({
player: {
type: Object,
default: () => ({}),
@@ -23,10 +23,7 @@ const rowCount = new Array(6).fill(0);
:style="{ borderColor: player.id === user.id ? '#FED847' : '#fff3' }"
>
<image
:style="{
opacity:
(scores[0] || []).length + (scores[1] || []).length === 12 ? 1 : 0,
}"
:style="{ opacity: scores.length === 12 ? 1 : 0 }"
src="../static/checked-green.png"
mode="widthFix"
/>
@@ -35,24 +32,20 @@ const rowCount = new Array(6).fill(0);
<view>
<view>
<view v-for="(_, index) in rowCount" :key="index">
<text>{{
scores[0] && scores[0][index] ? `${scores[0][index].ring}环` : "-"
}}</text>
<text>{{ scores[index] ? `${scores[index].ring}环` : "-" }}</text>
</view>
</view>
<view>
<view v-for="(_, index) in rowCount" :key="index">
<text>{{
scores[1] && scores[1][index] ? `${scores[0][index].ring}环` : "-"
scores[index + 6] ? `${scores[index + 6].ring}环` : "-"
}}</text>
</view>
</view>
</view>
<text
>{{
scores
.map((s) => s.reduce((last, next) => last + next.ring, 0))
.reduce((last, next) => last + next, 0)
scores.map((s) => s.ring).reduce((last, next) => last + next, 0)
}}环</text
>
</view>

12
src/components/PlayerScore2.vue
View File

@@ -9,7 +9,7 @@ defineProps({
type: String,
default: "",
},
arrows: {
scores: {
type: Array,
default: () => [],
},
@@ -21,6 +21,10 @@ defineProps({
type: Number,
default: 0,
},
totalRing: {
type: Number,
default: 0,
},
});
const rowCount = new Array(6).fill(0);
</script>
@@ -56,19 +60,19 @@ const rowCount = new Array(6).fill(0);
<view>
<view>
<view v-for="(_, index) in rowCount" :key="index">
<text>{{ arrows[index] ? `${arrows[index].ring}环` : "-" }}</text>
<text>{{ scores[index] ? `${scores[index].ring}环` : "-" }}</text>
</view>
</view>
<view>
<view v-for="(_, index) in rowCount" :key="index">
<text>{{
arrows[index + 6] ? `${arrows[index + 6].ring}环` : "-"
scores[index + 6] ? `${scores[index + 6].ring}环` : "-"
}}</text>
</view>
</view>
</view>
<view>
<text>{{ arrows.reduce((last, next) => last + next.ring, 0) }}环</text>
<text>{{ totalRing }}环</text>
<text>积分{{ totalScore }}</text>
</view>
</view>

107
src/components/PlayerSeats.vue
View File

@@ -1,6 +1,4 @@
<script setup>
import Avatar from "@/components/Avatar.vue";
const props = defineProps({
total: {
type: Number,
@@ -10,10 +8,6 @@ const props = defineProps({
type: Array,
default: () => [],
},
removePlayer: {
type: Function,
default: () => {},
},
});
const seats = new Array(props.total).fill(1);
</script>
@@ -22,16 +16,11 @@ const seats = new Array(props.total).fill(1);
<view class="players">
<view v-for="(_, index) in seats" :key="index">
<image src="../static/player-bg.png" mode="widthFix" />
<view v-if="players[index] && players[index].name" class="avatar">
<Avatar
:src="players[index].avatar || '../static/user-icon.png'"
:size="40"
/>
<text
:style="{ opacity: players[index] && !!players[index].state ? 1 : 0 }"
>已准备</text
>
</view>
<image
v-if="players[index] && players[index].name"
:src="players[index].avatar || '../static/user-icon.png'"
mode="widthFix"
/>
<view v-else class="player-unknow">
<image src="../static/question-mark.png" mode="widthFix" />
</view>
@@ -39,68 +28,48 @@ const seats = new Array(props.total).fill(1);
players[index].name
}}</text>
<text v-else :style="{ color: '#fff9' }">虚位以待</text>
<view v-if="index === 0" class="founder">管理员</view>
<!-- <image
<view v-if="index === 0" class="founder">创建者</view>
<image
:src="`../static/player-${index + 1}.png`"
mode="widthFix"
class="player-bg"
/> -->
<button
v-if="index > 0 && players[index]"
hover-class="none"
class="remove-player"
@click="() => removePlayer(players[index])"
>
<image src="../static/close-white.png" mode="widthFix" />
</button>
/>
</view>
</view>
</template>
<style scoped>
.players {
display: grid;
grid-template-columns: repeat(2, 1fr);
row-gap: 20rpx;
column-gap: 25rpx;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
-moz-column-gap: 20px;
column-gap: 14px;
margin-bottom: 20px;
font-size: 14px;
padding: 0 14px;
}
.players > view {
width: calc(50% - 7px);
display: flex;
align-items: center;
position: relative;
color: #fff;
height: 176rpx;
height: 100px;
overflow: hidden;
}
.players > view > image:first-child {
width: 100%;
height: 100%;
position: absolute;
z-index: -1;
top: 0;
}
.avatar {
display: flex;
flex-direction: column;
align-items: center;
padding: 0 24rpx;
margin-top: 16rpx;
}
.avatar > text {
background-color: #2c261fb3;
border: 1rpx solid #a3793f66;
color: #fed847;
font-size: 16rpx;
border-radius: 20rpx;
width: 70rpx;
text-align: center;
margin-top: -16rpx;
position: relative;
height: 28rpx;
line-height: 28rpx;
.players > view > image:nth-child(2) {
width: 40px;
height: 40px;
min-height: 40px;
margin: 0 10px;
border: 1px solid #fff;
border-radius: 50%;
}
.players > view > text:nth-child(3) {
width: 20vw;
@@ -111,48 +80,30 @@ const seats = new Array(props.total).fill(1);
.founder {
position: absolute;
background-color: #fed847;
top: 0;
left: 0;
top: 6px;
color: #000;
font-size: 10px;
padding: 2px 5px;
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
}
/* .player-bg {
.player-bg {
position: absolute;
width: 52px;
right: 0;
} */
}
.player-unknow {
width: 84rpx;
height: 84rpx;
margin: 0 24rpx;
border: 1rpx solid #fff3;
width: 40px;
height: 40px;
margin: 0 10px;
border: 1px solid #fff3;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: #69686866;
box-sizing: border-box;
}
.player-unknow > image {
width: 40%;
}
.remove-player {
width: 48rpx;
height: 48rpx;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 10rpx;
right: 0;
}
.remove-player > image {
width: 100%;
height: 100%;
opacity: 0.6;
}
</style>

137
src/components/PlayersRow.vue Normal file
View File

@@ -0,0 +1,137 @@
<script setup>
defineProps({
avatar: {
type: String,
default: "",
},
blueTeam: {
type: Array,
default: () => [],
},
redTeam: {
type: Array,
default: () => [],
},
currentShooterId: {
type: Number,
default: 0,
},
});
</script>
<template>
<view class="container">
<image v-if="avatar" class="avatar" :src="avatar" mode="widthFix" />
<view
v-if="blueTeam.length && redTeam.length"
:style="{ height: 20 + blueTeam.length * 20 + 'px' }"
>
<view
v-for="(player, index) in blueTeam"
:key="index"
:style="{
top: index * 20 + 'px',
zIndex: blueTeam.length - index,
left: 0,
}"
>
<image
class="avatar"
:src="player.avatar || '../static/user-icon.png'"
mode="widthFix"
:style="{
borderColor: currentShooterId === player.id ? '#5fadff' : '#fff',
}"
/>
<text
:style="{
color: currentShooterId === player.id ? '#5fadff' : '#fff',
fontSize: currentShooterId === player.id ? 16 : 12 + 'px',
}"
>
{{ player.name }}
</text>
</view>
</view>
<view
v-if="!avatar"
:style="{
height: 20 + redTeam.length * 20 + 'px',
}"
>
<view
v-for="(player, index) in redTeam"
:key="index"
:style="{
top: index * 20 + 'px',
zIndex: redTeam.length - index,
right: 0,
}"
>
<text
:style="{
color: currentShooterId === player.id ? '#ff6060' : '#fff',
fontSize: currentShooterId === player.id ? 16 : 12 + 'px',
textAlign: 'right',
}"
>
{{ player.name }}
</text>
<image
class="avatar"
:src="player.avatar || '../static/user-icon.png'"
mode="widthFix"
:style="{
borderColor: currentShooterId === player.id ? '#ff6060' : '#fff',
}"
/>
</view>
</view>
</view>
</template>
<style scoped>
.container {
width: calc(100% - 30px);
margin: 0 15px;
margin-top: 5px;
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.container > view {
width: 50%;
position: relative;
}
.container > view > view {
position: absolute;
top: -20px;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s linear;
}
.container > view > view > text {
margin: 0 10px;
overflow: hidden;
width: 120px;
transition: all 0.3s linear;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.avatar {
width: 40px;
height: 40px;
min-width: 40px;
min-height: 40px;
border: 1px solid #fff;
border-radius: 50%;
}
.red-avatar {
border: 1px solid #ff6060;
}
.blue-avatar {
border: 1px solid #5fadff;
}
</style>

4
src/components/RoundEndTip.vue
View File

@@ -52,14 +52,14 @@ onBeforeUnmount(() => {
<view class="point-view1" v-if="bluePoint !== 0 || redPoint !== 0">
<text>本轮蓝队</text>
<text>{{
(roundData.shoots[1] || []).reduce(
(roundData.blueArrows || []).reduce(
(last, next) => last + next.ring,
0
)
}}</text>
<text>环，红队</text>
<text>{{
(roundData.shoots[2] || []).reduce(
(roundData.redArrows || []).reduce(
(last, next) => last + next.ring,
0
)

10
src/components/ScorePanel.vue
View File

@@ -9,7 +9,7 @@ const props = defineProps({
type: Number,
default: 0,
},
arrows: {
scores: {
type: Array,
default: () => [],
},
@@ -51,7 +51,7 @@ onBeforeUnmount(() => {
<template>
<view class="container">
<image
v-if="total > 0 && arrows.length === total && completeEffect"
v-if="total > 0 && scores.length === total && completeEffect"
:src="bgImages[bgIndex]"
class="complete-light"
:style="{
@@ -79,10 +79,8 @@ onBeforeUnmount(() => {
>
<image src="../static/score-bg.png" mode="widthFix" />
<text
:style="{ fontWeight: arrows[index] !== undefined ? 'bold' : 'normal' }"
>{{
!arrows[index] ? "-" : arrows[index].ringX ? "X" : arrows[index].ring
}}</text
:style="{ fontWeight: scores[index] !== undefined ? 'bold' : 'normal' }"
>{{ scores[index] !== undefined ? scores[index] : "-" }}</text
>
</view>
</view>

27
src/components/ScorePanel2.vue
View File

@@ -1,6 +1,6 @@
<script setup>
const props = defineProps({
arrows: {
scores: {
type: Array,
default: () => [],
},
@@ -10,34 +10,37 @@ const getSum = (a, b, c) => {
return sum > 0 ? sum + "环" : "-";
};
const roundsName = ["第一轮", "第二轮", "第三轮", "第四轮"];
const getShowText = (arrow = {}) => {
return arrow.ring ? (arrow.ringX ? "X" : arrow.ring + "环") : "-";
};
</script>
<template>
<view class="container">
<view>
<text :style="{ transform: 'translateX(-10%)' }">总成绩</text>
<text>{{ arrows.reduce((last, next) => last + next.ring, 0) }}环</text>
<text>{{ scores.reduce((last, next) => last + next, 0) }}环</text>
</view>
<view
v-for="(_, index) in new Array(
Math.min(
Math.ceil(arrows.length / 3) + (arrows.length % 3 === 0 ? 1 : 0),
Math.ceil(scores.length / 3) + (scores.length % 3 === 0 ? 1 : 0),
4
)
).fill(1)"
:key="index"
>
<text>{{ roundsName[index] }}</text>
<text>{{ getShowText(arrows[index * 3 + 0]) }}</text>
<text>{{ getShowText(arrows[index * 3 + 1]) }}</text>
<text>{{ getShowText(arrows[index * 3 + 2]) }}</text>
<text>{{
scores[index * 3 + 0] ? scores[index * 3 + 0] + "环" : "-"
}}</text>
<text>{{
scores[index * 3 + 1] ? scores[index * 3 + 1] + "环" : "-"
}}</text>
<text>{{
scores[index * 3 + 2] ? scores[index * 3 + 2] + "环" : "-"
}}</text>
<text :style="{ width: '40%', transform: 'translateX(20%)' }">{{
getSum(
arrows[index * 3 + 0],
arrows[index * 3 + 1],
arrows[index * 3 + 2]
scores[index * 3 + 0],
scores[index * 3 + 1],
scores[index * 3 + 2]
)
}}</text>
</view>

32
src/components/ScoreResult.vue
View File

@@ -50,26 +50,22 @@ onMounted(() => {
if (props.result.lvl > user.value.lvl) {
showUpgrade.value = true;
}
totalRing.value = (props.result.details || []).reduce(
totalRing.value = (props.result.arrows || []).reduce(
(last, next) => last + next.ring,
0
);
});
const getRing = (arrow) => {
if (arrow.ringX) return "X";
return arrow.ring ? arrow.ring : "-";
};
const arrows = computed(() => {
const data = new Array(props.total).fill({ ring: 0 });
(props.result.details || []).forEach((arrow, index) => {
data[index] = arrow;
});
return data;
const validArrows = computed(() => {
return (props.result.arrows || []).filter(
(arrow) => arrow.x !== -30 && arrow.y !== -30
).length;
});
const validArrows = computed(() => arrows.value.filter((a) => !!a.ring).length);
const getRing = (arrow) => {
if (arrow && arrow.x !== -30 && arrow.y !== -30) return arrow.ring;
return "-";
};
</script>
<template>
@@ -100,8 +96,8 @@ const validArrows = computed(() => arrows.value.filter((a) => !!a.ring).length);
</view>
<view :style="{ gridTemplateColumns: `repeat(${rowCount}, 1fr)` }">
<view v-for="(_, index) in new Array(total).fill(0)" :key="index">
{{ getRing(arrows[index])
}}<text v-if="getRing(arrows[index]) !== '-'">环</text>
{{ getRing(result.arrows[index])
}}<text v-if="getRing(result.arrows[index]) !== '-'">环</text>
</view>
</view>
<view>
@@ -137,7 +133,7 @@ const validArrows = computed(() => arrows.value.filter((a) => !!a.ring).length);
}}</text
>环的成绩，所有箭支上靶后的平均点间距为<text
:style="{ color: '#fed847' }"
>{{ Number((result.average_distance || 0).toFixed(2)) }}</text
>{{ Number(result.average_distance.toFixed(2)) }}</text
>，{{
result.spreadEvaluation === "Dispersed"
? "还需要持续改进哦~"
@@ -164,8 +160,8 @@ const validArrows = computed(() => arrows.value.filter((a) => !!a.ring).length);
</view>
</ScreenHint>
<BowData
:total="arrows.length"
:arrows="result.details"
:total="result.completed_arrows"
:arrows="result.arrows"
:show="showBowData"
:onClose="() => (showBowData = false)"
/>

98
src/components/ShootProgress.vue
View File

@@ -1,7 +1,7 @@
<script setup>
import { ref, watch, onMounted, onBeforeUnmount, computed } from "vue";
import audioManager from "@/audioManager";
import { MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPES } from "@/constants";
import { getDirectionText } from "@/util";
import useStore from "@/store";
@@ -96,12 +96,8 @@ const resetTimer = (count) => {
watch(
() => props.start,
(newVal) => {
if (newVal) {
resetTimer(props.total);
} else {
remain.value = 0;
clearInterval(timer.value);
}
if (newVal) resetTimer(props.total);
else if (timer.value) clearInterval(timer.value);
},
{
immediate: true,
@@ -120,36 +116,62 @@ const updateSound = () => {
audioManager.setMuted(!sound.value);
};
async function onReceiveMessage(msg) {
if (Array.isArray(msg)) return;
if (msg.type === MESSAGETYPESV2.BattleStart) {
halfTime.value = false;
audioManager.play("比赛开始");
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
audioManager.play("比赛结束");
} else if (msg.type === MESSAGETYPESV2.ShootResult) {
let arrow = {};
if (msg.details && Array.isArray(msg.details)) {
arrow = msg.details[msg.details.length - 1];
} else {
if (msg.shootData.playerId !== user.value.id) return;
if (msg.shootData) arrow = msg.shootData;
async function onReceiveMessage(messages = []) {
if (ended.value) return;
messages.forEach((msg) => {
if (
(props.battleId && msg.constructor === MESSAGETYPES.ShootResult) ||
(!props.battleId && msg.constructor === MESSAGETYPES.ShootSyncMeArrowID)
) {
if (props.melee && msg.userId !== user.value.id) return;
if (!halfTime.value && msg.target) {
let key = [];
key.push(msg.target.ring ? `${msg.target.ring}环` : "未上靶");
if (!msg.target.ring)
key.push(`向${getDirectionText(msg.target.angle)}调整`);
audioManager.play(key);
}
} else if (msg.constructor === MESSAGETYPES.InvalidShot) {
if (msg.userId === user.value.id) {
uni.showToast({
title: "距离不足，无效",
icon: "none",
});
audioManager.play("射击无效");
}
} else if (msg.constructor === MESSAGETYPES.AllReady) {
audioManager.play("比赛开始");
} else if (msg.constructor === MESSAGETYPES.MeleeAllReady) {
halfTime.value = false;
audioManager.play("比赛开始");
} else if (msg.constructor === MESSAGETYPES.CurrentRoundEnded) {
currentRoundEnded.value = true;
} else if (msg.constructor === MESSAGETYPES.HalfTimeOver) {
if (props.battleId) {
halfTime.value = true;
audioManager.play("中场休息");
return;
}
if (wait.value !== msg.wait) {
setTimeout(() => {
wait.value = msg.wait;
if (msg.wait === 20) {
halfTime.value = true;
audioManager.play("中场休息", false);
}
if (msg.wait === 0) {
halfTime.value = false;
}
}, 200);
}
} else if (msg.constructor === MESSAGETYPES.MatchOver) {
audioManager.play("比赛结束");
} else if (msg.constructor === MESSAGETYPES.FinalShoot) {
audioManager.play("决金箭轮");
} else if (msg.constructor === MESSAGETYPES.MatchOver) {
ended.value = true;
}
let key = [];
key.push(arrow.ring ? `${arrow.ringX ? "X" : arrow.ring}环` : "未上靶");
if (arrow.angle !== null)
key.push(`向${getDirectionText(arrow.angle)}调整`);
audioManager.play(key, false);
} else if (msg.type === MESSAGETYPESV2.HalfRest) {
halfTime.value = true;
audioManager.play("中场休息");
} else if (msg.type === MESSAGETYPESV2.InvalidShot) {
uni.showToast({
title: "距离不足，无效",
icon: "none",
});
audioManager.play("射击无效");
}
});
}
const playSound = (key) => {
@@ -157,13 +179,13 @@ const playSound = (key) => {
};
onMounted(() => {
uni.$on("update-remain", resetTimer);
uni.$on("update-ramain", resetTimer);
uni.$on("socket-inbox", onReceiveMessage);
uni.$on("play-sound", playSound);
});
onBeforeUnmount(() => {
uni.$off("update-remain", resetTimer);
uni.$off("update-ramain", resetTimer);
uni.$off("socket-inbox", onReceiveMessage);
uni.$off("play-sound", playSound);
if (timer.value) clearInterval(timer.value);

35
src/components/ShootProgress2.vue
View File

@@ -19,18 +19,6 @@ const props = defineProps({
const barColor = ref("");
const remain = ref(15);
const timer = ref(null);
const laoding = ref(false);
const updateRemain = (value) => {
// if (Math.ceil(value) === remain.value || Math.floor(value) === remain.value)
// return;
if (timer.value) clearInterval(timer.value);
remain.value = Math.round(value);
timer.value = setInterval(() => {
laoding.value = remain.value === 0;
if (remain.value > 0) remain.value--;
}, 1000);
};
watch(
() => props.tips,
@@ -41,7 +29,11 @@ watch(
barColor.value = "linear-gradient( 180deg, #9AB3FF 0%, #4288FF 100%)";
if (newVal.includes("重回")) return;
if (newVal.includes("红队") || newVal.includes("蓝队")) {
updateRemain(props.total);
if (timer.value) clearInterval(timer.value);
remain.value = props.total;
timer.value = setInterval(() => {
if (remain.value > 0) remain.value--;
}, 1000);
}
},
{
@@ -49,12 +41,22 @@ watch(
}
);
const updateRemain = (value) => {
if (Math.ceil(value) === remain.value || Math.floor(value) === remain.value)
return;
if (timer.value) clearInterval(timer.value);
remain.value = Math.round(value);
timer.value = setInterval(() => {
if (remain.value > 0) remain.value--;
}, 1000);
};
onMounted(() => {
uni.$on("update-remain", updateRemain);
uni.$on("update-ramain", updateRemain);
});
onBeforeUnmount(() => {
uni.$off("update-remain", updateRemain);
uni.$off("update-ramain", updateRemain);
if (timer.value) clearInterval(timer.value);
});
</script>
@@ -74,8 +76,7 @@ onBeforeUnmount(() => {
right: tips.includes('红队') ? 0 : 'unset',
}"
/>
<text v-if="!laoding">剩余{{ remain }}秒</text>
<text v-else>···</text>
<text>剩余{{ remain }}秒</text>
</view>
</view>
</template>

44
src/components/Signin.vue
View File

@@ -87,34 +87,28 @@ const handleLogin = async () => {
});
}
loading.value = true;
try {
const wxResult = await wxLogin();
const fileManager = uni.getFileSystemManager();
const avatarBase64 = fileManager.readFileSync(avatarUrl.value, "base64");
const base64Url = `data:image/png;base64,${avatarBase64}`;
const result = await loginAPI(
phone.value,
nickName.value,
base64Url,
wxResult.code
);
const data = await getHomeData();
if (data.user) updateUser(data.user);
const devices = await getMyDevicesAPI();
if (devices.bindings && devices.bindings.length) {
updateDevice(
devices.bindings[0].deviceId,
devices.bindings[0].deviceName
);
const wxResult = await wxLogin();
const fileManager = uni.getFileSystemManager();
const avatarBase64 = fileManager.readFileSync(avatarUrl.value, "base64");
const base64Url = `data:image/png;base64,${avatarBase64}`;
const result = await loginAPI(
phone.value,
nickName.value,
base64Url,
wxResult.code
);
const data = await getHomeData();
if (data.user) updateUser(data.user);
const devices = await getMyDevicesAPI();
if (devices.bindings && devices.bindings.length) {
updateDevice(devices.bindings[0].deviceId, devices.bindings[0].deviceName);
try {
const data = await getDeviceBatteryAPI();
updateOnline(data.online);
}
props.onClose();
} catch (error) {
console.log("login error", error);
} finally {
loading.value = false;
} catch (error) {}
}
loading.value = false;
props.onClose();
};
const openServiceLink = () => {

4
src/components/Swiper.vue
View File

@@ -75,7 +75,7 @@ const handleChange = (e) => {
.dots {
position: absolute;
bottom: 5%;
bottom: 15%;
left: 50%;
transform: translateX(-50%);
display: flex;
@@ -90,6 +90,6 @@ const handleChange = (e) => {
}
.dot.active {
background-color: #fed847;
background-color: #000;
}
</style>

41
src/components/TestDistance.vue
View File

@@ -5,7 +5,7 @@ import BowPower from "@/components/BowPower.vue";
import Avatar from "@/components/Avatar.vue";
import audioManager from "@/audioManager";
import { simulShootAPI } from "@/apis";
import { MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPES } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
@@ -19,15 +19,12 @@ const props = defineProps({
type: Boolean,
default: false,
},
count: {
type: Number,
default: 15,
},
});
const arrow = ref({});
const distance = ref(0);
const debugInfo = ref("");
const showsimul = ref(false);
const count = ref(props.count);
const count = ref(15);
const timer = ref(null);
const updateTimer = (value) => {
@@ -35,12 +32,10 @@ const updateTimer = (value) => {
};
onMounted(() => {
audioManager.play("请射箭测试距离");
if (props.isBattle) {
timer.value = setInterval(() => {
count.value -= 1;
if (count.value < 0) clearInterval(timer.value);
}, 1000);
}
timer.value = setInterval(() => {
if (count.value > 0) count.value -= 1;
else clearInterval(timer.value);
}, 1000);
uni.$on("update-timer", updateTimer);
});
onBeforeUnmount(() => {
@@ -48,13 +43,18 @@ onBeforeUnmount(() => {
uni.$off("update-timer", updateTimer);
});
async function onReceiveMessage(msg) {
if (Array.isArray(msg)) return;
if (msg.type === MESSAGETYPESV2.TestDistance) {
distance.value = Number((msg.shootData.distance / 100).toFixed(2));
if (distance.value >= 5) audioManager.play("距离合格");
else audioManager.play("距离不足");
}
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
arrow.value = msg.target;
distance.value = Number((msg.target.dst / 100).toFixed(2));
debugInfo.value = msg.target;
audioManager.play("距离合格");
} else if (msg.constructor === MESSAGETYPES.InvalidShot) {
distance.value = Number((msg.target.dst / 100).toFixed(2));
audioManager.play("距离不足");
}
});
}
const simulShoot = async () => {
@@ -112,12 +112,11 @@ onBeforeUnmount(() => {
</view>
<view v-if="isBattle" class="ready-timer">
<image src="../static/test-tip.png" mode="widthFix" />
<view v-if="count >= 0">
<view>
<text>具体正式比赛还有</text>
<text>{{ count }}</text>
<text>秒</text>
</view>
<view v-else> 进入中... </view>
</view>
</view>
</template>

26
src/constants.js
View File

@@ -30,29 +30,13 @@ export const MESSAGETYPES = {
SomeoneIsReady: 4168086628,
};
export const MESSAGETYPESV2 = {
AboutToStart: 1,
BattleStart: 2,
ToSomeoneShoot: 3,
ShootResult: 4,
NewRound: 5,
BattleEnd: 6,
HalfRest: 7,
TestDistance: 8,
MatchSuccess: 9,
InvalidShot: 10,
};
export const topThreeColors = ["#FFD947", "#D2D2D2", "#FFA515"];
export const getMessageTypeName = (id) => {
for (let key in MESSAGETYPES) {
if (MESSAGETYPES[key] === id) return key;
}
for (let key in MESSAGETYPESV2) {
if (MESSAGETYPESV2[key] === id) return key;
}
return id;
return null;
};
export const roundsName = {
@@ -118,7 +102,7 @@ export const getBattleResultTips = (
) => {
const getRandomIndex = (len) => Math.floor(Math.random() * len);
if (gameMode === 1) {
if (mode <= 3) {
if (mode === 1) {
if (win) {
const tests = [
"https://static.shelingxingqiu.com/attachment/2025-08-01/dbqq1fglywucyoh9zn.png",
@@ -140,7 +124,7 @@ export const getBattleResultTips = (
];
return tests[getRandomIndex(3)];
}
} else {
} else if (mode === 2) {
if (rank <= 3) {
const tests = [
"好成绩!全国排位赛等着你!",
@@ -152,7 +136,7 @@ export const getBattleResultTips = (
}
}
} else if (gameMode === 2) {
if (mode <= 3) {
if (mode === 1) {
if (win) {
const tests = [
"https://static.shelingxingqiu.com/attachment/2025-08-01/dbqq1fgtb29jbdus4g.png",
@@ -174,7 +158,7 @@ export const getBattleResultTips = (
];
return tests[getRandomIndex(3)];
}
} else {
} else if (mode === 2) {
if (score > 0) {
const tests = [
"王者一定属于你!",

12
src/pages.json
View File

@@ -30,15 +30,12 @@
"navigationBarTitleText": ""
}
},
{
"path": "pages/team-battle"
},
{
"path": "pages/melee-battle"
},
{
"path": "pages/battle-result"
},
{
"path": "pages/team-battle"
},
{
"path": "pages/point-book-edit"
},
@@ -105,6 +102,9 @@
{
"path": "pages/rank-list"
},
{
"path": "pages/melee-match"
},
{
"path": "pages/match-detail"
},

179
src/pages/battle-result.vue
View File

@@ -1,9 +1,9 @@
<script setup>
import { ref, computed, onMounted } from "vue";
import { ref, onMounted } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import Avatar from "@/components/Avatar.vue";
import UserUpgrade from "@/components/UserUpgrade.vue";
import { getBattleAPI } from "@/apis";
import { getGameAPI } from "@/apis";
import { topThreeColors, getBattleResultTips } from "@/constants";
import audioManager from "@/audioManager";
import useStore from "@/store";
@@ -16,10 +16,14 @@ const ifWin = ref(false);
const data = ref({});
const totalPoints = ref(0);
const rank = ref(0);
const players = ref([]);
function exit() {
if (data.value.roomId) {
const battleInfo = uni.getStorageSync("last-battle");
if (battleInfo && battleInfo.roomId) {
uni.redirectTo({
url: `/pages/battle-room?roomNumber=${battleInfo.roomId}`,
});
} else if (data.value.roomId) {
uni.redirectTo({
url: `/pages/battle-room?roomNumber=${data.value.roomId}`,
});
@@ -29,95 +33,128 @@ function exit() {
}
onLoad(async (options) => {
if (!options.battleId) return;
const myId = user.value.id;
const result = await getBattleAPI(options.battleId || "60049406950510592");
data.value = result;
if (result.winTeam) {
ifWin.value = result.teams[result.winTeam].players.some(
(p) => p.id === myId
if (options.battleId) {
const result = await getGameAPI(
options.battleId || "BATTLE-1758270367040321900-868"
);
}
if (result.mode <= 3) {
audioManager.play(ifWin.value ? "胜利" : "失败");
} else {
players.value = result.resultList.map((item, index) => {
const plist = result.teams[0] ? result.teams[0].players : [];
const p = plist.find((p) => p.id === item.userId);
if (p.id === user.value.id) {
totalPoints.value = p.score;
rank.value = index + 1;
data.value = {
...result,
battleMode: result.gameMode,
};
if (result.mode === 1) {
data.value.redPlayers = Object.values(result.redPlayers);
data.value.bluePlayers = Object.values(result.bluePlayers);
if (result.redPlayers[myId]) {
totalPoints.value = result.redPlayers[myId].totalScore;
data.value.myTeam = result.redPlayers[myId].team;
ifWin.value = result.winner === 0;
}
return {
...item,
rank: index + 1,
name: p.name,
avatar: p.avatar || "",
};
if (result.bluePlayers[myId]) {
totalPoints.value = result.bluePlayers[myId].totalScore;
data.value.myTeam = result.bluePlayers[myId].team;
ifWin.value = result.winner === 1;
}
}
if (result.mode === 2) {
data.value.playerStats = result.players.map((p) => ({
...p,
id: p.playerId,
}));
const mine = result.players.find((p) => p.playerId === myId);
if (mine) totalPoints.value = mine.totalScore;
rank.value = result.players.findIndex((p) => p.playerId === myId) + 1;
}
} else {
const battleInfo = uni.getStorageSync("last-battle");
if (!battleInfo) return;
data.value = {
mvps: [],
...battleInfo,
};
if (battleInfo.mode === 1) {
battleInfo.playerStats.forEach((p) => {
if (p.team === 1) data.value.bluePlayers = [p];
if (p.team === 0) data.value.redPlayers = [p];
if (p.mvp) data.value.mvps.push(p);
});
data.value.mvps.sort((a, b) => b.totalRings - a.totalRings);
}
rank.value = 0;
const mine = battleInfo.playerStats.find((p, index) => {
rank.value = index + 1;
return p.id === myId;
});
if (rank.value <= players.value * 0.3) {
audioManager.play("胜利");
} else {
audioManager.play("胜利");
if (mine) {
data.value.myTeam = mine.team;
totalPoints.value = mine.totalScore;
if (battleInfo.mode === 1) {
ifWin.value = mine.team === battleInfo.winner;
}
}
}
if (data.value.mode === 1) {
audioManager.play(ifWin.value ? "胜利" : "失败");
} else if (data.value.mode === 2) {
if (data.value.battleMode === 1) {
if (rank.value <= data.value.playerStats.length * 0.3) {
audioManager.play("胜利");
}
} else if (data.value.battleMode === 2) {
if (totalPoints.value > 0) {
audioManager.play("胜利");
} else if (totalPoints.value < 0) {
audioManager.play("失败");
}
}
}
});
const myTeam = computed(() => {
const teams = data.value.teams;
if (teams && teams.length) {
if (teams[1].players.some((p) => p.id === user.value.id)) return 1;
}
return 2;
});
const checkBowData = () => {
uni.navigateTo({
url: `/pages/match-detail?battleId=${data.value.matchId}`,
url: `/pages/match-detail?id=${data.value.id}`,
});
};
</script>
<template>
<view class="container">
<block v-if="data.mode <= 3">
<block v-if="data.mode === 1">
<view class="header-team" :style="{ marginTop: '25%' }">
<image src="../static/battle-result.png" mode="widthFix" />
<view class="header-solo" v-if="data.mode === 1">
<view class="header-solo" v-if="data.teamSize === 2">
<text
:style="{
background:
data.winTeam === 1
data.winner === 1
? 'linear-gradient(270deg, #3597ff 0%, rgba(0,0,0,0) 100%);'
: 'linear-gradient(270deg, #fd4444 0%, rgba(0, 0, 0, 0) 100%)',
}"
>{{ data.winTeam === 1 ? "蓝队" : "红队" }}获胜</text
>{{ data.winner === 1 ? "蓝队" : "红队" }}获胜</text
>
<Avatar
:size="32"
:src="
data.winTeam === 1
? data.teams[1].players[0].avatar
: data.teams[2].players[0].avatar
data.winner === 1
? data.bluePlayers[0].avatar
: data.redPlayers[0].avatar
"
:borderColor="data.winTeam === 1 ? '#5FADFF' : '#FF5656'"
:borderColor="data.winner === 1 ? '#5FADFF' : '#FF5656'"
mode="widthFix"
/>
</view>
</view>
<view class="header-mvp" v-if="data.mode === 2 || data.mode === 3">
<view class="header-mvp" v-if="data.teamSize !== 2">
<image
:src="`../static/${data.winTeam === 1 ? 'blue' : 'red'}-team-win.png`"
:src="`../static/${data.winner === 1 ? 'blue' : 'red'}-team-win.png`"
mode="widthFix"
/>
<view
:style="{
transform: `translateY(50px) rotate(-${
5 + (data.mvp || []).length
}deg)`,
transform: `translateY(50px) rotate(-${5 + data.mvps.length}deg)`,
}"
>
<view v-if="data.mvp && data.mvp[0].totalRings">
<view v-if="data.mvps && data.mvps[0].totalRings">
<image src="../static/title-mvp.png" mode="widthFix" />
<text
>斩获<text
@@ -127,22 +164,22 @@ const checkBowData = () => {
margin: '0 3px',
fontWeight: '600',
}"
>{{ data.mvp[0].totalRings }}</text
>{{ data.mvps[0].totalRings }}</text
>环</text
>
</view>
<view v-if="data.mvp && data.mvp.length">
<view v-for="(player, index) in data.mvp" :key="index">
<view v-if="data.mvps && data.mvps.length">
<view v-for="(player, index) in data.mvps" :key="index">
<view class="team-avatar">
<Avatar
:src="player.avatar"
:size="40"
:borderColor="myTeam === 1 ? '#5fadff' : '#ff6060'"
:borderColor="data.myTeam === 1 ? '#5fadff' : '#ff6060'"
/>
<text
v-if="player.id === user.id"
:style="{
backgroundColor: myTeam === 1 ? '#5fadff' : '#ff6060',
backgroundColor: data.myTeam === 1 ? '#5fadff' : '#ff6060',
}"
>自己</text
>
@@ -161,7 +198,7 @@ const checkBowData = () => {
/>
<image
:src="
getBattleResultTips(data.way, data.mode, {
getBattleResultTips(data.battleMode, data.mode, {
win: ifWin,
})
"
@@ -170,7 +207,7 @@ const checkBowData = () => {
/>
</view>
</block>
<block v-else>
<block v-if="data.mode === 2">
<view class="header-melee">
<view />
<image src="../static/battle-result.png" mode="widthFix" />
@@ -179,11 +216,11 @@ const checkBowData = () => {
<view
class="players"
:style="{
height: `${Math.max(players.length > 5 ? '330' : '300')}px`,
height: `${Math.max(data.playerStats.length > 5 ? '330' : '300')}px`,
}"
>
<view
v-for="(player, index) in players"
v-for="(player, index) in data.playerStats"
:key="index"
:style="{
border: player.id === user.id ? '1px solid #B04630' : 'none',
@@ -238,7 +275,7 @@ const checkBowData = () => {
<text>{{ getLvlName(player.rank_lvl) }}</text>
</view>
<text
><text :style="{ color: '#fff' }">{{ player.totalRing }}</text>
><text :style="{ color: '#fff' }">{{ player.totalRings }}</text>
环</text
>
</view>
@@ -246,36 +283,36 @@ const checkBowData = () => {
</block>
<view
class="battle-e"
:style="{ marginTop: data.mode > 3 ? '20px' : '20vw' }"
:style="{ marginTop: data.mode === 2 ? '20px' : '20vw' }"
>
<image src="../static/row-yellow-bg.png" mode="widthFix" />
<view class="team-avatar">
<Avatar
:src="user.avatar"
:size="40"
:borderColor="myTeam === 1 ? '#5fadff' : '#ff6060'"
:borderColor="data.myTeam === 1 ? '#5fadff' : '#ff6060'"
/>
<text
:style="{ backgroundColor: '#5fadff' }"
v-if="data.mode <= 3 && myTeam === 1"
v-if="data.mode === 1 && data.myTeam === 1"
>蓝队</text
>
<text
:style="{ backgroundColor: '#ff6060' }"
v-if="data.mode <= 3 && myTeam === 2"
v-if="data.mode === 1 && data.myTeam === 0"
>红队</text
>
</view>
<text v-if="data.way === 1">
<text v-if="data.battleMode === 1">
你的经验 {{ totalPoints > 0 ? "+" + totalPoints : totalPoints }}
</text>
<text v-if="data.way === 2">
<text v-if="data.battleMode === 2">
你的积分 {{ totalPoints > 0 ? "+" + totalPoints : totalPoints }}
</text>
</view>
<text v-if="data.mode > 3" class="description">
<text v-if="data.mode === 2" class="description">
{{
getBattleResultTips(data.way, data.mode, {
getBattleResultTips(data.battleMode, data.mode, {
win: ifWin,
score: totalPoints,
rank,

364
src/pages/battle-room.vue
View File

@@ -1,10 +1,11 @@
<script setup>
import { ref, onMounted, computed, onBeforeUnmount } from "vue";
import { onShow, onLoad, onShareAppMessage } from "@dcloudio/uni-app";
import { ref, watch, onMounted, onBeforeUnmount } from "vue";
import { onLoad, onShareAppMessage } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import PlayerSeats from "@/components/PlayerSeats.vue";
import Guide from "@/components/Guide.vue";
import SButton from "@/components/SButton.vue";
import SModal from "@/components/SModal.vue";
import Avatar from "@/components/Avatar.vue";
import {
getRoomAPI,
@@ -13,9 +14,9 @@ import {
startRoomAPI,
chooseTeamAPI,
getReadyAPI,
kickPlayerAPI,
} from "@/apis";
import { MESSAGETYPES, MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPES } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
@@ -29,18 +30,18 @@ const players = ref([]);
const blueTeam = ref([]);
const redTeam = ref([]);
const showModal = ref(false);
const battleType = ref(0);
const refreshRoomTimer = ref(null);
const ready = ref(false);
const allReady = ref(false);
const timer = ref(null);
const goBattle = ref(false);
async function refreshRoomData() {
if (!roomNumber.value) return;
const result = await getRoomAPI(roomNumber.value);
if (result.started) return;
room.value = result;
owner.value = {};
opponent.value = {};
battleType.value = result.battleType;
const members = result.members || [];
if (members.length === result.count) {
allReady.value = members.every((m) => !!m.userInfo.state);
@@ -59,7 +60,6 @@ async function refreshRoomData() {
name: m.userInfo.name,
avatar: m.userInfo.avatar,
rankLvl: m.userInfo.rankLvl,
ready: !!m.userInfo.state,
};
return true;
}
@@ -73,7 +73,6 @@ async function refreshRoomData() {
name: m.userInfo.name,
avatar: m.userInfo.avatar,
rankLvl: m.userInfo.rankLvl,
ready: !!m.userInfo.state,
};
}
});
@@ -95,7 +94,7 @@ async function refreshRoomData() {
refreshMembers(result.members);
}
if (timer.value) clearInterval(timer.value);
// timer.value = setTimeout(refreshRoomData, 2000);
timer.value = setTimeout(refreshRoomData, 1000);
}
const startGame = async () => {
@@ -113,8 +112,8 @@ const refreshMembers = (members = []) => {
players.value[index] = { ...m.userInfo, groupType: m.groupType };
if (m.groupType === 1) {
blueTeam.value.push({ ...m.userInfo, groupType: 1 });
} else if (m.groupType === 2) {
redTeam.value.push({ ...m.userInfo, groupType: 2 });
} else if (m.groupType === 0) {
redTeam.value.push({ ...m.userInfo, groupType: 0 });
}
});
for (let i = 0; i < room.value.count / 2; i++) {
@@ -123,28 +122,66 @@ const refreshMembers = (members = []) => {
}
};
async function onReceiveMessage(message) {
if (Array.isArray(message)) {
message.forEach((msg) => {
if (msg.roomNumber !== roomNumber.value) return;
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.roomNumber === roomNumber.value) {
if (msg.constructor === MESSAGETYPES.UserEnterRoom) {
refreshRoomData();
if (battleType.value === 1) {
if (msg.userId === room.value.creator) {
owner.value = {
id: msg.userId,
name: msg.name,
avatar: msg.avatar,
rankLvl: msg.rankLvl,
};
} else {
opponent.value = {
id: msg.userId,
name: msg.name,
avatar: msg.avatar,
rankLvl: msg.rankLvl,
};
}
}
if (battleType.value === 2) {
if (room.value.creator === msg.userId) {
players.value[0] = {
id: msg.userId,
name: msg.name,
avatar: msg.avatar,
rankLvl: msg.rankLvl,
};
} else {
players.value.push({
id: msg.userId,
name: msg.name,
avatar: msg.avatar,
rankLvl: msg.rankLvl,
});
}
}
} else if (msg.constructor === MESSAGETYPES.UserExitRoom) {
if (msg.userId === user.value.id) {
uni.showToast({
title: "你被踢出房间",
icon: "none",
});
setTimeout(() => {
uni.navigateBack();
}, 1000);
} else {
refreshRoomData();
if (battleType.value === 1) {
if (msg.userId === room.value.creator) {
owner.value = {
id: "",
};
} else {
opponent.value = {
id: "",
};
}
}
if (battleType.value === 2) {
players.value = players.value.filter((p) => p.id !== msg.userId);
}
if (msg.room && msg.room.members) {
refreshMembers(msg.room.members);
}
} else if (msg.constructor === MESSAGETYPES.TeamUpdate) {
refreshRoomData();
} else if (msg.constructor === MESSAGETYPES.SomeoneIsReady) {
refreshRoomData();
if (msg.room && msg.room.members) {
refreshMembers(msg.room.members);
}
} else if (msg.constructor === MESSAGETYPES.RoomDestroy) {
uni.showToast({
title: "房间已解散",
@@ -153,25 +190,41 @@ async function onReceiveMessage(message) {
setTimeout(() => {
uni.navigateBack();
}, 1000);
} else if (msg.constructor === MESSAGETYPES.SomeoneIsReady) {
refreshRoomData();
}
} else if (msg.constructor === MESSAGETYPES.WaitForAllReady) {
if (msg.groupUserStatus) {
uni.setStorageSync("red-team", msg.groupUserStatus.redTeam);
uni.setStorageSync("blue-team", msg.groupUserStatus.blueTeam);
uni.setStorageSync("melee-players", [
...msg.groupUserStatus.redTeam,
...msg.groupUserStatus.blueTeam,
]);
uni.removeStorageSync("current-battle");
// 避免离开页面，触发退出房间
roomNumber.value = "";
if (msg.groupUserStatus.config.mode == 1) {
uni.redirectTo({
url: `/pages/team-battle?battleId=${msg.id}&gameMode=1`,
});
} else if (msg.groupUserStatus.config.mode == 2) {
uni.redirectTo({
url: `/pages/melee-match?battleId=${msg.id}&gameMode=1`,
});
}
}
});
} else if (message.type === MESSAGETYPESV2.AboutToStart) {
goBattle.value = true;
if (message.mode <= 3) {
uni.setStorageSync("blue-team", message.teams[1].players || []);
uni.setStorageSync("red-team", message.teams[2].players || []);
uni.redirectTo({
url: "/pages/team-battle?battleId=" + message.matchId,
});
} else {
uni.redirectTo({
url: "/pages/melee-battle?battleId=" + message.matchId,
});
}
}
});
}
const chooseTeam = async (team) => {
if (team !== 2) {
const notInTeam = room.value.members.some(
(m) => m.userInfo.id === user.value.id && m.groupType === 2
);
if (!notInTeam) return;
}
const result = await chooseTeamAPI(roomNumber.value, team);
refreshMembers(result.members);
};
@@ -184,22 +237,15 @@ const exitRoom = async () => {
uni.navigateBack();
};
const removePlayer = async (player) => {
await kickPlayerAPI(roomNumber.value, player.id);
const setClipboardData = () => {
uni.setClipboardData({
data: roomNumber.value,
success() {
uni.showToast({ title: "复制成功" });
},
});
};
const canClick = computed(() => {
if (ready.value) return false;
const { members = [] } = room.value;
if (members.length < 2) return false;
if (
owner.value.id === user.value.id &&
members.some((m) => !m.userInfo.state && m.userInfo.id !== owner.value.id)
)
return false;
return true;
});
onShareAppMessage(() => {
return {
title: "邀请您进入房间对战",
@@ -208,13 +254,11 @@ onShareAppMessage(() => {
};
});
onShow(() => {
goBattle.value = false;
refreshRoomData();
});
onLoad(async (options) => {
if (options.roomNumber) roomNumber.value = options.roomNumber;
if (options.roomNumber) {
roomNumber.value = options.roomNumber;
refreshRoomData();
}
});
onMounted(() => {
@@ -225,11 +269,12 @@ onMounted(() => {
});
onBeforeUnmount(() => {
if (refreshRoomTimer.value) clearInterval(refreshRoomTimer.value);
uni.setKeepScreenOn({
keepScreenOn: false,
});
uni.$off("socket-inbox", onReceiveMessage);
if (!goBattle.value) exitRoomAPI(roomNumber.value);
if (roomNumber.value) exitRoomAPI(roomNumber.value);
if (timer.value) clearInterval(timer.value);
timer.value = null;
});
@@ -242,15 +287,15 @@ onBeforeUnmount(() => {
<view class="battle-guide">
<view class="guide-tips">
<text>弓箭手们，人都到齐了吗?</text>
<text v-if="room.battleType === 1">{{
<text v-if="battleType === 1">{{
`${room.count / 2}v${room.count / 2}比赛即将开始!`
}}</text>
<text v-if="room.battleType === 2">大乱斗即将开始! </text>
<text v-if="battleType === 2">大乱斗即将开始! </text>
</view>
<button hover-class="none" open-type="share">邀请</button>
</view>
</Guide>
<view v-if="room.battleType === 1 && room.count === 2" class="team-mode">
<view v-if="battleType === 1 && room.count === 2" class="team-mode">
<image
src="https://static.shelingxingqiu.com/attachment/2025-08-05/dbua9nuf5fyeph7cxi.png"
mode="widthFix"
@@ -261,9 +306,9 @@ onBeforeUnmount(() => {
class="player"
:style="{ transform: 'translateY(-60px)' }"
>
<Avatar :src="owner.avatar" :size="60" />
<text>管理员</text>
<Avatar :rankLvl="owner.rankLvl" :src="owner.avatar" :size="60" />
<text>{{ owner.name }}</text>
<text>创建者</text>
</view>
<view
v-else
@@ -278,26 +323,24 @@ onBeforeUnmount(() => {
class="player"
:style="{ transform: 'translateY(60px)' }"
>
<Avatar :src="opponent.avatar" :size="60" />
<text class="ready" :style="{ opacity: opponent.ready ? 1 : 0 }">
已准备
</text>
<text>{{ opponent.name }}</text>
<button
v-if="owner.id === user.id"
hover-class="none"
class="remove-player"
@click="() => removePlayer(opponent)"
>
<image src="../static/close-white.png" mode="widthFix" />
</button>
<Avatar
:rankLvl="opponent.rankLvl"
:src="opponent.avatar"
:size="60"
/>
<text v-if="opponent.name">{{ opponent.name }}</text>
</view>
<view class="no-player" v-else>
<image src="../static/question-mark.png" mode="widthFix" />
</view>
</view>
</view>
<block v-if="room.battleType === 1 && room.count >= 4">
<PlayerSeats
v-if="battleType === 2"
:total="room.count || 10"
:players="players"
/>
<block v-if="battleType === 1 && room.count >= 4">
<view class="all-players">
<image
src="https://static.shelingxingqiu.com/attachment/2025-08-13/dc0x1p59iab6cvbhqc.png"
@@ -316,61 +359,46 @@ onBeforeUnmount(() => {
<view>
<view v-for="(item, index) in players" :key="index">
<Avatar v-if="item.id" :src="item.avatar" :size="36" />
<text v-if="owner.id === item.id">管理员</text>
<button
v-if="owner.id !== item.id && item.id"
hover-class="none"
class="remove-player"
@click="() => removePlayer(item)"
:style="{ top: '-10rpx', right: '-10rpx' }"
>
<image src="../static/close-white.png" mode="widthFix" />
</button>
<text v-if="owner.id === item.id">创建者</text>
</view>
</view>
</view>
<view class="choose-side">
<view>
<view
v-for="(item, index) in redTeam"
v-for="(item, index) in blueTeam"
:key="index"
class="choose-side-left-item"
>
<button
hover-class="none"
v-if="item.id === user.id"
@click="chooseTeam(0)"
@click="chooseTeam(2)"
>
<image src="../static/close-grey.png" mode="widthFix" />
</button>
<text class="truncate">{{ item.name || "我要加入" }}</text>
<view v-if="item.id">
<Avatar :src="item.avatar" :size="36" />
<text :style="{ opacity: !!item.state ? 1 : 0 }">已准备</text>
</view>
<button v-else hover-class="none" @click="chooseTeam(2)">
<Avatar v-if="item.id" :src="item.avatar" :size="36" />
<button v-else hover-class="none" @click="chooseTeam(1)">
<image src="../static/add-grey.png" mode="widthFix" />
</button>
</view>
</view>
<view>
<view
v-for="(item, index) in blueTeam"
v-for="(item, index) in redTeam"
:key="index"
class="choose-side-right-item"
>
<view v-if="item.id">
<Avatar :src="item.avatar" :size="36" />
<text :style="{ opacity: !!item.state ? 1 : 0 }">已准备</text>
</view>
<button v-else hover-class="none" @click="chooseTeam(1)">
<Avatar v-if="item.id" :src="item.avatar" :size="36" />
<button v-else hover-class="none" @click="chooseTeam(0)">
<image src="../static/add-grey.png" mode="widthFix" />
</button>
<text class="truncate">{{ item.name || "我要加入" }}</text>
<button
hover-class="none"
v-if="item.id === user.id"
@click="chooseTeam(0)"
@click="chooseTeam(2)"
>
<image src="../static/close-grey.png" mode="widthFix" />
</button>
@@ -378,25 +406,51 @@ onBeforeUnmount(() => {
</view>
</view>
</block>
<PlayerSeats
v-if="room.battleType === 2"
:total="room.count || 10"
:players="players"
:removePlayer="removePlayer"
/>
<view>
<SButton :disabled="!canClick" :onClick="getReady">
{{
allReady.value
? "即将进入对局..."
: owner.id === user.id
? "开始对局"
: "我准备好了"
}}
</SButton>
<text class="tips">所有人准备好后由房主点击开始</text>
<!-- <SButton
v-if="user.id === owner.id && battleType === 1 && room.count === 2"
:disabled="!opponent.id"
:onClick="startGame"
>进入对战</SButton
>
<SButton
v-if="user.id === owner.id && battleType === 2"
:disabled="players.length < 3"
:onClick="startGame"
>进入大乱斗</SButton
>
<SButton
v-if="user.id === owner.id && battleType === 1 && room.count >= 4"
:disabled="
players.some((p) => p.groupType === undefined || p.groupType === 2)
"
:onClick="startGame"
>开启对局</SButton
>
<SButton v-if="user.id !== owner.id" disabled>等待房主开启对战</SButton> -->
<SButton :disabled="ready" :onClick="getReady">{{
allReady.value ? "即将进入对局..." : "我准备好了"
}}</SButton>
<!-- <text class="tips">创建者点击下一步，所有人即可进入游戏。</text> -->
</view>
</view>
<!-- <SModal
:show="showModal"
:onClose="() => (showModal = false)"
height="520rpx"
>
<view class="btns">
<SButton :onClick="exitRoom" width="200px" :rounded="20">
暂时离开
</SButton>
<block v-if="owner.id === user.id">
<view :style="{ height: '20px' }"></view>
<SButton :onClick="destroyRoom" width="200px" :rounded="20">
解散房间
</SButton>
</block>
</view>
</SModal> -->
</Container>
</template>
@@ -453,7 +507,6 @@ onBeforeUnmount(() => {
transform: translateY(-60px);
color: #fff;
font-size: 14px;
position: relative;
}
.player > image {
width: 70px;
@@ -462,19 +515,6 @@ onBeforeUnmount(() => {
background-color: #ccc;
margin-bottom: 5px;
}
.player > text:nth-child(2) {
color: #000;
background-color: #fed847;
font-size: 16rpx;
border-radius: 20rpx;
line-height: 26rpx;
padding: 0 10rpx;
margin-top: -16rpx;
position: relative;
}
.player > text:nth-child(3) {
margin-top: 6rpx;
}
.player > text {
max-width: 100px;
white-space: nowrap;
@@ -482,26 +522,12 @@ onBeforeUnmount(() => {
text-overflow: ellipsis;
text-align: center;
}
.player .ready {
background-color: #2c261fb3 !important;
border: 1rpx solid #a3793f66 !important;
color: #fed847 !important;
}
.remove-player {
width: 40rpx;
height: 40rpx;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
background: linear-gradient(0deg, #996c29b8 0%, #201e1aaf 100%);
position: absolute;
top: 0;
right: 0;
}
.remove-player > image {
width: 90%;
height: 90%;
.player > text:nth-child(3) {
color: #000;
background-color: #fed847;
font-size: 8px;
border-radius: 10px;
padding: 2rpx 10rpx;
}
.team-mode > view > image:nth-child(2) {
width: 120px;
@@ -619,7 +645,6 @@ onBeforeUnmount(() => {
left: calc(50% - 15px);
width: 30px;
text-align: center;
color: #333;
}
.choose-side {
display: flex;
@@ -678,28 +703,9 @@ onBeforeUnmount(() => {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 14rpx;
}
.choose-side-left-item > button:last-child > image,
.choose-side-right-item > button:first-child > image {
width: 18px;
}
.choose-side-left-item > view,
.choose-side-right-item > view {
display: flex;
flex-direction: column;
align-items: center;
}
.choose-side-left-item > view > text,
.choose-side-right-item > view > text {
font-size: 16rpx;
border-radius: 20rpx;
line-height: 26rpx;
padding: 0 10rpx;
margin-top: -16rpx;
position: relative;
background-color: #2c261fb3;
border: 1rpx solid #a3793f66;
color: #fed847;
}
</style>

18
src/pages/device-intro.vue
View File

@@ -5,15 +5,15 @@ import SButton from "@/components/SButton.vue";
import { capsuleHeight } from "@/util";
const images = [
"https://static.shelingxingqiu.com/mall/images/mall_01.jpg",
"https://static.shelingxingqiu.com/mall/images/mall_02.jpg",
"https://static.shelingxingqiu.com/mall/images/mall_03.jpg",
"https://static.shelingxingqiu.com/mall/images/mall_04.jpg",
"https://static.shelingxingqiu.com/mall/images/mall_05.jpg",
"https://static.shelingxingqiu.com/mall/images/mall_06.jpg",
"https://static.shelingxingqiu.com/mall/images/mall_07.jpg",
"https://static.shelingxingqiu.com/mall/images/mall_08.jpg",
"https://static.shelingxingqiu.com/mall/images/mall_09.jpg",
"https://static.shelingxingqiu.com/attachment/2025-09-04/dcjmxsmf6yitekatwe.jpg",
"https://static.shelingxingqiu.com/attachment/2025-09-04/dcjmxsmi475gqdtrvx.jpg",
"https://static.shelingxingqiu.com/attachment/2025-09-04/dcjmxsmgy8ej5wuap5.jpg",
"https://static.shelingxingqiu.com/attachment/2025-09-04/dcjmxsmg6y7nveaadv.jpg",
"https://static.shelingxingqiu.com/attachment/2025-12-04/depguhlqg9zxastyn3.jpg",
"https://static.shelingxingqiu.com/attachment/2025-12-04/depguhlfr041aedqmb.jpg",
"https://static.shelingxingqiu.com/attachment/2025-12-04/depguhlpnlyxndnor5.jpg",
"https://static.shelingxingqiu.com/attachment/2025-09-04/dcjmxsmg68a8mezgzx.jpg",
"https://static.shelingxingqiu.com/attachment/2025-10-14/ddht51a3hiyw7ueli4.jpg",
];
const addBg = ref(false);

82
src/pages/first-try.vue
View File

@@ -13,15 +13,10 @@ import BowPower from "@/components/BowPower.vue";
import TestDistance from "@/components/TestDistance.vue";
import BubbleTip from "@/components/BubbleTip.vue";
import audioManager from "@/audioManager";
import {
createPractiseAPI,
startPractiseAPI,
endPractiseAPI,
getPractiseAPI,
} from "@/apis";
import { createPractiseAPI, getPractiseAPI } from "@/apis";
import { sharePractiseData } from "@/canvas";
import { wxShare, debounce } from "@/util";
import { MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPES } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
@@ -45,13 +40,14 @@ const practiseId = ref("");
const showGuide = ref(false);
const guideImages = [
"https://static.shelingxingqiu.com/attachment/2026-02-08/dg9ev0wwdpgwt9e6du.png",
"https://static.shelingxingqiu.com/attachment/2026-02-08/dg9ev0wvv9sw4zioqk.png",
"https://static.shelingxingqiu.com/attachment/2026-02-08/dg9ev0ww3khaycallu.png",
"https://static.shelingxingqiu.com/attachment/2026-02-08/dg9ev0wtkcvaxxv0s8.png",
"https://static.shelingxingqiu.com/attachment/2026-02-08/dg9ev0wry5tw7ltmxr.png",
"https://static.shelingxingqiu.com/attachment/2026-02-08/dg9ev0wu3kcdrwzwpd.png",
"https://static.shelingxingqiu.com/attachment/2026-02-08/dg9ev0wwr6hfjhyfn5.png",
"https://static.shelingxingqiu.com/attachment/2025-07-09/db77x68bs7z5elwvw7.png",
"https://static.shelingxingqiu.com/attachment/2025-07-09/db77x68qmi7grgreen.png",
"https://static.shelingxingqiu.com/attachment/2025-07-09/db77x68hgrw1ip4wae.png",
"https://static.shelingxingqiu.com/attachment/2025-07-09/db77x684x8zmfrmbla.png",
"https://static.shelingxingqiu.com/attachment/2025-07-09/db77x67sding7fodnk.png",
"https://static.shelingxingqiu.com/attachment/2025-07-09/db77x68mpug7cac4yt.png",
"https://static.shelingxingqiu.com/attachment/2025-07-09/db77x68my783mlmgxv.png",
"https://static.shelingxingqiu.com/attachment/2025-07-09/db77x68p48ylzirtb0.png",
];
const onSwiperIndexChange = (index) => {
@@ -66,35 +62,24 @@ const createPractise = async (arrows) => {
};
const onOver = async () => {
practiseResult.value = await getPractiseAPI(practiseId.value);
start.value = false;
practiseResult.value = await getPractiseAPI(practiseId.value);
};
async function onReceiveMessage(msg) {
if (msg.type === MESSAGETYPESV2.ShootResult) {
scores.value = msg.details;
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
setTimeout(onOver, 1500);
} else if (msg.type === MESSAGETYPESV2.TestDistance) {
if (msg.shootData.distance / 100 >= 5) {
audioManager.play("距离合格");
btnDisabled.value = false;
showGuide.value = true;
} else audioManager.play("距离不足");
}
// messages.forEach((msg) => {
// if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
// if (step.value === 2 && msg.target.dst / 100 >= 5) {
// btnDisabled.value = false;
// showGuide.value = true;
// } else if (scores.value.length < total) {
// scores.value.push(msg.target);
// }
// if (scores.value.length === total) {
// setTimeout(onOver, 1500);
// }
// }
// });
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
if (step.value === 2 && msg.target.dst / 100 >= 5) {
btnDisabled.value = false;
showGuide.value = true;
} else if (scores.value.length < total) {
scores.value.push(msg.target);
}
if (scores.value.length === total) {
setTimeout(onOver, 1500);
}
}
});
}
const onClickShare = debounce(async () => {
@@ -117,7 +102,6 @@ onBeforeUnmount(() => {
uni.$off("socket-inbox", onReceiveMessage);
uni.$off("share-image", onClickShare);
audioManager.stopAll();
endPractiseAPI();
});
const nextStep = async () => {
@@ -129,15 +113,13 @@ const nextStep = async () => {
btnDisabled.value = true;
step.value = 2;
title.value = "-感知距离";
const result = await createPractiseAPI(total, 120);
if (result) practiseId.value = result.id;
} else if (step.value === 2) {
showGuide.value = false;
step.value = 3;
title.value = "-小试牛刀";
} else if (step.value === 3) {
title.value = "小试牛刀";
await startPractiseAPI();
await createPractise(total);
scores.value = [];
step.value = 4;
start.value = true;
@@ -151,8 +133,8 @@ const nextStep = async () => {
}
};
const onClose = async () => {
const validArrows = (practiseResult.value.details || []).filter(
const onClose = () => {
const validArrows = (practiseResult.value.arrows || []).filter(
(a) => a.x !== -30 && a.y !== -30
);
if (validArrows.length === total) {
@@ -166,8 +148,6 @@ const onClose = async () => {
start.value = false;
scores.value = [];
step.value = 3;
const result = await createPractiseAPI(total, 120);
if (result) practiseId.value = result.id;
}
};
</script>
@@ -262,16 +242,16 @@ const onClose = async () => {
v-if="step === 4"
:total="total"
:rowCount="6"
:arrows="scores"
:scores="scores.map((s) => s.ring)"
/>
<ScoreResult
v-if="practiseResult.details"
v-if="practiseResult.arrows"
:rowCount="6"
:total="total"
:onClose="onClose"
:result="practiseResult"
:tipSrc="`../static/${
practiseResult.details.filter(
practiseResult.arrows.filter(
(arrow) => arrow.x !== -30 && arrow.y !== -30
).length < total
? 'un'

41
src/pages/friend-battle.vue
View File

@@ -23,10 +23,8 @@ const warnning = ref("");
const roomNumber = ref("");
const data = ref({});
const roomID = ref("");
const loading = ref(false);
const enterRoom = debounce(async (number) => {
if (loading.value) return;
if (!canEenter(user.value, device.value, online.value)) return;
if (game.value.inBattle) {
uni.$showHint(1);
@@ -35,32 +33,27 @@ const enterRoom = debounce(async (number) => {
if (!number) {
warnning.value = "请输入房间号";
showModal.value = true;
return;
}
try {
} else {
const room = await getRoomAPI(number);
if (!room.number) {
if (room.number) {
const alreadyIn = room.members.find(
(item) => item.userInfo.id === user.value.id
);
if (!alreadyIn) {
const result = await joinRoomAPI(number);
if (result.full) {
warnning.value = "房间已满员";
showModal.value = true;
return;
}
}
uni.navigateTo({
url: "/pages/battle-room?roomNumber=" + number,
});
} else {
warnning.value = room.started ? "该房间对战已开始，无法加入" : "查无此房";
showModal.value = true;
return;
}
const alreadyIn = room.members.find(
(item) => item.userInfo.id === user.value.id
);
if (!alreadyIn) {
const result = await joinRoomAPI(number);
if (result.full) {
warnning.value = "房间已满员";
showModal.value = true;
return;
}
}
loading.value = true;
uni.navigateTo({
url: "/pages/battle-room?roomNumber=" + number,
});
} finally {
loading.value = false;
}
});
const onCreateRoom = async () => {

13
src/pages/index.vue
View File

@@ -39,11 +39,13 @@ const toPage = async (path) => {
showModal.value = true;
return;
}
// if (path === "/pages/first-try") {
// if (canEenter(user.value, device.value, online.value, path)) {
// await uni.$checkAudio();
// }
// }
if (path === "/pages/first-try") {
if (canEenter(user.value, device.value, online.value, path)) {
await uni.$checkAudio();
} else {
return;
}
}
uni.navigateTo({ url: path });
};
@@ -75,6 +77,7 @@ onShow(async () => {
if ("823,209,293,257".indexOf(homeData.user.id) !== -1) {
const show = uni.getStorageSync("show-the-user");
if (!show) {
showTheUser.value = true;
uni.setStorageSync("show-the-user", true);
}
}

248
src/pages/match-detail.vue
View File

@@ -5,49 +5,87 @@ import Container from "@/components/Container.vue";
import BattleHeader from "@/components/BattleHeader.vue";
import Avatar from "@/components/Avatar.vue";
import PlayerScore2 from "@/components/PlayerScore2.vue";
import { getBattleAPI } from "@/apis";
import { getGameAPI } from "@/apis";
const blueTeam = ref([]);
const redTeam = ref([]);
const roundsData = ref([]);
const goldenRoundsData = ref([]);
const battleId = ref("");
const data = ref({
teams: [],
rounds: [],
players: [],
});
const players = ref([]);
onLoad(async (options) => {
if (!options.battleId) return;
battleId.value = options.battleId || "60510101693403136";
const result = await getBattleAPI(battleId.value);
data.value = result;
if (result.mode > 3) {
players.value = result.resultList.map((item, index) => {
const plist = result.teams[0] ? result.teams[0].players : [];
const p = plist.find((p) => p.id === item.userId);
const arrows = new Array(12);
result.rounds.forEach((r, index) => {
if (r.shoots[item.userId]) {
r.shoots[item.userId].forEach((s, index2) => {
arrows[index2 + index * 6] = s;
});
if (options.id) {
battleId.value = options.id || "BATTLE-1755484626207409508-955";
const result = await getGameAPI(battleId.value);
data.value = result;
if (result.mode === 1) {
blueTeam.value = Object.values(result.bluePlayers || {});
redTeam.value = Object.values(result.redPlayers || {});
Object.values(result.roundsData).forEach((item) => {
let bluePoint = 1;
let redPoint = 1;
let blueTotalRings = 0;
let redTotalRings = 0;
let blueArrows = [];
let redArrows = [];
blueTeam.value.forEach((p) => {
if (!item[p.playerId]) return;
blueTotalRings += item[p.playerId].reduce((a, b) => a + b.ring, 0);
blueArrows = [...blueArrows, ...item[p.playerId]];
});
redTeam.value.forEach((p) => {
if (!item[p.playerId]) return;
redTotalRings += item[p.playerId].reduce((a, b) => a + b.ring, 0);
redArrows = [...redArrows, ...item[p.playerId]];
});
if (blueTotalRings > redTotalRings) {
bluePoint = 2;
redPoint = 0;
} else if (blueTotalRings < redTotalRings) {
bluePoint = 0;
redPoint = 2;
}
roundsData.value.push({
blue: {
avatars: blueTeam.value.map((p) => p.avatar),
arrows: blueArrows,
totalRing: blueTotalRings,
totalScore: bluePoint,
},
red: {
avatars: redTeam.value.map((p) => p.avatar),
arrows: redArrows,
totalRing: redTotalRings,
totalScore: redPoint,
},
});
});
return {
...item,
rank: index + 1,
name: p.name,
avatar: p.avatar || "",
arrows,
};
});
result.goldenRounds.forEach((round) => {
goldenRoundsData.value.push({
blue: {
avatars: blueTeam.value.map((p) => p.avatar),
arrows: round.arrowHistory.filter((a) => a.team === 1),
},
red: {
avatars: redTeam.value.map((p) => p.avatar),
arrows: round.arrowHistory.filter((a) => a.team === 0),
},
winner: round.winner,
});
});
}
}
});
const checkBowData = (selected) => {
if (data.value.mode <= 3) {
const checkBowData = () => {
if (data.value.mode === 1) {
uni.navigateTo({
url: `/pages/team-bow-data?battleId=${battleId.value}&selected=${selected}`,
url: `/pages/team-bow-data?battleId=${battleId.value}`,
});
} else {
} else if (data.value.mode === 2) {
uni.navigateTo({
url: `/pages/melee-bow-data?battleId=${battleId.value}`,
});
@@ -59,13 +97,13 @@ const checkBowData = (selected) => {
<Container title="详情">
<view class="container">
<BattleHeader
:winner="data.winTeam"
:blueTeam="data.teams[1] ? data.teams[1].players : []"
:redTeam="data.teams[2] ? data.teams[2].players : []"
:players="players"
:winner="data.winner"
:blueTeam="blueTeam"
:redTeam="redTeam"
:players="data.players"
/>
<view
v-if="data.mode >= 3"
v-if="data.players && data.players.length"
class="score-header"
:style="{ border: 'none', padding: '5px 15px' }"
>
@@ -76,61 +114,141 @@ const checkBowData = (selected) => {
</view>
</view>
<PlayerScore2
v-if="data.mode >= 3"
v-for="(player, index) in players"
v-if="data.players && data.players.length"
v-for="(player, index) in data.players"
:key="index"
:name="player.name"
:avatar="player.avatar"
:arrows="player.arrows"
:scores="player.arrowHistory"
:totalScore="player.totalScore"
:totalRing="player.totalRings"
:rank="index + 1"
/>
<view
v-if="data.mode <= 3"
v-for="(round, index) in data.rounds"
:key="index"
:style="{ marginBottom: '5px' }"
>
<block v-for="(round, index) in goldenRoundsData" :key="index">
<view class="score-header">
<text>{{ round.ifGold ? "决金箭" : `第${index + 1}轮` }}</text>
<view @click="() => checkBowData(index)">
<text>决金箭轮（环数）</text>
<view @click="checkBowData">
<text>查看靶纸</text>
<image src="../static/back.png" mode="widthFix" />
</view>
</view>
<view
class="score-row"
v-for="team in Object.keys(round.shoots)"
:key="team"
>
<view class="score-row">
<view>
<view>
<image
v-for="(p, index) in data.teams[team].players"
v-for="(src, index) in round.blue.avatars"
:style="{
borderColor: '#64BAFF',
transform: `translateX(-${index * 15}px)`,
}"
:src="p.avatar || '../static/user-icon.png'"
:src="src"
:key="index"
mode="widthFix"
/>
</view>
<text
v-for="(arrow, index2) in round.shoots[team]"
:key="index2"
:style="{ color: arrow.ringX ? '#fed847' : '#ccc' }"
>
{{ arrow.ringX ? "X" : `${arrow.ring}环` }}
<text v-for="(arrow, index) in round.blue.arrows" :key="index">
{{ arrow.ring }}环
</text>
</view>
<view>
<text :style="{ color: team == 1 ? '#64BAFF' : '#FF6767' }">
{{ round.shoots[team].reduce((acc, cur) => acc + cur.ring, 0) }}环
</text>
<text>得分 {{ round.scores[team].score }}</text>
</view>
<image
v-if="round.winner === 1"
src="../static/winner-badge.png"
mode="widthFix"
/>
</view>
<view class="score-row" :style="{ marginBottom: '5px' }">
<view>
<view>
<image
v-for="(src, index) in round.red.avatars"
:style="{
borderColor: '#FF6767',
transform: `translateX(-${index * 15}px)`,
}"
:src="src || '../static/user-icon.png'"
:key="index"
mode="widthFix"
/>
</view>
<text v-for="(arrow, index) in round.red.arrows" :key="index">
{{ arrow.ring }}环
</text>
</view>
<image
v-if="round.winner === 0"
src="../static/winner-badge.png"
mode="widthFix"
/>
</view>
</block>
<view
v-for="(round, index) in roundsData"
:key="index"
:style="{ marginBottom: '5px' }"
>
<block
v-if="
index < Object.keys(roundsData).length - goldenRoundsData.length
"
>
<view class="score-header">
<text>第{{ index + 1 }}轮</text>
<view @click="checkBowData">
<text>查看靶纸</text>
<image src="../static/back.png" mode="widthFix" />
</view>
</view>
<view class="score-row">
<view>
<view>
<image
v-for="(src, index) in round.blue.avatars"
:style="{
borderColor: '#64BAFF',
transform: `translateX(-${index * 15}px)`,
}"
:src="src || '../static/user-icon.png'"
:key="index"
mode="widthFix"
/>
</view>
<text v-for="(arrow, index2) in round.blue.arrows" :key="index2">
{{ arrow.ring }}环
</text>
</view>
<view>
<text :style="{ color: '#64BAFF' }">
{{ round.blue.totalRing }}环
</text>
<text>得分 {{ round.blue.totalScore }}</text>
</view>
</view>
<view class="score-row">
<view>
<view>
<image
v-for="(src, index) in round.red.avatars"
:style="{
borderColor: '#FF6767',
transform: `translateX(-${index * 15}px)`,
}"
:src="src || '../static/user-icon.png'"
:key="index"
mode="widthFix"
/>
</view>
<text v-for="(arrow, index2) in round.red.arrows" :key="index2">
{{ arrow.ring }}环
</text>
</view>
<view>
<text :style="{ color: '#FF6767' }">
{{ round.red.totalRing }}环
</text>
<text>得分 {{ round.red.totalScore }}</text>
</view>
</view>
</block>
</view>
<view :style="{ height: '20px' }"></view>
</view>

47
src/pages/match-page.vue
View File

@@ -6,32 +6,43 @@ import Matching from "@/components/Matching.vue";
import RoundEndTip from "@/components/RoundEndTip.vue";
import TestDistance from "@/components/TestDistance.vue";
import { matchGameAPI } from "@/apis";
import { MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPES } from "@/constants";
const gameType = ref(0);
const teamSize = ref(0);
const onComplete = ref(null);
const matchSuccess = ref(false);
async function stopMatch() {
uni.$showHint(3);
}
async function onReceiveMessage(msg) {
if (msg.type === MESSAGETYPESV2.MatchSuccess) {
matchSuccess.value = true;
onComplete.value = () => {
if (gameType.value == 1) {
uni.redirectTo({
url: `/pages/team-battle?battleId=${msg.id}&gameMode=2`,
});
} else if (gameType.value == 2) {
uni.redirectTo({
url: `/pages/melee-battle?battleId=${msg.id}&gameMode=2`,
});
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.WaitForAllReady) {
if (!onComplete.value) {
onComplete.value = () => {
if (msg.groupUserStatus) {
uni.setStorageSync("red-team", msg.groupUserStatus.redTeam);
uni.setStorageSync("blue-team", msg.groupUserStatus.blueTeam);
uni.setStorageSync("melee-players", [
...msg.groupUserStatus.redTeam,
...msg.groupUserStatus.blueTeam,
]);
}
uni.removeStorageSync("current-battle");
if (gameType.value == 1) {
uni.redirectTo({
url: `/pages/team-battle?battleId=${msg.id}&gameMode=2`,
});
} else if (gameType.value == 2) {
uni.redirectTo({
url: `/pages/melee-match?battleId=${msg.id}&gameMode=2`,
});
}
};
}
};
}
}
});
}
onLoad(async (options) => {
@@ -53,7 +64,7 @@ onBeforeUnmount(() => {
keepScreenOn: false,
});
uni.$off("socket-inbox", onReceiveMessage);
if (gameType.value && teamSize.value && !matchSuccess.value) {
if (gameType.value && teamSize.value) {
matchGameAPI(false, gameType.value, teamSize.value);
}
});
@@ -65,7 +76,7 @@ onShow(async () => {
});
onHide(() => {
if (gameType.value && teamSize.value && !matchSuccess.value) {
if (gameType.value && teamSize.value) {
matchGameAPI(false, gameType.value, teamSize.value);
}
});

199
src/pages/melee-battle.vue
View File

@@ -1,199 +0,0 @@
<script setup>
import { ref, onMounted, onBeforeUnmount } from "vue";
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import BowTarget from "@/components/BowTarget.vue";
import ShootProgress from "@/components/ShootProgress.vue";
import BattleHeader from "@/components/BattleHeader.vue";
import PlayerScore from "@/components/PlayerScore.vue";
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 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 title = ref("");
const start = ref(null);
const battleId = ref("");
const currentRound = ref(1);
const tips = ref("即将开始...");
const players = ref([]);
const playersSorted = ref([]);
const playersScores = ref([]);
const halfTimeTip = ref(false);
const halfRest = ref(false);
function recoverData(battleInfo, { force = false } = {}) {
if (battleInfo.way === 1) title.value = "好友约战 - 大乱斗";
if (battleInfo.way === 2) title.value = "排位赛 - 大乱斗";
players.value = battleInfo.teams[0].players;
start.value = battleInfo.status !== 0;
if (battleInfo.status === 0) {
const readyRemain = (Date.now() - battleInfo.createTime) / 1000;
console.log(`对局已进行${readyRemain}秒`);
if (readyRemain > 0 && readyRemain < 15) {
setTimeout(() => {
uni.$emit("update-timer", 15 - readyRemain - 0.2);
}, 200);
}
return;
}
tips.value =
(battleInfo.rounds.length !== 2 ? "上" : "下") + "半场：请先射6箭";
playersScores.value = battleInfo.rounds.map((r) => ({ ...r.shoots }));
const totals = {};
players.value.forEach((p) => {
const total = playersScores.value.reduce((acc, round) => {
const arr = round[p.id] || [];
return acc + arr.length;
}, 0);
totals[p.id] = total;
});
playersSorted.value = players.value.slice().sort((a, b) => {
return totals[b.id] - totals[a.id];
});
if (battleInfo.status === 3) {
halfTimeTip.value = true;
halfRest.value = true;
tips.value = "准备下半场";
// 剩余休息时间
// const remain = (Date.now() - battleInfo.timeoutTime) / 1000;
setTimeout(() => {
uni.$emit("update-remain", 0);
}, 200);
return;
}
if (force) {
const remain = (Date.now() - battleInfo.current.startTime) / 1000;
console.log(`当前轮已进行${remain}秒`);
if (remain > 0 && remain < 90) {
setTimeout(() => {
uni.$emit("update-remain", 90 - remain - 0.2);
}, 200);
}
}
}
onLoad(async (options) => {
if (options.battleId) battleId.value = options.battleId;
// uni.enableAlertBeforeUnload({
// message: "离开比赛可能导致比赛失败，是否继续？",
// success: (res) => {
// console.log("已启用离开提示");
// },
// });
});
async function onReceiveMessage(msg) {
if (Array.isArray(msg)) return;
if (msg.type === MESSAGETYPESV2.BattleStart) {
halfTimeTip.value = false;
halfRest.value = false;
recoverData(msg);
} else if (msg.type === MESSAGETYPESV2.ShootResult) {
recoverData(msg);
} else if (msg.type === MESSAGETYPESV2.HalfRest) {
halfTimeTip.value = true;
halfRest.value = true;
tips.value = "准备下半场";
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
setTimeout(() => {
uni.redirectTo({
url: "/pages/battle-result?battleId=" + msg.matchId,
});
}, 1000);
}
}
onMounted(async () => {
uni.setKeepScreenOn({
keepScreenOn: true,
});
uni.$on("socket-inbox", onReceiveMessage);
await laserCloseAPI();
});
onBeforeUnmount(() => {
uni.setKeepScreenOn({
keepScreenOn: false,
});
uni.$off("socket-inbox", onReceiveMessage);
audioManager.stopAll();
});
onShow(async () => {
if (battleId.value) {
const result = await getBattleAPI(battleId.value);
if (result.status === 2) {
uni.showToast({
title: "比赛已结束",
icon: "none",
});
uni.navigateBack({
delta: 2,
});
} else {
recoverData(result, { force: true });
}
}
});
</script>
<template>
<Container :title="title" :bgType="1">
<view class="container">
<BattleHeader v-if="!start" :players="players" />
<TestDistance v-if="start === false" :guide="false" :isBattle="true" />
<ShootProgress
:show="start"
:start="start && !halfRest"
:tips="tips"
:total="90"
:melee="true"
:battleId="battleId"
/>
<view v-if="start" class="user-row">
<Avatar :src="user.avatar" :size="35" />
<BowPower />
</view>
<BowTarget
v-if="start"
:currentRound="
playersScores.map((s) => s[user.id].length).reduce((a, b) => a + b, 0)
"
:totalRound="12"
:scores="playersScores.map((r) => r[user.id]).flat()"
:stop="halfRest"
/>
<view :style="{ paddingBottom: '20px' }">
<PlayerScore
v-if="start"
v-for="(player, index) in playersSorted"
:key="index"
:player="player"
:scores="playersScores.map((s) => s[player.id])"
/>
</view>
<ScreenHint
:show="halfTimeTip"
mode="small"
:onClose="() => (halfTimeTip = false)"
>
<view class="half-time-tip">
<text>上半场结束，休息一下吧:）</text>
<text>20秒后开始下半场</text>
</view>
</ScreenHint>
</view>
</Container>
</template>
<style scoped>
.container {
width: 100%;
height: 100%;
}
</style>

85
src/pages/melee-bow-data.vue
View File

@@ -4,39 +4,28 @@ import { onLoad } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import BowTarget from "@/components/BowTarget.vue";
import Avatar from "@/components/Avatar.vue";
import { getBattleAPI } from "@/apis";
import { getGameAPI } from "@/apis";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const { user } = storeToRefs(useStore());
const currentUser = ref({
arrows: [],
});
const players = ref([]);
const store = useStore();
const { user } = storeToRefs(store);
const scores = ref([]);
const currentUser = ref({});
const data = ref({});
const onSelect = (userId) => {
const user = data.value.players.find((p) => p.playerId === userId);
currentUser.value = user;
if (user && user.arrowHistory) {
scores.value = user.arrowHistory;
}
};
onLoad(async (options) => {
if (!options.battleId) return;
const result = await getBattleAPI(options.battleId || "59348111700660224");
players.value = result.resultList.map((item, index) => {
const plist = result.teams[0] ? result.teams[0].players : [];
const p = plist.find((p) => p.id === item.userId);
const arrows = new Array(12);
result.rounds.forEach((r, index) => {
if (r.shoots[item.userId]) {
r.shoots[item.userId].forEach((s, index2) => {
arrows[index2 + index * 6] = s;
});
}
});
return {
...item,
rank: index + 1,
name: p.name,
avatar: p.avatar || "",
arrows,
};
});
if (players.value[0]) {
currentUser.value = players.value[0];
if (options.battleId) {
const result = await getGameAPI(options.battleId);
data.value = result;
if (result.players && result.players[0]) {
onSelect(result.players[0].playerId);
}
}
});
</script>
@@ -44,26 +33,22 @@ onLoad(async (options) => {
<template>
<Container title="靶纸">
<view class="container">
<image
src="../static/battle-header-melee.png"
mode="widthFix"
:style="{ top: '-50rpx' }"
/>
<view class="players">
<image src="../static/battle-header-melee.png" mode="widthFix" />
<view class="players" v-if="data.players">
<view
v-for="(player, index) in players"
v-for="(player, index) in data.players"
:key="index"
:style="{
width: `${Math.max(100 / players.length, 18)}vw`,
color: player.userId === currentUser.userId ? '#000' : '#fff9',
width: `${Math.max(100 / data.players.length, 18)}vw`,
color: player.playerId === currentUser.playerId ? '#000' : '#fff9',
}"
@click="currentUser = player"
@click="() => onSelect(player.playerId)"
>
<image
v-if="player.userId === currentUser.userId"
v-if="player.playerId === currentUser.playerId"
src="../static/player-bg2.png"
:style="{
width: `${Math.max(100 / players.length, 18)}vw`,
width: `${Math.max(100 / data.players.length, 18)}vw`,
}"
class="player-bg"
/>
@@ -72,25 +57,23 @@ onLoad(async (options) => {
</view>
</view>
<view :style="{ marginTop: '10px' }">
<BowTarget :scores="currentUser.arrows" />
<BowTarget :scores="scores" />
</view>
<view class="score-text"
><text :style="{ color: '#fed847' }">{{
currentUser.arrows.length
}}</text
><text :style="{ color: '#fed847' }">{{ scores.length }}</text
>支箭，共<text :style="{ color: '#fed847' }">{{
currentUser.arrows.reduce((last, next) => last + next.ring, 0)
scores.reduce((last, next) => last + next.ring, 0)
}}</text
>环</view
>
<view class="score-row" v-if="currentUser.arrows">
<view class="score-row">
<view
v-for="(score, index) in currentUser.arrows"
v-for="(score, index) in scores"
:key="index"
class="score-item"
:style="{ width: '13vw', height: '13vw' }"
>
{{ score.ringX ? "X" : score.ring }}
{{ score.ring }}
</view>
</view>
</view>
@@ -114,7 +97,7 @@ onLoad(async (options) => {
display: flex;
width: 100%;
overflow-x: auto;
margin-top: 50rpx;
margin-top: 25px;
}
.players::-webkit-scrollbar {
width: 0;

248
src/pages/melee-match.vue Normal file
View File

@@ -0,0 +1,248 @@
<script setup>
import { ref, watch, onMounted, onBeforeUnmount } from "vue";
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import BowTarget from "@/components/BowTarget.vue";
import ShootProgress from "@/components/ShootProgress.vue";
import BattleHeader from "@/components/BattleHeader.vue";
import PlayerScore from "@/components/PlayerScore.vue";
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 audioManager from "@/audioManager";
import { getCurrentGameAPI, laserCloseAPI } from "@/apis";
import { isGameEnded } from "@/util";
import { MESSAGETYPES } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
const { user } = storeToRefs(store);
const title = ref("大乱斗");
const start = ref(false);
const startCount = ref(true);
const battleId = ref("");
const currentRound = ref(1);
const scores = ref([]);
const tips = ref("即将开始...");
const players = ref([]);
const playersSorted = ref([]);
const playersScores = ref({});
const halfTimeTip = ref(false);
const isEnded = ref(false);
watch(
() => [players.value, playersScores.value],
([n_players, n_scores]) => {
if (n_players.length) {
playersSorted.value = Object.keys(n_scores)
.sort((a, b) => n_scores[b].length - n_scores[a].length)
.map((pid) => n_players.find((p) => p.id == pid));
}
},
{
deep: true, // 添加深度监听
immediate: true,
}
);
function recoverData(battleInfo) {
uni.removeStorageSync("last-awake-time");
// 注释用于测试
battleId.value = battleInfo.id;
players.value = [...battleInfo.blueTeam, ...battleInfo.redTeam];
players.value.forEach((p) => {
playersScores.value[p.id] = [...p.arrows];
if (p.id === user.value.id) scores.value = [...p.arrows];
});
const remain = Date.now() / 1000 - battleInfo.startTime;
console.log(`当前局已进行${remain}秒`);
if (battleInfo.status === 0) {
if (remain > 0) {
setTimeout(() => {
uni.$emit("update-timer", 15 - remain);
}, 200);
}
} else {
start.value = true;
}
if (battleInfo.status === 2) {
const elapsedTime = (Date.now() - Date.parse(battleInfo.createdAt)) / 1000;
console.log("elapsedTime:", elapsedTime);
startCount.value = true;
// 这里的开始时间不是游戏开始时间，而是上半场或者下半场或者中场的开始时间，还要根据状态来判断
tips.value = battleInfo.halfGame
? "下半场：请再射6箭"
: "上半场：请先射6箭";
setTimeout(() => {
uni.$emit("update-ramain", 90 - remain);
}, 200);
} else if (battleInfo.status === 9) {
startCount.value = false;
tips.value = "准备下半场";
setTimeout(() => {
uni.$emit("update-ramain", 0);
}, 200);
}
}
onLoad(async (options) => {
if (options.gameMode == 1) title.value = "好友约战 - 大乱斗";
if (options.gameMode == 2) title.value = "排位赛 - 大乱斗";
if (options.battleId) {
battleId.value = options.battleId;
const players = uni.getStorageSync("melee-players");
if (players) {
players.value = players;
players.value.forEach((p) => {
playersScores.value[p.id] = [];
});
}
const battleInfo = uni.getStorageSync("current-battle");
if (battleInfo) {
recoverData(battleInfo);
setTimeout(getCurrentGameAPI, 2000);
}
}
uni.enableAlertBeforeUnload({
message: "离开比赛可能导致比赛失败，是否继续？",
success: (res) => {
console.log("已启用离开提示");
},
});
});
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.id !== battleId.value) return;
if (msg.constructor === MESSAGETYPES.MeleeAllReady) {
start.value = true;
startCount.value = true;
tips.value = scores.value.length
? "下半场：请再射6箭"
: "上半场：请先射6箭";
halfTimeTip.value = false;
}
if (msg.constructor === MESSAGETYPES.ShootResult) {
if (!start.value) getCurrentGameAPI();
if (msg.userId === user.value.id) {
scores.value.push({ ...msg.target });
}
playersScores.value[msg.userId].push({ ...msg.target });
}
if (msg.constructor === MESSAGETYPES.HalfTimeOver) {
uni.$emit("update-ramain", 0);
[...msg.groupUserStatus.redTeam, ...msg.groupUserStatus.blueTeam].forEach(
(player) => {
playersScores.value[player.id] = [...player.arrows];
if (player.id === user.value.id) scores.value = [...player.arrows];
}
);
startCount.value = false;
halfTimeTip.value = true;
tips.value = "准备下半场";
}
if (msg.constructor === MESSAGETYPES.MatchOver) {
isEnded.value = true;
uni.setStorageSync("last-battle", msg.endStatus);
setTimeout(() => {
uni.redirectTo({
url: "/pages/battle-result",
});
}, 1000);
}
if (msg.constructor === MESSAGETYPES.BackToGame) {
uni.$emit("update-header-loading", false);
if (msg.battleInfo) recoverData(msg.battleInfo);
}
});
}
onMounted(async () => {
uni.setKeepScreenOn({
keepScreenOn: true,
});
uni.$on("socket-inbox", onReceiveMessage);
await laserCloseAPI();
});
onBeforeUnmount(() => {
uni.setKeepScreenOn({
keepScreenOn: false,
});
uni.$off("socket-inbox", onReceiveMessage);
audioManager.stopAll();
});
const refreshTimer = ref(null);
onShow(async () => {
if (battleId.value) {
if (!isEnded.value && (await isGameEnded(battleId.value))) return;
getCurrentGameAPI();
const refreshData = () => {
const lastAwakeTime = uni.getStorageSync("last-awake-time");
if (lastAwakeTime) {
getCurrentGameAPI();
} else {
clearInterval(refreshTimer.value);
}
};
refreshTimer.value = setInterval(refreshData, 2000);
}
});
onHide(() => {
if (refreshTimer.value) clearInterval(refreshTimer.value);
uni.setStorageSync("last-awake-time", Date.now());
});
</script>
<template>
<Container :title="title" :bgType="1">
<view class="container">
<BattleHeader v-if="!start" :players="players" />
<TestDistance v-if="!start" :guide="false" :isBattle="true" />
<ShootProgress
:show="start"
:start="start && startCount"
:tips="tips"
:total="90"
:melee="true"
:battleId="battleId"
/>
<view v-if="start" class="user-row">
<Avatar :src="user.avatar" :size="35" />
<BowPower />
</view>
<BowTarget
v-if="start"
:currentRound="scores.length"
:totalRound="12"
:scores="scores"
:stop="!startCount"
/>
<view :style="{ paddingBottom: '20px' }">
<PlayerScore
v-if="start"
v-for="(player, index) in playersSorted"
:key="index"
:player="player"
:scores="playersScores[player.id] || []"
/>
</view>
<ScreenHint
:show="halfTimeTip"
mode="small"
:onClose="() => (halfTimeTip = false)"
>
<view class="half-time-tip">
<text>上半场结束，休息一下吧:）</text>
<text>20秒后开始下半场</text>
</view>
</ScreenHint>
</view>
</Container>
</template>
<style scoped>
.container {
width: 100%;
height: 100%;
}
</style>

11
src/pages/mine-bow-data.vue
View File

@@ -14,10 +14,11 @@ const arrows = ref([]);
const total = ref(0);
onLoad(async (options) => {
if (!options.id) return;
const result = await getPractiseAPI(options.id || 176);
arrows.value = result.details;
total.value = result.details.length;
if (options.id) {
const result = await getPractiseAPI(options.id);
arrows.value = result.arrows;
total.value = result.completed_arrows;
}
});
</script>
@@ -46,7 +47,7 @@ onLoad(async (options) => {
:completeEffect="false"
:rowCount="total === 12 ? 6 : 9"
:total="total"
:arrows="arrows"
:scores="arrows.map((a) => a.ring)"
:margin="arrows.length === 12 ? 4 : 1"
:fontSize="arrows.length === 12 ? 25 : 22"
/>

40
src/pages/my-growth.vue
View File

@@ -17,7 +17,7 @@ const practiseList = ref([]);
const toMatchDetail = (id) => {
uni.navigateTo({
url: `/pages/match-detail?battleId=${id}`,
url: `/pages/match-detail?id=${id}`,
});
};
const getPractiseDetail = async (id) => {
@@ -52,10 +52,6 @@ const onPractiseLoading = async (page) => {
}
return result.length;
};
const getName = (battle) => {
if (battle.mode <= 3) return `${battle.mode}V${battle.mode}`;
return battle.mode + "人大乱斗";
};
</script>
<template>
@@ -84,19 +80,19 @@ const getName = (battle) => {
<view
v-for="(item, index) in matchList"
:key="index"
@click="() => toMatchDetail(item.id)"
@click="() => toMatchDetail(item.battleId)"
>
<view class="contest-header">
<text>{{ getName(item) }}</text>
<text>{{ item.createTime }}</text>
<text>{{ item.name }}</text>
<text>{{ item.createdAt }}</text>
<image src="../static/back.png" mode="widthFix" />
</view>
<BattleHeader
:players="item.teams[0] ? item.teams[0].players : []"
:blueTeam="item.teams[1] ? item.teams[1].players : []"
:redTeam="item.teams[2] ? item.teams[2].players : []"
:winner="item.winTeam"
:showRank="item.teams[0]"
:players="item.mode === 1 ? [] : item.players"
:blueTeam="item.bluePlayers"
:redTeam="item.redPlayers"
:winner="item.winner"
:showRank="item.mode === 2"
:showHeader="false"
/>
</view>
@@ -107,19 +103,19 @@ const getName = (battle) => {
<view
v-for="(item, index) in battleList"
:key="index"
@click="() => toMatchDetail(item.id)"
@click="() => toMatchDetail(item.battleId)"
>
<view class="contest-header">
<text>{{ getName(item) }}</text>
<text>{{ item.createTime }}</text>
<text>{{ item.name }}</text>
<text>{{ item.createdAt }}</text>
<image src="../static/back.png" mode="widthFix" />
</view>
<BattleHeader
:players="item.teams[0] ? item.teams[0].players : []"
:blueTeam="item.teams[1] ? item.teams[1].players : []"
:redTeam="item.teams[2] ? item.teams[2].players : []"
:winner="item.winTeam"
:showRank="item.teams[0]"
:players="item.mode === 1 ? [] : item.players"
:blueTeam="item.bluePlayers"
:redTeam="item.redPlayers"
:winner="item.winner"
:showRank="item.mode === 2"
:showHeader="false"
/>
</view>
@@ -135,7 +131,7 @@ const getName = (battle) => {
>
<text
>{{ item.completed_arrows === 36 ? "耐力挑战" : "单组练习" }}
{{ item.createTime }}</text
{{ item.createdAt }}</text
>
<image src="../static/back.png" mode="widthFix" />
</view>

67
src/pages/practise-one.vue
View File

@@ -13,15 +13,10 @@ import TestDistance from "@/components/TestDistance.vue";
import BubbleTip from "@/components/BubbleTip.vue";
import audioManager from "@/audioManager";
import {
createPractiseAPI,
startPractiseAPI,
endPractiseAPI,
getPractiseAPI,
} from "@/apis";
import { createPractiseAPI, getPractiseAPI } from "@/apis";
import { sharePractiseData } from "@/canvas";
import { wxShare, debounce } from "@/util";
import { MESSAGETYPESV2, roundsName } from "@/constants";
import { MESSAGETYPES, roundsName } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
@@ -31,33 +26,51 @@ const { user } = storeToRefs(store);
const start = ref(false);
const scores = ref([]);
const total = 12;
const currentRound = ref(0);
const practiseResult = ref({});
const practiseId = ref("");
const showGuide = ref(false);
const tips = ref("");
const onReady = async () => {
await startPractiseAPI();
const result = await createPractiseAPI(total, 2);
if (result) practiseId.value = result.id;
currentRound.value = 0;
scores.value = [];
start.value = true;
audioManager.play("练习开始");
};
const onOver = async () => {
practiseResult.value = await getPractiseAPI(practiseId.value);
start.value = false;
practiseResult.value = await getPractiseAPI(practiseId.value);
};
async function onReceiveMessage(msg) {
if (msg.type === MESSAGETYPESV2.ShootResult) {
scores.value = msg.details;
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
setTimeout(onOver, 1500);
}
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID && start.value) {
if (scores.value.length < total) {
scores.value.push(msg.target);
currentRound.value += 1;
if (currentRound.value === 4) {
currentRound.value = 1;
}
if (practiseId && scores.value.length === total / 2) {
showGuide.value = true;
setTimeout(() => {
showGuide.value = false;
}, 3000);
}
if (scores.value.length === total) {
setTimeout(onOver, 1500);
}
}
}
});
}
async function onComplete() {
const validArrows = (practiseResult.value.details || []).filter(
const validArrows = (practiseResult.value.arrows || []).filter(
(a) => a.x !== -30 && a.y !== -30
);
if (validArrows.length === total) {
@@ -67,8 +80,7 @@ async function onComplete() {
practiseResult.value = {};
start.value = false;
scores.value = [];
const result = await createPractiseAPI(total, 120);
if (result) practiseId.value = result.id;
currentRound.value = 0;
}
}
@@ -77,15 +89,13 @@ const onClickShare = debounce(async () => {
await wxShare("shareCanvas");
});
onMounted(async () => {
// audioManager.play("第一轮");
onMounted(() => {
audioManager.play("第一轮");
uni.setKeepScreenOn({
keepScreenOn: true,
});
uni.$on("socket-inbox", onReceiveMessage);
uni.$on("share-image", onClickShare);
const result = await createPractiseAPI(total, 120);
if (result) practiseId.value = result.id;
});
onBeforeUnmount(() => {
@@ -95,7 +105,6 @@ onBeforeUnmount(() => {
uni.$off("socket-inbox", onReceiveMessage);
uni.$off("share-image", onClickShare);
audioManager.stopAll();
endPractiseAPI();
});
</script>
@@ -106,8 +115,8 @@ onBeforeUnmount(() => {
:showBottom="!start && !scores.length"
>
<view>
<TestDistance v-if="!start && !practiseResult.id" />
<block v-else>
<TestDistance v-if="!practiseId" />
<block v-if="practiseId">
<ShootProgress
:tips="`${
!start || scores.length === 12
@@ -129,18 +138,18 @@ onBeforeUnmount(() => {
</view>
<BowTarget
:totalRound="start ? total / 4 : 0"
:currentRound="scores.length % 3"
:currentRound="currentRound"
:scores="scores"
/>
<ScorePanel2 :arrows="scores" />
<ScorePanel2 :scores="scores.map((s) => s.ring)" />
<ScoreResult
v-if="practiseResult.details"
v-if="practiseResult.arrows"
:rowCount="6"
:total="total"
:onClose="onComplete"
:result="practiseResult"
:tipSrc="`../static/${
practiseResult.details.filter(
practiseResult.arrows.filter(
(arrow) => arrow.x !== -30 && arrow.y !== -30
).length < total
? 'un'

85
src/pages/practise-two.vue
View File

@@ -12,15 +12,10 @@ import TestDistance from "@/components/TestDistance.vue";
import BubbleTip from "@/components/BubbleTip.vue";
import audioManager from "@/audioManager";
import {
createPractiseAPI,
startPractiseAPI,
endPractiseAPI,
getPractiseAPI,
} from "@/apis";
import { createPractiseAPI, getPractiseAPI } from "@/apis";
import { sharePractiseData } from "@/canvas";
import { wxShare, debounce } from "@/util";
import { MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPES } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
@@ -35,43 +30,41 @@ const practiseId = ref("");
const showGuide = ref(false);
const onReady = async () => {
await startPractiseAPI();
const result = await createPractiseAPI(total, 3);
if (result) practiseId.value = result.id;
scores.value = [];
start.value = true;
audioManager.play("练习开始");
setTimeout(() => {
audioManager.play("练习开始");
}, 300);
};
const onOver = async () => {
practiseResult.value = await getPractiseAPI(practiseId.value);
start.value = false;
practiseResult.value = await getPractiseAPI(practiseId.value);
};
async function onReceiveMessage(msg) {
if (msg.type === MESSAGETYPESV2.ShootResult) {
scores.value = msg.details;
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
setTimeout(onOver, 1500);
}
// messages.forEach((msg) => {
// if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
// if (scores.value.length < total) {
// scores.value.push(msg.target);
// if (practiseId && scores.value.length === total / 2) {
// showGuide.value = true;
// setTimeout(() => {
// showGuide.value = false;
// }, 3000);
// }
// if (scores.value.length === total) {
// setTimeout(onOver, 1500);
// }
// }
// }
// });
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID && start.value) {
if (scores.value.length < total) {
scores.value.push(msg.target);
if (practiseId && scores.value.length === total / 2) {
showGuide.value = true;
setTimeout(() => {
showGuide.value = false;
}, 3000);
}
if (scores.value.length === total) {
setTimeout(onOver, 1500);
}
}
}
});
}
async function onComplete() {
const validArrows = (practiseResult.value.details || []).filter(
const validArrows = (practiseResult.value.arrows || []).filter(
(a) => a.x !== -30 && a.y !== -30
);
if (validArrows.length === total) {
@@ -81,8 +74,7 @@ async function onComplete() {
practiseResult.value = {};
start.value = false;
scores.value = [];
const result = await createPractiseAPI(total, 360);
if (result) practiseId.value = result.id;
currentRound.value = 0;
}
}
@@ -91,14 +83,12 @@ const onClickShare = debounce(async () => {
await wxShare("shareCanvas");
});
onMounted(async () => {
onMounted(() => {
uni.setKeepScreenOn({
keepScreenOn: true,
});
uni.$on("socket-inbox", onReceiveMessage);
uni.$on("share-image", onClickShare);
const result = await createPractiseAPI(total, 360);
if (result) practiseId.value = result.id;
});
onBeforeUnmount(() => {
@@ -108,23 +98,18 @@ onBeforeUnmount(() => {
uni.$off("socket-inbox", onReceiveMessage);
uni.$off("share-image", onClickShare);
audioManager.stopAll();
endPractiseAPI();
});
</script>
<template>
<Container
:bgType="1"
title="日常耐力挑战"
:showBottom="!start && !scores.length"
>
<Container :bgType="1" title="日常耐力挑战" :showBottom="!start && !scores.length">
<view>
<TestDistance v-if="!start && !practiseResult.id" />
<block v-else>
<TestDistance v-if="!practiseId" />
<block v-if="practiseId">
<ShootProgress
:tips="`请连续射${total}支箭`"
:start="start"
:total="360"
:total="0"
:onStop="onOver"
/>
<view class="user-row">
@@ -142,20 +127,20 @@ onBeforeUnmount(() => {
/>
<ScorePanel
v-if="start"
:arrows="scores"
:scores="scores.map((s) => s.ring)"
:total="total"
:rowCount="total / 4"
:margin="1.5"
:font-size="20"
/>
<ScoreResult
v-if="practiseResult.details"
v-if="practiseResult.arrows"
:total="total"
:rowCount="9"
:onClose="onComplete"
:result="practiseResult"
:tipSrc="`../static/${
practiseResult.details.filter(
practiseResult.arrows.filter(
(arrow) => arrow.x !== -30 && arrow.y !== -30
).length < total
? '2un'

2
src/pages/practise.vue
View File

@@ -15,7 +15,7 @@ const data = ref({});
const goPractise = async (type) => {
if (!canEenter(user.value, device.value, online.value)) return;
// await uni.$checkAudio();
await uni.$checkAudio();
uni.navigateTo({
url: `/pages/practise-${type}`,
});

8
src/pages/ranking.vue
View File

@@ -197,22 +197,22 @@ onShow(async () => {
<image
src="../static/battle2v2.png"
mode="widthFix"
@click.stop="() => toMatchPage(2, 4)"
@click.stop="() => toMatchPage(1, 4)"
/>
<image
src="../static/battle3v3.png"
mode="widthFix"
@click.stop="() => toMatchPage(3, 6)"
@click.stop="() => toMatchPage(1, 6)"
/>
<image
src="../static/battle5.png"
mode="widthFix"
@click.stop="() => toMatchPage(4, 5)"
@click.stop="() => toMatchPage(2, 5)"
/>
<image
src="../static/battle10.png"
mode="widthFix"
@click.stop="() => toMatchPage(5, 10)"
@click.stop="() => toMatchPage(2, 10)"
/>
</view>
<view class="data-progress">

375
src/pages/team-battle.vue
View File

@@ -4,6 +4,7 @@ import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import BattleHeader from "@/components/BattleHeader.vue";
import BowTarget from "@/components/BowTarget.vue";
import PlayersRow from "@/components/PlayersRow.vue";
import BattleFooter from "@/components/BattleFooter.vue";
import ScreenHint from "@/components/ScreenHint.vue";
import SButton from "@/components/SButton.vue";
@@ -11,17 +12,18 @@ 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 { laserCloseAPI, getBattleAPI } from "@/apis";
import { MESSAGETYPESV2 } from "@/constants";
import { getCurrentGameAPI, laserCloseAPI } from "@/apis";
import { isGameEnded } from "@/util";
import { MESSAGETYPES, roundsName } from "@/constants";
import audioManager from "@/audioManager";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
const { user } = storeToRefs(store);
const start = ref(null);
const start = ref(false);
const tips = ref("");
const battleId = ref("");
const currentRound = ref(0);
const currentRound = ref(1);
const goldenRound = ref(0);
const currentRedPoint = ref(0);
const currentBluePoint = ref(0);
@@ -35,114 +37,252 @@ const redPoints = ref(0);
const bluePoints = ref(0);
const showRoundTip = ref(false);
const isFinalShoot = ref(false);
const isEnded = ref(false);
const recoverData = (battleInfo, { force = false, arrowOnly = false } = {}) => {
try {
battleId.value = battleInfo.matchId;
blueTeam.value = battleInfo.teams[1].players || [];
redTeam.value = battleInfo.teams[2].players || [];
start.value = battleInfo.status !== 0;
if (battleInfo.status === 0) {
const readyRemain = (Date.now() - battleInfo.createTime) / 1000;
console.log(`对局已进行${readyRemain}秒`);
if (readyRemain > 0 && readyRemain < 15) {
setTimeout(() => {
uni.$emit("update-timer", 15 - readyRemain - 0.2);
}, 200);
}
return;
function recoverData(battleInfo) {
uni.removeStorageSync("last-awake-time");
battleId.value = battleInfo.id;
redTeam.value = battleInfo.redTeam;
blueTeam.value = battleInfo.blueTeam;
if (battleInfo.status === 0) {
const readyRemain = Date.now() / 1000 - battleInfo.startTime;
console.log(`当前局已进行${readyRemain}秒`);
if (readyRemain > 0) {
setTimeout(() => {
uni.$emit("update-timer", 15 - readyRemain);
}, 200);
}
if (!arrowOnly) {
currentShooterId.value = battleInfo.current.playerId;
const redPlayer = battleInfo.teams[2].players.find(
(item) => item.id === battleInfo.current.playerId
} else {
start.value = true;
bluePoints.value = 0;
redPoints.value = 0;
currentRound.value = battleInfo.currentRound;
roundResults.value = [...battleInfo.roundResults];
// 算得分
battleInfo.roundResults.forEach((round) => {
const blueTotal = round.blueArrows.reduce(
(last, next) => last + next.ring,
0
);
let nextTips = redPlayer ? "请红队射箭" : "请蓝队射箭";
if (force) nextTips += "重回";
if (
battleInfo.current.playerId === user.value.id &&
redTeam.value.length > 1
) {
nextTips += "你";
}
tips.value = nextTips;
uni.$emit("update-tips", nextTips);
if (force) {
const remain = (Date.now() - battleInfo.current.startTime) / 1000;
console.log(`当前轮已进行${remain}秒`);
if (remain > 0 && remain < 15) {
setTimeout(() => {
uni.$emit("update-remain", 15 - remain - 0.2);
}, 200);
}
const redTotal = round.redArrows.reduce(
(last, next) => last + next.ring,
0
);
if (blueTotal === redTotal) {
bluePoints.value += 1;
redPoints.value += 1;
} else if (blueTotal > redTotal) {
bluePoints.value += 2;
} else {
uni.$emit("update-remain", battleInfo.readyTime);
redPoints.value += 2;
}
});
if (battleInfo.goldenRoundNumber) {
currentRound.value += battleInfo.goldenRoundNumber;
goldenRound.value = battleInfo.goldenRoundNumber;
isFinalShoot.value = true;
for (let i = 1; i <= battleInfo.goldenRoundNumber; i++) {
const redArrows = [];
battleInfo.redTeam.forEach((item) => {
if (item.shotHistory[roundResults.value.length + 1]) {
item.shotHistory[roundResults.value.length + 1]
.filter((item) => !!item.playerId)
.forEach((item) => redArrows.push(item));
}
});
const blueArrows = [];
battleInfo.blueTeam.forEach((item) => {
if (item.shotHistory[roundResults.value.length + 1]) {
item.shotHistory[roundResults.value.length + 1]
.filter((item) => !!item.playerId)
.forEach((item) => blueArrows.push(item));
}
});
roundResults.value.push({
number: roundResults.value.length + 1,
blueArrows,
redArrows,
blueTotal: blueArrows.reduce((last, next) => last + next.ring, 0),
redTotal: redArrows.reduce((last, next) => last + next.ring, 0),
});
}
} else {
currentRound.value = battleInfo.current.round || 1;
const latestRound = battleInfo.rounds[currentRound.value - 1];
if (latestRound) {
blueScores.value = latestRound.shoots[1];
scores.value = latestRound.shoots[2];
const hasCurrentRoundData =
battleInfo.redTeam.some(
(item) => !!item.shotHistory[battleInfo.currentRound]
) ||
battleInfo.blueTeam.some(
(item) => !!item.shotHistory[battleInfo.currentRound]
);
if (
battleInfo.currentRound > battleInfo.roundResults.length &&
hasCurrentRoundData
) {
const blueArrows = [];
const redArrows = [];
battleInfo.redTeam.forEach((item) =>
item.shotHistory[battleInfo.currentRound]
.filter((item) => !!item.playerId)
.forEach((item) => redArrows.push(item))
);
battleInfo.blueTeam.forEach((item) =>
item.shotHistory[battleInfo.currentRound]
.filter((item) => !!item.playerId)
.forEach((item) => blueArrows.push(item))
);
roundResults.value.push({
redArrows,
blueArrows,
});
}
}
roundResults.value = battleInfo.rounds || [];
isFinalShoot.value = battleInfo.current.goldRound;
bluePoints.value = battleInfo.teams[1].score;
redPoints.value = battleInfo.teams[2].score;
} catch (err) {
console.log(err);
}
};
async function onReceiveMessage(msg) {
if (Array.isArray(msg)) return;
if (msg.type === MESSAGETYPESV2.BattleStart) {
start.value = true;
} else if (msg.type === MESSAGETYPESV2.ToSomeoneShoot) {
recoverData(msg);
} else if (msg.type === MESSAGETYPESV2.ShootResult) {
showRoundTip.value = false;
recoverData(msg, { arrowOnly: true });
} else if (msg.type === MESSAGETYPESV2.NewRound) {
showRoundTip.value = true;
isFinalShoot.value = msg.current.goldRound;
const latestRound = msg.rounds[currentRound.value - 1];
if (latestRound) {
if (isFinalShoot.value) {
currentBluePoint.value = msg.teams[1].score;
currentRedPoint.value = msg.teams[2].score;
} else {
currentBluePoint.value = latestRound.scores[1].score;
currentRedPoint.value = latestRound.scores[2].score;
}
}
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
if (msg.status === 4) {
showRoundTip.value = true;
currentBluePoint.value = 0;
currentRedPoint.value = 0;
setTimeout(() => {
uni.navigateBack();
}, 2000);
return;
}
setTimeout(() => {
uni.redirectTo({
url: "/pages/battle-result?battleId=" + msg.matchId,
[...battleInfo.redTeam, ...battleInfo.blueTeam].some((p) => {
if (p.id === user.value.id) {
const roundArrows = Object.values(p.shotHistory);
if (roundArrows.length) {
uni.$emit("update-shot", {
currentShot: roundArrows[roundArrows.length - 1].length,
totalShot: battleInfo.config.teamSize === 2 ? 3 : 2,
});
}
return true;
}
return false;
});
}, 1000);
}
const lastIndex = roundResults.value.length - 1;
if (roundResults.value[lastIndex]) {
const redArrows = roundResults.value[lastIndex].redArrows;
scores.value = [...redArrows]
.filter((item) => !!item.playerId)
.sort((a, b) => a.shotTimeUnix - b.shotTimeUnix);
const blueArrows = roundResults.value[lastIndex].blueArrows;
blueScores.value = [...blueArrows]
.filter((item) => !!item.playerId)
.sort((a, b) => a.shotTimeUnix - b.shotTimeUnix);
}
if (battleInfo.firePlayerIndex) {
currentShooterId.value = battleInfo.firePlayerIndex;
const redPlayer = redTeam.value.find(
(item) => item.id === currentShooterId.value
);
let nextTips = redPlayer ? "请红队射箭" : "请蓝队射箭";
nextTips += "重回";
// if (battleInfo.firePlayerIndex === user.value.id) nextTips += "你";
tips.value = nextTips;
uni.$emit("update-tips", nextTips);
}
if (battleInfo.fireTime > 0) {
const remain = Date.now() / 1000 - battleInfo.fireTime;
console.log(`当前箭已过${remain}秒`);
if (remain > 0 && remain <= 15) {
// 等渲染好再通知
setTimeout(() => {
uni.$emit("update-ramain", 15 - remain);
}, 300);
}
}
}
}
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.WaitForAllReady) {
redTeam.value = msg.groupUserStatus.redTeam;
blueTeam.value = msg.groupUserStatus.blueTeam;
}
if (msg.constructor === MESSAGETYPES.AllReady) {
start.value = true;
}
if (msg.constructor === MESSAGETYPES.ToSomeoneShoot) {
if (currentShooterId.value !== msg.userId) {
currentShooterId.value = msg.userId;
const redPlayer = redTeam.value.find(
(item) => item.id === currentShooterId.value
);
let nextTips = redPlayer ? "请红队射箭" : "请蓝队射箭";
if (msg.userId === user.value.id && redTeam.value.length > 1) {
nextTips += "你";
}
if (nextTips !== tips.value) {
tips.value = nextTips;
uni.$emit("update-tips", tips.value);
} else {
uni.$emit("update-ramain", 15);
}
}
}
if (msg.constructor === MESSAGETYPES.ShootResult) {
if (msg.battleInfo) recoverData(msg.battleInfo);
}
if (msg.constructor === MESSAGETYPES.CurrentRoundEnded) {
const result = msg.preRoundResult;
scores.value = [];
blueScores.value = [];
currentShooterId.value = 0;
currentBluePoint.value = result.blueScore;
currentRedPoint.value = result.redScore;
bluePoints.value += result.blueScore;
redPoints.value += result.redScore;
if (!result.goldenRound) {
showRoundTip.value = true;
}
}
if (msg.constructor === MESSAGETYPES.FinalShoot) {
currentShooterId.value = 0;
currentBluePoint.value = bluePoints.value;
currentRedPoint.value = redPoints.value;
if (!isFinalShoot.value) {
isFinalShoot.value = true;
showRoundTip.value = true;
tips.value = "准备开始决金箭";
}
}
if (msg.constructor === MESSAGETYPES.MatchOver) {
if (msg.endStatus.noSaved) {
currentBluePoint.value = 0;
currentRedPoint.value = 0;
showRoundTip.value = true;
isFinalShoot.value = false;
setTimeout(() => {
uni.navigateBack();
}, 3000);
} else {
isEnded.value = true;
uni.setStorageSync("last-battle", msg.endStatus);
setTimeout(() => {
uni.redirectTo({
url: "/pages/battle-result",
});
}, 1000);
}
}
if (msg.constructor === MESSAGETYPES.BackToGame) {
uni.$emit("update-header-loading", false);
if (msg.battleInfo) recoverData(msg.battleInfo);
}
});
}
onLoad(async (options) => {
if (options.battleId) battleId.value = options.battleId;
// uni.enableAlertBeforeUnload({
// message: "离开比赛可能导致比赛失败，是否继续？",
// success: (res) => {
// console.log("已启用离开提示");
// },
// });
if (options.battleId) {
battleId.value = options.battleId;
redTeam.value = uni.getStorageSync("red-team");
blueTeam.value = uni.getStorageSync("blue-team");
const battleInfo = uni.getStorageSync("current-battle");
if (battleInfo) {
await nextTick(() => {
recoverData(battleInfo);
});
setTimeout(getCurrentGameAPI, 2000);
}
}
uni.enableAlertBeforeUnload({
message: "离开比赛可能导致比赛失败，是否继续？",
success: (res) => {
console.log("已启用离开提示");
},
});
});
onMounted(async () => {
uni.setKeepScreenOn({
@@ -161,31 +301,30 @@ onBeforeUnmount(() => {
const refreshTimer = ref(null);
onShow(async () => {
if (battleId.value) {
const result = await getBattleAPI(battleId.value);
if (result.status === 2) {
uni.showToast({
title: "比赛已结束",
icon: "none",
});
uni.navigateBack({
delta: 2,
});
} else {
recoverData(result, { force: true });
}
if (!isEnded.value && (await isGameEnded(battleId.value))) return;
getCurrentGameAPI();
const refreshData = () => {
const lastAwakeTime = uni.getStorageSync("last-awake-time");
if (lastAwakeTime) {
getCurrentGameAPI();
} else {
clearInterval(refreshTimer.value);
}
};
refreshTimer.value = setInterval(refreshData, 2000);
}
});
onHide(() => {
if (refreshTimer.value) clearInterval(refreshTimer.value);
uni.setStorageSync("last-awake-time", Date.now());
});
</script>
<template>
<Container :bgType="start ? 3 : 1">
<view class="container">
<BattleHeader
v-if="start === false"
:redTeam="redTeam"
:blueTeam="blueTeam"
/>
<TestDistance v-if="start === false" :guide="false" :isBattle="true" />
<BattleHeader v-if="!start" :redTeam="redTeam" :blueTeam="blueTeam" />
<TestDistance v-if="!start" :guide="false" :isBattle="true" />
<view v-if="start" class="players-row">
<TeamAvatars
:team="blueTeam"

152
src/pages/team-bow-data.vue
View File

@@ -5,42 +5,105 @@ import Container from "@/components/Container.vue";
import BowTarget from "@/components/BowTarget.vue";
import Avatar from "@/components/Avatar.vue";
import { roundsName } from "@/constants";
import { getBattleAPI } from "@/apis";
import { getGameAPI } from "@/apis";
const selected = ref(0);
const redScores = ref([]);
const blueScores = ref([]);
const tabs = ref([]);
const tabs = ref(["所有轮次"]);
const players = ref([]);
const data = ref({});
const loadArrows = (round) => {
round.shoots[1].forEach((arrow) => {
blueScores.value.push(arrow);
});
round.shoots[2].forEach((arrow) => {
redScores.value.push(arrow);
});
};
const allRoundsScore = ref({});
const data = ref({
goldenRounds: [],
});
onLoad(async (options) => {
if (!options.battleId) return;
const result = await getBattleAPI(options.battleId || "57943107462893568");
data.value = result;
data.value.teams[1].players.forEach((p, index) => {
players.value.push(p);
players.value.push(data.value.teams[2].players[index]);
});
Object.values(data.value.rounds).forEach((round, index) => {
if (round.ifGold) tabs.value.push(`决金箭`);
else tabs.value.push(`第${roundsName[index + 1]}轮`);
});
selected.value = Number(options.selected || 0);
onClickTab(selected.value);
if (options.battleId) {
const result = await getGameAPI(
options.battleId || "BATTLE-1756453741433684760-512"
);
data.value = result;
Object.values(result.bluePlayers).forEach((p, index) => {
players.value.push(p);
if (
Object.values(result.redPlayers) &&
Object.values(result.redPlayers)[index]
) {
players.value.push(Object.values(result.redPlayers)[index]);
}
});
if (result.goldenRounds) {
result.goldenRounds.forEach(() => {
tabs.value.push("决金箭");
});
}
Object.keys(result.roundsData).forEach((key, index) => {
if (
index <
Object.keys(result.roundsData).length - result.goldenRounds.length
) {
tabs.value.push(`第${roundsName[key]}轮`);
}
});
onClickTab(0);
}
});
const onClickTab = (index) => {
selected.value = index;
redScores.value = [];
blueScores.value = [];
loadArrows(data.value.rounds[index]);
const { bluePlayers, redPlayers, roundsData, goldenRounds } = data.value;
let maxArrowLength = 0;
if (index === 0) {
Object.keys(bluePlayers).forEach((p) => {
allRoundsScore.value[p] = [];
Object.values(roundsData).forEach((round) => {
if (!round[p]) return;
allRoundsScore.value[p].push(
round[p].reduce((last, next) => last + next.ring, 0)
);
round[p].forEach((arrow) => {
blueScores.value.push(arrow);
});
});
});
Object.keys(redPlayers).forEach((p) => {
allRoundsScore.value[p] = [];
Object.values(roundsData).forEach((round) => {
if (!round[p]) return;
allRoundsScore.value[p].push(
round[p].reduce((last, next) => last + next.ring, 0)
);
round[p].forEach((arrow) => {
redScores.value.push(arrow);
});
});
});
} else if (index <= goldenRounds.length) {
const dataIndex =
Object.keys(roundsData).length - goldenRounds.length + index;
Object.keys(bluePlayers).forEach((p) => {
if (!roundsData[dataIndex][p]) return;
roundsData[dataIndex][p].forEach((arrow) => {
blueScores.value.push(arrow);
});
});
Object.keys(redPlayers).forEach((p) => {
if (!roundsData[dataIndex][p]) return;
roundsData[dataIndex][p].forEach((arrow) => {
redScores.value.push(arrow);
});
});
} else {
Object.keys(bluePlayers).forEach((p) => {
roundsData[index - goldenRounds.length][p].forEach((arrow) => {
blueScores.value.push(arrow);
});
});
Object.keys(redPlayers).forEach((p) => {
roundsData[index - goldenRounds.length][p].forEach((arrow) => {
redScores.value.push(arrow);
});
});
}
};
</script>
@@ -71,18 +134,45 @@ const onClickTab = (index) => {
>
<Avatar
:src="player.avatar"
:borderColor="index % 2 === 0 ? '#64BAFF' : '#FF6767'"
:borderColor="
data.bluePlayers[player.playerId] ? '#64BAFF' : '#FF6767'
"
:size="36"
/>
<view>
<view
v-for="(score, index) in data.rounds[selected].shoots[
index % 2 === 0 ? 1 : 2
]"
v-if="selected === 0"
v-for="(ring, index) in allRoundsScore[player.playerId]"
:key="index"
class="score-item"
>
{{ score.ringX ? "X" : score.ring }}
{{ ring }}
</view>
<view
v-if="
selected > 0 &&
selected >= data.goldenRounds.length &&
selected <= data.goldenRounds.length
"
v-for="(score, index) in data.roundsData[
Object.keys(data.roundsData).length -
data.goldenRounds.length +
selected
][player.playerId]"
:key="index"
class="score-item"
>
{{ score.ring }}
</view>
<view
v-if="selected > data.goldenRounds.length"
v-for="(score, index) in data.roundsData[
selected - data.goldenRounds.length
][player.playerId]"
:key="index"
class="score-item"
>
{{ score.ring }}
</view>
</view>
</view>

BIN
src/static/player-1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 594 B

BIN
src/static/player-10.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
src/static/player-2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 869 B

BIN
src/static/player-3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 723 B

BIN
src/static/player-4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 815 B

BIN
src/static/player-5.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 704 B

BIN
src/static/player-6.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 895 B

BIN
src/static/player-7.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 641 B

BIN
src/static/player-8.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 915 B

BIN
src/static/player-9.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 893 B

23
src/util.js
View File

@@ -1,3 +1,5 @@
import { getUserGameState, getGameAPI } from "@/apis";
export const formatTimestamp = (timestamp) => {
const date = new Date(timestamp * 1000);
const year = date.getFullYear();
@@ -87,6 +89,27 @@ export const wxShare = async (canvasId = "shareCanvas") => {
}
};
export const isGameEnded = async (battleId) => {
const state = await getUserGameState();
if (!state.gaming) {
const result = await getGameAPI(battleId);
if (result.mode) {
uni.redirectTo({
url: `/pages/battle-result?battleId=${battleId}`,
});
} else {
uni.showToast({
title: "比赛已结束",
icon: "none",
});
setTimeout(() => {
uni.navigateBack();
}, 1000);
}
}
return !state.gaming;
};
// 获取元素尺寸和位置信息
export const getElementRect = (classname) => {
return new Promise((resolve) => {

58
src/websocket.js
View File

@@ -14,7 +14,7 @@ function createWebSocket(token, onMessage) {
switch (envVersion) {
case "develop": // 开发版
// url = "ws://192.168.1.30:8000/socket";
// url = "ws://192.168.1.242:8000/socket";
url = "wss://apitest.shelingxingqiu.com/socket";
break;
case "trial": // 体验版
@@ -45,26 +45,44 @@ function createWebSocket(token, onMessage) {
// 接收消息
uni.onSocketMessage((res) => {
const { data, event } = JSON.parse(res.data);
if (event === "pong") return;
if (data.type) {
console.log("收到消息：", getMessageTypeName(data.type), data.data);
if (onMessage) onMessage({ ...(data.data || {}), type: data.type });
return;
}
if (onMessage && data.updates) onMessage(data.updates);
const msg = data.updates[0];
if (msg) {
console.log("收到消息：", getMessageTypeName(msg.constructor), msg);
if (msg.constructor === MESSAGETYPES.RankUpdate) {
uni.setStorageSync("latestRank", msg.lvl);
} else if (msg.constructor === MESSAGETYPES.LvlUpdate) {
uni.setStorageSync("latestLvl", msg.lvl);
} else if (msg.constructor === MESSAGETYPES.DeviceOnline) {
uni.$emit("update-online");
} else if (msg.constructor === MESSAGETYPES.DeviceOffline) {
uni.$emit("update-online");
const data = JSON.parse(res.data);
if (data.event === "pong" || !data.data.updates) return;
if (onMessage) onMessage(data.data.updates);
const msg = data.data.updates[0];
if (!msg) return;
console.log("收到消息：", getMessageTypeName(msg.constructor), msg);
if (msg.constructor === MESSAGETYPES.BackToGame) {
const pages = getCurrentPages();
const currentPage = pages[pages.length - 1];
if (
currentPage.route === "pages/battle-room" ||
currentPage.route === "pages/team-battle" ||
currentPage.route === "pages/melee-match"
) {
return;
}
const { battleInfo } = msg;
uni.setStorageSync("current-battle", battleInfo);
// console.log("----battleInfo", battleInfo);
if (battleInfo.config.mode === 1) {
uni.navigateTo({
url: `/pages/team-battle?battleId=${battleInfo.id}&gameMode=${battleInfo.config.battleMode}`,
});
} else if (battleInfo.config.mode === 2) {
uni.navigateTo({
url: `/pages/melee-match?battleId=${battleInfo.id}&gameMode=${battleInfo.config.battleMode}`,
});
}
} else if (msg.constructor === MESSAGETYPES.MatchOver) {
uni.$emit("game-over");
} else if (msg.constructor === MESSAGETYPES.RankUpdate) {
uni.setStorageSync("latestRank", msg.lvl);
} else if (msg.constructor === MESSAGETYPES.LvlUpdate) {
uni.setStorageSync("latestLvl", msg.lvl);
} else if (msg.constructor === MESSAGETYPES.DeviceOnline) {
uni.$emit("update-online");
} else if (msg.constructor === MESSAGETYPES.DeviceOffline) {
uni.$emit("update-online");
}
});