更新记录

1.0.0（2026-10-26） 下载此版本

本项目仅开源 uni-app 用户端（基于 Vue3），可在电脑浏览器、手机浏览器、微信小程序、手机 App 等多端运行。用 HBuilderX 导入本目录即可本地体验，供学习研究。

平台兼容性

uni-app(3.8.7)

其他

托育到家 · 用户端

开源说明

本项目仅开源 uni-app 用户端（基于 Vue3），可在电脑浏览器、手机浏览器、微信小程序、手机 App 等多端运行。用 HBuilderX 导入本目录即可本地体验，供学习研究。

这是什么软件

这是一个托育服务信息与咨询平台，帮助家长找到合适的托育园、老师和托育服务，也帮助托育机构展示自己、接待咨询：

• 家长 / 普通用户：浏览附近托育园、查看老师与服务、阅读育婴资讯、发动态交流、向园区发起咨询、收藏感兴趣的内容。
• 托育园区：提交入驻申请，审核通过后使用「园区工作台」管理资料、老师、服务、员工和咨询。
• 平台运营：在后台审核入驻、配置轮播与资讯等（正式审核在管理端工程，用户端仅含入驻进度查看与工作台）。

底部有五个主入口：首页、新手妈妈、托育资讯、消息、我的。

说明：本用户端以「浏览 + 咨询 + 内容社区」为主，未接入在线支付、钱包充值、会员购买等资金交易功能；服务价格仅作展示，实际沟通通过「立即咨询」完成。

能在哪些地方使用

对接了哪些第三方

下面列出的是用户能直接感受到的外部服务或系统能力，用大白话说明「干什么用」：

微信生态

地图与定位

登录与账号安全

即时通讯

文件存储与上传

内容安全（服务端）

客服与沟通

分享与推广

手机设备能力

平台后端服务

普通用户（家长）能做什么

首页 · 找托育园、找老师

• 选择城市：顶部显示当前城市，点击进入城市列表页手动切换；若允许定位，会结合 GPS 计算距离。
• 搜索：顶部搜索框跳转搜索页，可按关键词搜托育园或托育老师。
• 轮播广告：首页顶部轮播图由后台配置，展示平台活动或推荐内容。
• 两个 Tab 切换：
  • 托育园列表：展示园区封面、名称、托育类型标签、设施标签、地址、营业时间、师资团队预览；点击卡片进入园区详情。
  • 托育老师列表：展示老师头像、姓名、毕业院校、所属园区、与您的大致距离；点击进入老师详情。
• 按距离排序：可切换升序/降序，离您近的排在前面（需定位权限）。
• 下拉刷新、上拉加载更多。

搜索页 · 精准筛选

• 支持搜「托育园」或「托育老师」两类内容。
• 托育园筛选：托育类型标签、距离范围（如 2km 内 / 3km 内 / 5km 内）。
• 托育老师筛选：擅长科目、学历、教龄、荣誉标签等（选项由后台配置）。
• 搜索结果同样展示卡片信息，点击进入对应详情页。

园区详情 · 了解一家托育园

• 图片轮播：浏览园区环境照片。
• 基本信息：名称、托育类型、设施标签、营业时间、***（脱敏展示）、地址。
• 地图与导航：点击地址区域可调起地图导航（小程序用微信地图，H5/App 可选高德/腾讯/百度）。
• 浏览量 / 收藏量：查看该园区被多少人浏览、收藏。
• 图文介绍：园区介绍、环境说明、园区特色、服务流程、资质材料（营业执照等）。
• 师资团队：展示在园老师列表，可进入老师详情。
• 托育服务：展示该园区上架的服务列表，可进入服务详情。
• 收藏：登录后可收藏/取消收藏该园区。
• 立即咨询：登录后向该园区发起咨询，自动进入与园区客服的私聊，并附带园区信息卡片。
• 分享：可将园区详情分享给微信好友（小程序）或复制链接（H5）。

老师详情 · 了解一位托育老师

• 老师相册、姓名、毕业院校、学历、教龄、荣誉标签、从业经历、擅长领域、服务内容。
• 所属园区简要信息（名称、地址、营业时间），可跳转园区详情。
• 浏览量、收藏量；支持收藏、立即咨询、分享。

服务详情 · 了解一项托育服务

• 服务相册、名称、类型、适龄范围、价格与计价单位（仅展示，不含在线支付）、服务标签。
• 服务目标、详细介绍、时间安排、咨询须知。
• 所属园区信息；支持收藏、立即咨询、分享。

