From 6c72391768ffd8974dd079445c56f1ab13f1f1ca Mon Sep 17 00:00:00 2001
From: AdingApkgg <AdingApkgg@outlook.com>
Date: Fri, 26 Dec 2025 20:17:06 +0800
Subject: [PATCH] Refactor VndbPanel.vue to streamline image loading and
 translation handling

- Removed lazy loading attribute from images for improved performance.
- Simplified the logic for loading characters and quotes, integrating automatic translation upon loading.
- Cleaned up unused imports and optimized the code structure for better maintainability.
---
 src/components/VndbPanel.vue | 28 +++++-----------------------
 1 file changed, 5 insertions(+), 23 deletions(-)

diff --git a/src/components/VndbPanel.vue b/src/components/VndbPanel.vue
index bc9dcfd..eb188ee 100644
--- a/src/components/VndbPanel.vue
+++ b/src/components/VndbPanel.vue
@@ -522,7 +522,6 @@
                     :src="screenshot"
                     :alt="`${searchStore.vndbInfo.mainName} 截图 ${index + 1}`"
                     class="w-full h-auto cursor-pointer group-hover:scale-105 transition-transform duration-300"
-                    loading="lazy"
                     @load="screenshotsReady = true"
                     @error="handleImageError"
                   />
@@ -537,7 +536,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, watch, computed, nextTick } from 'vue'
+import { ref, watch, computed } from 'vue'
 import { useSearchStore, type VndbCharacter, type VndbQuote } from '@/stores/search'
 import { useUIStore } from '@/stores/ui'
 import { translateText, fetchVndbCharacters, fetchVndbQuotes } from '@/api/search'
@@ -711,28 +710,11 @@ watch(() => searchStore.vndbInfo, async (newInfo) => {
     quotes: false,
   }
   
-  // 如果有游戏 ID，加载角色和名言
+  // 如果有游戏 ID，加载角色和名言，然后自动翻译
   if (newInfo?.id) {
-    loadCharactersAndQuotes(newInfo.id)
-  }
-  
-  // 检查缓存的截图是否已加载（nextTick 后检查 img.complete）
-  if (newInfo?.screenshots && newInfo.screenshots.length > 0) {
-    nextTick(() => {
-      // 延迟一帧确保 DOM 已渲染
-      requestAnimationFrame(() => {
-        // 在当前面板内查找截图图片
-        const screenshotImgs = modalRef.value?.querySelectorAll('img[alt*="截图"]')
-        if (screenshotImgs) {
-          for (let i = 0; i < screenshotImgs.length; i++) {
-            const img = screenshotImgs[i] as HTMLImageElement
-            if (img.complete && img.naturalHeight > 0) {
-              screenshotsReady.value = true
-              break
-            }
-          }
-        }
-      })
+    loadCharactersAndQuotes(newInfo.id).then(() => {
+      // 自动触发 AI 翻译
+      handleTranslateAll()
     })
   }
 })