<script setup>
import StandardEntityModal from "~/components/StandardEntityModal.vue";

const props = defineProps({
  type: {
    type: String,
    required: true
  },
  id: {
    type: [String, Number],
  },
  createQuery: {
    type: Object,
    default: {}
  },
  buttonShow: {
    type: Boolean,
    default: true
  },
  buttonEdit: {
    type: Boolean,
    default: true
  },
  buttonCreate: {
    type: Boolean,
    default: true
  }
})

const emit = defineEmits(["returnData"])


const modal = useModal()



</script>

<template>
  <UButton
      variant="outline"
      size="sm"
      square
      class="ml-2 shrink-0"
      v-if="props.id && props.buttonShow"
      icon="i-heroicons-eye"
      @click="modal.open(StandardEntityModal, {
        id: props.id,
        type: props.type,
        mode: 'show',
      })"
  />
  <UButton
      variant="outline"
      size="sm"
      square
      class="ml-2 shrink-0"
      v-if="props.id && props.buttonEdit"
      icon="i-heroicons-pencil-solid"
      @click="modal.open(StandardEntityModal, {
        id: props.id,
        type: props.type,
        mode: 'edit',
        onReturnData(data) {
          emit('returnData', data)
        }
      })"
  />
  <UButton
      variant="outline"
      size="sm"
      square
      class="ml-2 shrink-0"
      v-if="!props.id && props.buttonCreate"
      icon="i-heroicons-plus"
      @click="modal.open(StandardEntityModal, {
        type: props.type,
        mode: 'create',
        createQuery: props.createQuery,
        onReturnData(data) {
          emit('returnData', data)
        }
      })"
  />
</template>

<style scoped>

</style>
