# OPT-02 前端改造 - 30s 超时移除

## 任务目标
移除前端代码中的 30s setTimeout 超时逻辑，改为监听 WebSocket 事件 `audio_generation_complete` 和 `video_generation_complete`。

## 任务范围

### 文件 1: `my-uniapp-vue3/src/pages/book-generator/index.vue`
- 第256-261行：移除 `setTimeout` 30s 超时逻辑
- 第318-323行：移除 `setTimeout` 30s 超时逻辑
- 改为监听 WebSocket 事件

### 文件 2: `my-uniapp-vue3/src/pages/book-generator/chapter-detail.vue`
- 第822-825行：移除 `setTimeout` 30s 超时逻辑
- 第854-857行：移除 `setTimeout` 30s 超时逻辑
- 改为监听 WebSocket 事件

## WebSocket 事件格式
```typescript
audio_generation_complete: { bookId: string, chapterId: number, status: 'completed' | 'failed' }
video_generation_complete: { bookId: string, chapterId: number, status: 'completed' | 'failed' }
```

## 实现思路
1. 创建 `websocket.ts` 工具类
2. 在页面 onMounted 时建立 WebSocket 连接
3. 监听 `audio_generation_complete` / `video_generation_complete` 事件
4. 收到事件后根据 bookId/chapterId 更新对应章节状态
5. 在 onUnmounted 时取消订阅（关闭连接由 wsManager 内部处理）

## 验收标准
- [x] 30s 超时 setTimeout 已移除
- [x] WebSocket 事件监听已实现
- [x] 页面卸载时 WebSocket 订阅正确取消
- [x] H5 + 小程序两端兼容

## 状态
已完成