mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-05 23:56:42 +08:00
fix detail page
This commit is contained in:
@@ -41,13 +41,13 @@ const seasonsSubscribed = ref<{ [key: number]: boolean }>({})
|
|||||||
// 调用API查询详情
|
// 调用API查询详情
|
||||||
async function getMediaDetail() {
|
async function getMediaDetail() {
|
||||||
if (mediaProps.mediaid && mediaProps.type) {
|
if (mediaProps.mediaid && mediaProps.type) {
|
||||||
mediaDetail.value = await api.get(`tmdb/${mediaProps.mediaid}`, {
|
mediaDetail.value = await api.get(`media/${mediaProps.mediaid}`, {
|
||||||
params: {
|
params: {
|
||||||
type_name: mediaProps.type,
|
type_name: mediaProps.type,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
isRefreshed.value = true
|
isRefreshed.value = true
|
||||||
if (!mediaDetail.value.tmdb_id)
|
if (!mediaDetail.value.tmdb_id && !mediaDetail.value.douban_id)
|
||||||
return
|
return
|
||||||
|
|
||||||
// 检查存在状态
|
// 检查存在状态
|
||||||
@@ -165,7 +165,7 @@ async function checkSeasonsSubscribed() {
|
|||||||
return
|
return
|
||||||
try {
|
try {
|
||||||
mediaDetail.value?.season_info?.forEach(async (item) => {
|
mediaDetail.value?.season_info?.forEach(async (item) => {
|
||||||
seasonsSubscribed.value[item.season_number || 0] = await checkSubscribe(item.season_number)
|
seasonsSubscribed.value[item.season_number ?? 0] = await checkSubscribe(item.season_number)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
catch (error) {
|
catch (error) {
|
||||||
@@ -372,6 +372,11 @@ const getSubscribeColor = computed(() => {
|
|||||||
return 'warning'
|
return 'warning'
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 使用、拼装数组为字符串
|
||||||
|
function joinArray(arr: string[]) {
|
||||||
|
return arr.join('、')
|
||||||
|
}
|
||||||
|
|
||||||
onBeforeMount(() => {
|
onBeforeMount(() => {
|
||||||
getMediaDetail()
|
getMediaDetail()
|
||||||
})
|
})
|
||||||
@@ -388,7 +393,7 @@ onBeforeMount(() => {
|
|||||||
color="primary"
|
color="primary"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="mediaDetail.tmdb_id" class="max-w-8xl mx-auto px-4">
|
<div v-if="mediaDetail.tmdb_id || mediaDetail.douban_id" class="max-w-8xl mx-auto px-4">
|
||||||
<template v-if="mediaDetail.backdrop_path">
|
<template v-if="mediaDetail.backdrop_path">
|
||||||
<div class="vue-media-back absolute left-0 top-0 w-full h-96">
|
<div class="vue-media-back absolute left-0 top-0 w-full h-96">
|
||||||
<VImg class="h-96" :src="mediaDetail.backdrop_path" cover />
|
<VImg class="h-96" :src="mediaDetail.backdrop_path" cover />
|
||||||
@@ -440,12 +445,22 @@ onBeforeMount(() => {
|
|||||||
简介
|
简介
|
||||||
</h2>
|
</h2>
|
||||||
<p>{{ mediaDetail.overview }}</p>
|
<p>{{ mediaDetail.overview }}</p>
|
||||||
<ul class="media-crew">
|
<ul v-if="mediaDetail.tmdb_id" class="media-crew">
|
||||||
<li v-for="director in mediaDetail.directors" :key="director.id">
|
<li v-for="director in mediaDetail.directors" :key="director.id">
|
||||||
<span>{{ director.job }}</span>
|
<span>{{ director.job }}</span>
|
||||||
<a class="crew-name" :href="`person?personid=${director.id}`" target="_blank">{{ director.name }}</a>
|
<a class="crew-name" :href="`person?personid=${director.id}`" target="_blank">{{ director.name }}</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
<ul v-if="!mediaDetail.tmdb_id && mediaDetail.douban_id" class="media-crew">
|
||||||
|
<li v-for="director in mediaDetail.directors" :key="director.id">
|
||||||
|
<span>{{ joinArray(director.roles) }}</span>
|
||||||
|
<a class="crew-name" :href="`${director.url}`" target="_blank">{{ director.name }}</a>
|
||||||
|
</li>
|
||||||
|
<li v-for="director in mediaDetail.actors" :key="director.id">
|
||||||
|
<span>{{ joinArray(director.roles) }}</span>
|
||||||
|
<a class="crew-name" :href="`${director.url}`" target="_blank">{{ director.name }}</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
<div class="mt-6">
|
<div class="mt-6">
|
||||||
<a v-if="mediaDetail.tmdb_id" class="mb-2 mr-2 inline-flex last:mr-0" :href="getTheMovieDbLink()" target="_blank">
|
<a v-if="mediaDetail.tmdb_id" class="mb-2 mr-2 inline-flex last:mr-0" :href="getTheMovieDbLink()" target="_blank">
|
||||||
<div class="inline-flex cursor-pointer items-center rounded-full bg-gray-600 px-2 py-1 text-sm text-gray-200 ring-1 ring-gray-500 transition hover:bg-gray-700">
|
<div class="inline-flex cursor-pointer items-center rounded-full bg-gray-600 px-2 py-1 text-sm text-gray-200 ring-1 ring-gray-500 transition hover:bg-gray-700">
|
||||||
@@ -472,10 +487,10 @@ onBeforeMount(() => {
|
|||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<h2 v-if="mediaDetail.type === '电视剧'" class="py-4">
|
<h2 v-if="mediaDetail.type === '电视剧' && mediaDetail.tmdb_id" class="py-4">
|
||||||
季
|
季
|
||||||
</h2>
|
</h2>
|
||||||
<div v-if="mediaDetail.type === '电视剧'" class="flex w-full flex-col space-y-2">
|
<div v-if="mediaDetail.type === '电视剧' && mediaDetail.tmdb_id" class="flex w-full flex-col space-y-2">
|
||||||
<VExpansionPanels>
|
<VExpansionPanels>
|
||||||
<VExpansionPanel
|
<VExpansionPanel
|
||||||
v-for="season in getMediaSeasons"
|
v-for="season in getMediaSeasons"
|
||||||
@@ -543,7 +558,7 @@ onBeforeMount(() => {
|
|||||||
</VExpansionPanels>
|
</VExpansionPanels>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="media-overview-right">
|
<div v-if="mediaDetail.tmdb_id" class="media-overview-right">
|
||||||
<div class="media-facts">
|
<div class="media-facts">
|
||||||
<div v-if="mediaDetail.vote_average" class="media-ratings">
|
<div v-if="mediaDetail.vote_average" class="media-ratings">
|
||||||
<VRating
|
<VRating
|
||||||
@@ -617,7 +632,7 @@ onBeforeMount(() => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<NoDataFound
|
<NoDataFound
|
||||||
v-if="!mediaDetail.tmdb_id && isRefreshed"
|
v-if="!mediaDetail.tmdb_id && !mediaDetail.douban_id && isRefreshed"
|
||||||
error-code="500"
|
error-code="500"
|
||||||
error-title="出错啦!"
|
error-title="出错啦!"
|
||||||
error-description="未识别到TMDB媒体信息。"
|
error-description="未识别到TMDB媒体信息。"
|
||||||
|
|||||||
@@ -43,8 +43,8 @@ async function getSubscribes() {
|
|||||||
// 如果是电影直接返回
|
// 如果是电影直接返回
|
||||||
if (subscribe.type === '电影') {
|
if (subscribe.type === '电影') {
|
||||||
// 调用API查询TMDB详情
|
// 调用API查询TMDB详情
|
||||||
const movie: MediaInfo = await api.get(`tmdb/${subscribe.tmdbid}`, {
|
const movie: MediaInfo = await api.get(`media/${subscribe.tmdbid}`, {
|
||||||
params: { tmdbid: subscribe.tmdbid, type_name: subscribe.type },
|
params: { type_name: subscribe.type },
|
||||||
})
|
})
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|||||||
Reference in New Issue
Block a user