功能概述:
- 使用localStorage存储最近一次导入任务信息
- 支持切换菜单后查看上一次的导入失败记录
- 自动过期处理(7天)
- 完整的错误处理和用户友好的提示信息
- 新增清除历史记录功能
核心实现:
- saveImportTaskToStorage: 保存导入状态到localStorage
- getImportTaskFromStorage: 读取并验证导入状态
- clearImportTaskFromStorage: 清除localStorage数据
- restoreImportState: 页面加载时恢复导入状态
- getLastImportTooltip: 获取导入时间提示
- clearImportHistory: 用户手动清除历史记录
导入流程增强:
- handleFileSuccess: 保存初始状态,清除旧数据
- handleImportComplete: 保存完整状态,更新UI
- startImportStatusPolling: 添加5分钟超时机制
错误处理增强:
- getFailureList: 分类处理404/500/网络错误
- 404错误时自动清除localStorage并隐藏按钮
- 友好的用户提示信息
UI优化:
- lastImportInfo计算属性显示导入统计
- 失败记录按钮tooltip显示导入时间
- 失败记录对话框显示完整统计信息
- 对话框添加清除历史记录按钮
测试场景:
- 导入成功无失败后刷新页面
- 导入有失败后刷新页面
- 导入有失败后切换菜单
- 新导入覆盖旧记录
- 手动清除历史记录
- localStorage过期处理
相关提交:
- b932a7d docs: 添加员工导入结果跨页面持久化设计文档
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
41 lines
1.3 KiB
JavaScript
41 lines
1.3 KiB
JavaScript
|
|
// 在浏览器控制台执行以下代码进行测试
|
|
|
|
// 步骤1: 设置测试数据
|
|
localStorage.setItem('employee_import_last_task', JSON.stringify({
|
|
taskId: 'test-restore-123',
|
|
status: 'PARTIAL_SUCCESS',
|
|
timestamp: 1770351539124,
|
|
saveTime: 1770351539124,
|
|
hasFailures: true,
|
|
totalCount: 100,
|
|
successCount: 95,
|
|
failureCount: 5
|
|
}));
|
|
|
|
console.log('✓ 测试数据已设置到localStorage');
|
|
|
|
// 步骤2: 刷新页面后验证状态恢复
|
|
console.log('请刷新页面,然后检查以下内容:');
|
|
console.log('1. 是否显示"查看导入失败记录"按钮?');
|
|
console.log('2. currentTaskId 是否为 "test-restore-123"?');
|
|
console.log('3. showFailureButton 是否为 true?');
|
|
|
|
// 步骤3: 在Vue DevTools或控制台中检查
|
|
// setTimeout(() => {
|
|
// const vm = window.$vm; // 假设可以访问Vue实例
|
|
// console.log('currentTaskId:', vm.$data.currentTaskId);
|
|
// console.log('showFailureButton:', vm.$data.showFailureButton);
|
|
// }, 1000);
|
|
|
|
// 步骤4: 测试getLastImportTooltip方法
|
|
// 在Vue DevTools的Console中执行:
|
|
// const vm = window.$vm;
|
|
// console.log('上次导入提示:', vm.getLastImportTooltip());
|
|
|
|
// 步骤5: 测试clearImportHistory方法
|
|
// 需要在Vue实例中调用 clearImportHistory()
|
|
|
|
// 清理测试数据
|
|
// localStorage.removeItem('employee_import_last_task');
|