docs: 更新 NOTIFICATION_SYSTEM.md，添加用户快速指南并移除测试工具引用

## 主要更新

### ✅ 新增内容（235 行）
**用户快速指南章节**（面向普通用户）：
- 🔌 连接状态查看（页面横幅 + 控制台命令）
- 🔧 手动操作指南（重连、查看日志、检查权限）
- 🆘 常见问题解决（收不到通知、连接断开、页面卡顿）
- 💻 可用调试命令速查（Socket、通知权限、综合调试、Mock 模式）

### ❌ 删除内容
移除所有已失效的测试工具引用：
- NotificationTestTool 组件（架构图、组件清单、文件结构）
- "金融资讯测试工具"说明（改为控制台命令）
- window.__TEST_NOTIFICATION__ API 引用
- notificationDebugger 引用
- 测试用例文档引用（已删除）

### 🔄 更新内容
- 文档版本：v2.11.0 → v2.12.0
- 更新日期：2025-01-10 → 2025-11-17
- 文档类型：快速入门 + 完整技术规格 → 用户指南 + 完整技术规格
- 快速开始步骤：从"使用测试工具"改为"使用控制台命令"
- 故障排除：从"查看测试工具"改为"使用 __DEBUG__.socket.getStatus()"
- 开发规范：从"在测试工具中添加测试按钮"改为"使用控制台命令测试"
- 支持章节：添加用户快速指南链接，移除已删除的测试用例引用

## 文档统计
- 行数：1974 → 2209（+235 行）
- 大小：56KB → 60KB（+4KB）
- 修改：+31 处新增，-19 处删除

## 保留的调试工具
- ✅ window.__DEBUG__（生产可用）
- ✅ window.browserNotificationService（生产可用）
- ✅ __mockSocket（仅 Mock 模式）

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

docs/NOTIFICATION_SYSTEM.md

@@ -1,16 +1,24 @@
 # 实时消息推送系统 - 完整技术文档
 
-> **版本**: v2.11.0
+> **版本**: v2.12.0
-> **更新日期**: 2025-01-10
+> **更新日期**: 2025-11-17
-> **文档类型**: 快速入门 + 完整技术规格
+> **文档类型**: 用户指南 + 完整技术规格
 >
-> ⚠️ **重要更新**: Mock Socket 已移除（2025-01-10），文档中关于 `mockSocketService` 的内容仅供历史参考。
+> ⚠️ **重要更新**:
+> - 测试工具已移除（2025-11-17）：NotificationTestTool、window.__TEST_NOTIFICATION__、notificationDebugger
+> - 保留生产可用调试工具：window.__DEBUG__、window.browserNotificationService
 
 ---
 
 ## 📑 目录
 
