# 🧪 党籍保留附件查看功能 - 测试指南

**测试时间**: 2025-10-13  
**功能**: 出国申请详情弹窗中的党籍保留附件查看功能

---

## 🎯 测试目标

验证党籍保留附件的"查看"按钮功能是否正常工作，包括：
- ✅ 按钮显示正确
- ✅ PDF文件预览正常
- ✅ 图片文件预览正常
- ✅ 不支持的文件类型处理正确
- ✅ 错误处理友好

---

## 📋 测试前准备

### 1. 启动项目

```bash
# 启动后端服务
cd backend
mvn spring-boot:run

# 启动前端服务
cd web
npm run dev
```

### 2. 准备测试文件

准备以下类型的测试文件：
- 📄 **PDF文件**: `党籍保留申请.pdf` (建议2-3页)
- 🖼️ **JPG图片**: `党籍保留证明.jpg`
- 🖼️ **PNG图片**: `党籍保留证明.png`
- 📝 **Word文档**: `党籍保留申请.docx` (用于测试不支持的类型)

### 3. 登录系统

1. 访问: `http://localhost`
2. 使用管理员账号登录
3. 进入"人事管理" → "出国申请管理"

---

## 🧪 测试用例

### 测试用例1: 界面显示测试 ⭐⭐⭐

**测试目的**: 验证"查看"按钮是否正确显示

**测试步骤**:
1. 点击"新增申请"按钮
2. 填写基本信息
3. 上传党籍保留附件（任意格式）
4. 提交申请
5. 在列表中点击"查看详情"按钮

**预期结果**:
- ✅ 党籍保留附件区域显示
- ✅ 显示文件名和上传时间
- ✅ 显示"查看"和"下载"两个按钮
- ✅ "查看"按钮在左侧，"下载"按钮在右侧
- ✅ 两个按钮间距适当（8px）
- ✅ 按钮样式一致（link类型，primary颜色）

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

---

### 测试用例2: PDF文件预览测试 ⭐⭐⭐⭐⭐

**测试目的**: 验证PDF文件是否能正常预览

**测试步骤**:
1. 上传一个PDF格式的党籍保留附件
2. 提交申请
3. 在详情弹窗中点击"查看"按钮

**预期结果**:
- ✅ 在新浏览器标签页中打开PDF
- ✅ PDF内容完整显示
- ✅ 可以使用浏览器的缩放功能
- ✅ 可以使用浏览器的打印功能
- ✅ 可以翻页查看多页PDF
- ✅ 关闭标签页后不影响原页面

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

**浏览器兼容性测试**:
- ⬜ Chrome
- ⬜ Firefox
- ⬜ Safari
- ⬜ Edge

---

### 测试用例3: 图片文件预览测试 ⭐⭐⭐⭐

**测试目的**: 验证图片文件是否能正常预览

**测试步骤**:
1. 上传一个JPG格式的党籍保留附件
2. 提交申请
3. 在详情弹窗中点击"查看"按钮

**预期结果**:
- ✅ 在新窗口中打开图片
- ✅ 图片居中显示
- ✅ 图片自适应窗口大小
- ✅ 背景为灰色（#f5f5f5）
- ✅ 图片清晰，无失真
- ✅ 窗口标题显示文件名

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

**支持的图片格式测试**:
- ⬜ JPG
- ⬜ JPEG
- ⬜ PNG
- ⬜ GIF
- ⬜ BMP
- ⬜ WEBP

---

### 测试用例4: 不支持的文件类型测试 ⭐⭐⭐

**测试目的**: 验证不支持预览的文件类型处理是否正确

**测试步骤**:
1. 上传一个Word文档（.docx）作为党籍保留附件
2. 提交申请
3. 在详情弹窗中点击"查看"按钮

**预期结果**:
- ✅ 显示提示消息："该文件类型不支持在线预览，请下载后查看"
- ✅ 自动触发文件下载
- ✅ 文件正常下载到本地
- ✅ 下载的文件可以正常打开

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

---

### 测试用例5: 权限验证测试 ⭐⭐⭐⭐

**测试目的**: 验证权限控制是否正常

**测试步骤**:
1. 使用普通用户账号登录
2. 查看其他人的出国申请详情
3. 尝试点击"查看"按钮

**预期结果**:
- ✅ 如果有权限：正常预览
- ✅ 如果无权限：显示权限错误提示
- ✅ 错误提示友好明确

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

---

### 测试用例6: 错误处理测试 ⭐⭐⭐

**测试目的**: 验证异常情况的处理

**测试场景A: 文件不存在**

