mirror of
https://github.com/Wei-Shaw/claude-relay-service.git
synced 2026-01-22 16:43:35 +00:00
414856f152
🎨 新增功能： - 使用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>
38 lines
1.1 KiB
Vue
38 lines
1.1 KiB
Vue
<template>
|
|
<div class="flex flex-wrap gap-2 mb-6 bg-white/10 rounded-2xl p-2 backdrop-blur-sm">
|
|
<button
|
|
v-for="tab in tabs"
|
|
:key="tab.key"
|
|
@click="$emit('tab-change', tab.key)"
|
|
:class="[
|
|
'tab-btn flex-1 py-3 px-6 text-sm font-semibold transition-all duration-300',
|
|
activeTab === tab.key ? 'active' : 'text-gray-700 hover:bg-white/10 hover:text-gray-900'
|
|
]"
|
|
>
|
|
<i :class="tab.icon + ' mr-2'"></i>{{ tab.name }}
|
|
</button>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
defineProps({
|
|
activeTab: {
|
|
type: String,
|
|
required: true
|
|
}
|
|
})
|
|
|
|
defineEmits(['tab-change'])
|
|
|
|
const tabs = [
|
|
{ key: 'dashboard', name: '仪表板', icon: 'fas fa-tachometer-alt' },
|
|
{ key: 'apiKeys', name: 'API Keys', icon: 'fas fa-key' },
|
|
{ key: 'accounts', name: '账户管理', icon: 'fas fa-user-circle' },
|
|
{ key: 'tutorial', name: '使用教程', icon: 'fas fa-graduation-cap' },
|
|
{ key: 'settings', name: '其他设置', icon: 'fas fa-cogs' }
|
|
]
|
|
</script>
|
|
|
|
<style scoped>
|
|
/* 使用全局样式中定义的 .tab-btn 类 */
|
|
</style> |