重构 TorrentItem 组件,移除未使用的函数,优化样式和过滤器菜单

This commit is contained in:
jxxghp
2025-03-31 13:24:14 +08:00
parent b70d03e86b
commit 9bd3aebd73
3 changed files with 69 additions and 61 deletions

View File

@@ -56,36 +56,6 @@ async function getSiteIcon() {
}
}
// 获取站点颜色
function getSiteColor(siteId: string | number | undefined) {
if (!siteId) return '#3F51B5'
// 根据站点ID生成不同颜色
const colors = [
'#3F51B5',
'#673AB7',
'#9C27B0',
'#E91E63',
'#F44336',
'#FF5722',
'#FF9800',
'#FFC107',
'#4CAF50',
'#009688',
'#00BCD4',
'#03A9F4',
]
// 简单哈希函数
let hash = 0
const idStr = String(siteId)
for (let i = 0; i < idStr.length; i++) {
hash = idStr.charCodeAt(i) + ((hash << 5) - hash)
}
return colors[Math.abs(hash) % colors.length]
}
// 获取优惠类型样式
function getPromotionClass(downloadVolumeFactor: number | undefined, uploadVolumeFactor: number | undefined) {
if (!downloadVolumeFactor) return 'free-discount'
@@ -118,20 +88,6 @@ function openTorrentDetail() {
window.open(torrent.value?.page_url, '_blank')
}
// 下载种子文件
async function downloadTorrentFile() {
window.open(torrent.value?.enclosure, '_blank')
}
// 促销Chip类
function getVolumeFactorClass(downloadVolume: number | undefined, uploadVolume: number | undefined) {
if (!downloadVolume) return 'text-white bg-gray-500'
if (downloadVolume === 0) return 'text-white bg-lime-500'
else if (downloadVolume < 1) return 'text-white bg-green-500'
else if (uploadVolume !== undefined && uploadVolume !== 1) return 'text-white bg-sky-500'
else return 'text-white bg-gray-500'
}
// 装载时查询站点图标
onMounted(() => {
getSiteIcon()
@@ -142,7 +98,7 @@ onMounted(() => {
<div class="list-item-wrapper">
<VListItem
:value="props.torrent?.torrent_info?.enclosure"
class="torrent-item"
class="torrent-item rounded"
:class="{ 'downloaded-item': downloaded.includes(torrent?.enclosure || '') }"
@click="handleAddDownload"
>

View File

@@ -428,14 +428,44 @@ function loadMore({ done }: { done: any }) {
size="small"
:color="filterForm[key].length > 0 ? 'primary' : undefined"
:prepend-icon="getFilterIcon(key)"
@click="toggleFilterMenu(key)"
class="filter-btn"
rounded="pill"
>
{{ title }}
<VChip v-if="filterForm[key].length > 0" size="small" color="primary" class="ms-1" variant="elevated">{{
filterForm[key].length
}}</VChip>
<VChip v-if="filterForm[key].length > 0" size="small" color="primary" class="ms-1" variant="elevated">
{{ filterForm[key].length }}
</VChip>
<VMenu activator="parent" :close-on-content-click="false">
<VCard max-width="25rem">
<VCardText class="filter-menu-content">
<div class="text-end">
<VBtn variant="text" size="small" color="primary" @click="selectAll(key)"> 全选 </VBtn>
<VBtn
v-if="filterForm[key].length > 0"
variant="text"
size="small"
color="error"
@click="clearFilter(key)"
>
清除
</VBtn>
</div>
<VChipGroup v-model="filterForm[key]" column multiple class="filter-options">
<VChip
v-for="option in filterOptions[key]"
:key="option"
:value="option"
filter
variant="elevated"
class="ma-1 filter-chip"
size="small"
>
{{ option }}
</VChip>
</VChipGroup>
</VCardText>
</VCard>
</VMenu>
</VBtn>
<!-- 清除全部筛选按钮 -->
@@ -540,7 +570,7 @@ function loadMore({ done }: { done: any }) {
<VCard>
<VCardTitle class="py-2 d-flex align-center">
<VIcon :icon="getFilterIcon(currentFilter)" class="me-2"></VIcon>
<span>{{ currentFilterTitle }} 筛选</span>
<span>{{ currentFilterTitle }}</span>
<VSpacer />
<VBtn
v-if="filterForm[currentFilter].length > 0"
@@ -553,9 +583,7 @@ function loadMore({ done }: { done: any }) {
</VBtn>
<VBtn variant="text" size="small" color="primary" @click="selectAll(currentFilter)"> 全选 </VBtn>
</VCardTitle>
<VDivider />
<VCardText class="filter-menu-content pt-4">
<VChipGroup v-model="filterForm[currentFilter]" column multiple class="filter-options">
<VChip
@@ -571,7 +599,6 @@ function loadMore({ done }: { done: any }) {
</VChip>
</VChipGroup>
</VCardText>
<VCardActions>
<VSpacer />
<VBtn variant="elevated" color="primary" @click="filterMenuOpen = false"> 确定 </VBtn>
@@ -651,7 +678,6 @@ function loadMore({ done }: { done: any }) {
}
.filter-menu-content {
max-height: 300px;
overflow-y: auto;
}
@@ -728,7 +754,6 @@ function loadMore({ done }: { done: any }) {
.mobile-sort-select {
min-width: 110px;
max-width: 130px;
font-size: 0.8rem;
}
.filter-buttons-grid {

View File

@@ -361,10 +361,8 @@ function toggleFilterMenu(key: string) {
density="compact"
hide-details
class="sort-select"
prepend-icon="mdi-sort"
>
<template v-slot:prepend>
<VIcon size="small" icon="mdi-sort"></VIcon>
</template>
</VSelect>
<div class="filter-divider"></div>
@@ -378,7 +376,6 @@ function toggleFilterMenu(key: string) {
size="small"
:color="filterForm[key].length > 0 ? 'primary' : undefined"
:prepend-icon="getFilterIcon(key)"
@click="toggleFilterMenu(key)"
class="filter-btn"
rounded="pill"
>
@@ -386,6 +383,37 @@ function toggleFilterMenu(key: string) {
<VChip v-if="filterForm[key].length > 0" size="small" color="primary" class="ms-1" variant="elevated">
{{ filterForm[key].length }}
</VChip>
<VMenu activator="parent" :close-on-content-click="false">
<VCard max-width="20rem">
<VCardText class="filter-menu-content">
<div class="text-end">
<VBtn variant="text" size="small" color="primary" @click="selectAll(key)"> 全选 </VBtn>
<VBtn
v-if="filterForm[key].length > 0"
variant="text"
size="small"
color="error"
@click="clearFilter(key)"
>
清除
</VBtn>
</div>
<VChipGroup v-model="filterForm[key]" column multiple class="filter-options">
<VChip
v-for="option in filterOptions[key]"
:key="option"
:value="option"
filter
variant="elevated"
class="ma-1 filter-chip"
size="small"
>
{{ option }}
</VChip>
</VChipGroup>
</VCardText>
</VCard>
</VMenu>
</VBtn>
<!-- 清除全部筛选按钮 -->
@@ -489,7 +517,7 @@ function toggleFilterMenu(key: string) {
<VCard>
<VCardTitle class="py-2 d-flex align-center">
<VIcon :icon="getFilterIcon(currentFilter)" class="me-2"></VIcon>
<span>{{ currentFilterTitle }} 筛选</span>
<span>{{ currentFilterTitle }}</span>
<VSpacer />
<VBtn
v-if="filterForm[currentFilter].length > 0"
@@ -680,7 +708,6 @@ function toggleFilterMenu(key: string) {
.mobile-sort-select {
min-width: 110px;
max-width: 130px;
font-size: 0.8rem;
}
.filter-buttons-grid {