<template>
	<u-avatar size="40" :src="info.avatar" :text="text"></u-avatar>
</template>

<script>
export default {
	name: 'Avatar',
	props: {
		info: {
			default: () => ({}),
			type: Object,
		},
	},
	computed: {
		text() {
			const { avatar, userName = '' } = this.info;
			return avatar ? undefined : userName.charAt(0);
		},
	},
};
</script>

<style scoped></style>
