From 1eaca4f4a9f1146dad809e193e3f519e55de92bc Mon Sep 17 00:00:00 2001
From: engigu <sayheya@qq.com>
Date: Sat, 3 Jan 2026 13:15:58 +0800
Subject: [PATCH] fix: opt home title load

---
 web/src/composables/useSiteSettings.ts | 40 +++++++++++++++++++++++--
 web/src/layouts/MainLayout.vue         | 41 ++++++++++++++++++++++++--
 2 files changed, 76 insertions(+), 5 deletions(-)

diff --git a/web/src/composables/useSiteSettings.ts b/web/src/composables/useSiteSettings.ts
index 2a67010..8f3b9f0 100644
--- a/web/src/composables/useSiteSettings.ts
+++ b/web/src/composables/useSiteSettings.ts
@@ -1,7 +1,32 @@
 import { ref, computed } from 'vue'
 import { api, type SiteSettings } from '@/api'
 
-const siteSettings = ref<SiteSettings>({
+const CACHE_KEY = 'site_settings_cache'
+
+// 从 localStorage 加载缓存
+function loadFromCache(): SiteSettings | null {
+  try {
+    const cached = localStorage.getItem(CACHE_KEY)
+    if (cached) {
+      return JSON.parse(cached)
+    }
+  } catch {
+    // 忽略解析错误
+  }
+  return null
+}
+
+// 保存到 localStorage
+function saveToCache(settings: SiteSettings) {
+  try {
+    localStorage.setItem(CACHE_KEY, JSON.stringify(settings))
+  } catch {
+    // 忽略存储错误
+  }
+}
+
+const cachedSettings = loadFromCache()
+const siteSettings = ref<SiteSettings>(cachedSettings || {
   title: '白虎面板',
   subtitle: '轻量级定时任务管理系统',
   icon: '',
@@ -9,6 +34,16 @@ const siteSettings = ref<SiteSettings>({
   cookie_days: '7'
 })
 
+// 立即应用缓存的设置
+if (cachedSettings) {
+  if (cachedSettings.title) {
+    document.title = cachedSettings.title
+  }
+  if (cachedSettings.icon) {
+    updateFavicon(cachedSettings.icon)
+  }
+}
+
 let loaded = false
 
 function updateFavicon(svgContent: string) {
@@ -35,11 +70,12 @@ export function useSiteSettings() {
     try {
       const res = await api.settings.getSite()
       siteSettings.value = res
+      saveToCache(res) // 保存到缓存
       document.title = res.title || '白虎面板'
       if (res.icon) updateFavicon(res.icon)
       loaded = true
     } catch {
-      // 使用默认值
+      // 使用默认值或缓存值
     }
   }
 
diff --git a/web/src/layouts/MainLayout.vue b/web/src/layouts/MainLayout.vue
index 54732e2..b9e7353 100644
--- a/web/src/layouts/MainLayout.vue
+++ b/web/src/layouts/MainLayout.vue
@@ -8,8 +8,42 @@ import ThemeToggle from '@/components/ThemeToggle.vue'
 import { api } from '@/api'
 import { useSiteSettings } from '@/composables/useSiteSettings'
 
+const SENTENCE_CACHE_KEY = 'sentence_cache'
+const SENTENCE_CACHE_TIME_KEY = 'sentence_cache_time'
+const CACHE_DURATION = 24 * 60 * 60 * 1000 // 24小时
+
+// 从 localStorage 加载缓存的诗句
+function loadSentenceFromCache(): string | null {
+  try {
+    const cached = localStorage.getItem(SENTENCE_CACHE_KEY)
+    const cacheTime = localStorage.getItem(SENTENCE_CACHE_TIME_KEY)
+    
+    if (cached && cacheTime) {
+      const age = Date.now() - parseInt(cacheTime)
+      // 如果缓存未过期，使用缓存
+      if (age < CACHE_DURATION) {
+        return cached
+      }
+    }
+  } catch {
+    // 忽略错误
+  }
+  return null
+}
+
+// 保存诗句到 localStorage
+function saveSentenceToCache(sentence: string) {
+  try {
+    localStorage.setItem(SENTENCE_CACHE_KEY, sentence)
+    localStorage.setItem(SENTENCE_CACHE_TIME_KEY, Date.now().toString())
+  } catch {
+    // 忽略存储错误
+  }
+}
+
 const route = useRoute()
-const sentence = ref('欢迎使用白虎面板')
+const cachedSentence = loadSentenceFromCache()
+const sentence = ref(cachedSentence || '欢迎使用白虎面板')
 const { siteSettings, loadSettings } = useSiteSettings()
 const mobileMenuOpen = ref(false)
 
@@ -52,14 +86,15 @@ async function loadSentence() {
   try {
     const res = await api.dashboard.sentence()
     sentence.value = res.sentence
+    saveSentenceToCache(res.sentence) // 保存到缓存
   } catch {
-    // 加载失败保持默认
+    // 加载失败保持默认或缓存值
   }
 }
 
 onMounted(() => {
   loadSettings()
-  loadSentence()
+  loadSentence() // 后台更新诗句
 })
 </script>