mirror of
https://github.com/Wei-Shaw/claude-relay-service.git
synced 2026-01-26 17:35:27 +00:00
feat: 全新的Vue3管理后台(admin-spa)和路由重构
🎨 新增功能: - 使用Vue3 + Vite构建的全新管理后台界面 - 支持Tab切换的API统计页面(统计查询/使用教程) - 优雅的胶囊式Tab切换设计 - 同步了PR #106的会话窗口管理功能 - 完整的响应式设计和骨架屏加载状态 🔧 路由调整: - 新版管理后台部署在 /admin-next/ 路径 - 将根路径 / 重定向到 /admin-next/api-stats - 将 /web 页面路由重定向到新版,保留 /web/auth/* 认证路由 - 将 /apiStats 页面路由重定向到新版,保留API端点 🗑️ 清理工作: - 删除旧版 web/admin/ 静态文件 - 删除旧版 web/apiStats/ 静态文件 - 清理相关的文件服务代码 🐛 修复问题: - 修复重定向循环问题 - 修复环境变量配置 - 修复路由404错误 - 优化构建配置 🚀 生成方式:使用 Claude Code Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
192
web/admin-spa/src/stores/apiKeys.js
Normal file
192
web/admin-spa/src/stores/apiKeys.js
Normal file
@@ -0,0 +1,192 @@
|
||||
import { defineStore } from 'pinia'
|
||||
import { ref } from 'vue'
|
||||
import { apiClient } from '@/config/api'
|
||||
|
||||
export const useApiKeysStore = defineStore('apiKeys', () => {
|
||||
// 状态
|
||||
const apiKeys = ref([])
|
||||
const loading = ref(false)
|
||||
const error = ref(null)
|
||||
const statsTimeRange = ref('all')
|
||||
const sortBy = ref('')
|
||||
const sortOrder = ref('asc')
|
||||
|
||||
// Actions
|
||||
|
||||
// 获取API Keys列表
|
||||
const fetchApiKeys = async () => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
try {
|
||||
const response = await apiClient.get('/admin/api-keys')
|
||||
if (response.success) {
|
||||
apiKeys.value = response.data || []
|
||||
} else {
|
||||
throw new Error(response.message || '获取API Keys失败')
|
||||
}
|
||||
} catch (err) {
|
||||
error.value = err.message
|
||||
throw err
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 创建API Key
|
||||
const createApiKey = async (data) => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
try {
|
||||
const response = await apiClient.post('/admin/api-keys', data)
|
||||
if (response.success) {
|
||||
await fetchApiKeys()
|
||||
return response.data
|
||||
} else {
|
||||
throw new Error(response.message || '创建API Key失败')
|
||||
}
|
||||
} catch (err) {
|
||||
error.value = err.message
|
||||
throw err
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 更新API Key
|
||||
const updateApiKey = async (id, data) => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
try {
|
||||
const response = await apiClient.put(`/admin/api-keys/${id}`, data)
|
||||
if (response.success) {
|
||||
await fetchApiKeys()
|
||||
return response
|
||||
} else {
|
||||
throw new Error(response.message || '更新API Key失败')
|
||||
}
|
||||
} catch (err) {
|
||||
error.value = err.message
|
||||
throw err
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 切换API Key状态
|
||||
const toggleApiKey = async (id) => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
try {
|
||||
const response = await apiClient.put(`/admin/api-keys/${id}/toggle`)
|
||||
if (response.success) {
|
||||
await fetchApiKeys()
|
||||
return response
|
||||
} else {
|
||||
throw new Error(response.message || '切换状态失败')
|
||||
}
|
||||
} catch (err) {
|
||||
error.value = err.message
|
||||
throw err
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 续期API Key
|
||||
const renewApiKey = async (id, data) => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
try {
|
||||
const response = await apiClient.put(`/admin/api-keys/${id}/renew`, data)
|
||||
if (response.success) {
|
||||
await fetchApiKeys()
|
||||
return response
|
||||
} else {
|
||||
throw new Error(response.message || '续期失败')
|
||||
}
|
||||
} catch (err) {
|
||||
error.value = err.message
|
||||
throw err
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 删除API Key
|
||||
const deleteApiKey = async (id) => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
try {
|
||||
const response = await apiClient.delete(`/admin/api-keys/${id}`)
|
||||
if (response.success) {
|
||||
await fetchApiKeys()
|
||||
return response
|
||||
} else {
|
||||
throw new Error(response.message || '删除失败')
|
||||
}
|
||||
} catch (err) {
|
||||
error.value = err.message
|
||||
throw err
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 获取API Key统计
|
||||
const fetchApiKeyStats = async (id, timeRange = 'all') => {
|
||||
try {
|
||||
const response = await apiClient.get(`/admin/api-keys/${id}/stats`, {
|
||||
params: { timeRange }
|
||||
})
|
||||
if (response.success) {
|
||||
return response.stats
|
||||
} else {
|
||||
throw new Error(response.message || '获取统计失败')
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取API Key统计失败:', err)
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
// 排序API Keys
|
||||
const sortApiKeys = (field) => {
|
||||
if (sortBy.value === field) {
|
||||
sortOrder.value = sortOrder.value === 'asc' ? 'desc' : 'asc'
|
||||
} else {
|
||||
sortBy.value = field
|
||||
sortOrder.value = 'asc'
|
||||
}
|
||||
}
|
||||
|
||||
// 重置store
|
||||
const reset = () => {
|
||||
apiKeys.value = []
|
||||
loading.value = false
|
||||
error.value = null
|
||||
statsTimeRange.value = 'all'
|
||||
sortBy.value = ''
|
||||
sortOrder.value = 'asc'
|
||||
}
|
||||
|
||||
return {
|
||||
// State
|
||||
apiKeys,
|
||||
loading,
|
||||
error,
|
||||
statsTimeRange,
|
||||
sortBy,
|
||||
sortOrder,
|
||||
|
||||
// Actions
|
||||
fetchApiKeys,
|
||||
createApiKey,
|
||||
updateApiKey,
|
||||
toggleApiKey,
|
||||
renewApiKey,
|
||||
deleteApiKey,
|
||||
fetchApiKeyStats,
|
||||
sortApiKeys,
|
||||
reset
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user