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

fix: prevent SubscribeCard overflow by adding truncation and flex constraints to username and progress display

Browse Source
This commit is contained in:
jxxghp
2026-05-13 14:51:13 +08:00
parent b49385af29
commit 8a362d0740
1 changed files with 7 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/cards/SubscribeCard.vue
+7 -6
View File
@@ -408,8 +408,8 @@ function handleCardClick() {
</div> </div>
</div> </div>
</VCardText> </VCardText>
<VCardText class="flex justify-space-between align-center flex-wrap px-3"> <VCardText class="flex min-w-0 justify-space-between align-center flex-wrap px-3">
<div class="flex align-center"> <div class="flex min-w-0 max-w-full align-center">
<VIcon <VIcon
v-if="props.media?.total_episode && props.sortable" v-if="props.media?.total_episode && props.sortable"
icon="mdi-progress-download" icon="mdi-progress-download"
@@ -424,13 +424,14 @@ function handleCardClick() {
icon="mdi-progress-download" icon="mdi-progress-download"
color="white" color="white"
/> />
<div v-if="props.media?.season" class="text-subtitle-2 me-2 text-white"> <div v-if="props.media?.season" class="flex-shrink-0 text-subtitle-2 me-2 text-white">
{{ (props.media?.total_episode || 0) - (props.media?.lack_episode || 0) }} / {{ (props.media?.total_episode || 0) - (props.media?.lack_episode || 0) }} /
{{ props.media?.total_episode }} {{ props.media?.total_episode }}
</div> </div>
<VIcon v-if="props.media?.username && props.sortable" icon="mdi-account" size="small" color="white" class="me-1" /> <VIcon v-if="props.media?.username && props.sortable" icon="mdi-account" size="small" color="white" class="flex-shrink-0 me-1" />
<IconBtn v-else-if="props.media?.username" icon="mdi-account" size="small" color="white" /> <IconBtn v-else-if="props.media?.username" icon="mdi-account" size="small" color="white" class="flex-shrink-0" />
<span v-if="props.media?.username" class="text-subtitle-2 text-white"> <!-- 用户名过长时限制在卡片宽度内，并用省略号展示剩余内容 -->
<span v-if="props.media?.username" class="min-w-0 truncate text-subtitle-2 text-white" :title="props.media?.username">
{{ props.media?.username }} {{ props.media?.username }}
</span> </span>
</div> </div>