mirror of https://github.com/wg-easy/wg-easy
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
25 lines
857 B
25 lines
857 B
<template>
|
|
<div class="h-10 w-10 rounded-full bg-gray-50 dark:bg-neutral-500 relative">
|
|
<IconAvatarDefault class="w-6 m-2 text-gray-300" />
|
|
<img v-if="props.client.avatar" :src="props.client.avatar" class="w-10 rounded-full absolute top-0 left-0" />
|
|
|
|
<div
|
|
v-if="props.client.latestHandshakeAt && new Date() - new Date(props.client.latestHandshakeAt) < 1000 * 60 * 10"
|
|
>
|
|
<div class="animate-ping w-4 h-4 p-1 bg-red-100 dark:bg-red-100 rounded-full absolute -bottom-1 -right-1"></div>
|
|
<div class="w-2 h-2 bg-red-800 dark:bg-red-600 rounded-full absolute bottom-0 right-0"></div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { defineProps } from 'vue';
|
|
import IconAvatarDefault from './icons/IconAvatarDefault.vue';
|
|
|
|
const props = defineProps({
|
|
client: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
});
|
|
</script>
|
|
|