From 9516adc8103dbca0a841d08ac0f8a6c11abf82a0 Mon Sep 17 00:00:00 2001
From: Jerry Yan <792602257@qq.com>
Date: Wed, 10 Jun 2026 14:04:14 +0800
Subject: [PATCH] =?UTF-8?q?=E5=89=8D=E7=AB=AF=E9=A1=B5=E9=9D=A2=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/router/index.ts                    |  2 +-
 web/src/views/acp/AcpAdminSessionsView.vue | 85 +++++++++++-----------
 2 files changed, 45 insertions(+), 42 deletions(-)

diff --git a/web/src/router/index.ts b/web/src/router/index.ts
index a203fc8..c40186d 100644
--- a/web/src/router/index.ts
+++ b/web/src/router/index.ts
@@ -158,7 +158,7 @@ const routes: RouteRecordRaw[] = [
     path: '/admin/acp-sessions',
     name: 'admin-acp-sessions',
     component: () => import('@/views/acp/AcpAdminSessionsView.vue'),
-    meta: { requiresAdmin: true },
+    meta: { requiresAuth: true, requiresAdmin: true },
   },
   {
     path: '/admin/acp/agent-kinds',
diff --git a/web/src/views/acp/AcpAdminSessionsView.vue b/web/src/views/acp/AcpAdminSessionsView.vue
index 8885799..95e2208 100644
--- a/web/src/views/acp/AcpAdminSessionsView.vue
+++ b/web/src/views/acp/AcpAdminSessionsView.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { onMounted } from 'vue'
 import { useAcpStore } from '@/stores/acp'
+import AppShell from '@/components/layout/AppShell.vue'
 import SessionStatusBadge from '@/components/acp/SessionStatusBadge.vue'
 
 const store = useAcpStore()
@@ -21,47 +22,49 @@ async function terminate(id: string) {
 </script>
 
 <template>
-  <div class="p-6 space-y-4">
-    <div class="flex items-center justify-between">
-      <h1 class="text-2xl font-semibold">All ACP Sessions</h1>
-      <span class="text-sm text-gray-500">Global admin view (all users)</span>
-    </div>
+  <AppShell>
+    <div class="space-y-4">
+      <div class="flex items-center justify-between">
+        <h2 class="text-lg font-semibold">ACP 会话管理</h2>
+        <span class="text-sm text-gray-500">全局管理员视图（所有用户）</span>
+      </div>
 
-    <div v-if="store.loading" class="text-gray-500">Loading...</div>
-    <div v-else-if="store.error" class="text-red-600">{{ store.error }}</div>
-    <div v-else-if="store.sessions.length === 0" class="text-gray-500">
-      No sessions.
-    </div>
+      <div v-if="store.loading" class="text-gray-500">Loading...</div>
+      <div v-else-if="store.error" class="text-red-600">{{ store.error }}</div>
+      <div v-else-if="store.sessions.length === 0" class="text-gray-500">
+        No sessions.
+      </div>
 
-    <table v-else class="w-full text-sm">
-      <thead class="text-left">
-        <tr class="border-b">
-          <th class="px-3 py-2">User</th>
-          <th class="px-3 py-2">Branch</th>
-          <th class="px-3 py-2">Status</th>
-          <th class="px-3 py-2">Started</th>
-          <th class="px-3 py-2 text-right">Actions</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr v-for="s in store.sessions" :key="s.id" class="border-t hover:bg-gray-50">
-          <td class="px-3 py-2 font-mono text-xs">{{ s.user_id }}</td>
-          <td class="px-3 py-2 font-mono text-xs">{{ s.branch }}</td>
-          <td class="px-3 py-2"><SessionStatusBadge :status="s.status" /></td>
-          <td class="px-3 py-2 text-xs text-gray-500">
-            {{ new Date(s.started_at).toLocaleString() }}
-          </td>
-          <td class="px-3 py-2 text-right space-x-2">
-            <button
-              v-if="s.status === 'starting' || s.status === 'running'"
-              class="text-red-600 hover:underline"
-              @click="terminate(s.id)"
-            >
-              Terminate
-            </button>
-          </td>
-        </tr>
-      </tbody>
-    </table>
-  </div>
+      <table v-else class="w-full text-sm">
+        <thead class="text-left">
+          <tr class="border-b">
+            <th class="px-3 py-2">User</th>
+            <th class="px-3 py-2">Branch</th>
+            <th class="px-3 py-2">Status</th>
+            <th class="px-3 py-2">Started</th>
+            <th class="px-3 py-2 text-right">Actions</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="s in store.sessions" :key="s.id" class="border-t hover:bg-gray-50">
+            <td class="px-3 py-2 font-mono text-xs">{{ s.user_id }}</td>
+            <td class="px-3 py-2 font-mono text-xs">{{ s.branch }}</td>
+            <td class="px-3 py-2"><SessionStatusBadge :status="s.status" /></td>
+            <td class="px-3 py-2 text-xs text-gray-500">
+              {{ new Date(s.started_at).toLocaleString() }}
+            </td>
+            <td class="px-3 py-2 text-right space-x-2">
+              <button
+                v-if="s.status === 'starting' || s.status === 'running'"
+                class="text-red-600 hover:underline"
+                @click="terminate(s.id)"
+              >
+                Terminate
+              </button>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  </AppShell>
 </template>