更新记录

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

本项目仅开源 uni-app 用户端，基于 Vue2，适配网页和微信公众号。用 HBuilderX 导入本目录即可运行，供学习研究。

平台兼容性

uni-app(3.8.10)

其他

上门洗车用户端

开源说明

本项目仅开源 uni-app 用户端，基于 Vue2，适配网页和微信公众号。用 HBuilderX 导入本目录即可运行，供学习研究。

能在哪些地方使用

想洗车的人可以在电脑或手机的网页里使用，也可以在微信里打开网页使用。洗车师傅上门，人不用把车开去店里。

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

先记住这几个词，后面会反复用到：

• 站点：附近负责接单、派洗车师傅的门店。下单时会带出离你最近的站点。
• 会员价：开通会员后，同一种洗车服务可以用更低的会员价。没开通就按普通价。
• 零钱：平台里的余额，付款时可以当钱用。
• 优惠卡：事先买好的月卡或次卡。下单时如果还有次数，可以直接抵这次洗车。
• 确认码：师傅到了之后，订单里会给出一串数字，给师傅核对，用来确认是你的这一单。

对接了哪些第三方

下面这些是洗车时能直接碰到的外部服务，按日常使用来写：

• 腾讯地图：打开后识别当前城市，也可以自己换城市。下单时在地图上点选车辆停在哪里。订单详情里可以打开地图，导航到这辆车的位置。
• 微信支付：确认下单后，付款窗口里可以选择微信。手机网页上要在微信里打开，才会出现微信支付。微信小程序里付款也走微信。
• 支付宝：电脑网页、手机网页和手机 App 里，付款窗口可以选择支付宝。
• 零钱：平台自己的余额。付款窗口里有「零钱」，用账户里的钱付。
• 优惠券：领券中心领到的券，下单时可以选一张，少付一部分。也可以选「不使用优惠券」。
• 优惠卡：月卡或次卡。有可用的卡时，下单页会出现「优惠卡」，点进去选一张。
• 手机短信验证码：登录、注册、找回密码、换绑手机号时，会往手机号发一条验证码（由服务端发送）。
• 微信登录：在微信里打开网页时，如果打开了这个入口，登录页会有「微信登录」。微信小程序里是「授权登录」，还可以授权手机号。
• 企业微信客服：首页右下角和「我的」里的客服，如果配的是企业微信，会跳去和企业微信客服聊天。微信小程序里会打开微信客服会话。
• 电话客服：如果客服配的是电话，点一下就直接拨打。
• 客服二维码：如果客服配的是二维码，会打开二维码页面，用微信扫一扫添加。
• 给洗车师傅打电话：订单进行中，订单详情里能看到师傅名字，点电话图标直接拨打。
• 手机系统能力：获取当前位置、在地图上点选停车位置、打开地图导航、拨打电话、从相册选头像。

说明：微信支付和支付宝要有对应的收款账号。这份开源代码一般能看到付款按钮，不能真的把钱收进来。短信和客服也一样，按钮可以点，能不能打通取决于账号是否配好。

洗车的人能做什么

打开软件先看到什么

• 顶部是蓝色条。左边是当前城市，点一下可以换城市。定位关掉时，这一行不显示城市。
• 右边是滚动提示，带头像，内容是「某某刚刚下单」。没有人下单时，会显示一句欢迎下单的话。
• 下面是轮播广告，自动切换，点图片可跳到对应内容。
• 有一排圆形快捷入口，例如不同洗车项目。这个入口可以关掉，以打开后看到的为准。
• 再往下是洗车服务列表。每条能看到封面、服务名称、服务标签、已经服务过多少人、价格，右边是「立即下单」。
• 开通了会员，列表和详情里显示的是会员价；没开通显示普通价。详情里两种价格会一起写出来，会员价旁边写着「会员尊享」。
• 列表下面如果配了视频，会直接播放一段介绍视频。
• 再下面可能还有一张通栏广告图。
• 页面可以下拉刷新。
• 右下角一直有一个客服按钮，点了就去联系客服。
• 第一次进来，可能会弹出一个新人红包，点一下领取优惠券。

看一种洗车服务

点首页上的「立即下单」或点进某条服务，进入服务详情：

• 顶部是一张大图，点一下可以放大看。
• 能看到普通价、会员尊享价、服务名称、已服务人数，以及几个服务标签。
• 下面三行说明：服务项目、适合车型、服务保障。适合车型用来告诉你这套服务适不适合你的车。
• 用户评价：有评价时显示头像、名字、几颗星、评价内容，可以点「查看全部」。没有评价会写「暂无评价」。
• 再下面有三个切换：服务详情、温馨提示、服务流程。点哪个就看哪一段说明。
• 底部是当前价格和「立即下单」。自己发布的服务不会给自己下单。没登录会先去登录。

填写洗车信息

点「立即下单」后，要告诉师傅车在哪、什么时候来：

• 车辆位置：点这一行打开地图，在地图上点车辆停着的地方。选好后，这一行会显示地点名称。
• 附近站点：按这个位置带出离你最近、可以接单的站点。没有合适站点时，会提示当前地址附近没有站点。
• 停靠位置：自己再写一句更具体的话，比如地下车库 B2、几号楼旁边，方便师傅找到车。
• 选择车辆：从「我的车库」里选一辆已经添加的车，选中后显示车牌。这个选项有时不出现，以打开后看到的为准。
• 车主姓名、***：师傅联系你用。
• 预约时间：点一下弹出日期和时间，选师傅什么时候到。
• 优惠券：有券时可以选一张，也可以不使用。
• 优惠卡：有月卡或次卡时可以选一张，用次数或月卡抵这次洗车。
• 备注说明：写额外要求，比如「请重点洗轮毂」。
• 底部是实付金额和「立即下单」。

