github/claude-relay-service
1
0
Fork 0
mirror of https://github.com/Wei-Shaw/claude-relay-service.git synced 2026-01-23 21:17:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: 优化移动端响应式设计

Browse Source 
- 优化所有页面的移动端适配（手机、平板、PC）
- 修复AccountsView移动端状态显示和按钮功能问题
- 修复ApiKeysView移动端详情展开显示问题
- 移除ApiKeysView不必要的查看按钮
- 修复Dashboard页面PC版时间筛选按钮布局
- 改进所有组件的响应式设计
- 删除dist目录避免构建文件冲突

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
shaw
2025-08-03 01:09:26 +08:00
parent f22c8cbfcc
commit ecfc1050d3
23 changed files with 2775 additions and 697 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
web/admin-spa/src/views/LoginView.vue
View File

@@ -1,47 +1,47 @@
<template>
<div class="flex items-center justify-center min-h-screen p-6">
<div class="glass-strong rounded-3xl p-10 w-full max-w-md shadow-2xl">
<div class="text-center mb-8">
<div class="flex items-center justify-center min-h-screen p-4 sm:p-6">
<div class="glass-strong rounded-xl sm:rounded-2xl md:rounded-3xl p-6 sm:p-8 md:p-10 w-full max-w-md shadow-2xl">
<div class="text-center mb-6 sm:mb-8">
<!-- 使用自定义布局来保持登录页面的居中大logo样式 -->
<div class="w-20 h-20 mx-auto mb-6 bg-gradient-to-br from-blue-500/20 to-purple-500/20 border border-gray-300/30 rounded-2xl flex items-center justify-center backdrop-blur-sm overflow-hidden">
<div class="w-16 h-16 sm:w-20 sm:h-20 mx-auto mb-4 sm:mb-6 bg-gradient-to-br from-blue-500/20 to-purple-500/20 border border-gray-300/30 rounded-xl sm:rounded-2xl flex items-center justify-center backdrop-blur-sm overflow-hidden">
<template v-if="!oemLoading">
<img
v-if="authStore.oemSettings.siteIconData || authStore.oemSettings.siteIcon"
:src="authStore.oemSettings.siteIconData || authStore.oemSettings.siteIcon"
alt="Logo"
class="w-12 h-12 object-contain"
class="w-10 h-10 sm:w-12 sm:h-12 object-contain"
@error="(e) => e.target.style.display = 'none'"
>
<i
v-else
class="fas fa-cloud text-3xl text-gray-700"
class="fas fa-cloud text-2xl sm:text-3xl text-gray-700"
/>
</template>
<div
v-else
class="w-12 h-12 bg-gray-300/50 rounded animate-pulse"
class="w-10 h-10 sm:w-12 sm:h-12 bg-gray-300/50 rounded animate-pulse"
/>
</div>
<template v-if="!oemLoading && authStore.oemSettings.siteName">
<h1 class="text-3xl font-bold text-white mb-2 header-title">
<h1 class="text-2xl sm:text-3xl font-bold text-white mb-2 header-title">
{{ authStore.oemSettings.siteName }}
</h1>
</template>
<div
v-else-if="oemLoading"
class="h-9 w-64 bg-gray-300/50 rounded animate-pulse mx-auto mb-2"
class="h-8 sm:h-9 w-48 sm:w-64 bg-gray-300/50 rounded animate-pulse mx-auto mb-2"
/>
<p class="text-gray-600 text-lg">
<p class="text-gray-600 text-base sm:text-lg">
管理后台
</p>
</div>
<form
class="space-y-6"
class="space-y-4 sm:space-y-6"
@submit.prevent="handleLogin"
>
<div>
<label class="block text-sm font-semibold text-gray-900 mb-3">用户名</label>
<label class="block text-sm font-semibold text-gray-900 mb-2 sm:mb-3">用户名</label>
<input
v-model="loginForm.username"
type="text"
@@ -52,7 +52,7 @@
</div>
<div>
<label class="block text-sm font-semibold text-gray-900 mb-3">密码</label>
<label class="block text-sm font-semibold text-gray-900 mb-2 sm:mb-3">密码</label>
<input
v-model="loginForm.password"
type="password"
@@ -65,7 +65,7 @@
<button
type="submit"
:disabled="authStore.loginLoading"
class="btn btn-primary w-full py-4 px-6 text-lg font-semibold"
class="btn btn-primary w-full py-3 sm:py-4 px-4 sm:px-6 text-base sm:text-lg font-semibold"
>
<i
v-if="!authStore.loginLoading"
@@ -81,7 +81,7 @@
<div
v-if="authStore.loginError"
class="mt-6 p-4 bg-red-500/20 border border-red-500/30 rounded-xl text-red-800 text-sm text-center backdrop-blur-sm"
class="mt-4 sm:mt-6 p-3 sm:p-4 bg-red-500/20 border border-red-500/30 rounded-lg sm:rounded-xl text-red-800 text-xs sm:text-sm text-center backdrop-blur-sm"
>
<i class="fas fa-exclamation-triangle mr-2" />{{ authStore.loginError }}
</div>