From 6b6353ed41b2827b85cde75774571a4f4d05a5ce Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Tue, 13 May 2025 19:25:41 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20App.vue=20=E4=B8=AD?=
 =?UTF-8?q?=E7=9A=84=E8=83=8C=E6=99=AF=E5=9B=BE=E7=89=87=E5=8A=A0=E8=BD=BD?=
 =?UTF-8?q?=E9=80=BB=E8=BE=91=EF=BC=8C=E8=B0=83=E6=95=B4=E5=BC=82=E6=AD=A5?=
 =?UTF-8?q?=E5=8A=A0=E8=BD=BD=E6=96=B9=E5=BC=8F=E5=B9=B6=E7=AE=80=E5=8C=96?=
 =?UTF-8?q?=E5=9B=BE=E7=89=87=E5=9C=B0=E5=9D=80=E8=8E=B7=E5=8F=96=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 37 +++++++++++++++++--------------------
 1 file changed, 17 insertions(+), 20 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 11ac6aa7..39c71f7e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -142,8 +142,7 @@ function preloadImage(url: string): Promise<boolean> {
 function getImgUrl(url: string) {
   // 使用图片缓存
   if (globalSettings.GLOBAL_IMAGE_CACHE && isLogin.value) {
-    const cacheUrl = `${import.meta.env.VITE_API_BASE_URL}system/cache/image?url=${encodeURIComponent(url)}`
-    return cacheUrl
+    return `${import.meta.env.VITE_API_BASE_URL}system/cache/image?url=${encodeURIComponent(url)}`
   }
   return url
 }
@@ -167,8 +166,8 @@ function animateAndRemoveLoader() {
 }
 
 // 加载背景图片
-function loadBackgroundImages() {
-  fetchBackgroundImages()
+async function loadBackgroundImages() {
+  await fetchBackgroundImages()
     .then(() => {
       startBackgroundRotation()
     })
@@ -180,7 +179,7 @@ function loadBackgroundImages() {
     })
 }
 
-onMounted(() => {
+onMounted(async () => {
   // 初始化data-theme属性
   updateHtmlThemeAttribute(globalTheme.name.value)
 
@@ -188,7 +187,7 @@ onMounted(() => {
   show.value = false
 
   // 加载背景图片
-  loadBackgroundImages()
+  await loadBackgroundImages()
 
   // 移除加载动画
   ensureRenderComplete(() => {
@@ -233,20 +232,18 @@ onUnmounted(() => {
 <template>
   <div class="app-wrapper">
     <!-- 透明主题背景 -->
-    <template v-if="backgroundImages.length > 0 && (isTransparentTheme || !isLogin)">
-      <div class="background-container">
-        <div
-          v-for="(imageUrl, index) in backgroundImages"
-          :key="`bg-${index}-${loginStateKey}`"
-          class="background-image"
-          :class="{ 'active': index === activeImageIndex }"
-          :style="{ backgroundImage: `url(${getImgUrl(imageUrl)})` }"
-        ></div>
-        <!-- 全局磨砂层 -->
-        <div v-if="isLogin && isTransparentTheme" class="global-blur-layer"></div>
-      </div>
-    </template>
-
+    <div v-if="backgroundImages.length > 0 && (isTransparentTheme || !isLogin)" class="background-container">
+      <div
+        v-for="(imageUrl, index) in backgroundImages"
+        :key="`bg-${index}-${loginStateKey}`"
+        class="background-image"
+        :class="{ 'active': index === activeImageIndex }"
+        :style="{ backgroundImage: `url(${getImgUrl(imageUrl)})` }"
+      ></div>
+      <!-- 全局磨砂层 -->
+      <div v-if="isLogin && isTransparentTheme" class="global-blur-layer"></div>
+    </div>
+    <!-- 页面内容 -->
     <VApp v-show="show" :class="{ 'transparent-app': isTransparentTheme }">
       <RouterView />
     </VApp>