martial/martial-admin-mini
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
137139b97326b1d3acf1e21fd9c1c2b9d5707a24
martial-admin-mini/doc/项目概述.md
宅房 7bd197f4ac ✅ 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数据。
2025-12-11 13:22:19 +08:00

5.5 KiB
Raw Blame History

武术评分系统 - 项目概述

项目基本信息

  • 项目名称: 武术评分系统 (martial-admin-mini)
  • 项目类型: UniApp 跨端小程序
  • 技术框架: Vue.js 2.x + UniApp
  • 支持平台: 微信小程序 + H5
  • 版本: v1.0.0

项目简介

武术评分系统是一个专为武术比赛评委打分设计的移动端应用。系统支持多角色权限管理，区分普通评委和裁判长两种角色，提供精确的评分功能（精度到0.001分）。

核心功能

1. 用户角色

  • 普通评委 (pub): 对选手进行评分
  • 裁判长 (admin): 查看所有场地和项目，修改评分

2. 主要功能模块

  1. 登录认证: 通过比赛编码和邀请码登录
  2. 评分管理: 精确评分（5.0-10.0分，精度0.001）
  3. 场地管理: 支持多场地切换（5个场地）
  4. 项目管理: 支持多项目切换（8个项目类型）
  5. 扣分项管理: 支持多选扣分项
  6. 评分修改: 裁判长可修改总分

技术架构

技术栈

技术 版本/说明
框架 UniApp
前端框架 Vue.js 2.x
样式 CSS3 + SCSS
UI组件 UniApp原生组件
状态管理 getApp().globalData
路由 UniApp内置路由

项目特点

  1. 跨平台: 一套代码，同时支持微信小程序和H5
  2. 无三方依赖: 完全使用UniApp原生API和组件
  3. 自定义导航栏: 所有页面使用自定义导航栏设计
  4. 响应式设计: 使用rpx单位适配不同屏幕
  5. 精确控制: 评分精度达0.001分

项目结构

martial-admin-mini/
├── pages/                    # 页面文件
│   ├── login/               # 登录页
│   ├── score-list/          # 评分列表页（普通评委）
│   ├── score-detail/        # 评分详情页
│   ├── score-list-multi/    # 多场地列表页（裁判长）
│   └── modify-score/        # 修改评分页（裁判长）
├── common/                  # 公共资源
│   └── common.css          # 全局样式
├── static/                  # 静态资源
├── doc/                     # 项目文档
├── image/                   # 设计图
├── pages.json              # 页面配置
├── manifest.json           # 应用配置
├── App.vue                 # 根组件
├── main.js                 # 入口文件
└── uni.scss               # 全局样式变量

页面流程

┌─────────────────┐
│   登录页面      │ (login.vue)
│ 输入比赛编码    │
│ 输入邀请码      │
└────────┬────────┘
         │
    验证邀请码
         │
    ┌────┴────┐
    │         │
  pub       admin
    │         │
    ▼         ▼
┌────────┐ ┌────────────────┐
│评分列表│ │多场地列表页    │
│(普通评委)│ │(裁判长)        │
└───┬────┘ └────┬───────────┘
    │           │
    ▼           ▼
┌────────┐ ┌──────────┐
│评分详情│ │修改评分   │
│页面    │ │页面       │
└────────┘ └──────────┘

色彩系统

颜色类型 色值 说明
主色调 #1B7C5E 深绿色（导航栏、按钮）
次要色 #2A9D7E 浅绿色（渐变）
强调色 #FF4D6A 红色（提示、警告）
文字主色 #333333 深灰色
文字次色 #666666 中灰色
占位符 #CCCCCC 浅灰色
页面背景 #F5F5F5 浅灰色背景

当前开发状态

已完成功能

  • ✅ 登录权限验证
  • ✅ 角色区分（pub/admin）
  • ✅ 评分界面（精度0.001）
  • ✅ 扣分项多选
  • ✅ 场地切换（5个场地）
  • ✅ 项目切换（8个项目）
  • ✅ 评分修改功能
  • ✅ 自定义导航栏
  • ✅ 响应式布局

待开发功能

  • ❌ 后端API对接
  • ❌ 真实数据存储
  • ❌ 用户身份持久化
  • ❌ 实时数据同步
  • ❌ 离线支持
  • ❌ 数据统计和导出

运行说明

使用 HBuilderX（推荐）

  1. 打开 HBuilderX
  2. 文件 → 打开目录 → 选择项目根目录
  3. 右键点击项目名称 → 运行 → 运行到浏览器 → Chrome
  4. 首次编译需要1-2分钟

使用命令行

# H5开发
npm run dev:h5

# 微信小程序开发
npm run dev:mp-weixin

# 构建H5生产环境
npm run build:h5

# 构建微信小程序
npm run build:mp-weixin

部署说明

H5部署

  1. 运行 npm run build:h5
  2. 将 dist/build/h5 目录部署到服务器
  3. 配置nginx静态资源服务

微信小程序部署

  1. 运行 npm run build:mp-weixin
  2. 使用微信开发者工具打开 dist/build/mp-weixin 目录
  3. 配置 manifest.json 中的 appid
  4. 上传审核

后续扩展建议

短期优化（1-2周）

  1. 对接后端API
  2. 实现JWT认证
  3. 添加loading状态
  4. 完善错误处理

中期功能（1-2月）

  1. WebSocket实时同步
  2. 评分历史记录
  3. 数据统计分析
  4. 导出Excel报表
  5. 离线缓存支持

长期架构（2-3月）

  1. 引入Vuex/Pinia状态管理
  2. 组件化拆分
  3. 单元测试覆盖
  4. CI/CD自动化部署
  5. 性能优化

联系方式

  • 项目仓库: [项目地址]
  • 技术文档: [文档地址]
  • 问题反馈: [Issues地址]
Reference in New Issue View Git Blame Copy Permalink