19 Commits

Author SHA1 Message Date
8c66ef78c6 fix:房间号更新改为pinia 2026-05-07 17:15:28 +08:00
29a6f46a0d Merge remote-tracking branch 'origin/new-race-mode' into new-race-mode 2026-05-07 16:54:32 +08:00
895be17f7c pref: 进度条倒计时 2026-05-07 16:49:09 +08:00
7c8fd9395b fix:踢出功能二次确认弹窗完成 2026-05-07 14:31:17 +08:00
972d817629 bug:修复房间号模块显示问题 2026-05-07 14:03:53 +08:00
31140c7ae2 fix:好友约战,我的战绩按钮跳转完成 2026-05-07 13:53:51 +08:00
542ee5f031 fix:好友约战首页调整完成 2026-05-07 11:13:18 +08:00
e28424456f Merge branch 'new-race-mode' of https://git.shelingxingqiu.com/laoma/shoot-miniprograms into new-race-mode 2026-05-06 18:11:02 +08:00
e037c02888 fix:好友约战新头部完成 2026-05-06 18:10:49 +08:00
9a5d64cc9e pref: 进度条变化 2026-05-06 17:57:02 +08:00
1beb1009b3 pref: 比赛结束 2026-05-06 16:15:39 +08:00
9cd32a7aa6 Merge remote-tracking branch 'origin/new-race-mode' into new-race-mode 2026-05-06 14:20:41 +08:00
473e6df77b pref: 匹配成功展示准备页面 2026-05-06 14:20:06 +08:00
088cd33b0a fix:解决后端返回null数据报错问题 2026-05-06 11:55:46 +08:00
51fd4acd8b fix:添加git忽略提交配置2 2026-05-06 10:15:13 +08:00
691e33a84e fix:添加git忽略提交配置 2026-05-06 10:12:41 +08:00
e60d24d56c fix:配置文件提交 2026-05-06 10:03:20 +08:00
e1a9d97596 pref: 小程序添加静默登录 2026-04-28 10:31:54 +08:00
f07facd98b pref: 绑定设备、匹配pk 2026-04-28 08:59:16 +08:00
26 changed files with 1568 additions and 2849 deletions

5
.gitignore vendored
View File

@@ -8,6 +8,11 @@ pnpm-debug.log*
lerna-debug.log* lerna-debug.log*
node_modules node_modules
.history
.github
openspec
CLAUDE.md
dosc
.DS_Store .DS_Store
dist dist
*.local *.local

View File

