1.关爱人员、急救人员名称超出后,替换为...
This commit is contained in:
2026-01-21 09:15:52 +08:00
parent 8cc8945b68
commit 8095b6b503
+20 -4
View File
@@ -60,7 +60,10 @@
<div> <div>
<div class="emer-info-title">关爱联络员</div> <div class="emer-info-title">关爱联络员</div>
<template v-if="props.userData?.careLiaisonName && props.userData?.careLiaisonPhone"> <template v-if="props.userData?.careLiaisonName && props.userData?.careLiaisonPhone">
<div style="color: #ffffff">{{ props.userData?.careLiaisonName }}</div> <Tooltip placement="top">
<template #title>{{ props.userData?.careLiaisonName }} </template>
<div style="color: #ffffff" class="to-many-word">{{ props.userData?.careLiaisonName }}</div>
</Tooltip>
<div style="color: #ffffff">{{ props.userData?.careLiaisonPhone }}</div> <div style="color: #ffffff">{{ props.userData?.careLiaisonPhone }}</div>
</template> </template>
<template v-else> <template v-else>
@@ -71,7 +74,10 @@
<div class="emer-info-title">急救人员1</div> <div class="emer-info-title">急救人员1</div>
<template v-if="props.userData?.lifeguardName"> <template v-if="props.userData?.lifeguardName">
<div> <div>
<div style="color: #ffffff; margin-right: 5px">{{ props.userData?.lifeguardName }}</div> <Tooltip placement="top">
<template #title>{{ props.userData?.lifeguardName }} </template>
<div style="color: #ffffff; margin-right: 5px" class="to-many-word">{{ props.userData?.lifeguardName }}</div>
</Tooltip>
<div style="color: #ffffff">{{ props.userData?.lifeguardPhone }}</div> <div style="color: #ffffff">{{ props.userData?.lifeguardPhone }}</div>
</div> </div>
</template> </template>
@@ -83,7 +89,10 @@
<div class="emer-info-title">急救人员2</div> <div class="emer-info-title">急救人员2</div>
<template v-if="props.userData?.lifeguardName2"> <template v-if="props.userData?.lifeguardName2">
<div> <div>
<div style="color: #ffffff; margin-right: 5px">{{ props.userData?.lifeguardName2 }}</div> <Tooltip placement="top">
<template #title>{{ props.userData?.lifeguardName2 }} </template>
<div style="color: #ffffff; margin-right: 5px" class="to-many-word">{{ props.userData?.lifeguardName2 }}</div>
</Tooltip>
<div style="color: #ffffff">{{ props.userData?.lifeguardPhone2 }}</div> <div style="color: #ffffff">{{ props.userData?.lifeguardPhone2 }}</div>
</div> </div>
</template> </template>
@@ -169,6 +178,7 @@
import Dialog from '/@/components/dialog/Dialog.vue'; import Dialog from '/@/components/dialog/Dialog.vue';
import { useTheme } from '/@/hooks/theme/useTheme.ts'; import { useTheme } from '/@/hooks/theme/useTheme.ts';
import { healthArchivesApi } from '/@/views/indexSun/indexSun.api.ts'; import { healthArchivesApi } from '/@/views/indexSun/indexSun.api.ts';
import { Tooltip } from 'ant-design-vue';
const props = defineProps({ const props = defineProps({
userData: { type: Object, default: () => {} }, userData: { type: Object, default: () => {} },
@@ -376,7 +386,7 @@
display: flex; display: flex;
line-height: 30px; line-height: 30px;
> div { > div {
width: 50%; width: calc(100% / 3);
text-align: center; text-align: center;
} }
.emer-info-title { .emer-info-title {
@@ -469,4 +479,10 @@
font-size: 14px; font-size: 14px;
} }
} }
.to-many-word {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style> </style>