# Fun-Sport-Miniprogram **Repository Path**: hidden-blue-group/fun-sport-miniprogram ## Basic Information - **Project Name**: Fun-Sport-Miniprogram - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: main - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2025-10-10 - **Last Updated**: 2026-02-06 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # Fun-Sport 微信小程序 > 运动社交平台 - 移动端（微信小程序） --- ## 📱 项目简介 Fun-Sport 微信小程序是运动社交平台的移动端应用，为用户提供： - 🏃 查找和加入俱乐部 - 📅 参与俱乐部活动 - 👥 社区交流互动 - 🏆 积分系统和排行榜 - 📍 附近场地推荐 --- ## 🏗️ 项目结构 ``` fun-sport-miniprogram/ ├── api/ # API接口封装 │ ├── auth.js # 认证相关 │ ├── club.js # 俱乐部相关 │ ├── event.js # 活动相关 │ └── user.js # 用户相关 ├── components/ # 公共组件 │ └── navigation-bar/ # 导航栏组件 ├── pages/ # 页面 │ ├── index/ # 首页 │ ├── club/ # 俱乐部 │ │ ├── list # 列表页 │ │ └── detail # 详情页 │ ├── activity/ # 活动 │ │ ├── list # 列表页 │ │ └── detail # 详情页 │ ├── community/ # 社区 │ ├── profile/ # 个人中心 │ └── logs/ # 日志 ├── utils/ # 工具类 │ ├── request.js # 网络请求封装 │ └── util.js # 通用工具函数 ├── styles/ # 全局样式 ├── images/ # 图片资源 ├── app.js # 小程序入口 ├── app.json # 小程序配置 ├── app.wxss # 全局样式 ├── project.config.json # 项目配置 └── sitemap.json # 站点地图 ``` --- ## 🚀 快速开始 ### 1. 环境要求 - 微信开发者工具 (最新版) - 小程序 AppID（在微信公众平台申请） ### 2. 安装开发工具 下载并安装 [微信开发者工具](https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html) ### 3. 导入项目 1. 打开微信开发者工具 2. 选择"导入项目" 3. 选择项目目录: `/Users/messi/WebstormProjects/fun-sport-miniprogram` 4. 填入小程序 AppID 5. 点击"导入" ### 4. 配置后端地址 编辑 `app.js`，修改 `apiBaseUrl`： ```javascript globalData: { // 开发环境 apiBaseUrl: 'http://localhost:8080/api/mobile', // 或生产环境 // apiBaseUrl: 'https://api.funsport.com/api/mobile', } ``` **注意**： - 开发时使用本地地址需要在微信开发者工具中勾选"不校验合法域名" - 生产环境需要在微信公众平台配置服务器域名 ### 5. 启动项目 在微信开发者工具中点击"编译"按钮即可预览 --- ## 🔑 核心功能 ### 1. 用户认证 - **微信登录**: 使用微信授权登录 - **自动登录**: 保存token实现自动登录 - **用户信息**: 同步用户昵称、头像等信息 ```javascript // 微信登录 const authApi = require('./api/auth'); authApi.wechatLogin(code) .then(data => { console.log('登录成功:', data); }); ``` ### 2. 俱乐部 - **俱乐部列表**: 浏览所有俱乐部 - **俱乐部详情**: 查看俱乐部信息 - **加入/退出**: 申请加入或退出俱乐部 - **成员管理**: 查看俱乐部成员 ```javascript // 加入俱乐部 const clubApi = require('./api/club'); clubApi.joinClub(clubId) .then(() => { wx.showToast({ title: '申请已提交' }); }); ``` ### 3. 活动 - **活动列表**: 浏览俱乐部活动 - **活动详情**: 查看活动详细信息 - **活动报名**: 报名参加活动 - **活动签到**: 到场后签到 - **活动评价**: 活动结束后评价 ```javascript // 报名活动 const eventApi = require('./api/event'); eventApi.signupEvent(eventId, '期待参加!') .then(() => { wx.showToast({ title: '报名成功' }); }); ``` ### 4. 社区 - **动态发布**: 发布运动动态 - **互动交流**: 点赞、评论 - **内容浏览**: 查看其他用户动态 ### 5. 个人中心 - **个人信息**: 查看和编辑个人资料 - **积分记录**: 查看积分明细 - **活动记录**: 查看参与的活动 - **设置**: 个性化设置 --- ## 📡 API接口 ### 认证接口 | 接口 | 方法 | 说明 | |------|------|------| | `/auth/wechat/login` | POST | 微信登录 | | `/auth/refresh-token` | POST | 刷新Token | | `/user/info` | GET | 获取用户信息 | ### 俱乐部接口 | 接口 | 方法 | 说明 | |------|------|------| | `/club/list` | GET | 俱乐部列表 | | `/club/:id` | GET | 俱乐部详情 | | `/club/create` | POST | 创建俱乐部 | | `/club/:id/join` | POST | 加入俱乐部 | | `/club/:id/leave` | POST | 退出俱乐部 | ### 活动接口 | 接口 | 方法 | 说明 | |------|------|------| | `/event/list` | GET | 活动列表 | | `/event/:id` | GET | 活动详情 | | `/event/create` | POST | 创建活动 | | `/event/:id/signup` | POST | 报名活动 | | `/event/:id/cancel` | POST | 取消报名 | | `/event/:id/checkin` | POST | 活动签到 | | `/event/:id/rate` | POST | 活动评价 | --- ## 🎨 样式规范 ### 颜色 ```css /* 主色 */ --primary-color: #1aad19; --primary-light: #4dc664; --primary-dark: #008800; /* 辅助色 */ --secondary-color: #ff9800; --info-color: #2196f3; --success-color: #4caf50; --warning-color: #ff9800; --danger-color: #f44336; /* 文字 */ --text-primary: #333333; --text-secondary: #666666; --text-disabled: #999999; /* 背景 */ --bg-color: #f8f8f8; --bg-white: #ffffff; ``` ### 字体大小 ```css --font-xs: 20rpx; /* 10px */ --font-sm: 24rpx; /* 12px */ --font-md: 28rpx; /* 14px */ --font-lg: 32rpx; /* 16px */ --font-xl: 36rpx; /* 18px */ --font-xxl: 40rpx; /* 20px */ ``` --- ## 🔧 开发配置 ### project.config.json ```json { "appid": "your_appid_here", "projectname": "fun-sport-miniprogram", "miniprogramRoot": "./", "compileType": "miniprogram", "setting": { "urlCheck": false, "es6": true, "postcss": true, "minified": true } } ``` ### 域名配置 生产环境需要在微信公众平台配置以下域名： **request合法域名**: ``` https://api.funsport.com ``` **uploadFile合法域名**: ``` https://api.funsport.com ``` **downloadFile合法域名**: ``` https://api.funsport.com ``` --- ## 📝 开发规范 ### 命名规范 - **文件名**: 小写，使用连字符 (kebab-case) - **变量名**: 驼峰命名 (camelCase) - **常量名**: 大写，下划线分隔 (UPPER_SNAKE_CASE) ### 代码注释 ```javascript /** * 函数说明 * @param {String} param1 - 参数说明 * @returns {Promise} 返回值说明 */ function someFunction(param1) { // 实现 } ``` ### 错误处理 ```javascript someApi() .then(data => { // 成功处理 }) .catch(err => { console.error('错误:', err); wx.showToast({ title: err.message || '操作失败', icon: 'none' }); }); ``` --- ## 🐛 常见问题 ### 1. 无法连接后端 **问题**: 请求失败，无法连接到后端 **解决**: 1. 检查后端是否启动 (`localhost:8080`) 2. 开发工具勾选"不校验合法域名" 3. 检查 `app.js` 中的 `apiBaseUrl` 配置 ### 2. 登录失败 **问题**: 微信登录返回错误 **解决**: 1. 确保填写了正确的 AppID 2. 检查后端微信配置 (`application.yml`) 3. 查看控制台错误信息 ### 3. 样式不生效 **问题**: 修改样式后不生效 **解决**: 1. 点击"清缓存"->"清除文件缓存" 2. 重新编译项目 --- ## 📦 发布流程 ### 1. 准备发布 ```bash # 检查代码 - 移除console.log - 检查敏感信息 - 测试所有功能 ``` ### 2. 上传代码 1. 点击"上传"按钮 2. 填写版本号和备注 3. 上传到微信平台 ### 3. 提交审核 1. 登录[微信公众平台](https://mp.weixin.qq.com/) 2. 进入"开发管理"->"开发版本" 3. 选择刚上传的版本 4. 点击"提交审核" 5. 填写审核信息 ### 4. 发布上线 审核通过后，点击"发布"即可上线 --- ## 📚 相关链接 - [微信小程序官方文档](https://developers.weixin.qq.com/miniprogram/dev/framework/) - [微信开发者工具](https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html) - [微信公众平台](https://mp.weixin.qq.com/) - [Fun-Sport后端API文档](http://localhost:8080/swagger-ui/index.html) --- ## 🤝 技术支持 如有问题，请联系开发团队。 **版本**: 1.0.0 **最后更新**: 2025年10月10日 **维护团队**: Fun-Sport Team