From 1b5b13b4ada326c3c8cd8a5df8d2db051a892f75 Mon Sep 17 00:00:00 2001 From: aaron <> Date: Wed, 4 Feb 2026 21:41:59 +0800 Subject: [PATCH] =?UTF-8?q?update=20=E5=90=8E=E5=8F=B0=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/admin.html | 261 ++++++++++++++++++++++++++++++-------------- 1 file changed, 181 insertions(+), 80 deletions(-) diff --git a/frontend/admin.html b/frontend/admin.html index 63784be..9b94aaa 100644 --- a/frontend/admin.html +++ b/frontend/admin.html @@ -9,7 +9,61 @@ .admin-page { min-height: 100vh; background: var(--bg-primary); + display: flex; + } + + .admin-sidebar { + width: 240px; + background: var(--bg-secondary); + border-right: 1px solid var(--border); + padding: 20px 0; + position: fixed; + height: 100vh; + overflow-y: auto; + } + + .admin-logo { + padding: 0 20px 20px; + border-bottom: 1px solid var(--border); + margin-bottom: 20px; + } + + .admin-logo h2 { + font-size: 18px; + font-weight: 300; + color: var(--text-primary); + } + + .admin-nav { + list-style: none; + padding: 0; + margin: 0; + } + + .admin-nav-item { + padding: 12px 20px; + color: var(--text-secondary); + cursor: pointer; + transition: all 0.2s; + border-left: 3px solid transparent; + } + + .admin-nav-item:hover { + background: var(--bg-primary); + color: var(--text-primary); + } + + .admin-nav-item.active { + background: var(--bg-primary); + color: var(--accent); + border-left-color: var(--accent); + } + + .admin-main { + margin-left: 240px; + flex: 1; padding: 20px; + min-width: 800px; /* 设置最小宽度 */ } .admin-container { @@ -21,7 +75,7 @@ display: flex; justify-content: space-between; align-items: center; - margin-bottom: 40px; + margin-bottom: 30px; padding-bottom: 20px; border-bottom: 1px solid var(--border); } @@ -34,26 +88,26 @@ .stats-grid { display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 20px; - margin-bottom: 40px; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 16px; + margin-bottom: 30px; } .stat-card { background: var(--bg-secondary); - border: 1px solid var(--border-bright); + border: 1px solid var(--border); border-radius: 4px; - padding: 24px; + padding: 16px; } .stat-label { - font-size: 13px; + font-size: 12px; color: var(--text-secondary); - margin-bottom: 8px; + margin-bottom: 6px; } .stat-value { - font-size: 32px; + font-size: 24px; font-weight: 300; color: var(--accent); } @@ -73,7 +127,7 @@ .search-input { flex: 1; - padding: 12px 16px; + padding: 10px 14px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 2px; @@ -87,7 +141,7 @@ } .search-btn { - padding: 12px 24px; + padding: 10px 20px; background: var(--accent); border: none; border-radius: 2px; @@ -101,10 +155,27 @@ box-shadow: 0 0 16px var(--accent-dim); } + .logout-btn { + padding: 8px 16px; + background: transparent; + border: 1px solid var(--border-bright); + border-radius: 2px; + color: var(--text-secondary); + font-size: 13px; + cursor: pointer; + transition: all 0.2s; + white-space: nowrap; /* 防止文字换行 */ + } + + .logout-btn:hover { + border-color: var(--accent); + color: var(--accent); + } + .users-table { width: 100%; background: var(--bg-secondary); - border: 1px solid var(--border-bright); + border: 1px solid var(--border); border-radius: 4px; overflow: hidden; } @@ -116,7 +187,7 @@ .users-table th { background: var(--bg-primary); - padding: 16px; + padding: 12px 16px; text-align: left; font-size: 13px; font-weight: 500; @@ -125,7 +196,7 @@ } .users-table td { - padding: 16px; + padding: 12px 16px; font-size: 14px; color: var(--text-primary); border-bottom: 1px solid var(--border); @@ -288,77 +359,97 @@
-
-
-

后台管理

- + +
+ +
    +
  • + 数据统计 +
  • +
  • + 用户管理 +
  • +
+
- -
-
-
用户总数
-
{{ stats.total_users }}
+ +
+
+
+

{{ currentViewTitle }}

+
-
-
活跃用户(7天)
-
{{ stats.active_users }}
+ + +
+
+
+
用户总数
+
{{ stats.total_users }}
+
+
+
活跃用户(7天)
+
{{ stats.active_users }}
+
+
+
对话总数
+
{{ stats.total_conversations }}
+
+
+
消息总数
+
{{ stats.total_messages }}
+
+
-
-
对话总数
-
{{ stats.total_conversations }}
+ + +
+ + +
+ + + + + + + + + + + + + + + + + + + +
ID手机号注册时间最后登录状态
{{ user.id }}{{ user.phone }}{{ formatDate(user.created_at) }}{{ formatDate(user.last_login_at) }} + + {{ user.is_active ? '正常' : '禁用' }} + +
+
+ +
-
-
消息总数
-
{{ stats.total_messages }}
-
-
- - -

用户管理

- - - -
- - - - - - - - - - - - - - - - - - - -
ID手机号注册时间最后登录状态
{{ user.id }}{{ user.phone }}{{ formatDate(user.created_at) }}{{ formatDate(user.last_login_at) }} - - {{ user.is_active ? '正常' : '禁用' }} - -
-
- -
@@ -375,6 +466,7 @@ password: '', errorMessage: '', adminPassword: '', + currentView: 'users', // 当前视图:dashboard 或 users stats: { total_users: 0, active_users: 0, @@ -389,6 +481,15 @@ total: 0 }; }, + computed: { + currentViewTitle() { + const titles = { + 'dashboard': '数据统计', + 'users': '用户管理' + }; + return titles[this.currentView] || '后台管理'; + } + }, mounted() { // 检查是否已登录 const savedPassword = sessionStorage.getItem('admin_password');