# 中国机车图鉴 · 前端 (apps/web)

Vite + React + TypeScript，消费 `apps/api`（NestJS）的接口。对应 Phase 1C（T-1.5/1.6/1.7）。

## 功能
- 列表页：分类/状态/国别/年代区间/时速筛选 + 排序 + 分页
- 三视图切换：**列表卡片 / 时间轴（分类泳道）/ 图鉴卡牌（含收集占位）**
- 详情页：技术参数表 + 原始数据（raw_json）保真表
- 全局搜索框：防抖下拉，命中跳转详情

## 开发运行（需先启动后端）
```bash
# 1) 终端 A：启动后端 API（在 apps/api）
cd apps/api && npm run build && node dist/main.js     # http://localhost:3001

# 2) 终端 B：启动前端（在 apps/web）
npm run dev                                            # http://localhost:5173
```
Vite 已将 `/api` 代理到 `http://127.0.0.1:3001`，无需额外配置。

## 测试与构建
```bash
npm test         # Vitest 单元/组件测试（23 项）
npm run build    # tsc 类型检查 + vite 生产构建
```

## 说明
- 时间轴布局、格式化、查询拼装等纯逻辑抽到 `src/lib`、`src/api`，便于单测。
- 图鉴"已收集/未收集"为占位，收集逻辑待 Phase 3 打卡功能接入。