From 0cec825895094547285aefe311b6c0e8f8610d16 Mon Sep 17 00:00:00 2001
From: thofx <usnail@yeah.net>
Date: Sat, 22 Jul 2023 20:12:28 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E6=A0=B7=E5=BC=8Fbug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/@layouts/styles/_default-layout.scss |  1 +
 src/components/cards/MediaCard.vue       |  9 ---
 src/pages/setting.vue                    | 82 ++++++++++++++----------
 src/views/discover/MediaCardListView.vue |  3 +-
 src/views/plugin/PluginCardListView.vue  |  2 +-
 5 files changed, 53 insertions(+), 44 deletions(-)

diff --git a/src/@layouts/styles/_default-layout.scss b/src/@layouts/styles/_default-layout.scss
index 6c53a850..a1cb50bc 100644
--- a/src/@layouts/styles/_default-layout.scss
+++ b/src/@layouts/styles/_default-layout.scss
@@ -51,6 +51,7 @@ body,
     & > div:first-child {
       flex: auto;
       position: relative;
+      width: calc(100vw - variables.$layout-vertical-nav-width - 1rem);
     }
   }
 }
diff --git a/src/components/cards/MediaCard.vue b/src/components/cards/MediaCard.vue
index bd244290..25b3e696 100644
--- a/src/components/cards/MediaCard.vue
+++ b/src/components/cards/MediaCard.vue
@@ -412,21 +412,12 @@ const getImgUrl: Ref<string> = computed(() => {
         v-bind="hover.props"
         :height="props.height"
         :width="props.width"
-        :loading="!isImageLoaded"
         class="outline-none shadow ring-gray-500"
         :class="{
           'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
           'ring-1': isImageLoaded,
         }"
       >
-        <template #loader="{ isActive }">
-          <v-progress-linear
-            :active="isActive"
-            color="deep-purple"
-            height="4"
-            indeterminate
-          />
-        </template>
         <VImg
           aspect-ratio="2/3"
           :src="getImgUrl"
diff --git a/src/pages/setting.vue b/src/pages/setting.vue
index 5b4ed5b7..d7d90072 100644
--- a/src/pages/setting.vue
+++ b/src/pages/setting.vue
@@ -12,61 +12,77 @@ const activeTab = ref(route.params.tab)
 
 // tabs
 const tabs = [
-  { title: '用户', icon: 'mdi-account', tab: 'account' },
-  { title: '站点', icon: 'mdi-web', tab: 'site' },
-  { title: '规则', icon: 'mdi-filter-cog', tab: 'filter' },
-  { title: '通知', icon: 'mdi-bell', tab: 'notification' },
-  { title: '自定义词表', icon: 'mdi-file-word-box', tab: 'words' },
+  {
+    title: '用户',
+    icon: 'mdi-account',
+    tab: 'account',
+  },
+  {
+    title: '站点',
+    icon: 'mdi-web',
+    tab: 'site',
+  },
+  {
+    title: '规则',
+    icon: 'mdi-filter-cog',
+    tab: 'filter',
+  },
+  {
+    title: '通知',
+    icon: 'mdi-bell',
+    tab: 'notification',
+  },
+  {
+    title: '自定义词表',
+    icon: 'mdi-file-word-box',
+    tab: 'words',
+  },
 ]
 </script>
 
 <template>
   <div>
-    <VTabs
-      v-model="activeTab"
-      show-arrows
-    >
-      <VTab
-        v-for="item in tabs"
-        :key="item.icon"
-        :value="item.tab"
-      >
-        <VIcon
-          size="20"
-          start
-          :icon="item.icon"
-        />
+    <VTabs v-model="activeTab" show-arrows>
+      <VTab v-for="item in tabs" :key="item.icon" :value="item.tab">
+        <VIcon size="20" start :icon="item.icon" />
         {{ item.title }}
       </VTab>
     </VTabs>
     <VDivider />
 
-    <VWindow
-      v-model="activeTab"
-      class="mt-5"
-    >
+    <VWindow v-model="activeTab" class="mt-5 disable-tab-transition">
       <!-- Account -->
-      <VWindowItem value="account" transition="scale-transition">
-        <AccountSettingAccount />
+      <VWindowItem value="account">
+        <transition name="fade-slide" appear>
+          <AccountSettingAccount />
+        </transition>
       </VWindowItem>
 
       <!-- System -->
-      <VWindowItem value="site" transition="scale-transition">
-        <AccountSettingSite />
+      <VWindowItem value="site">
+        <transition name="fade-slide" appear>
+          <AccountSettingSite />
+        </transition>
       </VWindowItem>
 
       <!-- Notification -->
-      <VWindowItem value="filter" transition="scale-transition">
-        <AccountSettingRule />
+      <VWindowItem value="filter">
+        <transition name="fade-slide" appear>
+          <AccountSettingRule />
+        </transition>
       </VWindowItem>
 
       <!-- Notification -->
-      <VWindowItem value="notification" transition="scale-transition">
-        <AccountSettingNotification />
+      <VWindowItem value="notification">
+        <transition name="fade-slide" appear>
+          <AccountSettingNotification />
+        </transition>
       </VWindowItem>
       <!-- Words -->
-      <VWindowItem value="words" transition="scale-transition">
-        <AccountSettingWords />
+      <VWindowItem value="words">
+        <transition name="fade-slide" appear>
+          <AccountSettingWords />
+        </transition>
       </VWindowItem>
     </VWindow>
   </div>
diff --git a/src/views/discover/MediaCardListView.vue b/src/views/discover/MediaCardListView.vue
index 35652419..ed232294 100644
--- a/src/views/discover/MediaCardListView.vue
+++ b/src/views/discover/MediaCardListView.vue
@@ -132,8 +132,9 @@ async function fetchData({ done }: { done: any }) {
   <VInfiniteScroll
     mode="intersect"
     side="end"
-    :on-load="fetchData"
+    :items="dataList"
     class="overflow-hidden"
+    @load="fetchData"
   >
     <template #loading />
     <div
diff --git a/src/views/plugin/PluginCardListView.vue b/src/views/plugin/PluginCardListView.vue
index 4c52bc70..b6551159 100644
--- a/src/views/plugin/PluginCardListView.vue
+++ b/src/views/plugin/PluginCardListView.vue
@@ -87,7 +87,7 @@ onBeforeMount(fetchData)
         icon="mdi-plus"
         v-bind="props"
         size="x-large"
-        class="fixed right-5"
+        class="absolute right-5 bottom-5"
       />
     </template>