fix:修复若干bug

This commit is contained in:
steve
2025-09-04 04:33:58 +08:00
parent 223619501a
commit 4b3ad56573
15 changed files with 147 additions and 59 deletions

View File

@@ -973,7 +973,7 @@ onBeforeUnmount(() => {
<style scoped lang="scss">
.daily-task-container {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-xl);
padding: var(--spacing-lg);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
@@ -1137,7 +1137,7 @@ onBeforeUnmount(() => {
padding: var(--spacing-xs) var(--spacing-sm);
border: 1px solid var(--border-light);
border-radius: var(--border-radius-medium);
background: white;
background: var(--bg-primary);
color: var(--text-secondary);
font-size: var(--font-size-sm);
cursor: pointer;

View File

@@ -596,7 +596,7 @@ onUnmounted(() => {
}
.status-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-xl);
padding: var(--spacing-lg);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
@@ -684,16 +684,16 @@ onUnmounted(() => {
.time-display {
font-size: 1.5rem; /* text-2xl */
font-weight: 700; /* font-bold */
color: #111827; /* text-gray-900 */
color: var(--text-primary);
text-align: center;
margin-bottom: var(--spacing-md);
font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', 'Consolas', monospace;
letter-spacing: 0.1em;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
background: var(--bg-tertiary);
padding: 0.75rem 1rem;
border-radius: 0.5rem;
border: 1px solid #e2e8f0;
border: 1px solid var(--border-light);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
transition: all 0.2s ease-in-out;

View File

@@ -315,7 +315,7 @@ watch(() => presetTeamRaw.value, () => { updateAvailableTeams(); updateCurrentTe
<style scoped lang="scss">
.team-status-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-xl);
padding: var(--spacing-lg);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
@@ -445,8 +445,8 @@ watch(() => presetTeamRaw.value, () => { updateAvailableTeams(); updateCurrentTe
align-items: center;
justify-content: center;
overflow: hidden;
border: 2px solid var(--border-color, #e5e5e5);
background: white;
border: 2px solid var(--border-light);
background: var(--bg-primary);
}
.hero-avatar {

View File

@@ -295,7 +295,7 @@ onMounted(() => {
<style scoped lang="scss">
.tower-status-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-xl);
padding: var(--spacing-lg);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);

View File

@@ -13,5 +13,32 @@ app.use(createPinia())
app.use(router)
app.use(naive)
// 全局主题应用:从 localStorage 读取并设置 data-theme 属性
const applyTheme = () => {
const saved = localStorage.getItem('theme') || 'auto'
if (saved === 'dark') {
document.documentElement.setAttribute('data-theme', 'dark')
} else if (saved === 'light') {
document.documentElement.removeAttribute('data-theme')
} else {
const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
if (prefersDark) document.documentElement.setAttribute('data-theme', 'dark')
else document.documentElement.removeAttribute('data-theme')
// 跟随系统变更
if (window.matchMedia) {
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
const t = localStorage.getItem('theme') || 'auto'
if (t === 'auto') {
if (e.matches) document.documentElement.setAttribute('data-theme', 'dark')
else document.documentElement.removeAttribute('data-theme')
}
})
}
}
}
applyTheme()
// 挂载应用
app.mount('#app')

View File

@@ -678,12 +678,22 @@ watch(() => gameRolesStore.selectedRole, (newRole) => {
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
}
/* 深色主题下背景 */
[data-theme="dark"] .daily-tasks-page {
background: linear-gradient(135deg, #0f172a 0%, #1f2937 100%);
}
.page-header {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
padding: var(--spacing-xl) 0;
color: white;
}
/* 深色主题下头部渐变 */
[data-theme="dark"] .page-header {
background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
}
.header-content {
display: flex;
justify-content: space-between;
@@ -713,7 +723,7 @@ watch(() => gameRolesStore.selectedRole, (newRole) => {
}
.role-selector-section {
background: white;
background: var(--bg-primary);
padding: var(--spacing-lg) 0;
border-bottom: 1px solid var(--border-light);
}
@@ -754,7 +764,7 @@ watch(() => gameRolesStore.selectedRole, (newRole) => {
}
.filter-section {
background: white;
background: var(--bg-primary);
padding: var(--spacing-md) 0;
border-bottom: 1px solid var(--border-light);
}

View File

@@ -479,7 +479,7 @@ onMounted(async () => {
// 导航栏
.dashboard-nav {
background: white;
background: var(--bg-primary);
border-bottom: 1px solid var(--border-light);
padding: 0 var(--spacing-lg);
position: sticky;
@@ -621,7 +621,7 @@ onMounted(async () => {
}
.stat-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-large);
padding: var(--spacing-lg);
box-shadow: var(--shadow-light);
@@ -689,7 +689,7 @@ onMounted(async () => {
}
.action-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-large);
padding: var(--spacing-lg);
box-shadow: var(--shadow-light);
@@ -731,7 +731,7 @@ onMounted(async () => {
// 最近活动区域
.recent-activity-section {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-large);
padding: var(--spacing-xl);
box-shadow: var(--shadow-light);

View File

@@ -279,9 +279,14 @@ onUnmounted(() => {
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
}
/* 深色主题下背景 */
[data-theme="dark"] .game-features-page {
background: linear-gradient(135deg, #0f172a 0%, #1f2937 100%);
}
// 页面头部
.page-header {
background: white;
background: var(--bg-primary);
border-bottom: 1px solid var(--border-light);
padding: var(--spacing-lg) 0;
}
@@ -348,7 +353,7 @@ onUnmounted(() => {
}
.feature-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-xl);
padding: var(--spacing-lg);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
@@ -482,7 +487,7 @@ onUnmounted(() => {
}
.ws-status-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-large);
padding: var(--spacing-lg);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);

View File

@@ -435,7 +435,7 @@ onMounted(async () => {
}
.role-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-large);
box-shadow: var(--shadow-light);
overflow: hidden;

View File

@@ -362,7 +362,7 @@ onMounted(() => {
font-weight: var(--font-weight-bold);
line-height: var(--line-height-tight);
margin-bottom: var(--spacing-md);
background: linear-gradient(45deg, #fff, #e6f7ff);
background: linear-gradient(45deg, var(--bg-primary), var(--primary-color-light));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
@@ -434,7 +434,7 @@ onMounted(() => {
// 功能特性区域
.features-section {
padding: var(--spacing-2xl) 0;
background: white;
background: var(--bg-primary);
}
.section-header {
@@ -504,6 +504,10 @@ onMounted(() => {
padding: var(--spacing-2xl) 0;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
/* 深色主题下统计区背景 */
[data-theme="dark"] .stats-section {
background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
}
.stats-grid {
display: grid;

View File

@@ -283,6 +283,11 @@ onMounted(() => {
overflow: hidden;
}
/* 深色主题下背景 */
[data-theme="dark"] .login-page {
background: linear-gradient(135deg, #0f172a 0%, #1f2937 100%);
}
.login-container {
display: grid;
grid-template-columns: 1fr 1fr;
@@ -301,6 +306,12 @@ onMounted(() => {
border: 1px solid rgba(255, 255, 255, 0.3);
}
/* 深色主题下登录卡片 */
[data-theme="dark"] .login-card {
background: rgba(17, 24, 39, 0.85);
border-color: rgba(255, 255, 255, 0.1);
}
.card-header {
text-align: center;
margin-bottom: var(--spacing-xl);

View File

@@ -55,6 +55,11 @@ const router = useRouter()
padding: var(--spacing-lg);
}
/* 深色主题下背景 */
[data-theme="dark"] .not-found-page {
background: linear-gradient(135deg, #0f172a 0%, #1f2937 100%);
}
.error-content {
text-align: center;
color: white;

View File

@@ -341,7 +341,16 @@ const savePreferences = () => {
const updateTheme = (theme) => {
preferences.theme = theme
// 这里可以实际应用主题变更
localStorage.setItem('theme', theme)
if (theme === 'dark') {
document.documentElement.setAttribute('data-theme', 'dark')
} else if (theme === 'light') {
document.documentElement.removeAttribute('data-theme')
} else {
const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
if (prefersDark) document.documentElement.setAttribute('data-theme', 'dark')
else document.documentElement.removeAttribute('data-theme')
}
}
const changeAvatar = () => {
@@ -434,7 +443,7 @@ onMounted(() => {
}
.info-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-large);
padding: var(--spacing-xl);
box-shadow: var(--shadow-light);

View File

@@ -243,6 +243,11 @@ const handleRegister = async () => {
padding: var(--spacing-lg);
}
/* 深色主题下背景 */
[data-theme="dark"] .register-page {
background: linear-gradient(135deg, #0f172a 0%, #1f2937 100%);
}
.register-container {
max-width: 500px;
width: 100%;
@@ -257,6 +262,12 @@ const handleRegister = async () => {
border: 1px solid rgba(255, 255, 255, 0.3);
}
/* 深色主题下注册卡片 */
[data-theme="dark"] .register-card {
background: rgba(17, 24, 39, 0.85);
border-color: rgba(255, 255, 255, 0.1);
}
.card-header {
text-align: center;
margin-bottom: var(--spacing-xl);

View File

@@ -488,23 +488,18 @@ const editingToken = ref(null)
const importMethod = ref('manual')
const refreshingTokens = ref(new Set())
// 主题控制
const isDarkTheme = computed(() => {
return document.documentElement.classList.contains('dark')
})
// 主题控制(使用 data-theme 与全局变量匹配)
const isDarkTheme = computed(() => document.documentElement.getAttribute('data-theme') === 'dark')
const toggleTheme = () => {
const isDark = document.documentElement.classList.contains('dark')
if (isDark) {
document.documentElement.classList.remove('dark')
const current = document.documentElement.getAttribute('data-theme') === 'dark'
if (current) {
document.documentElement.removeAttribute('data-theme')
localStorage.setItem('theme', 'light')
} else {
document.documentElement.classList.add('dark')
document.documentElement.setAttribute('data-theme', 'dark')
localStorage.setItem('theme', 'dark')
}
// 触发全局主题更新
window.location.reload()
}
// 导入表单
@@ -1056,6 +1051,11 @@ onMounted(() => {
padding: var(--spacing-xl) 0;
}
/* 深色主题下的页面背景 */
[data-theme="dark"] .token-import-page {
background: linear-gradient(135deg, #0f172a 0%, #1f2937 100%);
}
.container {
max-width: 1200px;
margin: 0 auto;
@@ -1120,7 +1120,7 @@ onMounted(() => {
}
.import-card {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-xl);
padding: var(--spacing-2xl);
box-shadow: var(--shadow-large);
@@ -1183,58 +1183,58 @@ onMounted(() => {
align-items: center;
}
/* 深色主题强制覆盖 */
.dark .n-form-item-label,
.dark .n-form-item-label__text {
/* 深色主题强制覆盖(与全局 data-theme 保持一致) */
[data-theme="dark"] .n-form-item-label,
[data-theme="dark"] .n-form-item-label__text {
color: #ffffff !important;
}
.dark .n-input__input,
.dark .n-input__textarea {
[data-theme="dark"] .n-input__input,
[data-theme="dark"] .n-input__textarea {
color: #ffffff !important;
background-color: rgba(255, 255, 255, 0.1) !important;
}
.dark .n-input__placeholder {
[data-theme="dark"] .n-input__placeholder {
color: rgba(255, 255, 255, 0.5) !important;
}
.dark .n-card {
[data-theme="dark"] .n-card {
background-color: rgba(255, 255, 255, 0.1) !important;
color: #ffffff !important;
}
.dark .import-card {
[data-theme="dark"] .import-card {
background: rgba(45, 55, 72, 0.9) !important;
color: #ffffff !important;
}
.dark .import-card h2 {
[data-theme="dark"] .import-card h2 {
color: #ffffff !important;
}
.dark .import-card .subtitle {
[data-theme="dark"] .import-card .subtitle {
color: rgba(255, 255, 255, 0.7) !important;
}
.dark .n-collapse-item__header {
[data-theme="dark"] .n-collapse-item__header {
color: #ffffff !important;
}
.dark .n-collapse-item__content-wrapper {
[data-theme="dark"] .n-collapse-item__content-wrapper {
background-color: transparent !important;
}
.dark .n-radio-button {
[data-theme="dark"] .n-radio-button {
color: #ffffff !important;
}
.dark .n-radio-button--checked {
[data-theme="dark"] .n-radio-button--checked {
background-color: rgba(16, 185, 129, 0.8) !important;
color: #ffffff !important;
}
.dark .form-tip {
[data-theme="dark"] .form-tip {
color: rgba(255, 255, 255, 0.6) !important;
}
@@ -1252,12 +1252,18 @@ onMounted(() => {
}
.tokens-section {
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-xl);
padding: var(--spacing-xl);
box-shadow: var(--shadow-medium);
}
/* 深色主题下的列表区域背景 */
[data-theme="dark"] .tokens-section {
background: rgba(45, 55, 72, 0.9);
color: #ffffff;
}
.section-header {
display: flex;
justify-content: space-between;
@@ -1432,7 +1438,7 @@ onMounted(() => {
justify-content: center;
align-items: center;
min-height: 400px;
background: white;
background: var(--bg-primary);
border-radius: var(--border-radius-xl);
box-shadow: var(--shadow-medium);
}