salix-front/src/components/ui/VnAvatar.vue

30 lines
1012 B
Vue

<script setup>
import { useSession } from 'src/composables/useSession';
import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue';
const $props = defineProps({
worker: { type: Number, required: true },
description: { type: String, default: null },
clickable: { type: Boolean, default: false },
});
const session = useSession();
const token = session.getToken();
</script>
<template>
<div class="avatar-picture column items-center">
<QAvatar color="orange">
<QImg
:src="`/api/Images/user/160x160/${$props.worker}/download?access_token=${token}`"
spinner-color="white"
/>
</QAvatar>
<div class="description">
<slot name="description" v-if="$props.description">
<p>
{{ $props.description }}
</p>
</slot>
</div>
<WorkerDescriptorProxy :v-if="$props.clickable" :id="$props.worker" />
</div>
</template>