美发门店预约小程序

美发门店预约系统由三端组成：微信小程序（顾客端）、Vue3 管理后台（运营端）、Express API（服务端），共享同一 MySQL 业务库。

一、各端功能说明

1. 微信小程序（min/）

面向顾客的预约与会员入口，品牌为「焕发造型」。底部 Tab：门店 / 资讯 / 我的。

1.1 门店与预约

预约规则（前端配合后端）：

• 时段按门店营业时间 / 技师个人档期计算，粒度半小时
• 技师请假、已被占用的时段不可约；过期未约用删除线，不向顾客展示「技师休息」等内部原因
• 下单成功生成预约码（order_no），费用从会员钱包扣除（项目价 + 加购，按 VIP/SVIP 折扣）

1.2 订单与评价

1.3 资讯与内容

1.4 会员中心

2. 管理后台（admin-vue3/）

面向门店运营人员的 Web 中台，按菜单分组如下。

2.1 数据洞察

2.2 门店运营

2.3 交易与用户

2.4 内容与反馈

2.5 登录与权限

• 账号密码登录（管理员角色，演示账号见运行手册.md）
• Token 存本地，路由守卫控制未登录跳转登录页

3. 服务端 API（express/）

统一业务与数据入口，静态资源与上传文件也由此提供。

3.1 接口分区

3.2 核心业务能力

• 鉴权：Authorization: Bearer <token>；区分顾客与管理员
• 微信登录：必须wx.logincode 走jscode2session换到真实 openId 才发 Token；新用户默认昵称「微信用户」、默认头像/images/avatar/default-avatar.jpg；头像/昵称在个人信息页修改。依赖config/index.js中 AppId / AppSecret 与当前小程序一致
• 档期引擎（util/schedule.js）：合并门店营业时间、技师个人档期、请假、已约订单，输出半小时粒度可约时段；小程序 slots 不返回请假原因等内部字段
• 下单与支付：校验门店/项目/技师归属与时段可用性；价格以后端项目 + 加购 + 会员折扣为准；钱包扣款；生成预约码
• 取消与退款：顾客须在服务开始前 2 小时取消并退钱包；管理端取消不受该时限限制
• 请假：与待到店预约时段冲突时接口返回 409 及冲突列表，不写入请假、不自动取消退款
• 核销与改派：待到店 → 已完成；改派须同门店在职技师，并校验目标日期/时段（请假、占用、服务时长）
• 库初始化（config/initDb.js）：首次启动可自动导入db_hair_salon.sql（已存在则跳过）

3.3 统一响应约定

成功示例：{ code: 200, msg, data }。业务失败以非 200 的code与msg返回。

二、项目文件目录

约定：图片目录、第三方插件不展开；小程序页面只列目录名（内含标准js/json/wxml/wxss）；关键目录与文件右侧备注用途。已排除node_modules/、.git/、构建产物。

