GithubBackup/MoviePilot-Frontend
1
0
Fork 0
mirror of https://github.com/jxxghp/MoviePilot-Frontend.git synced 2026-07-12 16:01:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat：人物搜索

Browse Source
This commit is contained in:
jxxghp
2024-04-26 20:35:40 +08:00
parent 54415377ee
commit db0d5133e8
5 changed files with 82 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/views/discover/MediaCardListView.vue
View File

@@ -12,11 +12,7 @@ const props = defineProps({
// 判断是否有滚动条
function hasScroll() {
return (
document.body.scrollHeight
- (window.innerHeight || document.documentElement.clientHeight)
> 2
)
return document.body.scrollHeight - (window.innerHeight || document.documentElement.clientHeight) > 2
}
// 当前页码
@@ -37,8 +33,7 @@ function getParams() {
let params = {
page: page.value,
}
if (props.params)
params = { ...params, ...props.params }
if (props.params) params = { ...params, ...props.params }
return params
}
@@ -46,8 +41,7 @@ function getParams() {
// 获取列表数据
async function fetchData({ done }: { done: any }) {
try {
if (!props.apipath)
return
if (!props.apipath) return
// 如果正在加载中，直接返回
if (loading.value) {
@@ -81,8 +75,7 @@ async function fetchData({ done }: { done: any }) {
// 返回加载成功
done('ok')
}
}
else {
} else {
// 加载一次
// 设置加载中
loading.value = true
@@ -106,8 +99,7 @@ async function fetchData({ done }: { done: any }) {
}
// 取消加载中
loading.value = false
}
catch (error) {
} catch (error) {
console.error(error)
// 返回加载失败
done('error')
@@ -116,29 +108,12 @@ async function fetchData({ done }: { done: any }) {
</script>
<template>
<LoadingBanner
v-if="!isRefreshed"
class="mt-12"
/>
<VInfiniteScroll
mode="intersect"
side="end"
:items="dataList"
class="overflow-hidden"
@load="fetchData"
>
<LoadingBanner v-if="!isRefreshed" class="mt-12" />
<VInfiniteScroll mode="intersect" side="end" :items="dataList" class="overflow-hidden" @load="fetchData">
<template #loading />
<template #empty />
<div
v-if="dataList.length > 0"
class="grid gap-4 grid-media-card mx-3"
tabindex="0"
>
<MediaCard
v-for="data in dataList"
:key="data.tmdb_id || data.douban_id"
:media="data"
/>
<div v-if="dataList.length > 0" class="grid gap-4 grid-media-card mx-3" tabindex="0">
<MediaCard v-for="data in dataList" :key="data.tmdb_id || data.douban_id" :media="data" />
</div>
<NoDataFound
v-if="dataList.length === 0 && isRefreshed"

75
src/views/discover/PersonCardListView.vue
View File

@@ -2,6 +2,7 @@
import api from '@/api'
import DoubanPersonCard from '@/components/cards/DoubanPersonCard.vue'
import TmdbPersonCard from '@/components/cards/TmdbPersonCard.vue'
import BangumiPersonCard from '@/components/cards/BangumiPersonCard.vue'
import NoDataFound from '@/components/NoDataFound.vue'
// 输入参数
@@ -13,11 +14,7 @@ const props = defineProps({
// 判断是否有滚动条
function hasScroll() {
return (
document.body.scrollHeight
- (window.innerHeight || document.documentElement.clientHeight)
> 2
)
return document.body.scrollHeight - (window.innerHeight || document.documentElement.clientHeight) > 2
}
// 当前页码
@@ -33,11 +30,20 @@ const isRefreshed = ref(false)
const dataList = ref<any>([])
const currData = ref<any>([])
// 拼装参数
function getParams() {
let params = {
page: page.value,
}
if (props.params) params = { ...params, ...props.params }
return params
}
// 获取列表数据
async function fetchData({ done }: { done: any }) {
try {
if (!props.apipath)
return
if (!props.apipath) return
// 如果正在加载中，直接返回
if (loading.value) {
@@ -53,9 +59,7 @@ async function fetchData({ done }: { done: any }) {
loading.value = true
// 请求API
currData.value = await api.get(props.apipath, {
params: {
page: page.value,
},
params: getParams(),
})
// 取消加载中
loading.value = false
@@ -64,6 +68,7 @@ async function fetchData({ done }: { done: any }) {
if (currData.value.length === 0) {
// 如果没有数据，跳出
done('empty')
return
} else {
// 合并数据
dataList.value = [...dataList.value, ...currData.value]
@@ -73,16 +78,13 @@ async function fetchData({ done }: { done: any }) {
done('ok')
}
}
}
else {
} else {
// 加载一次
// 设置加载中
loading.value = true
// 请求API
currData.value = await api.get(props.apipath, {
params: {
page: page.value,
},
params: getParams(),
})
// 标计为已请求完成
isRefreshed.value = true
@@ -100,8 +102,7 @@ async function fetchData({ done }: { done: any }) {
// 取消加载中
loading.value = false
}
}
catch (error) {
} catch (error) {
console.error(error)
// 返回加载失败
done('error')
@@ -110,40 +111,18 @@ async function fetchData({ done }: { done: any }) {
</script>
<template>
<LoadingBanner
v-if="!isRefreshed"
class="mt-12"
/>
<VInfiniteScroll
mode="intersect"
side="end"
:items="dataList"
class="overflow-hidden"
@load="fetchData"
>
<LoadingBanner v-if="!isRefreshed" class="mt-12" />
<VInfiniteScroll mode="intersect" side="end" :items="dataList" class="overflow-hidden" @load="fetchData">
<template #loading />
<template #empty />
<div
v-if="dataList.length > 0 && props.type === 'tmdb'"
class="grid gap-4 grid-media-card mx-3"
tabindex="0"
>
<TmdbPersonCard
v-for="data in dataList"
:key="data.id"
:person="data"
/>
<div v-if="dataList.length > 0 && props.type === 'tmdb'" class="grid gap-4 grid-media-card mx-3" tabindex="0">
<TmdbPersonCard v-for="data in dataList" :key="data.id" :person="data" />
</div>
<div
v-if="dataList.length > 0 && props.type === 'douban'"
class="grid gap-4 grid-media-card mx-3"
tabindex="0"
>
<DoubanPersonCard
v-for="data in dataList"
:key="data.id"
:person="data"
/>
<div v-if="dataList.length > 0 && props.type === 'douban'" class="grid gap-4 grid-media-card mx-3" tabindex="0">
<DoubanPersonCard v-for="data in dataList" :key="data.id" :person="data" />
</div>
<div v-if="dataList.length > 0 && props.type === 'bangumi'" class="grid gap-4 grid-media-card mx-3" tabindex="0">
<BangumiPersonCard v-for="data in dataList" :key="data.id" :person="data" />
</div>
<NoDataFound
v-if="dataList.length === 0 && isRefreshed"