✅ Mock版本完成 - UI冻结版本
完成内容: - 5个完整的UI页面(登录、评分列表、评分详情、多场地列表、修改评分) - 完整的Mock数据展示 - 完整的业务逻辑实现 - 文档体系建立(2000+行文档) 文档包含: - 项目概述.md - 页面功能说明.md - API接口设计.md (17个接口) - 数据结构设计.md (17个接口定义) - 功能模块划分.md - 后端实现对比报告.md - 数据可行性分析报告.md (95分评估) - 保护Mock版本的实施方案.md (4层保护机制) - API对接完成度检查报告.md 此版本为Mock原型版本,所有UI功能完整,数据为硬编码Mock数据。
This commit is contained in:
237
doc/功能说明.md
Normal file
237
doc/功能说明.md
Normal file
@@ -0,0 +1,237 @@
|
||||
# 功能更新说明
|
||||
|
||||
## ✅ 已完成功能
|
||||
|
||||
### 1. 登录权限区分功能
|
||||
|
||||
#### 使用说明:
|
||||
登录时输入不同的邀请码,会获得不同的权限:
|
||||
|
||||
- **邀请码:`pub`**
|
||||
- 角色:普通裁判
|
||||
- 权限:只能评分,不能修改
|
||||
- 登录后跳转:评分列表页(可以给选手打分)
|
||||
|
||||
- **邀请码:`admin`**
|
||||
- 角色:裁判长
|
||||
- 权限:可以查看所有场地,可以修改评分
|
||||
- 登录后跳转:多场地列表页(可以修改已有评分)
|
||||
|
||||
#### 测试步骤:
|
||||
1. 打开登录页
|
||||
2. 输入比赛编码:任意内容(如:2025WS001)
|
||||
3. 输入邀请码:
|
||||
- 输入 `pub` → 进入普通裁判模式
|
||||
- 输入 `admin` → 进入裁判长模式
|
||||
4. 点击"立即评分"按钮
|
||||
|
||||
---
|
||||
|
||||
### 2. 评分按钮跳转功能
|
||||
|
||||
#### 功能说明:
|
||||
在评分列表页,点击"评分"按钮会跳转到评分详情页
|
||||
|
||||
#### 涉及页面:
|
||||
- **评分列表页**(`pages/score-list/score-list.vue`)
|
||||
- 所有"评分"按钮都可以点击
|
||||
- 点击后跳转到评分详情页
|
||||
|
||||
- **评分详情页**(`pages/score-detail/score-detail.vue`)
|
||||
- 可以调整分数(±0.001分)
|
||||
- 可以选择多个扣分项
|
||||
- 可以填写备注
|
||||
- 点击"提交"完成评分
|
||||
|
||||
---
|
||||
|
||||
### 3. 场地横向滚动功能
|
||||
|
||||
#### 功能说明:
|
||||
裁判长登录后,在多场地列表页可以看到多个场地,并支持横向滚动切换
|
||||
|
||||
#### 场地数量:
|
||||
现在有 **5个场地**:
|
||||
1. 第一场地
|
||||
2. 第二场地
|
||||
3. 第三场地
|
||||
4. 第四场地
|
||||
5. 第五场地
|
||||
|
||||
#### 操作方式:
|
||||
- 用手指左右滑动场地标签
|
||||
- 点击场地名称可以切换当前场地
|
||||
- 选中的场地会高亮显示(加粗 + 下划线)
|
||||
|
||||
---
|
||||
|
||||
### 4. 比赛项目横向滚动功能
|
||||
|
||||
#### 功能说明:
|
||||
增加了更多比赛项目,支持横向滚动查看和切换
|
||||
|
||||
#### 项目数量:
|
||||
现在有 **8个比赛项目**:
|
||||
1. 女子组长拳
|
||||
2. 男子组陈氏太极拳
|
||||
3. 女子组双剑(含长穗双剑)
|
||||
4. 男子组杨氏太极拳
|
||||
5. 女子组刀术
|
||||
6. 男子组棍术
|
||||
7. 女子组枪术
|
||||
8. 男子组剑术
|
||||
|
||||
#### 操作方式:
|
||||
- 用手指左右滑动项目按钮
|
||||
- 点击项目按钮可以切换当前项目
|
||||
- 选中的项目会高亮显示(绿色背景)
|
||||
|
||||
---
|
||||
|
||||
## 🎯 完整操作流程演示
|
||||
|
||||
### 普通裁判操作流程:
|
||||
|
||||
1. **登录**
|
||||
- 输入比赛编码
|
||||
- 输入邀请码:`pub`
|
||||
- 点击"立即评分"
|
||||
|
||||
2. **查看选手列表**
|
||||
- 进入评分列表页
|
||||
- 看到第一场地的选手
|
||||
|
||||
3. **给选手打分**
|
||||
- 点击选手卡片上的"评分"按钮
|
||||
- 进入评分详情页
|
||||
- 调整分数(点击 + 或 - 按钮)
|
||||
- 选择扣分项(多选)
|
||||
- 填写备注(可选)
|
||||
- 点击"提交"按钮
|
||||
|
||||
4. **完成评分**
|
||||
- 返回评分列表页
|
||||
- 继续为其他选手评分
|
||||
|
||||
---
|
||||
|
||||
### 裁判长操作流程:
|
||||
|
||||
1. **登录**
|
||||
- 输入比赛编码
|
||||
- 输入邀请码:`admin`
|
||||
- 点击"立即评分"
|
||||
|
||||
2. **切换场地**
|
||||
- 进入多场地列表页
|
||||
- 左右滑动查看所有场地(1-5场地)
|
||||
- 点击场地名称切换
|
||||
|
||||
3. **切换项目**
|
||||
- 左右滑动查看所有比赛项目(8个项目)
|
||||
- 点击项目按钮切换
|
||||
|
||||
4. **修改评分**
|
||||
- 找到已评分的选手
|
||||
- 点击"修改"按钮
|
||||
- 进入修改评分页
|
||||
- 调整总分(±0.001分)
|
||||
- 填写修改备注
|
||||
- 点击"修改"按钮提交
|
||||
|
||||
---
|
||||
|
||||
## 📱 界面展示
|
||||
|
||||
### 多场地列表页特点:
|
||||
- ✅ 支持横向滚动查看多个场地
|
||||
- ✅ 支持横向滚动查看多个项目
|
||||
- ✅ 场地和项目可自由切换
|
||||
- ✅ 选中状态清晰显示
|
||||
- ✅ 提示"裁判长可看见所有场地和项目"
|
||||
|
||||
### 滚动效果:
|
||||
- 流畅的横向滑动
|
||||
- 隐藏滚动条(更美观)
|
||||
- 支持触摸拖动
|
||||
- 支持点击切换
|
||||
|
||||
---
|
||||
|
||||
## 🔧 技术实现
|
||||
|
||||
### 横向滚动实现:
|
||||
使用 `<scroll-view>` 组件:
|
||||
```vue
|
||||
<scroll-view scroll-x="true" show-scrollbar="false">
|
||||
<!-- 内容 -->
|
||||
</scroll-view>
|
||||
```
|
||||
|
||||
### 数据结构:
|
||||
```javascript
|
||||
venues: [
|
||||
{ id: 1, name: '第一场地' },
|
||||
{ id: 2, name: '第二场地' },
|
||||
// ... 5个场地
|
||||
],
|
||||
projects: [
|
||||
'女子组长拳',
|
||||
'男子组陈氏太极拳',
|
||||
// ... 8个项目
|
||||
]
|
||||
```
|
||||
|
||||
### 样式要点:
|
||||
```css
|
||||
.venue-scroll,
|
||||
.project-scroll {
|
||||
width: 100%;
|
||||
white-space: nowrap; /* 防止换行 */
|
||||
}
|
||||
|
||||
.venue-tabs,
|
||||
.project-list {
|
||||
display: inline-flex; /* 内联flex布局 */
|
||||
gap: 20rpx; /* 间距 */
|
||||
}
|
||||
|
||||
.venue-tab,
|
||||
.project-btn {
|
||||
white-space: nowrap; /* 文字不换行 */
|
||||
flex-shrink: 0; /* 不收缩 */
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📝 后续可扩展功能
|
||||
|
||||
1. **动态加载场地和项目**
|
||||
- 可以从后端API获取场地列表
|
||||
- 可以根据比赛动态配置项目
|
||||
|
||||
2. **权限细化**
|
||||
- 可以增加更多角色(如主裁判、副裁判等)
|
||||
- 可以配置每个角色的具体权限
|
||||
|
||||
3. **评分记录**
|
||||
- 可以保存评分历史
|
||||
- 可以查看已评分的选手
|
||||
|
||||
4. **实时同步**
|
||||
- 可以实时同步评分结果
|
||||
- 可以实时更新选手状态
|
||||
|
||||
---
|
||||
|
||||
## ✨ 使用提示
|
||||
|
||||
1. 所有功能已在H5和小程序平台测试通过
|
||||
2. 横向滚动支持触摸和鼠标拖动
|
||||
3. 登录时邀请码不区分大小写(PUB 和 pub 效果相同)
|
||||
4. 所有数据目前为静态数据,实际使用需对接后端API
|
||||
|
||||
---
|
||||
|
||||
**祝您使用愉快!**
|
||||
Reference in New Issue
Block a user