feat: refs #6739 transferInvoice new checkbox and functionality #352

Merged
jon merged 28 commits from 6739-invoiceOut into dev 2024-06-25 12:46:21 +00:00
1 changed files with 89 additions and 25 deletions

View File

@ -2,7 +2,8 @@
import { ref, reactive } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import { useQuasar } from 'quasar';
import VnConfirm from 'components/ui/VnConfirm.vue';
import VnRow from 'components/ui/VnRow.vue';
import FetchData from 'components/FetchData.vue';
import VnSelect from 'components/common/VnSelect.vue';
@ -18,33 +19,68 @@ const $props = defineProps({
},
});
const quasar = useQuasar();
const { t } = useI18n();
const router = useRouter();
const { notify } = useNotify();
const checked = ref(true);
const transferInvoiceParams = reactive({
id: $props.invoiceOutData?.id,
refFk: $props.invoiceOutData?.ref,
});
const closeButton = ref(null);
const clientsOptions = ref([]);
const rectificativeTypeOptions = ref([]);
const siiTypeInvoiceOutsOptions = ref([]);
const invoiceCorrectionTypesOptions = ref([]);
const closeForm = () => {
if (closeButton.value) closeButton.value.click();
const selectedClient = (client) => {
transferInvoiceParams.selectedClientData = client;
};
const transferInvoice = async () => {
const makeInvoice = async () => {
const hasToInvoiceByAddress =
transferInvoiceParams.selectedClientData.hasToInvoiceByAddress;
const params = {
id: transferInvoiceParams.id,
cplusRectificationTypeFk: transferInvoiceParams.cplusRectificationTypeFk,
invoiceCorrectionTypeFk: transferInvoiceParams.invoiceCorrectionTypeFk,
newClientFk: transferInvoiceParams.newClientFk,
refFk: transferInvoiceParams.refFk,
siiTypeInvoiceOutFk: transferInvoiceParams.siiTypeInvoiceOutFk,
makeInvoice: checked.value,
jon marked this conversation as resolved Outdated
Outdated
Review

cambiar a makeInvoice

cambiar a makeInvoice
};
try {
jon marked this conversation as resolved Outdated
Outdated
Review

No se debe poner en el código nada referente al entorno (en este caso local). Como esta hecho abajo:
const { data } = await axios.post('InvoiceOuts/transferInvoice', params);
Se debe poner directamente el modulo al que se hace la petición porque axios ya tiene puesto que dependiendo del entorno apunte a (local/dev/test/master)

De todas maneras, para tablas grandes, como es este caso de Client, es mejor usar la propiedad url del componente VnSelect así el propio componente ya se encarga de la paginación

No se debe poner en el código nada referente al entorno (en este caso local). Como esta hecho abajo: ` const { data } = await axios.post('InvoiceOuts/transferInvoice', params);` Se debe poner directamente el modulo al que se hace la petición porque axios ya tiene puesto que dependiendo del entorno apunte a (local/dev/test/master) De todas maneras, para tablas grandes, como es este caso de Client, es mejor usar la propiedad `url` del componente `VnSelect` así el propio componente ya se encarga de la paginación
const { data } = await axios.post(
'InvoiceOuts/transferInvoice',
transferInvoiceParams
);
if (checked.value && hasToInvoiceByAddress) {
const response = await new Promise((resolve) => {
quasar
.dialog({
component: VnConfirm,
componentProps: {
title: t('Bill destination client'),
message: t('transferInvoiceInfo'),
},
})
.onOk(() => {
resolve(true);
jon marked this conversation as resolved Outdated
Outdated
Review

Al usar la propiedad url de VnSelect se evita este código

Al usar la propiedad `url` de `VnSelect` se evita este código
})
.onCancel(() => {
resolve(false);
});
});
if (!response) {
console.log('entra cuando no checkbox');
return;
}
}
jon marked this conversation as resolved Outdated
Outdated
Review

Al usar la propiedad url de VnSelect se evita este código

Al usar la propiedad `url` de `VnSelect` se evita este código
console.log('params: ', params);
const { data } = await axios.post('InvoiceOuts/transferInvoice', params);
Outdated
Review

data.?id
Data puede que sea null

data.?id Data puede que sea null
console.log('data: ', data);
notify(t('Transferred invoice'), 'positive');
closeForm();
Outdated
Review

Y closeForm si lo querias? o no hace falta?

Y closeForm si lo querias? o no hace falta?
router.push('InvoiceOutSummary', { id: data.id });
const id = data?.[0];
if (id) router.push({ name: 'InvoiceOutSummary', params: { id } });
} catch (err) {
console.error('Error transfering invoice', err);
}
@ -52,22 +88,30 @@ const transferInvoice = async () => {
</script>
<template>
<FetchData
url="Clients"
@on-fetch="(data) => (clientsOptions = data)"
:filter="{ fields: ['id', 'name'], order: 'id', limit: 30 }"
auto-load
/>
<FetchData
url="CplusRectificationTypes"
:filter="{ order: 'description' }"
@on-fetch="(data) => (rectificativeTypeOptions = data)"
@on-fetch="
jon marked this conversation as resolved Outdated
Outdated
Review

Al componente VnSelect si le pides el campo hasToInvoiceByAddress en el fields ya te lo devuelve y no hace falta volver a pedir los datos del cliente

Al componente VnSelect si le pides el campo `hasToInvoiceByAddress` en el fields ya te lo devuelve y no hace falta volver a pedir los datos del cliente
(data) => (
(rectificativeTypeOptions = data),
(transferInvoiceParams.cplusRectificationTypeFk = data.filter(
(type) => type.description == 'I Por diferencias'
)[0].id)
)
"
auto-load
/>
<FetchData
url="SiiTypeInvoiceOuts"
:filter="{ where: { code: { like: 'R%' } } }"
@on-fetch="(data) => (siiTypeInvoiceOutsOptions = data)"
@on-fetch="
(data) => (
(siiTypeInvoiceOutsOptions = data),
(transferInvoiceParams.siiTypeInvoiceOutFk = data.filter(
(type) => type.code == 'R4'
)[0].id)
)
"
auto-load
/>
<FetchData
@ -76,7 +120,7 @@ const transferInvoice = async () => {
auto-load
/>
<FormPopup
@on-submit="transferInvoice()"
@on-submit="makeInvoice()"
:title="t('Transfer invoice')"
:custom-submit-button-label="t('Transfer client')"
:default-cancel-button="false"
@ -91,13 +135,18 @@ const transferInvoice = async () => {
option-value="id"
v-model="transferInvoiceParams.newClientFk"
:required="true"
url="Clients"
:fields="['id', 'name', 'hasToInvoiceByAddress']"
auto-load
>
jon marked this conversation as resolved Outdated
Outdated
Review

Esta parte hacerla como se ha hecho en salix, filtrando por code si se puede y sino por description

Esta parte hacerla como se ha hecho en salix, filtrando por code si se puede y sino por description
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItem
v-bind="scope.itemProps"
@click="selectedClient(scope.opt)"
>
<QItemSection>
<QItemLabel>
#{{ scope.opt?.id }} -
{{ scope.opt?.name }}
#{{ scope.opt?.id }} - {{ scope.opt?.name }}
</QItemLabel>
</QItemSection>
</QItem>
@ -144,11 +193,23 @@ const transferInvoice = async () => {
:required="true"
/>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div>
<QCheckbox :label="t('Bill destination client')" v-model="checked" />
<QIcon name="info" class="cursor-info q-ml-sm" size="sm">
<QTooltip>{{ t('transferInvoiceInfo') }}</QTooltip>
</QIcon>
</div>
</VnRow>
</template>
</FormPopup>
</template>
<i18n>
en:
checkInfo: New tickets from the destination customer will be generated in the consignee by default.
transferInvoiceInfo: Destination customer is marked to bill in the consignee
confirmTransferInvoice: The destination customer has selected to bill in the consignee, do you want to continue?
es:
Transfer invoice: Transferir factura
Transfer client: Transferir cliente
@ -157,4 +218,7 @@ es:
Class: Clase
Type: Tipo
Transferred invoice: Factura transferida
Bill destination client: Facturar cliente destino
transferInvoiceInfo: Los nuevos tickets del cliente destino, serán generados en el consignatario por defecto.
confirmTransferInvoice: El cliente destino tiene marcado facturar por consignatario, desea continuar?
</i18n>