@@ -52,7 +52,7 @@
} }
function onDeviceShoot() { function onDeviceShoot() {
audioManager.play("射箭声音") // audioManager.play("射箭声音")
} }
function onShootWsMsg(content) { function onShootWsMsg(content) {

View File

@@ -179,12 +179,39 @@ export const loginAPI = async (phone, nickName, avatarData, code) => {
return result; return result;
}; };
export const silentLoginAPI = async (code) => {
const result = await request("POST", "/index/code", {
appName: "shoot",
appId: "wxa8f5989dcd45cc23",
code,
});
uni.setStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`,
result.token
);
return result;
};
export const checkUserBindAPI = async (code) => {
return request("POST", "/index/checkBind", {
appName: "shoot",
appId: "wxa8f5989dcd45cc23",
code,
});
};
export const bindDeviceAPI = (device) => { export const bindDeviceAPI = (device) => {
return request("POST", "/user/device/bindDevice", { return request("POST", "/user/device/bindDevice", {
device, device,
}); });
}; };
export const bindDeviceAPIV2 = (token) => {
return request("POST", "/user/device/bindDevice/v2", {
token: token,
});
};
export const unbindDeviceAPI = (deviceId) => { export const unbindDeviceAPI = (deviceId) => {
return request("POST", "/user/device/unbindDevice", { return request("POST", "/user/device/unbindDevice", {
deviceId, deviceId,
@@ -262,7 +289,8 @@ export const matchGameAPI = (match, gameType, teamSize) => {
match, match,
gameType, gameType,
teamSize, teamSize,
readyTime: 1.5, readyTime: 15,
targetType: 20,
}); });
}; };

View File

@@ -362,6 +362,7 @@ class AudioManager {
} }
this.allowPlayMap.set(key, false); this.allowPlayMap.set(key, false);
this.onAudioEnded(key); this.onAudioEnded(key);
uni.$emit('audioEnded', key);
}); });
audio.onStop(() => { audio.onStop(() => {

View File

@@ -5,7 +5,7 @@ import AppBackground from "@/components/AppBackground.vue";
import Header from "@/components/Header.vue"; import Header from "@/components/Header.vue";
import ScreenHint from "@/components/ScreenHint.vue"; import ScreenHint from "@/components/ScreenHint.vue";
import BackToGame from "@/components/BackToGame.vue"; import BackToGame from "@/components/BackToGame.vue";
import { laserAimAPI, getBattleAPI } from "@/apis"; import {laserAimAPI, getBattleAPI, matchGameAPI} from "@/apis";
import { capsuleHeight, debounce } from "@/util"; import { capsuleHeight, debounce } from "@/util";
import AudioManager from "@/audioManager"; import AudioManager from "@/audioManager";
const props = defineProps({ const props = defineProps({
@@ -135,6 +135,10 @@ const goBack = () => {
uni.navigateBack(); uni.navigateBack();
}; };
const cancelMatching = async () => {
uni.$emit("cancelMatching");
}
const goCalibration = async () => { const goCalibration = async () => {
await laserAimAPI(); await laserAimAPI();
uni.navigateTo({ uni.navigateTo({
@@ -202,7 +206,7 @@ const goCalibration = async () => {
<button hover-class="none" @click="() => (showHint = false)"> <button hover-class="none" @click="() => (showHint = false)">
取消 取消
</button> </button>
<button hover-class="none" @click="goBack">确认</button> <button hover-class="none" @click="cancelMatching">确认</button>
</view> </view>
</view> </view>
<view v-if="hintType === 4" class="tip-content"> <view v-if="hintType === 4" class="tip-content">

View File

@@ -0,0 +1,54 @@
<script setup>
defineProps({
noBg: {
type: Boolean,
default: false,
}
});
</script>
<template>
<view class="container">
<image class="shooter2" src="../static/shooter2.png" mode="widthFix" />
<view class="bg-box">
<image
class="bg"
v-if="!noBg"
src="../static/long-bubble-border.png"
mode="widthFix"
/>
<slot />
</view>
</view>
</template>
<style scoped>
.container {
display: flex;
align-items: center;
padding: 0 15px;
margin-bottom: 14rpx;
width: clac(100% - 30px);
}
.container .shooter2 {
width: 150rpx;
height: 162rpx;
}
.container .bg-box {
color: #fff;
font-size: 28rpx;
position: relative;
flex: 1;
min-height: 55px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.container .bg-box .bg {
position: absolute;
left: 0;
right: 0;
width: 100%;
}
</style>

View File

@@ -6,7 +6,7 @@ import Avatar from "@/components/Avatar.vue";
import useStore from "@/store"; import useStore from "@/store";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
const store = useStore(); const store = useStore();
const { user } = storeToRefs(store); const { user, game } = storeToRefs(store);
const currentPage = computed(() => { const currentPage = computed(() => {
const pages = getCurrentPages(); const pages = getCurrentPages();
@@ -59,6 +59,7 @@ const loading = ref(false);
const pointBook = ref(null); const pointBook = ref(null);
const showProgress = ref(false); const showProgress = ref(false);
const heat = ref(0); const heat = ref(0);
const updateLoading = (value) => { const updateLoading = (value) => {
loading.value = value; loading.value = value;
}; };
@@ -172,6 +173,16 @@ onBeforeUnmount(() => {
<view v-if="showProgress" class="battle-progress"> <view v-if="showProgress" class="battle-progress">
<HeaderProgress /> <HeaderProgress />
</view> </view>
<!-- 对战房间:整个胶囊为分享按钮,房号从 Store 读取 -->
<button
v-if="currentPage === 'pages/battle-room' && game.roomNumber"
open-type="share"
hover-class="none"
class="battle-room-number"
>
<text class="battle-room-number__text">房号: {{ game.roomNumber }}</text>
<image src="../static/share2.png" mode="widthFix" class="battle-room-number__icon" />
</button>
</view> </view>
</template> </template>
@@ -259,4 +270,37 @@ onBeforeUnmount(() => {
margin: 0 20rpx; margin: 0 20rpx;
max-width: 300rpx; max-width: 300rpx;
} }
/* 对战房间:整个胶囊作为分享按钮,靠右对齐 */
.battle-room-number {
margin-left: auto;
margin-right: 10rpx;
display: flex;
align-items: center;
justify-content: center;
width: 240rpx;
height: 64rpx;
background: rgba(0, 0, 0, 0.15);
border-radius: 96rpx;
border: 1rpx solid #5b5758;
flex-shrink: 0;
padding: 0;
line-height: normal;
}
/* 重置 button 默认边框 */
.battle-room-number::after {
border: none;
}
.battle-room-number__text {
width: 156rpx;
height: 28rpx;
font-weight: 400;
font-size: 20rpx;
color: #ffffff;
text-align: center;
line-height: 28rpx;
}
.battle-room-number__icon {
width: 25rpx;
height: 26rpx;
}
</style> </style>

View File

@@ -56,7 +56,7 @@ async function onReceiveMessage(message) {
currentRoundEnded.value = true; currentRoundEnded.value = true;
audioManager.play("比赛开始"); audioManager.play("比赛开始");
} else if (type === MESSAGETYPESV2.BattleEnd) { } else if (type === MESSAGETYPESV2.BattleEnd) {
audioManager.play("比赛结束"); audioManager.play("比赛结束", false);
} else if (type === MESSAGETYPESV2.ShootResult) { } else if (type === MESSAGETYPESV2.ShootResult) {
if (melee.value && current.playerId !== user.value.id) return; if (melee.value && current.playerId !== user.value.id) return;
if (current.playerId === user.value.id) currentShot.value++; if (current.playerId === user.value.id) currentShot.value++;

View File

@@ -53,6 +53,7 @@ const currentRoundEnded = ref(false);
const ended = ref(false); const ended = ref(false);
const halfTime = ref(false); const halfTime = ref(false);
const wait = ref(0); const wait = ref(0);
const transitionStyle = ref("all 1s linear");
watch( watch(
() => props.tips, () => props.tips,
@@ -81,7 +82,19 @@ watch(
const resetTimer = (count) => { const resetTimer = (count) => {
if (timer.value) clearInterval(timer.value); if (timer.value) clearInterval(timer.value);
remain.value = Math.round(count); const newVal = Math.round(count);
// 如果剩余时间增加(如重置),瞬间变化无动画
if (newVal >= remain.value) {
transitionStyle.value = "none";
remain.value = newVal;
setTimeout(() => {
transitionStyle.value = "all 1s linear";
}, 50);
} else {
remain.value = newVal;
}
if (remain.value > 0) { if (remain.value > 0) {
timer.value = setInterval(() => { timer.value = setInterval(() => {
if (remain.value === 0) { if (remain.value === 0) {
@@ -188,6 +201,7 @@ onBeforeUnmount(() => {
width: `${(remain / total) * 100}%`, width: `${(remain / total) * 100}%`,
backgroundColor: barColor, backgroundColor: barColor,
right: tips.includes('红队') ? 0 : 'unset', right: tips.includes('红队') ? 0 : 'unset',
transition: transitionStyle,
}" }"
/> />
<text>剩余{{ remain }}</text> <text>剩余{{ remain }}</text>
@@ -242,7 +256,6 @@ onBeforeUnmount(() => {
height: 15px; height: 15px;
border-radius: 15px; border-radius: 15px;
z-index: -1; z-index: -1;
transition: all 1s linear;
} }
.container > view:last-child > text { .container > view:last-child > text {
font-size: 10px; font-size: 10px;

View File

@@ -1,6 +1,7 @@
<script setup> <script setup>
import {ref, watch, onMounted, onBeforeUnmount} from "vue"; import {ref, watch, onMounted, onBeforeUnmount} from "vue";
import {RoundGoldImages} from "@/constants"; import {RoundGoldImages} from "@/constants";
const props = defineProps({ const props = defineProps({
tips: { tips: {
type: String, type: String,
@@ -19,15 +20,39 @@ const props = defineProps({
const barColor = ref(""); const barColor = ref("");
const remain = ref(15); const remain = ref(15);
const timer = ref(null); const timer = ref(null);
const laoding = ref(false); const loading = ref(false);
const transitionStyle = ref("all 1s linear");
const currentTeam = ref(null);
const updateRemain = (value) => { const updateRemain = (value) => {
// if (Math.ceil(value) === remain.value || Math.floor(value) === remain.value) if (value.stop) {
// return;
if (timer.value) clearInterval(timer.value); if (timer.value) clearInterval(timer.value);
remain.value = Math.round(value); return
}
loading.value = false;
currentTeam.value = value.team
if (value.team === 'red')
barColor.value = "linear-gradient( 180deg, #FFA0A0 0%, #FF6060 100%)";
if (value.team === 'blue')
barColor.value = "linear-gradient( 180deg, #9AB3FF 0%, #4288FF 100%)";
if (value.reset) {
remain.value = value.value;
return;
}
const newVal = Math.round(value.value);
// 如果剩余时间增加(如轮次切换重置),瞬间变化无动画;否则保持动画
if (newVal >= remain.value) {
transitionStyle.value = "none";
remain.value = newVal;
setTimeout(() => {
transitionStyle.value = "all 1s linear";
}, 50);
} else {
remain.value = newVal;
}
timer.value = setInterval(() => { timer.value = setInterval(() => {
laoding.value = remain.value === 0; loading.value = remain.value === 0;
if (remain.value > 0) remain.value--; if (remain.value > 0) remain.value--;
}, 1000); }, 1000);
}; };
@@ -35,14 +60,7 @@ const updateRemain = (value) => {
watch( watch(
() => props.tips, () => props.tips,
(newVal) => { (newVal) => {
if (newVal.includes("红队"))
barColor.value = "linear-gradient( 180deg, #FFA0A0 0%, #FF6060 100%)";
if (newVal.includes("蓝队"))
barColor.value = "linear-gradient( 180deg, #9AB3FF 0%, #4288FF 100%)";
if (newVal.includes("重回")) return;
if (newVal.includes("红队") || newVal.includes("蓝队")) {
updateRemain(props.total);
}
}, },
{ {
immediate: true, immediate: true,
@@ -64,17 +82,18 @@ onBeforeUnmount(() => {
<image :src="RoundGoldImages[props.currentRound]" mode="widthFix"/> <image :src="RoundGoldImages[props.currentRound]" mode="widthFix"/>
<view <view
:style="{ :style="{
justifyContent: tips.includes('红队') ? 'flex-end' : 'flex-start', justifyContent: currentTeam==='red' ? 'flex-end' : 'flex-start',
}" }"
> >
<view <view
:style="{ :style="{
width: `${(remain / total) * 100}%`, width: `${(remain / total) * 100}%`,
background: barColor, background: barColor,
right: tips.includes('红队') ? 0 : 'unset', right: currentTeam==='red' ? 0 : 'unset',
transition: transitionStyle,
}" }"
/> />
<text v-if="!laoding">剩余{{ remain }}</text> <text v-if="!loading">剩余{{ remain }}</text>
<text v-else>···</text> <text v-else>···</text>
</view> </view>
</view> </view>
@@ -87,11 +106,13 @@ onBeforeUnmount(() => {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.container > image { .container > image {
width: 380rpx; width: 380rpx;
height: 80rpx; height: 80rpx;
transform: translateY(18rpx); transform: translateY(18rpx);
} }
.container > view:last-child { .container > view:last-child {
width: 100%; width: 100%;
text-align: center; text-align: center;
@@ -103,11 +124,12 @@ onBeforeUnmount(() => {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.container > view:last-child > view { .container > view:last-child > view {
height: 24rpx; height: 24rpx;
border-radius: 15px; border-radius: 15px;
transition: all 1s linear;
} }
.container > view:last-child > text { .container > view:last-child > text {
font-size: 18rpx; font-size: 18rpx;
color: #fff; color: #fff;

View File

@@ -86,18 +86,17 @@ const handleLogin = async () => {
icon: "none", icon: "none",
}); });
} }
await doLogin();
};
async function doLogin() {
loading.value = true; loading.value = true;
try { try {
const wxResult = await wxLogin(); const wxResult = await wxLogin();
const fileManager = uni.getFileSystemManager(); const fileManager = uni.getFileSystemManager();
const avatarBase64 = fileManager.readFileSync(avatarUrl.value, "base64"); const avatarBase64 = fileManager.readFileSync(avatarUrl.value, "base64");
const base64Url = `data:image/png;base64,${avatarBase64}`; const base64Url = `data:image/png;base64,${avatarBase64}`;
const result = await loginAPI( await loginAPI(phone.value, nickName.value, base64Url, wxResult.code);
phone.value,
nickName.value,
base64Url,
wxResult.code
);
const data = await getHomeData(); const data = await getHomeData();
if (data.user) updateUser(data.user); if (data.user) updateUser(data.user);
const devices = await getMyDevicesAPI(); const devices = await getMyDevicesAPI();
@@ -139,6 +138,10 @@ const openPrivacyLink = () => {
onShow(() => { onShow(() => {
loading.value = false; loading.value = false;
agree.value = false;
phone.value = "";
avatarUrl.value = "";
nickName.value = "";
}); });
</script> </script>

View File

@@ -1,6 +1,6 @@
{ {
"name" : "shoot-miniprograms", "name" : "shoot-miniprograms",
"appid": "", "appid" : "__UNI__B03E251",
"description" : "", "description" : "",
"versionName" : "1.0.0", "versionName" : "1.0.0",
"versionCode" : "100", "versionCode" : "100",
@@ -40,7 +40,9 @@
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>" "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
] ]
}, },
"ios": {}, "ios" : {
"dSYMs" : false
},
"sdkConfigs" : {} "sdkConfigs" : {}
} }
}, },

View File

@@ -3,9 +3,10 @@ import { ref, onMounted, computed, onBeforeUnmount } from "vue";
import { onShow, onLoad, onShareAppMessage } from "@dcloudio/uni-app"; import { onShow, onLoad, onShareAppMessage } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue"; import Container from "@/components/Container.vue";
import PlayerSeats from "@/components/PlayerSeats.vue"; import PlayerSeats from "@/components/PlayerSeats.vue";
import Guide from "@/components/Guide.vue"; import GuideTwo from "@/components/GuideTwo.vue";
import SButton from "@/components/SButton.vue"; import SButton from "@/components/SButton.vue";
import Avatar from "@/components/Avatar.vue"; import Avatar from "@/components/Avatar.vue";
import ScreenHint from "@/components/ScreenHint.vue";
import { import {
getRoomAPI, getRoomAPI,
destroyRoomAPI, destroyRoomAPI,
@@ -29,11 +30,27 @@ const players = ref([]);
const blueTeam = ref([]); const blueTeam = ref([]);
const redTeam = ref([]); const redTeam = ref([]);
/**
* 根据对战类型和房间人数动态生成页面标题
* battleType=1: 组队对战count 2/4/6 分别对应 1v1/2v2/3v3
* battleType=2: 多人乱斗
*/
const battleTitle = computed(() => {
if (!room.value.battleType) return "好友约战";
if (room.value.battleType === 2) return "多人乱斗";
const half = room.value.count / 2;
return `${half}v${half}对抗赛`;
});
const ready = ref(false); const ready = ref(false);
const allReady = ref(false); const allReady = ref(false);
const timer = ref(null); const timer = ref(null);
const goBattle = ref(false); const goBattle = ref(false);
/**
* 从服务端刷新当前房间数据,更新成员列表、准备状态等信息
* 仅在 roomNumber 有效且房间未开始时执行
*/
async function refreshRoomData() { async function refreshRoomData() {
if (!roomNumber.value) return; if (!roomNumber.value) return;
const result = await getRoomAPI(roomNumber.value); const result = await getRoomAPI(roomNumber.value);
@@ -184,8 +201,32 @@ const exitRoom = async () => {
uni.navigateBack(); uni.navigateBack();
}; };
const removePlayer = async (player) => { /** 待确认踢出的玩家信息 */
await kickPlayerAPI(roomNumber.value, player.id); const playerToKick = ref(null);
/** 控制踢出确认弹窗的显示状态 */
const showKickConfirm = ref(false);
/**
* 点击踢出按钮,弹出二次确认弹窗
* @param {object} player - 被踢的玩家信息
*/
const removePlayer = (player) => {
playerToKick.value = player;
showKickConfirm.value = true;
};
/** 确认踢出:调用 API 并关闭弹窗 */
const confirmKick = async () => {
if (!playerToKick.value) return;
await kickPlayerAPI(roomNumber.value, playerToKick.value.id);
showKickConfirm.value = false;
playerToKick.value = null;
};
/** 取消踢出:关闭弹窗 */
const cancelKick = () => {
showKickConfirm.value = false;
playerToKick.value = null;
}; };
const canClick = computed(() => { const canClick = computed(() => {
@@ -208,15 +249,32 @@ onShareAppMessage(() => {
}; };
}); });
/**
* onShow 生命周期:页面显示时刷新房间数据
* 注uni-app 中 onShow 可能早于 onLoad 执行,此时 roomNumber 尚未赋值,
* refreshRoomData 会提前 return。
*/
onShow(() => { onShow(() => {
goBattle.value = false; goBattle.value = false;
refreshRoomData(); refreshRoomData();
}); });
/**
* 页面加载时解析路由参数,初始化房间号
* - 存入本地 ref供页面内部逻辑使用
* - 同步到 Pinia Store供 Header 组件展示房号胶囊)
*/
onLoad(async (options) => { onLoad(async (options) => {
if (options.roomNumber) roomNumber.value = options.roomNumber; if (options.roomNumber) {
roomNumber.value = options.roomNumber;
store.updateRoomNumber(options.roomNumber);
}
}); });
/**
* 组件挂载后:保持屏幕常亮、注册 WebSocket 消息监听
* 房间号已通过 onLoad 同步到 StoreHeader 从 Store 直接读取,无需额外通知
*/
onMounted(() => { onMounted(() => {
uni.setKeepScreenOn({ uni.setKeepScreenOn({
keepScreenOn: true, keepScreenOn: true,
@@ -236,9 +294,9 @@ onBeforeUnmount(() => {
</script> </script>
<template> <template>
<Container :title="`好友约战 - ${roomNumber}`"> <Container :title="battleTitle">
<view class="standby-phase"> <view class="standby-phase">
<Guide> <GuideTwo>
<view class="battle-guide"> <view class="battle-guide">
<view class="guide-tips"> <view class="guide-tips">
<text>弓箭手们人都到齐了吗?</text> <text>弓箭手们人都到齐了吗?</text>
@@ -247,48 +305,28 @@ onBeforeUnmount(() => {
}}</text> }}</text>
<text v-if="room.battleType === 2">大乱斗即将开始! </text> <text v-if="room.battleType === 2">大乱斗即将开始! </text>
</view> </view>
<button hover-class="none" open-type="share">邀请</button>
</view> </view>
</Guide> </GuideTwo>
<view v-if="room.battleType === 1 && room.count === 2" class="team-mode"> <view v-if="room.battleType === 1 && room.count === 2" class="team-mode">
<image <image src="https://static.shelingxingqiu.com/attachment/2025-08-05/dbua9nuf5fyeph7cxi.png" mode="widthFix" />
src="https://static.shelingxingqiu.com/attachment/2025-08-05/dbua9nuf5fyeph7cxi.png"
mode="widthFix"
/>
<view> <view>
<view <view v-if="owner.id" class="player" :style="{ transform: 'translateY(-60px)' }">
v-if="owner.id"
class="player"
:style="{ transform: 'translateY(-60px)' }"
>
<Avatar :src="owner.avatar" :size="60" /> <Avatar :src="owner.avatar" :size="60" />
<text>管理员</text> <text>管理员</text>
<text>{{ owner.name }}</text> <text>{{ owner.name }}</text>
</view> </view>
<view <view v-else class="no-player" :style="{ transform: 'translateY(-60px)' }">
v-else
class="no-player"
:style="{ transform: 'translateY(-60px)' }"
>
<image src="../static/question-mark.png" mode="widthFix" /> <image src="../static/question-mark.png" mode="widthFix" />
</view> </view>
<image src="../static/versus.png" mode="widthFix" /> <image src="../static/versus.png" mode="widthFix" />
<view <view v-if="opponent.id" class="player" :style="{ transform: 'translateY(60px)' }">
v-if="opponent.id"
class="player"
:style="{ transform: 'translateY(60px)' }"
>
<Avatar :src="opponent.avatar" :size="60" /> <Avatar :src="opponent.avatar" :size="60" />
<text class="ready" :style="{ opacity: opponent.ready ? 1 : 0 }"> <text class="ready" :style="{ opacity: opponent.ready ? 1 : 0 }">
已准备 已准备
</text> </text>
<text>{{ opponent.name }}</text> <text>{{ opponent.name }}</text>
<button <button v-if="owner.id === user.id" hover-class="none" class="remove-player"
v-if="owner.id === user.id" @click="() => removePlayer(opponent)">
hover-class="none"
class="remove-player"
@click="() => removePlayer(opponent)"
>
<image src="../static/close-white.png" mode="widthFix" /> <image src="../static/close-white.png" mode="widthFix" />
</button> </button>
</view> </view>
@@ -299,31 +337,15 @@ onBeforeUnmount(() => {
</view> </view>
<block v-if="room.battleType === 1 && room.count >= 4"> <block v-if="room.battleType === 1 && room.count >= 4">
<view class="all-players"> <view class="all-players">
<image <image src="https://static.shelingxingqiu.com/attachment/2025-08-13/dc0x1p59iab6cvbhqc.png" mode="widthFix" />
src="https://static.shelingxingqiu.com/attachment/2025-08-13/dc0x1p59iab6cvbhqc.png" <image v-if="room.count === 4" src="../static/title-2v2.png" mode="widthFix" />
mode="widthFix" <image v-if="room.count === 6" src="../static/title-3v3.png" mode="widthFix" />
/>
<image
v-if="room.count === 4"
src="../static/title-2v2.png"
mode="widthFix"
/>
<image
v-if="room.count === 6"
src="../static/title-3v3.png"
mode="widthFix"
/>
<view> <view>
<view v-for="(item, index) in players" :key="index"> <view v-for="(item, index) in players" :key="index">
<Avatar v-if="item.id" :src="item.avatar" :size="36" /> <Avatar v-if="item.id" :src="item.avatar" :size="36" />
<text v-if="owner.id === item.id">管理员</text> <text v-if="owner.id === item.id">管理员</text>
<button <button v-if="owner.id !== item.id && item.id" hover-class="none" class="remove-player"
v-if="owner.id !== item.id && item.id" @click="() => removePlayer(item)" :style="{ top: '-10rpx', right: '-10rpx' }">
hover-class="none"
class="remove-player"
@click="() => removePlayer(item)"
:style="{ top: '-10rpx', right: '-10rpx' }"
>
<image src="../static/close-white.png" mode="widthFix" /> <image src="../static/close-white.png" mode="widthFix" />
</button> </button>
</view> </view>
@@ -331,16 +353,8 @@ onBeforeUnmount(() => {
</view> </view>
<view class="choose-side"> <view class="choose-side">
<view> <view>
<view <view v-for="(item, index) in redTeam" :key="index" class="choose-side-left-item">
v-for="(item, index) in redTeam" <button hover-class="none" v-if="item.id === user.id" @click="chooseTeam(0)">
:key="index"
class="choose-side-left-item"
>
<button
hover-class="none"
v-if="item.id === user.id"
@click="chooseTeam(0)"
>
<image src="../static/close-grey.png" mode="widthFix" /> <image src="../static/close-grey.png" mode="widthFix" />
</button> </button>
<text class="truncate">{{ item.name || "我要加入" }}</text> <text class="truncate">{{ item.name || "我要加入" }}</text>
@@ -354,11 +368,7 @@ onBeforeUnmount(() => {
</view> </view>
</view> </view>
<view> <view>
<view <view v-for="(item, index) in blueTeam" :key="index" class="choose-side-right-item">
v-for="(item, index) in blueTeam"
:key="index"
class="choose-side-right-item"
>
<view v-if="item.id"> <view v-if="item.id">
<Avatar :src="item.avatar" :size="36" /> <Avatar :src="item.avatar" :size="36" />
<text :style="{ opacity: !!item.state ? 1 : 0 }">已准备</text> <text :style="{ opacity: !!item.state ? 1 : 0 }">已准备</text>
@@ -367,23 +377,15 @@ onBeforeUnmount(() => {
<image src="../static/add-grey.png" mode="widthFix" /> <image src="../static/add-grey.png" mode="widthFix" />
</button> </button>
<text class="truncate">{{ item.name || "我要加入" }}</text> <text class="truncate">{{ item.name || "我要加入" }}</text>
<button <button hover-class="none" v-if="item.id === user.id" @click="chooseTeam(0)">
hover-class="none"
v-if="item.id === user.id"
@click="chooseTeam(0)"
>
<image src="../static/close-grey.png" mode="widthFix" /> <image src="../static/close-grey.png" mode="widthFix" />
</button> </button>
</view> </view>
</view> </view>
</view> </view>
</block> </block>
<PlayerSeats <PlayerSeats v-if="room.battleType === 2" :total="room.count || 10" :players="players"
v-if="room.battleType === 2" :removePlayer="removePlayer" />
:total="room.count || 10"
:players="players"
:removePlayer="removePlayer"
/>
<view> <view>
<SButton :disabled="!canClick" :onClick="getReady"> <SButton :disabled="!canClick" :onClick="getReady">
{{ {{
@@ -398,6 +400,20 @@ onBeforeUnmount(() => {
</view> </view>
</view> </view>
</Container> </Container>
<!-- 踢出玩家二次确认弹窗不传 onClose屏蔽 X 关闭按钮 -->
<ScreenHint :show="showKickConfirm">
<view class="kick-confirm">
<!-- 弹窗标题玩家名字高亮显示 -->
<text class="kick-confirm__title">
是否把<text style="color: #F7D550">{{ playerToKick && playerToKick.name }}</text>移出房间
</text>
<!-- 按钮区确认在左取消在右 -->
<view class="kick-confirm__btns">
<button hover-class="none" class="kick-confirm__btn kick-confirm__btn--confirm" @click="confirmKick">确定</button>
<button hover-class="none" class="kick-confirm__btn kick-confirm__btn--cancel" @click="cancelKick">取消</button>
</view>
</view>
</ScreenHint>
</template> </template>
<style scoped> <style scoped>
@@ -406,6 +422,7 @@ onBeforeUnmount(() => {
height: calc(100% - 40px); height: calc(100% - 40px);
overflow-x: hidden; overflow-x: hidden;
} }
.tips { .tips {
color: #fff9; color: #fff9;
width: 100%; width: 100%;
@@ -414,6 +431,7 @@ onBeforeUnmount(() => {
margin-top: 10px; margin-top: 10px;
font-size: 12px; font-size: 12px;
} }
.player-unknow { .player-unknow {
width: 40px; width: 40px;
height: 40px; height: 40px;
@@ -425,25 +443,30 @@ onBeforeUnmount(() => {
justify-content: center; justify-content: center;
background-color: #69686866; background-color: #69686866;
} }
.player-unknow>image { .player-unknow>image {
width: 40%; width: 40%;
} }
.team-mode { .team-mode {
width: calc(100vw - 30px); width: calc(100vw - 30px);
height: 125vw; height: 125vw;
margin: 15px; margin: 0 15px 15px 15px;
} }
.team-mode>image:first-child { .team-mode>image:first-child {
position: absolute; position: absolute;
width: calc(100vw - 30px); width: calc(100vw - 30px);
z-index: -1; z-index: -1;
} }
.team-mode>view { .team-mode>view {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 95%; height: 95%;
} }
.player { .player {
width: 70px; width: 70px;
display: flex; display: flex;
@@ -455,6 +478,7 @@ onBeforeUnmount(() => {
font-size: 14px; font-size: 14px;
position: relative; position: relative;
} }
.player>image { .player>image {
width: 70px; width: 70px;
height: 70px; height: 70px;
@@ -462,6 +486,7 @@ onBeforeUnmount(() => {
background-color: #ccc; background-color: #ccc;
margin-bottom: 5px; margin-bottom: 5px;
} }
.player>text:nth-child(2) { .player>text:nth-child(2) {
color: #000; color: #000;
background-color: #fed847; background-color: #fed847;
@@ -472,9 +497,11 @@ onBeforeUnmount(() => {
margin-top: -16rpx; margin-top: -16rpx;
position: relative; position: relative;
} }
.player>text:nth-child(3) { .player>text:nth-child(3) {
margin-top: 6rpx; margin-top: 6rpx;
} }
.player>text { .player>text {
max-width: 100px; max-width: 100px;
white-space: nowrap; white-space: nowrap;
@@ -482,11 +509,73 @@ onBeforeUnmount(() => {
text-overflow: ellipsis; text-overflow: ellipsis;
text-align: center; text-align: center;
} }
.player .ready { .player .ready {
background-color: #2c261fb3 !important; background-color: #2c261fb3 !important;
border: 1rpx solid #a3793f66 !important; border: 1rpx solid #a3793f66 !important;
color: #fed847 !important; color: #fed847 !important;
} }
/* 踢出确认弹窗内容 */
.kick-confirm {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 20rpx 30rpx;
color: #fff;
}
.kick-confirm__title {
font-size: 30rpx;
font-weight: 500;
text-align: center;
line-height: 1.5;
/* 标题与按钮区间距 */
margin-bottom: 58rpx;
}
.kick-confirm__btns {
display: flex;
/* 两个按钮间距 */
gap: 16rpx;
}
/* 按钮公共基础样式:固定宽高与圆角 */
.kick-confirm__btn {
font-size: 28rpx;
width: 232rpx;
height: 70rpx;
border-radius: 44rpx;
line-height: 70rpx;
display: flex;
align-items: center;
justify-content: center;
}
/* 取消按钮:白色半透明背景(用 rgba 避免 opacity 平铺到文字) */
.kick-confirm__btn--cancel {
background: rgba(255, 255, 255, 0.2);
border: none;
color: #FFFFFF;
font-weight: 500;
font-size: 28rpx;
text-align: center;
border-radius: 44rpx;
}
.kick-confirm__btn--cancel::after {
border: none;
}
/* 确认按钮:黄色实心背景 */
.kick-confirm__btn--confirm {
background: #FED847;
border: none;
color: #000000;
font-weight: 500;
font-size: 28rpx;
text-align: center;
border-radius: 44rpx;
}
.kick-confirm__btn--confirm::after {
border: none;
}
.remove-player { .remove-player {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
@@ -499,13 +588,16 @@ onBeforeUnmount(() => {
top: 0; top: 0;
right: 0; right: 0;
} }
.remove-player>image { .remove-player>image {
width: 90%; width: 90%;
height: 90%; height: 90%;
} }
.team-mode>view>image:nth-child(2) { .team-mode>view>image:nth-child(2) {
width: 120px; width: 120px;
} }
.no-player { .no-player {
width: 70px; width: 70px;
height: 70px; height: 70px;
@@ -516,10 +608,12 @@ onBeforeUnmount(() => {
align-items: center; align-items: center;
transform: translateY(60px); transform: translateY(60px);
} }
.no-player>image { .no-player>image {
width: 20px; width: 20px;
margin-right: 2px; margin-right: 2px;
} }
.btns { .btns {
height: 100%; height: 100%;
display: flex; display: flex;
@@ -527,11 +621,13 @@ onBeforeUnmount(() => {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.battle-guide { .battle-guide {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
} }
.battle-guide>button:last-child { .battle-guide>button:last-child {
color: #fed847; color: #fed847;
border: 1px solid #fed847; border: 1px solid #fed847;
@@ -541,6 +637,7 @@ onBeforeUnmount(() => {
position: relative; position: relative;
font-size: 28rpx; font-size: 28rpx;
} }
.all-players { .all-players {
position: relative; position: relative;
display: flex; display: flex;
@@ -548,67 +645,72 @@ onBeforeUnmount(() => {
align-items: center; align-items: center;
height: 83vw; height: 83vw;
} }
.all-players>image:first-child { .all-players>image:first-child {
position: absolute; position: absolute;
width: 100%; width: 100%;
} }
.all-players>image:nth-child(2) { .all-players>image:nth-child(2) {
width: 25vw; width: 25vw;
position: relative; position: relative;
} }
.all-players>view { .all-players>view {
position: relative; position: relative;
width: 42vw; width: 42vw;
height: 42vw; height: 42vw;
margin-top: 7vw; margin-top: 7vw;
} }
.all-players>view>view { .all-players>view>view {
position: absolute; position: absolute;
left: 50%; left: 50%;
top: 50%; top: 50%;
} }
/* 4个头像 - 正方形排列 */ /* 4个头像 - 正方形排列 */
.all-players>view>view:nth-child(1):nth-last-child(4) { .all-players>view>view:nth-child(1):nth-last-child(4) {
transform: translate(-50%, -50%) rotate(-30deg) translateY(-21.5vw) transform: translate(-50%, -50%) rotate(-30deg) translateY(-21.5vw) rotate(30deg);
rotate(30deg);
} }
.all-players>view>view:nth-child(2):nth-last-child(3) { .all-players>view>view:nth-child(2):nth-last-child(3) {
transform: translate(-50%, -50%) rotate(-120deg) translateY(-21.5vw) transform: translate(-50%, -50%) rotate(-120deg) translateY(-21.5vw) rotate(120deg);
rotate(120deg);
} }
.all-players>view>view:nth-child(3):nth-last-child(2) { .all-players>view>view:nth-child(3):nth-last-child(2) {
transform: translate(-50%, -50%) rotate(-210deg) translateY(-21.5vw) transform: translate(-50%, -50%) rotate(-210deg) translateY(-21.5vw) rotate(210deg);
rotate(210deg);
} }
.all-players>view>view:nth-child(4):nth-last-child(1) { .all-players>view>view:nth-child(4):nth-last-child(1) {
transform: translate(-50%, -50%) rotate(-300deg) translateY(-21.5vw) transform: translate(-50%, -50%) rotate(-300deg) translateY(-21.5vw) rotate(300deg);
rotate(300deg);
} }
/* 6个头像 - 六边形排列 */ /* 6个头像 - 六边形排列 */
.all-players>view>view:nth-child(1):nth-last-child(6) { .all-players>view>view:nth-child(1):nth-last-child(6) {
transform: translate(-50%, -50%) rotate(-30deg) translateY(-21vw) transform: translate(-50%, -50%) rotate(-30deg) translateY(-21vw) rotate(30deg);
rotate(30deg);
} }
.all-players>view>view:nth-child(2):nth-last-child(5) { .all-players>view>view:nth-child(2):nth-last-child(5) {
transform: translate(-50%, -50%) rotate(-90deg) translateY(-21vw) transform: translate(-50%, -50%) rotate(-90deg) translateY(-21vw) rotate(90deg);
rotate(90deg);
} }
.all-players>view>view:nth-child(3):nth-last-child(4) { .all-players>view>view:nth-child(3):nth-last-child(4) {
transform: translate(-50%, -50%) rotate(-150deg) translateY(-21vw) transform: translate(-50%, -50%) rotate(-150deg) translateY(-21vw) rotate(150deg);
rotate(150deg);
} }
.all-players>view>view:nth-child(4):nth-last-child(3) { .all-players>view>view:nth-child(4):nth-last-child(3) {
transform: translate(-50%, -50%) rotate(-210deg) translateY(-21vw) transform: translate(-50%, -50%) rotate(-210deg) translateY(-21vw) rotate(210deg);
rotate(210deg);
} }
.all-players>view>view:nth-child(5):nth-last-child(2) { .all-players>view>view:nth-child(5):nth-last-child(2) {
transform: translate(-50%, -50%) rotate(-270deg) translateY(-21vw) transform: translate(-50%, -50%) rotate(-270deg) translateY(-21vw) rotate(270deg);
rotate(270deg);
} }
.all-players>view>view:nth-child(6):nth-last-child(1) { .all-players>view>view:nth-child(6):nth-last-child(1) {
transform: translate(-50%, -50%) rotate(-330deg) translateY(-21vw) transform: translate(-50%, -50%) rotate(-330deg) translateY(-21vw) rotate(330deg);
rotate(330deg);
} }
.all-players>view>view>text { .all-players>view>view>text {
position: absolute; position: absolute;
background-color: #fed847; background-color: #fed847;
@@ -621,18 +723,23 @@ onBeforeUnmount(() => {
text-align: center; text-align: center;
color: #333; color: #333;
} }
.choose-side { .choose-side {
display: flex; display: flex;
} }
.choose-side>view { .choose-side>view {
width: 50%; width: 50%;
} }
.choose-side>view:first-child>view { .choose-side>view:first-child>view {
background: linear-gradient(270deg, #6a1212 0%, rgba(74, 0, 0, 0) 100%); background: linear-gradient(270deg, #6a1212 0%, rgba(74, 0, 0, 0) 100%);
} }
.choose-side>view:last-child>view { .choose-side>view:last-child>view {
background: linear-gradient(270deg, rgba(13, 0, 74, 0) 0%, #172a86 100%); background: linear-gradient(270deg, rgba(13, 0, 74, 0) 0%, #172a86 100%);
} }
.choose-side-left-item, .choose-side-left-item,
.choose-side-right-item { .choose-side-right-item {
display: flex; display: flex;
@@ -644,24 +751,29 @@ onBeforeUnmount(() => {
margin: 10px 5px; margin: 10px 5px;
position: relative; position: relative;
} }
.choose-side-left-item { .choose-side-left-item {
justify-content: flex-end; justify-content: flex-end;
} }
.choose-side-left-item>text, .choose-side-left-item>text,
.choose-side-right-item>text { .choose-side-right-item>text {
margin: 10px; margin: 10px;
max-width: 100px; max-width: 100px;
font-size: 14px; font-size: 14px;
} }
.choose-side-left-item>button:first-child, .choose-side-left-item>button:first-child,
.choose-side-right-item>button:last-child { .choose-side-right-item>button:last-child {
position: absolute; position: absolute;
top: 0; top: 0;
} }
.choose-side-left-item>button:first-child>image, .choose-side-left-item>button:first-child>image,
.choose-side-right-item>button:last-child>image { .choose-side-right-item>button:last-child>image {
width: 28px; width: 28px;
} }
.choose-side-left-item>button:first-child { .choose-side-left-item>button:first-child {
left: 0; left: 0;
} }
@@ -669,6 +781,7 @@ onBeforeUnmount(() => {
.choose-side-right-item>button:last-child { .choose-side-right-item>button:last-child {
right: 0; right: 0;
} }
.choose-side-left-item>button:last-child, .choose-side-left-item>button:last-child,
.choose-side-right-item>button:first-child { .choose-side-right-item>button:first-child {
background-color: #fff; background-color: #fff;
@@ -680,16 +793,19 @@ onBeforeUnmount(() => {
align-items: center; align-items: center;
margin-bottom: 14rpx; margin-bottom: 14rpx;
} }
.choose-side-left-item>button:last-child>image, .choose-side-left-item>button:last-child>image,
.choose-side-right-item>button:first-child>image { .choose-side-right-item>button:first-child>image {
width: 18px; width: 18px;
} }
.choose-side-left-item>view, .choose-side-left-item>view,
.choose-side-right-item>view { .choose-side-right-item>view {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.choose-side-left-item>view>text, .choose-side-left-item>view>text,
.choose-side-right-item>view>text { .choose-side-right-item>view>text {
font-size: 16rpx; font-size: 16rpx;

View File

@@ -2,7 +2,7 @@
import { ref } from "vue"; import { ref } from "vue";
import { onLoad, onShow } from "@dcloudio/uni-app"; import { onLoad, onShow } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue"; import Container from "@/components/Container.vue";
import Guide from "@/components/Guide.vue"; import GuideTwo from "@/components/GuideTwo.vue";
import SButton from "@/components/SButton.vue"; import SButton from "@/components/SButton.vue";
import SModal from "@/components/SModal.vue"; import SModal from "@/components/SModal.vue";
import Signin from "@/components/Signin.vue"; import Signin from "@/components/Signin.vue";
@@ -72,6 +72,13 @@ const onSignin = () => {
if (roomID.value && user.value.id) enterRoom(roomID.value); if (roomID.value && user.value.id) enterRoom(roomID.value);
showSignin.value = false; showSignin.value = false;
}; };
/** 跳转到我的战绩页面默认展示「好友约战」tab */
const goMyRecord = () => {
uni.navigateTo({
url: '/pages/my-growth?tab=1',
});
};
onShow(async () => { onShow(async () => {
if (user.value.id) { if (user.value.id) {
const result = await getBattleDataAPI(); const result = await getBattleDataAPI();
@@ -90,16 +97,15 @@ onLoad(async (options) => {
<template> <template>
<Container title="好友约战" :showBackToGame="true"> <Container title="好友约战" :showBackToGame="true">
<view :style="{ width: '100%', height: '100%' }"> <view :style="{ width: '100%', height: '100%' }">
<Guide> <GuideTwo>
<view class="guide-tips"> <text :style="{color: 'rgba(255,217,71,0.8)'}">约上朋友开几局欢乐多不寂寞</text>
<text>约上朋友开几局欢乐多不寂寞</text>
<text>一起练升级更快早日加入全国排位赛</text> <text>一起练升级更快早日加入全国排位赛</text>
</view> </GuideTwo>
</Guide>
<view class="my-data"> <view class="my-data">
<view> <view>
<Avatar :rankLvl="user.rankLvl" :src="user.avatar" :size="30" /> <Avatar :rankLvl="user.rankLvl" :src="user.avatar" :size="30" />
<text class="truncate">{{ user.nickName }}</text> <text class="truncate">{{ user.nickName }}</text>
<text class="my-record-btn" @click="goMyRecord">我的战绩</text>
</view> </view>
<view> <view>
<view> <view>
@@ -119,16 +125,9 @@ onLoad(async (options) => {
<view> <view>
<view class="stars"> <view class="stars">
<block v-for="i in 5" :key="i"> <block v-for="i in 5" :key="i">
<image <image v-if="data.totalWinningRate >= i * 0.2" src="../static/star-full.png" mode="widthFix" />
v-if="data.totalWinningRate >= i * 0.2" <image v-else-if="data.totalWinningRate >= (i - 1) * 0.2 + 0.1" src="../static/star-half.png"
src="../static/star-full.png" mode="widthFix" />
mode="widthFix"
/>
<image
v-else-if="data.totalWinningRate >= (i - 1) * 0.2 + 0.1"
src="../static/star-half.png"
mode="widthFix"
/>
<image v-else src="../static/star-empty.png" mode="widthFix" /> <image v-else src="../static/star-empty.png" mode="widthFix" />
</block> </block>
</view> </view>
@@ -139,19 +138,12 @@ onLoad(async (options) => {
<view class="founded-room"> <view class="founded-room">
<image src="../static/founded-room.png" mode="widthFix" /> <image src="../static/founded-room.png" mode="widthFix" />
<view> <view>
<input <input placeholder="输入房间号" v-model="roomNumber" placeholder-style="color: #ccc" />
placeholder="输入房间号"
v-model="roomNumber"
placeholder-style="color: #ccc"
/>
<view @click="enterRoom(roomNumber)">进入房间</view> <view @click="enterRoom(roomNumber)">进入房间</view>
</view> </view>
</view> </view>
<view class="create-room"> <view class="create-room">
<image <image src="https://static.shelingxingqiu.com/attachment/2025-07-15/dbcejys872iyun92h6.png" mode="widthFix" />
src="https://static.shelingxingqiu.com/attachment/2025-07-15/dbcejys872iyun92h6.png"
mode="widthFix"
/>
<image src="../static/room-notfound-title.png" mode="widthFix" /> <image src="../static/room-notfound-title.png" mode="widthFix" />
<view> <view>
<image :src="user.avatar" mode="widthFix" /> <image :src="user.avatar" mode="widthFix" />
@@ -166,11 +158,7 @@ onLoad(async (options) => {
</SButton> </SButton>
</view> </view>
</view> </view>
<SModal <SModal :show="showModal" :onClose="() => (showModal = false)" height="716rpx">
:show="showModal"
:onClose="() => (showModal = false)"
height="716rpx"
>
<view v-if="warnning" class="warnning"> <view v-if="warnning" class="warnning">
{{ warnning }} {{ warnning }}
</view> </view>
@@ -192,9 +180,11 @@ onLoad(async (options) => {
border-radius: 10px; border-radius: 10px;
padding: 15px; padding: 15px;
} }
.founded-room>image { .founded-room>image {
width: 16vw; width: 16vw;
} }
.founded-room>view { .founded-room>view {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -205,6 +195,7 @@ onLoad(async (options) => {
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
} }
.founded-room>view>input { .founded-room>view>input {
width: 70%; width: 70%;
text-align: center; text-align: center;
@@ -212,6 +203,7 @@ onLoad(async (options) => {
height: 40px; height: 40px;
color: #000; color: #000;
} }
.founded-room>view>view { .founded-room>view>view {
background-color: #fed847; background-color: #fed847;
width: 30%; width: 30%;
@@ -223,20 +215,24 @@ onLoad(async (options) => {
color: #000; color: #000;
text-align: center; text-align: center;
} }
.create-room { .create-room {
position: relative; position: relative;
margin: 15px; margin: 15px;
height: 50vw; height: 50vw;
} }
.create-room>image:first-of-type { .create-room>image:first-of-type {
position: absolute; position: absolute;
width: 100%; width: 100%;
} }
.create-room>image:nth-of-type(2) { .create-room>image:nth-of-type(2) {
padding: 15px; padding: 15px;
width: 25vw; width: 25vw;
position: relative; position: relative;
} }
.create-room>view:nth-child(3) { .create-room>view:nth-child(3) {
margin: 12vw auto; margin: 12vw auto;
position: relative; position: relative;
@@ -244,16 +240,19 @@ onLoad(async (options) => {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.create-room>view>image:first-child { .create-room>view>image:first-child {
width: 19vw; width: 19vw;
transform: translateY(-60%); transform: translateY(-60%);
border-radius: 50%; border-radius: 50%;
position: relative; position: relative;
} }
.create-room>view>image:nth-child(2) { .create-room>view>image:nth-child(2) {
width: 37vw; width: 37vw;
position: relative; position: relative;
} }
.create-room>view>view:nth-child(3) { .create-room>view>view:nth-child(3) {
position: relative; position: relative;
width: 19vw; width: 19vw;
@@ -265,10 +264,12 @@ onLoad(async (options) => {
align-items: center; align-items: center;
transform: translateY(60%); transform: translateY(60%);
} }
.create-room>view>view:nth-child(3)>image { .create-room>view>view:nth-child(3)>image {
width: 20px; width: 20px;
margin-right: 2px; margin-right: 2px;
} }
.warnning { .warnning {
width: 100%; width: 100%;
height: 100%; height: 100%;
@@ -277,6 +278,7 @@ onLoad(async (options) => {
align-items: center; align-items: center;
color: #fff9; color: #fff9;
} }
.my-data { .my-data {
width: calc(100% - 30px); width: calc(100% - 30px);
margin: 15px; margin: 15px;
@@ -286,11 +288,13 @@ onLoad(async (options) => {
overflow: hidden; overflow: hidden;
background-color: #54431d33; background-color: #54431d33;
} }
.my-data>view { .my-data>view {
width: 100%; width: 100%;
display: flex; display: flex;
color: #fff9; color: #fff9;
} }
.my-data>view:first-child { .my-data>view:first-child {
width: calc(100% - 30px); width: calc(100% - 30px);
align-items: flex-end; align-items: flex-end;
@@ -299,15 +303,28 @@ onLoad(async (options) => {
margin: 15px; margin: 15px;
margin-bottom: 0; margin-bottom: 0;
} }
.my-data>view:first-child>.my-record-btn {
font-weight: 400;
font-size: 24rpx;
color: #76D4FF;
text-align: center;
font-style: normal;
width: auto;
margin-left: auto;
}
.my-data>view:first-child>text { .my-data>view:first-child>text {
color: #fff; color: #fff;
font-size: 17px; font-size: 17px;
margin-left: 10px; margin-left: 10px;
width: 120px; width: 120px;
} }
.my-data>view:last-child { .my-data>view:last-child {
margin-bottom: 15px; margin-bottom: 15px;
} }
.my-data>view:last-child>view { .my-data>view:last-child>view {
width: 33%; width: 33%;
margin-top: 15px; margin-top: 15px;
@@ -316,24 +333,29 @@ onLoad(async (options) => {
align-items: center; align-items: center;
font-size: 12px; font-size: 12px;
} }
.my-data>view:last-child>view>view { .my-data>view:last-child>view>view {
margin-bottom: 5px; margin-bottom: 5px;
} }
.my-data>view:last-child>view>view>text:first-child { .my-data>view:last-child>view>view>text:first-child {
color: #fff; color: #fff;
font-size: 20px; font-size: 20px;
margin-right: 5px; margin-right: 5px;
transform: translateY(4px); transform: translateY(4px);
} }
.my-data>view:last-child>view:nth-child(2) { .my-data>view:last-child>view:nth-child(2) {
border-left: 1px solid #48494e; border-left: 1px solid #48494e;
border-right: 1px solid #48494e; border-right: 1px solid #48494e;
} }
.my-data>view:last-child>view>view { .my-data>view:last-child>view>view {
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
height: 20px; height: 20px;
} }
.stars>image { .stars>image {
width: 4vw; width: 4vw;
height: 4vw; height: 4vw;

View File

@@ -1,25 +1,26 @@
<script setup> <script setup>
import { ref, onMounted } from "vue"; import {onMounted, ref} from "vue";
import { onShow, onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app"; import {onShareAppMessage, onShareTimeline, onShow} from "@dcloudio/uni-app";
import Container from "@/components/Container.vue"; import Container from "@/components/Container.vue";
import AppFooter from "@/components/AppFooter.vue"; import AppFooter from "@/components/AppFooter.vue";
import AppBackground from "@/components/AppBackground.vue";
import UserHeader from "@/components/UserHeader.vue"; import UserHeader from "@/components/UserHeader.vue";
import Signin from "@/components/Signin.vue"; import Signin from "@/components/Signin.vue";
import BubbleTip from "@/components/BubbleTip.vue"; import BubbleTip from "@/components/BubbleTip.vue";
import { import {
checkUserBindAPI,
getAppConfig, getAppConfig,
getRankListAPI, getDeviceBatteryAPI,
getHomeData, getHomeData,
getMyDevicesAPI, getMyDevicesAPI,
getDeviceBatteryAPI, getRankListAPI,
silentLoginAPI,
} from "@/apis"; } from "@/apis";
import {topThreeColors} from "@/constants"; import {topThreeColors} from "@/constants";
import { canEenter } from "@/util";
import useStore from "@/store"; import useStore from "@/store";
import {storeToRefs} from "pinia"; import {storeToRefs} from "pinia";
const store = useStore(); const store = useStore();
const { const {
updateConfig, updateConfig,
@@ -27,6 +28,7 @@ const {
updateDevice, updateDevice,
updateRank, updateRank,
getLvlName, getLvlName,
getLvlNameByScore,
updateOnline, updateOnline,
} = store; } = store;
const {user, device, rankData, online, game} = storeToRefs(store); const {user, device, rankData, online, game} = storeToRefs(store);
@@ -54,12 +56,36 @@ const toRankListPage = () => {
}; };
onShow(async () => { onShow(async () => {
const token = uni.getStorageSync( const env = uni.getAccountInfoSync().miniProgram.envVersion;
`${uni.getAccountInfoSync().miniProgram.envVersion}_token` const token = uni.getStorageSync(`${env}_token`);
if (!user.value.id && !token) {
try {
const wxResult = await uni.login({provider: "weixin"});
const bindResult = await checkUserBindAPI(wxResult.code);
if (bindResult.binded) {
const newResult = await uni.login({provider: "weixin"});
const silentResult = await silentLoginAPI(newResult.code);
if (silentResult.user) updateUser(silentResult.user);
const devices = await getMyDevicesAPI();
if (devices.bindings && devices.bindings.length) {
updateDevice(
devices.bindings[0].deviceId,
devices.bindings[0].deviceName
); );
const data = await getDeviceBatteryAPI();
updateOnline(data.online);
}
} else {
showModal.value = true;
}
} catch (e) {
console.log("检查绑定状态失败", e);
}
}
const promises = [getRankListAPI()]; const promises = [getRankListAPI()];
if (token) { if (token || user.value.id) {
promises.push(getHomeData()); promises.push(getHomeData());
} }
@@ -221,8 +247,9 @@ onShareTimeline(() => {
<view> <view>
<text>段位</text> <text>段位</text>
<text>{{ <text>{{
user.rankLvl ? getLvlName(user.rankLvl) : "暂无" user.lvlName || "暂无"
}}</text> }}
</text>
</view> </view>
<view> <view>
<text>赛季平均环数</text> <text>赛季平均环数</text>
@@ -234,7 +261,8 @@ onShareTimeline(() => {
user.avg_win user.avg_win
? Number((user.avg_win * 100).toFixed(2)) + "%" ? Number((user.avg_win * 100).toFixed(2)) + "%"
: "暂无" : "暂无"
}}</text> }}
</text>
</view> </view>
</view> </view>
</view> </view>
@@ -363,6 +391,7 @@ onShareTimeline(() => {
width: 32rpx; width: 32rpx;
height: 32rpx; height: 32rpx;
} }
.player-avatar > view:first-child { .player-avatar > view:first-child {
border-radius: 50%; border-radius: 50%;
background: #777777; background: #777777;
@@ -373,6 +402,7 @@ onShareTimeline(() => {
height: 18px; height: 18px;
color: #fff; color: #fff;
} }
.player-avatar > image:last-child { .player-avatar > image:last-child {
width: 100%; width: 100%;
height: 100%; height: 100%;
@@ -391,18 +421,22 @@ onShareTimeline(() => {
margin-left: 2px; margin-left: 2px;
color: #fff; color: #fff;
} }
.my-data { .my-data {
display: flex; display: flex;
margin-top: 20px; margin-top: 20px;
justify-content: space-between; justify-content: space-between;
} }
.my-data > view:first-child { .my-data > view:first-child {
width: 28%; width: 28%;
} }
.my-data > view:first-child > image { .my-data > view:first-child > image {
width: 100%; width: 100%;
transform: translateX(-8px); transform: translateX(-8px);
} }
.my-data > view:nth-child(2) { .my-data > view:nth-child(2) {
width: 68%; width: 68%;
font-size: 12px; font-size: 12px;
@@ -410,9 +444,11 @@ onShareTimeline(() => {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.my-data > view:nth-child(2) > view:nth-child(2) { .my-data > view:nth-child(2) > view:nth-child(2) {
width: 38%; width: 38%;
} }
.my-data > view:nth-child(2) > view { .my-data > view:nth-child(2) > view {
width: 28%; width: 28%;
border-radius: 10px; border-radius: 10px;
@@ -422,11 +458,13 @@ onShareTimeline(() => {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.my-data > view:nth-child(2) > view > text:last-child { .my-data > view:nth-child(2) > view > text:last-child {
color: #fff; color: #fff;
line-height: 25px; line-height: 25px;
font-weight: 500; font-weight: 500;
} }
.top-theme { .top-theme {
position: absolute; position: absolute;
display: flex; display: flex;
@@ -436,6 +474,7 @@ onShareTimeline(() => {
height: 60px; height: 60px;
z-index: -1; z-index: -1;
} }
.top-theme > image { .top-theme > image {
width: 300rpx; width: 300rpx;
transform: translate(-4%, -14%); transform: translate(-4%, -14%);

View File

@@ -3,24 +3,29 @@ import { ref, onMounted, onBeforeUnmount } from "vue";
import { onLoad, onShow, onHide } from "@dcloudio/uni-app"; import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue"; import Container from "@/components/Container.vue";
import Matching from "@/components/Matching.vue"; import Matching from "@/components/Matching.vue";
import RoundEndTip from "@/components/RoundEndTip.vue";
import TestDistance from "@/components/TestDistance.vue";
import { matchGameAPI } from "@/apis"; import { matchGameAPI } from "@/apis";
import { MESSAGETYPESV2 } from "@/constants"; import { MESSAGETYPESV2 } from "@/constants";
const gameType = ref(0); const gameType = ref(0);
const teamSize = ref(0); const teamSize = ref(0);
const onComplete = ref(null); const onComplete = ref(null);
const matchSuccess = ref(false);
async function stopMatch() { async function stopMatch() {
uni.$showHint(3); uni.$showHint(3);
} }
async function cancelMatch() {
if (gameType.value && teamSize.value) {
await matchGameAPI(false, gameType.value, teamSize.value);
}
uni.navigateBack()
}
async function onReceiveMessage(msg) { async function onReceiveMessage(msg) {
if (msg.type === MESSAGETYPESV2.MatchSuccess) { if (msg.type === MESSAGETYPESV2.MatchSuccess) {
matchSuccess.value = true; onComplete.value = () => {}
onComplete.value = () => { }
if (msg.type === MESSAGETYPESV2.AboutToStart) {
if (gameType.value == 1) { if (gameType.value == 1) {
uni.redirectTo({ uni.redirectTo({
url: `/pages/team-battle?battleId=${msg.id}&gameMode=2`, url: `/pages/team-battle?battleId=${msg.id}&gameMode=2`,
@@ -30,7 +35,6 @@ async function onReceiveMessage(msg) {
url: `/pages/melee-battle?battleId=${msg.id}&gameMode=2`, url: `/pages/melee-battle?battleId=${msg.id}&gameMode=2`,
}); });
} }
};
} }
} }
@@ -46,6 +50,7 @@ onMounted(() => {
keepScreenOn: true, keepScreenOn: true,
}); });
uni.$on("socket-inbox", onReceiveMessage); uni.$on("socket-inbox", onReceiveMessage);
uni.$on("cancelMatching", cancelMatch);
}); });
onBeforeUnmount(() => { onBeforeUnmount(() => {
@@ -53,9 +58,7 @@ onBeforeUnmount(() => {
keepScreenOn: false, keepScreenOn: false,
}); });
uni.$off("socket-inbox", onReceiveMessage); uni.$off("socket-inbox", onReceiveMessage);
if (gameType.value && teamSize.value && !matchSuccess.value) { uni.$off("cancelMatching", cancelMatch);
matchGameAPI(false, gameType.value, teamSize.value);
}
}); });
onShow(async () => { onShow(async () => {
@@ -65,9 +68,7 @@ onShow(async () => {
}); });
onHide(() => { onHide(() => {
if (gameType.value && teamSize.value && !matchSuccess.value) {
matchGameAPI(false, gameType.value, teamSize.value);
}
}); });
</script> </script>

View File

@@ -28,21 +28,37 @@ const playersScores = ref([]);
const halfTimeTip = ref(false); const halfTimeTip = ref(false);
const halfRest = ref(false); const halfRest = ref(false);
const navigateToResult = () => {
uni.redirectTo({ url: `/pages/battle-result?battleId=${battleId.value}` });
};
function recoverData(battleInfo, { force = false } = {}) { function recoverData(battleInfo, { force = false } = {}) {
if (!battleInfo) return;
try {
if (battleInfo.way === 1) title.value = "好友约战 - 大乱斗"; if (battleInfo.way === 1) title.value = "好友约战 - 大乱斗";
if (battleInfo.way === 2) title.value = "排位赛 - 大乱斗"; if (battleInfo.way === 2) title.value = "排位赛 - 大乱斗";
players.value = battleInfo.teams[0].players;
// 优先使用接口数据,否则使用缓存
if (battleInfo.teams?.[0]?.players) {
players.value = [...battleInfo.teams[0].players];
} else {
// 大乱斗可能存的是 players 列表
// 这里的缓存逻辑根据 AboutToStart 消息结构可能不同,假设也是 teams[0]
// 如果是从 match-page 过来的match-page 只存了 teams[1] 和 [2] 给对抗模式
// 大乱斗的匹配逻辑可能不同,暂时保持原样,只做安全保护
players.value = [];
}
start.value = battleInfo.status !== 0; start.value = battleInfo.status !== 0;
if (battleInfo.status === 0) { if (battleInfo.status === 0) {
const readyRemain = (Date.now() - battleInfo.createTime) / 1000; const readyRemain = (Date.now() - (battleInfo.createTime || Date.now())) / 1000;
console.log(`对局已进行${readyRemain}`);
if (readyRemain > 0 && readyRemain < 15) { if (readyRemain > 0 && readyRemain < 15) {
setTimeout(() => { setTimeout(() => uni.$emit("update-timer", 15 - readyRemain - 0.2), 200);
uni.$emit("update-timer", 15 - readyRemain - 0.2);
}, 200);
} }
return; return;
} }
tips.value = tips.value =
(battleInfo.rounds.length !== 2 ? "上" : "下") + "半场请先射6箭"; (battleInfo.rounds.length !== 2 ? "上" : "下") + "半场请先射6箭";
playersScores.value = battleInfo.rounds.map((r) => ({ ...r.shoots })); playersScores.value = battleInfo.rounds.map((r) => ({ ...r.shoots }));
@@ -69,7 +85,7 @@ function recoverData(battleInfo, { force = false } = {}) {
return; return;
} }
if (force) { if (force) {
const remain = (Date.now() - battleInfo.current.startTime) / 1000; const remain = (Date.now() - (battleInfo.current?.startTime || Date.now())) / 1000;
console.log(`当前轮已进行${remain}`); console.log(`当前轮已进行${remain}`);
if (remain > 0 && remain < 90) { if (remain > 0 && remain < 90) {
setTimeout(() => { setTimeout(() => {
@@ -77,6 +93,9 @@ function recoverData(battleInfo, { force = false } = {}) {
}, 200); }, 200);
} }
} }
} catch (err) {
console.error("recoverData error:", err);
}
} }
onLoad(async (options) => { onLoad(async (options) => {
@@ -127,6 +146,7 @@ onBeforeUnmount(() => {
onShow(async () => { onShow(async () => {
if (battleId.value) { if (battleId.value) {
const result = await getBattleAPI(battleId.value); const result = await getBattleAPI(battleId.value);
if (!result) return;
if (result.status === 2) { if (result.status === 2) {
uni.showToast({ uni.showToast({
title: "比赛已结束", title: "比赛已结束",

View File

@@ -8,7 +8,7 @@ import {
bindDeviceAPI, bindDeviceAPI,
getMyDevicesAPI, getMyDevicesAPI,
unbindDeviceAPI, unbindDeviceAPI,
laserAimAPI, laserAimAPI, bindDeviceAPIV2,
} from "@/apis"; } from "@/apis";
import useStore from "@/store"; import useStore from "@/store";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
@@ -20,6 +20,7 @@ const { updateDevice } = store;
const { user, device } = storeToRefs(store); const { user, device } = storeToRefs(store);
const justBind = ref(false); const justBind = ref(false);
const calibration = ref(false); const calibration = ref(false);
const token = ref(null);
// 扫描二维码方法 // 扫描二维码方法
const handleScan = () => { const handleScan = () => {
@@ -30,13 +31,14 @@ const handleScan = () => {
scanType: ["qrCode"], scanType: ["qrCode"],
success: async (res) => { success: async (res) => {
try { try {
const base64Decode = (str) => { // const base64Decode = (str) => {
// 将 base64 转换为 utf8 字符串 // // 将 base64 转换为 utf8 字符串
const bytes = wx.base64ToArrayBuffer(str); // const bytes = wx.base64ToArrayBuffer(str);
return String.fromCharCode.apply(null, new Uint8Array(bytes)); // return String.fromCharCode.apply(null, new Uint8Array(bytes));
}; // };
//
addDevice.value = JSON.parse(base64Decode(res.result)); // addDevice.value = JSON.parse(base64Decode(res.result));
token.value = res.result;
confirmBindTip.value = true; confirmBindTip.value = true;
} catch (err) { } catch (err) {
uni.showToast({ uni.showToast({
@@ -57,8 +59,8 @@ const handleScan = () => {
}; };
const confirmBind = async () => { const confirmBind = async () => {
if (!justBind.value && addDevice.value.id) { if (!justBind.value && token.value) {
const result = await bindDeviceAPI(addDevice.value); const result = await bindDeviceAPIV2(token.value);
confirmBindTip.value = false; confirmBindTip.value = false;
if (result.binded) { if (result.binded) {
return uni.showToast({ return uni.showToast({
@@ -66,7 +68,7 @@ const confirmBind = async () => {
icon: "none", icon: "none",
}); });
} }
updateDevice(addDevice.value.id, addDevice.value.name); updateDevice(result.deviceId, result.name);
justBind.value = true; justBind.value = true;
uni.showToast({ uni.showToast({
title: "绑定成功", title: "绑定成功",

View File

@@ -1,5 +1,6 @@
<script setup> <script setup>
import { onMounted } from "vue"; import { onMounted } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue"; import Container from "@/components/Container.vue";
import Avatar from "@/components/Avatar.vue"; import Avatar from "@/components/Avatar.vue";
import BowData from "@/components/BowData.vue"; import BowData from "@/components/BowData.vue";
@@ -56,6 +57,17 @@ const getName = (battle) => {
if (battle.mode <= 3) return `${battle.mode}V${battle.mode}`; if (battle.mode <= 3) return `${battle.mode}V${battle.mode}`;
return battle.mode + "人大乱斗"; return battle.mode + "人大乱斗";
}; };
/**
* 支持通过 URL 参数指定初始 tab
* @example /pages/my-growth?tab=1 跳转到「好友约战」tab
*/
onLoad((options) => {
if (options && options.tab !== undefined) {
const tabIndex = parseInt(options.tab, 10);
if (!isNaN(tabIndex)) selectedIndex.value = tabIndex;
}
});
</script> </script>
<template> <template>

View File

@@ -110,7 +110,7 @@ onShow(async () => {
const result = await getHomeData(); const result = await getHomeData();
rankData.value = result; rankData.value = result;
handleSelect(selectedIndex.value); handleSelect(selectedIndex.value);
seasonData.value = result.seasonList; seasonData.value = result.seasonList || [];
if (seasonData.value[0]) { if (seasonData.value[0]) {
seasonName.value = seasonData.value[0].seasonName; seasonName.value = seasonData.value[0].seasonName;
} }

View File

@@ -16,6 +16,7 @@ import { MESSAGETYPESV2 } from "@/constants";
import audioManager from "@/audioManager"; import audioManager from "@/audioManager";
import useStore from "@/store"; import useStore from "@/store";
import {storeToRefs} from "pinia"; import {storeToRefs} from "pinia";
const store = useStore(); const store = useStore();
const {user} = storeToRefs(store); const {user} = storeToRefs(store);
const start = ref(null); const start = ref(null);
@@ -35,16 +36,33 @@ const redPoints = ref(0);
const bluePoints = ref(0); const bluePoints = ref(0);
const showRoundTip = ref(false); const showRoundTip = ref(false);
const isFinalShoot = ref(false); const isFinalShoot = ref(false);
const matchStatus = ref(undefined);
const updateRemainSecond = ref(0);
const recoverData = (battleInfo, {force = false, arrowOnly = false} = {}) => { const recoverData = (battleInfo, {force = false, arrowOnly = false} = {}) => {
try { try {
battleId.value = battleInfo.matchId; battleId.value = battleInfo.matchId;
blueTeam.value = battleInfo.teams[1].players || [];
redTeam.value = battleInfo.teams[2].players || []; // 优先使用接口返回的队伍数据,如果没有则尝试从缓存读取(应对匹配刚完成接口未就绪的情况)
const t1 = battleInfo.teams?.[1] || {};
const t2 = battleInfo.teams?.[2] || {};
if (t1.players) blueTeam.value = [...t1.players];
else {
const cached = uni.getStorageSync("blue-team");
if (cached && cached.length) blueTeam.value = cached;
}
if (t2.players) redTeam.value = [...t2.players];
else {
const cached = uni.getStorageSync("red-team");
if (cached && cached.length) redTeam.value = cached;
}
start.value = battleInfo.status !== 0; start.value = battleInfo.status !== 0;
if (battleInfo.status === 0) { if (battleInfo.status === 0) {
const readyRemain = (Date.now() - battleInfo.createTime) / 1000; const readyRemain = (Date.now() - (battleInfo.createTime || Date.now())) / 1000;
console.log(`对局已进行${readyRemain}`);
if (readyRemain > 0 && readyRemain < 15) { if (readyRemain > 0 && readyRemain < 15) {
setTimeout(() => { setTimeout(() => {
uni.$emit("update-timer", 15 - readyRemain - 0.2); uni.$emit("update-timer", 15 - readyRemain - 0.2);
@@ -67,16 +85,15 @@ const recoverData = (battleInfo, { force = false, arrowOnly = false } = {}) => {
} }
tips.value = nextTips; tips.value = nextTips;
uni.$emit("update-tips", nextTips); uni.$emit("update-tips", nextTips);
uni.$emit("update-remain", {reset: true, value: 15, team: redTeam?'red':'blue'});
if (force) { if (force) {
const remain = (Date.now() - battleInfo.current.startTime) / 1000; const remain = (Date.now() - battleInfo.current.startTime) / 1000;
console.log(`当前轮已进行${remain}`); console.log(`当前轮已进行${remain}`);
if (remain > 0 && remain < 15) { if (remain > 0 && remain < 15) {
setTimeout(() => { updateRemainSecond.value = 15 - remain - 0.2
uni.$emit("update-remain", 15 - remain - 0.2);
}, 200);
} }
} else { } else {
uni.$emit("update-remain", battleInfo.readyTime); updateRemainSecond.value = battleInfo.readyTime
} }
} else { } else {
currentRound.value = battleInfo.current.round || 1; currentRound.value = battleInfo.current.round || 1;
@@ -95,16 +112,25 @@ const recoverData = (battleInfo, { force = false, arrowOnly = false } = {}) => {
} }
}; };
async function onReceiveMessage(msg) { function onAudioEnded(s) {
if (Array.isArray(msg)) return; if (s.indexOf('请红方射箭') >= 0 || s.indexOf('请蓝方射箭') >= 0) {
if (msg.type === MESSAGETYPESV2.BattleStart) { let team = s.indexOf('请红方射箭') >= 0 ? 'red' : 'blue';
start.value = true; uni.$emit("update-remain", {stop: false, value: updateRemainSecond.value, team: team});
} else if (msg.type === MESSAGETYPESV2.ToSomeoneShoot) { }
recoverData(msg); if (s.indexOf("比赛结束") >= 0) {
} else if (msg.type === MESSAGETYPESV2.ShootResult) { onBattleEnd()
showRoundTip.value = false; }
recoverData(msg, { arrowOnly: true }); }
} else if (msg.type === MESSAGETYPESV2.NewRound) {
function onBattleEnd() {
if (matchStatus.value === 2) {
uni.redirectTo({
url: `/pages/battle-result?battleId=${battleId.value}`,
});
}
}
function onNewRound(msg) {
showRoundTip.value = true; showRoundTip.value = true;
isFinalShoot.value = msg.current.goldRound; isFinalShoot.value = msg.current.goldRound;
const latestRound = msg.rounds[currentRound.value - 1]; const latestRound = msg.rounds[currentRound.value - 1];
@@ -117,7 +143,24 @@ async function onReceiveMessage(msg) {
currentRedPoint.value = latestRound.scores[2].score; currentRedPoint.value = latestRound.scores[2].score;
} }
} }
}
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) {
uni.$emit("update-remain", {stop: true})
showRoundTip.value = false;
recoverData(msg, {arrowOnly: true});
} else if (msg.type === MESSAGETYPESV2.NewRound) {
setTimeout(() => {
onNewRound(msg)
}, 800)
} else if (msg.type === MESSAGETYPESV2.BattleEnd) { } else if (msg.type === MESSAGETYPESV2.BattleEnd) {
matchStatus.value = msg.status;
if (msg.status === 4) { if (msg.status === 4) {
showRoundTip.value = true; showRoundTip.value = true;
currentBluePoint.value = 0; currentBluePoint.value = 0;
@@ -125,13 +168,7 @@ async function onReceiveMessage(msg) {
setTimeout(() => { setTimeout(() => {
uni.navigateBack(); uni.navigateBack();
}, 2000); }, 2000);
return;
} }
setTimeout(() => {
uni.redirectTo({
url: "/pages/battle-result?battleId=" + msg.matchId,
});
}, 1000);
} }
} }
@@ -149,19 +186,21 @@ onMounted(async () => {
keepScreenOn: true, keepScreenOn: true,
}); });
uni.$on("socket-inbox", onReceiveMessage); uni.$on("socket-inbox", onReceiveMessage);
uni.$on("audioEnded", onAudioEnded);
await laserCloseAPI(); await laserCloseAPI();
}); });
onBeforeUnmount(() => { onBeforeUnmount(() => {
uni.setKeepScreenOn({ uni.setKeepScreenOn({
keepScreenOn: false, keepScreenOn: false,
}); });
uni.$off("socket-inbox", onReceiveMessage); uni.$off("audioEnded", onAudioEnded);
audioManager.stopAll(); audioManager.stopAll();
}); });
const refreshTimer = ref(null); const refreshTimer = ref(null);
onShow(async () => { onShow(async () => {
if (battleId.value) { if (battleId.value) {
const result = await getBattleAPI(battleId.value); const result = await getBattleAPI(battleId.value);
if (!result) return;
if (result.status === 2) { if (result.status === 2) {
uni.showToast({ uni.showToast({
title: "比赛已结束", title: "比赛已结束",
@@ -227,7 +266,7 @@ onShow(async () => {
:roundData=" :roundData="
roundResults[currentRound - 1] ? roundResults[currentRound - 1] : [] roundResults[currentRound - 1] ? roundResults[currentRound - 1] : []
" "
:onAutoClose="() => (showRoundTip = false)" :onAutoClose="()=>{ showRoundTip = false}"
/> />
</ScreenHint> </ScreenHint>
</view> </view>
@@ -239,6 +278,7 @@ onShow(async () => {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.players-row { .players-row {
display: flex; display: flex;
align-items: center; align-items: center;

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

BIN
src/static/share2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 585 B

BIN
src/static/shooter2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

View File

@@ -22,6 +22,19 @@ const getLvlName = (rankLvl, rankList = []) => {
return lvlName; return lvlName;
}; };
const getLvlNameByScore = (score, rankList = []) => {
if (!rankList) return;
let lvlName = "";
rankList.some((r, index) => {
if (r.upgrade_scores && r.upgrade_scores < score) {
lvlName = rankList[index].name;
return true;
}
return false;
});
return lvlName;
};
const getLvlImage = (rankLvl, rankList = []) => { const getLvlImage = (rankLvl, rankList = []) => {
if (!rankList) return; if (!rankList) return;
let lvlImage = ""; let lvlImage = "";
@@ -35,6 +48,19 @@ const getLvlImage = (rankLvl, rankList = []) => {
return lvlImage; return lvlImage;
}; };
const getLvlImageByScore = (score, rankList = []) => {
if (!rankList) return;
let lvlImage = "";
rankList.some((r, index) => {
if (r.upgrade_scores && r.upgrade_scores < score) {
lvlImage = rankList[index].icoin;
return true;
}
return false;
});
return lvlImage;
};
// 定义游戏相关的 store // 定义游戏相关的 store
export default defineStore("store", { export default defineStore("store", {
// 状态 // 状态
@@ -53,6 +79,7 @@ export default defineStore("store", {
game: { game: {
roomID: "", roomID: "",
inBattle: false, inBattle: false,
roomNumber: "", // 当前房间号,供 Header 展示房号胶囊
}, },
}), }),
@@ -65,6 +92,9 @@ export default defineStore("store", {
// 方法 // 方法
actions: { actions: {
getLvlNameByScore(score) {
return getLvlNameByScore(score, this.config.randInfos);
},
getLvlName(rankLvl) { getLvlName(rankLvl) {
return getLvlName(rankLvl, this.config.randInfos); return getLvlName(rankLvl, this.config.randInfos);
}, },
@@ -79,14 +109,9 @@ export default defineStore("store", {
}, },
async updateUser(user = {}) { async updateUser(user = {}) {
this.user = { ...defaultUser, ...user }; this.user = { ...defaultUser, ...user };
if (this.user.rankLvl !== undefined) { this.user.lvlName = getLvlNameByScore(this.user.scores, this.config.randInfos)
this.user.lvlName = getLvlName( this.user.lvlImage = getLvlImageByScore(
this.user.rankLvl, this.user.scores,
this.config.randInfos
);
}
this.user.lvlImage = getLvlImage(
this.user.rankLvl,
this.config.randInfos this.config.randInfos
); );
}, },
@@ -111,6 +136,10 @@ export default defineStore("store", {
this.game.roomID = roomID; this.game.roomID = roomID;
this.game.inBattle = inBattle; this.game.inBattle = inBattle;
}, },
/** 更新当前房间号,供 Header 组件展示房号胶囊 */
updateRoomNumber(number) {
this.game.roomNumber = number;
},
}, },
// 开启数据持久化 // 开启数据持久化

2352
yarn.lock

File diff suppressed because it is too large Load Diff