feat: 管理首页新增会话存储后端状态展示

- 仪表盘新增「会话存储后端」卡片,显示 Redis/内存 模式
- 降级时显示「已降级」标签 + 降级说明
- 内存模式下显示活跃会话数
- 新增 stat-red / stat-desc / stat-badge / badge-warn CSS 样式
This commit is contained in:
2026-05-31 11:38:31 +08:00
parent 5a8b0ca79c
commit 12de8be0cf
5 changed files with 37 additions and 3 deletions

View File

@ -19,6 +19,23 @@
</div>
</div>
<div class="stats-grid" style="margin-top: 1rem;">
<div class="stat-card" style="grid-column: span 2;">
<div class="stat-icon {{if .StoreDegraded}}stat-red{{else if eq .StoreType "redis"}}stat-green{{else}}stat-blue{{end}}">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3"/><path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"/></svg>
</div>
<div class="stat-info">
<div class="stat-label">会话存储后端</div>
<div class="stat-value">
{{if eq .StoreType "redis"}}Redis{{else}}内存{{end}}
{{if .StoreDegraded}}<span class="stat-badge badge-warn">已降级</span>{{end}}
</div>
{{if .DegradedNote}}<div class="stat-desc">{{.DegradedNote}}</div>{{end}}
{{if ge .ActiveSessions 0}}<div class="stat-desc">活跃会话数:{{.ActiveSessions}}</div>{{end}}
</div>
</div>
</div>
<div class="info-card">
<h3>快速开始</h3>
<ul>

View File

@ -138,8 +138,12 @@ a:hover { color: var(--primary-hover); }
.stat-blue { background: #e3f2fd; color: var(--primary); }
.stat-green { background: #e8f5e9; color: var(--success); }
.stat-orange { background: #fff3e0; color: var(--warning); }
.stat-red { background: #ffebee; color: var(--danger, #e53935); }
.stat-label { font-size: 12px; color: var(--text-muted); }
.stat-value { font-size: 22px; font-weight: 600; color: var(--text); }
.stat-desc { font-size: 12px; color: var(--text-muted); margin-top: 4px; }
.stat-badge { display: inline-block; font-size: 11px; padding: 1px 8px; border-radius: 10px; margin-left: 8px; vertical-align: middle; }
.badge-warn { background: #fff3e0; color: var(--warning); }
/* --- 信息卡片 --- */
.info-card {