<template>
  <div :class="['has-text-centered' ,'p-t-sm', {'has-pointer': !!isLink}]" @click="onClick()">
    <div class="avatar-badge-image">
      <figure class="image is-48x48">
        <img :src="img" alt="Placeholder image" class="is-rounded is-avatar" />
      </figure>
    </div>
    <div class>{{text}}</div>
  </div>
</template>

<script lang="ts">
export interface IChildAvatar {
  url: string;
  name: string;
}

export default {
  name: "AvatarBadge",
  props: ["img", "text", "isLink"],
  created() {},
  methods: {
    onClick() {
      this.$emit("onClick");
    }
  }
};
</script>
