update api key manage

frontend/src/constants/__tests__/permissions.spec.ts

@@ -2,11 +2,12 @@ import { describe, it, expect } from 'vitest'
 import { ADMIN_ONLY_PATH_PREFIXES, isAdminOnlyPath } from '../permissions'
 
 describe('ADMIN_ONLY_PATH_PREFIXES', () => {
-  it('contains all 7 admin-only paths', () => {
-    expect(ADMIN_ONLY_PATH_PREFIXES).toHaveLength(7)
+  it('contains all 8 admin-only paths', () => {
+    expect(ADMIN_ONLY_PATH_PREFIXES).toHaveLength(8)
     expect(ADMIN_ONLY_PATH_PREFIXES).toContain('/users')
     expect(ADMIN_ONLY_PATH_PREFIXES).toContain('/roles')
     expect(ADMIN_ONLY_PATH_PREFIXES).toContain('/route-groups')
+    expect(ADMIN_ONLY_PATH_PREFIXES).toContain('/api-keys')
     expect(ADMIN_ONLY_PATH_PREFIXES).toContain('/mq-status')
     expect(ADMIN_ONLY_PATH_PREFIXES).toContain('/failed-messages')
     expect(ADMIN_ONLY_PATH_PREFIXES).toContain('/logs/requests')

frontend/src/constants/permissions.ts

@@ -8,6 +8,7 @@ export const ADMIN_ONLY_PATH_PREFIXES: readonly string[] = [
   '/users',
   '/roles',
   '/route-groups',
+  '/api-keys',
   '/mq-status',
   '/failed-messages',
   '/logs/requests',

frontend/src/pages/api-keys/__tests__/index.spec.ts

@@ -108,7 +108,8 @@ describe('AdminApiKeyPage', () => {
   it('重置按钮调用 resetFilters 并 fetchAllKeys', async () => {
     await mountPage()
     const store = useAdminApiKeyStore()
-    store.filters.user_id = 5
+    store.filters.username = 'testuser'
+    store.filters.email = 'test@example.com'
 
     vi.mocked(api.get).mockClear()
     setupApi([])
@@ -119,7 +120,8 @@ describe('AdminApiKeyPage', () => {
     btn?.click()
     await flushPromises()
 
-    expect(store.filters.user_id).toBeUndefined()
+    expect(store.filters.username).toBeUndefined()
+    expect(store.filters.email).toBeUndefined()
     expect(vi.mocked(api.get)).toHaveBeenCalled()
   })
 

frontend/src/pages/api-keys/index.vue

@@ -62,12 +62,19 @@ function handleDelete(id: number) {
 
     <!-- 筛选区 -->
     <div class="flex gap-3 mb-4 flex-wrap">
-      <a-input-number
-        v-model:value="store.filters.user_id"
-        placeholder="用户 ID"
-        :min="1"
-        style="width: 140px"
+      <a-input
+        v-model:value="store.filters.username"
+        placeholder="用户名"
+        style="width: 150px"
         allow-clear
+        @press-enter="handleSearch"
+      />
+      <a-input
+        v-model:value="store.filters.email"
+        placeholder="邮箱"
+        style="width: 180px"
+        allow-clear
+        @press-enter="handleSearch"
       />
       <a-select
         v-model:value="enabledFilter"
@@ -100,13 +107,18 @@ function handleDelete(id: number) {
     >
       <template #bodyCell="{ column, record }">
         <template v-if="column.key === 'user'">
-          <span>{{ (record as ApiKeyRecord).user?.username ?? record.user_id }}</span>
-          <a-tooltip
-            v-if="(record as ApiKeyRecord).user?.api_key_enabled === false"
-            title="该用户的 API Key 功能已关闭，所有 Key 均无法认证"
-          >
-            <a-tag color="red" class="ml-1">已停用</a-tag>
-          </a-tooltip>
+          <div>
+            <span>{{ (record as ApiKeyRecord).user?.username ?? record.user_id }}</span>
+            <a-tooltip
+              v-if="(record as ApiKeyRecord).user?.api_key_enabled === false"
+              title="该用户的 API Key 功能已关闭，所有 Key 均无法认证"
+            >
+              <a-tag color="red" class="ml-1">已停用</a-tag>
+            </a-tooltip>
+          </div>
+          <div v-if="(record as ApiKeyRecord).user?.email" class="text-xs text-gray-400">
+            {{ (record as ApiKeyRecord).user!.email }}
+          </div>
         </template>
 
         <template v-else-if="column.key === 'prefix'">

frontend/src/stores/__tests__/admin-api-key.spec.ts

@@ -22,7 +22,7 @@ describe('useAdminApiKeyStore', () => {
     vi.restoreAllMocks()
   })
 
-  describe('fetchAllKeys — enabled 查询参数契约', () => {
+  describe('fetchAllKeys — 查询参数契约', () => {
     it('enabled=true 应序列化为 1（后端期望 integer 0/1）', async () => {
       vi.mocked(api.get).mockResolvedValueOnce(emptyPage)
 
@@ -60,6 +60,46 @@ describe('useAdminApiKeyStore', () => {
         expect.objectContaining({ enabled: undefined }),
       )
     })
+
+    it('username 过滤器应传递给后端', async () => {
+      vi.mocked(api.get).mockResolvedValueOnce(emptyPage)
+
+      const store = useAdminApiKeyStore()
+      store.filters.username = 'testuser'
+      await store.fetchAllKeys()
+
+      expect(api.get).toHaveBeenCalledWith(
+        '/api/v1/admin/api-keys',
+        expect.objectContaining({ username: 'testuser' }),
+      )
+    })
+
+    it('email 过滤器应传递给后端', async () => {
+      vi.mocked(api.get).mockResolvedValueOnce(emptyPage)
+
+      const store = useAdminApiKeyStore()
+      store.filters.email = 'test@example.com'
+      await store.fetchAllKeys()
+
+      expect(api.get).toHaveBeenCalledWith(
+        '/api/v1/admin/api-keys',
+        expect.objectContaining({ email: 'test@example.com' }),
+      )
+    })
+
+    it('空字符串过滤器应转换为 undefined', async () => {
+      vi.mocked(api.get).mockResolvedValueOnce(emptyPage)
+
+      const store = useAdminApiKeyStore()
+      store.filters.username = ''
+      store.filters.email = ''
+      await store.fetchAllKeys()
+
+      expect(api.get).toHaveBeenCalledWith(
+        '/api/v1/admin/api-keys',
+        expect.objectContaining({ username: undefined, email: undefined }),
+      )
+    })
   })
 
   describe('toggleUserApiKeyEnabled — 请求体字段名契约', () => {

frontend/src/stores/admin-api-key.ts

@@ -10,7 +10,8 @@ export const useAdminApiKeyStore = defineStore('admin-api-key', () => {
     total: 0,
   })
   const filters = reactive<AdminApiKeyFilters>({
-    user_id: undefined,
+    username: undefined,
+    email: undefined,
     enabled: undefined,
   })
 
@@ -20,7 +21,8 @@ export const useAdminApiKeyStore = defineStore('admin-api-key', () => {
       const data = await api.get<PaginatedData<ApiKeyRecord>>('/api/v1/admin/api-keys', {
         page: pagination.page,
         per_page: pagination.per_page,
-        user_id: filters.user_id,
+        username: filters.username || undefined,
+        email: filters.email || undefined,
         enabled: filters.enabled === undefined ? undefined : filters.enabled ? 1 : 0,
       })
       keys.value = data.items
@@ -66,7 +68,8 @@ export const useAdminApiKeyStore = defineStore('admin-api-key', () => {
   }
 
   function resetFilters() {
-    filters.user_id = undefined
+    filters.username = undefined
+    filters.email = undefined
     filters.enabled = undefined
     pagination.page = 1
   }

frontend/src/types/api.ts

@@ -315,7 +315,7 @@ export interface ApiKeyRecord {
   expires_at: string | null
   enabled: boolean
   created_at: string
-  user?: { id: number; username: string; api_key_enabled?: boolean }
+  user?: { id: number; username: string; email?: string; api_key_enabled?: boolean }
 }
 
 export interface ApiKeyCreateParams {
@@ -329,7 +329,8 @@ export interface ApiKeyCreateResult {
 }
 
 export interface AdminApiKeyFilters {
-  user_id: number | undefined
+  username: string | undefined
+  email: string | undefined
   enabled: boolean | undefined
 }