qyyfw/qihuaiflow
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: light theme cards, sidebar collapse, frontend link, dashboard grid

Browse Source
This commit is contained in:
qyyfw committed 2026-07-07 23:03:06 +08:00
1 parent e38a32e04e
commit a6522d5069
5 files changed
+399 -474
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/src/pages/admin/Dashboard.tsx
+9 -8
View File
@@ -67,7 +67,7 @@ const BarChart: React.FC<{ data: DailyStat[] }> = ({ data }) => {
const y = padTop + barAreaH - (tick / maxVal) * barAreaH;
return (
<g key={i}>
<line x1={padLeft} y1={y} x2={w - padRight} y2={y} stroke="rgba(255,255,255,0.08)" strokeWidth="0.5" />
<line x1={padLeft} y1={y} x2={w - padRight} y2={y} stroke="rgba(0,0,0,0.06)" strokeWidth="0.5" />
<text x={padLeft - 8} y={y + 4} textAnchor="end" fontSize="10" fill="#6B7280">{formatK(tick)}</text>
</g>
);
@@ -100,7 +100,7 @@ const MiniDonut: React.FC<{ value: number; max: number; color: string }> = ({ va
const dash = circumference * pct;
return (
<svg width={c * 2} height={c * 2} viewBox={`0 0 ${c * 2} ${c * 2}`}>
<circle cx={c} cy={c} r={r} fill="none" stroke="rgba(255,255,255,0.08)" strokeWidth="3" />
<circle cx={c} cy={c} r={r} fill="none" stroke="rgba(0,0,0,0.06)" strokeWidth="3" />
<circle cx={c} cy={c} r={r} fill="none" stroke={color} strokeWidth="3"
strokeDasharray={`${dash} ${circumference - dash}`} strokeLinecap="round"
transform={`rotate(-90 ${c} ${c})`} style={{ transition: 'stroke-dasharray 0.6s ease' }} />
@@ -200,7 +200,7 @@ const Dashboard: React.FC = () => {
<h1 className="admin-page-title">平台驾驶舱</h1>
{/* Stats Cards Row */}
<div className="admin-stats" style={{ gridTemplateColumns: 'repeat(auto-fit, minmax(200px, 1fr))' }}>
<div className="admin-stats" style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(200px, 1fr))', gap: '16px', marginBottom: '24px' }}>
{statCardDefs.map((s, i) => (
<div key={i} className="admin-stat-card" style={{
display: 'flex', alignItems: 'flex-start', gap: 'var(--space-lg)',
@@ -259,10 +259,10 @@ const Dashboard: React.FC = () => {
{ label: '用户活跃率', value: `${stats.active_users}/${stats.total_users}`, color: '#E8922C', pct: stats.total_users > 0 ? stats.active_users / stats.total_users : 0 },
{ label: '对话活跃率', value: `${stats.active_conversations}/${stats.total_conversations}`, color: '#3B82F6', pct: stats.total_conversations > 0 ? stats.active_conversations / stats.total_conversations : 0 },
].map((item, i) => (
<div key={i} style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '10px 0', borderBottom: i < 3 ? '1px solid rgba(255,255,255,0.06)' : 'none' }}>
<div key={i} style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '10px 0', borderBottom: i < 3 ? '1px solid rgba(0,0,0,0.06)' : 'none' }}>
<div style={{ display: 'flex', alignItems: 'center', gap: 10 }}>
<MiniDonut value={item.pct * 100} max={100} color={item.color} />
<span style={{ fontSize: 13, color: '#CCD6F6' }}>{item.label}</span>
<span style={{ fontSize: 13, color: '#1A1F36' }}>{item.label}</span>
</div>
<span style={{ fontSize: 15, fontWeight: 700, color: item.color, fontFamily: 'var(--font-mono)' }}>{item.value}</span>
</div>
@@ -276,16 +276,17 @@ const Dashboard: React.FC = () => {
{/* Quick Actions */}
<div style={{ marginBottom: 'var(--space-xl)' }}>
<h3 style={{ fontSize: 15, fontWeight: 600, marginBottom: 12, color: '#CCD6F6' }}>快捷入口</h3>
<h3 style={{ fontSize: 15, fontWeight: 600, marginBottom: 12, color: '#1A1F36' }}>快捷入口</h3>
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(160px, 1fr))', gap: 'var(--space-md)' }}>
{quickEntries.map((entry) => (
<div
key={entry.path}
onClick={() => navigate(entry.path)}
style={{
background: 'rgba(17,22,39,0.5)', borderRadius: 'var(--radius-lg)', border: '1px solid var(--color-border)',
background: '#FFFFFF', borderRadius: 'var(--radius-lg)', border: '1px solid rgba(0,0,0,0.08)',
padding: 'var(--space-md) var(--space-lg)', cursor: 'pointer', transition: 'all 0.2s',
display: 'flex', alignItems: 'center', gap: 'var(--space-md)',
boxShadow: '0 1px 3px rgba(0,0,0,0.04)',
}}
onMouseEnter={(e) => {
e.currentTarget.style.borderColor = '#6C63FF';
@@ -300,7 +301,7 @@ const Dashboard: React.FC = () => {
>
<div style={{ color: '#6C63FF', flexShrink: 0 }}>{entry.icon}</div>
<div>
<div style={{ fontSize: 13, fontWeight: 600, color: '#CCD6F6' }}>{entry.label}</div>
<div style={{ fontSize: 13, fontWeight: 600, color: '#1A1F36' }}>{entry.label}</div>
<div style={{ fontSize: 11, color: '#6B7280' }}>{entry.desc}</div>
</div>
</div>
frontend/src/pages/front/LoginPage.css
+5 -5
View File
@@ -59,7 +59,7 @@
display: flex;
width: 900px;
min-height: 560px;
background: rgba(17, 22, 39, 0.95);
background: #FFFFFF;
backdrop-filter: blur(24px);
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 20px;
@@ -82,7 +82,7 @@
padding: 48px 40px;
display: flex;
align-items: center;
border-right: 1px solid rgba(255, 255, 255, 0.04);
border-right: 1px solid rgba(0, 0, 0, 0.06);
}
.brand-content {
@@ -150,7 +150,7 @@
/* Tabs */
.login-tabs {
display: flex;
background: rgba(255, 255, 255, 0.04);
background: rgba(0, 0, 0, 0.03);
border-radius: 10px;
padding: 4px;
margin-bottom: 24px;
@@ -217,7 +217,7 @@
padding: 12px 14px;
border-radius: 10px;
border: 1px solid rgba(0, 0, 0, 0.10);
background: rgba(255, 255, 255, 0.03);
background: rgba(0, 0, 0, 0.02);
color: #1A1F36;
font-size: 14px;
outline: none;
@@ -339,7 +339,7 @@
width: 100%;
padding: 32px 24px;
border-right: none;
border-bottom: 1px solid rgba(255, 255, 255, 0.04);
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.login-form-panel {
padding: 32px 24px;