diff --git a/README.md b/README.md index 32f2408..0a25a93 100644 --- a/README.md +++ b/README.md @@ -1,251 +1,71 @@ -# 武术赛事报名系统 +# 武术赛事管理系统 - 用户端 -基于uniapp框架开发的武术赛事报名系统,支持H5和微信小程序。 +基于 UniApp 开发的武术赛事报名小程序,支持 H5 和微信小程序。 -## 项目概述 +## 在线访问 -本项目是一个完整的武术赛事报名管理系统,实现了从赛事浏览、报名到信息管理的完整流程。 +| 服务 | 地址 | +|------|------| +| 用户端 H5 | https://martial.aitisai.com | +| 后端 API | https://martial-api.aitisai.com | -### 技术栈 +## 功能特点 -- **框架**: uniapp +- 赛事浏览与搜索 +- 在线报名与支付 +- 选手信息管理 +- 报名记录查询 +- 赛事详情查看 + +## 技术栈 + +- **框架**: UniApp - **平台**: H5、微信小程序 -- **样式**: SCSS、rpx响应式单位 -- **版本**: 2.0 +- **样式**: SCSS + +## 快速开始 + +```bash +# 安装依赖 +npm install + +# H5 开发 +npm run dev:h5 + +# 微信小程序开发 +npm run dev:mp-weixin + +# 构建 H5 +npm run build:h5 +``` ## 项目结构 ``` martial-mini/ -├── pages/ # 页面目录 -│ ├── home/ # 首页(武术赛事通) -│ ├── profile/ # 个人中心 -│ ├── common-info/ # 常用信息 -│ ├── add-player/ # 新增选手 -│ ├── edit-player/ # 编辑选手 -│ ├── add-contact/ # 新增联系人 -│ ├── my-registration/ # 我的报名 -│ ├── event-list/ # 全部赛事列表 -│ ├── event-detail/ # 赛事详情 -│ ├── register-type/ # 选择报名类型 -│ ├── select-event/ # 选择报名项目 -│ └── event-register/ # 赛事报名流程 -├── components/ # 公共组件目录 -│ ├── custom-navbar/ # 自定义导航栏 -│ ├── custom-tabs/ # Tab切换组件 -│ └── confirm-modal/ # 确认弹窗组件 -├── static/ # 静态资源目录 -│ └── images/ # 图片资源 -├── image/ # 设计稿图片 -├── App.vue # 应用主组件 -├── main.js # 应用入口文件 -├── pages.json # 页面配置 -├── manifest.json # 应用配置 -├── uni.scss # 全局样式变量 -├── index.html # H5入口页面 -├── package.json # 项目依赖配置 -├── check-pages.js # 页面完成度检查工具 -└── README.md # 项目说明文档 +├── pages/ +│ ├── home/ # 首页 +│ ├── profile/ # 个人中心 +│ ├── event-list/ # 赛事列表 +│ ├── event-detail/ # 赛事详情 +│ ├── event-register/ # 赛事报名 +│ ├── my-registration/ # 我的报名 +│ ├── add-player/ # 新增选手 +│ └── common-info/ # 常用信息 +├── components/ # 公共组件 +├── static/ # 静态资源 +├── pages.json # 页面配置 +└── manifest.json # 应用配置 ``` -## 功能模块 +## 相关仓库 -### 1. 首页(武术赛事通) -- 轮播图展示 -- 精品赛事列表 -- 赛事状态显示(报名中/已结束) -- 快速报名入口 +| 仓库 | 说明 | +|------|------| +| [martial-master](https://git.waypeak.work/martial/martial-master) | 后端 API | +| [martial-web](https://git.waypeak.work/martial/martial-web) | 管理后台 | +| [martial-admin-mini](https://git.waypeak.work/martial/martial-admin-mini) | 裁判端小程序 | -### 2. 个人中心 -- 用户信息展示 -- 我的报名入口 -- 常用信息管理 -- 修改密码 -- 联系我们 -- 退出登录 +--- -### 3. 常用信息管理 -- 选手信息管理(新增/编辑/删除) -- 集体信息管理 -- 联系人信息管理 -- Tab切换界面 - -### 4. 选手管理 -- 证件类型选择(身份证) -- 姓名输入 -- 证件号码输入(18位身份证号验证) -- 队伍名称输入 -- 表单验证提示 - -### 5. 联系人管理 -- 证件信息 -- 手机号码(格式验证) -- 邮箱地址 -- 联系地址 -- 设置默认联系人开关 - -### 6. 我的报名 -- 全部/待开始/进行中/已结束 Tab切换 -- 赛事状态标签 -- 赛事详细信息展示 -- 参赛选手列表 -- 查看证件功能 - -### 7. 赛事列表 -- 搜索功能 -- 日期筛选 -- 地区筛选 -- 赛事卡片展示 -- 报名状态显示 - -### 8. 赛事详情 -- 赛事基本信息 -- 功能网格入口: - - 信息发布 - - 赛事规程 - - 活动日程 - - 参赛选手 - - 比赛实况 - - 出场顺序 - - 成绩 - - 奖牌榜 - - 图片直播 -- 报名按钮 - -### 9. 报名流程 -- **选择报名类型**:单人赛/集体赛 -- **选择报名项目**:多选项目,显示价格 -- **报名三步骤**: - 1. 选择选手信息(可新增/编辑/删除选手) - 2. 订单支付(显示赛事信息、联系人、参赛选手、总价) - 3. 报名成功(显示选手编号信息) - -## 设计特点 - -### 配色方案 -- 主题色:#C93639(中国红) -- 文字色:#333333(深灰)、#666666(中灰)、#999999(浅灰) -- 背景色:#f5f5f5(浅灰背景)、#ffffff(白色) - -### 样式规范 -- 使用rpx响应式单位,自适应不同屏幕 -- 圆角统一:16rpx(常规)、24rpx(大圆角) -- 间距统一:30rpx(页面内边距) -- 字体大小: - - 标题:36-38rpx - - 正文:28-32rpx - - 辅助文字:24-26rpx - -### UI组件 -- 自定义导航栏(支持返回按钮、标题、右侧操作区) -- Tab切换组件(带下划线指示器) -- 确认弹窗组件(取消/确定) -- 表单输入组件 -- 按钮组件(主按钮/禁用按钮) - -## 开发说明 - -### 环境要求 -- Node.js 12+ -- HBuilderX(推荐)或 VSCode + uni-app插件 - -### 安装依赖 -```bash -npm install -``` - -### 运行项目 - -#### H5开发 -```bash -npm run dev:h5 -``` - -#### 微信小程序开发 -```bash -npm run dev:mp-weixin -``` - -### 构建项目 - -#### 构建H5 -```bash -npm run build:h5 -``` - -#### 构建微信小程序 -```bash -npm run build:mp-weixin -``` - -### 检查页面完成度 -```bash -node check-pages.js -``` - -## 页面列表 - -1. **首页** - `/pages/home/home` -2. **个人中心** - `/pages/profile/profile` -3. **常用信息** - `/pages/common-info/common-info` -4. **新增选手** - `/pages/add-player/add-player` -5. **编辑选手** - `/pages/edit-player/edit-player` -6. **新增联系人** - `/pages/add-contact/add-contact` -7. **我的报名** - `/pages/my-registration/my-registration` -8. **全部赛事列表** - `/pages/event-list/event-list` -9. **赛事详情** - `/pages/event-detail/event-detail` -10. **选择报名类型** - `/pages/register-type/register-type` -11. **选择报名项目** - `/pages/select-event/select-event` -12. **赛事报名流程** - `/pages/event-register/event-register` - -## 注意事项 - -1. 所有静态页面已完成,数据为模拟数据 -2. 实际开发时需要对接后端API接口 -3. 图片资源需要替换为实际的设计图 -4. 部分功能(如支付)需要集成第三方SDK -5. 微信小程序需要配置appid和相关权限 - -## 后续开发建议 - -1. **接口对接**: - - 用户登录/注册 - - 赛事列表获取 - - 报名信息提交 - - 支付接口对接 - -2. **功能完善**: - - 图片上传功能 - - 消息通知 - - 数据缓存优化 - - 错误处理机制 - -3. **性能优化**: - - 图片懒加载 - - 列表虚拟滚动 - - 页面预加载 - -4. **用户体验**: - - 加载动画 - - 骨架屏 - - 下拉刷新 - - 上拉加载更多 - -## 检查报告 - -运行 `node check-pages.js` 可查看详细的页面完成度报告。 - -当前完成度:**100%** ✓ - -- 配置文件:7/7 完成 -- 公共组件:3/3 完成 -- 页面文件:12/12 完成 - -## 版本信息 - -- 版本号:V 2.0 -- 开发时间:2025年1月 - -## 许可证 - -MIT License +**最后更新**: 2024-12-29