144 lines
3.8 KiB
Markdown
144 lines
3.8 KiB
Markdown
# ✅ 测试 - 登记历史选项卡自动加载
|
||
|
||
## 🎯 修复内容
|
||
|
||
**问题**：登记历史选项卡打开时不自动加载数据，需要手动点击搜索
|
||
|
||
**修复**：添加watch监听选项卡变化，切换时自动加载对应数据
|
||
|
||
---
|
||
|
||
## 🚀 快速测试（2分钟）
|
||
|
||
### 第1步：强制刷新浏览器（5秒）
|
||
**Windows**: `Ctrl + Shift + R`
|
||
**Mac**: `Cmd + Shift + R`
|
||
|
||
> 🔴 必须强制刷新，否则使用旧代码！
|
||
|
||
### 第2步：打开Console（5秒）
|
||
按 `F12` → 切换到 **Console** 标签
|
||
|
||
### 第3步：测试选项卡切换（30秒）
|
||
1. 访问：http://localhost
|
||
2. 登录系统
|
||
3. 进入：**人事管理 → 出国登记**
|
||
4. 👀 观察：默认显示"出国登记"选项卡的数据
|
||
5. 点击 **"登记历史"** 选项卡
|
||
6. 👀 观察：**数据应该自动显示，无需点击搜索**
|
||
|
||
---
|
||
|
||
## ✅ 成功标志
|
||
|
||
### Console日志（关键）：
|
||
```javascript
|
||
// 切换选项卡时应该看到：
|
||
选项卡变化： { from: "registration", to: "history" }
|
||
切换到登记历史，加载数据
|
||
登记历史查询参数： { status: "2", ... }
|
||
登记历史查询结果： { total: 3, rows: 3, ... }
|
||
```
|
||
|
||
### 页面表现：
|
||
- ✅ 点击"登记历史"选项卡后，**立即**显示数据列表
|
||
- ✅ 无需点击"搜索"或"刷新"按钮
|
||
- ✅ 显示status='2'（已通过）的数据
|
||
- ✅ 状态标签为绿色"已通过"
|
||
|
||
---
|
||
|
||
## ❌ 如果失败
|
||
|
||
### 情况1：Console没有"选项卡变化"日志
|
||
**原因**：浏览器缓存了旧代码
|
||
**解决**：
|
||
1. 再次强制刷新（Ctrl+Shift+R）
|
||
2. 清除浏览器缓存
|
||
3. 尝试无痕模式
|
||
|
||
### 情况2：有日志但没有数据
|
||
**原因**：数据库没有status='2'的数据
|
||
**解决**：
|
||
```sql
|
||
-- 检查数据
|
||
SELECT COUNT(*) FROM rs_overseas_registration
|
||
WHERE status = '2' AND deleted = '0';
|
||
|
||
-- 如果结果为0，插入测试数据
|
||
INSERT INTO rs_overseas_registration (
|
||
name, gender, birth_date, id_number, political_status, registered_address,
|
||
department, position, administrative_level, personnel_category,
|
||
status, registration_time, remarks,
|
||
tenant_id, create_by, create_time, update_by, update_time, deleted
|
||
) VALUES (
|
||
'测试已通过用户', '0', '1985-06-15', '330106198506151234', '01', '浙江省杭州市',
|
||
'测试部门', '测试职位', '1', 'E',
|
||
'2', NOW(), '已通过的测试数据',
|
||
'000000', 1, NOW(), 1, NOW(), '0'
|
||
);
|
||
```
|
||
|
||
### 情况3：还是需要点击搜索才显示
|
||
**原因**：watch没有正确触发
|
||
**解决**：提供完整的Console截图
|
||
|
||
---
|
||
|
||
## 🔍 对比测试
|
||
|
||
### 修复前：
|
||
1. 切换到"登记历史"选项卡
|
||
2. 页面空白，显示"暂无数据"
|
||
3. **需要手动点击"搜索"按钮**
|
||
4. 数据才显示
|
||
|
||
### 修复后：
|
||
1. 切换到"登记历史"选项卡
|
||
2. **立即自动加载并显示数据**
|
||
3. 无需任何手动操作
|
||
|
||
---
|
||
|
||
## 📊 技术细节
|
||
|
||
### 核心修复代码：
|
||
```javascript
|
||
// 添加watch监听activeTab变化
|
||
watch(() => state.activeTab, (newTab, oldTab) => {
|
||
if (newTab === 'registration') {
|
||
getRegistrationList(); // 加载待审核数据
|
||
} else if (newTab === 'history') {
|
||
getHistoryList(); // 加载已通过数据
|
||
}
|
||
}, { immediate: false });
|
||
```
|
||
|
||
### 为什么这样修复？
|
||
- Element Plus的 `@tab-click` 事件可能不够可靠
|
||
- 使用Vue的 `watch` API更稳定，保证数据自动加载
|
||
- `immediate: false` 避免页面加载时重复触发
|
||
|
||
---
|
||
|
||
## 🎯 测试结果记录
|
||
|
||
请在测试后填写：
|
||
|
||
- [ ] 强制刷新浏览器
|
||
- [ ] 打开Console查看日志
|
||
- [ ] 切换到"登记历史"选项卡
|
||
- [ ] 数据自动显示（无需点击搜索）
|
||
- [ ] Console显示正确的日志
|
||
|
||
**测试结果**：
|
||
- 成功 ✅ / 失败 ❌
|
||
- 截图：（如果失败，提供Console和页面截图）
|
||
|
||
---
|
||
|
||
**修复时间**: 2025-10-11
|
||
**测试类型**: 选项卡自动加载功能测试
|
||
**预计测试时间**: 2分钟
|
||
|