salix-front/src/pages/Zone/Card/ZoneDescriptorMenuItems.vue

67 lines
1.9 KiB
Vue

<script setup>
import { useQuasar } from 'quasar';
import { useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n';
const { dialog, notify } = useQuasar();
import VnConfirm from 'components/ui/VnConfirm.vue';
import axios from 'axios';
const { t } = useI18n();
const { push, currentRoute } = useRouter();
const zoneId = currentRoute.value.params.id;
const actions = {
clone: async () => {
const opts = { message: t('Zone cloned'), type: 'positive' };
const { data } = await axios.post(`Zones/${zoneId}/clone`, {});
notify(opts);
push(`/zone/${data.id}/basic-data`);
},
remove: async () => {
await axios.post(`Zones/${zoneId}/deleteZone`);
notify({ message: t('Zone deleted'), type: 'positive' });
push({ name: 'ZoneList' });
},
};
function openConfirmDialog(callback) {
dialog({
component: VnConfirm,
componentProps: {
promise: actions[callback],
},
});
}
</script>
<template>
<QItem @click="openConfirmDialog('remove')" v-ripple clickable data-cy="Delete_button">
<QItemSection avatar>
<QIcon name="delete" />
</QItemSection>
<QItemSection>{{ t('deleteZone') }}</QItemSection>
</QItem>
<QItem @click="openConfirmDialog('clone')" v-ripple clickable data-cy="Clone_button">
<QItemSection avatar>
<QIcon name="content_copy" />
</QItemSection>
<QItemSection>{{ t('cloneZone') }}</QItemSection>
</QItem>
</template>
<i18n>
en:
deleteZone: Delete
cloneZone: Clone
confirmDeletion: Confirm deletion
confirmDeletionMessage: Are you sure you want to delete this zone?
es:
cloneZone: Clonar
deleteZone: Eliminar
confirmDeletion: Confirmar eliminación
confirmDeletionMessage: Seguro que quieres eliminar este zona?
Zone deleted: Zona eliminada
</i18n>