（项目 Logo，位于 static/logo.png）
uview-ui、unpackage 等依赖已随项目一并提供，**不需要执行 npm install**，
> 打开即可运行。
### 第 2 步：导入项目
1. 打开 HBuilderX → 顶部菜单 `文件` → `打开目录`；
2. 选中本项目文件夹 `scan-code-order-small-program`，点击「选择文件夹」；
3. 左侧「项目管理器」出现项目即导入成功。
### 第 3 步：修改后端地址（**重要**）
打开 `common/config.js`，把 `apiBaseUrl` 改成你自己的后端地址：
```js
apiBaseUrl: 'https://你的域名/tp6/public/index.php',
```
> 程序启动时会自动检查这个地址是否合法。如果填写错误，会弹窗提示
> 「哪一项填错了、为什么错、该怎么改」，不用再靠猜。
### 第 4 步：运行
- **在微信里运行**：HBuilderX 菜单 `运行` → `运行到小程序模拟器` → `微信开发者工具`；
若提示未配置，按弹窗指引填写微信开发者工具安装路径即可。
- **在浏览器里运行**：菜单 `运行` → `运行到浏览器` → 选择 Chrome。
- **真机运行**：菜单 `运行` → `运行到手机或模拟器`（手机需开启 USB 调试）。
### 第 5 步：发布上线
1. 微信小程序：菜单 `发行` → `小程序-微信`，生成代码后用微信开发者工具上传审核；
2. H5：菜单 `发行` → `网站-PC 或手机`，把生成的 `unpackage/dist/build/web` 目录部署到服务器。
> 发布前请把 `manifest.json` 中 `mp-weixin.appid` 换成自己的小程序 AppID。
---
## 三、目录结构说明
```
scan-code-order-small-program
├── App.vue 应用入口：启动时校验配置、捕获未处理异常
├── main.js 应用初始化（挂载 Vuex、注册 uView）
├── manifest.json 应用名称、AppID、各平台打包配置
├── pages.json 页面路由、导航栏、底部 tabBar 配置
├── uni.scss 全局 scss 变量入口
├── common/ 业务通用模块（本次优化新增）
│ ├── config.js 全局配置中心 + 配置校验（改配置只改这里）
│ ├── request.js 网络请求统一封装（超时 / 重试 / 错误提示）
│ └── utils.js 通用工具方法（容错解析、金额格式化等）
├── pages/
│ ├── index/index.vue 主页面：底部导航 + 三个功能模块切换
│ └── center/index.vue 预留页面
├── components/ui/
│ ├── home.vue 点餐首页：分类、菜品、搜索、规格选择
│ ├── shopping.vue 购物车
│ └── user.vue 个人中心
├── store/index.js 全局状态：登录凭证、购物车数量、当前桌号
├── static/ 图片与静态资源（含 H5 样式入口 index.css）
└── uview-ui/ uView UI 组件库（第三方，请勿修改）
```
---
## 四、接口约定
后端只需提供以下 4 个接口，统一使用 **GET** 请求、返回 **JSON**。
接口路径在 `common/config.js` 的 `api` 字段中配置。
| 用途 | 路径 | 请求参数 | 返回示例 |
| --- | --- | --- | --- |
| 菜品分类 + 菜品列表 | `/api/index` | `menu_id`（分类 id，0 表示默认分类） | `{ "menu": [...], "list": [...] }` |
| 商品规格 | `/api/types` | `commodity_id`（商品 id） | `{ "types": [...], "tyepsVal": [...] }` |
| 记录已选规格 | `/api/addType` | `id`、`type_id` | `{ ... }` |
| 微信登录 | `/api/Login` | `code`（uni.login 返回的凭证） | `{ ... }` |
菜品列表示例（可参考 `static/api/menu.json`）：
```json
{
"menu": [{ "id": 1, "name": "推荐" }, { "id": 2, "name": "热门" }],
"list": [
{ "id": 1, "name": "饮料", "menu_id": 1, "price": "10.00", "logo": "https://图片地址" }
]
}
```
> **注意**：规格接口返回的选项字段名是 `tyepsVal`（历史上的拼写），前端已按该字段名读取，
> 如需改名请同步修改 `components/ui/home.vue` 中的说明注释处。
---
## 五、扫码进店与桌号识别
系统按以下顺序识别桌号，任意一种都可正常使用：
1. 普通链接参数：`?number=8`；
2. 小程序码 `scene` 参数：`?scene=8`（微信会对该值自动编码，前端已做解码容错）。
若两种方式都没取到桌号，页面会显示「桌号：未识别」，并**不影响继续点餐**，
方便你在没有二维码的情况下调试。
---
## 六、常见问题（排错手册）
**1. 打开就弹窗提示「配置有误」，怎么办？**
说明 `common/config.js` 里的配置不合法，弹窗已写明是哪一项、什么原因、怎么改。
按提示修改后重新运行即可。最常见的原因是接口地址没有以 `http://` 或 `https://` 开头。
**2. 菜品一直加载不出来 / 提示「网络连接失败」？**
按顺序检查：
① `common/config.js` 里的 `apiBaseUrl` 是否是后端真实可访问的地址；
② 手机或电脑能否正常上网；
③ 后端服务是否已启动；
④ 微信小程序需在「微信公众平台 → 开发管理 → 服务器域名」中把后端域名加入白名单
（本地调试可在微信开发者工具中勾选「不校验合法域名」）。
**3. 提示「服务器开小差了（错误码 500）」？**
说明后端接口报错了，请查看后端服务的运行日志。前端已做兜底，不会白屏。
**4. 页面显示「桌号：未识别」？**
说明进入链接里没有 `number` 或 `scene` 参数。请通过扫描餐桌二维码进入，
或手动在链接后加上 `?number=你的桌号`。
**5. 搜索框输入后没有变化？**
搜索框会按「菜品名称」模糊筛选当前分类下的菜品。请确认输入的是菜品名称中的字，
（例如输入「卡布」可以搜到「卡布奇诺」）。输入框清空后会恢复显示全部菜品。
**6. 底部导航的「购物车」图标显示不出来？**
该图标使用了网络图片，断网时会加载失败，请检查网络连接。
**7. 修改了后端地址但没有生效？**
请确认修改的是 `common/config.js`（唯一配置入口），保存后**重新运行**项目。
---
## 七、参与贡献
1. Fork 本仓库；
2. 新建 `Feat_xxx` 分支；
3. 提交代码；
4. 新建 Pull Request。
## 八、许可证
本项目基于 [LICENSE](./LICENSE) 中的条款开源。