全源码提供-专业舒适的理疗按摩上门预约小程序

码视野

712人浏览 · 2026-05-27 12:11:49

码视野 · 2026-05-27 12:11:49 发布

一个面向推拿按摩、中医理疗行业的O2O上门预约平台，覆盖客户 + 理疗师 + 管理后台，基于 Vue 3 构建。

项目背景

大健康产业年增速超过 15%，推拿按摩、艾灸拔罐、运动康复等理疗服务正在从门店走向上门。但大多数理疗馆还在用微信接单、纸质排班——客户不知道哪位理疗师有空、理疗师不知道下一个客户在哪、老板靠记忆算分成。

理疗按摩上门预约小程序正是为这个场景设计的一站式 O2O 平台，目标是打通"服务浏览 → 选择理疗师 → 在线下单 → 上门服务 → 进度追踪 → 评价"的完整业务闭环。

适用场景包括：推拿按摩馆、中医理疗馆、足疗养生馆、运动康复中心、产后恢复中心和独立理疗师个人接单。

技术选型

层级	技术栈
前端框架	Vue 3 + Composition API
路由	Vue Router 4
状态管理	Pinia
构建工具	Vite
UI 风格	自定义 CSS 变量体系，移动端优先
目标平台	微信小程序 / H5 / App（UniApp 可扩展）

功能全景

客户端（移动端）

1. 登录页

slogan"专业理疗师到家，舒缓解压零距离"，支持微信和手机号登录。底部提供管理员入口和理疗师入口。

登录页

2. 首页

Banner"专业理疗上门服务 · 推拿·艾灸·拔罐·康复足不出户享专业调理"。6 大分类：推拿按摩、中医理疗、足疗养生、运动康复、产后恢复、刮痧拔罐。推荐理疗师横向滚动展示，热门服务直达预约。

3. 理疗师列表与详情

支持按专长筛选（推拿/艾灸/拔罐/康复/产后），按评分/服务次数排序。理疗师详情展示资质证书（高级推拿师、中医康复理疗师等）、擅长项目、顾客评价。底部固定价格和预约按钮。

理疗师列表

理疗师详情

4. 服务项目

按分类 Tab 筛选 8 项服务：全身经络推拿 ¥238、肩颈腰部调理 ¥168、中医艾灸理疗 ¥188、拔罐刮痧 ¥128、足疗按摩 ¥158、运动康复 ¥298、产后骨盆修复 ¥368、深层筋膜松解 ¥218。

服务项目

5. 下单确认

3 步流程：选服务 → 填写信息 → 确认支付。特色备注栏"请描述身体状况、偏好力度、有无禁忌部位"，理疗师上门前就能了解客户情况。

确认下单

6. 订单详情与服务进度

6 步追踪：已派单→已接单→已出发→已到达→服务中→已完成。每步带时间戳，联系理疗师一键拨号。

订单详情

7. 我的订单与个人中心

按状态筛选订单，个人中心展示统计数据和功能入口。

我的订单

个人中心

理疗师端（移动端）

理疗师独立工作台，底部 3 Tab。工作台展示今日订单、本月收入、评分，待接单和进行中订单分开展示。支持订单筛选、进度上报、收入统计和提现。

理疗师订单

理疗师收入

理疗师工作台

管理后台（PC 端）

数据看板

4 指标卡片：今日订单、本月营收、在线理疗师、待分配。趋势图和最近订单表格。

数据看板

订单管理与理疗师管理

全平台订单筛选分配，理疗师入驻审核、资质管理。

订单管理

理疗师管理

项目结构

24-frontend-massage/src/
├── router/index.js                # 三端 33 条路由，含短路径别名
├── stores/app.js                  # 集中式数据（分类/服务/理疗师/地址/订单）
├── pages/
│   ├── LoginPage.vue / HomePage.vue / MainLayout.vue
│   ├── TherapistListPage.vue / TherapistDetailPage.vue
│   ├── ServiceListPage.vue / OrderConfirmPage.vue
│   ├── OrderDetailPage.vue / OrdersPage.vue / MyPage.vue
│   ├── therapist/                  # 理疗师端 5 页
│   └── admin/                      # 管理后台 7 页