<template>
  <q-badge class="q-mr-xs" v-if="isOwner" color="secondary">所有者</q-badge>
  <!-- <q-badge v-else-if="isManager" color="primary">管理者</q-badge> -->
  <q-badge v-if="isSelf" color="purple">自分</q-badge>
</template>

<script setup lang="ts">
import { computed } from 'vue';
import { IDomainOwnerDisplay } from '../../types/DomainTypes';
import { useAuthStore } from 'stores/useAuthStore';

const authStore = useAuthStore();

interface Props {
  user: { id: number };
  domain: IDomainOwnerDisplay;
}

const props = defineProps<Props>();

const isSelf = computed(() => props.user.id === (Number)(authStore.userId));
const isOwner = computed(() => props.user.id === props.domain.owner.id);
const isManager = computed(() => props.user.id === props.domain.owner.id); // TODO
</script>
