feat:任务大纲卡片超出3行提示框设置最大宽度

This commit is contained in:
liailing1026
2026-01-10 22:07:23 +08:00
parent 920588b063
commit 82e92f12aa

View File

@@ -1,5 +1,11 @@
<template>
<el-tooltip :disabled="!isOverflow" effect="light" placement="top" :content="text">
<el-tooltip
:disabled="!isOverflow"
effect="light"
placement="top"
:content="text"
popper-class="multi-line-tooltip-popper"
>
<div
ref="containerRef"
class="multi-line-ellipsis"
@@ -28,7 +34,7 @@ interface Props {
const props = withDefaults(defineProps<Props>(), {
text: '',
lines: 3,
maxWidth: '100%',
maxWidth: '100%'
})
const isOverflow = ref(false)
@@ -45,8 +51,8 @@ const containerStyle = computed(
overflow: 'hidden',
textOverflow: 'ellipsis',
lineHeight: '1.5',
wordBreak: 'break-all',
}) as HTMLAttributes['style'],
wordBreak: 'break-all'
} as HTMLAttributes['style'])
)
// 检查文字是否溢出
@@ -91,3 +97,9 @@ onMounted(() => {
white-space: normal;
}
</style>
<style>
.multi-line-tooltip-popper {
max-width: 400px;
}
</style>