没填车辆位置、停靠位置、姓名、电话或预约时间，点下单时会提示先补上。

付钱怎么付

点「立即下单」后，从底部弹出「选择支付方式」。能看到哪些，取决于你现在是用网页、微信还是手机 App 打开：

• 支付宝：网页和手机 App 里常见。
• 微信：在微信里打开，或使用微信小程序、手机 App 时出现。
• 零钱：用「我的钱包」里的余额付。

选好后确认支付。支付成功，这一单就生效。没付完的，可以在「订单」里继续「去支付」。

订单里还能做什么

底部「订单」，或「我的」里的「我的订单」，进入订单列表。上面可以切换：

全部、待付款、待接单、待服务、待确认、进行中、已完成、已取消。

每一单能看到状态、时间、服务图片、服务名称、服务标签、实付金额。

不同状态可以做的事不一样：

• 待付款：可以取消，也可以继续去支付。
• 待接单：站点还没接，可以取消。
• 进行中：可以看确认码。确认码是一串大号数字，给上门的师傅核对。也可以点「订单完成」。
• 待确认：可以点「确认完成」，表示你认可这次洗完了。
• 已完成：可以去评价，打分、写评价。也可以去投诉。投诉过的可以在「投诉记录」里回看。
• 点进某一单看订单详情。

订单详情里：

• 再看一遍服务名称、标签和实付金额。
• 进行中、已完成或待确认时，能看到洗车师傅的名字，点电话图标直接打给师傅。
• 能看到车辆所在城市和位置，点地图图标打开地图，导航到这辆车。

我的车库和地址

洗车是按「车停在哪」来的，不是按收货地址寄东西。

• 我的车库：在「我的」里添加自己的车，下单时从这里选车牌。
• 车辆位置每次下单都在地图上重新点一次，并可以再写一句停靠说明。

账号和登录

• 登录页点「手机号登录」。
• 手机号 + 短信验证码登录。没注册过会去注册。
• 手机号 + 密码登录。
• 注册要填：用户名、手机号、验证码、密码。邀请码有时必填，有时选填。从别人的分享链接进来，邀请码会自动带上。
• 忘记密码后，用手机验证码重置。
• 也可以换绑手机号，同样要验证码。
• 登录前要勾选同意《隐私政策》和《用户服务协议》。
• 在微信里打开时，可能同时有「微信登录」和「手机号登录」。
• 微信小程序里是授权登录，并可以授权手机号。
• 登录后，「我的」顶部是头像、昵称和 ID。点头像可以改个人资料。
• 没登录时，这里只显示「登录」。

会员、钱包、券

• 会员：登录后「我的」上方有一条开通入口。没开通显示「去开通」，开通后显示「已开通」。开通后下单按会员价。
• 我的钱包：看零钱余额，付款时选「零钱」就从这里扣。
• 领券中心：领取优惠券。
• 我的券包：看已经领到、还没用的券。
• 我的优惠卡：看月卡、次卡还剩多少次。

我的、客服、帮助

「我的」里还有这些入口，是否出现以打开后实际看到的为准：

• 代理商中心：申请成为代理商。
• 推广中心：把洗车分享给别人。
• 站点管理：已经是站点的人，可以进自己的站点。普通人看不到这个入口。
• 投诉记录：看自己投诉过的订单。
• 职务招聘：看洗车相关的招聘。
• 分享好友：邀请朋友一起用。
• 招商加盟：看加盟说明。已经是代理商的人，这个入口会隐藏。
• 客服中心：按当前配置，可能是打电话、打开企业微信，或显示客服二维码。首页右下角的客服按钮也是同一套。
• 帮助中心：看常见问题。
• 设置中心：协议、关于、退出登录等设置。
• 右上角有消息图标，点进去看系统消息。

体验

体验地址：https://xichewap.xianmxkj.com

技术栈

运行

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

开始前请准备

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

第一步：拿到文件夹

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

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

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

第三步：用浏览器运行

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

常见情况说明

• 点了运行没反应：确认打开的是整个 上门洗车 文件夹，不是只打开了一个页面文件。
• 浏览器打开了但是花屏、一直转圈：等十几秒；仍不行就关掉网页，在 HBuilderX 里再点一次运行。
• 页面是空的、提示加载失败：检查电脑能否打开体验地址 https://xichewap.xianmxkj.com ；如果这个网页本身打不开，用户端也会没数据。
• 地图不显示或定位失败：需要腾讯地图的钥匙（项目里已预填，有过期或额度用完的可能）。学习看页面时可以先忽略地图。
• 微信支付、支付宝点了没反应：需要商家自己的支付账号，这份开源代码一般只能看到支付按钮，不能真的完成收款。
• 客服、短信验证码收不到：这些依赖服务端和第三方账号，界面可以点，功能不一定通。

第一次建议怎么验收

1. 按第三步在 Chrome 打开。
2. 能看到首页洗车服务、底部三个按钮。
3. 点「我的」，能看到登录入口。
4. 再点「订单」，能进入订单页。
   做到这里，就说明「这份用户端代码已经在你电脑上跑起来了」。