From f710f1bfc089e85e0a36e25202b7b9f6f765dc0f Mon Sep 17 00:00:00 2001
From: "hao.dai" <dh505159718@gmail.com>
Date: Tue, 16 Apr 2024 11:24:07 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Dranking=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E5=A4=A7=E6=89=B9=E9=87=8Fwarning=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/@layouts/components/VerticalNavLayout.vue |   2 +-
 src/components/cards/BangumiPersonCard.vue    |   2 +-
 src/components/cards/DoubanPersonCard.vue     |   2 +-
 src/components/cards/MediaCard.vue            |   5 +-
 src/components/cards/TmdbPersonCard.vue       |   3 +-
 src/components/slide/SlideView.vue            |   8 +-
 src/components/slide/SlideViewTitle.vue       |   6 +-
 src/pages/ranking.vue                         | 149 +++++++++---------
 src/views/discover/MediaCardSlideView.vue     |   3 +-
 src/views/discover/PersonCardSlideView.vue    |   3 +-
 10 files changed, 87 insertions(+), 96 deletions(-)

diff --git a/src/@layouts/components/VerticalNavLayout.vue b/src/@layouts/components/VerticalNavLayout.vue
index c89e226d..7cb70e83 100644
--- a/src/@layouts/components/VerticalNavLayout.vue
+++ b/src/@layouts/components/VerticalNavLayout.vue
@@ -52,7 +52,7 @@ export default defineComponent({
         'main',
         { class: 'layout-page-content' },
         h(Transition, { name: 'fade-slide', mode: 'out-in', appear: true },
-          h('section', { class: 'page-content-container' }, slots.default?.()),
+          () => h('section', { class: 'page-content-container' }, slots.default?.()),
         ),
       )
 
diff --git a/src/components/cards/BangumiPersonCard.vue b/src/components/cards/BangumiPersonCard.vue
index cfec21e2..af950f5f 100644
--- a/src/components/cards/BangumiPersonCard.vue
+++ b/src/components/cards/BangumiPersonCard.vue
@@ -37,7 +37,7 @@ function goPersonDetail() {
 </script>
 
 <template>
-  <VHover v-bind="personProps">
+  <VHover>
     <template #default="hover">
       <VCard
         v-bind="hover.props"
diff --git a/src/components/cards/DoubanPersonCard.vue b/src/components/cards/DoubanPersonCard.vue
index fcb1ba89..069319a7 100644
--- a/src/components/cards/DoubanPersonCard.vue
+++ b/src/components/cards/DoubanPersonCard.vue
@@ -30,7 +30,7 @@ function goPersonDetail() {
 </script>
 
 <template>
-  <VHover v-bind="personProps">
+  <VHover>
     <template #default="hover">
       <VCard
         v-bind="hover.props"
diff --git a/src/components/cards/MediaCard.vue b/src/components/cards/MediaCard.vue
index a3b599db..05155b98 100644
--- a/src/components/cards/MediaCard.vue
+++ b/src/components/cards/MediaCard.vue
@@ -166,8 +166,9 @@ async function addSubscribe(season = 0) {
   }
   catch (error) {
     console.error(error)
+  } finally {
+    doneNProgress()
   }
-  doneNProgress()
 }
 
 // 弹出添加订阅提示
@@ -428,7 +429,7 @@ function getYear(airDate: string) {
 </script>
 
 <template>
-  <VHover v-bind="props">
+  <VHover>
     <template #default="hover">
       <VCard
         v-bind="hover.props"
diff --git a/src/components/cards/TmdbPersonCard.vue b/src/components/cards/TmdbPersonCard.vue
index 866320dc..d58b5191 100644
--- a/src/components/cards/TmdbPersonCard.vue
+++ b/src/components/cards/TmdbPersonCard.vue
@@ -36,7 +36,7 @@ function goPersonDetail() {
 </script>
 
 <template>
-  <VHover v-bind="personProps">
+  <VHover>
     <template #default="hover">
       <VCard
         v-bind="hover.props"
@@ -61,7 +61,6 @@ function goPersonDetail() {
                   }"
                 >
                   <VImg
-                    v-img
                     :src="getPersonImage()"
                     cover
                     @load="isImageLoaded = true"
diff --git a/src/components/slide/SlideView.vue b/src/components/slide/SlideView.vue
index 76bf7943..2c5bfb22 100644
--- a/src/components/slide/SlideView.vue
+++ b/src/components/slide/SlideView.vue
@@ -1,12 +1,6 @@
 <script lang="ts" setup>
 import SlideViewTitle from '@/components/slide/SlideViewTitle.vue'
 
-// 输入参数
-const props = defineProps({
-  linkurl: String,
-  title: String,
-})
-
 // 元素
 const slideview_content = ref()
 // 分页切换状态
@@ -95,7 +89,7 @@ onActivated(() => {
 <template>
   <div class="flex justify-between mt-3">
     <slot name="title">
-      <SlideViewTitle v-bind="props" />
+      <SlideViewTitle />
     </slot>
     <div v-if="disabled !== 3" class="me-1 d-none d-md-flex">
       <VBtn
diff --git a/src/components/slide/SlideViewTitle.vue b/src/components/slide/SlideViewTitle.vue
index 48253ec2..c098e408 100644
--- a/src/components/slide/SlideViewTitle.vue
+++ b/src/components/slide/SlideViewTitle.vue
@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 // 输入参数
-const props = defineProps({
-  linkurl: String,
-  title: String,
-})
+const props = inject('rankingPropsKey')
+
 </script>
 
 <template>
diff --git a/src/pages/ranking.vue b/src/pages/ranking.vue
index 01bea9c9..aa12511e 100644
--- a/src/pages/ranking.vue
+++ b/src/pages/ranking.vue
@@ -1,85 +1,82 @@
 <script setup lang="ts">
 import MediaCardSlideView from '@/views/discover/MediaCardSlideView.vue'
+
+const viewList = reactive<{apipath: string, linkurl: string, title: string}[]>([
+  {
+    apipath: 'tmdb/trending',
+    linkurl: "/browse/tmdb/trending?title=流行趋势",
+    title: "流行趋势",
+  },
+  {
+     apipath: "douban/showing",
+      linkurl: "/browse/douban/showing?title=正在热映",
+      title: "正在热映"
+  },
+  {
+    apipath: "bangumi/calendar",
+      linkurl: "/browse/bangumi/calendar?title=Bangumi每日放送",
+      title: "Bangumi每日放送"
+  },
+  {
+    apipath: "tmdb/movies",
+      linkurl: "/browse/tmdb/movies?title=热门电影",
+      title: "热门电影"
+  },
+  {
+     apipath: "tmdb/tvs?with_original_language=zh|en|ja|ko",
+      linkurl: "/browse/tmdb/tvs??with_original_language=zh|en|ja|ko&title=热门电视剧",
+      title: "热门电视剧"
+  },
+  {
+    apipath: "douban/movie_hot",
+      linkurl: "/browse/douban/movie_hot?title=热门电影",
+      title: "热门电影"
+  },
+  {
+     apipath: "douban/tv_hot",
+      linkurl: "/browse/douban/tv_hot?title=热门电视剧",
+      title: "热门电视剧"
+  },
+  {
+    apipath: "douban/tv_animation",
+      linkurl: "/browse/douban/tv_animation?title=热门动漫",
+      title: "热门动漫"
+  },
+  {
+    apipath: "douban/movies",
+      linkurl: "/browse/douban/movies?title=最新电影",
+      title: "最新电影"
+  },
+  {
+    apipath: "douban/tvs",
+      linkurl: "/browse/douban/tvs?title=最新电视剧",
+      title: "最新电视剧"
+  },
+  {
+    apipath: "douban/movie_top250",
+      linkurl: "/browse/douban/movie_top250?title=电影TOP250",
+      title: "电影TOP250"
+  },
+  {
+    apipath: "douban/tv_weekly_chinese",
+      linkurl: "/browse/douban/tv_weekly_chinese?title=国产剧集榜",
+      title: "国产剧集榜"
+  },
+  {
+    apipath: "douban/tv_weekly_global",
+      linkurl: "/browse/douban/tv_weekly_global?title=全球剧集榜",
+      title: "全球剧集榜"
+  }
+])
+
 </script>
 
 <template>
   <div>
-    <MediaCardSlideView
-      apipath="tmdb/trending"
-      linkurl="/browse/tmdb/trending?title=流行趋势"
-      title="流行趋势"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/showing"
-      linkurl="/browse/douban/showing?title=正在热映"
-      title="正在热映"
-    />
-
-    <MediaCardSlideView
-      apipath="bangumi/calendar"
-      linkurl="/browse/bangumi/calendar?title=Bangumi每日放送"
-      title="Bangumi每日放送"
-    />
-
-    <MediaCardSlideView
-      apipath="tmdb/movies"
-      linkurl="/browse/tmdb/movies?title=热门电影"
-      title="热门电影"
-    />
-
-    <MediaCardSlideView
-      apipath="tmdb/tvs?with_original_language=zh|en|ja|ko"
-      linkurl="/browse/tmdb/tvs??with_original_language=zh|en|ja|ko&title=热门电视剧"
-      title="热门电视剧"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/movie_hot"
-      linkurl="/browse/douban/movie_hot?title=热门电影"
-      title="热门电影"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tv_hot"
-      linkurl="/browse/douban/tv_hot?title=热门电视剧"
-      title="热门电视剧"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tv_animation"
-      linkurl="/browse/douban/tv_animation?title=热门动漫"
-      title="热门动漫"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/movies"
-      linkurl="/browse/douban/movies?title=最新电影"
-      title="最新电影"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tvs"
-      linkurl="/browse/douban/tvs?title=最新电视剧"
-      title="最新电视剧"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/movie_top250"
-      linkurl="/browse/douban/movie_top250?title=电影TOP250"
-      title="电影TOP250"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tv_weekly_chinese"
-      linkurl="/browse/douban/tv_weekly_chinese?title=国产剧集榜"
-      title="国产剧集榜"
-    />
-
-    <MediaCardSlideView
-      apipath="douban/tv_weekly_global"
-      linkurl="/browse/douban/tv_weekly_global?title=全球剧集榜"
-      title="全球剧集榜"
+    <MediaCardSlideView 
+      v-for="item in viewList" 
+      :key="item.apipath"
+      v-bind="item"
     />
   </div>
 </template>
diff --git a/src/views/discover/MediaCardSlideView.vue b/src/views/discover/MediaCardSlideView.vue
index 065dbe37..fd65ddad 100644
--- a/src/views/discover/MediaCardSlideView.vue
+++ b/src/views/discover/MediaCardSlideView.vue
@@ -11,6 +11,8 @@ const props = defineProps({
   title: String,
 })
 
+provide('rankingPropsKey', reactive({...props}))
+
 // 组件加载完成
 const componentLoaded = ref(false)
 
@@ -39,7 +41,6 @@ onMounted(fetchData)
 <template>
   <SlideView
     v-if="componentLoaded"
-    v-bind="props"
   >
     <template #content>
       <template
diff --git a/src/views/discover/PersonCardSlideView.vue b/src/views/discover/PersonCardSlideView.vue
index 3a08d044..8972f530 100644
--- a/src/views/discover/PersonCardSlideView.vue
+++ b/src/views/discover/PersonCardSlideView.vue
@@ -13,6 +13,8 @@ const props = defineProps({
   type: String,
 })
 
+provide('rankingPropsKey', reactive({...props}))
+
 // 组件加载完成
 const componentLoaded = ref(false)
 
@@ -41,7 +43,6 @@ onMounted(fetchData)
 <template>
   <SlideView
     v-if="componentLoaded"
-    v-bind="props"
   >
     <template #content>
       <template