317 lines
9.9 KiB
HTML
317 lines
9.9 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
|
||
<meta http-equiv="Pragma" content="no-cache">
|
||
<meta http-equiv="Expires" content="0">
|
||
<title>🔄 强制清除缓存</title>
|
||
<style>
|
||
* {
|
||
margin: 0;
|
||
padding: 0;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
body {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
min-height: 100vh;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 20px;
|
||
}
|
||
|
||
.container {
|
||
background: white;
|
||
border-radius: 20px;
|
||
box-shadow: 0 20px 60px rgba(0,0,0,0.3);
|
||
padding: 50px;
|
||
max-width: 700px;
|
||
width: 100%;
|
||
text-align: center;
|
||
}
|
||
|
||
h1 {
|
||
font-size: 48px;
|
||
margin-bottom: 20px;
|
||
color: #333;
|
||
}
|
||
|
||
.status {
|
||
font-size: 24px;
|
||
color: #666;
|
||
margin-bottom: 40px;
|
||
}
|
||
|
||
.error-box {
|
||
background: #fee;
|
||
border: 2px solid #f88;
|
||
border-radius: 10px;
|
||
padding: 20px;
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
.error-title {
|
||
color: #c00;
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.error-msg {
|
||
color: #c00;
|
||
font-family: monospace;
|
||
font-size: 14px;
|
||
text-align: left;
|
||
white-space: pre-wrap;
|
||
}
|
||
|
||
.fix-box {
|
||
background: #e7f5ff;
|
||
border: 2px solid #339af0;
|
||
border-radius: 10px;
|
||
padding: 20px;
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
.fix-title {
|
||
color: #1971c2;
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
.fix-msg {
|
||
color: #1971c2;
|
||
font-size: 16px;
|
||
line-height: 1.6;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.steps {
|
||
background: #f8f9fa;
|
||
border-radius: 10px;
|
||
padding: 25px;
|
||
margin: 30px 0;
|
||
}
|
||
|
||
.step {
|
||
background: white;
|
||
border-left: 4px solid #667eea;
|
||
padding: 20px;
|
||
margin-bottom: 15px;
|
||
border-radius: 5px;
|
||
text-align: left;
|
||
}
|
||
|
||
.step-number {
|
||
background: #667eea;
|
||
color: white;
|
||
width: 35px;
|
||
height: 35px;
|
||
border-radius: 50%;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-weight: bold;
|
||
margin-right: 15px;
|
||
}
|
||
|
||
.step-title {
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
color: #333;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.step-desc {
|
||
color: #666;
|
||
font-size: 16px;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.shortcut {
|
||
background: #2d3748;
|
||
color: #fff;
|
||
padding: 8px 15px;
|
||
border-radius: 5px;
|
||
font-family: monospace;
|
||
font-size: 18px;
|
||
display: inline-block;
|
||
margin: 10px 5px;
|
||
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
|
||
}
|
||
|
||
.button {
|
||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
color: white;
|
||
border: none;
|
||
padding: 18px 40px;
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
border-radius: 50px;
|
||
cursor: pointer;
|
||
transition: transform 0.2s, box-shadow 0.2s;
|
||
margin: 10px;
|
||
box-shadow: 0 10px 25px rgba(102, 126, 234, 0.4);
|
||
}
|
||
|
||
.button:hover {
|
||
transform: translateY(-2px);
|
||
box-shadow: 0 15px 35px rgba(102, 126, 234, 0.5);
|
||
}
|
||
|
||
.button:active {
|
||
transform: translateY(0);
|
||
}
|
||
|
||
.success {
|
||
color: #51cf66;
|
||
font-size: 20px;
|
||
margin-top: 20px;
|
||
display: none;
|
||
}
|
||
|
||
@keyframes spin {
|
||
to { transform: rotate(360deg); }
|
||
}
|
||
|
||
.spinning {
|
||
display: inline-block;
|
||
animation: spin 1s linear infinite;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<h1>🔄 强制清除缓存</h1>
|
||
<p class="status">解决 RealtimeDispatch 组件错误</p>
|
||
|
||
<div class="error-box">
|
||
<div class="error-title">❌ 当前错误</div>
|
||
<div class="error-msg">ReferenceError: Send is not defined
|
||
at RealtimeDispatch (components/machinery/scheduling/RealtimeDispatch.tsx:810:15)</div>
|
||
</div>
|
||
|
||
<div class="fix-box">
|
||
<div class="fix-title">✅ 已修复</div>
|
||
<div class="fix-msg">文件已经正确更新，Send 已替换为 CheckCircle2</div>
|
||
<div class="fix-msg">问题在于：<strong>浏览器正在使用缓存的旧版本</strong></div>
|
||
</div>
|
||
|
||
<div class="steps">
|
||
<h2 style="margin-bottom: 25px; color: #333;">📋 清除缓存步骤</h2>
|
||
|
||
<div class="step">
|
||
<span class="step-number">1</span>
|
||
<div style="display: inline-block; vertical-align: top; width: calc(100% - 60px);">
|
||
<div class="step-title">快捷键硬刷新（推荐）</div>
|
||
<div class="step-desc">
|
||
<strong>Windows/Linux:</strong>
|
||
<div>
|
||
<span class="shortcut">Ctrl + Shift + R</span>
|
||
或
|
||
<span class="shortcut">Ctrl + F5</span>
|
||
</div>
|
||
<strong>Mac:</strong>
|
||
<div>
|
||
<span class="shortcut">Cmd + Shift + R</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="step">
|
||
<span class="step-number">2</span>
|
||
<div style="display: inline-block; vertical-align: top; width: calc(100% - 60px);">
|
||
<div class="step-title">开发者工具清除</div>
|
||
<div class="step-desc">
|
||
1. 按 <span class="shortcut">F12</span> 打开开发者工具<br>
|
||
2. 右键点击刷新按钮<br>
|
||
3. 选择"清空缓存并硬性重新加载"
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="step">
|
||
<span class="step-number">3</span>
|
||
<div style="display: inline-block; vertical-align: top; width: calc(100% - 60px);">
|
||
<div class="step-title">自动清除缓存并刷新</div>
|
||
<div class="step-desc">
|
||
点击下方按钮，自动清除缓存并刷新页面
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<button class="button" onclick="forceClearCache()">
|
||
<span id="buttonText">🚀 清除缓存并刷<E5B9B6><E588B7><EFBFBD></span>
|
||
</button>
|
||
|
||
<div class="success" id="success">
|
||
✅ 缓存已清除，正在刷新...
|
||
</div>
|
||
|
||
<div style="margin-top: 40px; padding: 20px; background: #fff3cd; border-radius: 10px; border: 2px solid #ffc107;">
|
||
<h3 style="color: #856404; margin-bottom: 10px;">⚠️ 重要提示</h3>
|
||
<p style="color: #856404; line-height: 1.6;">
|
||
如果以上方法都不起作用：<br>
|
||
1. 完全关闭浏览器<br>
|
||
2. 重新打开浏览器<br>
|
||
3. 访问应用
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
function forceClearCache() {
|
||
const button = document.querySelector('.button');
|
||
const buttonText = document.getElementById('buttonText');
|
||
const success = document.getElementById('success');
|
||
|
||
// 显示加载状态
|
||
buttonText.innerHTML = '<span class="spinning">🔄</span> 正在清除缓存...';
|
||
button.disabled = true;
|
||
|
||
// 清除所有可能的缓存
|
||
if ('caches' in window) {
|
||
caches.keys().then(function(names) {
|
||
names.forEach(function(name) {
|
||
caches.delete(name);
|
||
});
|
||
});
|
||
}
|
||
|
||
// 清除 localStorage
|
||
try {
|
||
localStorage.clear();
|
||
} catch(e) {}
|
||
|
||
// 清除 sessionStorage
|
||
try {
|
||
sessionStorage.clear();
|
||
} catch(e) {}
|
||
|
||
// 显示成功消息
|
||
setTimeout(() => {
|
||
success.style.display = 'block';
|
||
|
||
// 2秒后强制刷新
|
||
setTimeout(() => {
|
||
// 使用多种方法强制刷新
|
||
window.location.reload(true);
|
||
window.location.href = window.location.href + '?nocache=' + Date.now();
|
||
}, 2000);
|
||
}, 1000);
|
||
}
|
||
|
||
// 页面加载时显示当前时间戳
|
||
console.log('页面加载时间:', new Date().toLocaleString());
|
||
console.log('当前时间戳:', Date.now());
|
||
</script>
|
||
</body>
|
||
</html>
|