**测试步骤**:
1. 在数据库中找到一条有党籍附件的记录
2. 手动删除OSS中对应的文件
3. 在详情弹窗中点击"查看"按钮

**预期结果**:
- ✅ 显示错误提示："预览文件失败，请检查文件权限或稍后重试"
- ✅ 不会出现白屏或崩溃
- ✅ 可以继续操作其他功能

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

---

**测试场景B: 网络异常**

**测试步骤**:
1. 打开浏览器开发者工具
2. 切换到Network标签
3. 设置网络为"Offline"（离线模式）
4. 点击"查看"按钮

**预期结果**:
- ✅ 显示错误提示："预览文件失败，请检查文件权限或稍后重试"
- ✅ 不会长时间无响应
- ✅ 用户可以取消操作

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

---

### 测试用例7: 性能测试 ⭐⭐

**测试目的**: 验证大文件预览的性能

**测试步骤**:
1. 上传一个较大的PDF文件（5-10MB）
2. 在详情弹窗中点击"查看"按钮
3. 观察加载时间

**预期结果**:
- ✅ 文件在10秒内开始加载
- ✅ 加载过程中有提示（浏览器默认加载提示）
- ✅ 加载完成后可以正常查看
- ✅ 不会导致浏览器卡顿

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

---

### 测试用例8: 并发测试 ⭐⭐

**测试目的**: 验证同时预览多个文件

**测试步骤**:
1. 打开多个出国申请详情弹窗
2. 依次点击每个弹窗中的"查看"按钮
3. 观察是否都能正常预览

**预期结果**:
- ✅ 每个文件都在独立的新窗口/标签页中打开
- ✅ 互不影响
- ✅ 所有文件都能正常预览
- ✅ 内存占用合理

**实际结果**: _________

**测试状态**: ⬜ 通过 ⬜ 失败

---

## 🐛 问题记录

### 问题1
**问题描述**: _________

**重现步骤**:
1. _________
2. _________
3. _________

**预期结果**: _________

**实际结果**: _________

**严重程度**: ⬜ 严重 ⬜ 一般 ⬜ 轻微

**解决方案**: _________

---

### 问题2
**问题描述**: _________

**重现步骤**:
1. _________
2. _________
3. _________

**预期结果**: _________

**实际结果**: _________

**严重程度**: ⬜ 严重 ⬜ 一般 ⬜ 轻微

**解决方案**: _________

---

## 📊 测试总结

### 测试统计

| 测试项 | 总数 | 通过 | 失败 | 通过率 |
|--------|------|------|------|--------|
| 测试用例 | 8 | ___ | ___ | ___% |
| 浏览器兼容性 | 4 | ___ | ___ | ___% |
| 文件格式支持 | 6 | ___ | ___ | ___% |

### 测试结论

⬜ **通过** - 所有测试用例通过，功能正常  
⬜ **有问题** - 存在问题，需要修复  
⬜ **阻塞** - 严重问题，无法继续测试

### 测试建议

1. _________
2. _________
3. _________

---

## 🔍 调试技巧

### 1. 浏览器控制台调试

打开浏览器开发者工具（F12），查看：

**Console标签**:
```
👁️ 预览党籍保留附件: 党籍保留申请.pdf
```

**Network标签**:
- 查找 `/resource/oss/download/{ossId}` 请求
- 检查请求状态码（应该是200）
- 检查响应类型（应该是blob）
- 检查响应大小（应该与文件大小一致）

### 2. 常见问题排查

**问题**: 点击"查看"按钮没有反应

**排查步骤**:
1. 检查浏览器控制台是否有错误
2. 检查Network请求是否发送
3. 检查后端服务是否正常运行
4. 检查Token是否过期

---

**问题**: PDF预览空白

**排查步骤**:
1. 检查PDF文件是否损坏
2. 检查浏览器是否支持PDF预览
3. 检查Blob URL是否正确生成
4. 尝试下载文件后手动打开

---

**问题**: 图片预览失败

**排查步骤**:
1. 检查图片格式是否支持
2. 检查图片文件是否损坏
3. 检查Blob URL是否正确
4. 检查浏览器控制台错误信息

---

## 📞 技术支持

如遇到问题，请提供：
1. 浏览器类型和版本
2. 控制台错误截图
3. Network请求截图
4. 测试文件信息（格式、大小）
5. 重现步骤

---

**测试人**: _________  
**测试日期**: _________  
**测试环境**: _________  
**测试结果**: ⬜ 通过 ⬜ 失败

**创建人**: Cursor AI  
**最后更新**: 2025-10-13