-### 第一部分：快速入门
+### 👤 第零部分：用户快速指南
+0. [连接状态查看](#-连接状态查看)
+1. [手动操作指南](#-手动操作指南)
+2. [常见问题解决](#-常见问题解决)
+3. [可用调试命令](#-可用调试命令)
+
+### 第一部分：快速入门（开发者）
 1. [系统简介](#-系统概述)
 2. [核心特性](#核心特性)
 3. [5分钟快速开始](#-快速开始)
@@ -89,6 +97,222 @@
 
 ---
 
+## 👤 用户快速指南
+
+> **适用人群**: 普通用户、测试人员、客服人员
+> **阅读时间**: 5 分钟
+
+### 🔌 连接状态查看
+
+#### **方法 1: 页面顶部状态横幅**
+
+当系统出现连接问题时，页面顶部会显示状态横幅：
+
+| 状态 | 显示内容 | 颜色 | 说明 |
+|------|----------|------|------|
+| ✅ 已连接 | 无横幅 | - | 正常工作，无需操作 |
+| ⚠️ 断开连接 | "⚠️ 连接已断开" | 橙色 | 正在尝试重连 |
+| 🔄 重连中 | "🔄 正在重连... (第 X 次)" | 蓝色 | 自动重连进行中 |
+| ❌ 连接失败 | "❌ 连接失败，请检查网络" | 红色 | 需要手动干预 |
+| ✓ 已重连 | "✓ 已重新连接" | 绿色 | 重连成功，2秒后自动消失 |
+
+**操作**:
+- 横幅可手动关闭（点击 ✕ 按钮）
+- 关闭后会记住状态，重连成功后自动清除
+
+#### **方法 2: 浏览器控制台查看**
+
+1. 按 `F12` 打开开发者工具
+2. 切换到 `Console` 标签
+3. 输入以下命令：
+
+```javascript
+// 查看连接状态
+__DEBUG__.socket.getStatus()
+
+// 输出示例：
+{
+  connected: true,
+  socketId: "abc123...",
+  reconnectAttempts: 0
+}
+```
+
+---
+
+### 🔧 手动操作指南
+
+#### **1. 手动重连**
+
+当连接失败时，可以手动触发重连：
+
+**浏览器控制台** (`F12` → `Console`):
+```javascript
+// 手动重连
+__DEBUG__.socket.reconnect()
+```
+
+**刷新页面**（最简单）:
+- 按 `Ctrl+R` (Windows) 或 `Cmd+R` (Mac)
+- 或点击浏览器刷新按钮
+
+#### **2. 查看连接日志**
+
+```javascript
+// 查看最近的 Socket 日志
+__DEBUG__.socket.getLogs()
+
+// 导出所有日志到文件
+__DEBUG__.exportAll()
+```
+
+#### **3. 检查浏览器通知权限**
+
+```javascript
+// 查看通知权限状态
+window.browserNotificationService.getPermissionStatus()
+
+// 返回值：
+// "granted"  - 已授权
+// "denied"   - 已拒绝
+// "default"  - 未询问
+```
+
+**如何授予权限**:
+1. 点击浏览器地址栏左侧的🔒图标
+2. 找到"通知"设置
+3. 选择"允许"
+
+---
+
+### 🆘 常见问题解决
+
+#### **问题 1: 收不到通知**
+
+**可能原因**:
+- ❌ 浏览器通知权限未授予
+- ❌ Socket 连接断开
+- ❌ 浏览器标签页处于后台（网页通知需要标签页在前台）
+
+**解决步骤**:
+1. 检查连接状态（参见上面"连接状态查看"）
+2. 检查通知权限：
+   ```javascript
+   window.browserNotificationService.getPermissionStatus()
+   ```
+3. 如果是 `"denied"`，需要在浏览器设置中允许通知
+4. 如果是 `"default"`，刷新页面会自动请求权限
+
+#### **问题 2: 连接一直断开**
+
+**排查步骤**:
+1. **检查网络连接**：打开其他网站，确认网络正常
+2. **查看重连次数**：
+   ```javascript
+   __DEBUG__.socket.getStatus()
+   ```
+3. **查看错误日志**：
+   ```javascript
+   __DEBUG__.socket.getLogs()
+   ```
+4. **手动重连**：
+   ```javascript
+   __DEBUG__.socket.reconnect()
+   ```
+5. **刷新页面**：`Ctrl+R` 或 `Cmd+R`
+
+#### **问题 3: 通知太多/太少**
+
+**无法控制通知数量**（由后端推送决定），但可以：
+- **清空所有通知**: 点击通知容器右上角"清空全部"按钮
+- **关闭单个通知**: 点击通知右上角 ✕ 按钮
+- **关闭音效**: 点击通知容器右上角🔊图标
+
+#### **问题 4: 页面卡顿**
+
+**可能原因**: 通知历史过多
+
+**解决方法**:
+1. 点击"清空全部"按钮清空历史通知
+2. 系统会自动限制最多显示 15 条通知
+3. 如仍卡顿，刷新页面
+
+---
+
+### 💻 可用调试命令
+
+> **使用方法**: 打开浏览器控制台 (`F12` → `Console`)，输入以下命令
+
+#### **Socket 连接调试**
+
+```javascript
+// 1. 查看连接状态
+__DEBUG__.socket.getStatus()
+
+// 2. 手动重连
+__DEBUG__.socket.reconnect()
+
+// 3. 查看 Socket 日志
+__DEBUG__.socket.getLogs()
+
+// 4. 导出 Socket 日志
+__DEBUG__.socket.exportLogs()
+```
+
+#### **通知权限调试**
+
+```javascript
+// 1. 查看权限状态
+window.browserNotificationService.getPermissionStatus()
+// 返回: "granted" | "denied" | "default"
+
+// 2. 请求权限
+window.browserNotificationService.requestPermission()
+
+// 3. 检查是否支持通知
+window.browserNotificationService.isSupported()
+// 返回: true | false
+```
+
+#### **综合调试**
+
+```javascript
+// 1. 系统诊断（检查所有状态）
+__DEBUG__.diagnose()
+
+// 2. 查看所有统计信息
+__DEBUG__.printStats()
+
+// 3. 导出所有日志
+__DEBUG__.exportAll()
+
+// 4. 清空所有日志
+__DEBUG__.clearAll()
+
+// 5. 显示帮助信息
+__DEBUG__.help()
+```
+
+#### **开发环境专用（Mock 模式）**
+
+仅在开发环境（`npm start`）可用：
+
+```javascript
+// 模拟断线（测试重连机制）
+__mockSocket.simulateDisconnection()
+
+// 查看连接状态
+__mockSocket.isConnected()
+
+// 手动重连
+__mockSocket.reconnect()
+
+// 发送测试通知
+__mockSocket.sendTestNotification()
+```
+
+---
+
 ## 📋 系统概述
 
 本系统是专为**金融资讯场景**设计的实时消息推送系统，支持 Mock 模式（开发）和真实 Socket.IO 模式（生产）。消息以右下角层叠弹窗的形式显示，**新消息在最上方**，符合主流桌面应用的交互习惯。
@@ -126,7 +350,6 @@ graph TB
         A[App.js] --> B[AppProviders]
         B --> C[NotificationProvider<br/>NotificationContext]
         C --> D[NotificationContainer<br/>通知容器UI]
-        C --> E[NotificationTestTool<br/>开发测试工具]
     end
 
     subgraph "通知系统核心"
@@ -231,7 +454,6 @@ sequenceDiagram
 |-------|------|------|---------|
 | **NotificationContext** | React Context | 通知系统核心逻辑、状态管理 | `src/contexts/NotificationContext.js` |
 | **NotificationContainer** | React Component | 通知UI容器、动画、交互 | `src/components/NotificationContainer/index.js` |
-| **NotificationTestTool** | React Component | 开发测试工具 | `src/components/NotificationTestTool/index.js` |
 | **socketService** | Service Class | 真实WebSocket连接管理 | `src/services/socketService.js` |
 | **mockSocketService** | Service Class | Mock WebSocket模拟 | `src/services/mockSocketService.js` |
 | **browserNotificationService** | Service Class | 浏览器通知API封装 | `src/services/browserNotificationService.js` |
@@ -880,7 +1102,7 @@ __mockSocket.pausePush()   // 暂停自动推送，专注测试单条
 - [ ] 点击请求权限按钮弹出浏览器授权对话框
 - [ ] 授权后状态变为"granted"
 - [ ] 拒绝后状态变为"denied"，显示设置指引
-- [ ] 权限状态在测试工具中正确显示
+- [ ] 权限状态正确显示
 
 #### 7. 浏览器通知显示测试
 - [ ] 权限授予后，切换到其他标签页，收到通知时显示系统通知
@@ -1258,22 +1480,38 @@ npm start
 
 ### 3. 测试通知
 
-打开浏览器，右上角会显示 **"金融资讯测试工具"**，包含：
+打开浏览器控制台 (`F12` → `Console`)，使用以下命令测试：
 
-#### 通知类型测试
+#### **Mock 模式测试**（开发环境）
-- 公告通知、股票动向、事件动向、分析报告
+```javascript
-- 预测通知（不可跳转）
+// 发送测试通知
+__mockSocket.sendTestNotification()
 
-#### 组合测试
+// 模拟断线重连
-- 预测→详情流程（5秒延迟）
+__mockSocket.simulateDisconnection()
 
-#### 功能按钮
+// 查看连接状态
-- 清空全部、音效开关、队列状态
+__mockSocket.isConnected()
+```
+
+#### **通用测试命令**
+```javascript
+// 查看系统状态
+__DEBUG__.diagnose()
+
+// 查看连接状态
+__DEBUG__.socket.getStatus()
+
+// 查看通知权限
+window.browserNotificationService.getPermissionStatus()
+```
 
 ### 4. 自动推送
 
 Mock 模式下，系统会自动每 60 秒推送 1-2 条随机金融资讯。
 
+查看更多测试命令，请参考本文档开头的 [用户快速指南](#-用户快速指南)。
+
 ---
 
 ## 💻 代码使用
@@ -1405,7 +1643,7 @@ socketio.emit('new_event', {
 **检查项**：
 1. 确认 `NotificationProvider` 已包裹应用
 2. 检查浏览器控制台是否有错误
-3. 确认 socket 连接状态（查看测试工具）
+3. 确认 socket 连接状态（使用 `__DEBUG__.socket.getStatus()`）
 4. 检查通知数据格式是否正确
 
 ### 问题 2: 股票动向颜色不对
@@ -1688,7 +1926,7 @@ ERROR: Browser permission not granted
 1. 在 `src/constants/notificationTypes.js` 添加类型定义
 2. 添加类型配置（图标、颜色、样式）
 3. 在 `NotificationContainer` 中添加渲染逻辑
-4. 在测试工具中添加测试按钮
+4. 使用控制台命令测试（Mock 模式：`__mockSocket.sendTestNotification()`）
 5. 更新文档
 
 **示例**：
@@ -1882,10 +2120,8 @@ src/
 ├── contexts/
 │   └── NotificationContext.js         # 通知上下文管理
 ├── components/
-│   ├── NotificationContainer/
+│   └── NotificationContainer/
-│   │   └── index.js                   # 通知容器组件
+│       └── index.js                   # 通知容器组件
-│   └── NotificationTestTool/
-│       └── index.js                   # 测试工具组件
 ├── hooks/
 │   └── useEventNotifications.js       # 事件订阅 Hook
 └── assets/
@@ -1962,11 +2198,11 @@ src/
 ## 📞 支持
 
 如有问题，请查看：
+- **用户快速指南**: 本文档开头的[用户快速指南](#-用户快速指南)
 - **项目文档**: `CLAUDE.md`
-- **测试工具**: 开发环境右上角"金融资讯测试工具"
+- **调试命令**: 浏览器控制台使用 `__DEBUG__.help()` 查看所有可用命令
 - **控制台日志**: 所有操作都有详细日志
 - **类型定义**: `src/constants/notificationTypes.js`
-- **测试用例**: `docs/test-cases/notification-tests.md`
 
 ---