From d96f8acdbcb398a41419da34a53a2f23c6f685ff Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Wed, 2 Jul 2025 17:12:14 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=BB=98=E8=AE=A4=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E5=92=8C=E5=BF=AB=E9=80=9F=E8=AE=BF=E9=97=AE=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/components/DefaultLayout.vue |  2 +-
 src/layouts/components/QuickAccess.vue   | 16 ++++++++++++----
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/layouts/components/DefaultLayout.vue b/src/layouts/components/DefaultLayout.vue
index ee42c645..5bfbe149 100644
--- a/src/layouts/components/DefaultLayout.vue
+++ b/src/layouts/components/DefaultLayout.vue
@@ -391,7 +391,7 @@ onMounted(() => {
   border-radius: 50%;
   backdrop-filter: blur(20px);
   background: rgba(var(--v-theme-surface), 0.3);
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 10%), 0 1px 4px rgba(0, 0, 0, 6%);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 10%), 0 1px 3px rgba(0, 0, 0, 6%);
   inset-block-start: 80px;
   inset-inline-start: 50%;
   pointer-events: none;
diff --git a/src/layouts/components/QuickAccess.vue b/src/layouts/components/QuickAccess.vue
index fe9046e5..3dca4bb7 100644
--- a/src/layouts/components/QuickAccess.vue
+++ b/src/layouts/components/QuickAccess.vue
@@ -39,6 +39,9 @@ const recentPlugins = ref<Plugin[]>([])
 // 是否加载中
 const loading = ref(false)
 
+// 各插件的图标加载状态
+const pluginIconLoading = ref<Record<string, boolean>>({})
+
 // 上滑关闭相关状态
 const isDraggingToClose = ref(false)
 const dragOffset = ref(0)
@@ -52,6 +55,11 @@ const isVisible = computed(() => {
   return props.visible // 只基于visible属性显示，不考虑pullDistance
 })
 
+// 处理插件图标加载错误
+function handleIconError(plugin: Plugin) {
+  pluginIconLoading.value[plugin.id] = false
+}
+
 // 计算整个组件的transform（包含拖动偏移）
 const componentTransform = computed(() => {
   let baseTransform = ''
@@ -85,6 +93,7 @@ const componentOpacity = computed(() => {
 // 计算插件图标路径
 function getPluginIcon(plugin: Plugin): string {
   if (!plugin.plugin_icon) return noImage
+  if (!pluginIconLoading.value[plugin.id]) return noImage
 
   // 如果是网络图片则使用代理后返回
   if (plugin?.plugin_icon?.startsWith('http'))
@@ -155,9 +164,7 @@ watch(
   () => isVisible.value,
   visible => {
     if (visible) {
-      if (pluginsWithPage.value.length === 0) {
-        fetchPluginsWithPage()
-      }
+      fetchPluginsWithPage()
       loadRecentPlugins()
     }
   },
@@ -230,7 +237,7 @@ function handleBackdropClick(event: MouseEvent) {
           >
             <div class="plugin-icon">
               <VAvatar size="48" class="plugin-avatar">
-                <VImg :src="getPluginIcon(plugin)" :alt="plugin.plugin_name" cover>
+                <VImg :src="getPluginIcon(plugin)" :alt="plugin.plugin_name" cover @error="handleIconError(plugin)">
                   <template #error>
                     <VIcon icon="mdi-puzzle" size="24" />
                   </template>
@@ -306,6 +313,7 @@ function handleBackdropClick(event: MouseEvent) {
   position: fixed;
   z-index: 9999;
   display: flex;
+  overflow: hidden; /* 防止整个容器溢出 */
   flex-direction: column;
   backdrop-filter: blur(20px);
   background: rgba(var(--v-theme-surface), 0.95);