0
0
Fork 0

descriptor menu actions

This commit is contained in:
William Buezas 2024-02-21 11:27:32 -03:00
parent 587baa645e
commit c407566d67
4 changed files with 192 additions and 57 deletions

View File

@ -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"

View File

@ -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>

View File

@ -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 };
}

View File

@ -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>