76 Commits

Author SHA1 Message Date
34a32b108c fix:动态修改比赛时间 2026-05-13 18:31:51 +08:00
c168a909db fix:修改比赛进度条展示效果 2026-05-13 17:16:09 +08:00
9d45abd693 fix:射箭报环的时候进度条暂停 2026-05-13 16:33:59 +08:00
6db2142cf6 fix:修复测距页面标题展示问题 2026-05-13 15:40:12 +08:00
c3570afeba fix:比赛射箭数改为用indexMap字段展示 2026-05-13 15:14:53 +08:00
4761206a6e fix:比赛射箭数取后端动态值 2026-05-13 14:58:36 +08:00
c298e258cc fix:优化比赛tips展示逻辑 2026-05-13 13:42:22 +08:00
6cb5288631 fix:优化重进比赛tips展示逻辑 2026-05-13 11:17:30 +08:00
6d434e89ab fix:修复重进比赛进度条丢失问题 2026-05-13 10:49:37 +08:00
996472953a fix:优化重新进入比赛页面箭数展示逻辑 2026-05-13 10:10:38 +08:00
47fe964c31 fix:去掉轮次成绩弹窗的关闭功能 2026-05-12 17:36:37 +08:00
2ed1c4a57d fix:比赛页面新增设备已离线弹窗提示 2026-05-12 17:10:21 +08:00
956e82e10c fix: onBeforeUnmount 补充 uni.$off("socket-inbox", onReceiveMessage)&ToSomeoneShoot 消息去重防护(lastToSomeoneShootKey) 2026-05-12 16:01:29 +08:00
cf8d6135ff bug:修复大乱斗前6箭不射导致分数块展示错乱的问题 2026-05-12 10:46:27 +08:00
b7fdf97156 fix:排位赛匹配页面逻辑优化:增加超时判断&websocket丢失判断 2026-05-12 10:36:27 +08:00
a79486ad50 fix:我的成长脚印页面展示优化 2026-05-12 09:54:07 +08:00
5e69cd1d47 fix:优化完整成绩页面展示 2026-05-12 09:20:43 +08:00
3f181778a1 fix:优化成绩详情展示 2026-05-11 17:57:29 +08:00
b1238eff57 fix:优化决金箭的数量展示 2026-05-11 15:14:30 +08:00
c8c2abf3e7 fix:优化NvN比赛进度条展示 2026-05-11 14:39:25 +08:00
ea60371c44 bug:修复排位赛对抗类型跳转错比赛页面问题 2026-05-11 11:04:05 +08:00
478c0bc2b2 fix:优化对战进度条展示 2026-05-11 10:10:23 +08:00
76efe5a207 fix:结算页面经验进度条后端对接完成 2026-05-09 17:41:41 +08:00
3bfd8b2328 fix:房间号模块跟胶囊margin距离根据机型动态写入 2026-05-09 16:41:06 +08:00
3cf2470ffc fix:本地图片改为网络图片并删除本地图片 2026-05-09 15:58:55 +08:00
834841a3d5 fix:全部对战页面对接新结算页面 2026-05-09 15:51:51 +08:00
eaa1950a18 fix:大乱斗成绩块样式调整 2026-05-09 15:28:55 +08:00
45cb785ba4 fix:大乱斗比赛页面结束跳转到新结算页面 2026-05-09 15:23:58 +08:00
c4ad44b02a fix:大乱斗结算页面接口对接完成 2026-05-09 14:24:28 +08:00
df4f8d8fd5 fix:合并代码并解决冲突 2026-05-09 14:00:20 +08:00
6e62ec4348 fix:大乱斗结算页面结构样式完成 2026-05-09 13:57:36 +08:00
cf22fe566d Merge branch 'feat-zhangyi' into test 2026-05-09 13:51:10 +08:00
31361cff1e update: 替换背景图片地址 2026-05-09 13:50:55 +08:00
235556e703 Merge branch 'feat-zhangyi' into test 2026-05-09 13:44:33 +08:00
0a8c6e7477 update: 优化图片 2026-05-09 13:44:07 +08:00
183a1a8385 Merge branch 'feat-zhangyi' into test 2026-05-09 10:05:55 +08:00
0e936b8e20 update:排位赛界面、排行榜界面改版,新增agents描述文档 2026-05-09 10:04:15 +08:00
d8a94c8ff6 fix:修复mvp接口字段报错问题 2026-05-08 11:04:21 +08:00
29c6b174d8 fix:对战房间分享文案动态写入完成 2026-05-08 09:28:30 +08:00
3ea1a6734a feat: 添加分支管理说明 2026-05-07 21:03:31 +08:00
d1bd036351 fix: 个人练习报环完成之后再弹练习结果弹窗
(cherry picked from commit a6becf67ff)
2026-05-07 18:31:55 +08:00
bb43de3a62 fix:修改env配置 2026-05-07 18:29:04 +08:00
d2dc6c51cf fix:更新约战头部tip模块样式 2026-05-07 18:26:52 +08:00
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
8c48216a75 feat: 好友约战选择20、40厘米靶 2026-04-20 17:43:38 +08:00
c1ff0cedad feat:选择20cm、40cm全环靶 2026-04-20 16:00:10 +08:00
56650793e8 pref: 更新音频 2026-04-20 11:13:59 +08:00
e8568ee6a8 feat: 添加射箭声音 2026-04-16 18:06:59 +08:00
kron
1181a2133a 更换图片地址 2026-04-07 16:27:49 +08:00
kron
b9bb1e6653 BUG修复 2026-02-10 18:13:11 +08:00
kron
608de34dd3 细节完善 2026-02-10 17:03:25 +08:00
kron
88f1ef5d95 细节完善 2026-02-10 14:48:07 +08:00
kron
b0bf1880e4 完善个人练习分享 2026-02-10 11:47:20 +08:00
kron
812879d252 完善我的成长 2026-02-10 11:47:09 +08:00
kron
303e1830d3 BUG修复 2026-02-10 11:32:53 +08:00
kron
61ff1af4c3 细节完善 2026-02-10 09:20:01 +08:00
kron
a3a9f7b351 细节完善 2026-02-09 18:16:48 +08:00
kron
4801833fa9 删除无用文件 2026-02-09 18:16:39 +08:00
80 changed files with 5483 additions and 3893 deletions

5
.gitignore vendored
View File

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

3
.vscode/settings.json vendored Normal file
View File

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

269
AGENTS.md Normal file
View File

@@ -0,0 +1,269 @@
# AI Agent 企业级行为策略Ultimate Edition
## 核心目标
AI 应:
* 像高级工程师一样思考
* 保持智能
* 保持上下文理解能力
* 保持组件联动能力
* 同时避免无意义 token 消耗
目标不是限制 AI。
目标是:
* 智能
* 克制
* 稳定
* 高效
---
# AI 工作模式
默认采用:
Think First
Explore Second
Modify Last
即:
1. 先理解需求
2. 再推理可能相关文件
3. 再最小化读取
4. 最后修改代码
禁止:
* 无脑全项目扫描
* 不经思考直接 grep
* 无限递归读取
---
# 智能按需扫描(核心规则)
允许 AI 自动:
* 分析当前任务
* 分析 import
* 分析组件依赖
* 分析 store 依赖
* 分析 api 依赖
* 分析 types 依赖
* 分析 utils 依赖
允许:
* 自动读取直接依赖文件
* 自动修复 import
* 自动修复类型引用
* 自动分析运行链路
但必须:
* 最小化扫描范围
* 最小化 token 消耗
* 禁止无限递归探索
---
# 扫描深度限制
默认最大依赖深度:
2 层
例如:
index.vue
-> ProductCard.vue
-> product.ts
允许读取:
* ProductCard.vue
* product.ts
禁止继续无限扫描。
如果任务复杂:
必须先输出分析计划,
等待确认后再扩大扫描范围。
---
# AI 自由发挥边界
允许:
* 合理重构
* 合理组件化
* 合理优化结构
* 合理优化样式
* 合理优化复用
* 合理修复低级问题
* 合理修复 import
* 合理修复类型错误
禁止:
* 为了炫技重构项目
* 无意义抽象
* 过度设计
* 无意义拆分
* 无意义新增依赖
* 自动升级依赖
---
# Token 经济策略
Token 应优先用于:
* 推理
* 架构理解
* 业务逻辑
* UI 结构优化
* 类型安全
* 组件联动
禁止浪费在:
* 全项目 grep
* 重复读取
* 重复输出
* 重复解释
* 输出完整项目
* 输出未修改代码
---
# 页面生成规则Figma / uni-app
允许:
* 自动组件化
* 自动布局优化
* 自动结构优化
* 自动提取公共组件
优先:
* flex 布局
* 可维护性
* uni-app 最佳实践
* 低嵌套结构
* 高复用结构
禁止:
* div 套 div
* 全 absolute 页面
* 垃圾 HTML
* 无意义嵌套
* 内联 style 泛滥
---
# uni-app 规则
必须:
* 使用 view/text/image
* px 转 rpx
* 使用 script setup
* scoped scss
* 兼容:
* H5
* 微信小程序
* App
---
# 大任务策略
复杂任务:
必须:
1. 先分析
2. 先规划
3. 先输出方案
4. 等待确认
再:
5. 编码
禁止直接进入大规模代码生成。
---
# 修改策略
优先:
* diff 修改
* 小范围 patch
* 保持现有架构
* 保持现有组件体系
* 保持现有 API 结构
允许:
* 小范围智能优化
禁止:
* 全项目重构
* 无关文件修改
---
# 高级工程师行为模式
AI 应像高级工程师:
* 先思考
* 再探索
* 再修改
而不是:
* 无脑扫描器
* Token 消耗机器
* 低级代码生成器
AI 应主动:
* 控制扫描范围
* 控制输出长度
* 控制修改范围
* 控制复杂度
同时保持:
* 智能
* 联动能力
* 架构理解能力
---
# 默认输出规则
默认:
* 仅输出修改部分
* 不重复未修改代码
* 少解释
* 优先 patch
* 优先 diff
除非用户明确要求:
否则不要输出完整项目。

116
doc.md Normal file
View File

