# 测试医生资质图片功能

## 测试步骤

### 1. 数据库准备

首先执行SQL文件添加字段：

```bash
# 如果使用 la_ 前缀
mysql -u root -p your_database < server/sql/add_doctor_qualification_images.sql

# 如果使用 zyt_ 前缀，先修改SQL文件中的表名
# 将 la_admin 替换为 zyt_admin
```

验证字段是否添加成功：
```sql
DESC la_admin;
-- 或
DESC zyt_admin;

-- 应该能看到 qualification_images 字段
```

### 2. 管理后台测试

#### 2.1 添加医生并上传资质图片

1. 登录管理后台
2. 进入"医生管理"页面
3. 点击"新增医生"按钮
4. 填写基本信息：
   - 账号：test_doctor
   - 姓名：测试医生
   - 密码：123456
   - 其他必填字段...
5. 在"专业信息"部分找到"资质图片"字段
6. 点击上传按钮，选择1-3张测试图片
7. 点击"确定"保存

#### 2.2 编辑医生资质图片

1. 在医生列表中找到刚创建的医生
2. 点击"编辑"按钮
3. 在"资质图片"字段中：
   - 可以删除已有图片
   - 可以添加新图片
   - 可以调整图片顺序
4. 点击"确定"保存

#### 2.3 查看医生详情

1. 点击医生列表中的"详情"按钮
2. 确认能看到 `qualification_images` 字段
3. 确认图片URL格式正确

### 3. API接口测试

#### 3.1 测试添加医生接口

```bash
curl -X POST "http://your-domain/adminapi/auth.admin/add" \
  -H "Content-Type: application/json" \
  -H "token: your_admin_token" \
  -d '{
    "account": "test_doctor2",
    "name": "测试医生2",
    "password": "123456",
    "password_confirm": "123456",
    "gender": 1,
    "role_id": [1],
    "dept_id": [1],
    "qualification_images": "[\"https://example.com/cert1.jpg\",\"https://example.com/cert2.jpg\"]",
    "disable": 0,
    "multipoint_login": 1
  }'
```

#### 3.2 测试编辑医生接口

```bash
curl -X POST "http://your-domain/adminapi/auth.admin/edit" \
  -H "Content-Type: application/json" \
  -H "token: your_admin_token" \
  -d '{
    "id": 1,
    "account": "test_doctor",
    "name": "测试医生",
    "qualification_images": "[\"https://example.com/cert1.jpg\",\"https://example.com/cert2.jpg\",\"https://example.com/cert3.jpg\"]",
    "disable": 0,
    "multipoint_login": 1
  }'
```

#### 3.3 测试医生详情接口

```bash
curl -X GET "http://your-domain/adminapi/auth.admin/detail?id=1" \
  -H "token: your_admin_token"
```

预期返回：
```json
{
  "code": 1,
  "msg": "success",
  "data": {
    "id": 1,
    "name": "测试医生",
    "qualification_images": "[\"https://example.com/cert1.jpg\",\"https://example.com/cert2.jpg\"]",
    ...
  }
}
```

#### 3.4 测试小程序端医生详情接口

```bash
curl -X GET "http://your-domain/api/doctor/detail?id=1"
```

预期返回：
```json
{
  "code": 1,
  "msg": "success",
  "data": {
    "id": 1,
    "name": "测试医生",
    "qualification_images": "[\"https://example.com/cert1.jpg\",\"https://example.com/cert2.jpg\"]",
    ...
  }
}
```

### 4. 小程序端测试

#### 4.1 查看医生详情页

1. 打开小程序
2. 进入医生列表页面
3. 点击任意医生进入详情页
4. 滚动到"擅长领域"下方
5. 应该能看到"医生资质"区域（如果该医生有资质图片）
6. 资质图片以3列网格布局展示

#### 4.2 测试图片预览

1. 点击任意资质图片
2. 应该弹出图片预览界面
3. 可以左右滑动查看所有资质图片
4. 可以双指缩放查看图片细节
5. 点击关闭按钮或返回键退出预览

### 5. 边界情况测试

#### 5.1 无资质图片
- 医生没有上传资质图片时，小程序端不显示"医生资质"区域
- 管理后台显示空的上传区域

#### 5.2 单张图片
- 上传1张图片，正常显示
- 预览时只有1张图片

#### 5.3 多张图片
- 上传9张图片（最大限制）
- 所有图片都能正常显示
- 预览时可以滑动查看所有图片

#### 5.4 图片格式
- 测试 JPG 格式 ✓
- 测试 PNG 格式 ✓
- 测试 JPEG 格式 ✓

#### 5.5 错误数据处理
- 空字符串：不显示资质区域
- null：不显示资质区域
- 无效JSON：不显示资质区域（有容错处理）
- 非数组JSON：不显示资质区域

### 6. 性能测试

#### 6.1 图片加载速度
- 测试3张图片的加载时间
- 测试9张图片的加载时间
- 确认图片懒加载是否生效

#### 6.2 预览性能
- 测试预览大图的加载速度
- 测试滑动切换的流畅度

## 测试检查清单

- [ ] 数据库字段添加成功
- [ ] 管理后台可以上传资质图片
- [ ] 管理后台可以编辑资质图片
- [ ] 管理后台可以删除资质图片
- [ ] 添加医生接口正常工作
- [ ] 编辑医生接口正常工作
- [ ] 医生详情接口返回资质图片
- [ ] 小程序端正常显示资质图片
- [ ] 小程序端图片预览功能正常
- [ ] 无资质图片时不显示该区域
- [ ] 支持多种图片格式
- [ ] 错误数据有容错处理
- [ ] 图片加载性能良好

## 常见问题排查

### 问题1：管理后台上传图片后不显示
**排查步骤**：
1. 检查浏览器控制台是否有错误
2. 检查图片上传接口是否成功
3. 检查 `material-picker` 组件是否正常工作
4. 检查 `formData.qualification_images` 是否有值

### 问题2：小程序端不显示资质图片
**排查步骤**：
1. 检查医生详情接口返回的数据
2. 检查 `qualification_images` 字段是否有值
3. 检查 `qualificationImages` computed 是否正确解析
4. 检查图片URL是否可访问
5. 检查小程序域名白名单配置

### 问题3：图片预览失败
**排查步骤**：
1. 检查 `uni.previewImage` 是否正常调用
2. 检查图片URL格式是否正确
3. 检查小程序权限配置
4. 查看小程序控制台错误信息

### 问题4：数据库字段不存在
**排查步骤**：
1. 确认是否执行了SQL文件
2. 确认表名前缀是否正确（la_ 或 zyt_）
3. 手动执行 `DESC` 命令检查字段
4. 检查数据库连接是否正确

## 测试数据示例

### 示例1：单张图片
```json
["https://example.com/doctor-cert-1.jpg"]
```

### 示例2：多张图片
```json
[
  "https://example.com/doctor-cert-1.jpg",
  "https://example.com/doctor-cert-2.jpg",
  "https://example.com/doctor-cert-3.jpg"
]
```

### 示例3：完整医生数据
```json
{
  "id": 1,
  "name": "李医生",
  "title": "主任医师",
  "license_no": "110101199001011234",
  "qualification_images": "[\"https://example.com/cert1.jpg\",\"https://example.com/cert2.jpg\"]",
  "enable_image_consult": 1,
  "enable_video_consult": 1
}
```