# 智保通前端

本目录是智保通的前端工作区，包含两个相互独立的 Vue 3 应用：

- `apps/h5`：H5 公众号模拟器
- `apps/admin`：管理后台

当前 H5 已实现登录、真实 AI Agent 咨询、产品与报价、投保确认、模拟支付、
订单和保单查询。管理后台已实现管理员登录、业务汇总、订单流和保单流查询。
两个前端共用同一个 FastAPI 后端。

## 技术栈

- Node.js 22.23.1
- pnpm 11.9.0
- Vue 3
- TypeScript
- Vite
- pnpm workspace

项目要求 Node.js `>=22 <23`。建议使用 `.nvmrc` 指定的版本，避免其他
Node.js 大版本引起构建兼容问题。

## 目录结构

```text
frontend/
├── apps/
│   ├── h5/                 # 用户端 H5，端口 5173
│   └── admin/              # 管理后台，端口 5174
├── package.json            # 工作区公共命令
├── pnpm-workspace.yaml     # pnpm 工作区范围
├── pnpm-lock.yaml          # 锁定依赖版本
└── .nvmrc                  # 推荐 Node.js 版本
```

## 安装依赖

```powershell
Set-Location C:\Users\yxl\Desktop\new_harness\01-zhibaotong-smart-enrollment\frontend
pnpm install --frozen-lockfile
```

`--frozen-lockfile` 表示严格按照 `pnpm-lock.yaml` 安装，不自动改写锁文件。

## 启动前端

同时启动 H5 和管理后台：

```powershell
pnpm dev
```

只启动 H5：

```powershell
pnpm dev:h5
```

只启动管理后台：

```powershell
pnpm dev:admin
```

启动后的地址：

- H5：<http://127.0.0.1:5173>
- 管理后台：<http://127.0.0.1:5174>

前端调用后端时，请保证后端同时运行在 <http://127.0.0.1:8000>。

## 类型检查与生产构建

```powershell
pnpm typecheck
pnpm build
```

- `typecheck`：检查 Vue 和 TypeScript 类型错误
- `build`：检查类型并生成生产环境静态文件

各应用构建结果会生成在对应应用的 `dist` 目录中。

## 完整项目启动方式

如果需要同时启动前端和后端，请回到项目根目录执行：

```powershell
Set-Location C:\Users\yxl\Desktop\new_harness\01-zhibaotong-smart-enrollment
.\scripts\dev.ps1
```

完整初始化流程参见[项目总说明](../README.md)。