fix person cards

src/components/cards/BangumiPersonCard.vue

@@ -16,22 +16,19 @@ const isImageLoaded = ref(false)
 
 // 人物图片地址
 function getPersonImage() {
-  if (!personInfo.value?.images)
+  if (!personInfo.value?.images) return personIcon
-    return personIcon
   return personInfo.value?.images?.medium
 }
 
 // 使用、拼装人物角色
 function getPersonCharacter() {
-  if (!personInfo.value?.career)
+  if (!personInfo.value?.career) return ''
-    return ''
   return personInfo.value?.career.join('、')
 }
 
 // 打开人物详情
 function goPersonDetail() {
-  if (!personInfo.value?.id)
+  if (!personInfo.value?.id) return
-    return
   window.open(`https://bangumi.tv/person/${personInfo.value?.id}`, '_blank')
 }
 </script>
@@ -50,9 +47,9 @@ function goPersonDetail() {
         @click.stop="goPersonDetail"
       >
         <div
-          class="person-card relative transform-gpu cursor-pointer rounded shadow ring-1 transition duration-150 ease-in-out scale-100 ring-gray-700"
+          class="person-card relative transform-gpu cursor-pointer rounded shadow transition duration-150 ease-in-out scale-100 ring-gray-700"
         >
-          <div style="padding-bottom: 150%;">
+          <div style="padding-block-end: 150%">
             <div class="absolute inset-0 flex h-full w-full flex-col items-center p-2">
               <div class="relative mt-2 mb-4 flex h-1/2 w-full justify-center">
                 <VAvatar
@@ -61,18 +58,16 @@ function goPersonDetail() {
                     'ring-1 ring-gray-700': isImageLoaded,
                   }"
                 >
-                  <VImg
+                  <VImg v-img :src="getPersonImage()" cover @load="isImageLoaded = true" />
-                    v-img
-                    :src="getPersonImage()"
-                    cover
-                    @load="isImageLoaded = true"
-                  />
                 </VAvatar>
               </div>
               <div class="w-full truncate text-center font-bold">
                 {{ personInfo?.name }}
               </div>
-              <div class="overflow-hidden whitespace-normal text-center text-sm" style=" display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical;-webkit-line-clamp: 2;">
+              <div
+                class="overflow-hidden whitespace-normal text-center text-sm"
+                style="display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2"
+              >
                 {{ getPersonCharacter() }}
               </div>
               <div class="absolute bottom-0 left-0 right-0 h-12 rounded-b" />

src/components/cards/DoubanPersonCard.vue

@@ -16,15 +16,13 @@ const isImageLoaded = ref(false)
 
 // 人物图片地址
 function getPersonImage() {
-  if (!personInfo.value?.avatar)
+  if (!personInfo.value?.avatar) return personIcon
-    return personIcon
   return personInfo.value?.avatar?.large
 }
 
 // 打开人物详情
 function goPersonDetail() {
-  if (!personInfo.value?.id)
+  if (!personInfo.value?.id) return
-    return
   window.open(`https://movie.douban.com/celebrity/${personInfo.value?.id}/`, '_blank')
 }
 </script>
@@ -43,9 +41,9 @@ function goPersonDetail() {
         @click.stop="goPersonDetail"
       >
         <div
-          class="person-card relative transform-gpu cursor-pointer rounded shadow ring-1 transition duration-150 ease-in-out scale-100 ring-gray-700"
+          class="person-card relative transform-gpu cursor-pointer rounded shadow transition duration-150 ease-in-out scale-100 ring-gray-700"
         >
-          <div style="padding-bottom: 150%;">
+          <div style="padding-block-end: 150%">
             <div class="absolute inset-0 flex h-full w-full flex-col items-center p-2">
               <div class="relative mt-2 mb-4 flex h-1/2 w-full justify-center">
                 <VAvatar
@@ -54,18 +52,16 @@ function goPersonDetail() {
                     'ring-1 ring-gray-700': isImageLoaded,
                   }"
                 >
-                  <VImg
+                  <VImg v-img :src="getPersonImage()" cover @load="isImageLoaded = true" />
-                    v-img
-                    :src="getPersonImage()"
-                    cover
-                    @load="isImageLoaded = true"
-                  />
                 </VAvatar>
               </div>
               <div class="w-full truncate text-center font-bold">
                 {{ personInfo?.name }}
               </div>
-              <div class="overflow-hidden whitespace-normal text-center text-sm" style=" display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical;-webkit-line-clamp: 2;">
+              <div
+                class="overflow-hidden whitespace-normal text-center text-sm"
+                style="display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2"
+              >
                 {{ personInfo?.character }}
               </div>
               <div class="absolute bottom-0 left-0 right-0 h-12 rounded-b" />

src/pages/browse.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import api from '@/api'
 import MediaCardListView from '@/views/discover/MediaCardListView.vue'
 import PersonCardListView from '@/views/discover/PersonCardListView.vue'
 
@@ -16,14 +17,37 @@ let title = route.query?.title?.toString()
 
 // 类型
 const type = route.query?.type?.toString()
-
 if (type === 'person') title = '演员：' + title
 
+// 识别类型
+const RecognizeType = ref('themoviedb')
+
+// 计算人物类型
+const PersonType = computed(() => {
+  if (RecognizeType.value === 'douban') return 'douban'
+  else if (RecognizeType.value === 'bangumi') return 'bangumi'
+  else return 'tmdb'
+})
+
 // 计算API路径
 function getApiPath(paths: string[] | string) {
   if (Array.isArray(paths)) return paths.join('/')
   else return paths
 }
+
+// 加载系统设计
+async function loadSystemSettings() {
+  try {
+    const result: { [key: string]: any } = await api.get('system/env')
+    if (result.success) RecognizeType.value = result.data?.RECOGNIZE_SOURCE
+  } catch (error) {
+    console.error(error)
+  }
+}
+
+onMounted(async () => {
+  if (type === 'person') await loadSystemSettings()
+})
 </script>
 
 <template>
@@ -41,7 +65,7 @@ function getApiPath(paths: string[] | string) {
     <PersonCardListView
       v-if="type === 'person'"
       :apipath="getApiPath(props.paths || '')"
-      type="tmdb"
+      :type="PersonType"
       :params="route.query"
     />
     <MediaCardListView v-else :apipath="getApiPath(props.paths || '')" :params="route.query" />