更新记录

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

本项目仅开源 uni-app 用户端，基于 Vue3，适配电脑/手机网页、微信小程序等。用 HBuilderX 导入本目录即可运行，供学习研究。

平台兼容性

uni-app(3.8.7)

其他

友菜友饭用户端

开源说明

本项目仅开源 uni-app 用户端，基于 Vue3，适配电脑/手机网页、微信小程序等。用 HBuilderX 导入本目录即可运行，供学习研究。

能在哪些地方使用

需要请厨师上门做饭的家庭用户，可以在电脑或手机的网页里使用，也可以在微信小程序里使用。同一套用户端里，厨师（师傅）也可以申请入驻、接单、管理菜品套餐和收益。

底部有四个主入口：首页、动态、订单、我的。

对接了哪些第三方

下面这些是用户日常能直接感受到的外部服务，不是技术名词堆砌：

• 手机定位 / 选点：打开后可识别当前城市；新增服务地址时可在地图上选点（微信小程序等端会调用系统选点能力），方便厨师按地址上门。
• 微信支付：下单付套餐费、开通会员、钱包相关付款时，在微信小程序或 App 里可走微信支付。普通电脑浏览器网页一般不出现微信支付。
• 支付宝：在电脑/手机网页或 App 里下单、开通会员时，可走支付宝（小程序里通常不展示支付宝）。
• 钱包余额：平台自己的余额支付；退款、活动奖励等会进钱包；余额不够时可换微信或支付宝。
• 手机短信验证码：在网页端用手机号登录时，会往手机发验证码（由服务端发送）。
• 微信一键登录：在微信小程序里，可先微信授权，再授权手机号完成登录。
• 人工智能（小友 AI）：可切换 DeepSeek、腾讯混元，咨询菜单搭配、菜谱做法、时令食材等，并可快捷跳到套餐列表等页面。
• 平台在线客服：登录后可在帮助中心里和平台客服即时发消息。
• 电话：后台若配置了客服电话，可在帮助相关信息里看到服务时间；师傅端可拨打顾客电话联系上门。
• 手机系统能力：获取定位、从相册选头像/证件/菜品图、保存图片、复制订单号、拨打电话等。

说明：具体支付渠道、短信、AI 是否真正可用，取决于线上后台是否已配置对应账号；开源学习时，页面按钮一般都能看到，部分第三方能力可能点了没反应。

游客能做什么

下面说的「游客」，指还没登录账号的人。能看的内容很多；涉及下单、发帖、收藏、钱包等，会提示先登录。

打开软件先看到什么（首页）

• 自动定位当前城市，也可以自己选城市。
• 顶部能搜索厨师、菜系或套餐；旁边有消息铃铛（登录后才有未读数）。
• 有轮播广告图，点进去可跳到对应活动或页面（具体以后台配置为准）。
• 有一排快捷入口（例如精选套餐、明星厨师、私人定制、限时秒杀、小友 AI、师傅入驻、贵宾会员等，名称和跳转以后台配置为准）。
• 限时秒杀：横向滑动看特价套餐，有倒计时和「已抢百分之多少」。
• 推荐套餐：看封面、标题、适合人数、销量、现价和原价；可进「查看全部」。
• 明星厨师：横向滑动看头像、姓名、评分、菜系等；可进「查看全部」。
• 下拉可刷新首页。

找厨师、看厨师详情

• 进「明星厨师」列表：可按菜系等筛选，按综合、销量、好评、距离排序。
• 打开某位厨师详情：看介绍、服务配备（如厨具包、厨房清洁、菜单定制、食材代购等说明）、评价、可服务时间。
• 可浏览菜品信息；「收藏厨师」「立即预约」需要登录。
• 预约时会确认起步价，再进入确认订单页（选地址、服务日期时段、选菜等）。

订精选套餐、秒杀、活动

