Initial commit

2026-04-12 23:24:40 +08:00 · 2026-04-12 23:24:40 +08:00 · 1b14e251f7
commit 1b14e251f7
2 changed files with 407 additions and 0 deletions
--- a/产品设计文档.md
+++ b/产品设计文档.md
@ -0,0 +1,300 @@
+# 宠伴生活馆 - 产品设计文档
+
+> 版本：v1.5
+> 日期：2026-04-01
+> 状态：产品设计确认中
+
+---
+
+## 一、产品定位
+
+**平台定位：** 宠物店服务管理 SaaS 平台，支持多家宠物店入驻
+
+**目标用户（v1）：**
+- 宠物店老板 / 员工（管理预约 + 填写报告）
+- 宠主通过微信查看服务报告（v2）
+
+**登录方式：**
+- 微信授权登录（老板/员工主要登录方式）
+- 手机号+短信验证码（备用）
+
+---
+
+## 二、核心功能闭环（v1）
+
+```
+预约创建（老板/员工）→ 待确认 → 开始服务（谁点谁就是技师）→ 进行中 → 填写报告 → 发送报告 → 已完成
+                                                      ↘ 已取消 → 归到已完成Tab
+```
+
+**报告分享流程（v1 重点）：**
+```
+填写报告（照片+备注）→ 点击「发送报告」→ 选择发送方式
+                                         ├── 复制链接（发给宠主微信）
+                                         └── 下载二维码（现场扫码）
+```
+
+---
+
+## 三、数据模型
+
+### t_store（店铺表）
+| 字段 | 类型 | 说明 |
+|------|------|------|
+| id | BIGINT | 主键 |
+| name | VARCHAR | 店铺名称 |
+| logo | VARCHAR | 店铺Logo |
+| phone | VARCHAR | 联系电话 |
+| address | VARCHAR | 地址 |
+| intro | TEXT | 简介 |
+| owner_id | BIGINT | 老板用户ID |
+| invite_code | VARCHAR | 员工邀请码（8位） |
+| create_time | DATETIME | 创建时间 |
+| update_time | DATETIME | 更新时间 |
+
+### t_user（用户表）
+| 字段 | 类型 | 说明 |
+|------|------|------|
+| id | BIGINT | 主键 |
+| username | VARCHAR | 用户名 |
+| password | VARCHAR | 密码 |
+| name | VARCHAR | 姓名/技师名 |
+| phone | VARCHAR | 手机号 |
+| avatar | VARCHAR | 头像 |
+| store_id | BIGINT | 所属店铺 |
+| role | VARCHAR | boss / staff |
+| create_time | DATETIME | 创建时间 |
+| update_time | DATETIME | 更新时间 |
+
+### t_appointment（预约表）
+| 字段 | 类型 | 说明 |
+|------|------|------|
+| id | BIGINT | 主键 |
+| pet_name | VARCHAR | 宠物名称 |
+| pet_type | VARCHAR | 宠物类型（猫/狗/其他） |
+| service_type | VARCHAR | 服务类型 |
+| appointment_time | DATETIME | 预约时间（无限制，随便选） |
+| status | VARCHAR | new / doing / done / cancel |
+| store_id | BIGINT | 店铺ID |
+| user_id | BIGINT | 创建人ID（谁建的） |
+| assigned_user_id | BIGINT | 技师ID（开始服务时赋值） |
+| remark | TEXT | 备注 |
+| create_time | DATETIME | 创建时间 |
+| update_time | DATETIME | 更新时间 |
+
+### t_report（报告表）
+| 字段 | 类型 | 说明 |
+|------|------|------|
+| id | BIGINT | 主键 |
+| appointment_id | BIGINT | 预约ID |
+| before_photo | VARCHAR | 服务前照片URL |
+| after_photo | VARCHAR | 服务后照片URL |
+| remark | TEXT | 备注 |
+| user_id | BIGINT | 技师ID |
+| store_id | BIGINT | 店铺ID |
+| report_token | VARCHAR | 报告访问令牌（UUID，永久有效） |
+| pet_name | VARCHAR | 宠物名（冗余） |
+| service_type | VARCHAR | 服务类型（冗余） |
+| appointment_time | DATETIME | 服务时间（冗余） |
+| staff_name | VARCHAR | 技师名（冗余） |
+| create_time | DATETIME | 创建时间 |
+| update_time | DATETIME | 更新时间 |
+
+### t_service_type（服务类型表）
+| 字段 | 类型 | 说明 |
+|------|------|------|
+| id | BIGINT | 主键 |
+| store_id | BIGINT | 店铺ID（NULL表示系统默认） |
+| name | VARCHAR | 服务名称 |
+| create_time | DATETIME | 创建时间 |
+
+---
+
+## 四、角色权限
+
+| 功能 | 老板（boss） | 员工（staff） |
+|------|-------------|---------------|
+| 预约列表 | ✅ | ✅ |
+| 新建预约 | ✅ | ✅ |
+| 开始服务/填写报告 | ✅ | ✅ |
+| 发送报告 | ✅ | ✅ |
+| 员工管理 | ✅ | ❌ |
+| 邀请码 | ✅ | ❌ |
+| 店铺设置 | ✅ | ❌ |
+| 服务类型管理 | ✅ | ❌ |
+
+### 页面入口
+- **index.html（统一入口）**：老板/员工同一套页面，通过「我的」页面区分功能
+  - 老板「我的」：员工管理 / 服务类型 / 店铺设置 / 我的订单
+  - 员工「我的」：我的订单
+
+---
+
+## 五、核心功能详解
+
+### 5.1 登录体系
+
+**微信授权登录**（主）
+- 老板/员工均可使用微信授权登录
+
+**手机号+短信验证码登录**（备用）
+
+**员工入职流程：**
+- 老板后台生成邀请码 → 员工点链接注册 → 自动关联店铺
+- 老板后台直接新增员工 → 系统生成随机6位密码 → 员工用手机号+密码登录
+
+### 5.2 预约管理
+
+**创建预约：**
+- 老板/员工均可手动创建
+- 字段：宠物名字、宠物类型（猫/狗/其他）、服务类型、预约时间、备注
+- 建档人 = 当前登录用户
+- 预约时间无限制，随便选
+
+**服务类型：**
+- 系统默认：洗澡、美容、洗澡+美容、剪指甲、驱虫
+- 老板可在默认基础上新增/编辑/删除自定义服务类型
+- 员工只能使用，不能管理
+
+**预约状态流转：**
+- new（待确认）→ doing（进行中）→ done（已完成）
+- new（待确认）→ cancel（已取消）→ 归到「已完成」Tab显示
+- doing（进行中）→ done（已完成）
+
+**开始服务：**
+- 点击「开始服务」→ 状态变为「进行中」
+- assigned_user_id = 当前登录用户（谁点谁服务）
+
+### 5.3 服务报告
+
+**填写报告（进行中状态可操作）：**
+- 服务前照片（必填）
+- 服务后照片（必填）
+- 备注（选填）
+- 技师 = 开始服务时分配的用户
+- 提交后锁死，不可再修改
+- 一约一份报告
+
+### 5.4 发送报告（v1 核心功能）
+
+**操作入口：** 报告填写完成后，点击「发送报告」按钮
+
+**发送方式：**
+1. **复制链接** — 生成报告链接，一键复制到剪贴板，可发给宠主微信
+2. **下载二维码** — 生成报告二维码图片，保存到相册，可打印或现场扫码
+
+**报告链接：**
+- URL：`https://域名/report.html?token=xxx`
+- Token = UUID，永久有效
+- 宠主打开无需登录（v1 免登录）
+
+**报告二维码：**
+- 扫码直接打开报告页
+- 打印出来可贴在墙上/前台，方便宠主扫码
+
+### 5.5 H5 报告页
+
+**访问方式：** 链接或二维码扫码，免登录
+
+**报告页内容：**
+- 品牌头部：店铺 Logo + 店铺名称 + 联系电话 + 地址
+- 服务信息卡片：宠物名、服务项目、服务时间、技师名
+- 前后对比照片（并排展示）
+- 技师备注
+- 底部品牌信息（即使链接被转发，店铺信息持续透出）
+
+**分享能力：**
+- 长按图片可保存
+- 链接可复制转发微信
+
+### 5.6 老板后台（合并到「我的」页面）
+
+**员工管理：**
+- 员工邀请码（复制分享）
+- 新增员工（姓名+手机号，系统生成密码）
+- 删除员工
+
+**服务类型：**
+- 新增服务类型
+- 删除自定义服务类型（系统默认不可删）
+
+**店铺设置：**
+- 店铺名称
+- 店铺Logo
+- 联系电话
+- 地址
+- 简介
+
+---
+
+## 六、技术方案
+
+| 端 | 技术 |
+|----|------|
+| APP前端 | uniapp + Vue3 |
+| H5报告页 | Vue3（独立部署） |
+| 后端 | Spring Boot 3.2 + JPA |
+| 数据库 | MySQL |
+| 图片存储 | 本地存储（后续可平滑切换OSS） |
+
+---
+
+## 七、开发进度
+
+| 优先级 | 功能 | 状态 |
+|--------|------|------|
+| P0 | 老板入驻/登录 | ✅ |
+| P0 | 员工邀请码注册 | ✅ |
+| P0 | 员工登录（微信+验证码） | ✅ |
+| P0 | 预约列表 | ✅ |
+| P0 | 预约创建 | ✅ |
+| P0 | 开始服务（分配技师） | ✅ |
+| P0 | 报告填写 | ✅ |
+| P0 | 发送报告（复制链接+下载二维码） | 🔨 本次 |
+| P0 | H5报告页（品牌信息强化） | 🔨 本次 |
+| P0 | H5报告页（链接+二维码） | ✅ |
+| P0 | 老板后台（员工管理+邀请码） | ✅ 已合并到index.html |
+| P0 | 老板后台（预约概览） | ✅ 已合并到index.html |
+| P1 | 服务类型管理（老板后台） | ✅ |
+| P1 | 店铺设置（老板后台） | ✅ |
+| P1 | 本地文件上传（替代base64） | ✅ |
+| P2 | 宠主端（历史报告汇总） | ⏳ v2 |
+
+---
+
+## 八、数据库变更
+
+```sql
+-- 预约表新增技师字段
+ALTER TABLE t_appointment ADD COLUMN assigned_user_id BIGINT COMMENT '技师ID';
+
+-- 店铺表新增简介字段
+ALTER TABLE t_store ADD COLUMN intro TEXT COMMENT '简介';
+
+-- 服务类型表
+CREATE TABLE t_service_type (
+    id BIGINT PRIMARY KEY AUTO_INCREMENT,
+    store_id BIGINT COMMENT '店铺ID，NULL表示系统默认',
+    name VARCHAR(50) NOT NULL,
+    create_time DATETIME
+);
+
+-- 系统默认服务类型
+INSERT INTO t_service_type (store_id, name, create_time) VALUES
+(NULL, '洗澡', NOW()),
+(NULL, '美容', NOW()),
+(NULL, '洗澡+美容', NOW()),
+(NULL, '剪指甲', NOW()),
+(NULL, '驱虫', NOW());
+```
+
+---
+
+## 九、待确认/后续事项
+
+- [ ] 宠伴生活馆 Logo 素材
+- [ ] 图片存储方案（本地 / OSS）
+- [ ] 短信验证码服务商接入
+- [ ] 微信授权登录 AppID/AppSecret
+- [ ] H5页面域名及部署方案
+- [ ] 宠主端（v2）：历史报告汇总、宠主登录
--- a/前端UI规范.md
+++ b/前端UI规范.md
@ -0,0 +1,107 @@
+# 前端 UI 规范（petstore）
+
+## 目标
+
+- 统一视觉风格，避免页面“各写各的”。
+- 保证移动端可读性和可点击性。
+- 降低后续新增页面的设计与维护成本。
+
+## 设计基线
+
+- 主色：`#16a34a`
+- 页面背景：`var(--pet-bg)`
+- 主文案：`var(--pet-text)`
+- 次级文案：`var(--pet-subtext)`
+- 分割/边框：`var(--pet-border)`
+- 卡片阴影：`var(--pet-card-shadow)`
+
+以上变量统一在 `src/assets/global.css` 维护，页面中不要写死同类颜色。
+
+## 字体与层级
+
+- 页面标题：18px / 700（用 `.text-title`）
+- 正文：14px / 400~500（用 `.text-body`）
+- 说明/辅助：12px / 400（用 `.text-sub`）
+- 避免 11px 及以下文本，移动端可读性较差。
+
+## 间距规范
+
+- 统一间距标尺：8 / 12 / 16 / 24（优先使用全局变量）
+- 页面左右基础边距：16px（`.page-section`）
+- 模块间距：12px（`.section-gap`）
+- 卡片圆角：12~18px
+- 表单项垂直间距：8~12px
+- 底部保留区：至少 `120rpx`（避免被底栏遮挡）
+
+推荐使用：
+
+- 页面容器：`.page-shell`
+- 模块容器：`.page-section`
+- 模块间隔：`.section-gap`
+- 表单项包装：`.form-field-wrap`
+- 模块标题：`.module-title`
+
+## 组件规范
+
+### 顶部导航
+
+- 使用绿色渐变背景 + 轻阴影（`.nav-gradient`）。
+- 标题使用 18/700。
+- 左侧返回统一使用 `AppIcon(back)`。
+- 返回按钮触达区保持足够（建议 40px 以上），并使用统一按压反馈（`.nav-back:active`）。
+
+### 按钮
+
+- 主按钮：绿色渐变，白字，12px 圆角，高度 44px。
+- 次按钮：浅底 + 边框，颜色低于主按钮一个层级。
+- 同区域最多一个高强调按钮，避免视觉噪音。
+
+### 输入框
+
+- 使用统一 `.van-field` 样式。
+- 聚焦态有明显边框和光晕反馈。
+- 文本域最小高度 84~96px，行高 1.45+。
+
+### 卡片
+
+- 白底 + 细边框 + 轻阴影。
+- 不要叠加过多投影层。
+- 卡片内信息按“标题 > 关键值 > 说明”组织。
+- 卡片点击态统一轻微下沉 + 透明度变化，避免“有的会动有的不会动”。
+
+### 图标
+
+- 全站优先使用统一 `AppIcon`，避免 emoji 与图标混用。
+- 新增图标时先补充到 `src/components/AppIcon.vue`，再在页面内复用。
+- 空态/占位图（如图片占位、头像角标）也使用同一套图标风格（如 `camera`）。
+
+### 空状态
+
+- 用统一 `.empty`，文案简短明确。
+- 避免裸文本直接贴在背景上。
+
+## 交互与可用性
+
+- 可点击区域建议不小于 40x40。
+- 反馈闭环完整：点击后要有 loading / toast / 状态变化。
+- 关键操作（删除、取消）保持二次确认。
+- 统一微交互：按钮、卡片、列表项按压反馈节奏一致（约 160ms）。
+
+## 禁止项
+
+- 禁止在模板里堆叠大量内联 `style`。
+- 禁止同一功能页使用多个不同风格按钮。
+- 禁止页面之间同类元素样式明显不一致（例如顶部导航、卡片、输入框）。
+- 禁止在业务页面重复定义全局已有的间距/标题样式（如 `.module-title`、`.form-field-wrap`）。
+- 禁止新增 emoji 图标作为主视觉元素。
+
+## 新页面接入清单
+
+- 引入并复用全局样式，不重复造轮子。
+- 先搭框架：`page-shell -> nav -> sections -> bottom safe area`。
+- 自检 4 项：
+  - 视觉是否与已有页一致
+  - 小屏是否可读
+  - 点击区域是否足够
+  - 是否存在硬编码颜色/间距
+