forked from verdnatura/salix-front
descriptor menu actions
This commit is contained in:
parent
587baa645e
commit
c407566d67
|
@ -2,7 +2,7 @@
|
|||
import { ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
const emit = defineEmits(['onDataSaved']);
|
||||
const emit = defineEmits(['onSubmit']);
|
||||
|
||||
const $props = defineProps({
|
||||
title: {
|
||||
|
@ -13,7 +13,7 @@ const $props = defineProps({
|
|||
type: String,
|
||||
default: '',
|
||||
},
|
||||
defaultSaveButton: {
|
||||
defaultSubmitButton: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
|
@ -21,6 +21,10 @@ const $props = defineProps({
|
|||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
customSubmitButtonLabel: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
|
@ -28,8 +32,8 @@ const { t } = useI18n();
|
|||
const closeButton = ref(null);
|
||||
const isLoading = ref(false);
|
||||
|
||||
const onDataSaved = (dataSaved) => {
|
||||
emit('onDataSaved', dataSaved);
|
||||
const onSubmit = () => {
|
||||
emit('onSubmit');
|
||||
closeForm();
|
||||
};
|
||||
|
||||
|
@ -40,7 +44,7 @@ const closeForm = () => {
|
|||
|
||||
<template>
|
||||
<QForm
|
||||
@submit="onDataSaved($event)"
|
||||
@submit="onSubmit($event)"
|
||||
class="all-pointer-events full-width"
|
||||
style="max-width: 800px"
|
||||
>
|
||||
|
@ -53,8 +57,8 @@ const closeForm = () => {
|
|||
<slot name="form-inputs" />
|
||||
<div class="q-mt-lg row justify-end">
|
||||
<QBtn
|
||||
v-if="defaultSaveButton"
|
||||
:label="t('globals.save')"
|
||||
v-if="defaultSubmitButton"
|
||||
:label="customSubmitButtonLabel || t('globals.save')"
|
||||
type="submit"
|
||||
color="primary"
|
||||
:disabled="isLoading"
|
||||
|
@ -63,7 +67,6 @@ const closeForm = () => {
|
|||
<QBtn
|
||||
v-if="defaultCancelButton"
|
||||
:label="t('globals.cancel')"
|
||||
type="reset"
|
||||
color="primary"
|
||||
flat
|
||||
class="q-ml-sm"
|
||||
|
|
|
@ -6,6 +6,8 @@ import { useRouter } from 'vue-router';
|
|||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnSelectFilter from 'components/common/VnSelectFilter.vue';
|
||||
import FormPopup from './FormPopup.vue';
|
||||
|
||||
import axios from 'axios';
|
||||
import useNotify from 'src/composables/useNotify.js';
|
||||
|
||||
|
@ -25,7 +27,6 @@ const transferInvoiceParams = reactive({
|
|||
refFk: $props.invoiceOutData?.ref,
|
||||
});
|
||||
const closeButton = ref(null);
|
||||
const isLoading = ref(false);
|
||||
const clientsOptions = ref([]);
|
||||
const rectificativeTypeOptions = ref([]);
|
||||
const siiTypeInvoiceOutsOptions = ref([]);
|
||||
|
@ -74,12 +75,13 @@ const transferInvoice = async () => {
|
|||
@on-fetch="(data) => (invoiceCorrectionTypesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<QForm @submit="transferInvoice()" class="all-pointer-events">
|
||||
<QCard class="column" style="padding: 32px; z-index: 100">
|
||||
<span ref="closeButton" class="close-icon" v-close-popup>
|
||||
<QIcon name="close" size="sm" />
|
||||
</span>
|
||||
<h1 class="title">{{ t('Transfer invoice') }}</h1>
|
||||
<FormPopup
|
||||
@on-submit="transferInvoice()"
|
||||
:title="t('Transfer invoice')"
|
||||
:custom-submit-button-label="t('Transfer client')"
|
||||
:default-cancel-button="false"
|
||||
>
|
||||
<template #form-inputs>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
|
@ -150,17 +152,8 @@ const transferInvoice = async () => {
|
|||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<div class="q-mt-lg row justify-end">
|
||||
<QBtn
|
||||
:label="t('Transfer client')"
|
||||
type="submit"
|
||||
color="primary"
|
||||
:disabled="isLoading"
|
||||
:loading="isLoading"
|
||||
/>
|
||||
</div>
|
||||
</QCard>
|
||||
</QForm>
|
||||
</template>
|
||||
</FormPopup>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
|
@ -173,18 +166,3 @@ es:
|
|||
Type: Tipo
|
||||
Transferred invoice: Factura transferida
|
||||
</i18n>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.close-icon {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
import VnConfirm from 'components/ui/VnConfirm.vue';
|
||||
import { useQuasar } from 'quasar';
|
||||
|
||||
export function useSummaryDialog() {
|
||||
const quasar = useQuasar();
|
||||
|
||||
const openConfirmationModal = (title, message, promise, successFn) => {
|
||||
quasar
|
||||
.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
title: title,
|
||||
message: message,
|
||||
promise: promise,
|
||||
},
|
||||
})
|
||||
.onOk(async () => {
|
||||
if (successFn) successFn();
|
||||
});
|
||||
};
|
||||
|
||||
return { openConfirmationModal };
|
||||
}
|
|
@ -1,12 +1,17 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useQuasar } from 'quasar';
|
||||
|
||||
import TransferInvoiceForm from 'src/components/TransferInvoiceForm.vue';
|
||||
import SendInvoiceForm from './SendInvoiceForm.vue';
|
||||
import SendEmailDialog from 'components/common/SendEmailDialog.vue';
|
||||
|
||||
import useNotify from 'src/composables/useNotify';
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
import { usePrintService } from 'composables/usePrintService';
|
||||
import { useSummaryDialog } from 'composables/useVnConfirm';
|
||||
import axios from 'axios';
|
||||
|
||||
const $props = defineProps({
|
||||
invoiceOutData: {
|
||||
|
@ -15,14 +20,18 @@ const $props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const { notify } = useNotify();
|
||||
const router = useRouter();
|
||||
const session = useSession();
|
||||
const token = session.getToken();
|
||||
const { t } = useI18n();
|
||||
const { openReport } = usePrintService();
|
||||
const { openReport, sendEmail } = usePrintService();
|
||||
const { openConfirmationModal } = useSummaryDialog();
|
||||
const quasar = useQuasar();
|
||||
|
||||
const transferInvoiceDialogRef = ref();
|
||||
const sendInvoiceFormRef = ref();
|
||||
const invoiceFormType = ref(null);
|
||||
const invoiceFormType = ref('pdf');
|
||||
const defaultEmailAddress = ref($props.invoiceOutData.client?.email);
|
||||
|
||||
const showInvoicePdf = () => {
|
||||
const url = `api/InvoiceOuts/${$props.invoiceOutData.id}/download?access_token=${token}`;
|
||||
|
@ -35,9 +44,86 @@ const showInvoiceCsv = () => {
|
|||
});
|
||||
};
|
||||
|
||||
const showSendInvoiceForm = (type) => {
|
||||
const showSendInvoiceDialog = (type) => {
|
||||
invoiceFormType.value = type;
|
||||
sendInvoiceFormRef.value.show();
|
||||
quasar.dialog({
|
||||
component: SendEmailDialog,
|
||||
componentProps: {
|
||||
data: {
|
||||
address: defaultEmailAddress.value,
|
||||
},
|
||||
promise: sendEmailInvoice,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const sendEmailInvoice = async ({ address }) => {
|
||||
try {
|
||||
if (!address) notify(`The email can't be empty`, 'negative');
|
||||
|
||||
if (invoiceFormType.value === 'pdf') {
|
||||
return sendEmail(`InvoiceOuts/${$props.invoiceOutData.ref}/invoice-email`, {
|
||||
recipientId: $props.invoiceOutData.client.id,
|
||||
recipient: address,
|
||||
});
|
||||
} else {
|
||||
return sendEmail(
|
||||
`InvoiceOuts/${$props.invoiceOutData.ref}/invoice-csv-email`,
|
||||
{
|
||||
recipientId: $props.invoiceOutData.client.id,
|
||||
recipient: address,
|
||||
}
|
||||
);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Error sending email', err);
|
||||
}
|
||||
};
|
||||
|
||||
const redirectToInvoiceOutList = () => {
|
||||
router.push({ name: 'InvoiceOutList' });
|
||||
};
|
||||
|
||||
const deleteInvoice = async () => {
|
||||
try {
|
||||
await axios.post(`InvoiceOuts/${$props.invoiceOutData.id}/delete`);
|
||||
notify(t('InvoiceOut deleted'), 'positive');
|
||||
} catch (err) {
|
||||
console.error('Error deleting invoice out', err);
|
||||
}
|
||||
};
|
||||
|
||||
const bookInvoice = async () => {
|
||||
try {
|
||||
await axios.post(`InvoiceOuts/${$props.invoiceOutData.ref}/book`);
|
||||
notify(t('InvoiceOut booked'), 'positive');
|
||||
} catch (err) {
|
||||
console.error('Error booking invoice out', err);
|
||||
}
|
||||
};
|
||||
|
||||
const generateInvoicePdf = async () => {
|
||||
try {
|
||||
await axios.post(`InvoiceOuts/${$props.invoiceOutData.id}/createPdf`);
|
||||
notify(t('The invoice PDF document has been regenerated'), 'positive');
|
||||
} catch (err) {
|
||||
console.error('Error generating invoice out pdf', err);
|
||||
}
|
||||
};
|
||||
|
||||
const refundInvoice = async (withWarehouse) => {
|
||||
try {
|
||||
const params = { ref: $props.invoiceOutData.ref, withWarehouse: withWarehouse };
|
||||
const { data } = await axios.post('InvoiceOuts/refund', params);
|
||||
notify(
|
||||
t('refundInvoiceSuccessMessage', {
|
||||
refundTicket: data[0].id,
|
||||
}),
|
||||
'positive'
|
||||
);
|
||||
} catch (err) {
|
||||
console.error('Error generating invoice out pdf', err);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
@ -68,22 +154,53 @@ const showSendInvoiceForm = (type) => {
|
|||
</QItemSection>
|
||||
<QMenu anchor="top end" self="top start">
|
||||
<QList>
|
||||
<QItem v-ripple clickable @click="showSendInvoiceForm()">
|
||||
<QItem v-ripple clickable @click="showSendInvoiceDialog('pdf')">
|
||||
<QItemSection>{{ t('Send PDF') }}</QItemSection>
|
||||
</QItem>
|
||||
<QItem v-ripple clickable @click="showSendInvoiceForm()">
|
||||
<QItem v-ripple clickable @click="showSendInvoiceDialog('csv')">
|
||||
<QItemSection>{{ t('Send CSV') }}</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</QMenu>
|
||||
</QItem>
|
||||
<QItem v-ripple clickable>
|
||||
<QItem
|
||||
v-ripple
|
||||
clickable
|
||||
@click="
|
||||
openConfirmationModal(
|
||||
t('Confirm deletion'),
|
||||
t('Are you sure you want to delete this invoice?'),
|
||||
deleteInvoice,
|
||||
redirectToInvoiceOutList
|
||||
)
|
||||
"
|
||||
>
|
||||
<QItemSection>{{ t('Delete invoice') }}</QItemSection>
|
||||
</QItem>
|
||||
<QItem v-ripple clickable>
|
||||
<QItem
|
||||
v-ripple
|
||||
clickable
|
||||
@click="
|
||||
openConfirmationModal(
|
||||
'',
|
||||
t('Are you sure you want to book this invoice?'),
|
||||
bookInvoice
|
||||
)
|
||||
"
|
||||
>
|
||||
<QItemSection>{{ t('Book invoice') }}</QItemSection>
|
||||
</QItem>
|
||||
<QItem v-ripple clickable>
|
||||
<QItem
|
||||
v-ripple
|
||||
clickable
|
||||
@click="
|
||||
openConfirmationModal(
|
||||
t('Generate PDF invoice document'),
|
||||
t('Are you sure you want to generate/regenerate the PDF invoice?'),
|
||||
generateInvoicePdf
|
||||
)
|
||||
"
|
||||
>
|
||||
<QItemSection>{{ t('Generate PDF invoice') }}</QItemSection>
|
||||
</QItem>
|
||||
<QItem v-ripple clickable>
|
||||
|
@ -93,22 +210,22 @@ const showSendInvoiceForm = (type) => {
|
|||
</QItemSection>
|
||||
<QMenu anchor="top end" self="top start">
|
||||
<QList>
|
||||
<QItem v-ripple clickable>
|
||||
<QItem v-ripple clickable @click="refundInvoice(true)">
|
||||
<QItemSection>{{ t('With warehouse') }}</QItemSection>
|
||||
</QItem>
|
||||
<QItem v-ripple clickable>
|
||||
<QItem v-ripple clickable @click="refundInvoice(false)">
|
||||
<QItemSection>{{ t('Without warehouse') }}</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</QMenu>
|
||||
<QTooltip>
|
||||
{{ t('Create a single ticket with all the content of the current invoice') }}
|
||||
</QTooltip>
|
||||
</QItem>
|
||||
|
||||
<QDialog ref="transferInvoiceDialogRef">
|
||||
<TransferInvoiceForm :invoice-out-data="invoiceOutData" />
|
||||
</QDialog>
|
||||
<QDialog ref="sendInvoiceFormRef">
|
||||
<SendInvoiceForm />
|
||||
</QDialog>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
|
@ -126,4 +243,18 @@ es:
|
|||
Send CSV: Enviar CSV
|
||||
With warehouse: Con almacén
|
||||
Without warehouse: Sin almacén
|
||||
InvoiceOut deleted: Factura eliminada
|
||||
Confirm deletion: Confirmar eliminación
|
||||
Are you sure you want to delete this invoice?: Estas seguro de eliminar esta factura?
|
||||
Are you sure you want to book this invoice?: Estas seguro de querer asentar esta factura?
|
||||
InvoiceOut booked: Factura asentada
|
||||
Generate PDF invoice document: Generar PDF de la factura
|
||||
Are you sure you want to generate/regenerate the PDF invoice?: ¿Seguro que quieres generar/regenerar el PDF de la factura?
|
||||
The invoice PDF document has been regenerated: El documento PDF de la factura ha sido regenerado
|
||||
Create a single ticket with all the content of the current invoice: Crear un ticket único con todo el contenido de la factura actual
|
||||
refundInvoiceSuccessMessage: Se ha creado el siguiente ticket de abono {refundTicket}
|
||||
The email can't be empty: El email no puede estar vacío
|
||||
|
||||
en:
|
||||
refundInvoiceSuccessMessage: The following refund ticket have been created {refundTicket}
|
||||
</i18n>
|
||||
|
|
Loading…
Reference in New Issue