| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <script lang="ts" setup> |
|---|
| | | import { computed } from 'vue' |
|---|
| | | |
|---|
| | | import { IconifyIcon as Icon } from '#/packages/icons/src' |
|---|
| | | |
|---|
| | | import { getCardLabelInfo } from '#/views/im/utils/message' |
|---|
| | | |
|---|
| | | defineOptions({ name: 'ImCardLineLabel' }) |
|---|
| | | |
|---|
| | | const props = withDefaults( |
|---|
| | | defineProps<{ |
|---|
| | | /** åçæ°æ®ï¼åªè¯» targetType / name æ´¾çæ ç¾ + æ¾ç¤ºï¼ç»ææ§ç±»åå
¼å®¹ CardMessage / å¼ç¨é¢è§ç partial */ |
|---|
| | | card: null | undefined | { name?: string; targetType?: number; } |
|---|
| | | iconSize?: number |
|---|
| | | }>(), |
|---|
| | | { iconSize: 14 } |
|---|
| | | ) |
|---|
| | | |
|---|
| | | /** æ ç¾ + å¾æ æ targetType äºåï¼å
åºã个人åçãé¿å
null æ¶ UI ç©ºç½ */ |
|---|
| | | const labelInfo = computed(() => getCardLabelInfo(props.card)) |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <template> |
|---|
| | | <!-- åçåè¡ inline labelï¼ã[icon] 群åç / 个人åçï¼xxãï¼å表æè¦ / å¼ç¨é¢è§ / åå°é¢è§å¤ç¨ --> |
|---|
| | | <span class="inline-flex gap-1.5 items-center"> |
|---|
| | | <Icon :icon="labelInfo.icon" :size="iconSize" /> |
|---|
| | | <span>{{ labelInfo.label }}ï¼{{ card?.name || '' }}</span> |
|---|
| | | </span> |
|---|
| | | </template> |
|---|
