GithubBackup/MoviePilot-Frontend
1
0
Fork 0
mirror of https://github.com/jxxghp/MoviePilot-Frontend.git synced 2026-09-05 23:56:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix torrents filter

Browse Source
This commit is contained in:
jxxghp
2023-07-16 08:45:35 +08:00
parent c52d2d3611
commit f8c70622d4
3 changed files with 169 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/@core/utils/index.ts
+11
View File
@@ -32,6 +32,7 @@ export const isToday = (date: Date) => {
) )
} }
// 计算时间差，返回xx天xx小时xx分钟
export const calculateTimeDifference = (inputTime: string): string => { export const calculateTimeDifference = (inputTime: string): string => {
if (!inputTime) { if (!inputTime) {
@@ -57,3 +58,13 @@ export const calculateTimeDifference = (inputTime: string): string => {
return `${days}天`; return `${days}天`;
} }
} }
// 判断一个数组subArray是不是在另一个数组mainArray中
export const isContained = (subArray: any[], mainArray: any[]): boolean => {
return subArray.every(element => mainArray.includes(element));
}
// 判断两个数组是否存在交集
export const isIntersected = (array1: any[], array2: any[]): boolean => {
return array1.some(element => array2.includes(element));
}
src/components/cards/SiteCard.vue
+1 -1
View File
@@ -188,7 +188,7 @@ onMounted(() => {
@click="siteInfoDialog = true" @click="siteInfoDialog = true"
> >
<template #image> <template #image>
<VAvatar class="absolute right-2 bottom-2" variant="flat" rounded="0"> <VAvatar class="absolute right-2 bottom-2 rounded" variant="flat" rounded="0">
<VImg :src="siteIcon" /> <VImg :src="siteIcon" />
</VAvatar> </VAvatar>
</template> </template>
src/views/discover/TorrentCardListView.vue
+157 -132
View File
@@ -1,32 +1,33 @@
<script lang="ts" setup> <script lang="ts" setup>
import api from "@/api"; import { isIntersected } from '@/@core/utils'
import { Context } from "@/api/types"; import api from '@/api'
import TorrentCard from "@/components/cards/TorrentCard.vue"; import { Context } from '@/api/types'
import NoDataFound from "@/components/NoDataFound.vue"; import TorrentCard from '@/components/cards/TorrentCard.vue'
import store from "@/store"; import NoDataFound from '@/components/NoDataFound.vue'
import store from '@/store'
// 定义输入参数 // 定义输入参数
const props = defineProps({ const props = defineProps({
keyword: String, keyword: String,
}); })
// 数据列表 // 数据列表
const dataList = ref<Context[]>([]); const dataList = ref<Context[]>([])
// 分组后的数据列表 // 分组后的数据列表
const groupedDataList = computed(() => { const groupedDataList = computed(() => {
return groupByTitleAndSize(dataList.value); return groupByTitleAndSize(dataList.value)
}); })
// 是否刷新过 // 是否刷新过
const isRefreshed = ref(false); const isRefreshed = ref(false)
// 加载进度文本 // 加载进度文本
const progressText = ref(""); const progressText = ref('')
// 加载进度 // 加载进度
const progressValue = ref(0); const progressValue = ref(0)
// 加载进度SSE // 加载进度SSE
const progressEventSource = ref<EventSource>(); const progressEventSource = ref<EventSource>()
// 过滤表单 // 过滤表单
const filterForm = reactive({ const filterForm = reactive({
@@ -42,211 +43,216 @@ const filterForm = reactive({
freeState: [] as string[], freeState: [] as string[],
// 质量 // 质量
edition: [] as string[], edition: [] as string[],
}); })
// 获取站点过滤选项 // 获取站点过滤选项
const getSiteFilterOptions = computed(() => { const getSiteFilterOptions = computed(() => {
const options: string[] = []; const options: string[] = []
dataList.value.forEach((data) => { dataList.value.forEach(data => {
if (data.torrent_info?.site_name && !options.includes(data.torrent_info?.site_name)) { if (data.torrent_info?.site_name && !options.includes(data.torrent_info?.site_name)) {
options.push(data.torrent_info?.site_name); options.push(data.torrent_info?.site_name)
} }
}); })
return options; return options
}); })
// 获取季过滤选项 // 获取季过滤选项
const getSeasonFilterOptions = computed(() => { const getSeasonFilterOptions = computed(() => {
const options: string[] = []; const options: string[] = []
dataList.value.forEach((data) => { dataList.value.forEach(data => {
if ( if (data.meta_info.season_episode && !options.includes(data.meta_info.season_episode)) {
data.meta_info.season_episode && options.push(data.meta_info.season_episode)
!options.includes(data.meta_info.season_episode)
) {
options.push(data.meta_info.season_episode);
} }
}); })
return options; return options
}); })
// 获取制作组过滤选项 // 获取制作组过滤选项
const getReleaseGroupFilterOptions = computed(() => { const getReleaseGroupFilterOptions = computed(() => {
const options: string[] = []; const options: string[] = []
dataList.value.forEach((data) => { dataList.value.forEach(data => {
if (data.meta_info.resource_team && !options.includes(data.meta_info.resource_team)) { if (data.meta_info.resource_team && !options.includes(data.meta_info.resource_team)) {
options.push(data.meta_info.resource_team); options.push(data.meta_info.resource_team)
} }
}); })
return options; return options
}); })
// 获取视频编码过滤选项 // 获取视频编码过滤选项
const getVideoCodeFilterOptions = computed(() => { const getVideoCodeFilterOptions = computed(() => {
const options: string[] = []; const options: string[] = []
dataList.value.forEach((data) => { dataList.value.forEach(data => {
if (data.meta_info.video_encode && !options.includes(data.meta_info.video_encode)) { if (data.meta_info.video_encode && !options.includes(data.meta_info.video_encode)) {
options.push(data.meta_info.video_encode); options.push(data.meta_info.video_encode)
} }
}); })
return options; return options
}); })
// 获取促销状态过滤选项 // 获取促销状态过滤选项
const getFreeStateFilterOptions = computed(() => { const getFreeStateFilterOptions = computed(() => {
const options: string[] = []; const options: string[] = []
dataList.value.forEach((data) => { dataList.value.forEach(data => {
if ( if (data.torrent_info.volume_factor && !options.includes(data.torrent_info.volume_factor)) {
data.torrent_info.volume_factor && options.push(data.torrent_info.volume_factor)
!options.includes(data.torrent_info.volume_factor)
) {
options.push(data.torrent_info.volume_factor);
} }
}); })
return options; return options
}); })
// 获取质量过滤选项 // 获取质量过滤选项
const getEditionFilterOptions = computed(() => { const getEditionFilterOptions = computed(() => {
const options: string[] = []; const options: string[] = []
dataList.value.forEach((data) => { dataList.value.forEach(data => {
if (data.meta_info.edition && !options.includes(data.meta_info.edition)) { if (data.meta_info.edition && !options.includes(data.meta_info.edition)) {
options.push(data.meta_info.edition); options.push(data.meta_info.edition)
} }
}); })
return options; return options
}); })
// 按过滤项过滤卡片 // 按过滤项过滤卡片
const filterTorrentsCard = (data: Context) => { const filterTorrentsCard = (data: Context) => {
const { torrent_info, meta_info } = data; // 当前分组的所有数据
const { site_name, volume_factor } = torrent_info; const items: Context[] = groupedDataList.value.get(`${data.torrent_info.title}_${data.torrent_info.size}`) ?? []
const { season_episode, resource_team, video_encode } = meta_info;
// 站点名称、促销状态
let site_names = []
let volume_factors = []
for (const { torrent_info } of items) {
site_names.push(torrent_info.site_name)
volume_factors.push(torrent_info.volume_factor)
}
const { meta_info } = data
// 季、制作组、视频编码
const { season_episode, resource_team, video_encode } = meta_info
// 站点过滤 // 站点过滤
if (filterForm.site.length > 0 && !filterForm.site.includes(site_name || "")) { if (filterForm.site.length > 0 && !isIntersected(filterForm.site, site_names)) {
return false; return false
}
// 促销状态过滤
if (filterForm.freeState.length > 0 && !isIntersected(filterForm.freeState, volume_factors)) {
return false
} }
// 季过滤 // 季过滤
if (filterForm.season.length > 0 && !filterForm.season.includes(season_episode)) { if (filterForm.season.length > 0 && !filterForm.season.includes(season_episode)) {
return false; return false
} }
// 制作组过滤 // 制作组过滤
if ( if (filterForm.releaseGroup.length > 0 && !filterForm.releaseGroup.includes(resource_team || '')) {
filterForm.releaseGroup.length > 0 && return false
!filterForm.releaseGroup.includes(resource_team || "")
) {
return false;
} }
// 视频编码过滤 // 视频编码过滤
if ( if (filterForm.videoCode.length > 0 && !filterForm.videoCode.includes(video_encode || '')) {
filterForm.videoCode.length > 0 && return false
!filterForm.videoCode.includes(video_encode || "")
) {
return false;
}
// 促销状态过滤
if (filterForm.freeState.length > 0 && !filterForm.freeState.includes(volume_factor)) {
return false;
} }
// 质量过滤 // 质量过滤
if (filterForm.edition.length > 0 && !filterForm.edition.includes(meta_info.edition)) { if (filterForm.edition.length > 0 && !filterForm.edition.includes(meta_info.edition)) {
return false; return false
} }
return true; return true
}; }
// 获取订阅列表数据 // 获取订阅列表数据
const fetchData = async () => { const fetchData = async () => {
try { try {
let keyword = props.keyword?.toString() ?? ""; let keyword = props.keyword?.toString() ?? ''
if (!keyword) { if (!keyword) {
// 查询上次搜索结果 // 查询上次搜索结果
dataList.value = await api.get("search/last"); dataList.value = await api.get('search/last')
} else { } else {
startLoadingProgress(); startLoadingProgress()
// 优先按TMDBID精确查询 // 优先按TMDBID精确查询
if (props.keyword?.startsWith("tmdb:") || props.keyword?.startsWith("douban:")) { if (props.keyword?.startsWith('tmdb:') || props.keyword?.startsWith('douban:')) {
dataList.value = await api.get(`search/media/${props.keyword}`); dataList.value = await api.get(`search/media/${props.keyword}`)
} else { } else {
// 按标题模糊查询 // 按标题模糊查询
dataList.value = await api.get(`search/title/${props.keyword}`); dataList.value = await api.get(`search/title/${props.keyword}`)
} }
stopLoadingProgress(); stopLoadingProgress()
} }
isRefreshed.value = true; isRefreshed.value = true
} catch (error) { } catch (error) {
console.error(error); console.error(error)
} }
}; }
// 按标题和大小分组 // 按标题和大小分组
const groupByTitleAndSize = (contextArray: Context[]): Map<string, Context[]> => { const groupByTitleAndSize = (contextArray: Context[]): Map<string, Context[]> => {
const groupMap = new Map<string, Context[]>(); const groupMap = new Map<string, Context[]>()
for (const context of contextArray) { for (const context of contextArray) {
const { torrent_info } = context; const { torrent_info } = context
const key = `${torrent_info.title}_${torrent_info.size}`; const key = `${torrent_info.title}_${torrent_info.size}`
if (groupMap.has(key)) { if (groupMap.has(key)) {
// 已存在相同标题和大小的分组，将当前上下文信息添加到分组中 // 已存在相同标题和大小的分组，将当前上下文信息添加到分组中
const group = groupMap.get(key); const group = groupMap.get(key)
group?.push(context); group?.push(context)
} else { } else {
// 创建新的分组，并将当前上下文信息添加到分组中 // 创建新的分组，并将当前上下文信息添加到分组中
groupMap.set(key, [context]); groupMap.set(key, [context])
} }
} }
return groupMap; return groupMap
}; }
// 获取每个分组的第一个数据 // 获取每个分组的第一个数据
const getFirstContexts = computed(() => { const getFirstContexts = computed(() => {
const firstContexts: Context[] = []; const firstContexts: Context[] = []
groupedDataList.value.forEach((group) => { groupedDataList.value.forEach(group => {
if (group.length > 0) { if (group.length > 0) {
firstContexts.push(group[0]); firstContexts.push(group[0])
} }
}); })
return firstContexts; return firstContexts
}); })
// 使用SSE监听加载进度 // 使用SSE监听加载进度
const startLoadingProgress = () => { const startLoadingProgress = () => {
progressText.value = "正在搜索，请稍候..."; progressText.value = '正在搜索，请稍候...'
const token = store.state.auth.token; const token = store.state.auth.token
progressEventSource.value = new EventSource( progressEventSource.value = new EventSource(
`${import.meta.env.VITE_API_BASE_URL}system/progress/search?token=${token}` `${import.meta.env.VITE_API_BASE_URL}system/progress/search?token=${token}`,
); )
progressEventSource.value.onmessage = (event) => { progressEventSource.value.onmessage = event => {
const progress = JSON.parse(event.data); const progress = JSON.parse(event.data)
console.log(progress); if (progress) {
progressText.value = progress.text; progressText.value = progress.text
progressValue.value = progress.value; progressValue.value = progress.value
}; }
}; }
}
// 停止监听加载进度 // 停止监听加载进度
const stopLoadingProgress = () => { const stopLoadingProgress = () => {
progressEventSource.value?.close(); progressEventSource.value?.close()
}; }
// 加载时获取数据 // 加载时获取数据
onBeforeMount(fetchData); onBeforeMount(fetchData)
</script> </script>
<template> <template>
<VCard class="bg-transparent mb-3 pt-2 shadow-none"> <VCard class="bg-transparent mb-3 pt-2 shadow-none">
<VRow> <VRow>
<VCol v-if="getSiteFilterOptions.length > 0" cols="6" md=""> <VCol
v-if="getSiteFilterOptions.length > 0"
cols="6"
md=""
>
<VSelect <VSelect
v-model="filterForm.site" v-model="filterForm.site"
:items="getSiteFilterOptions" :items="getSiteFilterOptions"
@@ -257,7 +263,11 @@ onBeforeMount(fetchData);
multiple multiple
/> />
</VCol> </VCol>
<VCol v-if="getSeasonFilterOptions.length > 0" cols="6" md=""> <VCol
v-if="getSeasonFilterOptions.length > 0"
cols="6"
md=""
>
<VSelect <VSelect
v-model="filterForm.season" v-model="filterForm.season"
:items="getSeasonFilterOptions" :items="getSeasonFilterOptions"
@@ -268,7 +278,11 @@ onBeforeMount(fetchData);
multiple multiple
/> />
</VCol> </VCol>
<VCol v-if="getReleaseGroupFilterOptions.length > 0" cols="6" md=""> <VCol
v-if="getReleaseGroupFilterOptions.length > 0"
cols="6"
md=""
>
<VSelect <VSelect
v-model="filterForm.releaseGroup" v-model="filterForm.releaseGroup"
:items="getReleaseGroupFilterOptions" :items="getReleaseGroupFilterOptions"
@@ -279,7 +293,11 @@ onBeforeMount(fetchData);
multiple multiple
/> />
</VCol> </VCol>
<VCol v-if="getEditionFilterOptions.length > 0" cols="6" md=""> <VCol
v-if="getEditionFilterOptions.length > 0"
cols="6"
md=""
>
<VSelect <VSelect
v-model="filterForm.edition" v-model="filterForm.edition"
:items="getEditionFilterOptions" :items="getEditionFilterOptions"
@@ -290,7 +308,11 @@ onBeforeMount(fetchData);
multiple multiple
/> />
</VCol> </VCol>
<VCol v-if="getVideoCodeFilterOptions.length > 0" cols="6" md=""> <VCol
v-if="getVideoCodeFilterOptions.length > 0"
cols="6"
md=""
>
<VSelect <VSelect
v-model="filterForm.videoCode" v-model="filterForm.videoCode"
:items="getVideoCodeFilterOptions" :items="getVideoCodeFilterOptions"
@@ -301,7 +323,11 @@ onBeforeMount(fetchData);
multiple multiple
/> />
</VCol> </VCol>
<VCol v-if="getFreeStateFilterOptions.length > 0" cols="6" md=""> <VCol
v-if="getFreeStateFilterOptions.length > 0"
cols="6"
md=""
>
<VSelect <VSelect
v-model="filterForm.freeState" v-model="filterForm.freeState"
:items="getFreeStateFilterOptions" :items="getFreeStateFilterOptions"
@@ -333,17 +359,16 @@ onBeforeMount(fetchData);
></VProgressCircular> ></VProgressCircular>
<span>{{ progressText }}</span> <span>{{ progressText }}</span>
</div> </div>
<div class="grid gap-3 grid-torrent-card items-start" v-if="dataList.length > 0"> <div
class="grid gap-3 grid-torrent-card items-start"
v-if="dataList.length > 0"
>
<TorrentCard <TorrentCard
v-for="data in getFirstContexts" v-for="data in getFirstContexts"
v-show="filterTorrentsCard(data)" v-show="filterTorrentsCard(data)"
:key="data.torrent_info.title" :key="data.torrent_info.title"
:torrent="data" :torrent="data"
:more=" :more="groupedDataList.get(`${data.torrent_info.title}_${data.torrent_info.size}`)?.slice(1)"
groupedDataList
.get(`${data.torrent_info.title}_${data.torrent_info.size}`)
?.slice(1)
"
/> />
</div> </div>
<NoDataFound <NoDataFound