diff --git a/src/components/talk/message/ForwardMessage.vue b/src/components/talk/message/ForwardMessage.vue index d2f2ff3..81af51d 100644 --- a/src/components/talk/message/ForwardMessage.vue +++ b/src/components/talk/message/ForwardMessage.vue @@ -12,7 +12,13 @@ const props = defineProps<{ const isShowRecord = ref(false) const title = computed(() => { - return [...new Set(props.extra.records.map((v) => v.nickname))].join('和') + const uniqueNames = [...new Set(props.extra.records.map(v => v.nickname))]; + if (uniqueNames.length <= 2) { + return uniqueNames.join('和'); + } else { + return uniqueNames.slice(0, 2).join('和') + '等'; + } + // return [...new Set(props.extra.records.map((v) => v.nickname))].join('和') }) console.log(props.extra.records) const onClick = () => { @@ -24,7 +30,7 @@ const onClick = () => { </script> <template> <section class="im-message-forward pointer" :class="{ left: data.float === 'left' }" @click="onClick"> - <div class="title">{{ title }}<span v-if="props.extra.records.length > 2">等</span>的会话记录</div> + <div class="title">{{ title }}的会话记录</div> <div class="list" v-for="(record, index) in extra.records" :key="index"> <p> <span>{{ record.nickname }}: </span> @@ -59,13 +65,14 @@ const onClick = () => { } .title { - height: 44rpx; + max-height: 88rpx; line-height: 44rpx; font-size: 32rpx; color: #1A1A1A; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; font-weight: 400; margin-bottom: 8rpx; }