style(排行榜、活动): 加载动画补充背景

src/views/Activities/LoginReward/index.vue

@@ -2,6 +2,10 @@
   <div class="fullPage">
     <!-- 预加载状态 -->
     <div v-if="isLoading" class="loading-container">
+      <!-- 页面背景 -->
+      <BackgroundLayer :backgroundImages="[imageUrl('bg1'), imageUrl('bg2'), imageUrl('bg3')]" />
+
+      <!-- 加载动画 -->
       <div class="loading-spinner"></div>
       <p>{{ t('loading') }}...</p>
     </div>
@@ -328,6 +332,9 @@ onUnmounted(() => {})
   justify-content: center;
   align-items: center;
   color: #666;
+
+  overflow: hidden;
+  position: relative;
 }
 
 .loading-spinner {

src/views/Invitation/InviteToRegister.vue

@@ -3,6 +3,10 @@
   <div class="fullPage">
     <!-- 预加载状态 -->
     <div v-if="isLoading" class="loading-container">
+      <!-- 页面背景 -->
+      <BackgroundLayer :backgroundImages="[imageUrl('bg')]" />
+
+      <!-- 加载动画 -->
       <div class="loading-spinner"></div>
       <p>{{ $t('loading') }}...</p>
     </div>
@@ -838,6 +842,9 @@ onMounted(() => {
   justify-content: center;
   align-items: center;
   color: #666;
+
+  overflow: hidden;
+  position: relative;
 }
 
 .loading-spinner {

src/views/Ranking/Couple/index.vue

@@ -2,6 +2,10 @@
   <div class="fullPage">
     <!-- 预加载状态 -->
     <div v-show="isLoading" class="loading-container">
+      <!-- 页面背景 -->
+      <BackgroundLayer :backgroundImages="[imageUrl('bg1'), imageUrl('bg2'), imageUrl('bg3')]" />
+
+      <!-- 加载动画 -->
       <div class="loading-spinner"></div>
       <p>{{ $t('loading') }}...</p>
     </div>
@@ -1913,6 +1917,9 @@ onUnmounted(() => {
   justify-content: center;
   align-items: center;
   color: #666;
+
+  overflow: hidden;
+  position: relative;
 }
 
 .loading-spinner {

src/views/Ranking/GamesKing/index.vue

@@ -3,6 +3,28 @@
   <div class="fullPage">
     <!-- 预加载状态 -->
     <div v-if="isLoading" class="loading-container">
+      <!-- 页面背景 -->
+      <BackgroundLayer :backgroundImages="[imageUrl('bg')]" />
+
+      <img
+        v-smart-img
+        :src="imageUrl('bg2')"
+        alt=""
+        style="display: block; width: 100%; position: absolute; inset: 80vw 0 0; z-index: -1"
+      />
+
+      <!-- <div class="bg">
+        <itemCenter :imgUrl="imageUrl('bg')" style="position: absolute; z-index: 0">
+          <img
+            v-smart-img
+            :src="webpUrl('bg')"
+            alt=""
+            style="display: block; width: 100%; object-fit: cover"
+          />
+        </itemCenter>
+      </div> -->
+
+      <!-- 加载动画 -->
       <div class="loading-spinner"></div>
       <p>{{ $t('loading') }}...</p>
     </div>
@@ -742,6 +764,7 @@ import {
   activityResource, // 活动特定资源
 } from '@/api/activity.js'
 
+import BackgroundLayer from '@/components/BackgroundLayer.vue'
 import itemCenter from '@/components/itemCenter.vue'
 import TopUser from './components/topUser.vue'
 import maskLayer from '@/components/MaskLayer.vue'
@@ -1163,6 +1186,10 @@ onUnmounted(() => {
   justify-content: center;
   align-items: center;
   color: #666;
+
+  overflow: hidden;
+  position: relative;
+  z-index: 0;
 }
 
 .loading-spinner {

src/views/Ranking/KingAndQueen/TopList.vue

@@ -3,6 +3,10 @@
   <div class="fullPage">
     <!-- 预加载状态 -->
     <div v-if="isLoading" class="loading-container">
+      <!-- 页面背景 -->
+      <BackgroundLayer :backgroundImages="[imageUrl('bg')]" />
+
+      <!-- 加载动画 -->
       <div class="loading-spinner"></div>
       <p style="color: #fff">{{ $t('loading') }}...</p>
     </div>
@@ -1215,6 +1219,9 @@ onUnmounted(() => {
   justify-content: center;
   align-items: center;
   color: #666;
+
+  overflow: hidden;
+  position: relative;
 }
 
 .loading-spinner {

src/views/Ranking/Overall/Ranking.vue

@@ -3,6 +3,10 @@
   <div class="fullPage" :style="{ backgroundColor }">
     <!-- 预加载状态 -->
     <div v-show="isLoading" class="loading-container">
+      <!-- 背景图 -->
+      <BackgroundLayer :backgroundImages="[currentBgImage]" />
+
+      <!-- 加载动画 -->
       <div class="loading-spinner"></div>
       <p>{{ $t('loading') }}...</p>
     </div>
@@ -749,6 +753,9 @@ onMounted(() => {
   justify-content: center;
   align-items: center;
   color: #666;
+
+  overflow: hidden;
+  position: relative;
 }
 
 .loading-spinner {

src/views/Ranking/WeeklyStar/WeeklyStar.vue

@@ -3,6 +3,10 @@
   <div class="fullPage">
     <!-- 预加载状态 -->
     <div v-if="isLoading" class="loading-container">
+      <!-- 页面背景 -->
+      <BackgroundLayer :backgroundImages="[imageUrl('bg')]" />
+
+      <!-- 加载动画 -->
       <div class="loading-spinner"></div>
       <p>{{ $t('loading') }}...</p>
     </div>
@@ -1335,6 +1339,9 @@ onUnmounted(() => {
   justify-content: center;
   align-items: center;
   color: #666;
+
+  overflow: hidden;
+  position: relative;
 }
 
 .loading-spinner {