<template>
  <div
    class="gobang-play-page-aside-user flex justify-center items-center"
    :class="{ 'flex-col': !footer }"
  >
    <el-avatar :size="40" :src="getAvatarURL(user.avatar)" />
    <div class="gobang-play-page-aside-user__name">{{ user.name }}</div>
  </div>
</template>
<style lang="scss" scoped>
.gobang-play-page-aside-user {
  gap: 10px;
}
</style>
<script setup lang="ts">
import { getAvatarURL } from '@/api';
import type { UserInfo } from '@/schemas/response';
withDefaults(defineProps<{ user: UserInfo; footer?: boolean }>(), {
  footer: false,
});
</script>
