<template>
  <q-td :props="props.tdProps">
    <q-btn v-if="props.permitEdit || props.permitDelete" flat dense icon="more_vert">
      <q-menu anchor="top right" self="top left">
        <q-item
          dense
          v-if="props.permitEdit"
          clickable
          v-close-popup
          @click="editFunction?.()"
          class="text-primary"
          >{{ $t('edit') }}</q-item
        >
        <q-item
          v-if="props.permitDelete"
          dense
          clickable
          v-close-popup
          @click="removeFunction?.()"
          class="text-negative"
          title="zu"
          >{{ $t('delete') }}</q-item
        >
      </q-menu>
    </q-btn>
  </q-td>
</template>

<script setup lang="ts">
import { QTd } from 'quasar';

const props = defineProps({
  tdProps: { type: Object },
  permitEdit: { type: Boolean, default: false },
  permitDelete: { type: Boolean, default: false },
  editFunction: {
    type: Function,
    required: false,
  },
  removeFunction: {
    type: Function,
    required: false,
  },
});
</script>
