更新 MessageCard.vue:调整卡片宽度,优化文本处理逻辑以支持换行

This commit is contained in:
jxxghp
2025-01-09 12:44:07 +08:00
parent e8ede6e606
commit eef6f37ace
+10 -5
View File
@@ -46,7 +46,7 @@ function replaceNewLine(value: string) {
</script> </script>
<template> <template>
<VCard variant="tonal" :width="props.width" :height="props.height" @click="openLink" max-width="25rem"> <VCard variant="tonal" :width="props.width" :height="props.height" @click="openLink" max-width="23rem">
<div v-if="props.message?.image" class="relative text-center card-cover-blurred"> <div v-if="props.message?.image" class="relative text-center card-cover-blurred">
<VImg <VImg
:src="props.message?.image" :src="props.message?.image"
@@ -59,12 +59,17 @@ function replaceNewLine(value: string) {
/> />
</div> </div>
<div <div
v-if="props.message?.title && !props.message?.image && !props.message?.note" v-if="
props.message?.title &&
!props.message?.text &&
!props.message?.image &&
isNullOrEmptyObject(props.message?.note)
"
class="rounded-md text-body-1 py-2 px-4 elevation-2 bg-primary text-white chat-right mb-1" class="rounded-md text-body-1 py-2 px-4 elevation-2 bg-primary text-white chat-right mb-1"
> >
<p class="mb-0">{{ props.message?.title }}</p> <p class="mb-0">{{ props.message?.title }}</p>
</div> </div>
<VCardTitle v-else-if="props.message?.title"> <VCardTitle v-else-if="props.message?.title" class="break-words whitespace-break-spaces">
{{ props.message?.title }} {{ props.message?.title }}
</VCardTitle> </VCardTitle>
<div <div
@@ -77,10 +82,10 @@ function replaceNewLine(value: string) {
<VCardText v-if="!isNullOrEmptyObject(props.message?.note)"> <VCardText v-if="!isNullOrEmptyObject(props.message?.note)">
<VList> <VList>
<VListItem v-for="(value, key) in noteToJson()" :key="key" two-line> <VListItem v-for="(value, key) in noteToJson()" :key="key" two-line>
<VListItemTitle v-if="value.title_year" class="font-bold"> <VListItemTitle v-if="value.title_year" class="font-bold break-words whitespace-break-spaces">
{{ key + 1 }}. {{ value.title_year }} {{ key + 1 }}. {{ value.title_year }}
</VListItemTitle> </VListItemTitle>
<VListItemTitle v-if="value.enclosure" class="font-bold whitespace-break-spaces"> <VListItemTitle v-if="value.enclosure" class="font-bold break-words whitespace-break-spaces">
{{ key + 1 }}. {{ value.title }} {{ value.volume_factor }} ↑{{ value.seeders }} {{ key + 1 }}. {{ value.title }} {{ value.volume_factor }} ↑{{ value.seeders }}
</VListItemTitle> </VListItemTitle>
<VListItemSubtitle v-if="value.type"> <VListItemSubtitle v-if="value.type">