新手妈妈（动态）· 社区交流

• 推荐 / 关注 两个 Tab：
  • 推荐：浏览所有用户发布的动态。
  • 关注：只看您已关注的人发的动态。
• 每条动态展示：发布者头像昵称、发布时间、文字内容、配图（或视频标识）、浏览量、点赞数、评论数。
• 点赞：给动态点赞或取消点赞。
• 评论：进入动态详情页发表评论、回复，也可给评论点赞。
• 关注用户：在动态流或用户主页关注/取消关注其他用户。
• 发动态：登录后发布文字 + 最多 9 张图片的动态。
• 个人主页：点击头像进入用户公开主页，查看其资料、互动统计和 TA 发布的动态列表。

托育资讯 · 阅读育婴文章

• 顶部专题入口：如「科学育儿」「营养饮食」等分类卡片，点击进入该分类文章列表。
• 分区列表：首页按分区展示文章（横向滑动大图、网格、列表等多种布局），点击「更多」进入完整列表。
• 资讯详情：
  • 阅读文章全文（标题、来源、发布时间、正文段落）。
  • 查看浏览量；点赞 / 取消点赞；收藏 / 取消收藏。
  • 发表评论、删除自己的评论。
  • 分享给微信好友（小程序）。
• 若网络异常，部分资讯会降级展示内置示例内容，保证页面可用。

消息 · 通知与聊天

• 消息列表：
  • 系统通知：平台推送的注册成功、审核结果、反馈回复、账号注销等消息；未读数显示角标。
  • 私聊会话：与园区客服、其他用户的一对一聊天列表，显示最后一条消息摘要和未读数。
• 底部 Tab 角标：消息 Tab 显示私聊 + 系统通知的未读总数。
• 私聊聊天页：
  • 发送和接收文字、图片、表情消息；接收语音消息（可播放；当前版本已去掉小程序端「按住说话」发语音入口）。
  • 咨询场景下会自动发送咨询来源卡片（展示您咨询的园区/老师/服务信息，点击可跳转详情）。
  • 常用语：预设快捷回复语，可新增、编辑、删除。
  • 聊天记录：查看与该会话的历史消息，支持搜索。
  • 长按消息可复制内容；可删除自己发送的消息。
  • 消息通过 WebSocket 实时收发，无需手动刷新。
• 进入聊天的方式：
  • 在园区/老师/服务详情点击「立即咨询」。
  • 在消息列表点击已有会话。
  • 联系平台在线客服。

我的 · 个人中心

账号概览

• 头像、昵称；未登录时显示「点击登录」。
• 登录后显示邀请码或账号 ID。
• 我的点赞 / 历史浏览 / 我的收藏 三个统计数字，分别进入对应记录列表。

快捷入口

• 我的主页：查看自己的公开主页（资料、互动数据、我发布的动态）。
• 园区入驻 / 审核进度 / 园区工作台：根据您的入驻状态显示不同文案（见下文「托育园区」部分）。

功能菜单

我的记录页

• 我的点赞：您点赞过的动态、资讯等，点击可回到详情。
• 历史浏览：您浏览过的园区、老师、服务、资讯，点击可回到详情。
• 我的收藏：您收藏的园区、老师、服务、资讯，点击可回到详情。

登录、注册与账号

托育园区能做什么

完成园区入驻申请且平台审核开通后，可使用「园区工作台」及相关管理功能。

园区入驻申请

• 在「我的」页点击「园区入驻」进入申请页。
• 填写：园区名称、负责人姓名、***、地址（地图选点自动填入经纬度）、托育类型（至少 1 个，可自定义）、园区设施（选填）、营业时间、园区介绍、环境说明、特色、服务流程等。
• 上传：园区实景照片、营业执照、法人身份证正反面。
• 提交后状态变为「待审核」，可在「审核进度」页查看：
  • 待审核 → 已通过 → 已开通（可进入工作台）
  • 若被拒绝，会显示拒绝原因，修改资料后可重新提交。

园区工作台（审核开通后）

工作台首页

• 展示园区名称、当前登录角色、未读消息数。
• 咨询管理：待领取、咨询中、已结束等待处理数量，快捷进入咨询列表。
• 内容管理：在册老师数、上架服务数、待完善资料提示等。
• 运营数据：浏览量、收藏量、咨询量等统计概览。
• 快捷入口：园区资料、老师管理、服务管理、员工管理、消息、数据统计。