• 进「精选套餐」列表，打开套餐详情看菜品组合、价格、说明。
• 限时秒杀、最新活动列表可浏览；真正下单付款需要登录。
• 下单前会进入「确认订单」：选择上门服务地址、服务日期、服务时段；若是约厨师还可选菜品；可勾选附加服务、选用优惠券，看计价后再付款。

私人定制

• 打开「私人定制」：按场景卡片选择（例如家庭宴请、公司团建等，以后台配置的场景为准）。
• 流程大致是：选择场景 → 提交需求 → 匹配厨师报价 → 上门服务。
• 填写定制需求、查看「我的定制」、接受报价并下单，一般需要登录。

动态广场（底部「动态」）

• 游客可看「推荐」「附近」里别人分享的美食动态（文字、图片、视频等）。
• 「关注」流需要登录后才有内容。
• 搜索美食与厨师：游客可搜；搜索历史登录后才完整保存。
• 点赞、评论、关注、发布动态、收藏等需要登录。
• 动态详情可浏览；互动操作同样需要登录。

付钱怎么付（登录后）

• 下单或开通会员后弹出支付方式，按当前打开环境显示，常见包括：
  • 微信支付（小程序 / App 等）
  • 支付宝（网页 / App 等）
  • 钱包余额
• 可先选一张优惠券再付款。
• 支付成功后订单生效；没付完可在「订单」里继续「去支付」。

订单里能看到什么（登录后）

• 底部「订单」按状态筛选：待支付、待服务、已完成、售后。
• 订单详情里有：订单状态、订单编号、下单时间、服务时间、上门地址、厨师信息、「联系厨师」、菜品清单、费用明细、实付金额、服务进度时间线（如已接单、厨师出发、待完成等，有的步骤可看凭证图）。
• 待支付可取消订单或继续支付。
• 服务完成后可「去评价」（打分、写评语）。
• 订单状态与售后进度以页面显示为准。

优惠券、钱包、会员（登录后）

• 领券中心领券；「我的优惠券」查看已领的券。
• 「我的钱包」看账户余额和收支流水（消费、退款、充值、系统调整等）。
• 「贵宾会员」看专属权益说明，选月度 / 季度 / 年度等套餐后付款开通。

账号、地址、社交、客服

• 网页端：手机号 + 短信验证码登录（未注册会按业务规则自动注册）。
• 微信小程序：微信授权登录 → 再授权手机号。
• 登录前需同意《用户协议》《隐私政策》。
• 「我的」里可改头像、昵称、手机号、性别、简介。
• 服务地址：新增 / 编辑上门地址（省市区、详细地址、地图选点、家庭/公司等标签、是否默认）。
• 我的动态 / 关注 / 粉丝 / 点赞 / 收藏：管理自己的社交内容；收藏可按餐品、厨师、动态分类查看。
• 消息中心：看系统通知等，未读会提示。
• 帮助 / 客服中心：搜常见问题（用餐、支付退款、厨师服务、会员权益等）；可进「在线客服」聊天（需登录）。客服电话与服务时间以后台配置为准。
• 系统设置：修改登录密码、绑定手机号、通知开关、关于与协议、退出登录等。
• 小友 AI：未登录也可进入对话页咨询；部分能力依赖后台是否配置了 AI 密钥。

师傅入驻入口

• 「我的」底部有「师傅入驻」或（已通过审核后）「师傅工作台」。
• 游客点入驻会先要求登录，再填写入驻资料。

师傅（商家）能做什么

审核通过后，「我的」入口会变成「师傅工作台」，主要能力如下：

• 申请入驻：填真实姓名、手机、身份证；上传资质照片（如证件、健康证等）；提交后看审核状态（待审核 / 通过 / 拒绝）。
• 工作台首页：开关「接单中 / 已暂停」；看今日订单、本月接单、累计用户、好评率等；待办任务；进行中订单；平台公告。
• 订单管理：按新待接单、待服务、进行中、已完成、售后退款等处理；可接单、拒单、更新服务状态、改单报备；可打电话联系顾客。
• 档期日历：安排自己可接单的日期时间。
• 菜品管理 / 套餐管理：新增、编辑自己的菜品和套餐。
• 定制报价：查看用户定制需求并提交报价。
• 收益中心 / 账单 / 提现：看收入；提现到支付宝、微信或银行卡（需先绑定收款信息）。
• 评价、数据报表、平台任务、消息通知、接单设置、资质认证、个人中心与设置等。

