44 lines
1.1 KiB
Vue
44 lines
1.1 KiB
Vue
<!-- Author: fruit.com.cn -->
|
|
|
|
<script setup>
|
|
import { computed } from 'vue'
|
|
|
|
/**
|
|
* 后台各列表共用的「用户」单元格。
|
|
*
|
|
* 口径:已登录显示昵称 + uid;未登录显示「游客」标签 + deviceId(单行省略,悬浮看全值)。
|
|
* 客户端平台由独立的「系统」列展示,这里不再重复。
|
|
*/
|
|
const props = defineProps({
|
|
row: { type: Object, required: true }
|
|
})
|
|
|
|
const isGuest = computed(() => props.row?.userId == null)
|
|
</script>
|
|
|
|
<template>
|
|
<div class="app-user-meta">
|
|
<template v-if="isGuest">
|
|
<el-tag type="info" size="small">游客</el-tag>
|
|
<span class="app-user-uid app-user-device" :title="row.deviceId || ''">{{
|
|
row.deviceId || '—'
|
|
}}</span>
|
|
</template>
|
|
<template v-else>
|
|
<span class="app-user-name" :title="row.nickname || ''">{{
|
|
row.nickname || '未设置昵称'
|
|
}}</span>
|
|
<span class="app-user-uid">{{ row.uid || `用户 #${row.userId}` }}</span>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.app-user-device {
|
|
max-width: 150px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
</style>
|