From 1ad720304c5c01f103338ff96d69a6338a3aa5f8 Mon Sep 17 00:00:00 2001
From: Feng Yue <2525275@gmail.com>
Date: Wed, 13 Aug 2025 15:26:09 +0800
Subject: [PATCH] fix: 401 errors on user management page

---
 .../src/components/admin/ChangeRoleModal.vue  |  8 +++----
 .../components/admin/UserUsageStatsModal.vue  | 14 +++++------
 web/admin-spa/src/config/api.js               | 18 ++++++++++++++
 .../src/views/UserManagementView.vue          | 24 +++++++++----------
 4 files changed, 41 insertions(+), 23 deletions(-)

diff --git a/web/admin-spa/src/components/admin/ChangeRoleModal.vue b/web/admin-spa/src/components/admin/ChangeRoleModal.vue
index 9ee2b878..10b0757e 100644
--- a/web/admin-spa/src/components/admin/ChangeRoleModal.vue
+++ b/web/admin-spa/src/components/admin/ChangeRoleModal.vue
@@ -192,7 +192,7 @@
 
 <script setup>
 import { ref, watch } from 'vue'
-import axios from 'axios'
+import { apiClient } from '@/config/api'
 import { showToast } from '@/utils/toast'
 
 const props = defineProps({
@@ -221,15 +221,15 @@ const handleSubmit = async () => {
   error.value = ''
 
   try {
-    const response = await axios.patch(`/users/${props.user.id}/role`, {
+    const response = await apiClient.patch(`/users/${props.user.id}/role`, {
       role: selectedRole.value
     })
 
-    if (response.data.success) {
+    if (response.success) {
       showToast(`User role updated to ${selectedRole.value}`, 'success')
       emit('updated')
     } else {
-      error.value = response.data.message || 'Failed to update user role'
+      error.value = response.message || 'Failed to update user role'
     }
   } catch (err) {
     console.error('Update user role error:', err)
diff --git a/web/admin-spa/src/components/admin/UserUsageStatsModal.vue b/web/admin-spa/src/components/admin/UserUsageStatsModal.vue
index 5151025c..97f933cf 100644
--- a/web/admin-spa/src/components/admin/UserUsageStatsModal.vue
+++ b/web/admin-spa/src/components/admin/UserUsageStatsModal.vue
@@ -347,7 +347,7 @@
 
 <script setup>
 import { ref, watch } from 'vue'
-import axios from 'axios'
+import { apiClient } from '@/config/api'
 import { showToast } from '@/utils/toast'
 
 const props = defineProps({
@@ -394,18 +394,18 @@ const loadUsageStats = async () => {
   loading.value = true
   try {
     const [statsResponse, userResponse] = await Promise.all([
-      axios.get(`/users/${props.user.id}/usage-stats`, {
+      apiClient.get(`/users/${props.user.id}/usage-stats`, {
         params: { period: selectedPeriod.value }
       }),
-      axios.get(`/users/${props.user.id}`)
+      apiClient.get(`/users/${props.user.id}`)
     ])
 
-    if (statsResponse.data.success) {
-      usageStats.value = statsResponse.data.stats
+    if (statsResponse.success) {
+      usageStats.value = statsResponse.stats
     }
 
-    if (userResponse.data.success) {
-      userDetails.value = userResponse.data.user
+    if (userResponse.success) {
+      userDetails.value = userResponse.user
     }
   } catch (error) {
     console.error('Failed to load user usage stats:', error)
diff --git a/web/admin-spa/src/config/api.js b/web/admin-spa/src/config/api.js
index dbe02a5a..3f0a4276 100644
--- a/web/admin-spa/src/config/api.js
+++ b/web/admin-spa/src/config/api.js
@@ -149,6 +149,24 @@ class ApiClient {
     }
   }
 
+  // PATCH 请求
+  async patch(url, data = null, options = {}) {
+    const fullUrl = createApiUrl(url)
+    const config = this.buildConfig({
+      ...options,
+      method: 'PATCH',
+      body: data ? JSON.stringify(data) : undefined
+    })
+
+    try {
+      const response = await fetch(fullUrl, config)
+      return await this.handleResponse(response)
+    } catch (error) {
+      console.error('API PATCH Error:', error)
+      throw error
+    }
+  }
+
   // DELETE 请求
   async delete(url, options = {}) {
     const fullUrl = createApiUrl(url)
diff --git a/web/admin-spa/src/views/UserManagementView.vue b/web/admin-spa/src/views/UserManagementView.vue
index cc3ecc0f..95687fd9 100644
--- a/web/admin-spa/src/views/UserManagementView.vue
+++ b/web/admin-spa/src/views/UserManagementView.vue
@@ -454,7 +454,7 @@
 
 <script setup>
 import { ref, computed, onMounted } from 'vue'
-import axios from 'axios'
+import { apiClient } from '@/config/api'
 import { showToast } from '@/utils/toast'
 import { debounce } from 'lodash-es'
 import UserUsageStatsModal from '@/components/admin/UserUsageStatsModal.vue'
@@ -533,21 +533,21 @@ const loadUsers = async () => {
   loading.value = true
   try {
     const [usersResponse, statsResponse] = await Promise.all([
-      axios.get('/users', {
+      apiClient.get('/users', {
         params: {
           role: selectedRole.value || undefined,
           isActive: selectedStatus.value !== '' ? selectedStatus.value : undefined
         }
       }),
-      axios.get('/users/stats/overview')
+      apiClient.get('/users/stats/overview')
     ])
 
-    if (usersResponse.data.success) {
-      users.value = usersResponse.data.users
+    if (usersResponse.success) {
+      users.value = usersResponse.users
     }
 
-    if (statsResponse.data.success) {
-      userStats.value = statsResponse.data.stats
+    if (statsResponse.success) {
+      userStats.value = statsResponse.stats
     }
   } catch (error) {
     console.error('Failed to load users:', error)
@@ -605,11 +605,11 @@ const handleConfirmAction = async () => {
 
   try {
     if (action === 'toggleStatus') {
-      const response = await axios.patch(`/users/${user.id}/status`, {
+      const response = await apiClient.patch(`/users/${user.id}/status`, {
         isActive: !user.isActive
       })
 
-      if (response.data.success) {
+      if (response.success) {
         const userIndex = users.value.findIndex((u) => u.id === user.id)
         if (userIndex !== -1) {
           users.value[userIndex].isActive = !user.isActive
@@ -617,10 +617,10 @@ const handleConfirmAction = async () => {
         showToast(`User ${user.isActive ? 'disabled' : 'enabled'} successfully`, 'success')
       }
     } else if (action === 'disableKeys') {
-      const response = await axios.post(`/users/${user.id}/disable-keys`)
+      const response = await apiClient.post(`/users/${user.id}/disable-keys`)
 
-      if (response.data.success) {
-        showToast(`Disabled ${response.data.disabledCount} API keys`, 'success')
+      if (response.success) {
+        showToast(`Disabled ${response.disabledCount} API keys`, 'success')
         await loadUsers() // Refresh to get updated counts
       }
     }