# studylink **Repository Path**: oliverjonas/studylink ## Basic Information - **Project Name**: studylink - **Description**: 孩子学习链路规划和执行,学习历程沉淀和回顾 - **Primary Language**: Python - **License**: MulanPSL-2.0 - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2026-03-18 - **Last Updated**: 2026-03-18 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 项目名:studylink # 儿童成长助理应用 —— 产品需求与技术设计文档 ## 文档版本记录 | 版本 | 日期 | 作者 | 描述 | |------|------------|------|------------------| | v1.0 | 2025-04-12 | AI | 初始完整版草案 | --- ## 1. 项目概述 ### 1.1 背景与目标 “成长链路”是一款面向3-12岁儿童家长的H5应用,旨在帮助家长科学规划孩子的课余学习与游玩活动,记录成长历程,并通过AI技术让活动过程更加有趣、有知。应用的核心价值在于: - **智能化规划**:根据孩子年龄、地区、兴趣,智能推荐每日/多日活动。 - **主题式培养路线**:提供如“小小植物家”、“小小动物家”等系列任务链,让孩子系统化探索知识领域。 - **AI辅助识别**:拍照时自动识别植物、动物等,即时获取知识,激发孩子好奇心。 - **社交分享**:在“发现”板块分享打卡记录,形成亲子互动社区。 ### 1.2 技术架构 - **前端**:Vue 3 + Vue Router + Pinia + Vant UI(移动端) - **后端**:Node.js + Express + JWT 鉴权 - **AI服务**:Python + Flask/FastAPI + 预训练识别模型 - **数据库**:MySQL 8.0 - **存储**:阿里云OSS / 七牛云(图片、文件) - **地图服务**:高德/腾讯地图 SDK(定位、地点搜索) --- ## 2. 全局功能需求 ### 2.1 用户角色与权限 - **未登录用户**:仅可浏览发现页的部分公开内容,无法进行任何操作。 - **已登录用户(家长)**: - 可绑定一个或多个孩子(每个孩子有独立年龄、地区)。 - 可创建、查看、执行规划。 - 可拍照打卡、发布帖子、互动。 - 可管理个人信息。 ### 2.2 通用UI/UX要求 - 移动端适配(375px - 428px宽度)。 - 底部导航栏:首页、规划、发现、我的。 - 顶部导航:标题、消息通知图标(如有)、搜索入口(发现页)。 - 支持深色模式(可选)。 - 加载状态骨架屏。 --- ## 3. 功能模块详细设计 ### 3.1 首页 #### 3.1.1 今日任务提醒 - **UI描述**: - 顶部显示孩子头像、昵称、今日问候。 - 下方为“今日任务”卡片区域,按时间顺序排列。 - 每个任务卡片包含: - 左侧时间(如10:00) - 中间:活动名称 + 地点(小字) - 右侧:状态标签(未开始/进行中/已完成,颜色区分:灰色/蓝色/绿色) - 卡片下方进度条(若活动需要多张照片,显示已拍张数/要求张数) - 若当天无任务,显示“暂无规划,去规划一下吧”按钮,跳转至规划页。 - **交互**: - 点击卡片跳转至对应活动的“活动打卡详情页”(见3.1.3)。 - 长按卡片可弹出“标记完成”或“删除任务”(删除需二次确认)。 #### 3.1.2 热门活动板块 - **UI描述**: - 标题“热门探索主题”,右侧“更多”按钮(跳转至发现页分类浏览)。 - 横向滑动网格,每项为圆形图标+文字标签,例如: - 🌱 小小植物家 - 🐘 小小动物家 - 🚀 小小航天员 - 🔧 小小工程师 - ✍️ 小小作家 - (可动态扩展) - **数据来源**: - 根据当前用户孩子年龄、地区,从活动库中筛选出热度最高(最近打卡次数多)的3-5个主题。 - 若系统未配置,则展示默认主题。 - **交互**: - 点击主题图标,进入该主题的**发现页**(展示该主题下所有帖子,顶部可切换至该主题的活动规划推荐)。 #### 3.1.3 活动打卡详情页 - **进入方式**:从首页任务卡片点击进入。 - **页面结构**: 1. **顶部信息区**: - 活动名称(大号字体) - 地点、时间(如“市植物园 · 2025-04-12 10:00”) - 任务描述(如“找出5种开花植物,拍照并记录名称”) 2. **拍照打卡区**: - 已拍照片缩略图横向滚动展示,每个缩略图右上角显示识别结果(如“樱花”)。 - 底部“拍照”按钮,点击打开摄像头(或选择相册)。 - 拍照后自动上传图片到服务器,并触发AI识别。 - 识别过程中显示“识别中...”,完成后在照片下方显示识别结果卡片,可编辑(修改名称)或补充备注。 - 每张照片可点击查看大图,大图模式下可删除。 3. **进度与提交**: - 显示“已拍X张/需拍Y张”,达到Y张后“完成打卡”按钮高亮。 - 点击“完成打卡”弹出分享选项: - “分享到发现”:进入帖子编辑页(自动填充照片和识别结果)。 - “仅保存记录”:直接保存打卡记录,不发布。 - **业务规则**: - 拍照张数必须≥要求张数,否则不能完成打卡。 - 若活动配置了位置打卡(任务创建时可勾选),则在打卡页检测用户GPS是否在活动地点半径500米内,否则提示“您不在活动区域附近,无法打卡”。 - 同一任务只能完成一次,完成后按钮变灰。 ### 3.2 规划 #### 3.2.1 规划主界面 - **顶部日期导航**:可左右滑动切换日期,点击日期下方显示当天任务列表;支持“今天”、“本周”、“自定义范围”切换。 - **任务列表**:按时间顺序展示所选日期范围内的任务,每个任务卡片包含:时间、活动名称、地点、完成状态。 - **操作按钮**: - 右上角“智能规划”按钮:弹出智能规划配置弹窗。 - 底部浮动“+”按钮:手动添加任务。 #### 3.2.2 智能规划 - **触发流程**: 1. 点击“智能规划”,弹出半屏配置面板。 2. 配置项: - 日期范围:默认选中今天至明天,可自定义起始日和结束日。 - 兴趣主题:多选(小小植物家、小小动物家等),默认全选。 - 考虑因素(可选):“优先选择附近活动”(需开启定位)。 3. 点击“开始规划”,系统生成任务列表,并以预览形式展示(可上下滑动查看)。 4. 预览页底部有“确认添加”和“重新生成”按钮。 - **规划算法**: - 从活动库中选取符合孩子年龄(±2岁)、地区(优先省内/市内)的活动。 - 根据所选主题比例分配活动数量。 - 若开启附近优先,按活动地点与用户距离排序。 - 时间安排:每日活动不超过3个,间隔不少于1小时,周末可安排全天活动。 - **结果处理**:确认添加后,任务写入规划表,并返回规划主界面刷新。 #### 3.2.3 手动添加/编辑任务 - **手动添加表单**: - 活动名称:输入框,支持从活动库搜索(输入时下拉显示匹配活动,点击自动填充其余字段)。 - 日期、时间(必填)。 - 地点(可选):可手动输入或地图选点。 - 任务内容(必填)。 - 拍照要求张数(数字,默认为1)。 - 是否启用位置打卡(开关)。 - **编辑任务**:在任务卡片上点击编辑图标(或长按菜单选编辑),弹出同上表单,预填原数据,可修改后保存。 #### 3.2.4 培养路线 - **路线列表页**: - 标题“成长路线”,下方网格展示所有路线(支持横向滑动或两列布局)。 - 每个路线卡片包含:图标、名称、适合年龄、进度(如“3/8”)。 - 点击卡片进入路线详情页。 - **路线详情页**: - 顶部:路线名称、简介、适合年龄、知识领域标签。 - 任务链列表:按顺序展示所有活动,每个活动项显示:名称、地点、任务简介、预计时长、完成状态(已打卡/未开始)。 - 底部按钮:“一键加入规划” → 选择开始日期后,将未完成的活动按顺序添加到规划中。 - 若活动不适用于孩子当前年龄,用灰色显示并提示“适合X岁以上”。 ### 3.3 发现 #### 3.3.1 帖子信息流 - **列表页**:默认展示所有公开帖子(按发布时间倒序),支持下拉刷新、上拉加载更多。 - **帖子卡片**: - 头像+昵称(点击进入个人主页)。 - 活动名称、地点、打卡时间。 - 照片墙(最多9张,点击可查看大图并左右滑动)。 - 文字描述(可展开/收起)。 - 识别标签行(如“🌼蒲公英”“🐕柴犬”),点击标签可搜索该标签下的所有帖子。 - 底部:点赞数、评论数,以及点赞图标(红心)、评论图标。 - **交互**: - 点赞:点击红心变色,数字+1;再次点击取消。 - 评论:点击评论图标进入帖子详情,可查看全部评论并发表评论。 - 分享:卡片右上角分享按钮,可分享到微信/朋友圈。 #### 3.3.2 分类与搜索 - **顶部标签栏**:固定分类:全部、植物、动物、航天、工程、写作、其他。点击切换对应分类帖子。 - **搜索框**:位于顶部,点击进入搜索页,可按活动名称、地点、标签、用户昵称搜索。 #### 3.3.3 帖子详情页 - 展示完整卡片内容,下方为评论区。 - 评论框:支持输入文字,可@用户(后续迭代)。 - 评论列表:显示头像、昵称、时间、内容,可点赞评论。 #### 3.3.4 发布流程 - 发布入口: - 打卡完成后弹窗选择“分享到发现”。 - 发现页底部“+”按钮,选择过往打卡记录(从相册/活动列表选取)。 - 发布编辑页: - 预填充照片(可删除或添加更多)。 - 照片下方显示识别结果标签(可编辑或添加自定义标签)。 - 输入框:填写孩子感想或描述(必填)。 - 位置信息:可关联活动地点或手动添加。 - 发布按钮:提交后生成帖子,出现在发现流中。 ### 3.4 我的 #### 3.4.1 个人信息 - 头像(可上传)、昵称、手机号(不可见)。 - 孩子信息管理: - 展示已绑定的孩子列表(可添加多个)。 - 每个孩子项:姓名、年龄、地区、头像(可选)。 - 点击进入编辑,可修改信息或删除孩子。 - 添加孩子:表单输入姓名、出生日期、地区。 - 成长统计:卡片形式展示累计活动数、打卡照片数、获得点赞数。 #### 3.4.2 我的活动 - 列表页:按月份分组,展示所有打卡记录,每条记录显示活动名称、日期、照片缩略图(1张)。 - 点击记录进入打卡详情页,可查看所有照片及识别结果,并可删除记录(删除后关联帖子是否同步删除?可选提示)。 #### 3.4.3 我的规划 - 分页签:“进行中”(未来未完成的任务)和“历史”(已完成的任务)。 - 进行中列表可点击进入打卡;历史列表只读。 #### 3.4.4 我的路线 - 展示已加入的路线,每个卡片显示名称、进度条、已完成数/总数。 - 点击进入路线详情页(同3.2.4),可查看每个活动状态。 #### 3.4.5 设置 - 账号安全:修改密码、绑定/解绑手机。 - 隐私设置: - 谁可以看我的帖子:所有人/仅好友/仅自己。 - 允许评论:所有人/仅好友/关闭。 - 通知设置: - 任务提醒开关(默认开启)。 - 点赞/评论提醒开关(默认开启)。 - 帮助与反馈:常见问题列表、意见反馈入口。 - 关于我们:应用版本、用户协议、隐私政策。 --- ## 4. 技术架构与接口设计 ### 4.1 技术栈细化 #### 4.1.1 前端 - 框架:Vue 3 + Vite - 路由:Vue Router 4 - 状态管理:Pinia(持久化存储用户信息、token) - UI组件库:Vant 4(移动端适配) - 网络请求:Axios,拦截器统一处理token、错误提示 - 地图SDK:集成高德地图JS API(用于位置选择、定位) - 拍照:使用 `navigator.mediaDevices` 或 Vant 的 Uploader 组件,支持拍照和相册选择 #### 4.1.2 后端 - 框架:Express 5 - 数据库连接:Sequelize ORM(或TypeORM) - 鉴权:JWT,放在Authorization Header中 - 文件上传:Multer 接收图片,转存至OSS - 调用AI服务:通过 axios 调用 Python 服务的HTTP接口 - 定时任务:node-schedule 用于推送任务提醒(后续可集成极光推送) #### 4.1.3 AI服务 - 框架:Flask 2.0 - 模型: - 植物识别:基于 PlantNet 数据集训练的 CNN 模型,支持约1000种常见植物 - 动物识别:基于 iNaturalist 数据集,支持约500种动物 - 后续可扩展:航天器识别(使用公开数据集训练) - 接口:接收图片URL或二进制,返回 JSON { "species": "蒲公英", "confidence": 0.95, "wiki_url": "..." } #### 4.1.4 数据库 - MySQL 8.0,字符集 utf8mb4 - 表结构见附录。 ### 4.2 核心API接口设计(示例) #### 4.2.1 认证相关 - POST /api/auth/register - 注册 - POST /api/auth/login - 登录,返回 token 和用户信息 - POST /api/auth/refresh - 刷新 token #### 4.2.2 任务与规划 - GET /api/tasks?date=2025-04-12 - 获取指定日期任务列表 - POST /api/plans/generate - 智能规划生成(接收日期范围、主题列表) - POST /api/plans - 保存手动规划 - PUT /api/tasks/:id - 更新任务(编辑) - DELETE /api/tasks/:id - 删除任务 #### 4.2.3 打卡与照片 - POST /api/checkins - 提交打卡记录 - POST /api/photos/upload - 上传单张照片,返回照片URL - POST /api/photos/recognize - 提交图片URL进行AI识别,返回识别结果 #### 4.2.4 帖子 - GET /api/posts - 获取发现流帖子列表(支持分页、分类过滤) - POST /api/posts - 发布帖子 - GET /api/posts/:id - 获取帖子详情 - POST /api/posts/:id/like - 点赞/取消点赞 - GET /api/posts/:id/comments - 获取评论列表 - POST /api/posts/:id/comments - 发表评论 #### 4.2.5 用户与孩子 - GET /api/user/profile - 获取用户信息 - PUT /api/user/profile - 更新用户信息 - GET /api/user/children - 获取孩子列表 - POST /api/user/children - 添加孩子 - PUT /api/user/children/:id - 更新孩子信息 - DELETE /api/user/children/:id - 删除孩子 (更多接口省略) ### 4.3 AI识别服务接口定义 **URL**: `POST /recognize` **请求体** (multipart/form-data 或 JSON): ```json { "image_url": "https://xxx.com/photo.jpg", "type": "plant" // 可选 plant / animal / default } ``` **响应**: ```json { "code": 200, "data": { "species": "蒲公英", "scientific_name": "Taraxacum mongolicum", "confidence": 0.96, "wiki_url": "https://baike.baidu.com/item/蒲公英", "features": ["多年生草本", "头状花序", "种子上有白色冠毛"] } } ``` 若识别失败,返回 `"species": "unknown"`。 --- ## 5. 数据库设计 ### 5.1 表名与字段 #### users 用户表 | 字段名 | 类型 | 说明 | |---------------|--------------|-----------------------| | id | int | 主键自增 | | phone | varchar(20) | 手机号(唯一) | | password_hash | varchar(255) | 加密密码 | | nickname | varchar(50) | 昵称 | | avatar_url | varchar(255) | 头像URL | | created_at | datetime | | | updated_at | datetime | | #### children 孩子表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | user_id | int | 外键 -> users.id | | name | varchar(50) | 孩子姓名 | | birthday | date | 出生日期(用于计算年龄) | | gender | tinyint | 0未知 1男 2女 | | area_province | varchar(50) | 所在省 | | area_city | varchar(50) | 所在市 | | area_district | varchar(50) | 所在区(可选) | | avatar_url | varchar(255) | 孩子头像 | | created_at | datetime | | | updated_at | datetime | | #### activity_library 活动库 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | name | varchar(100) | 活动名称 | | description | text | 活动描述 | | type | varchar(50) | 分类(植物、动物、航天等) | | min_age | int | 最小适合年龄 | | max_age | int | 最大适合年龄 | | location_name | varchar(200) | 推荐地点名称(如“植物园”) | | location_lat | decimal(10,8)| 纬度 | | location_lng | decimal(11,8)| 经度 | | photo_required| int | 默认拍照要求张数 | | task_template | text | 任务描述模板 | | is_active | tinyint | 是否启用 | | created_at | datetime | | #### routes 培养路线表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | name | varchar(100) | 路线名称(小小植物家) | | description | text | 路线简介 | | icon_url | varchar(255) | 图标URL | | min_age | int | 适合最小年龄 | | max_age | int | 适合最大年龄 | | created_at | datetime | | #### route_activities 路线活动关联表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | route_id | int | 外键 -> routes.id | | activity_id | int | 外键 -> activity_library.id | | step_order | int | 在路线中的顺序 | | optional | tinyint | 是否可选(0必选 1可选) | #### plans 规划表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | user_id | int | 外键 -> users.id | | child_id | int | 外键 -> children.id | | name | varchar(100) | 规划名称(如“周末植物之旅”) | | start_date | date | 规划起始日期 | | end_date | date | 规划结束日期 | | created_at | datetime | | #### plan_tasks 规划任务表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | plan_id | int | 外键 -> plans.id | | activity_id | int | 外键 -> activity_library.id | | custom_name | varchar(100) | 自定义活动名称(若手动创建) | | custom_desc | text | 自定义任务描述 | | scheduled_date| date | 安排日期 | | scheduled_time| time | 安排时间 | | location_name | varchar(200) | 地点 | | location_lat | decimal(10,8)| 纬度 | | location_lng | decimal(11,8)| 经度 | | photo_required| int | 拍照要求张数 | | need_location | tinyint | 是否需要位置打卡 | | status | tinyint | 0待完成 1已完成 2已过期 | | completed_at | datetime | 实际完成时间 | | created_at | datetime | | #### checkins 打卡记录表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | task_id | int | 外键 -> plan_tasks.id | | user_id | int | 外键 -> users.id | | child_id | int | 外键 -> children.id | | checkin_time | datetime | 打卡时间 | | location_lat | decimal(10,8)| 打卡时位置 | | location_lng | decimal(11,8)| | | created_at | datetime | | #### photos 照片表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | checkin_id | int | 外键 -> checkins.id | | image_url | varchar(255) | OSS URL | | recognition | json | AI识别结果(存储物种、置信度)| | remark | varchar(255) | 用户备注 | | created_at | datetime | | #### posts 帖子表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | user_id | int | 发布者用户ID | | child_id | int | 关联孩子ID(可选) | | checkin_id | int | 关联打卡ID(若从打卡发布) | | content | text | 文字内容 | | location_name | varchar(200) | 发布时位置名称 | | location_lat | decimal(10,8)| | | location_lng | decimal(11,8)| | | photos | json | 照片URL数组(从打卡复制) | | tags | json | 识别标签数组 | | like_count | int | 点赞数 | | comment_count | int | 评论数 | | status | tinyint | 0公开 1仅好友 2私密 | | created_at | datetime | | | updated_at | datetime | | #### likes 点赞表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | user_id | int | 点赞用户ID | | post_id | int | 帖子ID | | created_at | datetime | | #### comments 评论表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | user_id | int | 评论用户ID | | post_id | int | 帖子ID | | parent_id | int | 回复的评论ID(预留) | | content | varchar(500) | 评论内容 | | created_at | datetime | | #### follows 关注表 | 字段名 | 类型 | 说明 | |---------------|--------------|-------------------------------| | id | int | 主键 | | follower_id | int | 关注者用户ID | | followee_id | int | 被关注者用户ID | | created_at | datetime | | --- ## 6. 开发注意事项 ### 6.1 安全性 - JWT token 应设置较短有效期(如2小时),配合 refresh token 实现无感刷新。 - 用户密码使用 bcrypt 加密存储。 - 文件上传需限制大小(≤5MB),格式为 jpg/png,并对文件内容进行安全扫描(可选)。 - API 接口需验证用户权限,确保用户只能访问自己的数据。 ### 6.2 性能与扩展 - 数据库索引:常用查询字段如 user_id, child_id, created_at, post_id 等需加索引。 - 分页查询使用 offset/limit 或 cursor 方式。 - 图片采用 CDN 加速,OSS 存储。 - AI 服务可单独部署,支持水平扩展。 ### 6.3 异常处理 - 前端需统一处理网络错误、业务错误码,给出友好提示。 - 后端统一错误格式:`{ code: 400, message: "参数错误", details: {} }` - 关键操作(如打卡提交)需保证幂等性。 ### 6.4 消息推送 - 任务提醒:使用定时任务在任务开始前30分钟推送(集成极光/个推)。 - 互动提醒:点赞、评论时即时推送(WebSocket 或轮询)。 ### 6.5 数据隐私 - 孩子年龄、位置等敏感信息需加密存储或脱敏展示。 - 帖子可见性遵循用户隐私设置。 --- ## 7. 附录 ### 7.1 状态码定义 | 代码 | 说明 | |------|--------------------| | 200 | 成功 | | 400 | 请求参数错误 | | 401 | 未授权/登录过期 | | 403 | 无权限 | | 404 | 资源不存在 | | 500 | 服务器内部错误 | ### 7.2 开发环境搭建 - 前端:`npm create vue@latest` + 安装 Vant - 后端:`express-generator` - AI:`conda create -n ai python=3.8` + Flask - 数据库:本地安装 MySQL,使用 Sequelize 自动建表(或手动执行 SQL) ### 7.3 部署流程 1. 后端打包部署到 Node.js 服务器,使用 PM2 管理。 2. AI 服务打包成 Docker 镜像,部署到 GPU/CPU 服务器。 3. 前端打包静态文件部署到 OSS + CDN。 4. 域名配置 HTTPS。 --- **文档结束** #### 参与贡献 1. Fork 本仓库 2. 新建 Feat_xxx 分支 3. 提交代码 4. 新建 Pull Request #### 特技 1. 使用 Readme\_XXX.md 来支持不同的语言,例如 Readme\_en.md, Readme\_zh.md 2. Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com) 3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目 4. [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目,是综合评定出的优秀开源项目 5. Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help) 6. Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)