生产管理系统前端 - 瓦力0.73原型图提交

This commit is contained in:
2025-10-28 19:51:17 +08:00
parent 58f5ca7f22
commit e3829d2fcc
154 changed files with 24913 additions and 9377 deletions

392
src/SIMPLE_CACHE_FIX.html Normal file
View File

@@ -0,0 +1,392 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>部门管理 - 快速修复浏览器缓存</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 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);
max-width: 600px;
width: 100%;
padding: 40px;
animation: slideIn 0.5s ease-out;
}
@keyframes slideIn {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
h1 {
color: #22c55e;
font-size: 32px;
margin-bottom: 10px;
text-align: center;
}
.subtitle {
text-align: center;
color: #666;
margin-bottom: 40px;
font-size: 16px;
}
.step {
background: #f9fafb;
border-left: 4px solid #22c55e;
padding: 20px;
margin: 20px 0;
border-radius: 8px;
position: relative;
}
.step-number {
position: absolute;
left: -12px;
top: 20px;
background: #22c55e;
color: white;
width: 28px;
height: 28px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
font-size: 14px;
}
.step-content {
margin-left: 30px;
}
.step h3 {
color: #1f2937;
font-size: 18px;
margin-bottom: 10px;
}
.step p {
color: #4b5563;
line-height: 1.6;
margin: 8px 0;
}
.keyboard-key {
display: inline-block;
background: #e5e7eb;
border: 2px solid #d1d5db;
border-radius: 5px;
padding: 4px 10px;
font-family: 'Courier New', monospace;
font-weight: bold;
color: #1f2937;
margin: 0 2px;
box-shadow: 0 2px 0 #9ca3af;
}
.btn {
background: #22c55e;
color: white;
border: none;
padding: 16px 32px;
font-size: 18px;
font-weight: 600;
border-radius: 12px;
cursor: pointer;
width: 100%;
margin: 20px 0;
transition: all 0.3s;
box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
}
.btn:hover {
background: #16a34a;
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(34, 197, 94, 0.4);
}
.btn:active {
transform: translateY(0);
}
.warning {
background: #fef3c7;
border-left: 4px solid #f59e0b;
padding: 15px;
border-radius: 8px;
margin: 20px 0;
}
.warning-title {
color: #92400e;
font-weight: bold;
margin-bottom: 8px;
display: flex;
align-items: center;
gap: 8px;
}
.warning p {
color: #78350f;
margin: 5px 0;
font-size: 14px;
}
.success {
background: #d1fae5;
border-left: 4px solid #10b981;
padding: 15px;
border-radius: 8px;
margin: 20px 0;
display: none;
}
.success-title {
color: #065f46;
font-weight: bold;
margin-bottom: 8px;
}
.success p {
color: #047857;
margin: 5px 0;
font-size: 14px;
}
.spinner {
border: 3px solid #f3f4f6;
border-top: 3px solid #22c55e;
border-radius: 50%;
width: 20px;
height: 20px;
animation: spin 1s linear infinite;
display: inline-block;
margin-right: 10px;
vertical-align: middle;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.browser-icons {
display: flex;
justify-content: space-around;
margin: 30px 0;
padding: 20px;
background: #f9fafb;
border-radius: 12px;
}
.browser-icon {
text-align: center;
padding: 15px;
border-radius: 8px;
transition: all 0.3s;
}
.browser-icon:hover {
background: white;
transform: translateY(-5px);
}
.browser-icon img {
width: 48px;
height: 48px;
margin-bottom: 8px;
}
.browser-icon span {
display: block;
font-size: 12px;
color: #6b7280;
}
</style>
</head>
<body>
<div class="container">
<h1>🔧 快速修复</h1>
<p class="subtitle">部门管理打不开?三步解决!</p>
<div class="warning">
<div class="warning-title">
<span>⚠️</span>
<span>错误提示</span>
</div>
<p><strong>Failed to load resource: net::ERR_CONNECTION_REFUSED</strong></p>
<p>这是浏览器缓存问题,按照下面步骤操作即可解决</p>
</div>
<!-- 方法一:一键清除 -->
<div class="step">
<div class="step-number">1</div>
<div class="step-content">
<h3>方法一:一键清除(最快)</h3>
<p>点击下面的按钮,自动清除所有缓存:</p>
<button class="btn" onclick="quickClear()">
🗑️ 一键清除缓存
</button>
<div id="clearStatus"></div>
</div>
</div>
<!-- 方法二:键盘快捷键 -->
<div class="step">
<div class="step-number">2</div>
<div class="step-content">
<h3>方法二:键盘快捷键(推荐)</h3>
<p><strong>Windows/Linux:</strong></p>
<p>按住 <span class="keyboard-key">Ctrl</span> + <span class="keyboard-key">Shift</span> + <span class="keyboard-key">Delete</span></p>
<p style="margin-top: 15px;"><strong>Mac:</strong></p>
<p>按住 <span class="keyboard-key">Cmd</span> + <span class="keyboard-key">Shift</span> + <span class="keyboard-key">Delete</span></p>
<p style="margin-top: 15px;">然后:</p>
<p>✅ 选择"全部时间"</p>
<p>✅ 勾选"缓存的图片和文件"</p>
<p>✅ 点击"清除数据"</p>
</div>
</div>
<!-- 方法三:硬刷新 -->
<div class="step">
<div class="step-number">3</div>
<div class="step-content">
<h3>方法三:强制刷新(最简单)</h3>
<p><strong>Windows/Linux:</strong></p>
<p><span class="keyboard-key">Ctrl</span> + <span class="keyboard-key">F5</span></p>
<p style="margin-top: 10px;"></p>
<p><span class="keyboard-key">Ctrl</span> + <span class="keyboard-key">Shift</span> + <span class="keyboard-key">R</span></p>
<p style="margin-top: 15px;"><strong>Mac:</strong></p>
<p><span class="keyboard-key">Cmd</span> + <span class="keyboard-key">Shift</span> + <span class="keyboard-key">R</span></p>
</div>
</div>
<div class="success" id="successMessage">
<div class="success-title">✅ 清除成功!</div>
<p>缓存已清除,请按照以下步骤操作:</p>
<p>1. 刷新页面F5</p>
<p>2. 访问:中心配置管理系统 → 用户管理 → 部门管理</p>
<p>3. 如果还是不行,请完全关闭浏览器后重新打开</p>
</div>
<div class="browser-icons">
<div class="browser-icon">
<div style="font-size: 32px;">🌐</div>
<span>Chrome</span>
</div>
<div class="browser-icon">
<div style="font-size: 32px;">🦊</div>
<span>Firefox</span>
</div>
<div class="browser-icon">
<div style="font-size: 32px;">🧭</div>
<span>Safari</span>
</div>
<div class="browser-icon">
<div style="font-size: 32px;">🔷</div>
<span>Edge</span>
</div>
</div>
</div>
<script>
function quickClear() {
const statusDiv = document.getElementById('clearStatus');
const successDiv = document.getElementById('successMessage');
const btn = event.target;
// 显示加载状态
btn.disabled = true;
btn.innerHTML = '<span class="spinner"></span>正在清除缓存...';
statusDiv.style.background = '#dbeafe';
statusDiv.style.padding = '15px';
statusDiv.style.borderRadius = '8px';
statusDiv.style.marginTop = '15px';
statusDiv.innerHTML = '<p style="color: #1e40af;">⏳ 正在清除缓存,请稍候...</p>';
try {
// 清除 localStorage
const localStorageKeys = Object.keys(localStorage);
localStorage.clear();
// 清除 sessionStorage
sessionStorage.clear();
// 清除 Cache Storage (如果支持)
if ('caches' in window) {
caches.keys().then(names => {
names.forEach(name => caches.delete(name));
});
}
// 显示成功消息
setTimeout(() => {
btn.innerHTML = '✅ 清除完成!';
btn.style.background = '#10b981';
statusDiv.style.display = 'none';
successDiv.style.display = 'block';
// 3秒后自动刷新
setTimeout(() => {
if (confirm('缓存已清除!是否立即刷新页面?')) {
location.reload(true);
}
}, 2000);
}, 1500);
} catch (error) {
statusDiv.style.background = '#fee2e2';
statusDiv.innerHTML = '<p style="color: #dc2626;">❌ 清除失败:' + error.message + '</p><p style="color: #dc2626; margin-top: 10px;">请尝试手动清除(方法二或方法三)</p>';
btn.disabled = false;
btn.innerHTML = '🔄 重试';
}
}
// 页面加载时自动检测
window.addEventListener('load', () => {
console.log('🔍 开始检测缓存问题...');
// 检查是否有部门管理相关的localStorage
const hasDeptData = localStorage.getItem('smart_agriculture_departments');
if (!hasDeptData) {
console.log('⚠️ 未找到部门数据,可能是首次访问或缓存问题');
} else {
console.log('✅ 找到部门数据');
try {
const data = JSON.parse(hasDeptData);
console.log('📊 部门数量:', data.length);
} catch (e) {
console.error('❌ 部门数据解析失败:', e);
}
}
});
</script>
</body>
</html>