node-hair-salon-min/ ├── db_hair_salon.sql # 数据库结构 + 演示种子数据 ├── 项目说明.md # 本说明（功能 + 目录） ├── 运行手册.md # 环境与启动步骤 ├── SQL自动导入.md # 后端启动自动导库说明 ├── 演示材料/ # 演示素材 │ └── 演示视频.mp4 # 功能演示录像 ├── .gitignore │ ├── express/ # 后端 API（默认 :3564） │ ├── app.js # Express 入口、中间件、静态目录挂载 │ ├── package.json │ ├── bin/ │ │ └── www # HTTP 监听启动 │ ├── config/ │ │ ├── index.js # 业务配置（小程序 AppId 等） │ │ ├── dbConfig.js # 数据库连接配置 │ │ ├── db.js # SQL 查询封装 │ │ └── initDb.js # 首次启动建库 / 导入 SQL │ ├── middleware/ │ │ └── auth.js # Token 鉴权（顾客 / 管理员） │ ├── util/ │ │ ├── schedule.js # 档期 / 请假 / 可约时段计算 │ │ ├── wechat.js # 微信登录（jscode2session，失败不发假 openId） │ │ └── index.js # 通用工具 │ ├── routes/ │ │ ├── index.js # 路由总挂载 │ │ ├── upload.js # 文件上传接口 │ │ ├── paylistMid.js # 充值相关中间逻辑 │ │ ├── web/ # 小程序端 API │ │ │ ├── index.js # web 路由汇总 │ │ │ ├── shop.js # 门店列表 / 详情 │ │ │ ├── cate.js # 服务项目 │ │ │ ├── stylist.js # 技师列表 / 详情 / 可约时段（脱敏，不暴露请假原因） │ │ │ ├── works.js # 技师作品 │ │ │ ├── equ.js # 加购护理 │ │ │ ├── order.js # 下单 / 取消 / 我的预约 │ │ │ ├── wallet.js # 钱包余额 │ │ │ ├── paylist.js # 充值流水 │ │ │ ├── review.js # 评价提交与查询 │ │ │ ├── news.js # 公告资讯 │ │ │ ├── banner.js # 首页轮播 │ │ │ ├── star.js # 收藏门店 │ │ │ ├── question.js # 问题反馈 │ │ │ ├── user.js # 微信登录与资料 │ │ │ └── stats.js # 个人预约趋势（本周本月 / 项目偏好） │ │ └── admin/ # 管理端 API（需管理员鉴权） │ │ ├── index.js # admin 路由汇总 │ │ ├── home.js # 运营概览 / 排行统计 │ │ ├── shop.js # 门店 CRUD、营业时段 │ │ ├── cate.js # 服务项目 CRUD │ │ ├── stylist.js # 技师 / 档期 / 请假（冲突拦截） │ │ ├── works.js # 作品 CRUD │ │ ├── equ.js # 加购项 CRUD │ │ ├── order.js # 订单核销 / 取消 / 改派（技师+日期+时段） │ │ ├── user.js # 会员管理 │ │ ├── paylist.js # 充值记录 │ │ ├── news.js # 公告管理 │ │ ├── banner.js # 轮播管理 │ │ ├── star.js # 收藏统计 │ │ ├── question.js # 反馈回复 │ │ └── review.js # 评价回复 │ └── public/ │ └── images/ # 静态图资源（按业务分子目录，不逐文件列出） │ ├── shop/ # 门店封面 │ ├── cate/ # 服务项目封面 │ ├── stylist/ # 技师头像 │ ├── works/ # 技师作品图 │ ├── banner/ # 首页轮播图 │ ├── avatar/ # 用户头像等 │ ├── review/ # 评价配图 │ ├── news/ # 公告配图 │ └── question/ # 反馈配图 │ ├── admin-vue3/ # Vue3 管理后台（默认 :7832） │ ├── index.html │ ├── vite.config.js # Vite 配置、开发代理到后端 │ ├── package.json │ ├── jsconfig.json │ └── src/ │ ├── main.js # 应用入口 │ ├── App.vue │ ├── api/ │ │ ├── index.js # 接口方法汇总 │ │ └── request.js # Axios 封装、Token 注入 │ ├── router/ │ │ └── index.js # 路由表 + 登录守卫 │ ├── stores/ │ │ └── user.js # 登录用户状态 │ ├── layouts/ │ │ └── MainLayout.vue # 侧栏菜单 + 顶栏布局 │ ├── components/ │ │ ├── ListImagePreview.vue # 列表图预览（居中卡片） │ │ └── components/ │ │ ├── Editor.vue # 富文本编辑器 │ │ └── ImageListUpload.vue # 图片上传组件 │ ├── utils/ │ │ ├── formatTime.js # 时间格式化 │ │ └── media.js # 媒体地址拼接 │ ├── assets/ │ │ └── main.css # 全局主题样式 │ └── views/ # 业务页面（与菜单一一对应） │ ├── Login.vue # 登录 │ ├── Welcome.vue # 运营概览 │ ├── Analytics.vue # 数据分析 │ ├── Banner.vue # 轮播管理 │ ├── Shop.vue # 门店管理 │ ├── Cate.vue # 服务项目 │ ├── Equ.vue # 加购护理 │ ├── Stylist.vue # 技师 / 档期 / 请假 │ ├── Works.vue # 作品管理 │ ├── Order.vue # 预约订单 / 核销 / 改派档期 │ ├── User.vue # 会员管理 │ ├── Paylist.vue # 充值记录 │ ├── News.vue # 公告管理 │ ├── Star.vue # 收藏统计 │ ├── Question.vue # 问题反馈 │ └── Review.vue # 评价管理 │ └── min/ # 微信原生小程序 ├── app.js # 小程序入口逻辑 ├── app.json # 页面注册、TabBar、窗口样式 ├── app.wxss # 全局样式（墨色铜金主题） ├── project.config.json # 微信开发者工具项目配置 ├── project.private.config.json ├── sitemap.json ├── images/ # 小程序本地静态图 │ ├── tabbar/ # TabBar 图标 │ ├── auth-hero.jpg # 登录页氛围图 │ └── banner.jpg # 其他本地图 ├── utils/ │ ├── request.js # 请求基址与封装 │ ├── api.js # 业务接口封装 │ ├── date.js # 日期工具 │ ├── media.js # 图片地址处理 │ ├── util.js # 通用工具 │ ├── feedback.js # 反馈相关辅助 │ └── markdown.js # Markdown 辅助 ├── components/ │ ├── weekCalendar/ # 周历选日期组件 │ └── wxParse/ # 第三方富文本解析插件（内部不展开） └── pages/ # 业务页面（每页为目录，内含 js/json/wxml/wxss） ├── index/ # 门店 Tab 首页 ├── newsList/ # 资讯列表 ├── newsDetail/ # 资讯详情 ├── my/ # 我的 ├── auth/ # 微信授权登录（头像+昵称+真实 openId） ├── userInfo/ # 个人信息 ├── detail/ # 门店预约（选日/项目/技师/时段） ├── comfirm/ # 确认下单（含加购） ├── stylistList/ # 技师列表 ├── stylistDetail/ # 技师详情 / 作品 / 评价 ├── orderList/ # 我的预约列表 ├── orderDetail/ # 预约详情 / 取消 ├── reviewAdd/ # 发表评价 ├── reviewMine/ # 我的评价 ├── wallet/ # 钱包余额与流水 ├── walletAdd/ # 钱包充值 ├── star/ # 收藏门店 ├── trend/ # 预约趋势（本周本月 + 项目偏好） └── question/ # 问题反馈