fix: improve checkpoint UX with proper notifications and persistence info

Issues Fixed:
1. Recovery success notification not showing properly
2. Users uncertain about checkpoint persistence after restart

Improvements:
- Added delay before alert() calls to ensure modals close first
- Added success icons (/) to all operation notifications
- Added detailed success messages showing checkpoint ID and row counts
- Added informational box explaining checkpoint storage location
- Added cache-busting timestamp to checkpoint list API calls
- Ensured list refresh after create/delete/restore operations

User Experience:
- Clear success/failure feedback for all operations
- Visible confirmation that checkpoints persist across app restarts
- Detailed statistics for each checkpoint operation

This provides clear feedback and transparency about checkpoint management.

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Codex Agent 2025-10-30 13:47:13 +08:00
parent 6af0255c3a
commit aff3603f35
2 changed files with 10743 additions and 10 deletions

File diff suppressed because one or more lines are too long

View File

@ -1271,7 +1271,8 @@
modal.classList.add('show');
try {
const response = await fetch('/fs-ai-asistant/api/workflow/lawrisk/admin/checkpoints');
// 添加时间戳参数避免缓存
const response = await fetch(`/fs-ai-asistant/api/workflow/lawrisk/admin/checkpoints?t=${Date.now()}`);
const data = await response.json();
if (data.success) {
@ -1307,6 +1308,16 @@
const modalBody = document.getElementById('checkpointModalBody');
let html = '<div class="checkpoint-content">';
// 信息说明
html += `
<div class="checkpoint-info" style="background: #e3f2fd; padding: 15px; border-radius: 6px; margin-bottom: 20px; border-left: 4px solid #2196f3;">
<div style="color: #1976d2; font-size: 13px; line-height: 1.6;">
<strong>💡 说明:</strong>检查点文件保存在服务器的 data/checkpoints/ 目录中,重启应用后检查点不会丢失。
每个检查点包含完整的数据库备份,可以随时恢复。
</div>
</div>
`;
// 创建检查点表单
html += `
<div class="checkpoint-section">
@ -1383,14 +1394,22 @@
const data = await response.json();
if (data.success) {
alert('检查点创建成功!');
document.getElementById('checkpointDescription').value = '';
// 重新加载检查点列表
await openCheckpointModal();
// 显示成功消息
setTimeout(() => {
alert(`✅ 检查点创建成功!\n\nID: ${data.data.checkpoint_id}\n备份了 ${data.data.total_rows} 行数据`);
}, 100);
} else {
alert(`创建失败:${data.message}`);
setTimeout(() => {
alert(`❌ 创建失败:${data.message}`);
}, 100);
}
} catch (error) {
alert(`网络错误:${error.message}`);
setTimeout(() => {
alert(`❌ 网络错误:${error.message}`);
}, 100);
} finally {
btn.disabled = false;
btn.innerHTML = originalText;
@ -1418,13 +1437,20 @@
const data = await response.json();
if (data.success) {
alert(`检查点恢复成功!\n恢复了 ${data.data.total_rows_restored} 行数据,覆盖了 ${data.data.tables_restored} 个表。`);
// 使用定时器延迟alert确保modal已关闭
setTimeout(() => {
alert(`✅ 检查点恢复成功!\n\n恢复了 ${data.data.total_rows_restored} 行数据,覆盖了 ${data.data.tables_restored} 个表。`);
}, 100);
await openCheckpointModal();
} else {
alert(`恢复失败:${data.message}`);
setTimeout(() => {
alert(`❌ 恢复失败:${data.message}`);
}, 100);
}
} catch (error) {
alert(`网络错误:${error.message}`);
setTimeout(() => {
alert(`❌ 网络错误:${error.message}`);
}, 100);
}
}
@ -1441,13 +1467,19 @@
const data = await response.json();
if (data.success) {
alert('检查点已删除');
await openCheckpointModal();
setTimeout(() => {
alert(`✅ 检查点已删除`);
}, 100);
} else {
alert(`删除失败:${data.message}`);
setTimeout(() => {
alert(`❌ 删除失败:${data.message}`);
}, 100);
}
} catch (error) {
alert(`网络错误:${error.message}`);
setTimeout(() => {
alert(`❌ 网络错误:${error.message}`);
}, 100);
}
}