diff --git a/web/static/css/style.css b/web/static/css/style.css index d03c4c3c..96419805 100644 --- a/web/static/css/style.css +++ b/web/static/css/style.css @@ -1931,37 +1931,66 @@ header { .login-overlay { position: fixed; inset: 0; - background: rgba(0, 0, 0, 0.6); - backdrop-filter: blur(6px); + background: rgba(0, 0, 0, 0.5); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px); display: none; align-items: center; justify-content: center; z-index: 1200; padding: 24px; + animation: loginOverlayIn 0.3s ease-out; +} + +@keyframes loginOverlayIn { + from { opacity: 0; } + to { opacity: 1; } +} + +@keyframes loginCardIn { + from { + opacity: 0; + transform: scale(0.96) translateY(-12px); + } + to { + opacity: 1; + transform: scale(1) translateY(0); + } } .login-card { width: 100%; - max-width: 360px; + max-width: 400px; background: var(--bg-primary); - border-radius: 12px; - padding: 32px 28px; - box-shadow: var(--shadow-lg); + border-radius: 16px; + padding: 0; + box-shadow: 0 24px 48px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.04); border: 1px solid var(--border-color); display: flex; flex-direction: column; - gap: 20px; + gap: 0; + overflow: hidden; + animation: loginCardIn 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } -.login-header h2 { +.login-brand { + padding: 32px 28px 24px; + text-align: center; + background: linear-gradient(180deg, rgba(0, 102, 255, 0.06) 0%, transparent 100%); + border-bottom: 1px solid var(--border-color); +} + +.login-brand h2 { margin: 0; - font-size: 1.5rem; + font-size: 1.375rem; + font-weight: 600; color: var(--text-primary); + letter-spacing: -0.02em; } .login-subtitle { margin: 8px 0 0 0; - font-size: 0.9375rem; + font-size: 0.875rem; color: var(--text-secondary); } @@ -1969,23 +1998,85 @@ header { display: flex; flex-direction: column; gap: 16px; + padding: 24px 28px 28px; +} + +.login-form .form-group { + margin-bottom: 0; +} + +.login-form .form-group label { + display: block; + margin-bottom: 8px; + font-size: 0.8125rem; + font-weight: 500; + color: var(--text-secondary); +} + +.login-form input[type="password"] { + width: 100%; + padding: 12px 14px; + font-size: 0.9375rem; + border: 1px solid var(--border-color); + border-radius: 10px; + background: var(--bg-primary); + color: var(--text-primary); + transition: border-color 0.2s, box-shadow 0.2s; +} + +.login-form input[type="password"]::placeholder { + color: var(--text-muted); +} + +.login-form input[type="password"]:focus { + outline: none; + border-color: var(--accent-color); + box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.15); } .login-error { color: var(--error-color); background: rgba(220, 53, 69, 0.08); - border: 1px solid rgba(220, 53, 69, 0.4); - border-radius: 6px; + border: 1px solid rgba(220, 53, 69, 0.3); + border-radius: 8px; padding: 10px 12px; - font-size: 0.875rem; + font-size: 0.8125rem; } -.login-submit { +.login-card .login-submit { width: 100%; justify-content: center; display: inline-flex; align-items: center; gap: 8px; + padding: 12px 20px; + font-size: 0.9375rem; + font-weight: 600; + border-radius: 10px; + background: linear-gradient(135deg, var(--accent-color) 0%, #0047ab 100%) !important; + border: none !important; + color: #fff !important; + box-shadow: 0 4px 14px rgba(0, 102, 255, 0.4); + transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s; +} + +.login-card .login-submit:hover { + box-shadow: 0 6px 20px rgba(0, 102, 255, 0.45); + transform: translateY(-1px); + background: linear-gradient(135deg, var(--accent-hover) 0%, #003d8a 100%) !important; +} + +.login-card .login-submit:active { + transform: translateY(0); + box-shadow: 0 2px 10px rgba(0, 102, 255, 0.35); +} + +.login-submit-arrow { + transition: transform 0.2s ease; +} + +.login-card .login-submit:hover .login-submit-arrow { + transform: translateX(3px); } /* 模态框样式 */ @@ -8598,6 +8689,8 @@ header { } .dashboard-tools-chart-wrap { + display: flex; + flex-direction: column; min-width: 0; flex: 1; } @@ -8607,6 +8700,7 @@ header { align-items: center; justify-content: center; min-height: 120px; + flex: 1; font-size: 0.8125rem; color: var(--text-muted); background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%); diff --git a/web/static/js/dashboard.js b/web/static/js/dashboard.js index 8e70968c..edf17fb1 100644 --- a/web/static/js/dashboard.js +++ b/web/static/js/dashboard.js @@ -17,7 +17,7 @@ async function refreshDashboard() { setEl('dashboard-kpi-tools-calls', '…'); setEl('dashboard-kpi-success-rate', '…'); var chartPlaceholder = document.getElementById('dashboard-tools-pie-placeholder'); - if (chartPlaceholder) { chartPlaceholder.style.display = 'block'; chartPlaceholder.textContent = '加载中…'; } + if (chartPlaceholder) { chartPlaceholder.style.removeProperty('display'); chartPlaceholder.textContent = '加载中…'; } var barChartEl = document.getElementById('dashboard-tools-bar-chart'); if (barChartEl) { barChartEl.style.display = 'none'; barChartEl.innerHTML = ''; } @@ -134,19 +134,31 @@ async function refreshDashboard() { // 知识:{ enabled, total_categories, total_items, ... }(优化版) const knowledgeItemsEl = document.getElementById('dashboard-knowledge-items'); const knowledgeCategoriesEl = document.getElementById('dashboard-knowledge-categories'); + const knowledgeStatusEl = document.getElementById('dashboard-knowledge-status'); if (knowledgeRes && typeof knowledgeRes === 'object') { if (knowledgeRes.enabled === false) { - if (knowledgeItemsEl) knowledgeItemsEl.textContent = '未启用'; + // 功能未启用:用状态标签展示,数值保持为 "-" + if (knowledgeStatusEl) knowledgeStatusEl.textContent = '未启用'; + if (knowledgeItemsEl) knowledgeItemsEl.textContent = '-'; if (knowledgeCategoriesEl) knowledgeCategoriesEl.textContent = '-'; } else { const categories = knowledgeRes.total_categories ?? 0; const items = knowledgeRes.total_items ?? 0; if (knowledgeItemsEl) knowledgeItemsEl.textContent = formatNumber(items); if (knowledgeCategoriesEl) knowledgeCategoriesEl.textContent = formatNumber(categories); + // 根据数据量给个轻量状态文案 + if (knowledgeStatusEl) { + if (items > 0 || categories > 0) { + knowledgeStatusEl.textContent = '已启用'; + } else { + knowledgeStatusEl.textContent = '待配置'; + } + } } } else { if (knowledgeItemsEl) knowledgeItemsEl.textContent = '-'; if (knowledgeCategoriesEl) knowledgeCategoriesEl.textContent = '-'; + if (knowledgeStatusEl) knowledgeStatusEl.textContent = '-'; } // Skills:{ total_skills, total_calls, ... }(优化版) @@ -188,7 +200,7 @@ async function refreshDashboard() { setEl('dashboard-kpi-tools-calls', '-'); renderDashboardToolsBar(null); var ph = document.getElementById('dashboard-tools-pie-placeholder'); - if (ph) { ph.style.display = 'block'; ph.textContent = '暂无调用数据'; } + if (ph) { ph.style.removeProperty('display'); ph.textContent = '暂无调用数据'; } } } @@ -201,7 +213,7 @@ function setDashboardOverviewPlaceholder(t) { ['dashboard-batch-pending', 'dashboard-batch-running', 'dashboard-batch-done', 'dashboard-batch-total', 'dashboard-tools-count', 'dashboard-tools-calls', 'dashboard-tools-success-rate', 'dashboard-skills-count', 'dashboard-skills-calls', 'dashboard-skills-status', - 'dashboard-knowledge-items', 'dashboard-knowledge-categories'].forEach(id => setEl(id, t)); + 'dashboard-knowledge-items', 'dashboard-knowledge-categories', 'dashboard-knowledge-status'].forEach(id => setEl(id, t)); updateProgressBar('dashboard-batch-progress-pending', '0'); updateProgressBar('dashboard-batch-progress-running', '0'); updateProgressBar('dashboard-batch-progress-done', '0'); @@ -244,7 +256,8 @@ function renderDashboardToolsBar(monitorRes) { if (!placeholder || !barChartEl) return; if (!monitorRes || typeof monitorRes !== 'object') { - placeholder.style.display = 'block'; + placeholder.style.removeProperty('display'); + placeholder.textContent = '暂无调用数据'; barChartEl.style.display = 'none'; barChartEl.innerHTML = ''; return; @@ -259,7 +272,8 @@ function renderDashboardToolsBar(monitorRes) { .slice(0, 30); if (entries.length === 0) { - placeholder.style.display = 'block'; + placeholder.style.removeProperty('display'); + placeholder.textContent = '暂无调用数据'; barChartEl.style.display = 'none'; barChartEl.innerHTML = ''; return; diff --git a/web/templates/index.html b/web/templates/index.html index c9eb526c..753b43e6 100644 --- a/web/templates/index.html +++ b/web/templates/index.html @@ -11,7 +11,7 @@ @@ -299,6 +304,7 @@
知识 + -
-