园区资料

• 编辑园区封面、相册、托育类型、设施、地址（地图选点）、营业时间、***、介绍等。
• 保存草稿 / 发布上架 / 隐藏 / 恢复展示。
• 上传并更新资质证件图片。

老师管理

• 新增、编辑老师：姓名、头像、相册、毕业院校、学历、教龄、荣誉标签、从业经历、擅长、服务内容等。
• 发布 / 隐藏 / 恢复 / 标记离职。
• 家长端仅能看到「已发布」的老师。

服务管理

• 新增、编辑托育服务：名称、封面、相册、服务类型、适龄、价格（展示用）、标签、目标、介绍、时间说明、咨询须知等。
• 发布 / 隐藏 / 恢复 / 复制 / 删除草稿。
• 家长端仅能看到「已发布」的服务。

员工管理（管理员角色）

• 按手机号邀请已有用户端账号的用户加入园区团队。
• 分配角色（如管理员、客服等）。
• 启用 / 停用员工、修改角色。

咨询管理

• 查看全部 / 咨询中 / 已结束 / 无效 各状态的咨询单。
• 待领取：客服可「领取」咨询单，或与用户开始对话。
• 咨询中：回复用户、转交同事、标记结束、标记无效（需选择原因）。
• 回复后用户会在私聊中收到消息；咨询单与用户私聊会话关联。

园区消息

• 查看平台或系统推送给园区的通知（如新的咨询、审核结果等）。
• 未读消息数在工作台和 Tab 角标展示；支持单条已读、全部已读。

数据统计

• 互动数据：浏览量、收藏量、咨询量等。
• 经营概况：老师数、服务数、在架内容数等汇总。

分享与邀请推广

• 每位登录用户拥有专属邀请码。
• 分享好友页：
  • 展示头像、昵称、邀请码。
  • 文案推广：一键复制带邀请码和链接的推广文字。
  • 生成海报：将邀请二维码合成到海报背景上，保存到相册或下载（H5）。
  • 立即分享：微信小程序内点击按钮分享给微信好友。
• 内容分享：在园区、老师、服务、动态、资讯详情页，均可分享；分享链接自动带上您的邀请码。
• 新用户通过您的链接或邀请码注册后，与您建立邀请绑定关系（具体奖励规则以后台配置为准）。

技术栈

体验地址

线上 API 与体验环境：https://tuoyu.xianmaxiong.com

本地运行

这份代码已对接线上体验环境，默认不用改配置，打开后直接运行即可（API 地址见 common/config.js）。

开始前请准备

1. 一台 Windows 或 Mac 电脑。
2. 下载安装 HBuilderX（官方开发工具）：
   打开 https://www.dcloud.io/hbuilderx.html，下载「正式版」并安装。
3. 建议安装 Chrome 浏览器，用于运行 H5 页面。

第一步：打开项目文件夹

1. 找到本仓库里的 tuoyu-app 文件夹（里面有 pages.json、App.vue、common 等）。
2. 记住文件夹路径，后面要在 HBuilderX 里选中这一层目录。

第二步：用 HBuilderX 导入

1. 打开 HBuilderX → 文件 → 打开目录。
2. 选中 tuoyu-app 文件夹，确定。
3. 左侧出现文件树即表示成功。

第三步：运行到浏览器

1. 菜单 运行 → 运行到浏览器 → Chrome。
2. 首次可能提示安装插件，按提示安装后重试。
3. 浏览器弹出页面，能看到首页和底部五个 Tab，即运行成功。
4. 若提示获取位置，点「允许」，首页才能按距离排序。
5. 保持 HBuilderX 不要关闭，否则调试可能中断。

运行到微信小程序

1. 菜单 运行 → 运行到小程序模拟器 → 微信开发者工具。
2. 需本机已安装微信开发者工具并完成关联。
3. 小程序 AppID 见 manifest.json 中 mp-weixin.appid；真机预览需使用对应小程序账号权限。

常见情况

第一次验收建议

1. Chrome 打开后能看到首页托育园列表和底部五个 Tab。
2. 点「我的」能看到登录入口和统计区域。
3. 点「托育资讯」能看到文章分区列表。
4. 点「新手妈妈」能浏览动态流。
5. 未登录时点击「立即咨询」会提示先登录。

做到以上几点，说明用户端已在本地跑通。

许可证

见本目录下 LICENSE 文件（GNU LGPL v3）。