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

细节调整

Browse Source
This commit is contained in:
kron
2025-06-19 21:03:33 +08:00
parent 595a9802e2
commit 35d544003d
14 changed files with 97 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/App.vue
View File

@@ -5,13 +5,14 @@ import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
const { user } = storeToRefs(store);
const { updateConnect } = store;
watch(
() => user.value.id,
(newVal) => {
const token = uni.getStorageSync("token");
if (newVal && token) {
websocket.createWebSocket(token, (content) => {
websocket.createWebSocket(token, updateConnect, (content) => {
uni.$emit("socket-inbox", content);
});
}

5
src/components/AppFooter.vue
View File

@@ -29,6 +29,11 @@ function handleTabClick(index) {
url: "/pages/my-growth",
});
}
if (index === 2) {
uni.navigateTo({
url: "/pages/device-intro",
});
}
}
</script>

2
src/components/BattleHeader.vue
View File

@@ -19,7 +19,7 @@ defineProps({
},
winner: {
type: Number,
default: 1,
default: 2,
},
});
const bgColors = ["#364469", "#692735", "#934B4B", "#A98B69", "#8268A2 "];

6
src/components/ScoreResult.vue
View File

@@ -3,7 +3,7 @@ import { ref } from "vue";
import IconButton from "@/components/IconButton.vue";
import SButton from "@/components/SButton.vue";
import ImageShare from "@/components/ImageShare.vue";
import CoachComment from "@/components/CoachComment.vue";
import ScreenHint from "@/components/ScreenHint.vue";
import BowData from "@/components/BowData.vue";
const props = defineProps({
show: {
@@ -100,9 +100,9 @@ setTimeout(() => {
</view>
</view>
<ImageShare :show="showShare" :onClose="() => (showShare = false)" />
<CoachComment :show="showComment" :onClose="() => (showComment = false)">
<ScreenHint :show="showComment" :onClose="() => (showComment = false)">
{{ result.adjustmentHint }}
</CoachComment>
</ScreenHint>
<BowData
:arrows="result.arrows"
:show="showBowData"

11
src/components/CoachComment.vue → src/components/ScreenHint.vue
View File

@@ -30,6 +30,11 @@ const props = defineProps({
src="../static/prompt-bg-square.png"
mode="widthFix"
/>
<image
v-if="mode === 'small'"
src="../static/finish-frame.png"
mode="widthFix"
/>
<slot />
</view>
<IconButton
@@ -58,14 +63,16 @@ const props = defineProps({
align-items: center;
position: relative;
width: 70vw;
min-height: 22vh;
margin-bottom: 20px;
color: #fff;
margin-bottom: 25vw;
}
.container > view:first-child > image {
position: absolute;
width: 80vw;
left: -5vw;
left: -7%;
bottom: -20vw;
z-index: -1;
transform: translateY(-75px);
}
</style>

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

@@ -91,8 +91,7 @@ const startGame = async () => {
step.value = 2;
};
async function onReceiveMessage(content) {
const messages = JSON.parse(content).data.updates || [];
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (
msg.roomNumber === roomNumber.value ||
@@ -223,7 +222,6 @@ const onLeaveRoom = () => {
const destroyRoom = async () => {
await destroyRoomAPI(roomNumber.value);
uni.navigateBack();
};
const exitRoom = async () => {

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

@@ -46,8 +46,7 @@ const onStart = () => {
scores.value = [];
};
async function onReceiveMessage(content) {
const messages = JSON.parse(content).data.updates || [];
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
scores.value.push(msg.target);

3
src/pages/melee-match.vue
View File

@@ -52,8 +52,7 @@ async function readyToGo() {
}
}
async function onReceiveMessage(content) {
const messages = JSON.parse(content).data.updates || [];
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (
!msg.id ||

12
src/pages/my-device.vue
View File

@@ -1,7 +1,7 @@
<script setup>
import { ref, onMounted } from "vue";
import Container from "@/components/Container.vue";
import CoachComment from "@/components/CoachComment.vue";
import ScreenHint from "@/components/ScreenHint.vue";
import SButton from "@/components/SButton.vue";
import { bindDeviceAPI, getMyDevicesAPI, unbindDeviceAPI } from "@/apis";
import useStore from "@/store";
@@ -91,7 +91,7 @@ const backToHome = () => {
<view @click="() => (showTip = true)">找不到我的弓箭？</view>
<view @click="toDeviceIntroPage">我还没有弓箭</view>
</view>
<CoachComment
<ScreenHint
mode="square"
:show="showTip"
:onClose="() => (showTip = false)"
@@ -105,8 +105,8 @@ const backToHome = () => {
<text>4. 连接成功后</text>
<view>联系在线客服</view>
</view>
</CoachComment>
<CoachComment
</ScreenHint>
<ScreenHint
:show="confirmBindTip"
:onClose="() => (confirmBindTip = false)"
>
@@ -123,7 +123,7 @@ const backToHome = () => {
<view @click="() => (confirmBindTip = false)">取消</view>
</view>
</view>
</CoachComment>
</ScreenHint>
</view>
<view v-if="justBind" class="just-bind">
<view class="device-binded">
@@ -212,7 +212,7 @@ const backToHome = () => {
display: flex;
flex-direction: column;
font-size: 14px;
transform: translateX(10px) translateY(65px);
transform: translateX(10px) translateY(-10px);
}
.scan-tips > text {
margin-bottom: 2px;

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

@@ -38,8 +38,7 @@ const onStart = () => {
currentRound.value = 0;
};
async function onReceiveMessage(content) {
const messages = JSON.parse(content).data.updates || [];
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
scores.value.push(msg.target);

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

@@ -38,8 +38,7 @@ const onStart = () => {
currentRound.value = 0;
};
async function onReceiveMessage(content) {
const messages = JSON.parse(content).data.updates || [];
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
scores.value.push(msg.target);

63
src/pages/team-match.vue
View File

@@ -9,6 +9,7 @@ import ShootProgress from "@/components/ShootProgress.vue";
import PlayersRow from "@/components/PlayersRow.vue";
import Timer from "@/components/Timer.vue";
import BattleFooter from "@/components/BattleFooter.vue";
import ScreenHint from "@/components/ScreenHint.vue";
import SButton from "@/components/SButton.vue";
import { matchGameAPI, readyGameAPI } from "@/apis";
import { MESSAGETYPES, roundsName, getMessageTypeName } from "@/constants";
@@ -22,6 +23,8 @@ const matching = ref(false);
const start = ref(false);
const battleId = ref("");
const currentRound = ref(1);
const currentRedPoint = ref(0);
const currentBluePoint = ref(0);
const totalRounds = ref(0);
const power = ref(0);
const scores = ref([]);
@@ -39,6 +42,7 @@ const roundResults = ref([
]);
const redPoints = ref(0);
const bluePoints = ref(0);
const showRoundTip = ref(false);
onLoad((options) => {
gameType.value = options.gameType;
@@ -48,13 +52,13 @@ async function startMatch() {
if (gameType.value && teamSize.value) {
scores.value = [];
await matchGameAPI(true, gameType.value, teamSize.value);
startMatch.value = true;
matching.value = true;
}
}
async function stopMatch() {
if (gameType.value && teamSize.value) {
await matchGameAPI(false, gameType.value, teamSize.value);
startMatch.value = false;
matching.value = false;
}
}
async function readyToGo() {
@@ -65,8 +69,7 @@ async function readyToGo() {
}
}
async function onReceiveMessage(content) {
const messages = JSON.parse(content).data.updates || [];
async function onReceiveMessage(messages = []) {
messages.forEach((msg) => {
if (
!msg.id ||
@@ -114,12 +117,13 @@ async function onReceiveMessage(content) {
const result = msg.preRoundResult;
scores.value = [];
currentShooterId.value = 0;
if (result.currentRound > 0 && result.currentRound < totalRounds.value) {
currentBluePoint.value = result.blueScore;
currentRedPoint.value = result.redScore;
showRoundTip.value = true;
// 开始下一轮;
roundResults.value = result.roundResults;
currentRound.value = result.currentRound + 1;
}
}
if (msg.constructor === MESSAGETYPES.MatchOver) {
uni.redirectTo({
url: `/pages/battle-result?battleId=${msg.id}&winner=${msg.endStatus.winner}`,
@@ -132,7 +136,7 @@ onMounted(() => {
});
onUnmounted(() => {
uni.$off("socket-inbox", onReceiveMessage);
if (startMatch.value) {
if (matching.value) {
matchGameAPI(false, gameType.value, teamSize.value);
}
});
@@ -146,7 +150,7 @@ onUnmounted(() => {
:redTeam="redTeam"
:blueTeam="blueTeam"
/>
<Guide noBg v-if="!start && startMatch.value">
<Guide noBg v-if="!start && matching">
<view :style="{ display: 'flex', justifyContent: 'space-between' }">
<view :style="{ display: 'flex', flexDirection: 'column' }">
<text :style="{ color: '#fed847' }">请预先射几箭测试</text>
@@ -163,7 +167,7 @@ onUnmounted(() => {
:redTeam="redTeam"
/>
<BowTarget
v-if="startMatch.value"
v-if="matching"
:showE="start && user.id === currentShooterId"
:power="start ? power : 0"
:currentRound="currentRound"
@@ -184,6 +188,20 @@ onUnmounted(() => {
:bluePoints="bluePoints"
/>
<Timer :seq="timerSeq" :callBack="readyToGo" />
<ScreenHint :show="showRoundTip" :onClose="() => (showRoundTip = false)">
<view class="round-end-tip">
<text>第{{ currentRound - 1 }}轮射击结束</text>
<view>
<text>蓝队</text>
<text>{{ currentBluePoint }}</text>
<text>分，红队</text>
<text>{{ currentRedPoint }}</text>
<text>分</text>
</view>
<!-- <text>同分僵局！最后一箭定江山</text>
<text>10 秒后蓝红双方 决金箭 一箭决胜负</text> -->
</view>
</ScreenHint>
</view>
<view :style="{ marginBottom: '20px' }">
<SButton v-if="!battleId" :onClick="matching ? stopMatch : startMatch">{{
@@ -198,4 +216,31 @@ onUnmounted(() => {
.container {
width: 100%;
}
.round-end-tip {
width: 100%;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
}
.round-end-tip > view:nth-child(2) {
margin: 15px 0;
font-size: 24px;
display: flex;
align-items: center;
justify-content: center;
}
.round-end-tip > view:nth-child(2) > text:nth-child(2),
.round-end-tip > view:nth-child(2) > text:nth-child(4) {
color: #fed847;
width: 30px;
text-align: center;
font-size: 30px;
}
.round-end-tip > text:nth-child(3),
.round-end-tip > text:nth-child(4) {
color: #fff9;
font-size: 14px;
margin-bottom: 10px;
}
</style>

4
src/store.js
View File

@@ -11,6 +11,7 @@ const defaultUser = {
export default defineStore("store", {
// 状态
state: () => ({
remoteConnect: false,
user: defaultUser,
device: {
deviceId: "",
@@ -28,6 +29,9 @@ export default defineStore("store", {
// 方法
actions: {
updateConnect(connect) {
this.remoteConnect = connect;
},
updateUser(user) {
this.user = { ...defaultUser, ...user };
const rankInfos = this.config.randInfos || [];

7
src/websocket.js
View File

@@ -13,19 +13,21 @@ const RECONNECT_CONFIG = {
/**
* 建立 WebSocket 连接
*/
function createWebSocket(token, onMessage) {
function createWebSocket(token, onUpdate, onMessage) {
const url = `wss://api.shelingxingqiu.com/socket?authorization=${token}`;
socket = uni.connectSocket({
url,
success: () => {
console.log("websocket 连接成功");
onUpdate(true);
reconnectCount = 0; // 重置重连次数
},
});
// 接收消息
uni.onSocketMessage((res) => {
if (onMessage) onMessage(res.data);
const data = JSON.parse(res.data);
if (onMessage) onMessage(data.data.updates);
});
// 错误处理
@@ -36,6 +38,7 @@ function createWebSocket(token, onMessage) {
uni.onSocketClose((result) => {
console.log("WebSocket 已关闭", result);
onUpdate(false);
stopHeartbeat();
reconnect(token, onMessage);
});