@@ -0,0 +1,116 @@
# 微信小程序多人协作分支管理规范
## 一、分支结构
```
main (主分支/生产环境)
└── test (测试分支)
└── feature/xxx (个人开发分支)
```
| 分支 | 用途 | 稳定性 |
|------|------|--------|
| main | 生产环境代码 | 最高,仅接受测试通过的代码合并 |
| test | 测试环境,用于体验版发布 | 中,需验证后合并到 main |
| feature/xxx | 个人开发分支 | 低,按需命名,如 `feature/user-center` |
---
## 二、开发流程
### 1. 开始开发
```bash
# 确保本地 main 最新
git checkout main
git pull origin main
# 从 main 创建自己的开发分支
git checkout -b feature/your-name-work
```
### 2. 开发阶段
- 在个人分支上开发功能
- 频繁提交,保持原子性提交
- 定期 `git pull origin main` 同步主线变更,避免合并冲突累积
```bash
git add .
git commit -m "feat: 完成xxx功能"
```
### 3. 合并到 test 分支
```bash
# 切换到 test
git checkout test
git pull origin test
# 合并个人分支
git merge feature/your-name-work
# 推送 test 分支
git push origin test
```
### 4. 打包上传体验版
```bash
# 执行打包
npm run build
```
打包完成后:
1. 打开 **微信开发者工具**
2. 导入项目,选择 `dist/build/mp-weixin` 目录
3. 在开发者工具中点击 **上传**
4. 登录 [微信公众平台](https://mp.weixin.qq.com)
5. 进入 **管理->版本管理**
6. 找到刚上传的版本,点击 **选为体验版**
---
## 三、合并到 main 分支
当 test 分支验证通过后,将其合并到 main
```bash
git checkout main
git pull origin main
git merge origin/test
git push origin main
```
---
## 四、冲突处理
合并时如有冲突,在个人分支解决后再合并:
```bash
git checkout feature/your-name-work
git merge main
# 解决冲突后
git add .
git commit -m "merge: 解决与main的冲突"
git push origin feature/your-name-work
# 重新合并到 test
git checkout test
git merge feature/your-name-work
git push origin test
```
---
## 五、注意事项
1. **禁止直接向 main 和 test 分支提交代码**,必须通过合并
2. **每次合并前先拉取最新代码**,避免覆盖他人改动
3. **体验版发布前确认代码已提交**,避免遗漏
4. **开发分支命名建议**`feature/姓名-功能名`,如 `feature/zhangsan-login`
5. **删除已合并的开发分支**`git branch -d feature/your-name-work`

View File

@@ -1,256 +1,292 @@
<script setup>
import { watch } from "vue";
import { onShow, onHide } from "@dcloudio/uni-app";
import websocket from "@/websocket";
import { getDeviceBatteryAPI } from "@/apis";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
const { user } = storeToRefs(store);
const { updateUser, updateOnline } = store;
import {
watch
} from "vue";
import {
onShow,
onHide
} from "@dcloudio/uni-app";
import websocket from "@/websocket";
import {
getDeviceBatteryAPI
} from "@/apis";
import useStore from "@/store";
import {
storeToRefs
} from "pinia";
import audioManager from "./audioManager";
const store = useStore();
const {
user
} = storeToRefs(store);
const {
updateUser,
updateOnline
} = store;
watch(
() => user.value.id,
(newVal) => {
const token = uni.getStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
if (newVal && token) {
websocket.createWebSocket(token, (content) => {
uni.$emit("socket-inbox", content);
});
}
if (!newVal) {
websocket.closeWebSocket();
}
},
{
deep: false, // 如果 user 是一个对象或数组,建议开启
immediate: false, // 若想在初始化时立即执行一次回调,可开启。
}
);
watch(
() => user.value.id,
(newVal) => {
const token = uni.getStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
if (newVal && token) {
websocket.createWebSocket(token, onShootWsMsg);
}
if (!newVal) {
websocket.closeWebSocket();
}
}, {
deep: false, // 如果 user 是一个对象或数组,建议开启
immediate: false, // 若想在初始化时立即执行一次回调,可开启。
}
);
function emitUpdateUser(value) {
updateUser(value);
}
function emitUpdateUser(value) {
updateUser(value);
}
async function emitUpdateOnline() {
const data = await getDeviceBatteryAPI();
updateOnline(data.online);
}
async function emitUpdateOnline() {
const data = await getDeviceBatteryAPI();
updateOnline(data.online);
}
onShow(() => {
uni.$on("update-user", emitUpdateUser);
uni.$on("update-online", emitUpdateOnline);
const token = uni.getStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
if (user.value.id && token) {
console.log("回到前台,重新连接 websocket");
websocket.createWebSocket(token, (content) => {
uni.$emit("socket-inbox", content);
});
}
});
function onDeviceShoot() {
// audioManager.play("射箭声音")
}
onHide(() => {
uni.$off("update-user", emitUpdateUser);
uni.$off("update-online", emitUpdateOnline);
websocket.closeWebSocket();
});
function onShootWsMsg(content) {
if(content.type === 'shoot-trigger'){
onDeviceShoot()
}
uni.$emit("socket-inbox", content);
}
onShow(() => {
uni.$on("update-user", emitUpdateUser);
uni.$on("update-online", emitUpdateOnline);
const token = uni.getStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
if (user.value.id && token) {
console.log("回到前台,重新连接 websocket");
websocket.createWebSocket(token, onShootWsMsg);
}
});
onHide(() => {
uni.$off("update-user", emitUpdateUser);
uni.$off("update-online", emitUpdateOnline);
websocket.closeWebSocket();
});
</script>
<style>
page {
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
background-color: #000;
}
page {
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
background-color: #000;
}
button {
margin: 0;
padding: 0;
border: none;
background: none;
line-height: 1;
outline: none;
box-sizing: border-box;
}
button {
margin: 0;
padding: 0;
border: none;
background: none;
line-height: 1;
outline: none;
box-sizing: border-box;
}
view::-webkit-scrollbar {
width: 0;
height: 0;
color: transparent;
}
view::-webkit-scrollbar {
width: 0;
height: 0;
color: transparent;
}
button::after {
border: none;
}
button::after {
border: none;
}
.guide-tips {
display: flex;
flex-direction: column;
font-size: 28rpx;
}
.guide-tips > text:first-child {
color: #fed847;
}
.guide-tips > text:nth-child(2) {
font-size: 24rpx;
}
.guide-tips {
display: flex;
flex-direction: column;
font-size: 28rpx;
}
@keyframes fadeInOut {
0% {
transform: translateY(20px);
opacity: 0;
}
30% {
transform: translateY(0);
opacity: 1;
}
80% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.guide-tips>text:first-child {
color: #fed847;
}
.fade-in-out {
animation: fadeInOut 1.2s ease forwards;
}
.guide-tips>text:nth-child(2) {
font-size: 24rpx;
}
@keyframes fadeOut {
from {
transform: translateY(0);
opacity: 1;
}
to {
transform: translateY(20px);
opacity: 0;
}
}
@keyframes fadeInOut {
0% {
transform: translateY(20px);
opacity: 0;
}
.fade-out {
animation: fadeOut 0.3s ease forwards;
}
30% {
transform: translateY(0);
opacity: 1;
}
@keyframes scaleIn {
from {
transform: scale(0);
opacity: 0;
}
to {
transform: scale(1);
opacity: 1;
}
}
80% {
opacity: 1;
}
.scale-in {
animation: scaleIn 0.3s ease-out forwards;
transform-origin: center center;
}
100% {
opacity: 0;
}
}
@keyframes scaleOut {
from {
transform: scale(1);
opacity: 1;
}
to {
transform: scale(0);
opacity: 0;
}
}
.fade-in-out {
animation: fadeInOut 1.2s ease forwards;
}
.scale-out {
animation: scaleOut 0.3s ease-out forwards;
transform-origin: center center;
}
@keyframes fadeOut {
from {
transform: translateY(0);
opacity: 1;
}
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
to {
transform: translateY(20px);
opacity: 0;
}
}
@keyframes pumpIn {
from {
transform: scale(2);
}
to {
transform: scale(1);
}
}
.fade-out {
animation: fadeOut 0.3s ease forwards;
}
.pump-in {
animation: pumpIn 0.3s ease-out forwards;
transform-origin: center center;
}
@keyframes scaleIn {
from {
transform: scale(0);
opacity: 0;
}
.share-canvas {
width: 300px;
height: 530px;
position: absolute;
top: -1000px;
left: 0;
}
to {
transform: scale(1);
opacity: 1;
}
}
.truncate {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.scale-in {
animation: scaleIn 0.3s ease-out forwards;
transform-origin: center center;
}
.modal {
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.user-row {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 15px;
padding-top: 7px;
position: relative;
}
.half-time-tip {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.half-time-tip > text:last-child {
margin-top: 20px;
color: #fff9;
}
.see-more {
display: flex;
align-items: center;
justify-content: center;
margin-top: 20rpx;
}
.see-more > text {
color: #39a8ff;
font-size: 13px;
}
.see-more > image {
width: 15px;
}
@keyframes scaleOut {
from {
transform: scale(1);
opacity: 1;
}
@font-face {
font-family: "DINCondensed";
src: url("https://static.shelingxingqiu.com/font/DIN-Condensed-Bold-2.ttf")
format("truetype");
font-weight: 700;
font-style: normal;
font-display: swap;
}
to {
transform: scale(0);
opacity: 0;
}
}
.scale-out {
animation: scaleOut 0.3s ease-out forwards;
transform-origin: center center;
}
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes pumpIn {
from {
transform: scale(2);
}
to {
transform: scale(1);
}
}
.pump-in {
animation: pumpIn 0.3s ease-out forwards;
transform-origin: center center;
}
.share-canvas {
width: 300px;
height: 530px;
position: absolute;
top: -1000px;
left: 0;
}
.truncate {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.modal {
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.user-row {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 15px;
padding-top: 7px;
position: relative;
}
.half-time-tip {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.half-time-tip>text:last-child {
margin-top: 20px;
color: #fff9;
}
.see-more {
display: flex;
align-items: center;
justify-content: center;
margin-top: 20rpx;
}
.see-more>text {
color: #39a8ff;
font-size: 13px;
}
.see-more>image {
width: 15px;
}
@font-face {
font-family: "DINCondensed";
src: url("https://static.shelingxingqiu.com/font/DIN-Condensed-Bold-2.ttf") format("truetype");
font-weight: 700;
font-style: normal;
font-display: swap;
}
</style>

View File

@@ -1,567 +1,558 @@
let BASE_URL = "https://api.shelingxingqiu.com/api/shoot"; // 默认正式版
try {
const accountInfo = uni.getAccountInfoSync();
const envVersion = accountInfo.miniProgram.envVersion;
const accountInfo = uni.getAccountInfoSync();
const envVersion = accountInfo.miniProgram.envVersion;
switch (envVersion) {
case "develop": // 开发版
// BASE_URL = "http://192.168.1.30:8000/api/shoot";
BASE_URL = "https://apitest.shelingxingqiu.com/api/shoot";
break;
case "trial": // 体验版
BASE_URL = "https://apitest.shelingxingqiu.com/api/shoot";
break;
case "release": // 正式版
BASE_URL = "https://api.shelingxingqiu.com/api/shoot";
break;
default:
// 保持默认值
break;
}
switch (envVersion) {
case "develop": // 开发版
BASE_URL = "http://192.168.1.30:8000/api/shoot";
// BASE_URL = "https://apitest.shelingxingqiu.com/api/shoot";
break;
case "trial": // 体验版
BASE_URL = "https://apitest.shelingxingqiu.com/api/shoot";
break;
case "release": // 正式版
BASE_URL = "https://api.shelingxingqiu.com/api/shoot";
break;
default:
// 保持默认值
break;
}
} catch (e) {
console.error("获取环境信息失败,使用默认正式环境", e);
console.error("获取环境信息失败,使用默认正式环境", e);
}
function request(method, url, data = {}) {
const token = uni.getStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
const header = {};
if (token) header.Authorization = `Bearer ${token || ""}`;
return new Promise((resolve, reject) => {
uni.request({
url: `${BASE_URL}${url}`,
method,
header,
data,
timeout: 10000,
success: (res) => {
if (res.data) {
const { code, data, message } = res.data;
if (code === 0) resolve(data);
else if (message) {
if (message.indexOf("登录身份已失效") !== -1) {
uni.removeStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
uni.$emit("update-user");
}
if (message === "ROOM_FULL") {
resolve({ full: true });
return;
}
if (message === "ERROR_ROOM_GAME_START") {
resolve({ started: true });
return;
}
if (url.indexOf("/user/room") !== -1 && method === "GET") {
resolve({});
return;
}
if (message === "ERROR_BATTLE_GAMING") {
resolve({});
return;
}
if (message === "BIND_DEVICE") {
resolve({ binded: true });
return;
}
if (message === "ERROR_ORDER_UNPAY") {
uni.showToast({
title: "当前有未支付订单",
icon: "none",
});
resolve({});
return;
}
if (message === "ROOM_EMPTY") {
return uni.showToast({
title: "房间已过期",
icon: "none",
});
}
uni.showToast({
title: message,
icon: "none",
});
}
reject("");
}
},
fail: (err) => {
handleRequestError(err, url);
reject(err);
},
const token = uni.getStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
const header = {};
if (token) header.Authorization = `Bearer ${token || ""}`;
return new Promise((resolve, reject) => {
uni.request({
url: `${BASE_URL}${url}`,
method,
header,
data,
timeout: 10000,
success: (res) => {
if (res.data) {
const {code, data, message} = res.data;
if (code === 0) resolve(data);
else if (message) {
if (message.indexOf("登录身份已失效") !== -1) {
uni.removeStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
uni.$emit("update-user");
}
if (message === "ROOM_FULL") {
resolve({full: true});
return;
}
if (message === "ERROR_ROOM_GAME_START") {
resolve({started: true});
return;
}
if (url.indexOf("/user/room") !== -1 && method === "GET") {
resolve({});
return;
}
if (message === "ERROR_BATTLE_GAMING") {
resolve({});
return;
}
if (message === "BIND_DEVICE") {
resolve({binded: true});
return;
}
if (message === "ERROR_ORDER_UNPAY") {
uni.showToast({
title: "当前有未支付订单",
icon: "none",
});
resolve({});
return;
}
if (message === "ROOM_EMPTY") {
return uni.showToast({
title: "房间已过期",
icon: "none",
});
}
uni.showToast({
title: message,
icon: "none",
});
}
reject("");
}
},
fail: (err) => {
handleRequestError(err, url);
reject(err);
},
});
});
});
}
// 统一的错误处理函数
function handleRequestError(err, url) {
console.log("请求失败:", { err, url });
console.log("请求失败:", {err, url});
// 根据错误类型显示不同提示
if (err.errMsg) {
if (err.errMsg.includes("timeout")) {
showCustomToast("请求超时,请稍后重试", "timeout");
} else if (err.errMsg.includes("fail")) {
// 检查网络状态
uni.getNetworkType({
success: (res) => {
if (res.networkType === "none") {
showCustomToast("网络连接已断开,请检查网络设置", "network");
} else {
showCustomToast("服务器连接失败,请稍后重试", "server");
}
},
fail: () => {
showCustomToast("网络异常,请检查网络连接", "unknown");
},
});
// 根据错误类型显示不同提示
if (err.errMsg) {
if (err.errMsg.includes("timeout")) {
showCustomToast("请求超时,请稍后重试", "timeout");
} else if (err.errMsg.includes("fail")) {
// 检查网络状态
uni.getNetworkType({
success: (res) => {
if (res.networkType === "none") {
showCustomToast("网络连接已断开,请检查网络设置", "network");
} else {
showCustomToast("服务器连接失败,请稍后重试", "server");
}
},
fail: () => {
showCustomToast("网络异常,请检查网络连接", "unknown");
},
});
} else {
showCustomToast("请求失败,请稍后重试", "general");
}
} else {
showCustomToast("请求失败,请稍后重试", "general");
showCustomToast("网络异常,请稍后重试", "unknown");
}
} else {
showCustomToast("网络异常,请稍后重试", "unknown");
}
}
// 自定义提示函数
function showCustomToast(message, type) {
const config = {
title: message,
icon: "none",
duration: 3000,
};
const config = {
title: message,
icon: "none",
duration: 3000,
};
// 根据错误类型可以添加不同的处理逻辑
switch (type) {
case "timeout":
config.duration = 4000; // 超时提示显示更久
break;
case "network":
config.duration = 5000; // 网络问题提示显示更久
break;
default:
break;
}
// 根据错误类型可以添加不同的处理逻辑
switch (type) {
case "timeout":
config.duration = 4000; // 超时提示显示更久
break;
case "network":
config.duration = 5000; // 网络问题提示显示更久
break;
default:
break;
}
uni.showToast(config);
uni.showToast(config);
}
// 获取全局配置
export const getAppConfig = () => {
return request("GET", "/index/appConfig");
return request("GET", "/index/appConfig");
};
export const getHomeData = (seasonId) => {
return request("GET", `/user/myHome?seasonId=${seasonId}`);
return request("GET", `/user/myHome?seasonId=${seasonId}`);
};
export const getProvinceData = () => {
return request("GET", "/index/provinces/list");
return request("GET", "/index/provinces/list");
};
export const loginAPI = async (phone, nickName, avatarData, code) => {
const result = await request("POST", "/index/code", {
appName: "shoot",
appId: "wxa8f5989dcd45cc23",
nickName,
avatarData,
code,
phone,
});
uni.setStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`,
result.token
);
return result;
const result = await request("POST", "/index/code", {
appName: "shoot",
appId: "wxa8f5989dcd45cc23",
nickName,
avatarData,
code,
phone,
});
uni.setStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`,
result.token
);
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) => {
return request("POST", "/user/device/bindDevice", {
device,
});
return request("POST", "/user/device/bindDevice", {
device,
});
};
export const bindDeviceAPIV2 = (token) => {
return request("POST", "/user/device/bindDevice/v2", {
token: token,
});
};
export const unbindDeviceAPI = (deviceId) => {
return request("POST", "/user/device/unbindDevice", {
deviceId,
});
return request("POST", "/user/device/unbindDevice", {
deviceId,
});
};
export const getMyDevicesAPI = () => {
// "/user/device/getBinding?deviceId=9ZF9oVXs"
return request("GET", "/user/device/getBindings");
// "/user/device/getBinding?deviceId=9ZF9oVXs"
return request("GET", "/user/device/getBindings");
};
export const createPractiseAPI = (arrows, time) => {
return request("POST", "/user/practice/create", {
shootNumber: arrows,
shootTime: time,
});
export const createPractiseAPI = (arrows, time, target) => {
return request("POST", "/user/practice/create", {
shootNumber: arrows,
shootTime: time,
targetType: target * 20,
});
};
export const startPractiseAPI = () => {
return request("POST", "/user/practice/begin");
return request("POST", "/user/practice/begin");
};
export const endPractiseAPI = () => {
return request("POST", "/user/practice/stop");
return request("POST", "/user/practice/stop");
};
export const getPractiseAPI = async (id) => {
return request("GET", `/user/practice/get?id=${id}`);
return request("GET", `/user/practice/get?id=${id}`);
};
export const createRoomAPI = (gameType, teamSize) => {
return request("POST", "/user/createroom", {
gameType,
teamSize,
});
export const createRoomAPI = (gameType, teamSize, targetType) => {
return request("POST", "/user/createroom", {
gameType,
teamSize,
targetType,
});
};
export const getRoomAPI = (number) => {
return request("GET", `/user/room?number=${number}`);
return request("GET", `/user/room?number=${number}`);
};
export const joinRoomAPI = (number) => {
return request("POST", `/user/room/join`, { number });
return request("POST", `/user/room/join`, {number});
};
export const destroyRoomAPI = (roomNumber) => {
return request("POST", "/user/room/destroyRoom", {
roomNumber,
});
return request("POST", "/user/room/destroyRoom", {
roomNumber,
});
};
export const exitRoomAPI = (number, userId) => {
return request("POST", "/user/room/exitRoom", {
number,
userId,
});
return request("POST", "/user/room/exitRoom", {
number,
userId,
});
};
export const startRoomAPI = (number) => {
return request("POST", "/user/room/start", { number });
return request("POST", "/user/room/start", {number});
};
export const getPractiseResultListAPI = async (page = 1, page_size = 15) => {
const reuslt = await request(
"GET",
`/user/practice/list?page=${page}&page_size=${page_size}`
);
return reuslt.list;
const reuslt = await request(
"GET",
`/user/practice/list?page=${page}&page_size=${page_size}`
);
return reuslt.list;
};
export const matchGameAPI = (match, gameType, teamSize) => {
return request("POST", "/user/game/match", {
match,
gameType,
teamSize,
readyTime: 1.5,
});
return request("POST", "/user/game/match", {
match,
gameType,
teamSize,
readyTime: 15,
targetType: 20,
});
};
export const readyGameAPI = (battleId) => {
return request("POST", "/user/game/prepare", {
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,
};
});
return request("POST", "/user/game/prepare", {
battleId,
});
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,
};
if (x !== undefined && y !== undefined) {
data.x = x;
data.y = y;
}
return request("POST", "/index/arrow", data);
const data = {
device_id,
};
if (x !== undefined && y !== undefined) {
data.x = x;
data.y = y;
}
return request("POST", "/index/arrow", data);
};
export const getBattleListAPI = async (page, battleType) => {
const data = [];
const result = await request("POST", "/user/battle/details/list", {
page,
battleType,
modeType: 0,
});
(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),
const result = await request("POST", "/user/battle/details/list", {
page,
pageSize: 10,
battleType,
});
});
return data;
return result.list;
};
export const getRankListAPI = () => {
return request("GET", "/index/ranklist");
return request("GET", "/index/ranklist");
};
export const createOrderAPI = (vipId) => {
return request("POST", "/user/order/create", {
vipId,
quanity: 1,
tradeType: "mini",
payType: "wxpay",
});
return request("POST", "/user/order/create", {
vipId,
quanity: 1,
tradeType: "mini",
payType: "wxpay",
});
};
export const payOrderAPI = (id) => {
return request("POST", "/user/order/pay", {
id,
tradeType: "mini",
payType: "wxpay",
});
return request("POST", "/user/order/pay", {
id,
tradeType: "mini",
payType: "wxpay",
});
};
export const getOrderListAPI = async (page) => {
const reuslt = await request("GET", `/user/order/list?page=${page}`);
return reuslt.items || [];
const reuslt = await request("GET", `/user/order/list?page=${page}`);
return reuslt.items || [];
};
export const cancelOrderListAPI = async (id) => {
return request("POST", "/user/order/cancelOrder", { id });
return request("POST", "/user/order/cancelOrder", {id});
};
export const getUserGameState = () => {
return request("GET", "/user/state");
return request("GET", "/user/state");
};
export const getPointBookConfigAPI = async () => {
return request("GET", "/user/score/sheet/option");
return request("GET", "/user/score/sheet/option");
};
export const savePointBookAPI = async (
bowType,
distance,
targetType,
groups,
arrows,
data = []
) => {
return request("POST", "/user/score/sheet/report", {
bowType,
distance,
targetType,
groups,
arrows,
group_data: data.map((item) =>
item.map((i) => ({
...i,
ring: i.ring === "M" ? -1 : i.ring === "X" ? 0 : Number(i.ring),
}))
),
});
data = []
) => {
return request("POST", "/user/score/sheet/report", {
bowType,
distance,
targetType,
groups,
arrows,
group_data: data.map((item) =>
item.map((i) => ({
...i,
ring: i.ring === "M" ? -1 : i.ring === "X" ? 0 : Number(i.ring),
}))
),
});
};
export const getPointBookListAPI = async (
page = 1,
bowType,
distance,
targetType
page = 1,
bowType,
distance,
targetType
) => {
let url = `/user/score/sheet/list?pageNum=${page}&pageSize=10`;
if (bowType) url += `&bowType=${bowType}`;
if (distance) url += `&distance=${distance}`;
if (targetType) url += `&targetType=${targetType}`;
const result = await request("GET", url);
return result.list || [];
let url = `/user/score/sheet/list?pageNum=${page}&pageSize=10`;
if (bowType) url += `&bowType=${bowType}`;
if (distance) url += `&distance=${distance}`;
if (targetType) url += `&targetType=${targetType}`;
const result = await request("GET", url);
return result.list || [];
};
export const getPointBookDetailAPI = async (id) => {
return request("GET", `/user/score/sheet/detail?id=${id}`);
return request("GET", `/user/score/sheet/detail?id=${id}`);
};
export const getPointBookDataAPI = async () => {
return request("GET", "/user/score/sheet/statistics");
return request("GET", "/user/score/sheet/statistics");
};
export const getPractiseDataAPI = async () => {
return request("GET", "/user/practice/statistics");
return request("GET", "/user/practice/statistics");
};
export const getBattleDataAPI = async () => {
return request("GET", "/user/fight/statistics");
return request("GET", "/user/fight/statistics");
};
export const chooseTeamAPI = async (number, group) => {
return request("POST", "/user/room/group", { number, group });
return request("POST", "/user/room/group", {number, group});
};
export const getVIPDescAPI = async () => {
return request("GET", "/index/memberVipDescribe");
return request("GET", "/index/memberVipDescribe");
};
export const getPointBookStatisticsAPI = async () => {
return request("GET", `/v2/user/score/sheet/statistics`);
return request("GET", `/v2/user/score/sheet/statistics`);
};
export const donateAPI = async (amount, name, phone, organizer, advice) => {
return request("POST", `/user/donate`, {
amount,
name,
phone,
organizer,
advice,
});
return request("POST", `/user/donate`, {
amount,
name,
phone,
organizer,
advice,
});
};
export const laserAimAPI = async () => {
return request("POST", "/user/device/laserAim");
return request("POST", "/user/device/laserAim");
};
export const laserCloseAPI = async () => {
return request("POST", "/user/device/closeAim");
return request("POST", "/user/device/closeAim");
};
export const getDeviceBatteryAPI = async () => {
return request("GET", "/user/device/battery");
return request("GET", "/user/device/battery");
};
export const addNoteAPI = async (id, remark) => {
return request("POST", "/user/score/sheet/remark", { id, remark });
return request("POST", "/user/score/sheet/remark", {id, remark});
};
export const removePointRecord = async (id) => {
return request("DELETE", `/user/score/sheet/delete?id=${id}`);
return request("DELETE", `/user/score/sheet/delete?id=${id}`);
};
export const getPhoneNumberAPI = (data) => {
return request("POST", "/index/getPhone", data);
return request("POST", "/index/getPhone", data);
};
export const getPointBookRankListAPI = (page = 1) => {
return request(
"GET",
`/user/score/sheet/week/shoot/rank/list?pageNum=${page}&pageSize=100`
);
return request(
"GET",
`/user/score/sheet/week/shoot/rank/list?pageNum=${page}&pageSize=100`
);
};
export const clickLikeAPI = (userId, ifLike) => {
return request("POST", "/user/score/sheet/week/shoot/rank/like", {
userId,
ifLike,
});
return request("POST", "/user/score/sheet/week/shoot/rank/like", {
userId,
ifLike,
});
};
export const getMyLikeList = (page = 1, pageSize = 10) => {
return request(
"GET",
`/user/score/sheet/week/shoot/rank/like/list?pageNum=${page}&pageSize=${pageSize}`
);
return request(
"GET",
`/user/score/sheet/week/shoot/rank/like/list?pageNum=${page}&pageSize=${pageSize}`
);
};
export const getReadyAPI = (roomId) => {
return request("POST", `/user/room/ready`, {
roomId,
});
return request("POST", `/user/room/ready`, {
roomId,
});
};
export const getBattleAPI = async (battleId) => {
return request("POST", "/user/match/info", {
id: battleId,
});
return request("POST", "/user/match/info", {
id: battleId,
});
};
export const kickPlayerAPI = (number, userId) => {
return request("POST", "/user/room/kicking", {
number,
userId,
});
return request("POST", "/user/room/kicking", {
number,
userId,
});
};
// 获取赛季列表
export const getSeasonList = () => {
return request("GET", "/index/season/list");
};
// 获取赛季统计
export const getSeasonStats = (seasonId) => {
const data = {};
if (seasonId !== undefined && seasonId !== null) data.seasonId = seasonId;
return request("GET", "/index/season/stats", data);
};
//获取积分榜
export const getScoreRankList = (seasonId, page, perPage) => {
return request("GET", "/index/score/rank/list", {
seasonId,
page,
perPage
});
};
// 获取10环排行榜
export const getTenRingRankList = (seasonId, page, perPage) => {
return request("GET", "/index/tenRing/rank/list", {
seasonId,
page,
perPage
});
};
// 获取MVP排行榜
export const getMvpRankList = (seasonId, page, perPage) => {
return request("GET", "/index/mvp/rank/list", {
seasonId,
page,
perPage
});
};
// 获取我的积分排名
export const getMyScoreRank = (seasonId) => {
const data = {};
if (seasonId !== undefined && seasonId !== null) data.seasonId = seasonId;
return request("GET", "/index/myScoreRank", data);
};
// 获取我的MVP排名
export const getMyMvpRank = (seasonId) => {
const data = {};
if (seasonId !== undefined && seasonId !== null) data.seasonId = seasonId;
return request("GET", "/index/myMvpRank", data);
};
// 获取我的10环排名
export const getMyTenRingRank = (seasonId) => {
const data = {};
if (seasonId !== undefined && seasonId !== null) data.seasonId = seasonId;
return request("GET", "/index/myTenRingRank", data);
};

View File

@@ -40,26 +40,26 @@ export const audioFils = {
未上靶:
"https://static.shelingxingqiu.com/attachment/2025-11-12/de6n45o3tsm1v4unam.mp3",
"1环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxin1aq7gxjih5l.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/1.mp3",
"2环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxin64tdgx2s4at.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/2.mp3",
"3环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxinlmf87vt8z65.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/3.mp3",
"4环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxinniv97sx0q9u.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/4.mp3",
"5环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxin7j01kknpb7k.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/5.mp3",
"6环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxin4syy1015rtq.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/6.mp3",
"7环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxin3iz3dvmjdai.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/7.mp3",
"8环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxinnjd42lhpfiw.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/8.mp3",
"9环":
"https://static.shelingxingqiu.com/attachment/2025-09-17/dcutxin69nj1xh7yfz.mp3",
"https://static.shelingxingqiu.com/shootaudio/v3/9.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/shootaudio/v3/10.mp3",
X环: "https://static.shelingxingqiu.com/shootaudio/v4/v4/X%E7%8E%AF.mp3",
向上调整:
"https://static.shelingxingqiu.com/attachment/2025-11-12/de6ellf5pfvu3l8dhr.mp3",
向右上调整:
@@ -80,6 +80,10 @@ export const audioFils = {
"https://static.shelingxingqiu.com/attachment/2025-11-13/de7kzzllq0futwynso.mp3",
练习开始:
"https://static.shelingxingqiu.com/attachment/2025-11-14/de88w0lmmt43nnfmoi.mp3",
射箭声音:
"https://static.shelingxingqiu.com/shootaudio/v4/v4/%E7%AE%AD%E9%A3%9E%E8%A1%8C.mp3",
命中:
"https://static.shelingxingqiu.com/shootaudio/%E5%91%BD%E4%B8%AD.mp3"
};
// 版本控制日志函数
@@ -358,6 +362,7 @@ class AudioManager {
}
this.allowPlayMap.set(key, false);
this.onAudioEnded(key);
uni.$emit('audioEnded', key);
});
audio.onStop(() => {

View File

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

View File

@@ -18,31 +18,31 @@ const props = defineProps({
<image
class="bg-image"
v-if="type === 0"
src="../static/app-bg.png"
src="https://static.shelingxingqiu.com/shootmini/static/app-bg.png"
mode="widthFix"
/>
<image
class="bg-image"
v-if="type === 1"
src="../static/app-bg2.png"
src="https://static.shelingxingqiu.com/shootmini/static/app-bg2.png"
mode="widthFix"
/>
<image
class="bg-image"
v-if="type === 2"
src="../static/app-bg3.png"
src="https://static.shelingxingqiu.com/shootmini/static/app-bg3.png"
:style="{ height: capsuleHeight + 50 + 'px' }"
/>
<image
class="bg-image"
v-if="type === 3"
src="../static/app-bg4.png"
src="https://static.shelingxingqiu.com/shootmini/static/app-bg4.png"
mode="widthFix"
/>
<image
class="bg-image"
v-if="type === 4"
src="../static/app-bg5.png"
src="https://static.shelingxingqiu.com/shootmini/static/app-bg5.png"
mode="widthFix"
/>
<image
@@ -51,6 +51,12 @@ const props = defineProps({
src="https://static.shelingxingqiu.com/attachment/2026-01-05/dfgf3b5kp459tfyn0f.png"
mode="widthFix"
/>
<image
class="bg-image"
v-if="type === 6"
src="https://static.shelingxingqiu.com/shootmini/static/rank/rank-bg.png"
mode="widthFix"
/>
<view class="bg-overlay" v-if="type === 0"></view>
</view>
</template>
@@ -67,7 +73,7 @@ const props = defineProps({
.bg-image {
width: 100%;
height: 100%;
/* height: 100%; */
}
.bg-overlay {

View File

@@ -73,35 +73,42 @@ defineProps({
<text class="player-name">{{ player.name }}</text>
</view>
<image
v-if="winner === 0"
v-if="winner === 2"
src="../static/winner-badge.png"
mode="widthFix"
class="right-winner-badge"
/>
</view>
</view>
<view
<!-- 大乱斗玩家列表scroll-view 作为横向滚动容器 -->
<!-- 小程序中 scroll-view 不支持直接 display:flex需内部 wrapper view 承载 flex 布局 -->
<!-- 仅当玩家 >5 内容溢出宽度时才阻止冒泡防止与外层 swiper 切换 tab 的手势冲突 -->
<scroll-view
v-if="players.length"
class="players-melee"
scroll-x
@touchmove="(e) => players.length > 5 && e.stopPropagation()"
:style="{ paddingTop: showHeader ? '15px' : '0' }"
>
<view
v-for="(player, index) in players"
:key="index"
:style="{
backgroundColor: meleeAvatarColors[index],
width: `${Math.max(100 / players.length, 18)}vw`,
}"
>
<Avatar
:src="player.avatar"
:rankLvl="showRank ? undefined : player.rankLvl"
:size="40"
:rank="showRank ? index + 1 : 0"
/>
<text class="player-name">{{ player.name }}</text>
<view class="players-melee-inner">
<view
v-for="(player, index) in players"
:key="index"
:style="{
backgroundColor: meleeAvatarColors[index],
width: `${Math.max(100 / players.length, 18)}vw`,
}"
>
<Avatar
:src="player.avatar"
:rankLvl="showRank ? undefined : player.rankLvl"
:size="40"
:rank="showRank ? index + 1 : 0"
/>
<text class="player-name">{{ player.name }}</text>
</view>
</view>
</view>
</scroll-view>
</view>
</template>
@@ -144,17 +151,21 @@ defineProps({
justify-content: center;
}
.players-melee {
display: flex;
height: 80px;
width: 100%;
overflow-x: auto;
}
.players-melee::-webkit-scrollbar {
width: 0;
height: 0;
color: transparent;
}
.players-melee > view {
/* 小程序 scroll-view 不支持直接 flex通过内层 wrapper 承载横向排列 */
.players-melee-inner {
display: flex;
height: 100%;
flex-wrap: nowrap;
}
.players-melee-inner > view {
display: flex;
flex-direction: column;
align-items: center;

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) }}</text>
<text>{{ arrows.reduce((a, b) => a + (b.ring || 0), 0) }}</text>
<text></text>
</view>
<ScorePanel
:completeEffect="false"
:rowCount="arrows.length === 12 ? 6 : 9"
:rowCount="total === 12 ? 6 : 9"
:total="total"
:arrows="arrows"
:margin="arrows.length === 12 ? 4 : 1"
:fontSize="arrows.length === 12 ? 25 : 22"
:margin="total === 12 ? 4 : 1"
:fontSize="total === 12 ? 25 : 22"
/>
</view>
</template>

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

View File

@@ -18,6 +18,7 @@ const props = defineProps({
});
const battleMode = ref(1);
const targetMode = ref(1);
const loading = ref(false);
const roomNumber = ref("");
@@ -35,13 +36,14 @@ const createRoom = debounce(async () => {
try {
const result = await createRoomAPI(
battleMode.value === 2 ? 2 : 1,
battleMode.value === 2 ? 10 : size
battleMode.value === 2 ? 10 : size,
targetMode.value*20,
);
if (result.number) {
props.onConfirm();
await joinRoomAPI(result.number);
uni.navigateTo({
url: "/pages/battle-room?roomNumber=" + result.number,
url: "/pages/battle-room?roomNumber=" + result.number + "&target=" + targetMode.value,
});
}
} catch (error) {
@@ -53,7 +55,11 @@ const createRoom = debounce(async () => {
</script>
<template>
<view class="container">
<image src="../static/choose-battle-mode.png" mode="widthFix" />
<view class="target-options-header">
<view class="target-options-header-line-left"></view>
<image class="target-options-header-title-img" src="../static/choose-battle-mode.png" mode="widthFix" />
<view class="target-options-header-line-right"></view>
</view>
<view class="create-options">
<view
:class="{ 'battle-btn': true, 'battle-choosen': battleMode === 1 }"
@@ -80,6 +86,25 @@ const createRoom = debounce(async () => {
<text>乱斗模式3-10</text>
</view>
</view>
<view class="target-options-header">
<view class="target-options-header-line-left"></view>
<view class="target-options-header-title">选择靶纸</view>
<view class="target-options-header-line-right"></view>
</view>
<view class="target-options">
<view
:class="{ 'battle-btn': true, 'battle-choosen': targetMode === 1 }"
@click="() => (targetMode = 1)"
>
<text>20厘米全环靶</text>
</view>
<view
:class="{ 'battle-btn': true, 'battle-choosen': targetMode === 2 }"
@click="() => (targetMode = 2)"
>
<text>40厘米全环靶</text>
</view>
</view>
<SButton :onClick="createRoom">创建房间</SButton>
</view>
</template>
@@ -91,6 +116,7 @@ const createRoom = debounce(async () => {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 44rpx;
}
.container > image:first-child {
width: 45%;
@@ -105,6 +131,50 @@ const createRoom = debounce(async () => {
justify-content: center;
margin-bottom: 15px;
}
.target-options-header{
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 24rpx;
}
.target-options-header-title-img{
width: 196rpx;
height: 40rpx;
}
.target-options-header-title{
width: 112rpx;
height: 40rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
font-size: 28rpx;
text-align: center;
font-style: normal;
text-transform: none;
color: #FFEFBA;
margin: 0 18rpx;
}
.target-options-header-line-left{
width: 214rpx;
height: 0rpx;
border-radius: 0rpx 0rpx 0rpx 0rpx;
border: 1rpx solid;
border-image: linear-gradient(90deg, rgba(133, 119, 96, 0), rgba(133, 119, 96, 1)) 1 1;
}
.target-options-header-line-right{
width: 214rpx;
height: 0rpx;
border-radius: 0rpx 0rpx 0rpx 0rpx;
border: 1rpx solid;
border-image: linear-gradient(90deg, rgba(133, 119, 96, 1), rgba(133, 119, 96, 0)) 1 1;
}
.target-options {
width: 100%;
padding: 0 10px;
display: flex;
gap: 12px;
justify-content: center;
margin-bottom: 15px;
}
.battle-btn {
width: 45%;
height: 55px;

View File

@@ -0,0 +1,55 @@
<script setup>
defineProps({
noBg: {
type: Boolean,
default: false,
}
});
</script>
<template>
<view class="container">
<image class="shooter2" src="https://static.shelingxingqiu.com/shootmini/static/shooter2.png" mode="widthFix" />
<view class="bg-box">
<image
class="bg"
v-if="!noBg"
src="https://static.shelingxingqiu.com/shootmini/static/long-bubble-border.png"
mode="widthFix"
/>
<slot />
</view>
</view>
</template>
<style scoped>
.container {
display: flex;
align-items: center;
padding: 0 26rpx 0 28rpx;
margin-bottom: 14rpx;
width: clac(100% - 54rpx);
}
.container .shooter2 {
display: block;
width: 133rpx;
height: 144rpx;
}
.container .bg-box {
color: #fff;
font-size: 28rpx;
position: relative;
flex: 1;
height: 128rpx;
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 { storeToRefs } from "pinia";
const store = useStore();
const { user } = storeToRefs(store);
const { user, game } = storeToRefs(store);
const currentPage = computed(() => {
const pages = getCurrentPages();
@@ -57,8 +57,10 @@ const signin = () => {
const loading = ref(false);
const pointBook = ref(null);
const showProgress = ref(false);
const heat = ref(0);
/** 房间号按钮动态定位样式position: fixed根据胶囊真实位置计算脱离 flex 流避免挤压标题) */
const battleRoomBtnStyle = ref({});
const updateLoading = (value) => {
loading.value = value;
};
@@ -79,8 +81,22 @@ onMounted(() => {
pointBook.value = uni.getStorageSync("last-point-book");
}
}
if (currentPage.route === "pages/team-battle") {
showProgress.value = true;
// 仅在对战房间页获取胶囊位置,按钮用 fixed 定位精确贴靠胶囊左侧(脱离 flex 流,不挤压标题)
if (currentPage.route === "pages/battle-room") {
try {
const menuButtonRect = uni.getMenuButtonBoundingClientRect();
const { windowWidth } = uni.getSystemInfoSync();
battleRoomBtnStyle.value = {
// 按钮右边缘距视口右侧 = 屏幕宽 - 胶囊左边缘 + 4px 安全间隙
right: (windowWidth - menuButtonRect.left + 4) + "px",
// 垂直位置与胶囊顶部对齐
top: menuButtonRect.top + "px",
// 高度与胶囊一致,视觉融合
height: menuButtonRect.height + "px",
};
} catch (e) {
// 获取失败时使用 CSS 兜底定位28vw + 4px 作为 right8px 作为 top
}
}
uni.$on("update-hot", updateHot);
});
@@ -169,9 +185,20 @@ onBeforeUnmount(() => {
}}</text
>
</view>
<view v-if="showProgress" class="battle-progress">
<view v-if="currentPage === 'pages/team-battle'" class="battle-progress">
<HeaderProgress />
</view>
<!-- 对战房间:整个胶囊为分享按钮,房号从 Store 读取fixed 定位紧靠系统胶囊左侧 -->
<button
v-if="currentPage === 'pages/battle-room' && game.roomNumber"
open-type="share"
hover-class="none"
class="battle-room-number"
:style="battleRoomBtnStyle"
>
<text class="battle-room-number__text">房号: {{ game.roomNumber }}</text>
<image src="../static/share2.png" mode="widthFix" class="battle-room-number__icon" />
</button>
</view>
</template>
@@ -259,4 +286,37 @@ onBeforeUnmount(() => {
margin: 0 20rpx;
max-width: 300rpx;
}
/* 对战房间整个胶囊作为分享按钮fixed 定位脱离 flex 流,紧贴系统胶囊左侧 */
.battle-room-number {
position: fixed;
/* 兜底定位JS 获取胶囊位置失败时生效):约 28vw 对应胶囊区域左边缘 */
right: calc(28vw + 4px);
top: 8px;
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;
padding: 0;
}
/* 重置 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>

View File

@@ -1,7 +1,7 @@
<script setup>
import { ref, watch, onMounted, onBeforeUnmount } from "vue";
import audioManager from "@/audioManager";
import { MESSAGETYPES, MESSAGETYPESV2 } from "@/constants";
import { MESSAGETYPESV2 } from "@/constants";
import { getDirectionText } from "@/util";
import useStore from "@/store";
@@ -33,8 +33,8 @@ watch(
newVal.includes("你")
? "轮到你了"
: newVal.includes("红队")
? "请红方射箭"
: "请蓝方射箭"
? "请红方射箭"
: "请蓝方射箭"
);
audioManager.play(key, false);
currentRoundEnded.value = false;
@@ -52,16 +52,16 @@ async function onReceiveMessage(message) {
const { type, mode, current, shootData } = message;
if (type === MESSAGETYPESV2.BattleStart) {
melee.value = Boolean(mode > 3);
totalShot.value = mode === 1 ? 3 : 2;
// 优先使用后端返回的 shootNumber降级则根据 mode 推算
totalShot.value = message.shootNumber ?? (mode === 1 ? 3 : 2);
currentRoundEnded.value = true;
audioManager.play("比赛开始");
}
if (type === MESSAGETYPESV2.BattleEnd) {
audioManager.play("比赛结束");
}
if (type === MESSAGETYPESV2.ShootResult) {
} else if (type === MESSAGETYPESV2.BattleEnd) {
audioManager.play("比赛结束", false);
} else if (type === MESSAGETYPESV2.ShootResult) {
if (melee.value && current.playerId !== user.value.id) return;
if (current.playerId === user.value.id) currentShot.value++;
// 从 indexMap 按当前用户 id 取已射箭数,由后端维护准确值,不在前端自增
if (current.playerId === user.value.id) currentShot.value = current.indexMap?.[user.value.id] ?? currentShot.value;
if (message.shootData) {
let key = [];
key.push(
@@ -73,11 +73,16 @@ async function onReceiveMessage(message) {
key.push(`${getDirectionText(shootData.angle)}调整`);
audioManager.play(key, false);
}
}
if (type === MESSAGETYPESV2.NewRound) {
} 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("射击无效");
}
}
@@ -89,22 +94,35 @@ const onUpdateTips = (newVal) => {
tips.value = newVal;
};
const onUpdateTotalShot = (newVal) => {
currentShot.value = newVal.currentShot;
totalShot.value = newVal.totalShot;
};
// 监听 Pinia store 中 totalShot 变化,用于比赛恢复时同步箭数(替代 uni.$emit 避免时序问题)
// 使用 immediate: true 确保组件创建时立即读取 store 当前值(解决重入时 totalShot 值不变 watch 不触发的问题)
watch(() => store.game.totalShot, (newVal) => {
if (newVal > 0) {
totalShot.value = newVal;
currentShot.value = store.game.currentShot;
}
}, { immediate: true });
// 监听 Pinia store 中 tips 变化,用于比赛恢复时同步提示文案(替代 uni.$emit 避免时序问题)
// 使用 immediate: true 确保组件创建时立即读取 store 当前值(解决 onShow 早于 onMounted 导致 uni.$emit 事件丢失的问题)
// 注意:使用 != null 而非 if(newVal),确保空字符串 "" 也能触发清空(避免重新开赛时旧文案残留)
watch(() => store.game.tips, (newVal) => {
if (newVal != null) {
tips.value = newVal;
}
}, { immediate: true });
onMounted(() => {
uni.$on("update-shot", onUpdateTotalShot);
uni.$on("update-tips", onUpdateTips);
uni.$on("socket-inbox", onReceiveMessage);
uni.$on("play-sound", playSound);
});
onBeforeUnmount(() => {
uni.$off("update-shot", onUpdateTotalShot);
uni.$off("socket-inbox", onReceiveMessage);
uni.$off("play-sound", playSound);
// 补充取消 update-tips 监听,防止页面重建时监听器叠加
uni.$off("update-tips", onUpdateTips);
if (timer.value) clearInterval(timer.value);
});
</script>
@@ -114,10 +132,7 @@ onBeforeUnmount(() => {
<text>{{ (tips || "").replace(/你/g, "").replace(/重回/g, "") }}</text>
<text v-if="totalShot > 0"> ({{ currentShot }}/{{ totalShot }}) </text>
<button v-if="!!tips" hover-class="none" @click="updateSound">
<image
:src="`../static/sound${sound ? '' : '-off'}-yellow.png`"
mode="widthFix"
/>
<image :src="`../static/sound${sound ? '' : '-off'}-yellow.png`" mode="widthFix" />
</button>
</view>
</template>
@@ -131,11 +146,13 @@ onBeforeUnmount(() => {
justify-content: center;
font-weight: 500;
}
.container > button:last-child {
.container>button:last-child {
width: 36px;
height: 36px;
}
.container > button:last-child > image {
.container>button:last-child>image {
width: 36px;
min-height: 36px;
}

View File

@@ -43,7 +43,7 @@ const rowCount = new Array(6).fill(0);
<view>
<view v-for="(_, index) in rowCount" :key="index">
<text>{{
scores[1] && scores[1][index] ? `${scores[0][index].ring}` : "-"
scores[1] && scores[1][index] ? `${scores[1][index].ring}` : "-"
}}</text>
</view>
</view>

View File

@@ -1,137 +0,0 @@
<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>

View File

@@ -88,6 +88,7 @@ watch(
transform: translateY(100%);
transition: all 0.3s ease;
position: relative;
background-color: #372E1D;
}
.modal-content > image:first-child {
width: 100%;

View File

@@ -56,16 +56,20 @@ onMounted(() => {
);
});
const validArrows = computed(() => {
return (props.result.details || []).filter(
(arrow) => arrow.x !== -30 && arrow.y !== -30
).length;
});
const getRing = (arrow) => {
if (arrow.ringX) return "X";
return arrow.ring ? arrow.ring + "环" : "-";
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(() => arrows.value.filter((a) => !!a.ring).length);
</script>
<template>
@@ -96,8 +100,8 @@ const getRing = (arrow) => {
</view>
<view :style="{ gridTemplateColumns: `repeat(${rowCount}, 1fr)` }">
<view v-for="(_, index) in new Array(total).fill(0)" :key="index">
{{ getRing(result.details[index])
}}<text v-if="getRing(result.details[index]) !== '-'"></text>
{{ getRing(arrows[index])
}}<text v-if="getRing(arrows[index]) !== '-'"></text>
</view>
</view>
<view>
@@ -160,7 +164,7 @@ const getRing = (arrow) => {
</view>
</ScreenHint>
<BowData
:total="result.details.length"
:total="arrows.length"
:arrows="result.details"
:show="showBowData"
:onClose="() => (showBowData = false)"

View File

@@ -53,6 +53,7 @@ const currentRoundEnded = ref(false);
const ended = ref(false);
const halfTime = ref(false);
const wait = ref(0);
const transitionStyle = ref("all 1s linear");
watch(
() => props.tips,
@@ -81,7 +82,19 @@ watch(
const resetTimer = (count) => {
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) {
timer.value = setInterval(() => {
if (remain.value === 0) {
@@ -126,7 +139,7 @@ async function onReceiveMessage(msg) {
halfTime.value = false;
audioManager.play("比赛开始");
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
audioManager.play("比赛结束");
audioManager.play("比赛结束", false);
} else if (msg.type === MESSAGETYPESV2.ShootResult) {
let arrow = {};
if (msg.details && Array.isArray(msg.details)) {
@@ -143,6 +156,12 @@ async function onReceiveMessage(msg) {
} else if (msg.type === MESSAGETYPESV2.HalfRest) {
halfTime.value = true;
audioManager.play("中场休息");
} else if (msg.type === MESSAGETYPESV2.InvalidShot) {
uni.showToast({
title: "距离不足,无效",
icon: "none",
});
audioManager.play("射击无效");
}
}
@@ -182,6 +201,7 @@ onBeforeUnmount(() => {
width: `${(remain / total) * 100}%`,
backgroundColor: barColor,
right: tips.includes('红队') ? 0 : 'unset',
transition: transitionStyle,
}"
/>
<text>剩余{{ remain }}</text>
@@ -236,7 +256,6 @@ onBeforeUnmount(() => {
height: 15px;
border-radius: 15px;
z-index: -1;
transition: all 1s linear;
}
.container > view:last-child > text {
font-size: 10px;

View File

@@ -1,6 +1,7 @@
<script setup>
import { ref, watch, onMounted, onBeforeUnmount } from "vue";
import { RoundGoldImages } from "@/constants";
import {ref, watch, onMounted, onBeforeUnmount} from "vue";
import {RoundGoldImages} from "@/constants";
const props = defineProps({
tips: {
type: String,
@@ -19,34 +20,87 @@ const props = defineProps({
const barColor = ref("");
const remain = ref(15);
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) => {
// if (Math.ceil(value) === remain.value || Math.floor(value) === remain.value)
// return;
if (value.stop) {
if (timer.value) clearInterval(timer.value);
return
}
// zeroThenResetToSomeoneShoot 到达时,若进度条仍在倒计时则先瞬间清零(约 150ms 停留)再显示下一玩家满值
// 若进度条已到 0loading 状态),直接切换满值
if (value.zeroThenReset) {
if (timer.value) clearInterval(timer.value);
const wasNonZero = remain.value > 0;
// 更新下一玩家颜色和方向(在清零和满值时均生效)
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%)";
transitionStyle.value = "none";
if (wasNonZero) {
// 瞬间清零,停留约 150ms 后切换为满值
remain.value = 0;
loading.value = true;
setTimeout(() => {
remain.value = value.value;
loading.value = false;
setTimeout(() => { transitionStyle.value = "all 1s linear"; }, 50);
}, 150);
} else {
// 已在底部,直接切换满值
remain.value = value.value;
loading.value = false;
setTimeout(() => { transitionStyle.value = "all 1s linear"; }, 50);
}
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) {
// 重置前先清除旧计时器,防止超时未射箭时旧 interval 残留,导致进度条震荡
if (timer.value) clearInterval(timer.value);
// 重置时瞬间跳满格,禁用 CSS 过渡避免从旧值「涨到满」的动画
transitionStyle.value = "none";
remain.value = value.value;
setTimeout(() => {
transitionStyle.value = "all 1s linear";
}, 50);
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;
}
// 启动前先清除旧计时器,防止多次 {stop:false} 事件叠加多个 interval
if (timer.value) clearInterval(timer.value);
remain.value = Math.round(value);
timer.value = setInterval(() => {
laoding.value = remain.value === 0;
loading.value = remain.value === 0;
if (remain.value > 0) remain.value--;
}, 1000);
};
watch(
() => props.tips,
(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);
() => props.tips,
(newVal) => {
},
{
immediate: true,
}
},
{
immediate: true,
}
);
onMounted(() => {
@@ -61,20 +115,21 @@ onBeforeUnmount(() => {
<template>
<view class="container">
<image :src="RoundGoldImages[props.currentRound]" mode="widthFix" />
<image :src="RoundGoldImages[props.currentRound]" mode="widthFix"/>
<view
:style="{
justifyContent: tips.includes('红队') ? 'flex-end' : 'flex-start',
:style="{
justifyContent: currentTeam==='red' ? 'flex-end' : 'flex-start',
}"
>
<view
:style="{
:style="{
width: `${(remain / total) * 100}%`,
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>
</view>
</view>
@@ -87,11 +142,13 @@ onBeforeUnmount(() => {
flex-direction: column;
align-items: center;
}
.container > image {
width: 380rpx;
height: 80rpx;
transform: translateY(18rpx);
}
.container > view:last-child {
width: 100%;
text-align: center;
@@ -103,11 +160,12 @@ onBeforeUnmount(() => {
display: flex;
align-items: center;
}
.container > view:last-child > view {
height: 24rpx;
border-radius: 15px;
transition: all 1s linear;
}
.container > view:last-child > text {
font-size: 18rpx;
color: #fff;

View File

@@ -86,29 +86,34 @@ const handleLogin = async () => {
icon: "none",
});
}
await doLogin();
};
async function doLogin() {
loading.value = true;
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 {
try {
const wxResult = await wxLogin();
const fileManager = uni.getFileSystemManager();
const avatarBase64 = fileManager.readFileSync(avatarUrl.value, "base64");
const base64Url = `data:image/png;base64,${avatarBase64}`;
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 data = await getDeviceBatteryAPI();
updateOnline(data.online);
} catch (error) {}
}
props.onClose();
} catch (error) {
console.log("login error", error);
} finally {
loading.value = false;
}
loading.value = false;
props.onClose();
};
const openServiceLink = () => {
@@ -133,6 +138,10 @@ const openPrivacyLink = () => {
onShow(() => {
loading.value = false;
agree.value = false;
phone.value = "";
avatarUrl.value = "";
nickName.value = "";
});
</script>

View File

@@ -0,0 +1,197 @@
<script setup>
import { ref, watch } from "vue";
import SButton from "@/components/SButton.vue";
const props = defineProps({
show: {
type: Boolean,
default: false,
},
onClose: {
type: Function,
default: () => {},
},
onConfirm: {
type: Function,
default: () => {},
},
});
const selectedTarget = ref(2);
const showContainer = ref(false);
const showContent = ref(false);
watch(
() => props.show,
(newValue) => {
if (newValue) {
showContainer.value = true;
setTimeout(() => {
showContent.value = true;
}, 100);
} else {
showContent.value = false;
setTimeout(() => {
showContainer.value = false;
}, 100);
}
},
{}
);
const handleConfirm = () => {
props.onConfirm(selectedTarget.value);
props.onClose();
};
</script>
<template>
<view
class="container"
v-if="showContainer"
:class="{ 'container-show': showContent }"
@click="onClose"
>
<view
class="modal-content"
:class="{ 'modal-show': showContent }"
@click.stop=""
>
<view class="header">
<view class="header-title">
<view class="header-title-line-left"></view>
<text>选择靶型</text>
<view class="header-title-line-right"></view>
</view>
<view class="close-btn" @click="onClose">
<image src="../static/close-yellow.png" mode="widthFix" />
</view>
</view>
<view class="target-options">
<view
:class="{ 'target-btn': true, 'target-choosen': selectedTarget === 1 }"
@click="() => (selectedTarget = 1)"
>
<text>20厘米全环靶</text>
</view>
<view style="width: 30rpx"></view>
<view
:class="{ 'target-btn': true, 'target-choosen': selectedTarget === 2 }"
@click="() => (selectedTarget = 2)"
>
<text>40厘米全环靶</text>
</view>
</view>
<SButton width="694rpx" :onClick="handleConfirm">确定</SButton>
</view>
</view>
</template>
<style scoped>
.container {
position: fixed;
top: 0;
left: 0;
background-color: #00000099;
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: center;
opacity: 0;
transition: all 0.3s ease;
z-index: 999;
}
.container-show {
opacity: 1;
}
.modal-content {
width: 100%;
transform: translateY(100%);
transition: all 0.3s ease;
background: url("https://static.shelingxingqiu.com/attachment/2025-12-04/dep11770wzxg6o2alo.png")
no-repeat center top;
background-size: 100% auto;
display: flex;
flex-direction: column;
align-items: center;
box-sizing: border-box;
padding-bottom: 68rpx;
padding-top: 44rpx;
}
.modal-show {
transform: translateY(0%);
}
.header {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
position: relative;
margin-bottom: 44rpx;
}
.header-title{
display: flex;
align-items: center;
justify-content: center;
}
.header-title text{
width: 196rpx;
height: 40rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
font-size: 28rpx;
text-align: center;
font-style: normal;
text-transform: none;
color: #FFEFBA;
}
.header-title-line-left{
width: 214rpx;
height: 0rpx;
border-radius: 0rpx 0rpx 0rpx 0rpx;
border: 1rpx solid;
border-image: linear-gradient(90deg, rgba(133, 119, 96, 1), rgba(133, 119, 96, 0)) 1 1;
}
.header-title-line-right{
width: 214rpx;
height: 0rpx;
border-radius: 0rpx 0rpx 0rpx 0rpx;
border: 1rpx solid;
border-image: linear-gradient(90deg, rgba(133, 119, 96, 1), rgba(133, 119, 96, 0)) 1 1;
}
.close-btn {
position: absolute;
right: 0;
top: -10px;
}
.close-btn > image {
width: 40px;
height: 40px;
}
.target-options {
width: 750rpx;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-bottom: 38rpx;
}
.target-btn {
width: 332rpx;
height: 92rpx;
text-align: center;
border-radius: 10px;
border: 2rpx solid #fff3;
box-sizing: border-box;
color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.target-choosen {
color: #fed847;
border: 4rpx solid #fed847;
}
</style>

View File

@@ -40,6 +40,7 @@ export const MESSAGETYPESV2 = {
HalfRest: 7,
TestDistance: 8,
MatchSuccess: 9,
InvalidShot: 10,
};
export const topThreeColors = ["#FFD947", "#D2D2D2", "#FFA515"];

View File

@@ -1,68 +1,70 @@
{
"name": "shoot-miniprograms",
"appid": "",
"description": "",
"versionName": "1.0.0",
"versionCode": "100",
"transformPx": false,
"uniStatistics": {
"enable": false
},
"app-plus": {
"bounce": "none",
"usingComponents": true,
"nvueStyleCompiler": "uni-app",
"compilerVersion": 3,
"splashscreen": {
"alwaysShowBeforeRender": true,
"waiting": true,
"autoclose": true,
"delay": 0
"name" : "shoot-miniprograms",
"appid" : "__UNI__B03E251",
"description" : "",
"versionName" : "1.0.0",
"versionCode" : "100",
"transformPx" : false,
"uniStatistics" : {
"enable" : false
},
"modules": {},
"distribute": {
"android": {
"permissions": [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
"ios": {},
"sdkConfigs": {}
"app-plus" : {
"bounce" : "none",
"usingComponents" : true,
"nvueStyleCompiler" : "uni-app",
"compilerVersion" : 3,
"splashscreen" : {
"alwaysShowBeforeRender" : true,
"waiting" : true,
"autoclose" : true,
"delay" : 0
},
"modules" : {},
"distribute" : {
"android" : {
"permissions" : [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
"ios" : {
"dSYMs" : false
},
"sdkConfigs" : {}
}
},
"h5" : {
"darkmode" : true,
"themeLocation" : "theme.json"
},
"quickapp" : {},
"mp-weixin" : {
"appid" : "wxa8f5989dcd45cc23",
"setting" : {
"urlCheck" : false,
"minified" : true,
"uglifyFileName" : true,
"useCompilerModule" : true,
"useIsolateContext" : true
},
"lazyCodeLoading" : "requiredComponents",
"usingComponents" : true,
"darkmode" : true,
"themeLocation" : "theme.json",
"permission" : {},
"requiredPrivateInfos" : [ "getLocation", "chooseLocation" ]
}
},
"h5": {
"darkmode": true,
"themeLocation": "theme.json"
},
"quickapp": {},
"mp-weixin": {
"appid": "wxa8f5989dcd45cc23",
"setting": {
"urlCheck": false,
"minified": true,
"uglifyFileName": true,
"useCompilerModule": true,
"useIsolateContext": true
},
"lazyCodeLoading": "requiredComponents",
"usingComponents": true,
"darkmode": true,
"themeLocation": "theme.json",
"permission": {},
"requiredPrivateInfos": ["getLocation", "chooseLocation"]
}
}

View File

@@ -39,6 +39,9 @@
{
"path": "pages/battle-result"
},
{
"path": "pages/friend-battle-result"
},
{
"path": "pages/point-book-edit"
},

View File

@@ -117,7 +117,7 @@ const checkBowData = () => {
}deg)`,
}"
>
<view v-if="data.mvp && data.mvp[0].totalRings">
<view v-if="data.mvp && data.mvp.totalRings">
<image src="../static/title-mvp.png" mode="widthFix" />
<text
>斩获<text
@@ -127,7 +127,7 @@ const checkBowData = () => {
margin: '0 3px',
fontWeight: '600',
}"
>{{ data.mvp[0].totalRings }}</text
>{{ data.mvp.totalRings }}</text
></text
>
</view>

View File

@@ -1,11 +1,12 @@
<script setup>
import { ref, onMounted, onBeforeUnmount } from "vue";
import { ref, onMounted, computed, onBeforeUnmount } from "vue";
import { onShow, 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 GuideTwo from "@/components/GuideTwo.vue";
import SButton from "@/components/SButton.vue";
import Avatar from "@/components/Avatar.vue";
import ScreenHint from "@/components/ScreenHint.vue";
import {
getRoomAPI,
destroyRoomAPI,
@@ -29,16 +30,52 @@ const players = ref([]);
const blueTeam = 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}对抗赛`;
});
/** 靶纸尺寸cm由 URL 参数或 API 返回的 targetType 字段填充 */
const targetSize = ref(0);
/**
* 根据 targetSize 动态生成靶纸尺寸文本,如"40cm"
* 数据未就绪时显示 "--";数据来源:创建者取 URL 参数 target加入者取 API 返回的 targetType
*/
const targetSizeLabel = computed(() =>
targetSize.value ? `${targetSize.value}cm` : '--'
);
const ready = ref(false);
const allReady = ref(false);
const timer = ref(null);
const goBattle = ref(false);
/**
* 从服务端刷新当前房间数据,更新成员列表、准备状态等信息
* 仅在 roomNumber 有效且房间未开始时执行
*/
async function refreshRoomData() {
if (!roomNumber.value) return;
const result = await getRoomAPI(roomNumber.value);
if (result.started) return;
room.value = result;
// 加入者通过 API 返回的 targetType 字段同步靶纸尺寸,并持久化到本地缓存
if (result.targetType) {
targetSize.value = result.targetType;
uni.setStorageSync(`targetSize_${roomNumber.value}`, result.targetType);
} else if (targetSize.value === 0) {
// API 无该字段时,从本地缓存兜底(如"返回房间"场景)
const stored = uni.getStorageSync(`targetSize_${roomNumber.value}`);
if (stored) targetSize.value = stored;
}
owner.value = {};
opponent.value = {};
const members = result.members || [];
@@ -184,27 +221,104 @@ const exitRoom = async () => {
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(() => {
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;
});
/**
* 根据对战类型和人数动态生成分享文案
* 1v1 / 默认 → "星球论箭,来一决高下敢否?"
* 2v2 → "2v2对抗赛是兄弟来助我一把!"
* 3v3 → "3v3对抗赛来了马上发车!"
* 乱斗 → "热血乱斗赛,敢来争锋?"
*/
const shareTitle = computed(() => {
const { battleType, count } = room.value;
if (battleType === 2) return '热血乱斗赛,敢来争锋?';
if (battleType === 1 && count === 4) return '2v2对抗赛是兄弟来助我一把!';
if (battleType === 1 && count === 6) return '3v3对抗赛来了马上发车!';
return '星球论箭,来一决高下敢否?';
});
onShareAppMessage(() => {
return {
title: "邀请您进入房间对战",
title: shareTitle.value,
path: "/pages/friend-battle?roomID=" + roomNumber.value,
imageUrl: "",
};
});
/**
* onShow 生命周期:页面显示时刷新房间数据
* 注uni-app 中 onShow 可能早于 onLoad 执行,此时 roomNumber 尚未赋值,
* refreshRoomData 会提前 return。
*/
onShow(() => {
goBattle.value = false;
refreshRoomData();
});
/**
* 页面加载时解析路由参数,初始化房间号
* - 存入本地 ref供页面内部逻辑使用
* - 同步到 Pinia Store供 Header 组件展示房号胶囊)
*/
onLoad(async (options) => {
if (options.roomNumber) roomNumber.value = options.roomNumber;
if (options.roomNumber) {
roomNumber.value = options.roomNumber;
store.updateRoomNumber(options.roomNumber);
}
// 创建者通过 URL 参数 target1→20cm2→40cm初始化靶纸尺寸并持久化到本地缓存
if (options.target) {
targetSize.value = parseInt(options.target) * 20;
uni.setStorageSync(`targetSize_${roomNumber.value}`, targetSize.value);
} else if (roomNumber.value) {
// "返回房间"等无 target 参数的场景:从本地缓存恢复(待 refreshRoomData 进一步覆盖)
const stored = uni.getStorageSync(`targetSize_${roomNumber.value}`);
if (stored) targetSize.value = stored;
}
});
/**
* 组件挂载后:保持屏幕常亮、注册 WebSocket 消息监听
* 房间号已通过 onLoad 同步到 StoreHeader 从 Store 直接读取,无需额外通知
*/
onMounted(() => {
uni.setKeepScreenOn({
keepScreenOn: true,
@@ -224,59 +338,36 @@ onBeforeUnmount(() => {
</script>
<template>
<Container :title="`好友约战 - ${roomNumber}`">
<Container :title="battleTitle">
<view class="standby-phase">
<Guide>
<GuideTwo>
<view class="battle-guide">
<view class="guide-tips">
<text>弓箭手们人都到齐了吗?</text>
<text v-if="room.battleType === 1">{{
`${room.count / 2}v${room.count / 2}比赛即将开始!`
}}</text>
<text v-if="room.battleType === 2">大乱斗即将开始! </text>
<text class="guide-tips__target">请使用{{ targetSizeLabel }}全环靶</text>
<text class="guide-tips__warn">如果实际靶纸与选择靶纸不同将导致射箭无效</text>
</view>
<button hover-class="none" open-type="share">邀请</button>
</view>
</Guide>
</GuideTwo>
<view v-if="room.battleType === 1 && room.count === 2" class="team-mode">
<image
src="https://static.shelingxingqiu.com/attachment/2025-08-05/dbua9nuf5fyeph7cxi.png"
mode="widthFix"
/>
<image src="https://static.shelingxingqiu.com/attachment/2025-08-05/dbua9nuf5fyeph7cxi.png" mode="widthFix" />
<view>
<view
v-if="owner.id"
class="player"
:style="{ transform: 'translateY(-60px)' }"
>
<view v-if="owner.id" class="player" :style="{ transform: 'translateY(-60px)' }">
<Avatar :src="owner.avatar" :size="60" />
<text>管理员</text>
<text>{{ owner.name }}</text>
</view>
<view
v-else
class="no-player"
:style="{ transform: 'translateY(-60px)' }"
>
<view v-else class="no-player" :style="{ transform: 'translateY(-60px)' }">
<image src="../static/question-mark.png" mode="widthFix" />
</view>
<image src="../static/versus.png" mode="widthFix" />
<view
v-if="opponent.id"
class="player"
:style="{ transform: 'translateY(60px)' }"
>
<view v-if="opponent.id" 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)"
>
<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>
</view>
@@ -287,31 +378,15 @@ onBeforeUnmount(() => {
</view>
<block v-if="room.battleType === 1 && room.count >= 4">
<view class="all-players">
<image
src="https://static.shelingxingqiu.com/attachment/2025-08-13/dc0x1p59iab6cvbhqc.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"
/>
<image src="https://static.shelingxingqiu.com/attachment/2025-08-13/dc0x1p59iab6cvbhqc.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 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' }"
>
<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>
</view>
@@ -319,16 +394,8 @@ onBeforeUnmount(() => {
</view>
<view class="choose-side">
<view>
<view
v-for="(item, index) in redTeam"
:key="index"
class="choose-side-left-item"
>
<button
hover-class="none"
v-if="item.id === user.id"
@click="chooseTeam(0)"
>
<view v-for="(item, index) in redTeam" :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" />
</button>
<text class="truncate">{{ item.name || "我要加入" }}</text>
@@ -342,11 +409,7 @@ onBeforeUnmount(() => {
</view>
</view>
<view>
<view
v-for="(item, index) in blueTeam"
:key="index"
class="choose-side-right-item"
>
<view v-for="(item, index) in blueTeam" :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>
@@ -355,35 +418,43 @@ onBeforeUnmount(() => {
<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)"
>
<button hover-class="none" v-if="item.id === user.id" @click="chooseTeam(0)">
<image src="../static/close-grey.png" mode="widthFix" />
</button>
</view>
</view>
</view>
</block>
<PlayerSeats
v-if="room.battleType === 2"
:total="room.count || 10"
:players="players"
:removePlayer="removePlayer"
/>
<PlayerSeats v-if="room.battleType === 2" :total="room.count || 10" :players="players"
:removePlayer="removePlayer" />
<view>
<SButton :disabled="ready" :onClick="getReady">{{
allReady.value
? "即将进入对局..."
: owner.id === user.id && (room.members || []).length > 2
? "开始对局"
: "我准备好了"
}}</SButton>
<text class="tips">所有人准备后自动开始游戏</text>
<SButton :disabled="!canClick" :onClick="getReady">
{{
allReady.value
? "即将进入对局..."
: owner.id === user.id
? "开始对局"
: "我准备好了"
}}
</SButton>
<text class="tips">所有人准备好后由房主点击开始</text>
</view>
</view>
</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>
<style scoped>
@@ -392,6 +463,7 @@ onBeforeUnmount(() => {
height: calc(100% - 40px);
overflow-x: hidden;
}
.tips {
color: #fff9;
width: 100%;
@@ -400,6 +472,7 @@ onBeforeUnmount(() => {
margin-top: 10px;
font-size: 12px;
}
.player-unknow {
width: 40px;
height: 40px;
@@ -411,25 +484,30 @@ onBeforeUnmount(() => {
justify-content: center;
background-color: #69686866;
}
.player-unknow > image {
.player-unknow>image {
width: 40%;
}
.team-mode {
width: calc(100vw - 30px);
height: 125vw;
margin: 15px;
margin: 0 15px 15px 15px;
}
.team-mode > image:first-child {
.team-mode>image:first-child {
position: absolute;
width: calc(100vw - 30px);
z-index: -1;
}
.team-mode > view {
.team-mode>view {
display: flex;
justify-content: center;
align-items: center;
height: 95%;
}
.player {
width: 70px;
display: flex;
@@ -441,14 +519,16 @@ onBeforeUnmount(() => {
font-size: 14px;
position: relative;
}
.player > image {
.player>image {
width: 70px;
height: 70px;
border-radius: 50%;
background-color: #ccc;
margin-bottom: 5px;
}
.player > text:nth-child(2) {
.player>text:nth-child(2) {
color: #000;
background-color: #fed847;
font-size: 16rpx;
@@ -458,21 +538,85 @@ onBeforeUnmount(() => {
margin-top: -16rpx;
position: relative;
}
.player > text:nth-child(3) {
.player>text:nth-child(3) {
margin-top: 6rpx;
}
.player > text {
.player>text {
max-width: 100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align: center;
}
.player .ready {
background-color: #2c261fb3 !important;
border: 1rpx solid #a3793f66 !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 {
width: 40rpx;
height: 40rpx;
@@ -485,13 +629,16 @@ onBeforeUnmount(() => {
top: 0;
right: 0;
}
.remove-player > image {
.remove-player>image {
width: 90%;
height: 90%;
}
.team-mode > view > image:nth-child(2) {
.team-mode>view>image:nth-child(2) {
width: 120px;
}
.no-player {
width: 70px;
height: 70px;
@@ -502,10 +649,12 @@ onBeforeUnmount(() => {
align-items: center;
transform: translateY(60px);
}
.no-player > image {
.no-player>image {
width: 20px;
margin-right: 2px;
}
.btns {
height: 100%;
display: flex;
@@ -513,12 +662,14 @@ onBeforeUnmount(() => {
align-items: center;
justify-content: center;
}
.battle-guide {
display: flex;
align-items: center;
justify-content: space-between;
}
.battle-guide > button:last-child {
.battle-guide>button:last-child {
color: #fed847;
border: 1px solid #fed847;
margin-right: 10px;
@@ -527,6 +678,7 @@ onBeforeUnmount(() => {
position: relative;
font-size: 28rpx;
}
.all-players {
position: relative;
display: flex;
@@ -534,68 +686,73 @@ onBeforeUnmount(() => {
align-items: center;
height: 83vw;
}
.all-players > image:first-child {
.all-players>image:first-child {
position: absolute;
width: 100%;
}
.all-players > image:nth-child(2) {
.all-players>image:nth-child(2) {
width: 25vw;
position: relative;
}
.all-players > view {
.all-players>view {
position: relative;
width: 42vw;
height: 42vw;
margin-top: 7vw;
}
.all-players > view > view {
.all-players>view>view {
position: absolute;
left: 50%;
top: 50%;
}
/* 4个头像 - 正方形排列 */
.all-players > view > view:nth-child(1):nth-last-child(4) {
transform: translate(-50%, -50%) rotate(-30deg) translateY(-21.5vw)
rotate(30deg);
.all-players>view>view:nth-child(1):nth-last-child(4) {
transform: translate(-50%, -50%) rotate(-30deg) translateY(-21.5vw) rotate(30deg);
}
.all-players > view > view:nth-child(2):nth-last-child(3) {
transform: translate(-50%, -50%) rotate(-120deg) translateY(-21.5vw)
rotate(120deg);
.all-players>view>view:nth-child(2):nth-last-child(3) {
transform: translate(-50%, -50%) rotate(-120deg) translateY(-21.5vw) rotate(120deg);
}
.all-players > view > view:nth-child(3):nth-last-child(2) {
transform: translate(-50%, -50%) rotate(-210deg) translateY(-21.5vw)
rotate(210deg);
.all-players>view>view:nth-child(3):nth-last-child(2) {
transform: translate(-50%, -50%) rotate(-210deg) translateY(-21.5vw) rotate(210deg);
}
.all-players > view > view:nth-child(4):nth-last-child(1) {
transform: translate(-50%, -50%) rotate(-300deg) translateY(-21.5vw)
rotate(300deg);
.all-players>view>view:nth-child(4):nth-last-child(1) {
transform: translate(-50%, -50%) rotate(-300deg) translateY(-21.5vw) rotate(300deg);
}
/* 6个头像 - 六边形排列 */
.all-players > view > view:nth-child(1):nth-last-child(6) {
transform: translate(-50%, -50%) rotate(-30deg) translateY(-21vw)
rotate(30deg);
.all-players>view>view:nth-child(1):nth-last-child(6) {
transform: translate(-50%, -50%) rotate(-30deg) translateY(-21vw) rotate(30deg);
}
.all-players > view > view:nth-child(2):nth-last-child(5) {
transform: translate(-50%, -50%) rotate(-90deg) translateY(-21vw)
rotate(90deg);
.all-players>view>view:nth-child(2):nth-last-child(5) {
transform: translate(-50%, -50%) rotate(-90deg) translateY(-21vw) rotate(90deg);
}
.all-players > view > view:nth-child(3):nth-last-child(4) {
transform: translate(-50%, -50%) rotate(-150deg) translateY(-21vw)
rotate(150deg);
.all-players>view>view:nth-child(3):nth-last-child(4) {
transform: translate(-50%, -50%) rotate(-150deg) translateY(-21vw) rotate(150deg);
}
.all-players > view > view:nth-child(4):nth-last-child(3) {
transform: translate(-50%, -50%) rotate(-210deg) translateY(-21vw)
rotate(210deg);
.all-players>view>view:nth-child(4):nth-last-child(3) {
transform: translate(-50%, -50%) rotate(-210deg) translateY(-21vw) rotate(210deg);
}
.all-players > view > view:nth-child(5):nth-last-child(2) {
transform: translate(-50%, -50%) rotate(-270deg) translateY(-21vw)
rotate(270deg);
.all-players>view>view:nth-child(5):nth-last-child(2) {
transform: translate(-50%, -50%) rotate(-270deg) translateY(-21vw) rotate(270deg);
}
.all-players > view > view:nth-child(6):nth-last-child(1) {
transform: translate(-50%, -50%) rotate(-330deg) translateY(-21vw)
rotate(330deg);
.all-players>view>view:nth-child(6):nth-last-child(1) {
transform: translate(-50%, -50%) rotate(-330deg) translateY(-21vw) rotate(330deg);
}
.all-players > view > view > text {
.all-players>view>view>text {
position: absolute;
background-color: #fed847;
font-size: 8px;
@@ -607,18 +764,23 @@ onBeforeUnmount(() => {
text-align: center;
color: #333;
}
.choose-side {
display: flex;
}
.choose-side > view {
.choose-side>view {
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%);
}
.choose-side > view:last-child > view {
.choose-side>view:last-child>view {
background: linear-gradient(270deg, rgba(13, 0, 74, 0) 0%, #172a86 100%);
}
.choose-side-left-item,
.choose-side-right-item {
display: flex;
@@ -630,33 +792,39 @@ onBeforeUnmount(() => {
margin: 10px 5px;
position: relative;
}
.choose-side-left-item {
justify-content: flex-end;
}
.choose-side-left-item > text,
.choose-side-right-item > text {
.choose-side-left-item>text,
.choose-side-right-item>text {
margin: 10px;
max-width: 100px;
font-size: 14px;
}
.choose-side-left-item > button:first-child,
.choose-side-right-item > button:last-child {
.choose-side-left-item>button:first-child,
.choose-side-right-item>button:last-child {
position: absolute;
top: 0;
}
.choose-side-left-item > button:first-child > image,
.choose-side-right-item > button:last-child > image {
.choose-side-left-item>button:first-child>image,
.choose-side-right-item>button:last-child>image {
width: 28px;
}
.choose-side-left-item > button:first-child {
.choose-side-left-item>button:first-child {
left: 0;
}
.choose-side-right-item > button:last-child {
.choose-side-right-item>button:last-child {
right: 0;
}
.choose-side-left-item > button:last-child,
.choose-side-right-item > button:first-child {
.choose-side-left-item>button:last-child,
.choose-side-right-item>button:first-child {
background-color: #fff;
border-radius: 50%;
width: 38px;
@@ -666,18 +834,21 @@ onBeforeUnmount(() => {
align-items: center;
margin-bottom: 14rpx;
}
.choose-side-left-item > button:last-child > image,
.choose-side-right-item > button:first-child > image {
.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 {
.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 {
.choose-side-left-item>view>text,
.choose-side-right-item>view>text {
font-size: 16rpx;
border-radius: 20rpx;
line-height: 26rpx;
@@ -688,4 +859,23 @@ onBeforeUnmount(() => {
border: 1rpx solid #a3793f66;
color: #fed847;
}
.guide-tips__target {
font-weight: 400;
font-size: 26rpx;
color: rgba(255, 217, 71, 0.8);
}
.guide-tips__warn {
font-weight: 400;
font-size: 22rpx;
color: rgba(255, 255, 255, 0.8);
margin-top: 6rpx;
}
.guide-tips {
display: flex;
flex-direction: column;
padding-left: 20rpx;
}
</style>

View File

@@ -5,15 +5,15 @@ import SButton from "@/components/SButton.vue";
import { capsuleHeight } from "@/util";
const images = [
"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",
"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",
];
const addBg = ref(false);
@@ -33,7 +33,7 @@ const onScrollView = (e) => {
>
<image
:style="{ opacity: addBg ? 1 : 0 }"
src="../static/app-bg.png"
src="https://static.shelingxingqiu.com/shootmini/static/app-bg.png"
mode="widthFix"
/>
<navigator open-type="navigateBack">

View File

@@ -129,7 +129,7 @@ const nextStep = async () => {
btnDisabled.value = true;
step.value = 2;
title.value = "-感知距离";
const result = await createPractiseAPI(total, 360);
const result = await createPractiseAPI(total, 120);
if (result) practiseId.value = result.id;
} else if (step.value === 2) {
showGuide.value = false;
@@ -166,7 +166,7 @@ const onClose = async () => {
start.value = false;
scores.value = [];
step.value = 3;
const result = await createPractiseAPI(total, 360);
const result = await createPractiseAPI(total, 120);
if (result) practiseId.value = result.id;
}
};

File diff suppressed because it is too large Load Diff

View File

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

View File

@@ -1,50 +1,60 @@
<script setup>
import { ref, onMounted } from "vue";
import { onShow, onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app";
import {onMounted, ref} from "vue";
import {onShareAppMessage, onShareTimeline, onShow} from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import AppFooter from "@/components/AppFooter.vue";
import AppBackground from "@/components/AppBackground.vue";
import UserHeader from "@/components/UserHeader.vue";
import Signin from "@/components/Signin.vue";
import BubbleTip from "@/components/BubbleTip.vue";
import {
checkUserBindAPI,
getAppConfig,
getRankListAPI,
getDeviceBatteryAPI,
getHomeData,
getMyDevicesAPI,
getDeviceBatteryAPI,
getScoreRankList,
silentLoginAPI,
} from "@/apis";
import { topThreeColors } from "@/constants";
import { canEenter } from "@/util";
import {topThreeColors} from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
import {storeToRefs} from "pinia";
const store = useStore();
const {
updateConfig,
updateUser,
updateDevice,
updateRank,
getLvlName,
getLvlNameByScore,
updateOnline,
} = store;
const { user, device, rankData, online, game } = storeToRefs(store);
const {user, device, online, game} = storeToRefs(store);
const showModal = ref(false);
const showGuide = ref(false);
const scoreRankList = ref([]);
// 提取积分榜接口返回的榜单数组,兼容数组和对象两种返回格式。
const getScoreRankData = (result) => {
if (Array.isArray(result)) return result;
if (Array.isArray(result?.list)) return result.list;
if (Array.isArray(result?.items)) return result.items;
return [];
};
const toPage = async (path) => {
if (!user.value.id) {
showModal.value = true;
return;
}
if (path === "/pages/first-try") {
// if (canEenter(user.value, device.value, online.value, path)) {
// await uni.$checkAudio();
// }
}
uni.navigateTo({ url: path });
// if (path === "/pages/first-try") {
// if (canEenter(user.value, device.value, online.value, path)) {
// await uni.$checkAudio();
// }
// }
uni.navigateTo({url: path});
};
const toRankListPage = () => {
@@ -54,19 +64,43 @@ const toRankListPage = () => {
};
onShow(async () => {
const token = uni.getStorageSync(
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
);
const env = uni.getAccountInfoSync().miniProgram.envVersion;
const token = uni.getStorageSync(`${env}_token`);
const promises = [getRankListAPI()];
if (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 = [getScoreRankList(undefined, 1, 10)];
if (token || user.value.id) {
promises.push(getHomeData());
}
const [rankList, homeData] = await Promise.all(promises);
console.log("排行数据", rankList);
updateRank(rankList);
console.log("积分榜数据", rankList);
scoreRankList.value = getScoreRankData(rankList).slice(0, 10);
if (homeData) {
console.log("首页数据:", homeData);
@@ -75,7 +109,6 @@ 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);
}
}
@@ -88,8 +121,8 @@ onShow(async () => {
const devices = await getMyDevicesAPI();
if (devices.bindings && devices.bindings.length) {
updateDevice(
devices.bindings[0].deviceId,
devices.bindings[0].deviceName
devices.bindings[0].deviceId,
devices.bindings[0].deviceName
);
const data = await getDeviceBatteryAPI();
updateOnline(data.online);
@@ -109,7 +142,7 @@ onShareAppMessage(() => {
title: "智能真弓:实时捕捉+毫秒级同步,弓箭选手全球竞技!", // 分享卡片的标题
path: "/pages/index", // 用户点击分享卡片后跳转的页面路径
imageUrl:
"https://static.shelingxingqiu.com/attachment/2025-09-12/dcqoz26q0268wxmzjg.png", // 分享卡片的配图,可以是本地或网络图片
"https://static.shelingxingqiu.com/attachment/2025-09-12/dcqoz26q0268wxmzjg.png", // 分享卡片的配图,可以是本地或网络图片
};
});
onShareTimeline(() => {
@@ -117,7 +150,7 @@ onShareTimeline(() => {
title: "智能真弓:实时捕捉+毫秒级同步,弓箭选手全球竞技!", // 分享到朋友圈的标题
query: "from=timeline", // 用户通过朋友圈点击后,在页面 onShow 的 options 中可以获取到的参数
imageUrl:
"https://static.shelingxingqiu.com/attachment/2025-09-12/dcqoz26q0268wxmzjg.png", // 分享到朋友圈的配图
"https://static.shelingxingqiu.com/attachment/2025-09-12/dcqoz26q0268wxmzjg.png", // 分享到朋友圈的配图
};
});
</script>
@@ -127,25 +160,25 @@ onShareTimeline(() => {
<view class="container">
<view class="top-theme">
<image
src="https://static.shelingxingqiu.com/attachment/2025-12-31/dfc9dxrq4xn7e6y2pp.png"
mode="widthFix"
src="https://static.shelingxingqiu.com/attachment/2025-12-31/dfc9dxrq4xn7e6y2pp.png"
mode="widthFix"
/>
</view>
<UserHeader showRank :onSignin="() => (showModal = true)" />
<UserHeader showRank :onSignin="() => (showModal = true)"/>
<view :style="{ padding: '12px 10px' }">
<view class="feature-grid">
<view class="bow-card">
<image
v-if="online"
src="https://static.shelingxingqiu.com/attachment/2025-08-07/dbvt1o6dvhr2rop3kn.webp"
mode="widthFix"
@click="() => toPage('/pages/my-device')"
v-if="online"
src="https://static.shelingxingqiu.com/attachment/2025-08-07/dbvt1o6dvhr2rop3kn.webp"
mode="widthFix"
@click="() => toPage('/pages/my-device')"
/>
<image
v-else
src="https://static.shelingxingqiu.com/attachment/2026-01-04/dffohwtk1gwh0xfa6h.png"
mode="widthFix"
@click="() => toPage('/pages/my-device')"
v-else
src="https://static.shelingxingqiu.com/attachment/2026-01-04/dffohwtk1gwh0xfa6h.png"
mode="widthFix"
@click="() => toPage('/pages/my-device')"
/>
<block v-if="user.id">
<text v-if="!device.deviceId">绑定我的智能弓</text>
@@ -153,9 +186,9 @@ onShareTimeline(() => {
<text v-else-if="online">设备在线</text>
</block>
<image
src="../static/first-try.png"
mode="widthFix"
@click="() => toPage('/pages/first-try')"
src="../static/first-try.png"
mode="widthFix"
@click="() => toPage('/pages/first-try')"
/>
<BubbleTip v-if="showGuide" :location="{ top: '60%', left: '47%' }">
<text>新人必刷</text>
@@ -164,66 +197,67 @@ onShareTimeline(() => {
</view>
<view class="play-card">
<view @click="() => toPage('/pages/practise')">
<image src="../static/my-practise.png" mode="widthFix" />
<image src="../static/my-practise.png" mode="widthFix"/>
</view>
<view @click="() => toPage('/pages/friend-battle')">
<image src="../static/friend-battle.png" mode="widthFix" />
<image src="../static/friend-battle.png" mode="widthFix"/>
</view>
</view>
</view>
<view class="ranking-section">
<image
src="https://static.shelingxingqiu.com/attachment/2025-09-25/dd1p9ci9v7frcrsxhj.png"
mode="widthFix"
src="https://static.shelingxingqiu.com/attachment/2025-09-25/dd1p9ci9v7frcrsxhj.png"
mode="widthFix"
/>
<button
class="into-btn"
@click="() => toPage('/pages/ranking')"
hover-class="none"
class="into-btn"
@click="() => toPage('/pages/ranking')"
hover-class="none"
></button>
<view class="ranking-players" @click="toRankListPage">
<img src="../static/juezhanbang.png" mode="widthFix" />
<img src="../static/juezhanbang.png" mode="widthFix"/>
<view class="divide-line"></view>
<view class="player-avatars">
<view
v-for="i in 6"
:key="i"
class="player-avatar"
:style="{
v-for="i in 6"
:key="i"
class="player-avatar"
:style="{
zIndex: 8 - i,
borderColor: rankData.rank[i - 1]
borderColor: scoreRankList[i - 1]
? topThreeColors[i - 1] || '#000'
: '#000',
}"
>
<image v-if="i === 1" src="../static/champ1.png" />
<image v-if="i === 2" src="../static/champ2.png" />
<image v-if="i === 3" src="../static/champ3.png" />
<image v-if="i === 1" src="../static/champ1.png"/>
<image v-if="i === 2" src="../static/champ2.png"/>
<image v-if="i === 3" src="../static/champ3.png"/>
<view v-if="i > 3">{{ i }}</view>
<image
:src="
rankData.rank[i - 1]
? rankData.rank[i - 1].avatar
:src="
scoreRankList[i - 1]
? (scoreRankList[i - 1].avatar || '../static/user-icon.png')
: '../static/user-icon-dark.png'
"
mode="aspectFill"
mode="aspectFill"
/>
</view>
<view class="more-players">
<text>{{ rankData.rank.length }}</text>
<text>{{ scoreRankList.length }}</text>
</view>
</view>
</view>
<view class="my-data">
<view @click="() => toPage('/pages/my-growth')">
<image src="../static/my-growth.png" mode="widthFix" />
<image src="../static/my-growth.png" mode="widthFix"/>
</view>
<view @click="() => toPage('/pages/ranking')">
<view>
<text>段位</text>
<text>{{
user.rankLvl ? getLvlName(user.rankLvl) : "暂无"
}}</text>
user.lvlName || "暂无"
}}
</text>
</view>
<view>
<text>赛季平均环数</text>
@@ -232,18 +266,19 @@ onShareTimeline(() => {
<view>
<text>赛季胜率</text>
<text>{{
user.avg_win
? Number((user.avg_win * 100).toFixed(2)) + "%"
: "暂无"
}}</text>
user.avg_win
? Number((user.avg_win * 100).toFixed(2)) + "%"
: "暂无"
}}
</text>
</view>
</view>
</view>
</view>
</view>
<Signin :show="showModal" :onClose="() => (showModal = false)" />
<Signin :show="showModal" :onClose="() => (showModal = false)"/>
</view>
<AppFooter />
<AppFooter/>
</Container>
</template>
@@ -364,6 +399,7 @@ onShareTimeline(() => {
width: 32rpx;
height: 32rpx;
}
.player-avatar > view:first-child {
border-radius: 50%;
background: #777777;
@@ -374,6 +410,7 @@ onShareTimeline(() => {
height: 18px;
color: #fff;
}
.player-avatar > image:last-child {
width: 100%;
height: 100%;
@@ -392,18 +429,22 @@ onShareTimeline(() => {
margin-left: 2px;
color: #fff;
}
.my-data {
display: flex;
margin-top: 20px;
justify-content: space-between;
}
.my-data > view:first-child {
width: 28%;
}
.my-data > view:first-child > image {
width: 100%;
transform: translateX(-8px);
}
.my-data > view:nth-child(2) {
width: 68%;
font-size: 12px;
@@ -411,9 +452,11 @@ onShareTimeline(() => {
display: flex;
justify-content: space-between;
}
.my-data > view:nth-child(2) > view:nth-child(2) {
width: 38%;
}
.my-data > view:nth-child(2) > view {
width: 28%;
border-radius: 10px;
@@ -423,11 +466,13 @@ onShareTimeline(() => {
align-items: center;
justify-content: center;
}
.my-data > view:nth-child(2) > view > text:last-child {
color: #fff;
line-height: 25px;
font-weight: 500;
}
.top-theme {
position: absolute;
display: flex;
@@ -437,6 +482,7 @@ onShareTimeline(() => {
height: 60px;
z-index: -1;
}
.top-theme > image {
width: 300rpx;
transform: translate(-4%, -14%);

View File

@@ -16,29 +16,51 @@ const players = ref([]);
onLoad(async (options) => {
if (!options.battleId) return;
battleId.value = options.battleId || "60143330377469952";
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 plist = result.teams[0] ? result.teams[0].players : [];
// 以 id 为 key 建立 teams 玩家快速查找表
const teamPlayerMap = {};
plist.forEach((p) => { teamPlayerMap[p.id] = p; });
// 处理有成绩的玩家resultList 顺序即排名顺序)
const rankedPlayers = (result.resultList || []).map((item, index) => {
const playerId = item.userId || item.id;
const p = teamPlayerMap[playerId] || item;
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;
result.rounds.forEach((r, rIndex) => {
if (r.shoots[playerId]) {
r.shoots[playerId].forEach((s, sIndex) => {
arrows[sIndex + rIndex * 6] = s;
});
}
});
return {
...item,
id: playerId,
rank: index + 1,
name: p.name,
avatar: p.avatar || "",
name: (p && p.name) || item.name,
avatar: (p && p.avatar) || item.avatar || "",
arrows,
};
});
// 追加未出现在 resultList 中的玩家未射箭rank=0 隐藏角标
const rankedIds = new Set(rankedPlayers.map((p) => p.id));
const unrankedPlayers = plist
.filter((p) => !rankedIds.has(p.id))
.map((p) => ({
id: p.id,
name: p.name,
avatar: p.avatar || "",
arrows: [],
totalScore: 0,
rank: 0,
}));
players.value = [...rankedPlayers, ...unrankedPlayers];
}
});
@@ -59,13 +81,14 @@ const checkBowData = (selected) => {
<Container title="详情">
<view class="container">
<BattleHeader
v-if="data.mode <= 3"
:winner="data.winTeam"
:blueTeam="data.teams[1] ? data.teams[1].players : []"
:redTeam="data.teams[2] ? data.teams[2].players : []"
:players="players"
/>
<view
v-if="data.mode >= 3"
v-if="data.mode > 3"
class="score-header"
:style="{ border: 'none', padding: '5px 15px' }"
>
@@ -76,14 +99,14 @@ const checkBowData = (selected) => {
</view>
</view>
<PlayerScore2
v-if="data.mode >= 3"
v-if="data.mode > 3"
v-for="(player, index) in players"
:key="index"
:name="player.name"
:avatar="player.avatar"
:arrows="player.arrows"
:totalScore="player.totalScore"
:rank="index + 1"
:rank="player.rank"
/>
<view
v-if="data.mode <= 3"
@@ -128,7 +151,7 @@ const checkBowData = (selected) => {
<text :style="{ color: team == 1 ? '#64BAFF' : '#FF6767' }">
{{ round.shoots[team].reduce((acc, cur) => acc + cur.ring, 0) }}
</text>
<text>得分 {{ round.scores[team].totalRing }}</text>
<text>得分 {{ round.scores[team].score }}</text>
</view>
</view>
</view>

View File

@@ -3,34 +3,110 @@ import { ref, onMounted, onBeforeUnmount } from "vue";
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
import Container from "@/components/Container.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, getBattleAPI } from "@/apis";
import { MESSAGETYPESV2 } from "@/constants";
const gameType = ref(0);
const teamSize = ref(0);
const onComplete = ref(null);
const matchSuccess = ref(false);
/** 匹配超时计时器,用于检测 WS 消息丢失或真正超时 */
const matchTimeoutTimer = ref(null);
/** 匹配超时阈值ms后端设置 15s 匹配,前端预留 5s 冗余 */
const MATCH_TIMEOUT_MS = 20 * 1000;
/** 清除超时计时器 */
const clearMatchTimeout = () => {
if (matchTimeoutTimer.value) {
clearTimeout(matchTimeoutTimer.value);
matchTimeoutTimer.value = null;
}
};
/**
* 超时处理:查询后端是否已分配对局
* - 有对局 → WS 消息丢失场景,自动跳入
* - 无对局 → 真正超时,提示用户并返回大厅
*/
const handleMatchTimeout = async () => {
try {
const battle = await getBattleAPI();
if (battle && battle.matchId) {
uni.showToast({ title: "匹配成功,正在进入...", icon: "none" });
if (battle.mode <= 3) {
uni.redirectTo({ url: `/pages/team-battle?battleId=${battle.matchId}` });
} else {
uni.redirectTo({ url: `/pages/melee-battle?battleId=${battle.matchId}` });
}
} else {
uni.showToast({ title: "匹配超时,请重试", icon: "none" });
try {
if (gameType.value && teamSize.value) {
await matchGameAPI(false, gameType.value, teamSize.value);
}
} catch (_) { /* 取消失败忽略 */ }
uni.navigateBack();
}
} catch (e) {
uni.showToast({ title: "匹配超时,请重试", icon: "none" });
uni.navigateBack();
}
};
async function stopMatch() {
uni.$showHint(3);
}
/**
* 取消匹配,带容错处理:
* - 取消成功 → 返回大厅
* - 取消失败(后端已分配对局但 WS 未到达)→ 查询并跳入当前对局
*/
async function cancelMatch() {
clearMatchTimeout();
try {
if (gameType.value && teamSize.value) {
await matchGameAPI(false, gameType.value, teamSize.value);
}
uni.navigateBack();
} catch (e) {
// 取消匹配接口失败,尝试查询是否已被分配对局
try {
const battle = await getBattleAPI();
if (battle && battle.matchId) {
if (battle.mode <= 3) {
uni.redirectTo({ url: `/pages/team-battle?battleId=${battle.matchId}` });
} else {
uni.redirectTo({ url: `/pages/melee-battle?battleId=${battle.matchId}` });
}
} else {
uni.navigateBack();
}
} catch (_) {
uni.navigateBack();
}
}
}
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`,
});
}
};
onComplete.value = () => {}
}
if (msg.type === MESSAGETYPESV2.AboutToStart) {
// 收到开始消息,清除超时计时器
clearMatchTimeout();
// 使用后端下发的 mode 字段判断跳转目标与好友约战battle-room.vue保持一致
// mode <= 3 为团队对抗mode > 3 为大乱斗,覆盖全部 gameType1~5不再遗漏
if (msg.mode <= 3) {
uni.redirectTo({
url: `/pages/team-battle?battleId=${msg.id}`,
});
} else {
uni.redirectTo({
url: `/pages/melee-battle?battleId=${msg.id}`,
});
}
}
}
@@ -46,28 +122,29 @@ onMounted(() => {
keepScreenOn: true,
});
uni.$on("socket-inbox", onReceiveMessage);
uni.$on("cancelMatching", cancelMatch);
});
onBeforeUnmount(() => {
clearMatchTimeout();
uni.setKeepScreenOn({
keepScreenOn: false,
});
uni.$off("socket-inbox", onReceiveMessage);
if (gameType.value && teamSize.value && !matchSuccess.value) {
matchGameAPI(false, gameType.value, teamSize.value);
}
uni.$off("cancelMatching", cancelMatch);
});
onShow(async () => {
if (gameType.value && teamSize.value) {
matchGameAPI(true, gameType.value, teamSize.value);
// 启动超时计时器,防止 WS 消息丢失或长时间无对手导致用户卡死
clearMatchTimeout();
matchTimeoutTimer.value = setTimeout(handleMatchTimeout, MATCH_TIMEOUT_MS);
}
});
onHide(() => {
if (gameType.value && teamSize.value && !matchSuccess.value) {
matchGameAPI(false, gameType.value, teamSize.value);
}
});
</script>

View File

@@ -1,5 +1,5 @@
<script setup>
import { ref, onMounted, onBeforeUnmount } from "vue";
import { ref, onMounted, onBeforeUnmount, watch } from "vue";
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import BowTarget from "@/components/BowTarget.vue";
@@ -10,17 +10,19 @@ 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 SModal from "@/components/SModal.vue";
import audioManager from "@/audioManager";
import { getBattleAPI, laserCloseAPI } from "@/apis";
import { isGameEnded } from "@/util";
import { MESSAGETYPESV2 } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const store = useStore();
const { user } = storeToRefs(store);
const { user, online } = storeToRefs(store);
const title = ref("");
const start = ref(null);
const battleId = ref("");
/** 对战模式1=好友约战 2=排位赛,用于结算页跳转判断 */
const way = ref(0);
const currentRound = ref(1);
const tips = ref("即将开始...");
const players = ref([]);
@@ -28,55 +30,83 @@ const playersSorted = ref([]);
const playersScores = ref([]);
const halfTimeTip = ref(false);
const halfRest = ref(false);
/** 控制设备离线提示弹窗的显示状态 */
const showOfflineModal = ref(false);
/**
* 监听设备在线状态,大乱斗比赛进行中设备离线时弹窗提示用户
*/
watch(online, (newVal, oldVal) => {
if (!newVal && oldVal && start.value === true) {
showOfflineModal.value = true;
}
});
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);
if (!battleInfo) return;
try {
if (battleInfo.way === 1) title.value = "好友约战 - 大乱斗";
if (battleInfo.way === 2) title.value = "排位赛 - 大乱斗";
// 保存 way 供结算跳转时使用
way.value = battleInfo.way ?? 0;
// 优先使用接口数据,否则使用缓存
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 = [];
}
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);
start.value = battleInfo.status !== 0;
if (battleInfo.status === 0) {
const readyRemain = (Date.now() - (battleInfo.createTime || Date.now())) / 1000;
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 || Date.now())) / 1000;
console.log(`当前轮已进行${remain}`);
if (remain > 0 && remain < 90) {
setTimeout(() => {
uni.$emit("update-remain", 90 - remain - 0.2);
}, 200);
}
}
} catch (err) {
console.error("recoverData error:", err);
}
}
@@ -103,9 +133,12 @@ async function onReceiveMessage(msg) {
halfRest.value = true;
tips.value = "准备下半场";
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
uni.redirectTo({
url: "/pages/battle-result?battleId=" + msg.matchId,
});
setTimeout(() => {
// 全部跳转到新结算页
uni.redirectTo({
url: "/pages/friend-battle-result?battleId=" + msg.matchId,
});
}, 1000);
}
}
onMounted(async () => {
@@ -126,6 +159,7 @@ onBeforeUnmount(() => {
onShow(async () => {
if (battleId.value) {
const result = await getBattleAPI(battleId.value);
if (!result) return;
if (result.status === 2) {
uni.showToast({
title: "比赛已结束",
@@ -179,13 +213,25 @@ onShow(async () => {
<ScreenHint
:show="halfTimeTip"
mode="small"
:onClose="() => (halfTimeTip = false)"
>
<view class="half-time-tip">
<text>上半场结束休息一下吧:</text>
<text>20秒后开始下半场</text>
</view>
</ScreenHint>
<!-- 设备离线提示弹窗 -->
<SModal
:show="showOfflineModal"
:noBg="true"
height="360rpx"
:onClose="() => (showOfflineModal = false)"
>
<view class="offline-modal">
<text class="offline-title">设备已离线</text>
<text class="offline-desc">检测到设备已断开连接请检查设备后继续比赛</text>
<SButton @click="showOfflineModal = false">我知道了</SButton>
</view>
</SModal>
</view>
</Container>
</template>
@@ -195,4 +241,25 @@ onShow(async () => {
width: 100%;
height: 100%;
}
.offline-modal {
display: flex;
flex-direction: column;
align-items: center;
padding: 60rpx 40rpx 40rpx;
gap: 24rpx;
}
.offline-title {
font-size: 36rpx;
font-weight: bold;
color: #FED847;
}
.offline-desc {
font-size: 28rpx;
color: #CCCCCC;
text-align: center;
line-height: 1.6;
}
</style>

View File

@@ -14,11 +14,10 @@ const arrows = ref([]);
const total = ref(0);
onLoad(async (options) => {
if (options.id) {
const result = await getPractiseAPI(options.id);
arrows.value = result.arrows;
total.value = result.completed_arrows;
}
if (!options.id) return;
const result = await getPractiseAPI(options.id || 176);
arrows.value = result.details;
total.value = result.details.length;
});
</script>

View File

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

View File

@@ -1,5 +1,6 @@
<script setup>
import { onMounted } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import Avatar from "@/components/Avatar.vue";
import BowData from "@/components/BowData.vue";
@@ -17,7 +18,7 @@ const practiseList = ref([]);
const toMatchDetail = (id) => {
uni.navigateTo({
url: `/pages/match-detail?id=${id}`,
url: `/pages/match-detail?battleId=${id}`,
});
};
const getPractiseDetail = async (id) => {
@@ -52,6 +53,28 @@ const onPractiseLoading = async (page) => {
}
return result.length;
};
const getName = (battle) => {
if (battle.mode <= 3) return `${battle.mode}V${battle.mode}`;
// 排位赛大乱斗mode 数字与实际人数不一致,使用固定映射
if (battle.way === 2) {
if (battle.mode === 4) return "5人大乱斗";
if (battle.mode === 5) return "10人大乱斗";
}
// 好友约战大乱斗:从 teams[0].players 取实际参与人数动态展示
const count = battle.teams?.[0]?.players?.length;
return count ? `${count}人大乱斗` : "大乱斗";
};
/**
* 支持通过 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>
<template>
@@ -80,19 +103,19 @@ const onPractiseLoading = async (page) => {
<view
v-for="(item, index) in matchList"
:key="index"
@click="() => toMatchDetail(item.battleId)"
@click="() => toMatchDetail(item.id)"
>
<view class="contest-header">
<text>{{ item.name }}</text>
<text>{{ item.createdAt }}</text>
<text>{{ getName(item) }}</text>
<text>{{ item.createTime }}</text>
<image src="../static/back.png" mode="widthFix" />
</view>
<BattleHeader
:players="item.mode === 1 ? [] : item.players"
:blueTeam="item.bluePlayers"
:redTeam="item.redPlayers"
:winner="item.winner"
:showRank="item.mode === 2"
: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]"
:showHeader="false"
/>
</view>
@@ -103,19 +126,19 @@ const onPractiseLoading = async (page) => {
<view
v-for="(item, index) in battleList"
:key="index"
@click="() => toMatchDetail(item.battleId)"
@click="() => toMatchDetail(item.id)"
>
<view class="contest-header">
<text>{{ item.name }}</text>
<text>{{ item.createdAt }}</text>
<text>{{ getName(item) }}</text>
<text>{{ item.createTime }}</text>
<image src="../static/back.png" mode="widthFix" />
</view>
<BattleHeader
:players="item.mode === 1 ? [] : item.players"
:blueTeam="item.bluePlayers"
:redTeam="item.redPlayers"
:winner="item.winner"
:showRank="item.mode === 2"
: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]"
:showHeader="false"
/>
</view>
@@ -131,7 +154,7 @@ const onPractiseLoading = async (page) => {
>
<text
>{{ item.completed_arrows === 36 ? "耐力挑战" : "单组练习" }}
{{ item.createdAt }}</text
{{ item.createTime }}</text
>
<image src="../static/back.png" mode="widthFix" />
</view>

View File

@@ -107,7 +107,7 @@ const targetTypeName = computed(() => {
<template>
<view class="container" :style="{ paddingTop: paddingTop + 'px' }">
<image
src="../static/app-bg5.png"
src="https://static.shelingxingqiu.com/shootmini/static/app-bg5.png"
class="bg-image"
mode="aspectFill"
:style="{ height: paddingTop + 60 + 'px' }"

View File

@@ -1,6 +1,6 @@
<script setup>
import { ref, onMounted, onBeforeUnmount } from "vue";
import { onShow } from "@dcloudio/uni-app";
import { onLoad } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import ShootProgress from "@/components/ShootProgress.vue";
import BowTarget from "@/components/BowTarget.vue";
@@ -21,7 +21,7 @@ import {
} from "@/apis";
import { sharePractiseData } from "@/canvas";
import { wxShare, debounce } from "@/util";
import { MESSAGETYPESV2, MESSAGETYPES, roundsName } from "@/constants";
import { MESSAGETYPESV2, roundsName } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
@@ -31,15 +31,20 @@ 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 targetType = ref(1);
onLoad((options) => {
if (options.target) {
targetType.value = Number(options.target);
}
});
const onReady = async () => {
await startPractiseAPI();
currentRound.value = 0;
scores.value = [];
start.value = true;
audioManager.play("练习开始");
@@ -54,28 +59,8 @@ async function onReceiveMessage(msg) {
if (msg.type === MESSAGETYPESV2.ShootResult) {
scores.value = msg.details;
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
setTimeout(onOver, 1500);
// setTimeout(onOver, 1500);
}
// messages.forEach((msg) => {
// if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
// 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() {
@@ -89,8 +74,7 @@ async function onComplete() {
practiseResult.value = {};
start.value = false;
scores.value = [];
currentRound.value = 0;
const result = await createPractiseAPI(total, 360);
const result = await createPractiseAPI(total, 120);
if (result) practiseId.value = result.id;
}
}
@@ -100,6 +84,12 @@ const onClickShare = debounce(async () => {
await wxShare("shareCanvas");
});
function onAudioEnded(s) {
if (s.indexOf("比赛结束") >= 0) {
onOver()
}
}
onMounted(async () => {
// audioManager.play("第一轮");
uni.setKeepScreenOn({
@@ -107,7 +97,8 @@ onMounted(async () => {
});
uni.$on("socket-inbox", onReceiveMessage);
uni.$on("share-image", onClickShare);
const result = await createPractiseAPI(total, 120);
uni.$on("audioEnded", onAudioEnded);
const result = await createPractiseAPI(total, 120, targetType.value);
if (result) practiseId.value = result.id;
});
@@ -117,6 +108,7 @@ onBeforeUnmount(() => {
});
uni.$off("socket-inbox", onReceiveMessage);
uni.$off("share-image", onClickShare);
uni.$off("audioEnded", onAudioEnded);
audioManager.stopAll();
endPractiseAPI();
});
@@ -152,7 +144,7 @@ onBeforeUnmount(() => {
</view>
<BowTarget
:totalRound="start ? total / 4 : 0"
:currentRound="currentRound"
:currentRound="scores.length % 3"
:scores="scores"
/>
<ScorePanel2 :arrows="scores" />

View File

@@ -24,6 +24,7 @@ import { MESSAGETYPESV2 } from "@/constants";
import useStore from "@/store";
import { storeToRefs } from "pinia";
import {onLoad} from "@dcloudio/uni-app";
const store = useStore();
const { user } = storeToRefs(store);
@@ -33,6 +34,13 @@ const total = 36;
const practiseResult = ref({});
const practiseId = ref("");
const showGuide = ref(false);
const targetType = ref(1);
onLoad((options) => {
if (options.target) {
targetType.value = Number(options.target);
}
});
const onReady = async () => {
await startPractiseAPI();
@@ -97,7 +105,7 @@ onMounted(async () => {
});
uni.$on("socket-inbox", onReceiveMessage);
uni.$on("share-image", onClickShare);
const result = await createPractiseAPI(total, 360);
const result = await createPractiseAPI(total, 360, targetType.value);
if (result) practiseId.value = result.id;
});

View File

@@ -4,6 +4,7 @@ import { onShow } from "@dcloudio/uni-app";
import Container from "@/components/Container.vue";
import Guide from "@/components/Guide.vue";
import Avatar from "@/components/Avatar.vue";
import TargetPicker from "@/components/TargetPicker.vue";
import { getPractiseDataAPI } from "@/apis";
import { canEenter } from "@/util";
@@ -12,12 +13,20 @@ import { storeToRefs } from "pinia";
const store = useStore();
const { user, device, online } = storeToRefs(store);
const data = ref({});
const showTargetPicker = ref(false);
const pendingPractiseType = ref("");
const goPractise = async (type) => {
if (!canEenter(user.value, device.value, online.value)) return;
// await uni.$checkAudio();
pendingPractiseType.value = type;
showTargetPicker.value = true;
};
const handleTargetConfirm = (target) => {
showTargetPicker.value = false;
const type = pendingPractiseType.value;
uni.navigateTo({
url: `/pages/practise-${type}`,
url: `/pages/practise-${type}?target=${target}`,
});
};
@@ -88,6 +97,11 @@ onShow(async () => {
/>
</view>
</view>
<TargetPicker
:show="showTargetPicker"
:onClose="() => (showTargetPicker = false)"
:onConfirm="handleTargetConfirm"
/>
</Container>
</template>

View File

@@ -1,58 +1,333 @@
<script setup>
import { ref, onMounted } from "vue";
import { computed, nextTick, onMounted, ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import Avatar from "@/components/Avatar.vue";
import {
getMvpRankList,
getMyMvpRank,
getMyScoreRank,
getMyTenRingRank,
getScoreRankList,
getTenRingRankList,
} from "@/apis";
import { capsuleHeight } from "@/util";
import useStore from "@/store";
import { storeToRefs } from "pinia";
const PAGE_SIZE = 10;
const store = useStore();
const { user, rankData } = storeToRefs(store);
const { user } = storeToRefs(store);
const { getLvlName } = store;
const selectedIndex = ref(0);
const currentList = ref([]);
const myData = ref({});
const addBg = ref(false);
onMounted(async () => {
handleSelect(0);
const createRankState = () => ({
list: [],
page: 0,
pageSize: PAGE_SIZE,
loading: false,
noMore: false,
loaded: false,
scrollTop: 0,
myData: null,
myDataLoaded: false,
});
const handleSelect = (index) => {
selectedIndex.value = index;
myData.value = {};
currentList.value = [];
if (index === 0) {
currentList.value = rankData.value.rank;
} else if (index === 1) {
currentList.value = rankData.value.mvpRank;
} else if (index === 2) {
currentList.value = rankData.value.ringRank;
const rankTabs = [
{
key: "score",
title: "积分榜",
subTitle: "排位赛积分",
listApi: getScoreRankList,
myApi: getMyScoreRank,
},
{
key: "mvp",
title: "MVP榜",
subTitle: "MVP次数",
listApi: getMvpRankList,
myApi: getMyMvpRank,
},
{
key: "tenRing",
title: "十环榜",
subTitle: "十环次数",
listApi: getTenRingRankList,
myApi: getMyTenRingRank,
},
];
// 解析 ranking 页面传入的榜单参数,进入页面时默认选中对应 tab。
const getTabIndexByRouteParam = (tab) => {
if (tab === "mvp") return 1;
if (tab === "tenRing") return 2;
return 0;
};
const rankStates = ref({
score: createRankState(),
mvp: createRankState(),
tenRing: createRankState(),
});
const selectedIndex = ref(0);
const initialTabIndex = ref(0);
const pageMounted = ref(false);
const initializedFromRoute = ref(false);
const addBg = ref(false);
const currentScrollTop = ref(0);
const restoreScrollTop = ref(0);
const tabSwitchAnimating = ref(false);
const suppressScrollSync = ref(false);
const suppressLoadMore = ref(false);
const stickyTabsTop = capsuleHeight + 50;
const stickyTabsActive = ref(false);
const tabsStickyThreshold = ref(0);
const tabsStickyReady = ref(false);
const tabsHeight = ref(0);
const getTabConfig = (index = selectedIndex.value) => rankTabs[index];
const getTabKey = (index = selectedIndex.value) => getTabConfig(index).key;
// 统一提取榜单接口返回的列表数据,兼容数组和对象两种返回格式。
const getRankListFromResponse = (result) => {
if (Array.isArray(result)) return result;
if (Array.isArray(result?.list)) return result.list;
if (Array.isArray(result?.items)) return result.items;
return [];
};
// 为当前登录用户构造默认的个人榜单信息,避免接口未返回时底部区域缺数据。
const buildDefaultMyData = () => ({
rank: null,
userId: user.value.id,
name: user.value.nickName,
avatar: user.value.avatar,
totalScore: 0,
mvpCount: 0,
tenRings: 0,
totalGames: 0,
totalCount: 0,
rankName: user.value.lvlName,
rankLvl: user.value.rankLvl,
});
const currentTabKey = computed(() => getTabKey(selectedIndex.value));
const currentState = computed(() => rankStates.value[currentTabKey.value]);
const currentList = computed(() => currentState.value.list);
const currentSubTitle = computed(() => getTabConfig(selectedIndex.value).subTitle);
const currentMyData = computed(() => {
if (!user.value.id) return null;
return currentState.value.myData || buildDefaultMyData();
});
// 统一格式化段位和场次文案,兼容不同接口的字段命名。
const formatLevelText = (item = {}) => {
const levelName = item.rankName || getLvlName(item.rankLvl) || "暂无段位";
const totalGames = item.totalGames ?? item.TotalGames ?? 0;
return `${levelName}${totalGames}`;
};
// 统一读取榜单项的排名字段,没有后端 rank 时回退到前端序号。
const getDisplayRank = (item = {}, index = 0) => {
return item.rank ?? index + 1;
};
// 底部个人排名在未上榜时展示占位符,而不是空白。
const getDisplayMyRank = (item = {}) => {
return item.rank ?? "-";
};
const getScoreValue = (item = {}) => item.totalScore ?? 0;
const getMvpValue = (item = {}) => item.mvpCount ?? item.totalScore ?? 0;
const getTenRingValue = (item = {}) =>
item.tenRings ?? item.TenRings ?? item.totalScore ?? 0;
// 根据当前选中的榜单类型,读取对应的展示值。
const getRankValue = (item = {}, index = selectedIndex.value) => {
if (index === 0) return getScoreValue(item);
if (index === 1) return getMvpValue(item);
return getTenRingValue(item);
};
const getRankUnit = (index = selectedIndex.value) => {
if (index === 0) return "分";
return "次";
};
// 统一设置页面当前的视觉滚动状态,避免吸顶和顶部背景不同步。
const syncScrollVisualState = (scrollTop = 0) => {
currentScrollTop.value = scrollTop;
addBg.value = scrollTop > 100;
if (!tabsStickyReady.value) {
stickyTabsActive.value = false;
return;
}
if (user.value.id) {
currentList.value.some((item) => {
if (item.userId === user.value.id) {
myData.value = item;
return true;
}
return false;
});
if (!myData.value.userId) {
myData.value = {
userId: user.value.id,
TotalGames: 0,
totalScore: 0,
mvpCount: 0,
TenRings: 0,
};
stickyTabsActive.value = scrollTop >= tabsStickyThreshold.value;
};
// 只保留一条滚动恢复链路:从当前滚动位置平滑滚到目标位置,避免多套控制同时生效造成闪烁。
const applyScrollPosition = async (
fromScrollTop = currentScrollTop.value,
toScrollTop = 0,
withAnimation = false
) => {
tabSwitchAnimating.value = withAnimation;
restoreScrollTop.value = fromScrollTop;
await nextTick();
restoreScrollTop.value = toScrollTop;
syncScrollVisualState(toScrollTop);
};
// 请求指定榜单的某一页数据,只有当前榜单会追加分页,不影响其他榜单的浏览状态。
const loadRankPage = async (tabKey, { reset = false } = {}) => {
const state = rankStates.value[tabKey];
const config = rankTabs.find((item) => item.key === tabKey);
if (!config || state.loading) return;
if (!reset && state.noMore) return;
const nextPage = reset ? 1 : state.page + 1;
state.loading = true;
if (reset) state.noMore = false;
try {
const result = await config.listApi(undefined, nextPage, PAGE_SIZE);
const list = getRankListFromResponse(result);
state.list = reset ? list : state.list.concat(list);
state.page = nextPage;
state.loaded = true;
state.noMore = list.length < PAGE_SIZE;
} catch (error) {
if (reset) {
state.list = [];
state.page = 0;
state.loaded = false;
state.noMore = false;
}
uni.showToast({
title: "排行榜加载失败",
icon: "none",
});
console.error("load rank page error", error);
} finally {
state.loading = false;
}
};
const onScrollView = (e) => {
addBg.value = e.detail.scrollTop > 100;
// 每个榜单独立请求一次个人排名信息,切回该榜单时直接复用,避免打断浏览上下文。
const loadMyRankData = async (tabKey) => {
if (!user.value.id) return;
const state = rankStates.value[tabKey];
const config = rankTabs.find((item) => item.key === tabKey);
if (!config || state.myDataLoaded) return;
try {
const result = await config.myApi();
state.myData = {
...buildDefaultMyData(),
...(result || {}),
};
} catch (error) {
state.myData = buildDefaultMyData();
console.error("load my rank data error", error);
} finally {
state.myDataLoaded = true;
}
};
const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
// 首次进入或切换到未加载过的榜单时,初始化它的分页数据和个人横条数据。
const ensureTabReady = async (index = selectedIndex.value) => {
const tabKey = getTabKey(index);
const state = rankStates.value[tabKey];
if (!state.loaded) {
await loadRankPage(tabKey, { reset: true });
}
if (user.value.id && !state.myDataLoaded) {
await loadMyRankData(tabKey);
}
await nextTick();
return state.scrollTop || 0;
};
onLoad((options = {}) => {
initialTabIndex.value = getTabIndexByRouteParam(options.tab);
selectedIndex.value = initialTabIndex.value;
if (pageMounted.value && !initializedFromRoute.value) {
initializePage();
}
});
// 页面初始化同时兼容 onLoad 和 onMounted 的先后顺序,确保首屏一定落到路由指定的榜单。
const initializePage = async () => {
if (initializedFromRoute.value) return;
initializedFromRoute.value = true;
const nextScrollTop = await ensureTabReady(selectedIndex.value);
await applyScrollPosition(0, nextScrollTop, false);
setTimeout(() => {
measureTabsMetrics();
}, 0);
};
onMounted(async () => {
pageMounted.value = true;
await initializePage();
});
// 切换榜单时保留原榜单的列表和滚动位置,切回来后继续从之前的位置浏览。
const handleSelect = async (index) => {
if (index === selectedIndex.value) return;
const previousTabKey = currentTabKey.value;
rankStates.value[previousTabKey].scrollTop = currentScrollTop.value;
const previousScrollTop = currentScrollTop.value;
suppressScrollSync.value = true;
suppressLoadMore.value = true;
selectedIndex.value = index;
const nextScrollTop = await ensureTabReady(index);
await applyScrollPosition(previousScrollTop, nextScrollTop, false);
setTimeout(() => {
tabSwitchAnimating.value = false;
suppressScrollSync.value = false;
suppressLoadMore.value = false;
}, 220);
};
// 触底后只加载当前榜单的下一页数据,其他榜单的数据和页码保持不变。
const loadMore = async () => {
if (suppressLoadMore.value) return;
await loadRankPage(currentTabKey.value);
};
// 实时记录当前榜单的滚动位置,切换回来时恢复到上一次浏览位置。
const onScrollView = (e) => {
const scrollTop = e.detail.scrollTop || 0;
if (suppressScrollSync.value) return;
syncScrollVisualState(scrollTop);
rankStates.value[currentTabKey.value].scrollTop = scrollTop;
};
// 计算 tab 在滚动内容中的真实位置和高度,作为吸顶切换的唯一依据。
const measureTabsMetrics = () => {
const query = uni.createSelectorQuery();
query
.select("#rank-list-content-start")
.boundingClientRect()
.select(".rank-tabs-anchor")
.boundingClientRect()
.exec((res = []) => {
const [startRect, rect] = res;
if (!startRect || !rect) return;
const tabOffset = rect.top - startRect.top;
tabsStickyThreshold.value = Math.max(0, tabOffset - 92);
tabsHeight.value = rect.height || 0;
tabsStickyReady.value = true;
syncScrollVisualState(currentScrollTop.value);
});
};
</script>
<template>
@@ -65,7 +340,7 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
>
<image
:style="{ opacity: addBg ? 1 : 0 }"
src="../static/app-bg.png"
src="https://static.shelingxingqiu.com/shootmini/static/app-bg.png"
mode="widthFix"
/>
<navigator open-type="navigateBack">
@@ -75,18 +350,32 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
</view>
<scroll-view
scroll-y
:scroll-with-animation="tabSwitchAnimating"
:scroll-top="restoreScrollTop"
@scroll="onScrollView"
:style="{ height: myData.userId ? '90vh' : '100vh' }"
@scrolltolower="loadMore"
:style="{ height: user.id ? '90vh' : '100vh' }"
>
<view id="rank-list-content-start" class="content-start-anchor"></view>
<image
src="https://static.shelingxingqiu.com/attachment/2025-09-25/dd1p9b3wcrwnlnghiq.png"
mode="widthFix"
class="header-bg"
@load="measureTabsMetrics"
/>
<view class="rank-tabs">
<view
v-if="stickyTabsActive"
class="rank-tabs-placeholder"
:style="{ height: `${tabsHeight}px` }"
/>
<view
class="rank-tabs rank-tabs-anchor"
:class="{ 'rank-tabs-anchor-fixed': stickyTabsActive }"
:style="stickyTabsActive ? { top: `${stickyTabsTop}px` } : {}"
>
<view
v-for="(rankType, index) in ['积分榜', 'MVP榜', '十环榜']"
:key="index"
v-for="(rankType, index) in rankTabs"
:key="rankType.key"
:style="{
fontSize: index === selectedIndex ? '16px' : '14px',
color: index === selectedIndex ? '#000' : '#fff',
@@ -94,18 +383,18 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
}"
@tap="handleSelect(index)"
>
{{ rankType }}
{{ rankType.title }}
</view>
</view>
<view class="rank-list">
<view class="rank-list-header">
<text>排名</text>
<text>用户ID</text>
<text>{{ subTitles[selectedIndex] }}</text>
<text>{{ currentSubTitle }}</text>
</view>
<view
v-for="(item, index) in currentList"
:key="index"
:key="`${currentTabKey}-${index}-${item.userId || item.name}`"
class="rank-list-item"
:style="{
backgroundColor: index % 2 === 0 ? '#9898981f' : 'transparent',
@@ -147,65 +436,60 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
src="../static/champ3.png"
mode="widthFix"
/>
<view v-if="index > 2" class="view-crown">{{ index + 1 }}</view>
<view v-if="index > 2" class="view-crown">
{{ getDisplayRank(item, index) }}
</view>
<Avatar :src="item.avatar" />
<view class="rank-item-content">
<text class="truncate">{{ item.name }}</text>
<text>{{ getLvlName(item.rankLvl) }}{{ item.TotalGames }}</text>
<text>{{ formatLevelText(item) }}</text>
</view>
<text class="rank-item-integral" v-if="selectedIndex === 0">
<text class="rank-item-integral">
<text
:style="{ fontSize: '14px', color: '#fff', marginRight: '5px' }"
>{{ item.totalScore }} </text
>
</text>
<text class="rank-item-integral" v-if="selectedIndex === 1">
<text
:style="{ fontSize: '14px', color: '#fff', marginRight: '5px' }"
>{{ item.mvpCount }} </text
>
</text>
<text class="rank-item-integral" v-if="selectedIndex === 2">
<text
:style="{ fontSize: '14px', color: '#fff', marginRight: '5px' }"
>{{ item.TenRings }} </text
>
>
{{ getRankValue(item) }}
</text>
{{ getRankUnit() }}
</text>
</view>
<view v-if="!currentList.length" class="no-data">
<text>筹备中...</text>
<view
v-if="currentState.loading && !currentList.length"
class="no-data"
>
<text>加载中...</text>
</view>
<view
v-else-if="!currentState.loading && !currentList.length"
class="no-data"
>
<text>暂无数据</text>
</view>
<view v-else class="list-tip">
<text v-if="currentState.loading">加载中...</text>
<text v-else-if="currentState.noMore">没有更多了</text>
</view>
</view>
</scroll-view>
<view class="my-rank-data" v-if="myData.userId">
<view class="my-rank-data" v-if="currentMyData">
<image
src="https://static.shelingxingqiu.com/attachment/2025-08-05/dbuaf19pf7qd8ps0uh.png"
mode="widthFix"
/>
<text>{{ myData.rank }}</text>
<Avatar :src="user.avatar" />
<text>{{ getDisplayMyRank(currentMyData) }}</text>
<Avatar :src="currentMyData.avatar || user.avatar" />
<view class="rank-item-content">
<text class="truncate">{{ user.nickName }}</text>
<text>{{ user.lvlName }}{{ myData.TotalGames }}</text>
<text class="truncate">{{ currentMyData.name || user.nickName }}</text>
<text>{{ formatLevelText(currentMyData) }}</text>
</view>
<text class="rank-item-integral" v-if="selectedIndex === 0">
<text class="rank-item-integral">
<text
:style="{ fontSize: '14px', color: '#fff', marginRight: '5px' }"
>{{ myData.totalScore || 0 }}</text
></text
>
<text class="rank-item-integral" v-if="selectedIndex === 1">
<text
:style="{ fontSize: '14px', color: '#fff', marginRight: '5px' }"
>{{ myData.mvpCount || 0 }}</text
></text
>
<text class="rank-item-integral" v-if="selectedIndex === 2">
<text
:style="{ fontSize: '14px', color: '#fff', marginRight: '5px' }"
>{{ myData.TenRings || 0 }}</text
></text
>
>
{{ getRankValue(currentMyData) }}
</text>
{{ getRankUnit() }}
</text>
</view>
</view>
</template>
@@ -214,9 +498,16 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
.container {
width: 100%;
}
.content-start-anchor {
width: 100%;
height: 0;
}
.header-bg {
width: 100%;
}
.header {
width: 100%;
height: 50px;
@@ -227,6 +518,7 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
z-index: 10;
overflow: hidden;
}
.header-back {
width: 22px;
height: 22px;
@@ -234,6 +526,7 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
margin-top: 5px;
position: relative;
}
.header > image:first-child {
width: 100vw;
height: 100vh;
@@ -242,25 +535,40 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
left: 0;
transition: all 0.5s ease;
}
.header > text {
color: #fff;
font-weight: bold;
transition: all 0.5s ease;
position: relative;
}
.rank-tabs {
width: calc(100% - 20px);
display: flex;
justify-content: space-around;
padding: 0 10px;
margin-top: -15px;
padding: 20rpx 10px;
}
.rank-tabs > view {
width: 25%;
padding: 10px;
text-align: center;
border-radius: 20px;
}
.rank-tabs-placeholder {
width: 100%;
}
.rank-tabs-anchor-fixed {
position: fixed;
left: 0;
z-index: 11;
background: #000000;
backdrop-filter: blur(8px);
}
.rank-list {
display: flex;
flex-direction: column;
@@ -268,11 +576,12 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
width: calc(100% - 20px);
color: #fff9;
font-size: 12px;
margin: 10px;
margin: 0 10px 10px 10px;
border: 1px solid rgb(255 217 71 / 0.2);
border-radius: 10px;
background-color: #313131;
}
.rank-list > view {
display: flex;
align-items: center;
@@ -281,20 +590,25 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
overflow: hidden;
position: relative;
}
.rank-list-header {
width: calc(100% - 20px) !important;
padding: 10px;
}
.rank-list-header > text:nth-child(2) {
width: 14%;
}
.rank-list-header > text:last-child {
width: 30%;
text-align: right;
}
.rank-list-item {
padding: 10px 0;
}
.player-bg {
position: absolute;
width: 100%;
@@ -302,12 +616,14 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
top: 0;
left: 0;
}
.player-crown {
position: relative;
width: 27px;
height: 27px;
margin: 0 15px;
}
.view-crown {
width: 27px;
height: 27px;
@@ -319,6 +635,7 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
background-color: #676767;
position: relative;
}
.rank-item-content {
display: flex;
flex-direction: column;
@@ -328,17 +645,20 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
position: relative;
padding-left: 10px;
}
.rank-item-content > text:first-child {
color: #fff;
font-size: 14px;
margin-bottom: 3px;
width: 120px;
}
.rank-list-item > text:last-child {
margin-right: 10px;
width: 56px;
text-align: right;
}
.my-rank-data {
width: calc(100% - 30px);
padding: 15px;
@@ -352,12 +672,14 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
overflow: hidden;
border-radius: 10px;
}
.my-rank-data > image:first-child {
position: absolute;
width: 100%;
left: 0;
top: -5px;
}
.my-rank-data > text:nth-child(2) {
background-color: #c1a434;
position: relative;
@@ -369,20 +691,24 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
min-width: 15px;
text-align: center;
}
.my-rank-data > text:last-child {
position: relative;
margin-right: 10px;
width: 65px;
text-align: right;
}
.my-rank-data > .rank-item-content > text:first-child {
color: #fed847;
}
.my-rank-data > .rank-item-integral {
color: #fff9;
font-size: 12px;
margin-right: 0 !important;
}
.no-data {
width: 100%;
height: 400px;
@@ -392,4 +718,11 @@ const subTitles = ["排位赛积分", "MVP次数", "十环次数"];
color: #fff9;
font-size: 14px;
}
.list-tip {
justify-content: center !important;
color: #fff9;
font-size: 12px;
min-height: 60rpx;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -1,10 +1,9 @@
<script setup>
import { ref, onMounted, onBeforeUnmount, nextTick } from "vue";
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
import {ref, onMounted, onBeforeUnmount, nextTick, watch} from "vue";
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";
@@ -12,18 +11,21 @@ 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 { isGameEnded, formatTimestamp } from "@/util";
import { MESSAGETYPES, MESSAGETYPESV2, roundsName } from "@/constants";
import SModal from "@/components/SModal.vue";
import {laserCloseAPI, getBattleAPI} from "@/apis";
import {MESSAGETYPESV2} from "@/constants";
import audioManager from "@/audioManager";
import useStore from "@/store";
import { storeToRefs } from "pinia";
import {storeToRefs} from "pinia";
const store = useStore();
const { user } = storeToRefs(store);
const {user, online} = storeToRefs(store);
const start = ref(null);
const tips = ref("");
const battleId = ref("");
const currentRound = ref(0);
/** 专用于 RoundEndTip 展示的轮次,与进度条的 currentRound 解耦,避免 ToSomeoneShoot 提前更新 currentRound 导致 Tip 显示错误轮次 */
const roundTipRound = ref(0);
const goldenRound = ref(0);
const currentRedPoint = ref(0);
const currentBluePoint = ref(0);
@@ -37,16 +39,52 @@ const redPoints = ref(0);
const bluePoints = ref(0);
const showRoundTip = ref(false);
const isFinalShoot = ref(false);
const matchStatus = ref(undefined);
const updateRemainSecond = ref(0);
/** 当前对局每人射击时间(秒),从后端 shootTime 字段动态读取,默认 15 */
const shootTimeTotal = ref(15);
/** 对战来源类型1=好友约战2=匹配对战),用于结算页分流 */
const battleWay = ref(0);
/** 上一次处理的 ToSomeoneShoot 关键字段,用于去重过滤重复消息 */
const lastToSomeoneShootKey = ref("");
/** 控制设备离线提示弹窗的显示状态 */
const showOfflineModal = ref(false);
const recoverData = (battleInfo, { force = false, arrowOnly = false } = {}) => {
/**
* 监听设备在线状态,比赛进行中设备离线时弹窗提示用户
*/
watch(online, (newVal, oldVal) => {
if (!newVal && oldVal && start.value === true) {
showOfflineModal.value = true;
}
});
const recoverData = (battleInfo, {force = false, arrowOnly = false} = {}) => {
try {
battleId.value = battleInfo.matchId;
blueTeam.value = battleInfo.teams[1].players || [];
redTeam.value = battleInfo.teams[2].players || [];
// 存储对战来源,供结算跳转分流使用
if (battleInfo.way !== undefined) battleWay.value = battleInfo.way;
// 优先使用接口返回的队伍数据,如果没有则尝试从缓存读取(应对匹配刚完成接口未就绪的情况)
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;
if (battleInfo.status === 0) {
const readyRemain = (Date.now() - battleInfo.createTime) / 1000;
console.log(`对局已进行${readyRemain}`);
const readyRemain = (Date.now() - (battleInfo.createTime || Date.now())) / 1000;
if (readyRemain > 0 && readyRemain < 15) {
setTimeout(() => {
uni.$emit("update-timer", 15 - readyRemain - 0.2);
@@ -55,30 +93,64 @@ const recoverData = (battleInfo, { force = false, arrowOnly = false } = {}) => {
return;
}
if (!arrowOnly) {
// 在 ToSomeoneShoot 时同步更新当前轮次,使进度条轮次图片及时切换
currentRound.value = battleInfo.current.round || 1;
currentShooterId.value = battleInfo.current.playerId;
const redPlayer = battleInfo.teams[2].players.find(
(item) => item.id === battleInfo.current.playerId
(item) => item.id === battleInfo.current.playerId
);
let nextTips = redPlayer ? "请红队射箭" : "请蓝队射箭";
if (force) nextTips += "重回";
if (
battleInfo.current.playerId === user.value.id &&
redTeam.value.length > 1
battleInfo.current.playerId === user.value.id &&
redTeam.value.length > 1
) {
nextTips += "你";
}
// 同队连续出手时 tips 值不变HeaderProgress watch 不触发音频
// 需在赋值前比较旧值,手动播放音频确保始终触发 onAudioEnded 启动计时器
// 注意:使用 interrupt=false 避免打断上一支箭的环数播报音频
if (tips.value === nextTips && !nextTips.includes("重回")) {
const audioKey = redPlayer ? "请红方射箭" : "请蓝方射箭";
audioManager.play(audioKey, false);
}
tips.value = nextTips;
uni.$emit("update-tips", nextTips);
// 同步写入 Pinia store供 HeaderProgress 通过 immediate watch 在 onMounted 时立即读取
// 规避 WeChat 小程序 onShow 在组件 onMounted 之前触发导致 uni.$emit 事件丢失的时序问题
store.updateTips(nextTips);
// force 模式下改为在 nextTick 内发送 update-tips规避 WeChat 小程序
// onShow 与 onMounted 时序问题导致 HeaderProgress 监听器尚未注册的边界情况
if (!force) {
uni.$emit("update-tips", nextTips);
}
// redPlayer 已在上方 find() 确认:不为 null 则当前射手在红队
const targetTeam = redPlayer ? 'red' : 'blue';
// 从后端消息读取本局射击时间,动态设置进度条满值与倒计时秒数(降级兜底 15s
shootTimeTotal.value = battleInfo.shootTime ?? 15;
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);
// force 模式下 start.value 刚由 null 变 trueVue 异步调度渲染,
// ShootProgress2v-if="start"尚未挂载update-remain 事件会被丢弃。
// 同时 HeaderProgress 对含"重回"的 tips 拦截音频,倒计时无法依赖
// onAudioEnded 驱动,需在 nextTick 后直接启动。
const elapsed = (Date.now() - battleInfo.current.startTime) / 1000;
console.log(`当前轮已进行${elapsed}`);
if (elapsed > 0 && elapsed < shootTimeTotal.value) {
updateRemainSecond.value = shootTimeTotal.value - elapsed - 0.2;
}
const actualRemain = updateRemainSecond.value;
nextTick(() => {
// 在 nextTick 内统一发送,确保 ShootProgress2 和 HeaderProgress 均已挂载
uni.$emit("update-tips", nextTips);
uni.$emit("update-remain", {reset: true, value: shootTimeTotal.value, team: targetTeam});
// 重置动画完成后,直接启动倒计时(无需依赖音频结束回调)
setTimeout(() => {
uni.$emit("update-remain", {stop: false, value: actualRemain, team: targetTeam});
}, 100);
});
} else {
uni.$emit("update-remain", battleInfo.readyTime);
// ToSomeoneShoot 到达时:若进度条仍在倒计时则瞬间清零再切换满值,确保视觉连贯
uni.$emit("update-remain", {zeroThenReset: true, value: shootTimeTotal.value, team: targetTeam});
updateRemainSecond.value = shootTimeTotal.value;
}
} else {
currentRound.value = battleInfo.current.round || 1;
@@ -97,29 +169,78 @@ const recoverData = (battleInfo, { force = false, arrowOnly = false } = {}) => {
}
};
function onAudioEnded(s) {
// "请红方射箭"/"请蓝方射箭":队友或对手轮次;"轮到你了"用户本人轮次HeaderProgress特殊分支
// 三者音频结束后均需启动倒计时进度条
if (s.indexOf('请红方射箭') >= 0 || s.indexOf('请蓝方射箭') >= 0 || s.indexOf('轮到你了') >= 0) {
let team;
if (s.indexOf('请红方射箭') >= 0) team = 'red';
else if (s.indexOf('请蓝方射箭') >= 0) team = 'blue';
else team = tips.value.includes('红队') ? 'red' : 'blue'; // 轮到你了从当前tips判断用户所在队伍
uni.$emit("update-remain", {stop: false, value: updateRemainSecond.value, team: team});
}
if (s.indexOf("比赛结束") >= 0) {
console.log("比赛结束");
onBattleEnd()
}
}
function onBattleEnd() {
if (matchStatus.value === 2) {
// 全部跳转到新结算页
uni.redirectTo({
url: `/pages/friend-battle-result?battleId=${battleId.value}`,
});
}
}
/**
* @param {object} msg - NewRound 消息
* @param {number} prevRound - 在 NewRound 消息到达时即时捕获的旧轮次,用于 Tip 展示,避免异步延迟内 currentRound 已被更新
*/
function onNewRound(msg, prevRound) {
showRoundTip.value = true;
isFinalShoot.value = msg.current.goldRound;
// 决金轮箭数不确定(平局后可能再加一箭),清零 totalShot 隐藏箭数显示
if (msg.current.goldRound) {
store.updateShotInfo(0, 0);
}
// 用传入的 prevRound捕获时刻的旧轮次展示结算 Tip与进度条 currentRound 解耦
roundTipRound.value = prevRound;
const latestRound = msg.rounds[prevRound - 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;
}
}
}
async function onReceiveMessage(msg) {
if (Array.isArray(msg)) return;
if (msg.type === MESSAGETYPESV2.BattleStart) {
start.value = true;
} else if (msg.type === MESSAGETYPESV2.ToSomeoneShoot) {
// 去重防护:如果 playerId + round 与上一次处理完全相同,则忽略重复推送的消息
// (防止 onBeforeUnmount 未及时 off 和页面重创建导致同一事件被处理多次)
const key = `${msg?.current?.playerId}-${msg?.current?.round}`;
if (key === lastToSomeoneShootKey.value) return;
lastToSomeoneShootKey.value = key;
recoverData(msg);
} else if (msg.type === MESSAGETYPESV2.ShootResult) {
showRoundTip.value = false;
recoverData(msg, { arrowOnly: true });
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;
}
}
// 在进入延迟前先捕获当前轮次,供 onNewRound 使用,防止 800ms 内 ToSomeoneShoot 提前更新 currentRound 造成 Tip 展示错轮
const prevRound = currentRound.value;
setTimeout(() => {
onNewRound(msg, prevRound)
}, 800)
} else if (msg.type === MESSAGETYPESV2.BattleEnd) {
matchStatus.value = msg.status;
if (msg.status === 4) {
showRoundTip.value = true;
currentBluePoint.value = 0;
@@ -127,16 +248,15 @@ async function onReceiveMessage(msg) {
setTimeout(() => {
uni.navigateBack();
}, 2000);
return;
}
uni.redirectTo({
url: "/pages/battle-result?battleId=" + msg.matchId,
});
}
}
onLoad(async (options) => {
if (options.battleId) battleId.value = options.battleId;
// 重置箭数和提示文案,防止因 Pinia 保留上一场比赛的旧值而错误展示
store.updateShotInfo(0, 0);
store.updateTips("");
// uni.enableAlertBeforeUnload({
// message: "离开比赛可能导致比赛失败,是否继续?",
// success: (res) => {
@@ -149,29 +269,43 @@ onMounted(async () => {
keepScreenOn: true,
});
uni.$on("socket-inbox", onReceiveMessage);
uni.$on("audioEnded", onAudioEnded);
await laserCloseAPI();
});
onBeforeUnmount(() => {
uni.setKeepScreenOn({
keepScreenOn: false,
});
// 注销所有第三方事件盓听,防止页面重创建时监听叠加导致消息重复处理
uni.$off("socket-inbox", onReceiveMessage);
uni.$off("audioEnded", onAudioEnded);
audioManager.stopAll();
});
const refreshTimer = ref(null);
onShow(async () => {
if (battleId.value) {
const result = await getBattleAPI(battleId.value);
if (!result) return;
if (result.status === 2) {
uni.showToast({
title: "比赛已结束",
icon: "none",
});
uni.navigateBack({
delta: 2,
// 比赛已结束(如切后台再回来):跳新结算页
uni.redirectTo({
url: `/pages/friend-battle-result?battleId=${result.matchId}`,
});
} else {
recoverData(result, { force: true });
if (result.status !== 0) {
// 比赛进行中,从后端恢复箭数(测距阶段不展示)
// 决金轮不展示箭数;其余轮次从 indexMap 按用户 id 取已射箭数
if (result.shootNumber && !result.current?.goldRound) {
store.updateShotInfo(result.current?.indexMap?.[user.value.id] ?? 0, result.shootNumber);
}
} else {
// 测距阶段重置箭数和提示文案,防止 ImmediateWatcher 读取 Pinia 保留的旧值
store.updateShotInfo(0, 0);
// 同步清空 Pinia tips 与本地 tips避免重新开赛时 HeaderProgress 展示上一场旧文案
store.updateTips("");
tips.value = "";
}
recoverData(result, {force: true});
}
}
});
@@ -181,55 +315,68 @@ onShow(async () => {
<Container :bgType="start ? 3 : 1">
<view class="container">
<BattleHeader
v-if="start === false"
:redTeam="redTeam"
:blueTeam="blueTeam"
v-if="start === false"
:redTeam="redTeam"
:blueTeam="blueTeam"
/>
<TestDistance v-if="start === false" :guide="false" :isBattle="true" />
<TestDistance v-if="start === false" :guide="false" :isBattle="true"/>
<view v-if="start" class="players-row">
<TeamAvatars
:team="blueTeam"
:isRed="false"
:currentShooterId="currentShooterId"
:team="blueTeam"
:isRed="false"
:currentShooterId="currentShooterId"
/>
<ShootProgress2
:tips="tips"
:currentRound="
:tips="tips"
:total="shootTimeTotal"
:currentRound="
goldenRound > 0 ? 'gold' + goldenRound : 'round' + currentRound
"
/>
<TeamAvatars :team="redTeam" :currentShooterId="currentShooterId" />
<TeamAvatars :team="redTeam" :currentShooterId="currentShooterId"/>
</view>
<BowTarget
v-if="start"
mode="team"
:scores="scores"
:blueScores="blueScores"
v-if="start"
mode="team"
:scores="scores"
:blueScores="blueScores"
/>
<BattleFooter
v-if="start"
:roundResults="roundResults"
:redPoints="redPoints"
:bluePoints="bluePoints"
:goldenRound="goldenRound"
v-if="start"
:roundResults="roundResults"
:redPoints="redPoints"
:bluePoints="bluePoints"
:goldenRound="goldenRound"
/>
<ScreenHint
:show="showRoundTip"
:onClose="() => (showRoundTip = false)"
:mode="isFinalShoot ? 'tall' : 'normal'"
:show="showRoundTip"
:mode="isFinalShoot ? 'tall' : 'normal'"
>
<RoundEndTip
v-if="showRoundTip"
:isFinal="isFinalShoot"
:round="currentRound"
:bluePoint="currentBluePoint"
:redPoint="currentRedPoint"
:roundData="
roundResults[currentRound - 1] ? roundResults[currentRound - 1] : []
v-if="showRoundTip"
:isFinal="isFinalShoot"
:round="roundTipRound"
:bluePoint="currentBluePoint"
:redPoint="currentRedPoint"
:roundData="
roundResults[roundTipRound - 1] ? roundResults[roundTipRound - 1] : []
"
:onAutoClose="() => (showRoundTip = false)"
:onAutoClose="()=>{ showRoundTip = false}"
/>
</ScreenHint>
<!-- 设备离线提示弹窗 -->
<SModal
:show="showOfflineModal"
:noBg="true"
height="360rpx"
:onClose="() => (showOfflineModal = false)"
>
<view class="offline-modal">
<text class="offline-title">设备已离线</text>
<text class="offline-desc">检测到设备已断开连接请检查设备后继续比赛</text>
<SButton @click="showOfflineModal = false">我知道了</SButton>
</view>
</SModal>
</view>
</Container>
</template>
@@ -239,6 +386,7 @@ onShow(async () => {
width: 100%;
height: 100%;
}
.players-row {
display: flex;
align-items: center;
@@ -246,4 +394,25 @@ onShow(async () => {
margin-top: -2%;
margin-bottom: 6%;
}
.offline-modal {
display: flex;
flex-direction: column;
align-items: center;
padding: 60rpx 40rpx 40rpx;
gap: 24rpx;
}
.offline-title {
font-size: 36rpx;
font-weight: bold;
color: #FED847;
}
.offline-desc {
font-size: 28rpx;
color: #CCCCCC;
text-align: center;
line-height: 1.6;
}
</style>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 176 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.3 KiB

View File

@@ -0,0 +1,11 @@
<svg width="156" height="58" viewBox="0 0 156 58" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="&#231;&#188;&#150;&#231;&#187;&#132; 5">
<rect id="&#231;&#159;&#169;&#229;&#189;&#162;&#229;&#164;&#135;&#228;&#187;&#189;" width="156" height="58" fill="url(#paint0_linear_1394_738459)"/>
</g>
<defs>
<linearGradient id="paint0_linear_1394_738459" x1="0" y1="87" x2="156" y2="87" gradientUnits="userSpaceOnUse">
<stop stop-color="#7E3627"/>
<stop offset="1" stop-color="#292826" stop-opacity="0.01"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 540 B

View File

@@ -0,0 +1,11 @@
<svg width="156" height="58" viewBox="0 0 156 58" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="&#231;&#188;&#150;&#231;&#187;&#132; 12">
<rect id="&#231;&#159;&#169;&#229;&#189;&#162;&#229;&#164;&#135;&#228;&#187;&#189;" width="156" height="58" fill="url(#paint0_linear_1394_738487)"/>
</g>
<defs>
<linearGradient id="paint0_linear_1394_738487" x1="0" y1="87" x2="156" y2="87" gradientUnits="userSpaceOnUse">
<stop stop-color="#573E25"/>
<stop offset="1" stop-color="#292826" stop-opacity="0.01"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 541 B

View File

@@ -0,0 +1,11 @@
<svg width="156" height="58" viewBox="0 0 156 58" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="&#231;&#188;&#150;&#231;&#187;&#132; 9">
<rect id="&#231;&#159;&#169;&#229;&#189;&#162;&#229;&#164;&#135;&#228;&#187;&#189;" width="156" height="58" fill="url(#paint0_linear_1394_738473)"/>
</g>
<defs>
<linearGradient id="paint0_linear_1394_738473" x1="0.251953" y1="86.9532" x2="156" y2="86.9532" gradientUnits="userSpaceOnUse">
<stop stop-color="#25476F"/>
<stop offset="1" stop-color="#292826" stop-opacity="0.01"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 557 B

BIN
src/static/mvp-blue.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

BIN
src/static/mvp-red.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

BIN
src/static/mvp-tip.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.8 KiB

View File

@@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="110px" height="54px" viewBox="0 0 110 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 5</title>
<defs>
<linearGradient x1="50%" y1="1.43983214%" x2="50%" y2="100%" id="linearGradient-1">
<stop stop-color="#FF7EAF" offset="0%"></stop>
<stop stop-color="#C36AFF" offset="100%"></stop>
</linearGradient>
<rect id="path-2" x="0" y="0" width="110" height="54" rx="8"></rect>
<radialGradient cx="50%" cy="50%" fx="50%" fy="50%" r="50%" id="radialGradient-4">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</radialGradient>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-5">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</linearGradient>
</defs>
<g id="训练功能改版" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="排位赛" transform="translate(-251.000000, -155.000000)">
<g id="编组-9" transform="translate(3.000000, 93.000000)">
<g id="编组-5" transform="translate(248.000000, 62.000000)">
<g id="编组-4">
<mask id="mask-3" fill="white">
<use xlink:href="#path-2"></use>
</mask>
<use id="矩形" fill="url(#linearGradient-1)" xlink:href="#path-2"></use>
<circle id="椭圆形" fill="url(#radialGradient-4)" mask="url(#mask-3)" cx="52" cy="64.5" r="64"></circle>
<rect id="矩形" fill="url(#linearGradient-5)" opacity="0.100000001" mask="url(#mask-3)" transform="translate(85.406727, 10.201587) rotate(51.000000) translate(-85.406727, -10.201587) " x="78.4067275" y="-14.2984126" width="14" height="49" rx="7"></rect>
</g>
<text id="10人大乱斗" font-family="DOUYINSANSBOLD-GB, Douyin Sans" font-size="16" font-weight="bold" fill="#FFFFFF">
<tspan x="15" y="32">10人大乱斗</tspan>
</text>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@@ -0,0 +1,40 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="111px" height="54px" viewBox="0 0 111 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 5@2x</title>
<defs>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
<stop stop-color="#896CFF" offset="0%"></stop>
<stop stop-color="#9754FF" offset="100%"></stop>
</linearGradient>
<rect id="path-2" x="0" y="0" width="110" height="54" rx="8"></rect>
<radialGradient cx="50%" cy="50%" fx="50%" fy="50%" r="50%" id="radialGradient-4">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</radialGradient>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-5">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</linearGradient>
</defs>
<g id="训练功能改版" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="排位赛" transform="translate(-132.000000, -93.000000)">
<g id="编组-9" transform="translate(3.000000, 93.000000)">
<g id="编组-5" transform="translate(129.500000, 0.000000)">
<g id="编组-4">
<mask id="mask-3" fill="white">
<use xlink:href="#path-2"></use>
</mask>
<use id="矩形" fill="url(#linearGradient-1)" xlink:href="#path-2"></use>
<circle id="椭圆形" fill="url(#radialGradient-4)" mask="url(#mask-3)" cx="55" cy="64.5" r="64"></circle>
<rect id="矩形" fill="url(#linearGradient-5)" opacity="0.100000001" mask="url(#mask-3)" transform="translate(89.406727, 10.201587) rotate(51.000000) translate(-89.406727, -10.201587) " x="82.4067275" y="-14.2984126" width="14" height="49" rx="7"></rect>
</g>
<g id="1v1备份" transform="translate(43.000000, 21.000000)" fill="#FFFFFF" fill-rule="nonzero">
<polygon id="路径" points="0 1.625 0 3.64722222 2.69090909 2.22083333 2.69090909 13 5 13 5 0 3.07272727 0"></polygon>
<polygon id="路径" points="17 3 14.4705882 3 12.0196078 10.5384615 9.60784314 3 7 3 10.5490196 13 13.2941176 13"></polygon>
<polygon id="路径" points="19 1.625 19 3.64722222 21.6909091 2.22083333 21.6909091 13 24 13 24 0 22.0727273 0"></polygon>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="110px" height="54px" viewBox="0 0 110 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 5@2x</title>
<defs>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
<stop stop-color="#4A8CFF" offset="0%"></stop>
<stop stop-color="#669DFF" offset="100%"></stop>
</linearGradient>
<rect id="path-2" x="0" y="0" width="110" height="54" rx="8"></rect>
<radialGradient cx="50%" cy="50%" fx="50%" fy="50%" r="50%" id="radialGradient-4">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</radialGradient>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-5">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</linearGradient>
</defs>
<g id="训练功能改版" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="排位赛" transform="translate(-251.000000, -93.000000)">
<g id="编组-9" transform="translate(3.000000, 93.000000)">
<g id="编组-5" transform="translate(248.000000, 0.000000)">
<g id="编组-4">
<mask id="mask-3" fill="white">
<use xlink:href="#path-2"></use>
</mask>
<use id="矩形" fill="url(#linearGradient-1)" xlink:href="#path-2"></use>
<circle id="椭圆形" fill="url(#radialGradient-4)" mask="url(#mask-3)" cx="56" cy="64.5" r="64"></circle>
<rect id="矩形" fill="url(#linearGradient-5)" opacity="0.100000001" mask="url(#mask-3)" transform="translate(85.406727, 10.201587) rotate(51.000000) translate(-85.406727, -10.201587) " x="78.4067275" y="-14.2984126" width="14" height="49" rx="7"></rect>
</g>
<text id="2v2" font-family="DOUYINSANSBOLD-GB, Douyin Sans" font-size="18" font-weight="bold" fill="#FFFFFF">
<tspan x="40.408" y="33">2v2</tspan>
</text>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="110px" height="54px" viewBox="0 0 110 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 5@2x</title>
<defs>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
<stop stop-color="#FF8787" offset="0%"></stop>
<stop stop-color="#FF9696" offset="100%"></stop>
</linearGradient>
<rect id="path-2" x="0" y="0" width="110" height="54" rx="8"></rect>
<radialGradient cx="50%" cy="50%" fx="50%" fy="50%" r="50%" id="radialGradient-4">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</radialGradient>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-5">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</linearGradient>
</defs>
<g id="训练功能改版" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="排位赛" transform="translate(-14.000000, -155.000000)">
<g id="编组-9" transform="translate(3.000000, 93.000000)">
<g id="编组-5" transform="translate(11.000000, 62.000000)">
<g id="编组-4">
<mask id="mask-3" fill="white">
<use xlink:href="#path-2"></use>
</mask>
<use id="矩形" fill="url(#linearGradient-1)" xlink:href="#path-2"></use>
<circle id="椭圆形" fill="url(#radialGradient-4)" mask="url(#mask-3)" cx="56" cy="64.5" r="64"></circle>
<rect id="矩形" fill="url(#linearGradient-5)" opacity="0.100000001" mask="url(#mask-3)" transform="translate(85.406727, 10.201587) rotate(51.000000) translate(-85.406727, -10.201587) " x="78.4067275" y="-14.2984126" width="14" height="49" rx="7"></rect>
</g>
<text id="3v3" font-family="DOUYINSANSBOLD-GB, Douyin Sans" font-size="18" font-weight="bold" fill="#FFFFFF">
<tspan x="40.408" y="33">3v3</tspan>
</text>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="111px" height="54px" viewBox="0 0 111 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 5</title>
<defs>
<linearGradient x1="50%" y1="3.4527039%" x2="50%" y2="99.6818489%" id="linearGradient-1">
<stop stop-color="#FFA052" offset="0%"></stop>
<stop stop-color="#FFBC4E" offset="100%"></stop>
</linearGradient>
<rect id="path-2" x="0" y="0" width="110" height="54" rx="8"></rect>
<radialGradient cx="50%" cy="50%" fx="50%" fy="50%" r="50%" id="radialGradient-4">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</radialGradient>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-5">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</linearGradient>
</defs>
<g id="训练功能改版" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="排位赛" transform="translate(-132.000000, -155.000000)">
<g id="编组-9" transform="translate(3.000000, 93.000000)">
<g id="编组-5" transform="translate(129.500000, 62.000000)">
<g id="编组-4">
<mask id="mask-3" fill="white">
<use xlink:href="#path-2"></use>
</mask>
<use id="矩形" fill="url(#linearGradient-1)" xlink:href="#path-2"></use>
<circle id="椭圆形" fill="url(#radialGradient-4)" mask="url(#mask-3)" cx="56" cy="64.5" r="64"></circle>
<rect id="矩形" fill="url(#linearGradient-5)" opacity="0.100000001" mask="url(#mask-3)" transform="translate(85.406727, 10.201587) rotate(51.000000) translate(-85.406727, -10.201587) " x="78.4067275" y="-14.2984126" width="14" height="49" rx="7"></rect>
</g>
<text id="5人大乱斗" font-family="DOUYINSANSBOLD-GB, Douyin Sans" font-size="16" font-weight="bold" fill="#FFFFFF">
<tspan x="18.976" y="32">5人大乱斗</tspan>
</text>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
src/static/rank/star.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 208 B

BIN
src/static/share2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 585 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 52 KiB

View File

@@ -22,6 +22,19 @@ const getLvlName = (rankLvl, rankList = []) => {
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 = []) => {
if (!rankList) return;
let lvlImage = "";
@@ -35,6 +48,19 @@ const getLvlImage = (rankLvl, rankList = []) => {
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
export default defineStore("store", {
// 状态
@@ -53,6 +79,10 @@ export default defineStore("store", {
game: {
roomID: "",
inBattle: false,
roomNumber: "", // 当前房间号,供 Header 展示房号胶囊
currentShot: 0, // 当前已射箭数(用于 HeaderProgress 恢复状态)
totalShot: 0, // 轮次总箭数(用于 HeaderProgress 恢复状态)
tips: "", // 当前提示文案(用于 HeaderProgress 恢复状态,替代 uni.$emit 避免时序问题)
},
}),
@@ -65,6 +95,9 @@ export default defineStore("store", {
// 方法
actions: {
getLvlNameByScore(score) {
return getLvlNameByScore(score, this.config.randInfos);
},
getLvlName(rankLvl) {
return getLvlName(rankLvl, this.config.randInfos);
},
@@ -79,14 +112,9 @@ export default defineStore("store", {
},
async updateUser(user = {}) {
this.user = { ...defaultUser, ...user };
if (this.user.rankLvl !== undefined) {
this.user.lvlName = getLvlName(
this.user.rankLvl,
this.config.randInfos
);
}
this.user.lvlImage = getLvlImage(
this.user.rankLvl,
this.user.lvlName = getLvlNameByScore(this.user.scores, this.config.randInfos)
this.user.lvlImage = getLvlImageByScore(
this.user.scores,
this.config.randInfos
);
},
@@ -111,6 +139,19 @@ export default defineStore("store", {
this.game.roomID = roomID;
this.game.inBattle = inBattle;
},
/** 更新当前射箭进度(用于 HeaderProgress 恢复状态,替代 uni.$emit 避免时序问题) */
updateShotInfo(currentShot = 0, totalShot = 0) {
this.game.currentShot = currentShot;
this.game.totalShot = totalShot;
},
/** 更新当前提示文案(用于 HeaderProgress 恢复状态,替代 uni.$emit 避免时序问题) */
updateTips(tips = "") {
this.game.tips = tips;
},
/** 更新当前房间号,供 Header 组件展示房号胶囊 */
updateRoomNumber(number) {
this.game.roomNumber = number;
},
},
// 开启数据持久化

View File

@@ -1,5 +1,3 @@
import { getUserGameState, getGameAPI } from "@/apis";
export const formatTimestamp = (timestamp) => {
const date = new Date(timestamp * 1000);
const year = date.getFullYear();
@@ -89,27 +87,6 @@ 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) => {

View File

@@ -14,8 +14,8 @@ function createWebSocket(token, onMessage) {
switch (envVersion) {
case "develop": // 开发版
// url = "ws://192.168.1.30:8000/socket";
url = "wss://apitest.shelingxingqiu.com/socket";
url = "ws://192.168.1.30:8000/socket";
// url = "wss://apitest.shelingxingqiu.com/socket";
break;
case "trial": // 体验版
url = "wss://apitest.shelingxingqiu.com/socket";
@@ -47,9 +47,9 @@ function createWebSocket(token, onMessage) {
uni.onSocketMessage((res) => {
const { data, event } = JSON.parse(res.data);
if (event === "pong") return;
if (data.type && data.data) {
if (data.type) {
console.log("收到消息:", getMessageTypeName(data.type), data.data);
if (onMessage) onMessage({ ...data.data, type: data.type });
if (onMessage) onMessage({ ...(data.data || {}), type: data.type });
return;
}
if (onMessage && data.updates) onMessage(data.updates);

2352
yarn.lock

File diff suppressed because it is too large Load Diff