fix plugin ui

src/components/cards/PluginAppCard.vue

@@ -16,6 +16,9 @@ const emit = defineEmits(['install'])
 // 提示框
 const $toast = useToast()
 
+// 图片是否加载完成
+const isImageLoaded = ref(false)
+
 // 安装插件
 async function installPlugin() {
   try {
@@ -51,12 +54,13 @@ async function installPlugin() {
     >
       <VAvatar
         size="128"
-        class="shadow"
+        :class="{ shadow: isImageLoaded }"
       >
         <VImg
           :src="`/plugin/${props.plugin?.plugin_icon}`"
           aspect-ratio="4/3"
           cover
+          @load="isImageLoaded = true"
         />
       </VAvatar>
     </div>

src/components/cards/PluginCard.vue

@@ -37,6 +37,9 @@ const pluginInfoDialog = ref(false)
 // 插件详情页面配置项
 let pluginPageItems = reactive([])
 
+// 图片是否加载完成
+const isImageLoaded = ref(false)
+
 // 调用API卸载插件
 async function uninstallPlugin() {
   try {
@@ -184,12 +187,13 @@ const dropdownItems = ref([
       </div>
       <VAvatar
         size="128"
-        class="shadow"
+        :class="{ shadow: isImageLoaded }"
       >
         <VImg
           :src="`/plugin/${props.plugin?.plugin_icon}`"
           aspect-ratio="4/3"
           cover
+          :class="{ shadow: isImageLoaded }"
         />
       </VAvatar>
     </div>