From fe91a8ffb258a0796d8a2968d2f230b5f6ef6ff4 Mon Sep 17 00:00:00 2001
From: kevin <kevin@lmve.net>
Date: Fri, 3 Jul 2026 10:24:52 +0800
Subject: [PATCH] =?UTF-8?q?=E7=AE=A1=E7=90=86=E5=90=8E=E5=8F=B0=E6=96=B0?=
 =?UTF-8?q?=E5=A2=9E=E7=94=A8=E6=88=B7=E6=80=BB=E6=95=B0=E5=8D=A1=E7=89=87?=
 =?UTF-8?q?=EF=BC=8C=E7=82=B9=E5=87=BB=E8=BF=9B=E5=85=A5=E7=94=A8=E6=88=B7?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=EF=BC=8C=E7=A7=BB=E9=99=A4header=E7=94=A8?=
 =?UTF-8?q?=E6=88=B7=E7=AE=A1=E7=90=86=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/App.vue             |  8 -------
 frontend/src/views/AdminView.vue | 36 ++++++++++++++++++++++++++------
 internal/handler/user.go         |  6 ++++++
 internal/router/router.go        |  1 +
 4 files changed, 37 insertions(+), 14 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 636de6c..7eb0bd9 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -52,14 +52,6 @@ const navLinks = [
               >
                 管理后台
               </RouterLink>
-              <RouterLink
-                to="/admin/users"
-                class="px-3 py-1.5 rounded-md text-sm font-medium transition-colors
-                       hover:bg-sky-500/40"
-                active-class="bg-sky-700/60"
-              >
-                用户管理
-              </RouterLink>
             </template>
             <a
               href="#"
diff --git a/frontend/src/views/AdminView.vue b/frontend/src/views/AdminView.vue
index fcb50e2..889c364 100644
--- a/frontend/src/views/AdminView.vue
+++ b/frontend/src/views/AdminView.vue
@@ -6,16 +6,38 @@ import { useAuthStore } from '@/stores/auth'
 const router = useRouter()
 const authStore = useAuthStore()
 const stats = ref([
-  { label: '运行时长', value: '--', unit: '', icon: 'M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z' },
-  { label: '活跃设备', value: '--', unit: '', icon: 'M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z' },
-  { label: '今日流量', value: '--', unit: 'GB', icon: 'M7 12l3-3 3 3 4-4M8 21l4-4 4 4M3 4h18M4 4h16v12a1 1 0 01-1 1H5a1 1 0 01-1-1V4z' },
-  { label: '在线节点', value: '--', unit: '', icon: 'M5 12h14M12 5l7 7-7 7' },
+  { label: '运行时长', value: '--', unit: '', icon: 'M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z', route: '' },
+  { label: '活跃设备', value: '--', unit: '', icon: 'M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z', route: '' },
+  { label: '今日流量', value: '--', unit: 'GB', icon: 'M7 12l3-3 3 3 4-4M8 21l4-4 4 4M3 4h18M4 4h16v12a1 1 0 01-1 1H5a1 1 0 01-1-1V4z', route: '' },
+  { label: '在线节点', value: '--', unit: '', icon: 'M5 12h14M12 5l7 7-7 7', route: '' },
+  { label: '用户总数', value: '--', unit: '', icon: 'M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z', route: '/admin/users' },
 ])
 
+const userCount = ref<number | null>(null)
+
+async function fetchUserCount() {
+  try {
+    const res = await fetch('/api/admin/users/count', {
+      headers: { Authorization: `Bearer ${authStore.token}` },
+    })
+    if (res.ok) {
+      const data = await res.json()
+      userCount.value = data.count
+      const stat = stats.value.find(s => s.label === '用户总数')
+      if (stat) stat.value = String(data.count)
+    }
+  } catch {}
+}
+
 onMounted(async () => {
   await authStore.fetchUser()
+  fetchUserCount()
 })
 
+function handleStatClick(route: string) {
+  if (route) router.push(route)
+}
+
 function handleLogout() {
   authStore.logout()
   router.push('/')
@@ -26,11 +48,13 @@ function handleLogout() {
   <div class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl font-bold text-gray-900 dark:text-white mb-8">管理后台</h2>
 
-    <div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-4 mb-8">
+    <div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-5 mb-8">
       <div
         v-for="stat in stats"
         :key="stat.label"
-        class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 p-5"
+        class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 p-5 transition-colors"
+        :class="stat.route ? 'cursor-pointer hover:bg-sky-50 dark:hover:bg-sky-900/20' : ''"
+        @click="handleStatClick(stat.route)"
       >
         <div class="flex items-center gap-3">
           <div class="w-10 h-10 rounded-lg bg-sky-100 dark:bg-sky-900/40 flex items-center justify-center">
diff --git a/internal/handler/user.go b/internal/handler/user.go
index 934e989..c3e3a2c 100644
--- a/internal/handler/user.go
+++ b/internal/handler/user.go
@@ -44,6 +44,12 @@ func formatUser(u *model.User) userResponse {
 	}
 }
 
+func GetUserCount(c *gin.Context) {
+	var count int64
+	db.DB.Model(&model.User{}).Count(&count)
+	c.JSON(http.StatusOK, gin.H{"count": count})
+}
+
 func ListUsers(c *gin.Context) {
 	var users []model.User
 	db.DB.Order("id asc").Find(&users)
diff --git a/internal/router/router.go b/internal/router/router.go
index 4deae44..620f37f 100644
--- a/internal/router/router.go
+++ b/internal/router/router.go
@@ -26,6 +26,7 @@ func Setup(r *gin.Engine) {
 	admin := r.Group("/api/admin")
 	admin.Use(middleware.AuthMiddleware(), middleware.AdminMiddleware())
 	{
+		admin.GET("/users/count", handler.GetUserCount)
 		admin.GET("/users", handler.ListUsers)
 		admin.POST("/users", handler.CreateUser)
 		admin.PUT("/users/:id", handler.UpdateUser)