体验

体验地址：https://yfanycai.xianmaxiong.com

（手机或电脑浏览器直接打开即可预览；微信小程序需在微信里搜索对应小程序，以实际发布名称为准。）

技术栈

运行

这份代码已经接到线上体验环境，不用改任何配置，打开后直接运行即可。

开始前请准备

1. 一台 Windows 电脑（苹果电脑也可以，步骤差不多）。
2. 下载并安装 HBuilderX（官方用来打开这类项目的软件）：
   打开浏览器，搜索「HBuilderX 官网」，进入 https://www.dcloud.io/hbuilderx.html，下载「正式版」，安装后打开。
3. 建议再装一个 Chrome 浏览器，用来打开运行后的页面。

第一步：拿到文件夹

1. 如果你收到的是压缩包（例如 zip），先右键「解压到当前文件夹」或「解压到指定文件夹」。
2. 解压后，请找到名字叫 youcaiyoufan-user-uview 的文件夹。里面应该能看到 pages.json、App.vue、common、pages 等文件和目录。
3. 记住这个文件夹在电脑上的位置，后面要选中它。不要只打开里面某一个文件。

第二步：用 HBuilderX 打开整个项目

1. 打开已经安装好的 HBuilderX。
2. 点左上角 「文件」→「打开目录」（有的版本也叫「从本地打开」）。
3. 选中刚才的 youcaiyoufan-user-uview 文件夹，确定。
4. 左侧出现一长串文件名，就说明打开对了。如果左侧是空的，说明选错了文件夹，请重新选带 pages.json 的那一层。

第三步：用浏览器运行

1. 在 HBuilderX 顶部菜单点 「运行」→「运行到浏览器」→「Chrome」。
2. 第一次可能会提示安装浏览器运行插件，点允许或安装，等它装完再重新点一次运行。
3. 电脑会自动弹出一个网页。出现首页、底部「首页 / 动态 / 订单 / 我的」，就说明运行成功了。
4. 如果浏览器问能不能获取位置，点「允许」，首页才能显示当前城市。
5. 不要关 HBuilderX，关了网页可能会断开。

常见情况说明

• 点了运行没反应：确认打开的是整个 youcaiyoufan-user-uview 文件夹，不是只打开了一个页面文件。
• 浏览器打开了但是花屏、一直转圈：等十几秒；仍不行就关掉网页，在 HBuilderX 里再点一次运行。
• 页面是空的、提示加载失败：检查电脑能否打开体验地址 https://yfanycai.xianmaxiong.com ；如果这个网页本身打不开，用户端也会没数据。
• 定位失败或选不了地址：需要允许浏览器/手机的定位权限；学习看页面时可以先手动选城市。
• 微信支付、支付宝点了没反应：需要商家自己的支付账号，这份开源代码一般只能看到支付按钮，不能真的完成收款（或仅部分环境可用）。
• 短信验证码收不到、在线客服/AI 无回复：这些依赖服务端和第三方账号，界面可以点，功能不一定通。
• 想跑微信小程序：需安装「微信开发者工具」，在 HBuilderX 里选「运行到小程序模拟器 → 微信开发者工具」，并在 manifest.json 里使用你自己的小程序 AppID。

第一次建议怎么验收

1. 按第三步在 Chrome 打开。
2. 能看到首页轮播或推荐内容、底部四个按钮（首页 / 动态 / 订单 / 我的）。
3. 点「动态」，能看到动态列表或空状态提示。
4. 点「我的」，能看到登录入口或个人中心。
5. 再点「订单」，能进入订单页（未登录可能提示登录，也算正常）。
   做到这里，就说明「这份用户端代码已经在你电脑上跑起来了」。