salix-front/src/pages/Claim/Card/ClaimDescriptorMenu.vue

131 lines
3.8 KiB
Vue

<script setup>
import axios from 'axios';
import { ref } from 'vue';
import { useQuasar } from 'quasar';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import { usePrintService } from 'composables/usePrintService';
import SendEmailDialog from 'components/common/SendEmailDialog.vue';
import VnConfirm from 'components/ui/VnConfirm.vue';
const $props = defineProps({
claim: {
type: Object,
required: true,
},
});
const router = useRouter();
const quasar = useQuasar();
const { t } = useI18n();
const { openReport, sendEmail } = usePrintService();
const claim = ref($props.claim);
function openPickupOrder() {
const id = claim.value.id;
openReport(`Claims/${id}/claim-pickup-pdf`, {
recipientId: claim.value.clientFk,
});
}
function confirmPickupOrder() {
const customer = claim.value.client;
quasar.dialog({
component: SendEmailDialog,
componentProps: {
data: {
address: customer.email,
},
promise: sendPickupOrder,
},
});
}
function sendPickupOrder({ address }) {
const id = claim.value.id;
const customer = claim.value.client;
return sendEmail(`Claims/${id}/claim-pickup-email`, {
recipientId: customer.id,
recipient: address,
});
}
function confirmRemove() {
quasar
.dialog({
component: VnConfirm,
componentProps: {
title: t('confirmDeletion'),
message: t('confirmDeletionMessage'),
promise: remove,
},
})
.onOk(async () => await router.push({ name: 'ClaimList' }));
}
async function remove() {
const id = claim.value.id;
await axios.delete(`Claims/${id}`);
quasar.notify({
message: t('globals.dataDeleted'),
type: 'positive',
});
}
</script>
<template>
<QItem v-ripple clickable>
<QItemSection avatar>
<QIcon name="summarize" />
</QItemSection>
<QItemSection>{{ t('pickupOrder') }}</QItemSection>
<QItemSection side>
<QIcon name="keyboard_arrow_right" />
</QItemSection>
<QMenu anchor="top end" self="top start" auto-close>
<QList>
<QItem @click="openPickupOrder" v-ripple clickable>
<QItemSection avatar>
<QIcon name="picture_as_pdf" />
</QItemSection>
<QItemSection>{{ t('openPickupOrder') }}</QItemSection>
</QItem>
<QItem @click="confirmPickupOrder" v-ripple clickable>
<QItemSection avatar>
<QIcon name="send" />
</QItemSection>
<QItemSection>{{ t('sendPickupOrder') }}</QItemSection>
</QItem>
</QList>
</QMenu>
</QItem>
<QSeparator />
<QItem @click="confirmRemove()" v-ripple clickable data-cy="deleteClaim">
<QItemSection avatar>
<QIcon name="delete" />
</QItemSection>
<QItemSection>{{ t('deleteClaim') }}</QItemSection>
</QItem>
</template>
<i18n>
{
"en": {
"pickupOrder": "Pickup order",
"openPickupOrder": "Open pickup order",
"sendPickupOrder": "Send pickup order",
"deleteClaim": "Delete claim",
"confirmDeletion": "Confirm deletion",
"confirmDeletionMessage": "Are you sure you want to delete this claim?"
},
"es": {
"pickupOrder": "Orden de recogida",
"openPickupOrder": "Abrir orden de recogida",
"sendPickupOrder": "Enviar orden de recogida",
"deleteClaim": "Eliminar reclamación",
"confirmDeletion": "Confirmar eliminación",
"confirmDeletionMessage": "Seguro que quieres eliminar esta reclamación?"
}
}
</i18n>