From 112e057cfa0ddec2f9bff572482bf8820d3b2ace Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Tue, 31 Oct 2023 08:56:51 +0100
Subject: [PATCH 01/19] ref #5835 invoiceIn created

---
 src/components/common/VnSelectFilter.vue      |  24 +-
 src/components/ui/VnSearchbar.vue             |   4 +-
 src/composables/downloadFile.js               |  11 +
 src/composables/getUrl.js                     |  13 +-
 src/i18n/en/index.js                          |  66 ++
 src/i18n/es/index.js                          |  64 ++
 .../InvoiceIn/Card/InvoiceInBasicData.vue     | 742 ++++++++++++++++++
 src/pages/InvoiceIn/Card/InvoiceInCard.vue    |  91 +++
 .../InvoiceIn/Card/InvoiceInDescriptor.vue    | 108 +++
 src/pages/InvoiceIn/Card/InvoiceInDueDay.vue  | 290 +++++++
 .../InvoiceIn/Card/InvoiceInIntrastat.vue     | 280 +++++++
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue | 409 ++++++++++
 .../InvoiceIn/Card/InvoiceInSummaryDialog.vue |  29 +
 src/pages/InvoiceIn/Card/InvoiceInVat.vue     | 500 ++++++++++++
 src/pages/InvoiceIn/InvoiceInFilter.vue       | 307 ++++++++
 src/pages/InvoiceIn/InvoiceInList.vue         | 179 +++++
 src/pages/InvoiceIn/InvoiceInMain.vue         |  17 +
 src/router/modules/index.js                   |  11 +-
 src/router/modules/invoiceIn.js               |  98 +++
 src/router/routes.js                          |   2 +
 src/stores/useNavigationStore.js              |  11 +-
 ...{ClaimNotes.spec.js => claimNotes.spec.js} |   0
 .../cypress/integration/invoiceInList.spec.js |  27 +
 .../composables/downloadFile.spec.js          |  25 +
 24 files changed, 3281 insertions(+), 27 deletions(-)
 create mode 100644 src/composables/downloadFile.js
 create mode 100644 src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
 create mode 100644 src/pages/InvoiceIn/Card/InvoiceInCard.vue
 create mode 100644 src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
 create mode 100644 src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
 create mode 100644 src/pages/InvoiceIn/Card/InvoiceInIntrastat.vue
 create mode 100644 src/pages/InvoiceIn/Card/InvoiceInSummary.vue
 create mode 100644 src/pages/InvoiceIn/Card/InvoiceInSummaryDialog.vue
 create mode 100644 src/pages/InvoiceIn/Card/InvoiceInVat.vue
 create mode 100644 src/pages/InvoiceIn/InvoiceInFilter.vue
 create mode 100644 src/pages/InvoiceIn/InvoiceInList.vue
 create mode 100644 src/pages/InvoiceIn/InvoiceInMain.vue
 create mode 100644 src/router/modules/invoiceIn.js
 rename test/cypress/integration/{ClaimNotes.spec.js => claimNotes.spec.js} (100%)
 create mode 100644 test/cypress/integration/invoiceInList.spec.js
 create mode 100644 test/vitest/__tests__/composables/downloadFile.spec.js

diff --git a/src/components/common/VnSelectFilter.vue b/src/components/common/VnSelectFilter.vue
index 55395f260..43827b831 100644
--- a/src/components/common/VnSelectFilter.vue
+++ b/src/components/common/VnSelectFilter.vue
@@ -15,6 +15,10 @@ const $props = defineProps({
         type: String,
         default: '',
     },
+    filterOptions: {
+        type: Array,
+        default: () => [],
+    },
 });
 const { optionLabel, options } = toRefs($props);
 const myOptions = ref([]);
@@ -28,18 +32,22 @@ function setOptions(data) {
 setOptions(options.value);
 
 const filter = (val, options) => {
-    const search = val.toLowerCase();
+    const search = val.toString().toLowerCase();
 
-    if (val === '') return options;
+    if (!search) return options;
 
     return options.filter((row) => {
+        if ($props.filterOptions.length) {
+            return $props.filterOptions.some((prop) => {
+                const propValue = String(row[prop]).toLowerCase();
+                return propValue.includes(search);
+            });
+        }
+
         const id = row.id;
-        const name = row[$props.optionLabel].toLowerCase();
+        const optionLabel = String(row[$props.optionLabel]).toLowerCase();
 
-        const idMatches = id == search;
-        const nameMatches = name.indexOf(search) > -1;
-
-        return idMatches || nameMatches;
+        return id == search || optionLabel.includes(search);
     });
 };
 
@@ -89,7 +97,7 @@ const value = computed({
             <QIcon name="close" @click.stop="value = null" class="cursor-pointer" />
         </template>
         <template v-for="(_, slotName) in $slots" #[slotName]="slotData">
-            <slot :name="slotName" v-bind="slotData" />
+            <slot :name="slotName" v-bind="slotData ?? {}" />
         </template>
     </QSelect>
 </template>
diff --git a/src/components/ui/VnSearchbar.vue b/src/components/ui/VnSearchbar.vue
index 693d6fce2..35f6c1548 100644
--- a/src/components/ui/VnSearchbar.vue
+++ b/src/components/ui/VnSearchbar.vue
@@ -76,9 +76,9 @@ async function search() {
     const module = route.matched[1];
     if (rows.length === 1) {
         const [firstRow] = rows;
-        await router.push({ path: `/${module.name}/${firstRow.id}` });
+        await router.push({ path: `${module.path}/${firstRow.id}` });
     } else if (route.matched.length > 3) {
-        await router.push({ path: `/${module.name}` });
+        await router.push({ path: `/${module.path}` });
         arrayData.updateStateParams();
     }
 }
diff --git a/src/composables/downloadFile.js b/src/composables/downloadFile.js
new file mode 100644
index 000000000..877d2a254
--- /dev/null
+++ b/src/composables/downloadFile.js
@@ -0,0 +1,11 @@
+import { useSession } from 'src/composables/useSession';
+import { getUrl } from './getUrl';
+
+const session = useSession();
+const token = session.getToken();
+
+export async function downloadFile(dmsId) {
+    let appUrl = await getUrl('', 'lilium');
+    appUrl = appUrl.replace('/#/', '');
+    window.open(`${appUrl}/api/dms/${dmsId}/downloadFile?access_token=${token}`);
+}
diff --git a/src/composables/getUrl.js b/src/composables/getUrl.js
index f2bd9ddb9..1e6aec4c6 100644
--- a/src/composables/getUrl.js
+++ b/src/composables/getUrl.js
@@ -1,11 +1,10 @@
 import axios from 'axios';
 
-export async function getUrl(route, appName = 'salix') {
-    const filter = {
-        where: { and: [{ appName: appName }, { environment: process.env.NODE_ENV }] },
-    };
+export async function getUrl(route, app = 'salix') {
+    let url;
 
-    const { data } = await axios.get('Urls/findOne', { params: { filter } });
-    const url = data.url;
-    return route ? url + route : url;
+    await axios.get('Urls/getUrl', { params: { app } }).then((res) => {
+        url = res.data + route;
+    });
+    return url;
 }
diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 948332d46..b3fb32d9b 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -390,6 +390,71 @@ export default {
             totalWithVat: 'Amount',
         },
     },
+    invoiceIn: {
+        pageTitles: {
+            invoiceIns: 'Invoices In',
+            list: 'List',
+            createInvoiceIn: 'Create invoice in',
+            summary: 'Summary',
+            basicData: 'Basic Data',
+            vat: 'VAT',
+            dueDay: 'Due day',
+            intrastat: 'Intrastat',
+            log: 'Logs',
+        },
+        list: {
+            ref: 'Reference',
+            supplier: 'Supplier',
+            supplierRef: 'Supplier ref.',
+            serialNumber: 'Serial number',
+            serial: 'Serial',
+            file: 'File',
+            issued: 'Issued',
+            isBooked: 'Is booked',
+            awb: 'AWB',
+            amount: 'Amount',
+        },
+        card: {
+            issued: 'Issued',
+            amount: 'Amount',
+            client: 'Client',
+            company: 'Company',
+            customerCard: 'Customer card',
+            ticketList: 'Ticket List',
+            vat: 'Vat',
+            dueDay: 'Due day',
+            intrastat: 'Intrastat',
+        },
+        summary: {
+            supplier: 'Supplier',
+            supplierRef: 'Supplier ref.',
+            currency: 'Currency',
+            docNumber: 'Doc number',
+            issued: 'Expedition date',
+            operated: 'Operation date',
+            bookEntried: 'Entry date',
+            bookedDate: 'Booked date',
+            sage: 'Sage withholding',
+            vat: 'Undeductible VAT',
+            company: 'Company',
+            booked: 'Booked',
+            expense: 'Expense',
+            taxableBase: 'Taxable base',
+            rate: 'Rate',
+            sageVat: 'Sage vat',
+            sageTransaction: 'Sage transaction',
+            dueDay: 'Date',
+            bank: 'Bank',
+            amount: 'Amount',
+            foreignValue: 'Foreign value',
+            dueTotal: 'Due day',
+            noMatch: 'Do not match',
+            code: 'Code',
+            net: 'Net',
+            stems: 'Stems',
+            country: 'Country',
+        },
+    },
     worker: {
         pageTitles: {
             workers: 'Workers',
@@ -514,6 +579,7 @@ export default {
             openCard: 'View card',
             openSummary: 'Open summary',
             viewDescription: 'View description',
+            downloadFile: 'Download file',
         },
         cardDescriptor: {
             mainList: 'Main list',
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index 9b452ab22..b7dc1c132 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -390,6 +390,69 @@ export default {
             totalWithVat: 'Importe',
         },
     },
+    invoiceIn: {
+        pageTitles: {
+            invoiceIns: 'Fact. recibidas',
+            list: 'Listado',
+            createInvoiceOut: 'Crear fact. recibida',
+            summary: 'Resumen',
+            basicData: 'Datos básicos',
+            vat: 'IVA',
+            dueDay: 'Vencimiento',
+            intrastat: 'Intrastat',
+            log: 'Registros de auditoría',
+        },
+        list: {
+            ref: 'Referencia',
+            supplier: 'Proveedor',
+            supplierRef: 'Ref. proveedor',
+            serialNumber: 'Num. serie',
+            shortIssued: 'F. emisión',
+            serial: 'Serie',
+            file: 'Fichero',
+            issued: 'Fecha emisión',
+            isBooked: 'Conciliada',
+            awb: 'AWB',
+            amount: 'Importe',
+        },
+        card: {
+            issued: 'Fecha emisión',
+            amount: 'Importe',
+            client: 'Cliente',
+            company: 'Empresa',
+            customerCard: 'Ficha del cliente',
+            ticketList: 'Listado de tickets',
+            vat: 'Vat',
+            dueDay: 'Fecha de vencimiento',
+        },
+        summary: {
+            supplier: 'Supplier',
+            supplierRef: 'Supplier ref.',
+            currency: 'Divisa',
+            docNumber: 'Número documento',
+            issued: 'Fecha de expedición',
+            operated: 'Fecha operación',
+            bookEntried: 'Fecha asiento',
+            bookedDate: 'Fecha contable',
+            sage: 'Retención sage',
+            vat: 'Iva no deducible',
+            company: 'Empresa',
+            booked: 'Contabilizada',
+            expense: 'Gasto',
+            taxableBase: 'Base imp.',
+            rate: 'Tasa',
+            sageTransaction: 'Sage transación',
+            dueDay: 'Fecha',
+            bank: 'Caja',
+            amount: 'Importe',
+            foreignValue: 'Divisa',
+            dueTotal: 'Vencimiento',
+            code: 'Código',
+            net: 'Neto',
+            stems: 'Tallos',
+            country: 'País',
+        },
+    },
     worker: {
         pageTitles: {
             workers: 'Trabajadores',
@@ -514,6 +577,7 @@ export default {
             openCard: 'Ver ficha',
             openSummary: 'Abrir detalles',
             viewDescription: 'Ver descripción',
+            downloadFile: 'Descargar archivo',
         },
         cardDescriptor: {
             mainList: 'Listado principal',
diff --git a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
new file mode 100644
index 000000000..3edfab0d6
--- /dev/null
+++ b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
@@ -0,0 +1,742 @@
+<script setup>
+import { ref, computed } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
+import { useArrayData } from 'src/composables/useArrayData';
+
+import { downloadFile } from 'src/composables/downloadFile';
+import FetchData from 'src/components/FetchData.vue';
+import FormModel from 'components/FormModel.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+import axios from 'axios';
+
+const quasar = useQuasar();
+const route = useRoute();
+const { t } = useI18n();
+
+const dms = ref({});
+const editDownloadDisabled = ref(false);
+const arrayData = useArrayData('InvoiceIn');
+const invoiceIn = computed(() => arrayData.store.data);
+const userConfig = ref(null);
+
+const suppliers = ref([]);
+const suppliersRef = ref();
+const currencies = ref([]);
+const currenciesRef = ref();
+const companies = ref([]);
+const companiesRef = ref();
+const dmsTypes = ref([]);
+const dmsTypesRef = ref();
+const warehouses = ref([]);
+const warehousesRef = ref();
+const allowTypesRef = ref();
+const allowedContentTypes = ref([]);
+const inputFileRef = ref();
+const editDmsRef = ref();
+const createDmsRef = ref();
+
+async function checkFileExists(dmsId) {
+    if (!dmsId) return;
+    try {
+        await axios.get(`Dms/${dmsId}`, { fields: ['id'] });
+        editDownloadDisabled.value = false;
+    } catch (e) {
+        editDownloadDisabled.value = true;
+    }
+}
+
+async function setEditDms(dmsId) {
+    const { data } = await axios.get(`Dms/${dmsId}`);
+    dms.value = {
+        id: data.id,
+        warehouseId: data.warehouseFk,
+        companyId: data.companyFk,
+        dmsTypeId: data.dmsTypeFk,
+        reference: data.reference,
+        description: data.description,
+        hasFile: data.hasFile,
+        hasFileAttached: data.hasFileAttached,
+    };
+
+    if (!allowedContentTypes.value.length) await allowTypesRef.value.fetch();
+
+    editDmsRef.value.show();
+}
+
+async function setCreateDms() {
+    const { data } = await axios.get('DmsTypes/findOne', {
+        where: { code: 'invoiceIn' },
+    });
+    dms.value = {
+        reference: invoiceIn.value.supplierRef,
+        warehouseId: userConfig.value.warehouseFk,
+        companyId: userConfig.value.companyFk,
+        dmsTypeId: data.id,
+        description: invoiceIn.value.supplier.name,
+        hasFile: true,
+        hasFileAttached: true,
+        files: null,
+    };
+
+    createDmsRef.value.show();
+}
+
+async function edit() {
+    try {
+        if (!dms.value.companyId) throw new Error(t(`The company can't be empty`));
+        if (!dms.value.warehouseId) throw new Error(t(`The warehouse can't be empty`));
+        if (!dms.value.dmsTypeId) throw new Error(t(`The DMS Type can't be empty`));
+        if (!dms.value.description) throw new Error(t(`The description can't be empty`));
+
+        const formData = new FormData();
+
+        if (dms.value.files) {
+            for (let i = 0; i < dms.value.files.length; i++)
+                formData.append(dms.value.files[i].name, dms.value.files[i]);
+            dms.value.hasFileAttached = true;
+        }
+
+        const { data } = await axios.post(`dms/${dms.value.id}/updateFile`, formData, {
+            params: dms.value,
+        });
+
+        if (data.length) invoiceIn.value.dmsFk = data[0].id;
+        editDmsRef.value.hide();
+
+        quasar.notify({
+            message: t('globals.dataSaved'),
+            type: 'positive',
+        });
+    } catch (error) {
+        quasar.notify({
+            message: t(`${error}`),
+            type: 'negative',
+        });
+    }
+}
+
+async function create() {
+    try {
+        if (!dms.value.companyId) throw new Error(t(`The company can't be empty`));
+        if (!dms.value.warehouseId) throw new Error(t(`The warehouse can't be empty`));
+        if (!dms.value.dmsTypeId) throw new Error(t(`The DMS Type can't be empty`));
+        if (!dms.value.description) throw new Error(t(`The description can't be empty`));
+        if (!dms.value.files) throw new Error(t(`The files can't be empty`));
+
+        const formData = new FormData();
+
+        if (dms.value.files) {
+            for (let i = 0; i < dms.value.files.length; i++)
+                formData.append(dms.value.files[i].name, dms.value.files[i]);
+            dms.value.hasFileAttached = true;
+        }
+
+        const { data } = await axios.post('Dms/uploadFile', formData, {
+            params: dms.value,
+        });
+        if (data.length) invoiceIn.value.dmsFk = data[0].id;
+        editDmsRef.value.hide();
+
+        quasar.notify({
+            message: t('globals.dataSaved'),
+            type: 'positive',
+        });
+    } catch (error) {
+        quasar.notify({
+            message: t(`${error}`),
+            type: 'negative',
+        });
+    }
+}
+</script>
+<template>
+    <FetchData
+        ref="suppliersRef"
+        url="Suppliers"
+        :filter="{ fields: ['id', 'nickname'] }"
+        limit="30"
+        @on-fetch="(data) => (suppliers = data)"
+    />
+    <FetchData
+        ref="currenciesRef"
+        url="Currencies"
+        :filter="{ fields: ['id', 'code'] }"
+        order="code"
+        @on-fetch="(data) => (currencies = data)"
+    />
+    <FetchData
+        ref="companiesRef"
+        url="Companies"
+        :filter="{ fields: ['id', 'code'] }"
+        order="code"
+        @on-fetch="(data) => (companies = data)"
+    />
+    <FetchData
+        ref="dmsTypesRef"
+        url="DmsTypes"
+        :filter="{ fields: ['id', 'name'] }"
+        order="name"
+        @on-fetch="(data) => (dmsTypes = data)"
+    />
+    <FetchData
+        ref="warehousesRef"
+        url="Warehouses"
+        :filter="{ fields: ['id', 'name'] }"
+        order="name"
+        @on-fetch="(data) => (warehouses = data)"
+    />
+    <FetchData
+        ref="allowTypesRef"
+        url="DmsContainers/allowedContentTypes"
+        @on-fetch="(data) => (allowedContentTypes = data)"
+    />
+    <FetchData
+        url="UserConfigs/getUserConfig"
+        @on-fetch="(data) => (userConfig = data)"
+        auto-load
+    />
+    <div class="column items-center">
+        <QCard>
+            <FormModel
+                v-if="invoiceIn"
+                :url="`InvoiceIns/${route.params.id}`"
+                model="invoiceIn"
+            >
+                <template #form="{ data }">
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <VnSelectFilter
+                                v-if="suppliersRef"
+                                :label="t('supplierFk')"
+                                v-model="data.supplierFk"
+                                :options="suppliers"
+                                option-value="id"
+                                option-label="nickname"
+                                @input-value="suppliersRef.fetch()"
+                            >
+                                <template #option="scope">
+                                    <QItem v-bind="scope.itemProps">
+                                        <QItemSection>
+                                            <QItemLabel>{{
+                                                `${scope.opt.id} - ${scope.opt.nickname}`
+                                            }}</QItemLabel>
+                                        </QItemSection>
+                                    </QItem>
+                                </template>
+                            </VnSelectFilter>
+                        </div>
+                        <div class="col">
+                            <QInput
+                                clearable
+                                clear-icon="close"
+                                :label="t('Supplier ref')"
+                                v-model="data.supplierRef"
+                            />
+                        </div>
+                    </div>
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <QInput :label="t('Expedition date')" v-model="data.issued">
+                                <template #append>
+                                    <QIcon
+                                        name="event"
+                                        class="cursor-pointer"
+                                        mask="####-##-##"
+                                        fill-mask="_"
+                                    >
+                                        <QPopupProxy
+                                            cover
+                                            transition-show="scale"
+                                            transition-hide="scale"
+                                        >
+                                            <QDate v-model="data.issued">
+                                                <div class="row items-center justify-end">
+                                                    <QBtn
+                                                        v-close-popup
+                                                        label="Close"
+                                                        color="primary"
+                                                        flat
+                                                    />
+                                                </div>
+                                            </QDate>
+                                        </QPopupProxy>
+                                    </QIcon>
+                                </template>
+                            </QInput>
+                        </div>
+                        <div class="col">
+                            <QInput
+                                :label="t('Operation date')"
+                                v-model="data.operated"
+                                mask="####-##-##"
+                                fill-mask="_"
+                                autofocus
+                            >
+                                <template #append>
+                                    <QIcon name="event" class="cursor-pointer">
+                                        <QPopupProxy
+                                            cover
+                                            transition-show="scale"
+                                            transition-hide="scale"
+                                        >
+                                            <QDate
+                                                v-model="data.operated"
+                                                mask="YYYY-MM-DD"
+                                            >
+                                                <div class="row items-center justify-end">
+                                                    <QBtn
+                                                        v-close-popup
+                                                        label="Close"
+                                                        color="primary"
+                                                        flat
+                                                    />
+                                                </div>
+                                            </QDate>
+                                        </QPopupProxy>
+                                    </QIcon>
+                                </template>
+                            </QInput>
+                        </div>
+                    </div>
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <QInput
+                                :label="t('Undeductible VAT')"
+                                v-model="data.deductibleExpenseFk"
+                                clearable
+                                clear-icon="close"
+                            />
+                        </div>
+                        <div class="col">
+                            <QInput
+                                :label="t('Document')"
+                                v-model="data.dmsFk"
+                                clearable
+                                clear-icon="close"
+                                @update:model-value="checkFileExists(data.dmsFk)"
+                            >
+                                <template #prepend>
+                                    <QBtn
+                                        v-if="data.dmsFk"
+                                        :class="{
+                                            'no-pointer-events': editDownloadDisabled,
+                                        }"
+                                        :disable="editDownloadDisabled"
+                                        icon="cloud_download"
+                                        :title="t('Download file')"
+                                        padding="xs"
+                                        round
+                                        @click="downloadFile(data.dmsFk)"
+                                    />
+                                </template>
+                                <template #append>
+                                    <QBtn
+                                        :class="{
+                                            'no-pointer-events': editDownloadDisabled,
+                                        }"
+                                        :disable="editDownloadDisabled"
+                                        v-if="data.dmsFk"
+                                        icon="edit"
+                                        round
+                                        padding="xs"
+                                        @click="setEditDms(data.dmsFk)"
+                                    >
+                                        <QTooltip>{{ t('Edit document') }}</QTooltip>
+                                    </QBtn>
+                                    <QBtn
+                                        v-else
+                                        icon="add_circle"
+                                        round
+                                        padding="xs"
+                                        @click="setCreateDms()"
+                                    >
+                                        <QTooltip>{{ t('Create document') }}</QTooltip>
+                                    </QBtn>
+                                </template>
+                            </QInput>
+                        </div>
+                    </div>
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <QInput
+                                :label="t('Entry date')"
+                                v-model="data.bookEntried"
+                                clearable
+                                clear-icon="close"
+                                mask="####-##-##"
+                                fill-mask="_"
+                            >
+                                <template #append>
+                                    <QIcon name="event" class="cursor-pointer">
+                                        <QPopupProxy
+                                            cover
+                                            transition-show="scale"
+                                            transition-hide="scale"
+                                        >
+                                            <QDate
+                                                v-model="data.bookEntried"
+                                                mask="YYYY-MM-DD"
+                                            >
+                                                <div class="row items-center justify-end">
+                                                    <QBtn
+                                                        v-close-popup
+                                                        label="Close"
+                                                        color="primary"
+                                                        flat
+                                                    />
+                                                </div>
+                                            </QDate>
+                                        </QPopupProxy>
+                                    </QIcon>
+                                </template>
+                            </QInput>
+                        </div>
+                        <div class="col">
+                            <QInput
+                                :label="t('Accounted date')"
+                                v-model="data.booked"
+                                clearable
+                                clear-icon="close"
+                                mask="####-##-##"
+                                fill-mask="_"
+                            >
+                                <template #append>
+                                    <QIcon name="event" class="cursor-pointer">
+                                        <QPopupProxy
+                                            cover
+                                            transition-show="scale"
+                                            transition-hide="scale"
+                                        >
+                                            <QDate
+                                                v-model="data.booked"
+                                                mask="YYYY-MM-DD"
+                                            >
+                                                <div class="row items-center justify-end">
+                                                    <QBtn
+                                                        v-close-popup
+                                                        label="Close"
+                                                        color="primary"
+                                                        flat
+                                                    />
+                                                </div>
+                                            </QDate>
+                                        </QPopupProxy>
+                                    </QIcon>
+                                </template>
+                            </QInput>
+                        </div>
+                    </div>
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <VnSelectFilter
+                                v-if="currenciesRef"
+                                :label="t('Currency')"
+                                v-model="data.currencyFk"
+                                :options="currencies"
+                                option-value="id"
+                                option-label="code"
+                                @input-value="currenciesRef.fetch()"
+                            />
+                        </div>
+                        <div class="col">
+                            <VnSelectFilter
+                                v-if="companiesRef"
+                                :label="t('Company')"
+                                v-model="data.companyFk"
+                                :options="companies"
+                                option-value="id"
+                                option-label="code"
+                                @input-value="companiesRef.fetch()"
+                            />
+                        </div>
+                    </div>
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <QCheckbox
+                                :label="t('invoiceIn.summary.booked')"
+                                v-model="data.isBooked"
+                            />
+                        </div>
+                        <div class="col"></div>
+                    </div>
+                </template>
+            </FormModel>
+        </QCard>
+    </div>
+    <QDialog ref="editDmsRef">
+        <QCard>
+            <QCardSection class="q-pb-none">
+                <QItem class="q-px-none">
+                    <span class="text-primary text-h6 full-width">
+                        <QIcon name="edit" class="q-mr-xs" />
+                        {{ t('Edit document') }}
+                    </span>
+                    <QBtn icon="close" flat round dense v-close-popup />
+                </QItem>
+            </QCardSection>
+            <QCardSection class="q-py-none">
+                <QItem>
+                    <QInput
+                        class="full-width q-pa-xs"
+                        :label="t('Reference')"
+                        v-model="dms.reference"
+                    />
+                    <VnSelectFilter
+                        class="full-width q-pa-xs"
+                        :label="`${t('Company')}*`"
+                        v-model="dms.companyId"
+                        :options="companies"
+                        option-value="id"
+                        option-label="code"
+                        @input-value="companiesRef.fetch()"
+                        :rules="[(val) => val || t('Required field')]"
+                    />
+                </QItem>
+                <QItem>
+                    <VnSelectFilter
+                        class="full-width q-pa-xs"
+                        :label="`${t('Warehouse')}*`"
+                        v-model="dms.warehouseId"
+                        :options="warehouses"
+                        option-value="id"
+                        option-label="name"
+                        @input-value="warehousesRef.fetch()"
+                        :rules="[(val) => val || t('Required field')]"
+                    />
+                    <VnSelectFilter
+                        class="full-width q-pa-xs"
+                        :label="`${t('Type')}*`"
+                        v-model="dms.dmsTypeId"
+                        :options="dmsTypes"
+                        option-value="id"
+                        option-label="name"
+                        @input-value="dmsTypesRef.fetch()"
+                        :rules="[(val) => val || t('Required field')]"
+                    />
+                </QItem>
+                <QItem>
+                    <QInput
+                        class="full-width q-pa-xs"
+                        type="textarea"
+                        size="lg"
+                        autogrow
+                        :label="`${t('Description')}*`"
+                        v-model="dms.description"
+                        clearable
+                        clear-icon="close"
+                        :rules="[(val) => val.length || t('Required field')]"
+                    />
+                </QItem>
+                <QItem>
+                    <QFile
+                        ref="inputFileRef"
+                        class="full-width q-pa-xs"
+                        :label="t('File')"
+                        v-model="dms.files"
+                        multiple
+                        :accept="allowedContentTypes.join(',')"
+                        clearable
+                        clear-icon="close"
+                    >
+                        <template #append>
+                            <QBtn
+                                icon="attach_file_add"
+                                flat
+                                round
+                                padding="xs"
+                                @click="inputFileRef.pickFiles()"
+                            >
+                                <QTooltip>
+                                    {{ t('Select a file') }}
+                                </QTooltip>
+                            </QBtn>
+                            <QBtn icon="info" flat round padding="xs">
+                                <QTooltip max-width="30rem">
+                                    {{
+                                        `${t(
+                                            'Allowed content types'
+                                        )}: ${allowedContentTypes.join(', ')}`
+                                    }}
+                                </QTooltip>
+                            </QBtn>
+                        </template>
+                    </QFile>
+                </QItem>
+                <QItem>
+                    <QCheckbox
+                        :label="t('Generate identifier for original file')"
+                        v-model="dms.hasFile"
+                    />
+                </QItem>
+            </QCardSection>
+            <QCardActions class="justify-end">
+                <QBtn flat :label="t('globals.close')" color="primary" v-close-popup />
+                <QBtn :label="t('globals.save')" color="primary" @click="edit" />
+            </QCardActions>
+        </QCard>
+    </QDialog>
+    <QDialog ref="createDmsRef">
+        <QCard>
+            <QCardSection class="q-pb-none">
+                <QItem>
+                    <span class="text-primary text-h6 full-width">
+                        <QIcon name="edit" class="q-mr-xs" />
+                        {{ t('Create document') }}
+                    </span>
+                    <QBtn icon="close" flat round dense v-close-popup align="right" />
+                </QItem>
+            </QCardSection>
+            <QCardSection class="q-pb-none">
+                <QItem>
+                    <QInput
+                        class="full-width q-pa-xs"
+                        :label="t('Reference')"
+                        v-model="dms.reference"
+                    />
+                    <VnSelectFilter
+                        class="full-width q-pa-xs"
+                        :label="`${t('Company')}*`"
+                        v-model="dms.companyId"
+                        :options="companies"
+                        option-value="id"
+                        option-label="code"
+                        @input-value="companiesRef.fetch()"
+                        :rules="[(val) => val || t('Required field')]"
+                    />
+                </QItem>
+                <QItem>
+                    <VnSelectFilter
+                        class="full-width q-pa-xs"
+                        :label="`${t('Warehouse')}*`"
+                        v-model="dms.warehouseId"
+                        :options="warehouses"
+                        option-value="id"
+                        option-label="name"
+                        @input-value="warehousesRef.fetch()"
+                        :rules="[(val) => val || t('Required field')]"
+                    />
+                    <VnSelectFilter
+                        class="full-width q-pa-xs"
+                        :label="`${t('Type')}*`"
+                        v-model="dms.dmsTypeId"
+                        :options="dmsTypes"
+                        option-value="id"
+                        option-label="name"
+                        @input-value="dmsTypesRef.fetch()"
+                        :rules="[(val) => val || t('Required field')]"
+                    />
+                </QItem>
+                <QItem>
+                    <QInput
+                        class="full-width q-pa-xs"
+                        type="textarea"
+                        size="lg"
+                        autogrow
+                        :label="`${t('Description')}*`"
+                        v-model="dms.description"
+                        clearable
+                        clear-icon="close"
+                        :rules="[(val) => val.length || t('Required field')]"
+                    />
+                </QItem>
+                <QItem>
+                    <QFile
+                        ref="inputFileRef"
+                        class="full-width q-pa-xs"
+                        :label="t('File')"
+                        v-model="dms.files"
+                        multiple
+                        :accept="allowedContentTypes.join(',')"
+                        clearable
+                        clear-icon="close"
+                    >
+                        <template #append>
+                            <QBtn
+                                icon="attach_file_add"
+                                flat
+                                round
+                                padding="xs"
+                                @click="inputFileRef.pickFiles()"
+                            >
+                                <QTooltip>
+                                    {{ t('Select a file') }}
+                                </QTooltip>
+                            </QBtn>
+                            <QBtn icon="info" flat round padding="xs">
+                                <QTooltip max-width="30rem">
+                                    {{
+                                        `${t(
+                                            'Allowed content types'
+                                        )}: ${allowedContentTypes.join(', ')}`
+                                    }}
+                                </QTooltip>
+                            </QBtn>
+                        </template>
+                    </QFile>
+                </QItem>
+                <QItem>
+                    <QCheckbox
+                        :label="t('Generate identifier for original file')"
+                        v-model="dms.hasFile"
+                    />
+                </QItem>
+            </QCardSection>
+            <QCardActions align="right">
+                <QBtn flat :label="t('globals.close')" color="primary" v-close-popup />
+                <QBtn :label="t('globals.save')" color="primary" @click="create()" />
+            </QCardActions>
+        </QCard>
+    </QDialog>
+</template>
+<style lang="scss" scoped>
+.column {
+    .q-card {
+        width: 100%;
+        max-width: 60em;
+    }
+}
+@media (max-width: $breakpoint-xs) {
+    .q-dialog {
+        .q-card {
+            &__section:not(:first-child) {
+                .q-item {
+                    flex-direction: column;
+                }
+            }
+        }
+    }
+}
+</style>
+<i18n>
+    en:
+        supplierFk: Supplier
+    es:
+        supplierFk: Proveedor
+        Supplier Ref: Ref. proveedor
+        Expedition date: Fecha expedición
+        Operation date: Fecha operación
+        Undeductible VAT: Iva no deducible
+        Document: Documento
+        Download file: Descargar archivo
+        Entry date: Fecha asiento
+        Accounted date: Fecha contable
+        Currency: Moneda
+        Company: Empresa
+        Edit document: Editar documento
+        Reference: Referencia
+        Type: Tipo
+        Description: Descripción
+        Generate identifier for original file: Generar identificador para archivo original
+        Required field: Campo obligatorio
+        File: Fichero
+        Create document: Crear documento
+        Select a file: Seleccione un fichero
+        Allowed content types: Tipos de archivo permitidos
+        The company can't be empty: La empresa no puede estar vacía
+        The warehouse can't be empty: El almacén no puede estar vacío
+        The DMS Type can't be empty: El dms no puede estar vacío
+        The description can't be empty: La descripción no puede estar vacía
+        The files can't be empty: Los archivos no pueden estar vacíos
+</i18n>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInCard.vue b/src/pages/InvoiceIn/Card/InvoiceInCard.vue
new file mode 100644
index 000000000..4d06cb41e
--- /dev/null
+++ b/src/pages/InvoiceIn/Card/InvoiceInCard.vue
@@ -0,0 +1,91 @@
+<script setup>
+import { useI18n } from 'vue-i18n';
+import { useStateStore } from 'stores/useStateStore';
+import InvoiceInDescriptor from './InvoiceInDescriptor.vue';
+import LeftMenu from 'components/LeftMenu.vue';
+import VnSearchbar from 'components/ui/VnSearchbar.vue';
+import { useArrayData } from 'src/composables/useArrayData';
+import { onMounted, watch } from 'vue';
+import { useRoute } from 'vue-router';
+
+const stateStore = useStateStore();
+const { t } = useI18n();
+const route = useRoute();
+
+const filter = {
+    include: [
+        {
+            relation: 'supplier',
+            scope: {
+                include: {
+                    relation: 'contacts',
+                    scope: {
+                        where: {
+                            email: { neq: null },
+                        },
+                    },
+                },
+            },
+        },
+        {
+            relation: 'invoiceInDueDay',
+        },
+        {
+            relation: 'company',
+        },
+        {
+            relation: 'currency',
+        },
+    ],
+};
+const arrayData = useArrayData('InvoiceIn', {
+    url: `InvoiceIns/${route.params.id}`,
+    filter,
+});
+
+onMounted(async () => {
+    await arrayData.fetch({ append: false });
+    watch(
+        () => route.params.id,
+        async (newId, oldId) => {
+            if (newId) {
+                arrayData.store.url = `InvoiceIns/${newId}`;
+                await arrayData.fetch({ append: false });
+            }
+        }
+    );
+});
+</script>
+<template>
+    <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
+        <VnSearchbar
+            data-key="InvoiceInList"
+            url="InvoiceIns/filter"
+            :label="t('Search invoice')"
+            :info="t('You can search by invoice reference')"
+        />
+    </Teleport>
+    <QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
+        <QScrollArea class="fit">
+            <InvoiceInDescriptor />
+            <QSeparator />
+            <LeftMenu source="card" />
+        </QScrollArea>
+    </QDrawer>
+    <QPageContainer>
+        <QPage>
+            <QToolbar class="bg-vn-dark justify-end">
+                <div id="st-data"></div>
+                <QSpace />
+                <div id="st-actions"></div>
+            </QToolbar>
+            <div class="q-pa-md"><RouterView></RouterView></div>
+        </QPage>
+    </QPageContainer>
+</template>
+
+<i18n>
+    es:
+        Search invoice: Buscar factura emitida
+        You can search by invoice reference: Puedes buscar por referencia de la factura
+    </i18n>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
new file mode 100644
index 000000000..f37852fbd
--- /dev/null
+++ b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
@@ -0,0 +1,108 @@
+<script setup>
+import { ref, computed } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+import { toCurrency, toDate } from 'src/filters';
+import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import VnLv from 'src/components/ui/VnLv.vue';
+import useCardDescription from 'src/composables/useCardDescription';
+import FetchData from 'src/components/FetchData.vue';
+
+const $props = defineProps({
+    id: {
+        type: Number,
+        required: false,
+        default: null,
+    },
+});
+
+const route = useRoute();
+const { t } = useI18n();
+
+const entityId = computed(() => {
+    return $props.id || route.params.id;
+});
+const totalAmount = ref([]);
+// Cuando Carlossa acabe de crear la lógica de card, usar store arrayData en lugar de hacer el fetch en el descriptor
+const filter = {
+    include: [
+        {
+            relation: 'supplier',
+            scope: {
+                include: {
+                    relation: 'contacts',
+                    scope: {
+                        where: {
+                            email: { neq: null },
+                        },
+                    },
+                },
+            },
+        },
+        {
+            relation: 'invoiceInDueDay',
+        },
+        {
+            relation: 'company',
+        },
+        {
+            relation: 'currency',
+        },
+    ],
+};
+
+const data = ref(useCardDescription());
+function setData(entity) {
+    data.value = useCardDescription(entity.supplierRef, entity.id);
+}
+</script>
+
+<template>
+    <!--Refactor para añadir en el arrayData-->
+    <FetchData
+        :url="`InvoiceIns/${entityId}/getTotals`"
+        @on-fetch="
+            (data) => {
+                totalAmount = data.totalDueDay;
+            }
+        "
+        auto-load
+    />
+    <CardDescriptor
+        module="InvoiceIn"
+        :url="`InvoiceIns/${entityId}`"
+        :filter="filter"
+        :title="data.title"
+        :subtitle="data.subtitle"
+        @on-fetch="setData"
+    >
+        <template #body="{ entity }">
+            <VnLv :label="t('invoiceIn.card.issued')" :value="toDate(entity.issued)" />
+            <VnLv :label="t('invoiceIn.summary.booked')" :value="toDate(entity.booked)" />
+            <VnLv :label="t('invoiceIn.card.amount')" :value="toCurrency(totalAmount)" />
+            <VnLv
+                :label="t('invoiceIn.summary.supplier')"
+                :value="entity.supplier?.nickname"
+            />
+        </template>
+        <template #actions="{ entity }">
+            <QCardActions>
+                <!--Sección proveedores no disponible-->
+                <!--Sección entradas no disponible-->
+                <QBtn
+                    size="md"
+                    icon="vn:ticket"
+                    color="primary"
+                    :to="{
+                        name: 'InvoiceInList',
+                        query: {
+                            params: JSON.stringify({ supplierFk: entity.supplierFk }),
+                        },
+                    }"
+                >
+                    <QTooltip>{{ t('invoiceOut.card.ticketList') }}</QTooltip>
+                </QBtn>
+            </QCardActions>
+        </template>
+    </CardDescriptor>
+</template>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
new file mode 100644
index 000000000..d657b09d0
--- /dev/null
+++ b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
@@ -0,0 +1,290 @@
+<script setup>
+import { ref, computed } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+import { toDate } from 'src/filters';
+import { useArrayData } from 'src/composables/useArrayData';
+import CrudModel from 'src/components/CrudModel.vue';
+import FetchData from 'src/components/FetchData.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+
+const route = useRoute();
+const { t } = useI18n();
+const arrayData = useArrayData('InvoiceIn');
+const invoiceIn = computed(() => arrayData.store.data);
+
+const rowsSelected = ref([]);
+const banks = ref([]);
+const invoiceInFormRef = ref();
+
+const filter = {
+    where: {
+        invoiceInFk: route.params.id,
+    },
+};
+
+const isNotEuro = (code) => code != 'EUR';
+
+const columns = computed(() => [
+    {
+        name: 'duedate',
+        label: t('Date'),
+        field: (row) => toDate(row.dueDated),
+        sortable: true,
+        tabIndex: 1,
+        align: 'left',
+    },
+    {
+        name: 'bank',
+        label: t('Bank'),
+        field: (row) => row.bankFk,
+        options: banks.value,
+        model: 'bankFk',
+        optionValue: 'id',
+        optionLabel: 'bank',
+        sortable: true,
+        tabIndex: 2,
+        align: 'left',
+    },
+    {
+        name: 'amount',
+        label: t('Amount'),
+        field: (row) => row.amount,
+        sortable: true,
+        tabIndex: 3,
+        align: 'left',
+    },
+    {
+        name: 'foreignvalue',
+        label: t('Foreign value'),
+        field: (row) => row.foreignValue,
+        sortable: true,
+        tabIndex: 4,
+        align: 'left',
+    },
+]);
+</script>
+<template>
+    <FetchData url="Banks" auto-load limit="30" @on-fetch="(data) => (banks = data)" />
+    <CrudModel
+        v-if="invoiceIn"
+        ref="invoiceInFormRef"
+        data-key="InvoiceInDueDays"
+        url="InvoiceInDueDays"
+        :filter="filter"
+        auto-load
+        :data-required="{ invoiceInFk: route.params.id }"
+        v-model:selected="rowsSelected"
+    >
+        <template #body="{ rows }">
+            <QTable
+                v-model:selected="rowsSelected"
+                selection="multiple"
+                :columns="columns"
+                :rows="rows"
+                row-key="$index"
+                hide-pagination
+                :grid="$q.screen.lt.sm"
+            >
+                <template #body-cell-duedate="{ row }">
+                    <QTd>
+                        <QInput
+                            v-model="row.dueDated"
+                            mask="date"
+                            placeholder="yyyy/mm/dd"
+                            clearable
+                            clear-icon="close"
+                        >
+                            <template #append>
+                                <QIcon name="event" class="cursor-pointer">
+                                    <QPopupProxy
+                                        cover
+                                        transition-show="scale"
+                                        transition-hide="scale"
+                                    >
+                                        <QDate v-model="row.dueDated" landscape>
+                                            <div
+                                                class="row items-center justify-end q-gutter-sm"
+                                            >
+                                                <QBtn
+                                                    :label="t('globals.cancel')"
+                                                    color="primary"
+                                                    flat
+                                                    v-close-popup
+                                                />
+                                                <QBtn
+                                                    :label="t('globals.confirm')"
+                                                    color="primary"
+                                                    flat
+                                                    v-close-popup
+                                                />
+                                            </div>
+                                        </QDate>
+                                    </QPopupProxy>
+                                </QIcon>
+                            </template>
+                        </QInput>
+                    </QTd>
+                </template>
+                <template #body-cell-bank="{ row, col }">
+                    <QTd>
+                        <VnSelectFilter
+                            v-model="row[col.model]"
+                            :options="col.options"
+                            :option-value="col.optionValue"
+                            :option-label="col.optionLabel"
+                        >
+                            <template #option="scope">
+                                <QItem v-bind="scope.itemProps">
+                                    <QItemSection>
+                                        <QItemLabel>{{
+                                            `${scope.opt.id}: ${scope.opt.bank}`
+                                        }}</QItemLabel>
+                                    </QItemSection>
+                                </QItem>
+                            </template>
+                        </VnSelectFilter>
+                    </QTd>
+                </template>
+                <template #body-cell-amount="{ row }">
+                    <QTd>
+                        <QInput v-model="row.amount" clearable clear-icon="close" />
+                    </QTd>
+                </template>
+                <template #body-cell-foreignvalue="{ row }">
+                    <QTd>
+                        <QInput
+                            :class="{
+                                'no-pointer-events': !isNotEuro(invoiceIn.currency.code),
+                            }"
+                            :disable="!isNotEuro(invoiceIn.currency.code)"
+                            v-model="row.foreignValue"
+                            clearable
+                            clear-icon="close"
+                        />
+                    </QTd>
+                </template>
+                <template #item="props">
+                    <div class="q-pa-xs col-xs-12 col-sm-6 grid-style-transition">
+                        <QCard>
+                            <QCardSection>
+                                <QCheckbox v-model="props.selected" dense />
+                            </QCardSection>
+                            <QSeparator />
+                            <QList>
+                                <QItem>
+                                    <QInput
+                                        class="full-width"
+                                        :label="t('Date')"
+                                        v-model="props.row.dueDated"
+                                        mask="date"
+                                        placeholder="yyyy/mm/dd"
+                                        clearable
+                                        clear-icon="close"
+                                    >
+                                        <template #append>
+                                            <QIcon name="event" class="cursor-pointer">
+                                                <QPopupProxy
+                                                    cover
+                                                    transition-show="scale"
+                                                    transition-hide="scale"
+                                                >
+                                                    <QDate
+                                                        v-model="props.row.dueDated"
+                                                        landscape
+                                                    >
+                                                        <div
+                                                            class="row items-center justify-end q-gutter-sm"
+                                                        >
+                                                            <QBtn
+                                                                :label="
+                                                                    t('globals.cancel')
+                                                                "
+                                                                color="primary"
+                                                                flat
+                                                                v-close-popup
+                                                            />
+                                                            <QBtn
+                                                                :label="
+                                                                    t('globals.confirm')
+                                                                "
+                                                                color="primary"
+                                                                flat
+                                                                v-close-popup
+                                                            />
+                                                        </div>
+                                                    </QDate>
+                                                </QPopupProxy>
+                                            </QIcon>
+                                        </template>
+                                    </QInput>
+                                </QItem>
+                                <QItem>
+                                    <VnSelectFilter
+                                        :label="t('Bank')"
+                                        class="full-width"
+                                        v-model="props.row['bankFk']"
+                                        :options="banks"
+                                        option-value="id"
+                                        option-label="bank"
+                                    >
+                                        <template #option="scope">
+                                            <QItem v-bind="scope.itemProps">
+                                                <QItemSection>
+                                                    <QItemLabel>{{
+                                                        `${scope.opt.id}: ${scope.opt.bank}`
+                                                    }}</QItemLabel>
+                                                </QItemSection>
+                                            </QItem>
+                                        </template>
+                                    </VnSelectFilter>
+                                </QItem>
+                                <QItem>
+                                    <QInput
+                                        :label="t('Amount')"
+                                        class="full-width"
+                                        v-model="props.row.amount"
+                                        clearable
+                                        clear-icon="close"
+                                    />
+                                </QItem>
+                                <QItem>
+                                    <QInput
+                                        :label="t('Foreign value')"
+                                        class="full-width"
+                                        :class="{
+                                            'no-pointer-events': !isNotEuro(
+                                                invoiceIn.currency.code
+                                            ),
+                                        }"
+                                        :disable="!isNotEuro(invoiceIn.currency.code)"
+                                        v-model="props.row.foreignValue"
+                                        clearable
+                                        clear-icon="close"
+                                    />
+                                </QItem>
+                            </QList>
+                        </QCard>
+                    </div>
+                </template>
+            </QTable>
+        </template>
+    </CrudModel>
+    <QPageSticky position="bottom-right" :offset="[25, 25]">
+        <QBtn
+            color="primary"
+            icon="add"
+            size="lg"
+            round
+            @click="invoiceInFormRef.insert()"
+        />
+    </QPageSticky>
+</template>
+<style lang="scss" scoped></style>
+<i18n>
+    es:
+        Date: Fecha
+        Bank: Caja
+        Amount: Importe
+        Foreign value: Divisa
+</i18n>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInIntrastat.vue b/src/pages/InvoiceIn/Card/InvoiceInIntrastat.vue
new file mode 100644
index 000000000..58f521534
--- /dev/null
+++ b/src/pages/InvoiceIn/Card/InvoiceInIntrastat.vue
@@ -0,0 +1,280 @@
+<script setup>
+import { computed, ref } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+import { toCurrency } from 'src/filters';
+import CrudModel from 'src/components/CrudModel.vue';
+import FetchData from 'src/components/FetchData.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+import VnLv from 'src/components/ui/VnLv.vue';
+
+const { t } = useI18n();
+const route = useRoute();
+
+const invoceInIntrastat = ref([]);
+const amountTotal = computed(() => getTotal('amount'));
+const netTotal = computed(() => getTotal('net'));
+const stemsTotal = computed(() => getTotal('stems'));
+const rowsSelected = ref([]);
+const countries = ref([]);
+const intrastats = ref([]);
+const invoiceInFormRef = ref();
+
+const filter = {
+    where: {
+        invoiceInFk: route.params.id,
+    },
+};
+
+const columns = computed(() => [
+    {
+        name: 'code',
+        label: t('Code'),
+        field: (row) => row.intrastatFk,
+        options: intrastats.value,
+        model: 'intrastatFk',
+        optionValue: 'id',
+        optionLabel: 'description',
+        sortable: true,
+        tabIndex: 1,
+        align: 'left',
+    },
+    {
+        name: 'amount',
+        label: t('amount'),
+        field: (row) => row.amount,
+        sortable: true,
+        tabIndex: 2,
+        align: 'left',
+    },
+    {
+        name: 'net',
+        label: t('net'),
+        field: (row) => row.net,
+        sortable: true,
+        tabIndex: 3,
+        align: 'left',
+    },
+    {
+        name: 'stems',
+        label: t('stems'),
+        field: (row) => row.stems,
+        sortable: true,
+        tabIndex: 4,
+        align: 'left',
+    },
+    {
+        name: 'country',
+        label: t('country'),
+        field: (row) => row.countryFk,
+        options: countries.value,
+        model: 'countryFk',
+        optionValue: 'id',
+        optionLabel: 'code',
+        sortable: true,
+        tabIndex: 5,
+        align: 'left',
+    },
+]);
+
+function getTotal(type) {
+    if (!invoceInIntrastat.value.length) return 0.0;
+    return invoceInIntrastat.value.reduce(
+        (total, intrastat) => total + intrastat[type],
+        0.0
+    );
+}
+</script>
+<template>
+    <FetchData
+        url="Countries"
+        auto-load
+        @on-fetch="(data) => (countries = data)"
+        sort-by="country"
+    />
+    <FetchData
+        url="Intrastats"
+        sort-by="id"
+        auto-load
+        @on-fetch="(data) => (intrastats = data)"
+    />
+    <div class="invoiceIn-intrastat">
+        <QCard v-if="invoceInIntrastat.length" class="full-width q-mb-md q-pa-sm">
+            <QItem class="justify-end">
+                <div>
+                    <QItemLabel>
+                        <VnLv
+                            :label="t('Total amount')"
+                            :value="toCurrency(amountTotal)"
+                        />
+                    </QItemLabel>
+                    <QItemLabel>
+                        <VnLv :label="t('Total net')" :value="netTotal" />
+                    </QItemLabel>
+                    <QItemLabel>
+                        <VnLv :label="t('Total stems')" :value="stemsTotal" />
+                    </QItemLabel>
+                </div>
+            </QItem>
+        </QCard>
+        <CrudModel
+            ref="invoiceInFormRef"
+            data-key="InvoiceInIntrastats"
+            url="InvoiceInIntrastats"
+            auto-load
+            :data-required="{ invoiceInFk: route.params.id }"
+            :filter="filter"
+            v-model:selected="rowsSelected"
+            @on-fetch="(data) => (invoceInIntrastat = data)"
+        >
+            <template #body="{ rows }">
+                <QTable
+                    v-model:selected="rowsSelected"
+                    selection="multiple"
+                    :columns="columns"
+                    :rows="rows"
+                    row-key="$index"
+                    hide-pagination
+                    :grid="$q.screen.lt.sm"
+                >
+                    <template #body-cell="{ row, col }">
+                        <QTd>
+                            <QInput
+                                v-model="row[col.name]"
+                                clearable
+                                clear-icon="close"
+                            />
+                        </QTd>
+                    </template>
+                    <template #body-cell-code="{ row, col }">
+                        <QTd>
+                            <VnSelectFilter
+                                v-model="row[col.model]"
+                                :options="col.options"
+                                option-value="id"
+                                option-label="description"
+                                :filter-options="['id', 'description']"
+                            >
+                                <template #option="scope">
+                                    <QItem v-bind="scope.itemProps">
+                                        {{ `${scope.opt.id}: ${scope.opt.description}` }}
+                                    </QItem>
+                                </template>
+                            </VnSelectFilter>
+                        </QTd>
+                    </template>
+                    <template #body-cell-country="{ row, col }">
+                        <QTd>
+                            <VnSelectFilter
+                                v-model="row[col.model]"
+                                :options="col.options"
+                                option-value="id"
+                                option-label="code"
+                            />
+                        </QTd>
+                    </template>
+                    <template #item="props">
+                        <div class="q-pa-xs col-xs-12 col-sm-6 grid-style-transition">
+                            <QCard>
+                                <QCardSection>
+                                    <QCheckbox v-model="props.selected" dense />
+                                </QCardSection>
+                                <QSeparator />
+                                <QList>
+                                    <QItem>
+                                        <VnSelectFilter
+                                            :label="t('code')"
+                                            class="full-width"
+                                            v-model="props.row['intrastatFk']"
+                                            :options="intrastats"
+                                            option-value="id"
+                                            option-label="description"
+                                            :filter-options="['id', 'description']"
+                                        >
+                                            <template #option="scope">
+                                                <QItem v-bind="scope.itemProps">
+                                                    {{
+                                                        `${scope.opt.id}: ${scope.opt.description}`
+                                                    }}
+                                                </QItem>
+                                            </template>
+                                        </VnSelectFilter>
+                                    </QItem>
+                                    <QItem
+                                        v-for="(value, index) of [
+                                            'amount',
+                                            'net',
+                                            'stems',
+                                        ]"
+                                        :key="index"
+                                    >
+                                        <QInput
+                                            :label="t(value)"
+                                            class="full-width"
+                                            v-model="props.row[value]"
+                                            clearable
+                                            clear-icon="close"
+                                        />
+                                    </QItem>
+                                    <QItem>
+                                        <VnSelectFilter
+                                            :label="t('country')"
+                                            class="full-width"
+                                            v-model="props.row['countryFk']"
+                                            :options="countries"
+                                            option-value="id"
+                                            option-label="code"
+                                        />
+                                    </QItem>
+                                </QList>
+                            </QCard>
+                        </div>
+                    </template>
+                </QTable>
+            </template>
+        </CrudModel>
+    </div>
+    <QPageSticky position="bottom-right" :offset="[25, 25]">
+        <QBtn
+            color="primary"
+            icon="add"
+            size="lg"
+            round
+            @click="invoiceInFormRef.insert()"
+        />
+    </QPageSticky>
+</template>
+<style lang="scss">
+.invoiceIn-intrastat {
+    > .q-card {
+        .vn-label-value {
+            display: flex;
+            gap: 1em;
+
+            .label {
+                flex: 1;
+            }
+            .value {
+                flex: 0.5;
+            }
+        }
+    }
+}
+</style>
+<style lang="scss" scoped></style>
+<i18n>
+    en:
+        amount: Amount
+        net: Net
+        stems: Stems
+        country: Country
+    es:
+        Code: Código
+        amount: Cantidad
+        net: Neto
+        stems: Tallos
+        country: País
+        Total amount: Total importe
+        Total net: Total neto
+        Total stems: Total tallos
+</i18n>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
new file mode 100644
index 000000000..79cdab02d
--- /dev/null
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -0,0 +1,409 @@
+<script setup>
+import { onMounted, ref, computed } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+import { toCurrency, toDate } from 'src/filters';
+import { getUrl } from 'src/composables/getUrl';
+import { downloadFile } from 'src/composables/downloadFile';
+
+import CardSummary from 'components/ui/CardSummary.vue';
+import VnLv from 'src/components/ui/VnLv.vue';
+
+onMounted(async () => {
+    salixUrl.value = await getUrl('');
+    invoiceInUrl.value = salixUrl.value + `invoiceIn/${entityId.value}/`;
+});
+
+const route = useRoute();
+const { t } = useI18n();
+
+const $props = defineProps({
+    id: {
+        type: Number,
+        default: 0,
+    },
+});
+
+const entityId = computed(() => $props.id || route.params.id);
+
+const salixUrl = ref();
+const invoiceInUrl = ref();
+const amountsNotMatch = ref(null);
+
+const vatColumns = ref([
+    {
+        name: 'expense',
+        label: 'invoiceIn.summary.expense',
+        field: (row) => row.expenseFk,
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'landed',
+        label: 'invoiceIn.summary.taxableBase',
+        field: (row) => row.taxableBase,
+        format: (value) => toCurrency(value),
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'vat',
+        label: 'invoiceIn.summary.sageVat',
+        field: (row) => row.taxTypeSage?.vat,
+        format: (value) => value,
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'transaction',
+        label: 'invoiceIn.summary.sageTransaction',
+        field: (row) => row.transactionTypeSage?.transaction,
+        format: (value) => value,
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'rate',
+        label: 'invoiceIn.summary.rate',
+        field: (row) => row.taxRate,
+        format: (value) => value,
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'currency',
+        label: 'invoiceIn.summary.currency',
+        field: (row) => row.foreignValue,
+        format: (value) => toCurrency(value),
+        sortable: true,
+        align: 'left',
+    },
+]);
+
+const dueDayColumns = ref([
+    {
+        name: 'date',
+        label: 'invoiceIn.summary.dueDay',
+        field: (row) => toDate(row.dueDated),
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'bank',
+        label: 'invoiceIn.summary.bank',
+        field: (row) => row.bank.bank,
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'amount',
+        label: 'invoiceIn.summary.amount',
+        field: (row) => row.amount,
+        format: (value) => toCurrency(value),
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'landed',
+        label: 'invoiceIn.summary.foreignValue',
+        field: (row) => row.foreignValue,
+        format: (value) => value,
+        sortable: true,
+        align: 'left',
+    },
+]);
+
+const intrastatColumns = ref([
+    {
+        name: 'code',
+        label: 'invoiceIn.summary.code',
+        field: (row) => {
+            return `${row.intrastat.id}: ${row.intrastat?.description}`;
+        },
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'amount',
+        label: 'invoiceIn.summary.amount',
+        field: (row) => toCurrency(row.amount),
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'net',
+        label: 'invoiceIn.summary.net',
+        field: (row) => row.net,
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'amount',
+        label: 'invoiceIn.summary.stems',
+        field: (row) => row.stems,
+        format: (value) => value,
+        sortable: true,
+        align: 'left',
+    },
+    {
+        name: 'landed',
+        label: 'invoiceIn.summary.country',
+        field: (row) => row.country?.code,
+        format: (value) => value,
+        sortable: true,
+        align: 'left',
+    },
+]);
+
+function setAmountNotMatch(entity) {
+    if (!entity) return false;
+
+    const total = entity.totals;
+
+    amountsNotMatch.value =
+        total.totalDueDay != total.totalTaxableBase &&
+        total.totalDueDay != total.totalVat;
+}
+</script>
+
+<template>
+    <CardSummary
+        ref="summary"
+        :url="`InvoiceIns/${entityId}/summary`"
+        @on-fetch="(data) => setAmountNotMatch(data)"
+    >
+        <template #header="{ entity: invoiceIn }">
+            <div>{{ invoiceIn.id }} - {{ invoiceIn.supplier.name }}</div>
+        </template>
+        <template #body="{ entity: invoiceIn }">
+            <QCard class="vn-one">
+                <QCardSection class="q-pa-none">
+                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                        {{ t('invoiceIn.pageTitles.basicData') }}
+                        <QIcon name="open_in_new" color="primary" />
+                    </a>
+                    <QBtn
+                        class="q-ml-sm"
+                        padding="xs"
+                        flat
+                        color="primary"
+                        round
+                        icon="cloud_download"
+                        @click.stop="downloadFile(invoiceIn.dmsFk)"
+                    >
+                        <QTooltip>
+                            {{ t('components.smartCard.downloadFile') }}
+                        </QTooltip>
+                    </QBtn>
+                </QCardSection>
+                <VnLv
+                    :label="t('invoiceIn.summary.supplier')"
+                    :value="invoiceIn.supplier.name"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.supplierRef')"
+                    :value="invoiceIn.supplierRef"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.currency')"
+                    :value="invoiceIn.currency.code"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.docNumber')"
+                    :value="`${invoiceIn.serial}/${invoiceIn.serialNumber}`"
+                />
+            </QCard>
+            <QCard class="vn-one">
+                <QCardSection class="q-pa-none">
+                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                        {{ t('invoiceIn.pageTitles.basicData') }}
+                        <QIcon name="open_in_new" color="primary" />
+                    </a>
+                    <QBtn
+                        class="q-ml-sm"
+                        padding="xs"
+                        flat
+                        color="primary"
+                        round
+                        icon="cloud_download"
+                        @click.stop="downloadFile(invoiceIn.dmsFk)"
+                    >
+                        <QTooltip>
+                            {{ t('components.smartCard.downloadFile') }}
+                        </QTooltip>
+                    </QBtn>
+                </QCardSection>
+                <VnLv
+                    :label="t('invoiceIn.summary.issued')"
+                    :value="toDate(invoiceIn.issued)"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.operated')"
+                    :value="toDate(invoiceIn.operated)"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.bookEntried')"
+                    :value="toDate(invoiceIn.bookEntried)"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.bookedDate')"
+                    :value="toDate(invoiceIn.booked)"
+                />
+            </QCard>
+            <QCard class="vn-one">
+                <QCardSection class="q-pa-none">
+                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                        {{ t('invoiceIn.pageTitles.basicData') }}
+                        <QIcon name="open_in_new" color="primary" />
+                    </a>
+                    <QBtn
+                        class="q-ml-sm"
+                        padding="xs"
+                        flat
+                        color="primary"
+                        round
+                        icon="cloud_download"
+                        @click.stop="downloadFile(invoiceIn.dmsFk)"
+                    >
+                        <QTooltip>
+                            {{ t('components.smartCard.downloadFile') }}
+                        </QTooltip>
+                    </QBtn>
+                </QCardSection>
+                <QCardSection class="q-pa-none">
+                    <div class="bordered q-px-sm">
+                        <VnLv
+                            :label="t('invoiceIn.summary.taxableBase')"
+                            :value="toCurrency(invoiceIn.totals.totalTaxableBase)"
+                        />
+                        <VnLv
+                            label="Total"
+                            :value="toCurrency(invoiceIn.totals.totalVat)"
+                        />
+                        <VnLv :label="t('invoiceIn.summary.dueTotal')">
+                            <template #value>
+                                <QChip
+                                    dense
+                                    class="q-pa-xs"
+                                    :color="amountsNotMatch ? 'negative' : 'transparent'"
+                                    :title="
+                                        amountsNotMatch
+                                            ? t('invoiceIn.summary.noMatch')
+                                            : t('invoiceIn.summary.dueTotal')
+                                    "
+                                >
+                                    {{ toCurrency(invoiceIn.totals.totalDueDay) }}
+                                </QChip>
+                            </template>
+                        </VnLv>
+                    </div>
+                </QCardSection>
+            </QCard>
+            <QCard class="q-mb-md">
+                <QCardSection class="q-pa-none">
+                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                        {{ t('invoiceIn.pageTitles.basicData') }}
+                        <QIcon name="open_in_new" color="primary" />
+                    </a>
+                    <QBtn
+                        class="q-ml-sm"
+                        padding="xs"
+                        flat
+                        color="primary"
+                        round
+                        icon="cloud_download"
+                        @click.stop="downloadFile(invoiceIn.dmsFk)"
+                    >
+                        <QTooltip>
+                            {{ t('components.smartCard.downloadFile') }}
+                        </QTooltip>
+                    </QBtn>
+                </QCardSection>
+                <VnLv
+                    :label="t('invoiceIn.summary.sage')"
+                    :value="invoiceIn.sageWithholding.withholding"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.vat')"
+                    :value="invoiceIn.expenseDeductible?.name"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.company')"
+                    :value="invoiceIn.company.code"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.booked')"
+                    :value="invoiceIn.isBooked"
+                />
+            </QCard>
+            <QCard v-if="invoiceIn.invoiceInTax.length" class="vn-three">
+                <a class="header">
+                    {{ t('invoiceIn.card.vat') }}
+                </a>
+                <QTable
+                    :columns="vatColumns"
+                    :rows="invoiceIn.invoiceInTax"
+                    flat
+                    hide-pagination
+                >
+                    <template #header="props">
+                        <QTr :props="props">
+                            <QTh v-for="col in props.cols" :key="col.name" :props="props">
+                                {{ t(col.label) }}
+                            </QTh>
+                        </QTr>
+                    </template>
+                </QTable>
+            </QCard>
+            <QCard v-if="invoiceIn.invoiceInDueDay.length" class="vn-two">
+                <div class="header">
+                    {{ t('invoiceIn.card.dueDay') }}
+                </div>
+                <QTable
+                    :columns="dueDayColumns"
+                    :rows="invoiceIn.invoiceInDueDay"
+                    flat
+                    hide-pagination
+                >
+                    <template #header="props">
+                        <QTr :props="props">
+                            <QTh v-for="col in props.cols" :key="col.name" :props="props">
+                                {{ t(col.label) }}
+                            </QTh>
+                        </QTr>
+                    </template>
+                </QTable>
+            </QCard>
+            <QCard v-if="invoiceIn.invoiceInIntrastat.length">
+                <div class="header">
+                    {{ t('invoiceIn.card.intrastat') }}
+                </div>
+                <QTable
+                    :columns="intrastatColumns"
+                    :rows="invoiceIn.invoiceInIntrastat"
+                    flat
+                    hide-pagination
+                >
+                    <template #header="props">
+                        <QTr :props="props">
+                            <QTh v-for="col in props.cols" :key="col.name" :props="props">
+                                {{ t(col.label) }}
+                            </QTh>
+                        </QTr>
+                    </template>
+                </QTable>
+            </QCard>
+        </template>
+    </CardSummary>
+</template>
+<style lang="scss" scoped>
+.bordered {
+    border: 1px solid var(--vn-text);
+    width: 16em;
+}
+</style>
+<i18n>
+    es:
+        Search invoice: Buscar factura emitida
+        You can search by invoice reference: Puedes buscar por referencia de la factura
+</i18n>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummaryDialog.vue b/src/pages/InvoiceIn/Card/InvoiceInSummaryDialog.vue
new file mode 100644
index 000000000..8657bf6ac
--- /dev/null
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummaryDialog.vue
@@ -0,0 +1,29 @@
+<script setup>
+import { useDialogPluginComponent } from 'quasar';
+import InvoiceInSummary from './InvoiceInSummary.vue';
+
+const $props = defineProps({
+    id: {
+        type: Number,
+        required: true,
+    },
+});
+
+defineEmits([...useDialogPluginComponent.emits]);
+
+const { dialogRef, onDialogHide } = useDialogPluginComponent();
+</script>
+
+<template>
+    <QDialog ref="dialogRef" @hide="onDialogHide">
+        <InvoiceInSummary v-if="$props.id" :id="$props.id" />
+    </QDialog>
+</template>
+
+<style lang="scss">
+.q-dialog .summary .header {
+    position: sticky;
+    z-index: $z-max;
+    top: 0;
+}
+</style>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInVat.vue b/src/pages/InvoiceIn/Card/InvoiceInVat.vue
new file mode 100644
index 000000000..8a83dfbd4
--- /dev/null
+++ b/src/pages/InvoiceIn/Card/InvoiceInVat.vue
@@ -0,0 +1,500 @@
+<script setup>
+import { ref, computed } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
+import axios from 'axios';
+import { useArrayData } from 'src/composables/useArrayData';
+import { toCurrency } from 'src/filters';
+import FetchData from 'src/components/FetchData.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+import CrudModel from 'src/components/CrudModel.vue';
+
+const route = useRoute();
+const { t } = useI18n();
+const quasar = useQuasar();
+
+const arrayData = useArrayData('InvoiceIn');
+const invoiceIn = computed(() => arrayData.store.data);
+
+const expenses = ref([]);
+const sageTaxTypes = ref([]);
+const sageTransactionTypes = ref([]);
+const rowsSelected = ref([]);
+const newExpense = ref({
+    code: undefined,
+    isWithheld: false,
+    description: undefined,
+});
+
+const invoiceInFormRef = ref();
+const expensesRef = ref();
+const newExpenseRef = ref();
+
+const columns = computed(() => [
+    {
+        name: 'expense',
+        label: t('Expense'),
+        field: (row) => row.expenseFk,
+        options: expenses.value,
+        model: 'expenseFk',
+        optionValue: 'id',
+        optionLabel: 'id',
+        sortable: true,
+        tabIndex: 1,
+        align: 'left',
+    },
+    {
+        name: 'taxablebase',
+        label: t('Taxable base'),
+        field: (row) => toCurrency(row.taxableBase),
+        model: 'taxableBase',
+        sortable: true,
+        tabIndex: 2,
+        align: 'left',
+    },
+    {
+        name: 'sageiva',
+        label: t('Sage iva'),
+        field: (row) => row.taxTypeSageFk,
+        options: sageTaxTypes.value,
+        model: 'taxTypeSageFk',
+        optionValue: 'id',
+        optionLabel: 'vat',
+        sortable: true,
+        tabindex: 3,
+        align: 'left',
+    },
+    {
+        name: 'sagetransaction',
+        label: t('Sage transaction'),
+        field: (row) => row.transactionTypeSageFk,
+        options: sageTransactionTypes.value,
+        model: 'transactionTypeSageFk',
+        optionValue: 'id',
+        optionLabel: 'transaction',
+        sortable: true,
+        tabIndex: 4,
+        align: 'left',
+    },
+    {
+        name: 'rate',
+        label: t('Rate'),
+        sortable: true,
+        tabIndex: 5,
+        field: (row) => taxRate(row, row.taxTypeSageFk),
+        align: 'left',
+    },
+    {
+        name: 'foreignvalue',
+        label: t('Foreign value'),
+        sortable: true,
+        tabIndex: 6,
+        field: (row) => row.foreignValue,
+        align: 'left',
+    },
+]);
+
+const filter = {
+    fields: [
+        'id',
+        'invoiceInFk',
+        'taxableBase',
+        'expenseFk',
+        'foreignValue',
+        'taxTypeSageFk',
+        'transactionTypeSageFk',
+    ],
+    where: {
+        invoiceInFk: route.params.id,
+    },
+};
+
+const isNotEuro = (code) => code != 'EUR';
+
+function taxRate(invoiceInTax, sageTaxTypeId) {
+    const taxRateSelection = sageTaxTypes.value.find(
+        (transaction) => transaction.id == sageTaxTypeId
+    );
+    const taxTypeSage = taxRateSelection && taxRateSelection.rate;
+    const taxableBase = invoiceInTax && invoiceInTax.taxableBase;
+    if (taxTypeSage && taxableBase) {
+        return toCurrency((taxTypeSage / 100) * taxableBase);
+    }
+    return toCurrency(0);
+}
+
+async function addExpense() {
+    try {
+        if (!newExpense.value.code) throw new Error(t(`The code can't be empty`));
+        if (isNaN(newExpense.value.code))
+            throw new Error(t(`The code have to be a number`));
+        if (!newExpense.value.description)
+            throw new Error(t(`The description can't be empty`));
+
+        const data = [
+            {
+                id: newExpense.value.code,
+                isWithheld: newExpense.value.isWithheld,
+                name: newExpense.value.description,
+            },
+        ];
+
+        await axios.post(`Expenses`, data);
+        await expensesRef.value.fetch();
+        quasar.notify({
+            type: 'positive',
+            message: t('globals.dataSaved'),
+        });
+    } catch (error) {
+        quasar.notify({
+            type: 'negative',
+            message: t(`${error}`),
+        });
+    }
+}
+</script>
+<template>
+    <FetchData
+        ref="expensesRef"
+        url="Expenses"
+        auto-load
+        @on-fetch="(data) => (expenses = data)"
+    />
+    <FetchData url="SageTaxTypes" auto-load @on-fetch="(data) => (sageTaxTypes = data)" />
+    <FetchData
+        url="sageTransactionTypes"
+        auto-load
+        @on-fetch="(data) => (sageTransactionTypes = data)"
+    />
+    <CrudModel
+        ref="invoiceInFormRef"
+        v-if="invoiceIn"
+        data-key="InvoiceInTaxes"
+        url="InvoiceInTaxes"
+        :filter="filter"
+        :data-required="{ invoiceInFk: route.params.id }"
+        auto-load
+        v-model:selected="rowsSelected"
+    >
+        <template #body="{ rows }">
+            <QTable
+                v-model:selected="rowsSelected"
+                selection="multiple"
+                :columns="columns"
+                :rows="rows"
+                row-key="$index"
+                hide-pagination
+                :grid="$q.screen.lt.sm"
+                :pagination="{ rowsPerPage: 0 }"
+            >
+                <template #body-cell-expense="{ row, col }">
+                    <QTd auto-width>
+                        <VnSelectFilter
+                            v-model="row[col.model]"
+                            :options="col.options"
+                            :option-value="col.optionValue"
+                            :option-label="col.optionLabel"
+                            :filter-options="['id', 'name']"
+                        >
+                            <template #option="scope">
+                                <QItem v-bind="scope.itemProps">
+                                    {{ `${scope.opt.id}: ${scope.opt.name}` }}
+                                </QItem>
+                            </template>
+                            <template #append>
+                                <QIcon
+                                    name="close"
+                                    @click.stop="value = null"
+                                    class="cursor-pointer"
+                                />
+                                <QBtn
+                                    padding="xs"
+                                    round
+                                    flat
+                                    icon="add_circle"
+                                    @click.stop="newExpenseRef.show()"
+                                >
+                                    <QTooltip>
+                                        {{ t('Create expense') }}
+                                    </QTooltip>
+                                </QBtn>
+                            </template>
+                        </VnSelectFilter>
+                    </QTd>
+                </template>
+                <template #body-cell-taxablebase="{ row }">
+                    <QTd>
+                        <QInput
+                            :class="{
+                                'no-pointer-events': isNotEuro(invoiceIn.currency.code),
+                            }"
+                            :disable="isNotEuro(invoiceIn.currency.code)"
+                            label=""
+                            clear-icon="close"
+                            v-model="row.taxableBase"
+                            clearable
+                        >
+                            <template #prepend>
+                                <QIcon name="euro" size="xs" flat />
+                            </template>
+                        </QInput>
+                    </QTd>
+                </template>
+                <template #body-cell-sageiva="{ row, col }">
+                    <QTd>
+                        <VnSelectFilter
+                            v-model="row[col.model]"
+                            :options="col.options"
+                            :option-value="col.optionValue"
+                            :option-label="col.optionLabel"
+                            :filter-options="['id', 'vat']"
+                            :autofocus="col.tabIndex == 1"
+                            input-debounce="0"
+                        >
+                            <template #option="scope">
+                                <QItem v-bind="scope.itemProps">
+                                    <QItemSection>
+                                        <QItemLabel>{{ scope.opt.vat }}</QItemLabel>
+                                        <QItemLabel>
+                                            {{ `#${scope.opt.id}` }}
+                                        </QItemLabel>
+                                    </QItemSection>
+                                </QItem>
+                            </template>
+                        </VnSelectFilter>
+                    </QTd>
+                </template>
+                <template #body-cell-sagetransaction="{ row, col }">
+                    <QTd>
+                        <VnSelectFilter
+                            v-model="row[col.model]"
+                            :options="col.options"
+                            :option-value="col.optionValue"
+                            :option-label="col.optionLabel"
+                            :filter-options="['id', 'transaction']"
+                            :autofocus="col.tabIndex == 1"
+                            input-debounce="0"
+                        >
+                            <template #option="scope">
+                                <QItem v-bind="scope.itemProps">
+                                    <QItemSection>
+                                        <QItemLabel>{{
+                                            scope.opt.transaction
+                                        }}</QItemLabel>
+                                        <QItemLabel>
+                                            {{ `#${scope.opt.id}` }}
+                                        </QItemLabel>
+                                    </QItemSection>
+                                </QItem>
+                            </template>
+                        </VnSelectFilter>
+                    </QTd>
+                </template>
+                <template #body-cell-foreignvalue="{ row }">
+                    <QTd>
+                        <QInput
+                            :class="{
+                                'no-pointer-events': !isNotEuro(invoiceIn.currency.code),
+                            }"
+                            :disable="!isNotEuro(invoiceIn.currency.code)"
+                            v-model="row.foreignValue"
+                        />
+                    </QTd>
+                </template>
+                <template #item="props">
+                    <div class="q-pa-xs col-xs-12 col-sm-6 grid-style-transition">
+                        <QCard bordered flat class="q-my-xs">
+                            <QCardSection>
+                                <QCheckbox v-model="props.selected" dense />
+                            </QCardSection>
+                            <QSeparator />
+                            <QList>
+                                <QItem>
+                                    <VnSelectFilter
+                                        :label="t('Expense')"
+                                        class="full-width"
+                                        v-model="props.row['expenseFk']"
+                                        :options="expenses"
+                                        option-value="id"
+                                        option-label="name"
+                                        :filter-options="['id', 'name']"
+                                    >
+                                        <template #option="scope">
+                                            <QItem v-bind="scope.itemProps">
+                                                {{ `${scope.opt.id}: ${scope.opt.name}` }}
+                                            </QItem>
+                                        </template>
+                                    </VnSelectFilter>
+                                </QItem>
+                                <QItem>
+                                    <QInput
+                                        :label="t('Taxable base')"
+                                        :class="{
+                                            'no-pointer-events': isNotEuro(
+                                                invoiceIn.currency.code
+                                            ),
+                                        }"
+                                        class="full-width"
+                                        :disable="isNotEuro(invoiceIn.currency.code)"
+                                        clear-icon="close"
+                                        v-model="props.row.taxableBase"
+                                        clearable
+                                    >
+                                        <template #append>
+                                            <QIcon name="euro" size="xs" flat />
+                                        </template>
+                                    </QInput>
+                                </QItem>
+                                <QItem>
+                                    <VnSelectFilter
+                                        :label="t('Sage iva')"
+                                        class="full-width"
+                                        v-model="props.row['taxTypeSageFk']"
+                                        :options="sageTaxTypes"
+                                        option-value="id"
+                                        option-label="vat"
+                                        :filter-options="['id', 'vat']"
+                                    >
+                                        <template #option="scope">
+                                            <QItem v-bind="scope.itemProps">
+                                                <QItemSection>
+                                                    <QItemLabel>{{
+                                                        scope.opt.vat
+                                                    }}</QItemLabel>
+                                                    <QItemLabel>
+                                                        {{ `#${scope.opt.id}` }}
+                                                    </QItemLabel>
+                                                </QItemSection>
+                                            </QItem>
+                                        </template>
+                                    </VnSelectFilter>
+                                </QItem>
+                                <QItem>
+                                    <VnSelectFilter
+                                        class="full-width"
+                                        v-model="props.row['transactionTypeSageFk']"
+                                        :options="sageTransactionTypes"
+                                        option-value="id"
+                                        option-label="transaction"
+                                        :filter-options="['id', 'transaction']"
+                                    >
+                                        <template #option="scope">
+                                            <QItem v-bind="scope.itemProps">
+                                                <QItemSection>
+                                                    <QItemLabel>{{
+                                                        scope.opt.transaction
+                                                    }}</QItemLabel>
+                                                    <QItemLabel>
+                                                        {{ `#${scope.opt.id}` }}
+                                                    </QItemLabel>
+                                                </QItemSection>
+                                            </QItem>
+                                        </template>
+                                    </VnSelectFilter>
+                                </QItem>
+                                <QItem>
+                                    {{ taxRate(props.row, props.row.taxTypeSageFk) }}
+                                </QItem>
+                                <QItem>
+                                    <QInput
+                                        :label="t('Foreign value')"
+                                        class="full-width"
+                                        :class="{
+                                            'no-pointer-events': !isNotEuro(
+                                                invoiceIn.currency.code
+                                            ),
+                                        }"
+                                        :disable="!isNotEuro(invoiceIn.currency.code)"
+                                        v-model="props.row.foreignValue"
+                                    />
+                                </QItem>
+                            </QList>
+                        </QCard>
+                    </div>
+                </template>
+            </QTable>
+        </template>
+    </CrudModel>
+    <QDialog ref="newExpenseRef">
+        <QCard>
+            <QCardSection class="q-pb-none">
+                <QItem class="q-pa-none">
+                    <span class="text-primary text-h6 full-width">
+                        <QIcon name="edit" class="q-mr-xs" />
+                        {{ t('New expense') }}
+                    </span>
+                    <QBtn icon="close" flat round dense v-close-popup />
+                </QItem>
+            </QCardSection>
+            <QCardSection class="q-pt-none">
+                <QItem>
+                    <QInput :label="`${t('Code')}*`" v-model="newExpense.code" />
+                    <QCheckbox
+                        dense
+                        size="sm"
+                        :label="`${t('It\'s a withholding')}`"
+                        v-model="newExpense.isWithheld"
+                    />
+                </QItem>
+                <QItem>
+                    <QInput
+                        :label="`${t('Descripction')}*`"
+                        v-model="newExpense.description"
+                    />
+                </QItem>
+            </QCardSection>
+            <QCardActions class="justify-end">
+                <QBtn flat :label="t('globals.close')" color="primary" v-close-popup />
+                <QBtn :label="t('globals.save')" color="primary" @click="addExpense" />
+            </QCardActions>
+        </QCard>
+    </QDialog>
+    <QPageSticky position="bottom-right" :offset="[25, 25]">
+        <QBtn
+            color="primary"
+            icon="add"
+            size="lg"
+            round
+            @click="invoiceInFormRef.insert()"
+        />
+    </QPageSticky>
+</template>
+<style lang="scss" scoped>
+@media (max-width: $breakpoint-xs) {
+    .q-dialog {
+        .q-card {
+            &__section:not(:first-child) {
+                .q-item {
+                    flex-direction: column;
+
+                    .q-checkbox {
+                        margin-top: 2rem;
+                    }
+                }
+            }
+        }
+    }
+}
+.q-item {
+    min-height: 0;
+}
+</style>
+<i18n>
+es:
+    Expense: Gasto
+    Create expense: Crear gasto
+    Add tax: Crear gasto
+    Taxable base: Base imp.
+    Sage tax: Sage iva
+    Sage transaction: Sage transacción
+    Rate: Tasa
+    Foreign value: Divisa
+    New expense: Nuevo gasto
+    Code: Código
+    It's a withholding: Es una retención
+    Descripction: Descripción
+    The code can't be empty: El código no puede estar vacío
+    The description can't be empty: La descripción no puede estar vacía
+    The code have to be a number: El código debe ser un número.
+</i18n>
diff --git a/src/pages/InvoiceIn/InvoiceInFilter.vue b/src/pages/InvoiceIn/InvoiceInFilter.vue
new file mode 100644
index 000000000..6348d4167
--- /dev/null
+++ b/src/pages/InvoiceIn/InvoiceInFilter.vue
@@ -0,0 +1,307 @@
+<script setup>
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import VnSelectFilter from 'components/common/VnSelectFilter.vue';
+import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
+import FetchData from 'components/FetchData.vue';
+
+const { t } = useI18n();
+const props = defineProps({
+    dataKey: {
+        type: String,
+        required: true,
+    },
+});
+const suppliers = ref([]);
+const suppliersRef = ref();
+</script>
+
+<template>
+    <FetchData
+        ref="suppliersRef"
+        url="Suppliers"
+        :filter="{ fields: ['id', 'nickname'] }"
+        order="nickname"
+        limit="30"
+        @on-fetch="(data) => (suppliers = data)"
+    />
+    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
+        <template #tags="{ tag, formatFn }">
+            <div class="q-gutter-x-xs">
+                <strong>{{ t(`params.${tag.label}`) }}: </strong>
+                <span>{{ formatFn(tag.value) }}</span>
+            </div>
+        </template>
+        <template #body="{ params, searchFn }">
+            <QList dense>
+                <QItem>
+                    <QItemSection>
+                        <QInput :label="t('Id or Supplier')" v-model="params.search">
+                            <template #prepend>
+                                <QIcon name="badge" size="sm"></QIcon>
+                            </template>
+                        </QInput>
+                    </QItemSection>
+                </QItem>
+                <QItem>
+                    <QItemSection>
+                        <QInput
+                            :label="t('params.supplierRef')"
+                            v-model="params.supplierRef"
+                            @input.
+                            lazy-rules
+                        >
+                            <template #prepend>
+                                <QIcon name="vn:client" size="sm"></QIcon>
+                            </template>
+                        </QInput>
+                    </QItemSection>
+                </QItem>
+                <QItem>
+                    <QItemSection>
+                        <VnSelectFilter
+                            :label="t('params.supplierFk')"
+                            v-model="params.supplierFk"
+                            :options="suppliers"
+                            option-value="id"
+                            option-label="nickname"
+                            @input-value="suppliersRef.fetch()"
+                        >
+                        </VnSelectFilter>
+                    </QItemSection>
+                </QItem>
+                <QItem>
+                    <QItemSection>
+                        <QInput :label="t('params.fi')" v-model="params.fi" lazy-rules>
+                            <template #prepend>
+                                <QIcon name="badge" size="sm"></QIcon>
+                            </template>
+                        </QInput>
+                    </QItemSection>
+                </QItem>
+                <QItem>
+                    <QItemSection>
+                        <QInput
+                            :label="t('params.serialNumber')"
+                            v-model="params.serialNumber"
+                            lazy-rules
+                        >
+                            <template #prepend>
+                                <QIcon name="badge" size="sm"></QIcon>
+                            </template>
+                        </QInput>
+                    </QItemSection>
+                </QItem>
+                <QItem>
+                    <QItemSection>
+                        <QInput
+                            :label="t('params.serial')"
+                            v-model="params.serial"
+                            lazy-rules
+                        >
+                            <template #prepend>
+                                <QIcon name="badge" size="sm"></QIcon>
+                            </template>
+                        </QInput>
+                    </QItemSection>
+                </QItem>
+                <QItem>
+                    <QItemSection>
+                        <QInput :label="t('Amount')" v-model="params.amount" lazy-rules>
+                            <template #prepend>
+                                <QIcon name="euro" size="sm"></QIcon>
+                            </template>
+                        </QInput>
+                    </QItemSection>
+                </QItem>
+                <QItem class="q-mb-md">
+                    <QItemSection>
+                        <QCheckbox
+                            :label="t('params.isBooked')"
+                            v-model="params.isBooked"
+                            @update:model-value="searchFn()"
+                            toggle-indeterminate
+                        />
+                    </QItemSection>
+                </QItem>
+                <QExpansionItem :label="t('More options')" expand-separator>
+                    <QItem>
+                        <QItemSection>
+                            <QInput
+                                :label="t('params.awb')"
+                                v-model="params.awbCode"
+                                lazy-rules
+                            >
+                                <template #prepend>
+                                    <QIcon name="badge" size="sm"></QIcon>
+                                </template>
+                            </QInput>
+                        </QItemSection>
+                    </QItem>
+                    <QItem>
+                        <QItemSection>
+                            <QInput
+                                :label="t('params.account')"
+                                v-model="params.account"
+                                lazy-rules
+                            >
+                                <template #prepend>
+                                    <QIcon name="person" size="sm" />
+                                </template>
+                            </QInput>
+                        </QItemSection>
+                    </QItem>
+                    <QItem>
+                        <QItemSection>
+                            <QInput :label="t('From')" v-model="params.from" mask="date">
+                                <template #append>
+                                    <QIcon name="event" class="cursor-pointer">
+                                        <QPopupProxy
+                                            cover
+                                            transition-show="scale"
+                                            transition-hide="scale"
+                                        >
+                                            <QDate v-model="params.from" landscape>
+                                                <div
+                                                    class="row items-center justify-end q-gutter-sm"
+                                                >
+                                                    <QBtn
+                                                        :label="t('globals.cancel')"
+                                                        color="primary"
+                                                        flat
+                                                        v-close-popup
+                                                    />
+                                                    <QBtn
+                                                        :label="t('globals.confirm')"
+                                                        color="primary"
+                                                        flat
+                                                        @click="save"
+                                                        v-close-popup
+                                                    />
+                                                </div>
+                                            </QDate>
+                                        </QPopupProxy>
+                                    </QIcon>
+                                </template>
+                            </QInput>
+                        </QItemSection>
+                    </QItem>
+                    <QItem>
+                        <QItemSection>
+                            <QInput :label="t('To')" v-model="params.to" mask="date">
+                                <template #append>
+                                    <QIcon name="event" class="cursor-pointer">
+                                        <QPopupProxy
+                                            cover
+                                            transition-show="scale"
+                                            transition-hide="scale"
+                                        >
+                                            <QDate v-model="params.to" landscape>
+                                                <div
+                                                    class="row items-center justify-end q-gutter-sm"
+                                                >
+                                                    <QBtn
+                                                        :label="t('globals.cancel')"
+                                                        color="primary"
+                                                        flat
+                                                        v-close-popup
+                                                    />
+                                                    <QBtn
+                                                        :label="t('globals.confirm')"
+                                                        color="primary"
+                                                        flat
+                                                        @click="save"
+                                                        v-close-popup
+                                                    />
+                                                </div>
+                                            </QDate>
+                                        </QPopupProxy>
+                                    </QIcon>
+                                </template>
+                            </QInput>
+                        </QItemSection>
+                    </QItem>
+                    <QItem>
+                        <QItemSection>
+                            <QInput
+                                :label="t('Issued')"
+                                v-model="params.issued"
+                                mask="date"
+                            >
+                                <template #append>
+                                    <QIcon name="event" class="cursor-pointer">
+                                        <QPopupProxy
+                                            cover
+                                            transition-show="scale"
+                                            transition-hide="scale"
+                                        >
+                                            <QDate v-model="params.issued" landscape>
+                                                <div
+                                                    class="row items-center justify-end q-gutter-sm"
+                                                >
+                                                    <QBtn
+                                                        :label="t('globals.cancel')"
+                                                        color="primary"
+                                                        flat
+                                                        v-close-popup
+                                                    />
+                                                    <QBtn
+                                                        :label="t('globals.confirm')"
+                                                        color="primary"
+                                                        flat
+                                                        @click="save"
+                                                        v-close-popup
+                                                    />
+                                                </div>
+                                            </QDate>
+                                        </QPopupProxy>
+                                    </QIcon>
+                                </template>
+                            </QInput>
+                        </QItemSection>
+                    </QItem>
+                </QExpansionItem>
+            </QList>
+        </template>
+    </VnFilterPanel>
+</template>
+
+<i18n>
+en:
+    params:
+        search: ID
+        supplierRef: Supplier ref.
+        supplierFk: Supplier
+        fi: Supplier fiscal id
+        clientFk: Customer
+        amount: Amount
+        created: Created
+        awb: AWB
+        dued: Dued
+        serialNumber: Serial Number
+        serial: Serial
+        account: Account
+        isBooked: is booked
+es:
+    params:
+        search: Contiene
+        supplierRef: Ref. proveedor
+        supplierFk: Proveedor
+        clientFk: Cliente
+        fi: CIF proveedor
+        serialNumber: Num. serie
+        serial: Serie
+        awb: AWB
+        amount: Importe
+        issued: Emitida
+        isBooked: Conciliada
+        account: Cuenta
+        created: Creada
+        dued: Vencida
+    From: Desde
+    To: Hasta
+    Amount: Importe
+    Issued: Fecha factura
+    Id or supplier: Id o proveedor
+    More options: Más opciones
+</i18n>
diff --git a/src/pages/InvoiceIn/InvoiceInList.vue b/src/pages/InvoiceIn/InvoiceInList.vue
new file mode 100644
index 000000000..692251bff
--- /dev/null
+++ b/src/pages/InvoiceIn/InvoiceInList.vue
@@ -0,0 +1,179 @@
+<script setup>
+import { ref, onMounted, onUnmounted } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRouter } from 'vue-router';
+import { useQuasar } from 'quasar';
+import { useStateStore } from 'stores/useStateStore';
+import { downloadFile } from 'src/composables/downloadFile';
+import { toDate, toCurrency } from 'src/filters/index';
+import VnPaginate from 'src/components/ui/VnPaginate.vue';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
+import VnLv from 'src/components/ui/VnLv.vue';
+import CardList from 'src/components/ui/CardList.vue';
+import InvoiceInFilter from './InvoiceInFilter.vue';
+import InvoiceInSummaryDialog from './Card/InvoiceInSummaryDialog.vue';
+import { getUrl } from 'src/composables/getUrl';
+
+const stateStore = useStateStore();
+const router = useRouter();
+const quasar = useQuasar();
+let url = ref();
+const { t } = useI18n();
+
+onMounted(async () => {
+    stateStore.rightDrawer = true;
+    url.value = await getUrl('');
+});
+onUnmounted(() => (stateStore.rightDrawer = false));
+
+function navigate(id) {
+    router.push({ path: `/invoice-in/${id}` });
+}
+
+function viewSummary(id) {
+    quasar.dialog({
+        component: InvoiceInSummaryDialog,
+        componentProps: {
+            id,
+        },
+    });
+}
+</script>
+
+<template>
+    <template v-if="stateStore.isHeaderMounted()">
+        <Teleport to="#searchbar">
+            <VnSearchbar
+                data-key="InvoiceInList"
+                :label="t('Search invoice')"
+                :info="t('You can search by invoice reference')"
+            />
+        </Teleport>
+        <Teleport to="#actions-append">
+            <div class="row q-gutter-x-sm">
+                <QBtn
+                    flat
+                    @click="stateStore.toggleRightDrawer()"
+                    round
+                    dense
+                    icon="menu"
+                >
+                    <QTooltip bottom anchor="bottom right">
+                        {{ t('globals.collapseMenu') }}
+                    </QTooltip>
+                </QBtn>
+            </div>
+        </Teleport>
+    </template>
+    <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
+        <QScrollArea class="fit text-grey-8">
+            <InvoiceInFilter data-key="InvoiceInList" />
+        </QScrollArea>
+    </QDrawer>
+    <QPage class="column items-center q-pa-md">
+        <div class="card-list">
+            <VnPaginate
+                data-key="InvoiceInList"
+                url="InvoiceIns/filter"
+                order="issued DESC, id DESC"
+                auto-load
+            >
+                <template #body="{ rows }">
+                    <CardList
+                        v-for="row of rows"
+                        :key="row.id"
+                        :title="row.supplierRef"
+                        @click="navigate(row.id)"
+                    >
+                        <template #list-items>
+                            <VnLv label="ID" :value="row.id" />
+                            <VnLv
+                                :label="t('invoiceIn.list.supplierRef')"
+                                :value="row.supplierRef"
+                            />
+                            <VnLv
+                                :label="t('invoiceIn.list.supplier')"
+                                :value="row.supplierName"
+                            />
+                            <VnLv
+                                :label="t('invoiceIn.list.serialNumber')"
+                                :value="row.serialNumber"
+                            />
+                            <VnLv
+                                :label="t('invoiceIn.list.serial')"
+                                :value="row.serial"
+                            />
+                            <VnLv
+                                :label="t('invoiceIn.list.issued')"
+                                :value="toDate(row.issued)"
+                            />
+                            <VnLv :label="t('invoiceIn.list.awb')" :value="row.awbCode" />
+                            <VnLv
+                                :label="t('invoiceIn.list.amount')"
+                                :value="toCurrency(row.amount)"
+                            />
+                            <VnLv :label="t('invoiceIn.list.isBooked')">
+                                <template #value>
+                                    <QCheckbox
+                                        class="no-pointer-events"
+                                        v-model="row.isBooked"
+                                        size="xs"
+                                        :true-value="1"
+                                        :false-value="0"
+                                    />
+                                </template>
+                            </VnLv>
+                        </template>
+                        <template #actions>
+                            <QBtn
+                                flat
+                                icon="arrow_circle_right"
+                                @click.stop="navigate(row.id)"
+                            >
+                                <QTooltip>
+                                    {{ t('components.smartCard.openCard') }}
+                                </QTooltip>
+                            </QBtn>
+                            <QBtn flat icon="preview" @click.stop="viewSummary(row.id)">
+                                <QTooltip>
+                                    {{ t('components.smartCard.openSummary') }}
+                                </QTooltip>
+                            </QBtn>
+                            <QBtn
+                                flat
+                                icon="cloud_download"
+                                @click.stop="downloadFile(row.dmsFk)"
+                            >
+                                <QTooltip>
+                                    {{ t('components.smartCard.downloadFile') }}
+                                </QTooltip>
+                            </QBtn>
+                        </template>
+                    </CardList>
+                </template>
+            </VnPaginate>
+        </div>
+    </QPage>
+    <QPageSticky position="bottom-right" :offset="[25, 25]">
+        <QBtn
+            color="primary"
+            icon="add"
+            size="lg"
+            round
+            :href="`${url}invoice-in/create`"
+        />
+    </QPageSticky>
+</template>
+
+<style lang="scss" scoped>
+.card-list {
+    width: 100%;
+    max-width: 60em;
+}
+</style>
+
+<i18n>
+es:
+    Search invoice: Buscar factura emitida
+    You can search by invoice reference: Puedes buscar por referencia de la factura
+</i18n>
diff --git a/src/pages/InvoiceIn/InvoiceInMain.vue b/src/pages/InvoiceIn/InvoiceInMain.vue
new file mode 100644
index 000000000..66ce78f23
--- /dev/null
+++ b/src/pages/InvoiceIn/InvoiceInMain.vue
@@ -0,0 +1,17 @@
+<script setup>
+import { useStateStore } from 'stores/useStateStore';
+import LeftMenu from 'src/components/LeftMenu.vue';
+
+const stateStore = useStateStore();
+</script>
+
+<template>
+    <QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
+        <QScrollArea class="fit text-grey-8">
+            <LeftMenu />
+        </QScrollArea>
+    </QDrawer>
+    <QPageContainer>
+        <RouterView></RouterView>
+    </QPageContainer>
+</template>
diff --git a/src/router/modules/index.js b/src/router/modules/index.js
index 2916b98ef..2bb28c817 100644
--- a/src/router/modules/index.js
+++ b/src/router/modules/index.js
@@ -2,16 +2,9 @@ import Customer from './customer';
 import Ticket from './ticket';
 import Claim from './claim';
 import InvoiceOut from './invoiceOut';
+import invoiceIn from './invoiceIn';
 import Worker from './worker';
 import Wagon from './wagon';
 import Route from './route';
 
-export default [
-    Customer,
-    Ticket,
-    Claim,
-    InvoiceOut,
-    Worker,
-    Wagon,
-    Route
-]
+export default [Customer, Ticket, Claim, InvoiceOut, invoiceIn, Worker, Wagon, Route];
diff --git a/src/router/modules/invoiceIn.js b/src/router/modules/invoiceIn.js
new file mode 100644
index 000000000..a5509908c
--- /dev/null
+++ b/src/router/modules/invoiceIn.js
@@ -0,0 +1,98 @@
+import { RouterView } from 'vue-router';
+
+export default {
+    path: '/invoice-in',
+    name: 'InvoiceIn',
+    meta: {
+        title: 'invoiceIns',
+        icon: 'vn:invoice-in',
+    },
+    component: RouterView,
+    redirect: { name: 'InvoiceInMain' },
+    menus: {
+        main: ['InvoiceInList'],
+        card: [
+            'InvoiceInBasicData',
+            'InvoiceInVat',
+            'InvoiceInDueDay',
+            'InvoiceInIntrastat',
+        ],
+    },
+    children: [
+        {
+            path: '',
+            name: 'InvoiceInMain',
+            component: () => import('src/pages/InvoiceIn/InvoiceInMain.vue'),
+            redirect: { name: 'InvoiceInList' },
+            children: [
+                {
+                    path: 'list',
+                    name: 'InvoiceInList',
+                    meta: {
+                        title: 'list',
+                        icon: 'view_list',
+                    },
+                    component: () => import('src/pages/InvoiceIn/InvoiceInList.vue'),
+                },
+            ],
+        },
+        {
+            name: 'InvoiceInCard',
+            path: ':id',
+            component: () => import('src/pages/InvoiceIn/Card/InvoiceInCard.vue'),
+            redirect: { name: 'InvoiceInSummary' },
+            children: [
+                {
+                    name: 'InvoiceInSummary',
+                    path: 'summary',
+                    meta: {
+                        title: 'summary',
+                        icon: 'view_list',
+                    },
+                    component: () =>
+                        import('src/pages/InvoiceIn/Card/InvoiceInSummary.vue'),
+                },
+                {
+                    name: 'InvoiceInBasicData',
+                    path: 'basic-data',
+                    meta: {
+                        title: 'basicData',
+                        icon: 'vn:settings',
+                        roles: ['salesPerson'],
+                    },
+                    component: () =>
+                        import('src/pages/InvoiceIn/Card/InvoiceInBasicData.vue'),
+                },
+                {
+                    name: 'InvoiceInVat',
+                    path: 'vat',
+                    meta: {
+                        title: 'vat',
+                        icon: 'vn:tax',
+                    },
+                    component: () => import('src/pages/InvoiceIn/Card/InvoiceInVat.vue'),
+                },
+                {
+                    name: 'InvoiceInDueDay',
+                    path: 'due-day',
+                    meta: {
+                        title: 'dueDay',
+                        icon: 'vn:calendar',
+                    },
+                    component: () =>
+                        import('src/pages/InvoiceIn/Card/InvoiceInDueDay.vue'),
+                },
+                {
+                    name: 'InvoiceInIntrastat',
+                    path: 'intrastat',
+                    meta: {
+                        title: 'intrastat',
+                        icon: 'vn:lines',
+                    },
+                    component: () =>
+                        import('src/pages/InvoiceIn/Card/InvoiceInIntrastat.vue'),
+                },
+            ],
+        },
+    ],
+};
diff --git a/src/router/routes.js b/src/router/routes.js
index e3aa22a06..6632979d3 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -3,6 +3,7 @@ import ticket from './modules/ticket';
 import claim from './modules/claim';
 import worker from './modules/worker';
 import invoiceOut from './modules/invoiceOut';
+import invoiceIn from './modules/invoiceIn';
 import wagon from './modules/wagon';
 import route from './modules/route';
 
@@ -49,6 +50,7 @@ const routes = [
             claim,
             worker,
             invoiceOut,
+            invoiceIn,
             {
                 path: '/:catchAll(.*)*',
                 name: 'NotFound',
diff --git a/src/stores/useNavigationStore.js b/src/stores/useNavigationStore.js
index 168c1f9dc..5db0049cf 100644
--- a/src/stores/useNavigationStore.js
+++ b/src/stores/useNavigationStore.js
@@ -6,7 +6,16 @@ import { useRole } from 'src/composables/useRole';
 import routes from 'src/router/modules';
 
 export const useNavigationStore = defineStore('navigationStore', () => {
-    const modules = ['customer', 'claim', 'ticket', 'invoiceOut', 'worker', 'wagon', 'route'];
+    const modules = [
+        'customer',
+        'claim',
+        'ticket',
+        'invoiceOut',
+        'invoiceIn',
+        'worker',
+        'wagon',
+        'route',
+    ];
     const pinnedModules = ref([]);
     const role = useRole();
 
diff --git a/test/cypress/integration/ClaimNotes.spec.js b/test/cypress/integration/claimNotes.spec.js
similarity index 100%
rename from test/cypress/integration/ClaimNotes.spec.js
rename to test/cypress/integration/claimNotes.spec.js
diff --git a/test/cypress/integration/invoiceInList.spec.js b/test/cypress/integration/invoiceInList.spec.js
new file mode 100644
index 000000000..20b8403a3
--- /dev/null
+++ b/test/cypress/integration/invoiceInList.spec.js
@@ -0,0 +1,27 @@
+/// <reference types="cypress" />
+describe('InvoiceInList', () => {
+    const firstCard = '.q-card:nth-child(1)';
+    const firstId =
+        '.q-card:nth-child(1) .list-items > .vn-label-value:first-child > .value > span';
+    const firstDetailBtn = '.q-card:nth-child(1) .q-btn:nth-child(2)';
+    const summaryHeaders = '.summaryBody .header';
+
+    beforeEach(() => {
+        cy.login('developer');
+        cy.visit(`/#/invoice-in`);
+    });
+
+    it('should redirect on clicking a invoice', () => {
+        cy.get(firstId)
+            .invoke('text')
+            .then((id) => {
+                cy.get(firstCard).click();
+                cy.url().should('include', `/invoice-in/${id}/summary`);
+            });
+    });
+
+    it('should open the details', () => {
+        cy.get(firstDetailBtn).click();
+        cy.get(summaryHeaders).eq(1).contains('Basic Data');
+    });
+});
diff --git a/test/vitest/__tests__/composables/downloadFile.spec.js b/test/vitest/__tests__/composables/downloadFile.spec.js
new file mode 100644
index 000000000..f611479bf
--- /dev/null
+++ b/test/vitest/__tests__/composables/downloadFile.spec.js
@@ -0,0 +1,25 @@
+import { vi, describe, expect, it } from 'vitest';
+import { axios } from 'app/test/vitest/helper';
+import { downloadFile } from 'src/composables/downloadFile';
+import { useSession } from 'src/composables/useSession';
+
+const session = useSession();
+const token = session.getToken();
+
+describe('downloadFile', () => {
+    it('should open a new window to download the file', async () => {
+        const url = 'http://localhost:9000';
+
+        vi.spyOn(axios, 'get').mockResolvedValueOnce({ data: url });
+
+        const mockWindowOpen = vi.spyOn(window, 'open');
+
+        await downloadFile(1);
+
+        expect(mockWindowOpen).toHaveBeenCalledWith(
+            `${url}/api/dms/1/downloadFile?access_token=${token}`
+        );
+
+        mockWindowOpen.mockRestore();
+    });
+});

From a9241b17f570966055aae3634b94978c2f2dd1d9 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 6 Nov 2023 16:03:36 +0100
Subject: [PATCH 02/19] ref #5835 tests basicData and list

---
 .../InvoiceIn/Card/InvoiceInBasicData.vue     | 549 +++++++++---------
 .../integration/invoiceInBasicData.spec.js    |  24 +
 .../cypress/integration/invoiceInList.spec.js |   1 +
 .../InvoiceIn/InvoiceInBasicData.spec.js      |  46 ++
 4 files changed, 337 insertions(+), 283 deletions(-)
 create mode 100644 test/cypress/integration/invoiceInBasicData.spec.js
 create mode 100644 test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js

diff --git a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
index 3edfab0d6..3419492b7 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
@@ -85,10 +85,10 @@ async function setCreateDms() {
 
 async function edit() {
     try {
-        if (!dms.value.companyId) throw new Error(t(`The company can't be empty`));
-        if (!dms.value.warehouseId) throw new Error(t(`The warehouse can't be empty`));
-        if (!dms.value.dmsTypeId) throw new Error(t(`The DMS Type can't be empty`));
-        if (!dms.value.description) throw new Error(t(`The description can't be empty`));
+        if (!dms.value.companyId) throw Error(t(`The company can't be empty`));
+        if (!dms.value.warehouseId) throw Error(t(`The warehouse can't be empty`));
+        if (!dms.value.dmsTypeId) throw Error(t(`The DMS Type can't be empty`));
+        if (!dms.value.description) throw Error(t(`The description can't be empty`));
 
         const formData = new FormData();
 
@@ -111,7 +111,7 @@ async function edit() {
         });
     } catch (error) {
         quasar.notify({
-            message: t(`${error}`),
+            message: t(`${error.message}`),
             type: 'negative',
         });
     }
@@ -119,11 +119,11 @@ async function edit() {
 
 async function create() {
     try {
-        if (!dms.value.companyId) throw new Error(t(`The company can't be empty`));
-        if (!dms.value.warehouseId) throw new Error(t(`The warehouse can't be empty`));
-        if (!dms.value.dmsTypeId) throw new Error(t(`The DMS Type can't be empty`));
-        if (!dms.value.description) throw new Error(t(`The description can't be empty`));
-        if (!dms.value.files) throw new Error(t(`The files can't be empty`));
+        if (!dms.value.companyId) throw Error(t(`The company can't be empty`));
+        if (!dms.value.warehouseId) throw Error(t(`The warehouse can't be empty`));
+        if (!dms.value.dmsTypeId) throw Error(t(`The DMS Type can't be empty`));
+        if (!dms.value.description) throw Error(t(`The description can't be empty`));
+        if (!dms.value.files) throw Error(t(`The files can't be empty`));
 
         const formData = new FormData();
 
@@ -144,8 +144,9 @@ async function create() {
             type: 'positive',
         });
     } catch (error) {
+        console.log(error);
         quasar.notify({
-            message: t(`${error}`),
+            message: t(`${error.message}`),
             type: 'negative',
         });
     }
@@ -197,274 +198,257 @@ async function create() {
         @on-fetch="(data) => (userConfig = data)"
         auto-load
     />
-    <div class="column items-center">
-        <QCard>
-            <FormModel
-                v-if="invoiceIn"
-                :url="`InvoiceIns/${route.params.id}`"
-                model="invoiceIn"
-            >
-                <template #form="{ data }">
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <VnSelectFilter
-                                v-if="suppliersRef"
-                                :label="t('supplierFk')"
-                                v-model="data.supplierFk"
-                                :options="suppliers"
-                                option-value="id"
-                                option-label="nickname"
-                                @input-value="suppliersRef.fetch()"
-                            >
-                                <template #option="scope">
-                                    <QItem v-bind="scope.itemProps">
-                                        <QItemSection>
-                                            <QItemLabel>{{
-                                                `${scope.opt.id} - ${scope.opt.nickname}`
-                                            }}</QItemLabel>
-                                        </QItemSection>
-                                    </QItem>
-                                </template>
-                            </VnSelectFilter>
-                        </div>
-                        <div class="col">
-                            <QInput
-                                clearable
-                                clear-icon="close"
-                                :label="t('Supplier ref')"
-                                v-model="data.supplierRef"
+    <FormModel v-if="invoiceIn" :url="`InvoiceIns/${route.params.id}`" model="invoiceIn">
+        <template #form="{ data }">
+            <div class="row q-gutter-md q-mb-md">
+                <div class="col">
+                    <VnSelectFilter
+                        v-if="suppliersRef"
+                        :label="t('supplierFk')"
+                        v-model="data.supplierFk"
+                        :options="suppliers"
+                        option-value="id"
+                        option-label="nickname"
+                        :input-debounce="100"
+                        @input-value="suppliersRef.fetch()"
+                    >
+                        <template #option="scope">
+                            <QItem v-bind="scope.itemProps">
+                                <QItemSection>
+                                    <QItemLabel>{{
+                                        `${scope.opt.id} - ${scope.opt.nickname}`
+                                    }}</QItemLabel>
+                                </QItemSection>
+                            </QItem>
+                        </template>
+                    </VnSelectFilter>
+                </div>
+                <div class="col">
+                    <QInput
+                        clearable
+                        clear-icon="close"
+                        :label="t('Supplier ref')"
+                        v-model="data.supplierRef"
+                    />
+                </div>
+            </div>
+            <div class="row q-gutter-md q-mb-md">
+                <div class="col">
+                    <QInput
+                        :label="t('Expedition date')"
+                        v-model="data.issued"
+                        mask="####-##-##"
+                    >
+                        <template #append>
+                            <QIcon name="event" class="cursor-pointer" fill-mask="_">
+                                <QPopupProxy
+                                    cover
+                                    transition-show="scale"
+                                    transition-hide="scale"
+                                >
+                                    <QDate v-model="data.issued">
+                                        <div class="row items-center justify-end">
+                                            <QBtn
+                                                v-close-popup
+                                                label="Close"
+                                                color="primary"
+                                                flat
+                                            />
+                                        </div>
+                                    </QDate>
+                                </QPopupProxy>
+                            </QIcon>
+                        </template>
+                    </QInput>
+                </div>
+                <div class="col">
+                    <QInput
+                        :label="t('Operation date')"
+                        v-model="data.operated"
+                        mask="####-##-##"
+                        fill-mask="_"
+                        autofocus
+                    >
+                        <template #append>
+                            <QIcon name="event" class="cursor-pointer">
+                                <QPopupProxy
+                                    cover
+                                    transition-show="scale"
+                                    transition-hide="scale"
+                                >
+                                    <QDate v-model="data.operated" mask="YYYY-MM-DD">
+                                        <div class="row items-center justify-end">
+                                            <QBtn
+                                                v-close-popup
+                                                label="Close"
+                                                color="primary"
+                                                flat
+                                            />
+                                        </div>
+                                    </QDate>
+                                </QPopupProxy>
+                            </QIcon>
+                        </template>
+                    </QInput>
+                </div>
+            </div>
+            <div class="row q-gutter-md q-mb-md">
+                <div class="col">
+                    <QInput
+                        :label="t('Undeductible VAT')"
+                        v-model="data.deductibleExpenseFk"
+                        clearable
+                        clear-icon="close"
+                    />
+                </div>
+                <div class="col">
+                    <QInput
+                        :label="t('Document')"
+                        v-model="data.dmsFk"
+                        clearable
+                        clear-icon="close"
+                        @update:model-value="checkFileExists(data.dmsFk)"
+                    >
+                        <template #prepend>
+                            <QBtn
+                                v-if="data.dmsFk"
+                                :class="{
+                                    'no-pointer-events': editDownloadDisabled,
+                                }"
+                                :disable="editDownloadDisabled"
+                                icon="cloud_download"
+                                :title="t('Download file')"
+                                padding="xs"
+                                round
+                                @click="downloadFile(data.dmsFk)"
                             />
-                        </div>
-                    </div>
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <QInput :label="t('Expedition date')" v-model="data.issued">
-                                <template #append>
-                                    <QIcon
-                                        name="event"
-                                        class="cursor-pointer"
-                                        mask="####-##-##"
-                                        fill-mask="_"
-                                    >
-                                        <QPopupProxy
-                                            cover
-                                            transition-show="scale"
-                                            transition-hide="scale"
-                                        >
-                                            <QDate v-model="data.issued">
-                                                <div class="row items-center justify-end">
-                                                    <QBtn
-                                                        v-close-popup
-                                                        label="Close"
-                                                        color="primary"
-                                                        flat
-                                                    />
-                                                </div>
-                                            </QDate>
-                                        </QPopupProxy>
-                                    </QIcon>
-                                </template>
-                            </QInput>
-                        </div>
-                        <div class="col">
-                            <QInput
-                                :label="t('Operation date')"
-                                v-model="data.operated"
-                                mask="####-##-##"
-                                fill-mask="_"
-                                autofocus
+                        </template>
+                        <template #append>
+                            <QBtn
+                                :class="{
+                                    'no-pointer-events': editDownloadDisabled,
+                                }"
+                                :disable="editDownloadDisabled"
+                                v-if="data.dmsFk"
+                                icon="edit"
+                                round
+                                padding="xs"
+                                @click="setEditDms(data.dmsFk)"
                             >
-                                <template #append>
-                                    <QIcon name="event" class="cursor-pointer">
-                                        <QPopupProxy
-                                            cover
-                                            transition-show="scale"
-                                            transition-hide="scale"
-                                        >
-                                            <QDate
-                                                v-model="data.operated"
-                                                mask="YYYY-MM-DD"
-                                            >
-                                                <div class="row items-center justify-end">
-                                                    <QBtn
-                                                        v-close-popup
-                                                        label="Close"
-                                                        color="primary"
-                                                        flat
-                                                    />
-                                                </div>
-                                            </QDate>
-                                        </QPopupProxy>
-                                    </QIcon>
-                                </template>
-                            </QInput>
-                        </div>
-                    </div>
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <QInput
-                                :label="t('Undeductible VAT')"
-                                v-model="data.deductibleExpenseFk"
-                                clearable
-                                clear-icon="close"
-                            />
-                        </div>
-                        <div class="col">
-                            <QInput
-                                :label="t('Document')"
-                                v-model="data.dmsFk"
-                                clearable
-                                clear-icon="close"
-                                @update:model-value="checkFileExists(data.dmsFk)"
+                                <QTooltip>{{ t('Edit document') }}</QTooltip>
+                            </QBtn>
+                            <QBtn
+                                v-else
+                                icon="add_circle"
+                                round
+                                padding="xs"
+                                @click="setCreateDms()"
                             >
-                                <template #prepend>
-                                    <QBtn
-                                        v-if="data.dmsFk"
-                                        :class="{
-                                            'no-pointer-events': editDownloadDisabled,
-                                        }"
-                                        :disable="editDownloadDisabled"
-                                        icon="cloud_download"
-                                        :title="t('Download file')"
-                                        padding="xs"
-                                        round
-                                        @click="downloadFile(data.dmsFk)"
-                                    />
-                                </template>
-                                <template #append>
-                                    <QBtn
-                                        :class="{
-                                            'no-pointer-events': editDownloadDisabled,
-                                        }"
-                                        :disable="editDownloadDisabled"
-                                        v-if="data.dmsFk"
-                                        icon="edit"
-                                        round
-                                        padding="xs"
-                                        @click="setEditDms(data.dmsFk)"
-                                    >
-                                        <QTooltip>{{ t('Edit document') }}</QTooltip>
-                                    </QBtn>
-                                    <QBtn
-                                        v-else
-                                        icon="add_circle"
-                                        round
-                                        padding="xs"
-                                        @click="setCreateDms()"
-                                    >
-                                        <QTooltip>{{ t('Create document') }}</QTooltip>
-                                    </QBtn>
-                                </template>
-                            </QInput>
-                        </div>
-                    </div>
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <QInput
-                                :label="t('Entry date')"
-                                v-model="data.bookEntried"
-                                clearable
-                                clear-icon="close"
-                                mask="####-##-##"
-                                fill-mask="_"
-                            >
-                                <template #append>
-                                    <QIcon name="event" class="cursor-pointer">
-                                        <QPopupProxy
-                                            cover
-                                            transition-show="scale"
-                                            transition-hide="scale"
-                                        >
-                                            <QDate
-                                                v-model="data.bookEntried"
-                                                mask="YYYY-MM-DD"
-                                            >
-                                                <div class="row items-center justify-end">
-                                                    <QBtn
-                                                        v-close-popup
-                                                        label="Close"
-                                                        color="primary"
-                                                        flat
-                                                    />
-                                                </div>
-                                            </QDate>
-                                        </QPopupProxy>
-                                    </QIcon>
-                                </template>
-                            </QInput>
-                        </div>
-                        <div class="col">
-                            <QInput
-                                :label="t('Accounted date')"
-                                v-model="data.booked"
-                                clearable
-                                clear-icon="close"
-                                mask="####-##-##"
-                                fill-mask="_"
-                            >
-                                <template #append>
-                                    <QIcon name="event" class="cursor-pointer">
-                                        <QPopupProxy
-                                            cover
-                                            transition-show="scale"
-                                            transition-hide="scale"
-                                        >
-                                            <QDate
-                                                v-model="data.booked"
-                                                mask="YYYY-MM-DD"
-                                            >
-                                                <div class="row items-center justify-end">
-                                                    <QBtn
-                                                        v-close-popup
-                                                        label="Close"
-                                                        color="primary"
-                                                        flat
-                                                    />
-                                                </div>
-                                            </QDate>
-                                        </QPopupProxy>
-                                    </QIcon>
-                                </template>
-                            </QInput>
-                        </div>
-                    </div>
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <VnSelectFilter
-                                v-if="currenciesRef"
-                                :label="t('Currency')"
-                                v-model="data.currencyFk"
-                                :options="currencies"
-                                option-value="id"
-                                option-label="code"
-                                @input-value="currenciesRef.fetch()"
-                            />
-                        </div>
-                        <div class="col">
-                            <VnSelectFilter
-                                v-if="companiesRef"
-                                :label="t('Company')"
-                                v-model="data.companyFk"
-                                :options="companies"
-                                option-value="id"
-                                option-label="code"
-                                @input-value="companiesRef.fetch()"
-                            />
-                        </div>
-                    </div>
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <QCheckbox
-                                :label="t('invoiceIn.summary.booked')"
-                                v-model="data.isBooked"
-                            />
-                        </div>
-                        <div class="col"></div>
-                    </div>
-                </template>
-            </FormModel>
-        </QCard>
-    </div>
+                                <QTooltip>{{ t('Create document') }}</QTooltip>
+                            </QBtn>
+                        </template>
+                    </QInput>
+                </div>
+            </div>
+            <div class="row q-gutter-md q-mb-md">
+                <div class="col">
+                    <QInput
+                        :label="t('Entry date')"
+                        v-model="data.bookEntried"
+                        clearable
+                        clear-icon="close"
+                        mask="####-##-##"
+                        fill-mask="_"
+                    >
+                        <template #append>
+                            <QIcon name="event" class="cursor-pointer">
+                                <QPopupProxy
+                                    cover
+                                    transition-show="scale"
+                                    transition-hide="scale"
+                                >
+                                    <QDate v-model="data.bookEntried" mask="YYYY-MM-DD">
+                                        <div class="row items-center justify-end">
+                                            <QBtn
+                                                v-close-popup
+                                                label="Close"
+                                                color="primary"
+                                                flat
+                                            />
+                                        </div>
+                                    </QDate>
+                                </QPopupProxy>
+                            </QIcon>
+                        </template>
+                    </QInput>
+                </div>
+                <div class="col">
+                    <QInput
+                        :label="t('Accounted date')"
+                        v-model="data.booked"
+                        clearable
+                        clear-icon="close"
+                        mask="####-##-##"
+                        fill-mask="_"
+                    >
+                        <template #append>
+                            <QIcon name="event" class="cursor-pointer">
+                                <QPopupProxy
+                                    cover
+                                    transition-show="scale"
+                                    transition-hide="scale"
+                                >
+                                    <QDate v-model="data.booked" mask="YYYY-MM-DD">
+                                        <div class="row items-center justify-end">
+                                            <QBtn
+                                                v-close-popup
+                                                label="Close"
+                                                color="primary"
+                                                flat
+                                            />
+                                        </div>
+                                    </QDate>
+                                </QPopupProxy>
+                            </QIcon>
+                        </template>
+                    </QInput>
+                </div>
+            </div>
+            <div class="row q-gutter-md q-mb-md">
+                <div class="col">
+                    <VnSelectFilter
+                        v-if="currenciesRef"
+                        :label="t('Currency')"
+                        v-model="data.currencyFk"
+                        :options="currencies"
+                        option-value="id"
+                        option-label="code"
+                        @input-value="currenciesRef.fetch()"
+                    />
+                </div>
+                <div class="col">
+                    <VnSelectFilter
+                        v-if="companiesRef"
+                        :label="t('Company')"
+                        v-model="data.companyFk"
+                        :options="companies"
+                        option-value="id"
+                        option-label="code"
+                        @input-value="companiesRef.fetch()"
+                    />
+                </div>
+            </div>
+            <div class="row q-gutter-md q-mb-md">
+                <div class="col">
+                    <QCheckbox
+                        :label="t('invoiceIn.summary.booked')"
+                        v-model="data.isBooked"
+                    />
+                </div>
+                <div class="col"></div>
+            </div>
+        </template>
+    </FormModel>
     <QDialog ref="editDmsRef">
         <QCard>
             <QCardSection class="q-pb-none">
@@ -691,13 +675,12 @@ async function create() {
     </QDialog>
 </template>
 <style lang="scss" scoped>
-.column {
-    .q-card {
-        width: 100%;
-        max-width: 60em;
-    }
-}
 @media (max-width: $breakpoint-xs) {
+    .column {
+        .row:not(:last-child) {
+            flex-direction: column;
+        }
+    }
     .q-dialog {
         .q-card {
             &__section:not(:first-child) {
@@ -714,7 +697,7 @@ async function create() {
         supplierFk: Supplier
     es:
         supplierFk: Proveedor
-        Supplier Ref: Ref. proveedor
+        Supplier ref: Ref. proveedor
         Expedition date: Fecha expedición
         Operation date: Fecha operación
         Undeductible VAT: Iva no deducible
diff --git a/test/cypress/integration/invoiceInBasicData.spec.js b/test/cypress/integration/invoiceInBasicData.spec.js
new file mode 100644
index 000000000..e95fb0161
--- /dev/null
+++ b/test/cypress/integration/invoiceInBasicData.spec.js
@@ -0,0 +1,24 @@
+/// <reference types="cypress" />
+describe('InvoiceInBasicData', () => {
+    const selects = '.q-form .q-select';
+    const appendBtns = 'label button';
+    const saveBtn = '.q-btn-group > .q-btn--standard > .q-btn__content > .q-icon';
+
+    beforeEach(() => {
+        cy.login('developer');
+        cy.visit(`/#/invoice-in/1/basic-data`);
+    });
+
+    it('should edit the provideer and supplier ref', () => {
+        cy.get(selects).eq(0).click();
+        cy.get(selects).eq(0).type('Bros');
+        cy.get(selects).eq(0).type('{enter}');
+
+        cy.get(appendBtns).eq(0).click();
+        cy.get('input').eq(2).type(4739);
+        cy.get(saveBtn).click();
+
+        cy.get(`${selects} input`).eq(0).invoke('val').should('eq', 'Bros nick');
+        cy.get('input').eq(2).invoke('val').should('eq', 4739);
+    });
+});
diff --git a/test/cypress/integration/invoiceInList.spec.js b/test/cypress/integration/invoiceInList.spec.js
index 20b8403a3..98e5a96a1 100644
--- a/test/cypress/integration/invoiceInList.spec.js
+++ b/test/cypress/integration/invoiceInList.spec.js
@@ -23,5 +23,6 @@ describe('InvoiceInList', () => {
     it('should open the details', () => {
         cy.get(firstDetailBtn).click();
         cy.get(summaryHeaders).eq(1).contains('Basic Data');
+        cy.get(summaryHeaders).eq(5).contains('Vat');
     });
 });
diff --git a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js
new file mode 100644
index 000000000..f8daa99cd
--- /dev/null
+++ b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js
@@ -0,0 +1,46 @@
+import { vi, describe, expect, it, beforeAll } from 'vitest';
+import { createWrapper, axios } from 'app/test/vitest/helper';
+import InvoiceInBasicData from 'src/pages/InvoiceIn/Card/InvoiceInBasicData.vue';
+
+describe('InvoiceInBasicData', () => {
+    let vm;
+
+    beforeAll(() => {
+        vm = createWrapper(InvoiceInBasicData, {
+            global: {
+                stubs: [],
+                mocks: {
+                    fetch: vi.fn(),
+                },
+            },
+        }).vm;
+    });
+
+    it('should throw an error when data is empty', async () => {
+        vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
+        vi.spyOn(vm.quasar, 'notify');
+
+        await vm.edit();
+
+        expect(vm.quasar.notify).toHaveBeenCalledWith(
+            expect.objectContaining({
+                message: `The company can't be empty`,
+                type: 'negative',
+            })
+        );
+    });
+
+    it('should throw an error when data is empty', async () => {
+        vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
+        vi.spyOn(vm.quasar, 'notify');
+
+        await vm.create();
+
+        expect(vm.quasar.notify).toHaveBeenCalledWith(
+            expect.objectContaining({
+                message: `The company can't be empty`,
+                type: 'negative',
+            })
+        );
+    });
+});

From c31b4fa770e7cc19f778e82429178fd5c0239b01 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Thu, 9 Nov 2023 10:29:28 +0100
Subject: [PATCH 03/19] ref #5835 e2e & unit tests done

---
 cypress.config.js                             |  2 +-
 src/components/CrudModel.vue                  |  4 +
 src/css/app.scss                              |  2 +
 src/filters/toCurrency.js                     |  9 +--
 src/i18n/es/index.js                          |  2 +-
 .../InvoiceIn/Card/InvoiceInBasicData.vue     |  3 +-
 src/pages/InvoiceIn/Card/InvoiceInDueDay.vue  | 30 +++++---
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue | 75 ++++++++++++++++---
 src/pages/InvoiceIn/Card/InvoiceInVat.vue     | 15 ++--
 .../{ => claim}/claimDevelopment.spec.js      |  0
 .../{ => claim}/claimNotes.spec.js            |  0
 .../{ => claim}/claimPhoto.spec.js            |  0
 .../invoiceIn/invoiceInBasicData.spec.js      | 53 +++++++++++++
 .../invoiceIn/invoiceInDueDay.spec.js         | 29 +++++++
 .../invoiceIn/invoiceInIntrastat.spec.js      | 38 ++++++++++
 .../{ => invoiceIn}/invoiceInList.spec.js     |  0
 .../invoiceIn/invoiceInVat.spec.js            | 55 ++++++++++++++
 .../integration/invoiceInBasicData.spec.js    | 24 ------
 .../{ => ticket}/ticketBoxing.spec.js         |  0
 .../{ => wagon}/wagonCreate.spec.js           |  0
 .../{ => wagonType}/wagonTypeCreate.spec.js   |  0
 .../{ => worker}/workerList.spec.js           |  0
 .../workerNotificationsManager.spec.js        |  0
 .../{ => worker}/workerSummary.spec.js        |  0
 test/cypress/support/commands.js              | 33 +++++++-
 .../InvoiceIn/InvoiceInBasicData.spec.js      | 44 ++++++-----
 .../InvoiceIn/InvoiceInIntrastat.spec.js      | 34 +++++++++
 .../pages/InvoiceIn/InvoiceInVat.spec.js      | 75 +++++++++++++++++++
 28 files changed, 443 insertions(+), 84 deletions(-)
 rename test/cypress/integration/{ => claim}/claimDevelopment.spec.js (100%)
 rename test/cypress/integration/{ => claim}/claimNotes.spec.js (100%)
 rename test/cypress/integration/{ => claim}/claimPhoto.spec.js (100%)
 create mode 100644 test/cypress/integration/invoiceIn/invoiceInBasicData.spec.js
 create mode 100644 test/cypress/integration/invoiceIn/invoiceInDueDay.spec.js
 create mode 100644 test/cypress/integration/invoiceIn/invoiceInIntrastat.spec.js
 rename test/cypress/integration/{ => invoiceIn}/invoiceInList.spec.js (100%)
 create mode 100644 test/cypress/integration/invoiceIn/invoiceInVat.spec.js
 delete mode 100644 test/cypress/integration/invoiceInBasicData.spec.js
 rename test/cypress/integration/{ => ticket}/ticketBoxing.spec.js (100%)
 rename test/cypress/integration/{ => wagon}/wagonCreate.spec.js (100%)
 rename test/cypress/integration/{ => wagonType}/wagonTypeCreate.spec.js (100%)
 rename test/cypress/integration/{ => worker}/workerList.spec.js (100%)
 rename test/cypress/integration/{ => worker}/workerNotificationsManager.spec.js (100%)
 rename test/cypress/integration/{ => worker}/workerSummary.spec.js (100%)
 create mode 100644 test/vitest/__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js
 create mode 100644 test/vitest/__tests__/pages/InvoiceIn/InvoiceInVat.spec.js

diff --git a/cypress.config.js b/cypress.config.js
index 2b5b40d08..1934f833e 100644
--- a/cypress.config.js
+++ b/cypress.config.js
@@ -8,7 +8,7 @@ module.exports = defineConfig({
         supportFile: 'test/cypress/support/index.js',
         videosFolder: 'test/cypress/videos',
         video: false,
-        specPattern: 'test/cypress/integration/*.spec.js',
+        specPattern: 'test/cypress/integration/**/*.spec.js',
         experimentalRunAllSpecs: true,
         component: {
             componentFolder: 'src',
diff --git a/src/components/CrudModel.vue b/src/components/CrudModel.vue
index 2a4982fce..bd3a01304 100644
--- a/src/components/CrudModel.vue
+++ b/src/components/CrudModel.vue
@@ -135,6 +135,10 @@ async function saveChanges(data) {
     hasChanges.value = false;
     isLoading.value = false;
     emit('saveChanges', data);
+    quasar.notify({
+        type: 'positive',
+        message: t('globals.dataSaved'),
+    });
 }
 
 async function insert() {
diff --git a/src/css/app.scss b/src/css/app.scss
index 0f04c9ad8..3cc6f55c2 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -33,6 +33,7 @@ body.body--light {
     --vn-gray: #f5f5f5;
     --vn-label: #5f5f5f;
     --vn-dark: white;
+    --vn-light-gray: #e7e3e3;
 }
 
 body.body--dark {
@@ -40,6 +41,7 @@ body.body--dark {
     --vn-gray: #313131;
     --vn-label: #a8a8a8;
     --vn-dark: #292929;
+    --vn-light-gray: #424242;
 }
 
 .bg-vn-dark {
diff --git a/src/filters/toCurrency.js b/src/filters/toCurrency.js
index 5005e95bc..f820c0127 100644
--- a/src/filters/toCurrency.js
+++ b/src/filters/toCurrency.js
@@ -9,13 +9,10 @@ export default function (value, symbol = 'EUR', fractionSize = 2) {
         style: 'currency',
         currency: symbol,
         minimumFractionDigits: fractionSize,
-        maximumFractionDigits: fractionSize
+        maximumFractionDigits: fractionSize,
     };
 
     const lang = locale.value == 'es' ? 'de' : locale.value;
 
-    return new Intl.NumberFormat(lang, options)
-        .format(value);
-
-
-}
\ No newline at end of file
+    return new Intl.NumberFormat(lang, options).format(value);
+}
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index b7dc1c132..91ac748ee 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -422,7 +422,7 @@ export default {
             company: 'Empresa',
             customerCard: 'Ficha del cliente',
             ticketList: 'Listado de tickets',
-            vat: 'Vat',
+            vat: 'Iva',
             dueDay: 'Fecha de vencimiento',
         },
         summary: {
diff --git a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
index 3419492b7..0aee913a4 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
@@ -144,7 +144,6 @@ async function create() {
             type: 'positive',
         });
     } catch (error) {
-        console.log(error);
         quasar.notify({
             message: t(`${error.message}`),
             type: 'negative',
@@ -466,6 +465,8 @@ async function create() {
                         class="full-width q-pa-xs"
                         :label="t('Reference')"
                         v-model="dms.reference"
+                        clearable
+                        clear-icon="close"
                     />
                     <VnSelectFilter
                         class="full-width q-pa-xs"
diff --git a/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
index d657b09d0..ba6287c4d 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
@@ -2,6 +2,7 @@
 import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
+import axios from 'axios';
 import { toDate } from 'src/filters';
 import { useArrayData } from 'src/composables/useArrayData';
 import CrudModel from 'src/components/CrudModel.vue';
@@ -16,15 +17,14 @@ const invoiceIn = computed(() => arrayData.store.data);
 const rowsSelected = ref([]);
 const banks = ref([]);
 const invoiceInFormRef = ref();
+const invoiceId = route.params.id;
 
 const filter = {
     where: {
-        invoiceInFk: route.params.id,
+        invoiceInFk: invoiceId,
     },
 };
 
-const isNotEuro = (code) => code != 'EUR';
-
 const columns = computed(() => [
     {
         name: 'duedate',
@@ -63,6 +63,19 @@ const columns = computed(() => [
         align: 'left',
     },
 ]);
+
+const isNotEuro = (code) => code != 'EUR';
+const areRows = ref(null);
+
+async function insert() {
+    if (!areRows.value) {
+        await axios.post('/InvoiceInDueDays/new ', { id: Number(invoiceId) });
+        await invoiceInFormRef.value.reload();
+    }
+    if (areRows.value) {
+        invoiceInFormRef.value.insert();
+    }
+}
 </script>
 <template>
     <FetchData url="Banks" auto-load limit="30" @on-fetch="(data) => (banks = data)" />
@@ -73,8 +86,9 @@ const columns = computed(() => [
         url="InvoiceInDueDays"
         :filter="filter"
         auto-load
-        :data-required="{ invoiceInFk: route.params.id }"
+        :data-required="{ invoiceInFk: invoiceId }"
         v-model:selected="rowsSelected"
+        @on-fetch="(data) => (areRows = !!data.length)"
     >
         <template #body="{ rows }">
             <QTable
@@ -271,13 +285,7 @@ const columns = computed(() => [
         </template>
     </CrudModel>
     <QPageSticky position="bottom-right" :offset="[25, 25]">
-        <QBtn
-            color="primary"
-            icon="add"
-            size="lg"
-            round
-            @click="invoiceInFormRef.insert()"
-        />
+        <QBtn color="primary" icon="add" size="lg" round @click="insert" />
     </QPageSticky>
 </template>
 <style lang="scss" scoped></style>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
index 79cdab02d..6c3f0838c 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -29,6 +29,7 @@ const entityId = computed(() => $props.id || route.params.id);
 const salixUrl = ref();
 const invoiceInUrl = ref();
 const amountsNotMatch = ref(null);
+const intrastatTotals = ref({});
 
 const vatColumns = ref([
     {
@@ -74,7 +75,7 @@ const vatColumns = ref([
         name: 'currency',
         label: 'invoiceIn.summary.currency',
         field: (row) => row.foreignValue,
-        format: (value) => toCurrency(value),
+        format: (value) => value,
         sortable: true,
         align: 'left',
     },
@@ -138,7 +139,7 @@ const intrastatColumns = ref([
         align: 'left',
     },
     {
-        name: 'amount',
+        name: 'stems',
         label: 'invoiceIn.summary.stems',
         field: (row) => row.stems,
         format: (value) => value,
@@ -155,14 +156,29 @@ const intrastatColumns = ref([
     },
 ]);
 
-function setAmountNotMatch(entity) {
+function getAmountNotMatch(totals) {
+    return (
+        totals.totalDueDay != totals.totalTaxableBase &&
+        totals.totalDueDay != totals.totalVat
+    );
+}
+
+function getIntrastatTotals(intrastat) {
+    const totals = {};
+    totals.amount = intrastat.reduce((acc, cur) => acc + cur.amount, 0);
+    totals.net = intrastat.reduce((acc, cur) => acc + cur.net, 0);
+    totals.stems = intrastat.reduce((acc, cur) => acc + cur.stems, 0);
+
+    return totals;
+}
+
+function setData(entity) {
     if (!entity) return false;
 
-    const total = entity.totals;
+    amountsNotMatch.value = getAmountNotMatch(entity.totals);
 
-    amountsNotMatch.value =
-        total.totalDueDay != total.totalTaxableBase &&
-        total.totalDueDay != total.totalVat;
+    if (entity.invoiceInIntrastat.length)
+        intrastatTotals.value = { ...getIntrastatTotals(entity.invoiceInIntrastat) };
 }
 </script>
 
@@ -170,12 +186,13 @@ function setAmountNotMatch(entity) {
     <CardSummary
         ref="summary"
         :url="`InvoiceIns/${entityId}/summary`"
-        @on-fetch="(data) => setAmountNotMatch(data)"
+        @on-fetch="(data) => setData(data)"
     >
         <template #header="{ entity: invoiceIn }">
             <div>{{ invoiceIn.id }} - {{ invoiceIn.supplier.name }}</div>
         </template>
         <template #body="{ entity: invoiceIn }">
+            <!--Basic Data-->
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
                     <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
@@ -271,7 +288,7 @@ function setAmountNotMatch(entity) {
                     </QBtn>
                 </QCardSection>
                 <QCardSection class="q-pa-none">
-                    <div class="bordered q-px-sm">
+                    <div class="bordered q-px-sm q-mx-auto">
                         <VnLv
                             :label="t('invoiceIn.summary.taxableBase')"
                             :value="toCurrency(invoiceIn.totals.totalTaxableBase)"
@@ -336,6 +353,7 @@ function setAmountNotMatch(entity) {
                     :value="invoiceIn.isBooked"
                 />
             </QCard>
+            <!--Vat-->
             <QCard v-if="invoiceIn.invoiceInTax.length" class="vn-three">
                 <a class="header">
                     {{ t('invoiceIn.card.vat') }}
@@ -347,33 +365,54 @@ function setAmountNotMatch(entity) {
                     hide-pagination
                 >
                     <template #header="props">
-                        <QTr :props="props">
+                        <QTr :props="props" class="bg">
                             <QTh v-for="col in props.cols" :key="col.name" :props="props">
                                 {{ t(col.label) }}
                             </QTh>
                         </QTr>
                     </template>
+                    <template #bottom-row>
+                        <QTr class="bg">
+                            <QTd></QTd>
+                            <QTd>{{ toCurrency(invoiceIn.totals.totalTaxableBase) }}</QTd>
+                            <QTd></QTd>
+                            <QTd></QTd>
+                            <QTd></QTd>
+                            <QTd></QTd>
+                        </QTr>
+                    </template>
                 </QTable>
             </QCard>
+            <!--Due Day-->
             <QCard v-if="invoiceIn.invoiceInDueDay.length" class="vn-two">
                 <div class="header">
                     {{ t('invoiceIn.card.dueDay') }}
                 </div>
                 <QTable
+                    class="full-width"
                     :columns="dueDayColumns"
                     :rows="invoiceIn.invoiceInDueDay"
                     flat
                     hide-pagination
                 >
                     <template #header="props">
-                        <QTr :props="props">
+                        <QTr :props="props" class="bg">
                             <QTh v-for="col in props.cols" :key="col.name" :props="props">
                                 {{ t(col.label) }}
                             </QTh>
                         </QTr>
                     </template>
+                    <template #bottom-row>
+                        <QTr class="bg">
+                            <QTd></QTd>
+                            <QTd></QTd>
+                            <QTd>{{ toCurrency(invoiceIn.totals.totalDueDay) }}</QTd>
+                            <QTd></QTd>
+                        </QTr>
+                    </template>
                 </QTable>
             </QCard>
+            <!--Intrastat-->
             <QCard v-if="invoiceIn.invoiceInIntrastat.length">
                 <div class="header">
                     {{ t('invoiceIn.card.intrastat') }}
@@ -385,18 +424,30 @@ function setAmountNotMatch(entity) {
                     hide-pagination
                 >
                     <template #header="props">
-                        <QTr :props="props">
+                        <QTr :props="props" class="bg">
                             <QTh v-for="col in props.cols" :key="col.name" :props="props">
                                 {{ t(col.label) }}
                             </QTh>
                         </QTr>
                     </template>
+                    <template #bottom-row>
+                        <QTr class="bg">
+                            <QTd></QTd>
+                            <QTd>{{ toCurrency(intrastatTotals.amount) }}</QTd>
+                            <QTd>{{ intrastatTotals.net }}</QTd>
+                            <QTd>{{ intrastatTotals.stems }}</QTd>
+                            <QTd></QTd>
+                        </QTr>
+                    </template>
                 </QTable>
             </QCard>
         </template>
     </CardSummary>
 </template>
 <style lang="scss" scoped>
+.bg {
+    background-color: var(--vn-light-gray);
+}
 .bordered {
     border: 1px solid var(--vn-text);
     width: 16em;
diff --git a/src/pages/InvoiceIn/Card/InvoiceInVat.vue b/src/pages/InvoiceIn/Card/InvoiceInVat.vue
index 8a83dfbd4..eb613943a 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInVat.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInVat.vue
@@ -82,7 +82,7 @@ const columns = computed(() => [
         label: t('Rate'),
         sortable: true,
         tabIndex: 5,
-        field: (row) => taxRate(row, row.taxTypeSageFk),
+        field: (row) => toCurrency(taxRate(row, row.taxTypeSageFk)),
         align: 'left',
     },
     {
@@ -119,9 +119,9 @@ function taxRate(invoiceInTax, sageTaxTypeId) {
     const taxTypeSage = taxRateSelection && taxRateSelection.rate;
     const taxableBase = invoiceInTax && invoiceInTax.taxableBase;
     if (taxTypeSage && taxableBase) {
-        return toCurrency((taxTypeSage / 100) * taxableBase);
+        return (taxTypeSage / 100) * taxableBase;
     }
-    return toCurrency(0);
+    return 0;
 }
 
 async function addExpense() {
@@ -146,10 +146,11 @@ async function addExpense() {
             type: 'positive',
             message: t('globals.dataSaved'),
         });
+        newExpenseRef.value.hide();
     } catch (error) {
         quasar.notify({
             type: 'negative',
-            message: t(`${error}`),
+            message: t(`${error.message}`),
         });
     }
 }
@@ -394,7 +395,11 @@ async function addExpense() {
                                     </VnSelectFilter>
                                 </QItem>
                                 <QItem>
-                                    {{ taxRate(props.row, props.row.taxTypeSageFk) }}
+                                    {{
+                                        toCurrency(
+                                            taxRate(props.row, props.row.taxTypeSageFk)
+                                        )
+                                    }}
                                 </QItem>
                                 <QItem>
                                     <QInput
diff --git a/test/cypress/integration/claimDevelopment.spec.js b/test/cypress/integration/claim/claimDevelopment.spec.js
similarity index 100%
rename from test/cypress/integration/claimDevelopment.spec.js
rename to test/cypress/integration/claim/claimDevelopment.spec.js
diff --git a/test/cypress/integration/claimNotes.spec.js b/test/cypress/integration/claim/claimNotes.spec.js
similarity index 100%
rename from test/cypress/integration/claimNotes.spec.js
rename to test/cypress/integration/claim/claimNotes.spec.js
diff --git a/test/cypress/integration/claimPhoto.spec.js b/test/cypress/integration/claim/claimPhoto.spec.js
similarity index 100%
rename from test/cypress/integration/claimPhoto.spec.js
rename to test/cypress/integration/claim/claimPhoto.spec.js
diff --git a/test/cypress/integration/invoiceIn/invoiceInBasicData.spec.js b/test/cypress/integration/invoiceIn/invoiceInBasicData.spec.js
new file mode 100644
index 000000000..0013df343
--- /dev/null
+++ b/test/cypress/integration/invoiceIn/invoiceInBasicData.spec.js
@@ -0,0 +1,53 @@
+/// <reference types="cypress" />
+describe('InvoiceInBasicData', () => {
+    const selects = '.q-form .q-select';
+    const appendBtns = 'label button';
+    const dialogAppendBtns = '.q-dialog label button';
+    const dialogInputs = '.q-dialog input';
+    const dialogActionBtns = '.q-card__actions button';
+
+    beforeEach(() => {
+        cy.login('developer');
+        cy.visit(`/#/invoice-in/1/basic-data`);
+    });
+
+    it('should edit the provideer and supplier ref', () => {
+        cy.get(selects).eq(0).click();
+        cy.get(selects).eq(0).type('Bros');
+        cy.get(selects).eq(0).type('{enter}');
+
+        cy.get(appendBtns).eq(0).click();
+        cy.get('input').eq(2).type(4739);
+        cy.saveCard();
+
+        cy.get(`${selects} input`).eq(0).invoke('val').should('eq', 'Bros nick');
+        cy.get('input').eq(2).invoke('val').should('eq', '4739');
+    });
+
+    it('should edit the dms data', () => {
+        const firtsInput = 'Ticket:65';
+        const secondInput = "I don't know what posting here!";
+
+        cy.get(appendBtns).eq(3).click();
+        cy.get(dialogAppendBtns).eq(0).click();
+        cy.get(dialogInputs).eq(0).type(firtsInput);
+        cy.get(dialogAppendBtns).eq(1).click();
+        cy.get('textarea').type(secondInput);
+        cy.get(dialogActionBtns).eq(1).click();
+
+        cy.get(appendBtns).eq(3).click();
+
+        cy.get(dialogInputs).eq(0).invoke('val').should('eq', firtsInput);
+        cy.get('textarea').invoke('val').should('eq', secondInput);
+    });
+
+    it('should throw an error creating a new dms if a file is not attached', () => {
+        cy.get(appendBtns).eq(2).click();
+        cy.get(appendBtns).eq(1).click();
+        cy.get(dialogActionBtns).eq(1).click();
+        cy.get('.q-notification__message').should(
+            'have.text',
+            "The files can't be empty"
+        );
+    });
+});
diff --git a/test/cypress/integration/invoiceIn/invoiceInDueDay.spec.js b/test/cypress/integration/invoiceIn/invoiceInDueDay.spec.js
new file mode 100644
index 000000000..161e623c3
--- /dev/null
+++ b/test/cypress/integration/invoiceIn/invoiceInDueDay.spec.js
@@ -0,0 +1,29 @@
+/// <reference types="cypress" />
+describe('InvoiceInDueDay', () => {
+    const inputs = 'label input';
+    const inputBtns = 'label button';
+    const dialogBtns = '.q-dialog button';
+
+    beforeEach(() => {
+        cy.login('developer');
+        cy.visit(`/#/invoice-in/1/due-day`);
+    });
+
+    it('should update the amount', () => {
+        cy.get(inputBtns).eq(0).click();
+        cy.get(inputs).eq(3).type(23);
+        cy.saveCard();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
+
+    it('should add a new row ', () => {
+        cy.addRow();
+        cy.get(inputs).eq(11).type(8);
+        cy.saveCard();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
+
+    it('should remove the first line', () => {
+        cy.removeRow(1);
+    });
+});
diff --git a/test/cypress/integration/invoiceIn/invoiceInIntrastat.spec.js b/test/cypress/integration/invoiceIn/invoiceInIntrastat.spec.js
new file mode 100644
index 000000000..5024b2f1c
--- /dev/null
+++ b/test/cypress/integration/invoiceIn/invoiceInIntrastat.spec.js
@@ -0,0 +1,38 @@
+/// <reference types="cypress" />
+describe('InvoiceInIntrastat', () => {
+    const inputBtns = 'label button';
+    const thirdRow = 'tbody > :nth-child(3)';
+    const firstLineCode = 'tbody > :nth-child(1) > :nth-child(2)';
+
+    beforeEach(() => {
+        cy.login('developer');
+        cy.visit(`/#/invoice-in/1/intrastat`);
+    });
+
+    it('should edit the first line', () => {
+        cy.selectOption(firstLineCode, 'Plantas vivas: Esqueje/injerto, Vid');
+
+        cy.get(inputBtns).eq(1).click();
+
+        cy.saveCard();
+        cy.visit(`/#/invoice-in/1/intrastat`);
+
+        cy.getValue(firstLineCode).should(
+            'have.value',
+            'Plantas vivas: Esqueje/injerto, Vid'
+        );
+    });
+
+    it('should add a new row', () => {
+        const rowData = [false, 'Plantas vivas: Esqueje/injerto, Vid', 30, 10, 5, 'FR'];
+
+        cy.addRow();
+        cy.fillRow(thirdRow, rowData);
+        cy.saveCard();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
+
+    it('should remove the first line', () => {
+        cy.removeRow(1);
+    });
+});
diff --git a/test/cypress/integration/invoiceInList.spec.js b/test/cypress/integration/invoiceIn/invoiceInList.spec.js
similarity index 100%
rename from test/cypress/integration/invoiceInList.spec.js
rename to test/cypress/integration/invoiceIn/invoiceInList.spec.js
diff --git a/test/cypress/integration/invoiceIn/invoiceInVat.spec.js b/test/cypress/integration/invoiceIn/invoiceInVat.spec.js
new file mode 100644
index 000000000..26c7750ad
--- /dev/null
+++ b/test/cypress/integration/invoiceIn/invoiceInVat.spec.js
@@ -0,0 +1,55 @@
+/// <reference types="cypress" />
+describe('InvoiceInVat', () => {
+    const inputs = 'label input';
+    const inputBtns = 'label button';
+    const thirdRow = 'tbody > :nth-child(3)';
+    const firstLineVat = 'tbody > :nth-child(1) > :nth-child(4)';
+    const dialogInputs = '.q-dialog label input';
+    const dialogBtns = '.q-dialog button';
+    const randomInt = Math.floor(Math.random() * 100);
+
+    beforeEach(() => {
+        cy.login('developer');
+        cy.visit(`/#/invoice-in/1/vat`);
+    });
+
+    it('should edit the first line', () => {
+        cy.get(inputBtns).eq(1).click();
+        cy.get(inputs).eq(2).type(23);
+        cy.selectOption(firstLineVat, 'H.P. IVA 21% CEE');
+
+        cy.saveCard();
+        cy.visit(`/#/invoice-in/1/vat`);
+
+        cy.getValue(firstLineVat).should('have.value', 'H.P. IVA 21% CEE');
+    });
+
+    it('should add a new row', () => {
+        cy.addRow();
+        cy.fillRow(thirdRow, [true, 2000000001, 30, 'H.P. IVA 10']);
+        cy.saveCard();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
+
+    it('should remove the first line', () => {
+        cy.removeRow(1);
+    });
+
+    it('should throw an error if there are fields undefined', () => {
+        cy.get(inputBtns).eq(0).click();
+        cy.get(dialogBtns).eq(2).click();
+        cy.get('.q-notification__message').should('have.text', "The code can't be empty");
+    });
+
+    it('should correctly handle expense addition', () => {
+        cy.get(inputBtns).eq(0).click();
+
+        cy.get(dialogInputs).eq(0).click();
+        cy.get(dialogInputs).eq(0).type(randomInt);
+        cy.get(dialogInputs).eq(1).click();
+        cy.get(dialogInputs).eq(1).type('This is a dummy expense');
+
+        cy.get(dialogBtns).eq(2).click();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
+});
diff --git a/test/cypress/integration/invoiceInBasicData.spec.js b/test/cypress/integration/invoiceInBasicData.spec.js
deleted file mode 100644
index e95fb0161..000000000
--- a/test/cypress/integration/invoiceInBasicData.spec.js
+++ /dev/null
@@ -1,24 +0,0 @@
-/// <reference types="cypress" />
-describe('InvoiceInBasicData', () => {
-    const selects = '.q-form .q-select';
-    const appendBtns = 'label button';
-    const saveBtn = '.q-btn-group > .q-btn--standard > .q-btn__content > .q-icon';
-
-    beforeEach(() => {
-        cy.login('developer');
-        cy.visit(`/#/invoice-in/1/basic-data`);
-    });
-
-    it('should edit the provideer and supplier ref', () => {
-        cy.get(selects).eq(0).click();
-        cy.get(selects).eq(0).type('Bros');
-        cy.get(selects).eq(0).type('{enter}');
-
-        cy.get(appendBtns).eq(0).click();
-        cy.get('input').eq(2).type(4739);
-        cy.get(saveBtn).click();
-
-        cy.get(`${selects} input`).eq(0).invoke('val').should('eq', 'Bros nick');
-        cy.get('input').eq(2).invoke('val').should('eq', 4739);
-    });
-});
diff --git a/test/cypress/integration/ticketBoxing.spec.js b/test/cypress/integration/ticket/ticketBoxing.spec.js
similarity index 100%
rename from test/cypress/integration/ticketBoxing.spec.js
rename to test/cypress/integration/ticket/ticketBoxing.spec.js
diff --git a/test/cypress/integration/wagonCreate.spec.js b/test/cypress/integration/wagon/wagonCreate.spec.js
similarity index 100%
rename from test/cypress/integration/wagonCreate.spec.js
rename to test/cypress/integration/wagon/wagonCreate.spec.js
diff --git a/test/cypress/integration/wagonTypeCreate.spec.js b/test/cypress/integration/wagonType/wagonTypeCreate.spec.js
similarity index 100%
rename from test/cypress/integration/wagonTypeCreate.spec.js
rename to test/cypress/integration/wagonType/wagonTypeCreate.spec.js
diff --git a/test/cypress/integration/workerList.spec.js b/test/cypress/integration/worker/workerList.spec.js
similarity index 100%
rename from test/cypress/integration/workerList.spec.js
rename to test/cypress/integration/worker/workerList.spec.js
diff --git a/test/cypress/integration/workerNotificationsManager.spec.js b/test/cypress/integration/worker/workerNotificationsManager.spec.js
similarity index 100%
rename from test/cypress/integration/workerNotificationsManager.spec.js
rename to test/cypress/integration/worker/workerNotificationsManager.spec.js
diff --git a/test/cypress/integration/workerSummary.spec.js b/test/cypress/integration/worker/workerSummary.spec.js
similarity index 100%
rename from test/cypress/integration/workerSummary.spec.js
rename to test/cypress/integration/worker/workerSummary.spec.js
diff --git a/test/cypress/support/commands.js b/test/cypress/support/commands.js
index a725837a1..a0718ef57 100755
--- a/test/cypress/support/commands.js
+++ b/test/cypress/support/commands.js
@@ -104,14 +104,19 @@ Cypress.Commands.add('fillRow', (rowSelector, data) => {
             .then((td) => {
                 if (td.find('.q-select__dropdown-icon').length) {
                     cy.selectOption(td, value);
-                }
-                if (td.find('.q-checkbox__inner').length && value) {
+                } else if (td.find('.q-checkbox__inner').length && value) {
                     cy.checkOption(td);
-                }
+                } else if (td.find('input[type="text"]') && value)
+                    cy.get(td).find('input').type(value);
             });
     });
 });
 
+Cypress.Commands.add('addRow', () => {
+    cy.waitForElement('tbody');
+    cy.get('.q-page-sticky > div > .q-btn > .q-btn__content').click();
+});
+
 Cypress.Commands.add('validateRow', (rowSelector, expectedValues) => {
     cy.waitForElement('tbody');
     cy.get(rowSelector).within(() => {
@@ -126,4 +131,26 @@ Cypress.Commands.add('validateRow', (rowSelector, expectedValues) => {
         }
     });
 });
+
+Cypress.Commands.add('removeRow', (rowIndex) => {
+    let rowsBefore;
+    let rowsAfter;
+
+    cy.get('tr')
+        .its('length')
+        .then((length) => {
+            rowsBefore = length;
+            cy.get('.q-checkbox').eq(rowIndex).click();
+            cy.removeCard();
+            cy.get('.q-dialog button').eq(2).click();
+        })
+        .then(() => {
+            cy.get('tr')
+                .its('length')
+                .then((length) => {
+                    rowsAfter = length;
+                    expect(rowsBefore).to.eq(rowsAfter + 1);
+                });
+        });
+});
 // registerCommands();
diff --git a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js
index f8daa99cd..3e6d8f892 100644
--- a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js
+++ b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js
@@ -16,31 +16,35 @@ describe('InvoiceInBasicData', () => {
         }).vm;
     });
 
-    it('should throw an error when data is empty', async () => {
-        vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
-        vi.spyOn(vm.quasar, 'notify');
+    describe('edit()', () => {
+        it('should throw an error when data is empty', async () => {
+            vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
+            vi.spyOn(vm.quasar, 'notify');
 
-        await vm.edit();
+            await vm.edit();
 
-        expect(vm.quasar.notify).toHaveBeenCalledWith(
-            expect.objectContaining({
-                message: `The company can't be empty`,
-                type: 'negative',
-            })
-        );
+            expect(vm.quasar.notify).toHaveBeenCalledWith(
+                expect.objectContaining({
+                    message: `The company can't be empty`,
+                    type: 'negative',
+                })
+            );
+        });
     });
 
-    it('should throw an error when data is empty', async () => {
-        vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
-        vi.spyOn(vm.quasar, 'notify');
+    describe('create()', () => {
+        it('should throw an error when data is empty', async () => {
+            vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
+            vi.spyOn(vm.quasar, 'notify');
 
-        await vm.create();
+            await vm.create();
 
-        expect(vm.quasar.notify).toHaveBeenCalledWith(
-            expect.objectContaining({
-                message: `The company can't be empty`,
-                type: 'negative',
-            })
-        );
+            expect(vm.quasar.notify).toHaveBeenCalledWith(
+                expect.objectContaining({
+                    message: `The company can't be empty`,
+                    type: 'negative',
+                })
+            );
+        });
     });
 });
diff --git a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js
new file mode 100644
index 000000000..1622bf59e
--- /dev/null
+++ b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js
@@ -0,0 +1,34 @@
+import { vi, describe, expect, it, beforeAll } from 'vitest';
+import { createWrapper, axios } from 'app/test/vitest/helper';
+import InvoiceInIntrastat from 'src/pages/InvoiceIn/Card/InvoiceInIntrastat.vue';
+
+describe('InvoiceInIntrastat', () => {
+    let vm;
+
+    beforeAll(() => {
+        vi.spyOn(axios, 'get').mockResolvedValue({ data: [{}] });
+        vm = createWrapper(InvoiceInIntrastat, {
+            global: {
+                stubs: [],
+                mocks: {
+                    fetch: vi.fn(),
+                },
+            },
+        }).vm;
+    });
+
+    describe('getTotal()', () => {
+        it('should correctly handle the sum', () => {
+            vm.invoceInIntrastat = [
+                { amount: 10, stems: 162 },
+                { amount: 20, stems: 21 },
+            ];
+
+            const totalAmount = vm.getTotal('amount');
+            const totalStems = vm.getTotal('stems');
+
+            expect(totalAmount).toBe(10 + 20);
+            expect(totalStems).toBe(162 + 21);
+        });
+    });
+});
diff --git a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInVat.spec.js b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInVat.spec.js
new file mode 100644
index 000000000..6ea9d6a5b
--- /dev/null
+++ b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInVat.spec.js
@@ -0,0 +1,75 @@
+import { vi, describe, expect, it, beforeAll } from 'vitest';
+import { createWrapper, axios } from 'app/test/vitest/helper';
+import InvoiceInVat from 'src/pages/InvoiceIn/Card/InvoiceInVat.vue';
+
+describe('InvoiceInVat', () => {
+    let vm;
+
+    beforeAll(() => {
+        vm = createWrapper(InvoiceInVat, {
+            global: {
+                stubs: [],
+                mocks: {
+                    fetch: vi.fn(),
+                },
+            },
+        }).vm;
+    });
+
+    describe('addExpense()', () => {
+        beforeAll(() => {
+            vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
+            vi.spyOn(axios, 'get').mockResolvedValue({ data: [] });
+            vi.spyOn(vm.quasar, 'notify');
+        });
+
+        it('should throw an error when the code property is undefined', async () => {
+            await vm.addExpense();
+
+            expect(vm.quasar.notify).toHaveBeenCalledWith(
+                expect.objectContaining({
+                    message: `The code can't be empty`,
+                    type: 'negative',
+                })
+            );
+        });
+
+        it('should correctly handle expense addition', async () => {
+            vm.newExpense = {
+                code: 123,
+                isWithheld: false,
+                description: 'Descripción del gasto',
+            };
+
+            await vm.addExpense();
+            expect(vm.quasar.notify).toHaveBeenCalledWith(
+                expect.objectContaining({
+                    message: 'Data saved',
+                    type: 'positive',
+                })
+            );
+        });
+    });
+
+    describe('taxRate()', () => {
+        it('should correctly compute the tax rate', () => {
+            const invoiceInTax = { taxableBase: 100 };
+            const sageTaxTypeId = 1;
+            vm.sageTaxTypes = [
+                { id: 1, rate: 10 },
+                { id: 2, rate: 20 },
+            ];
+            const result = vm.taxRate(invoiceInTax, sageTaxTypeId);
+            expect(result).toBe((10 / 100) * 100);
+        });
+
+        it('should return 0 if there is not tax rate', () => {
+            const invoiceInTax = { taxableBase: 100 };
+            const sageTaxTypeId = 1;
+            vm.sageTaxTypes = [];
+
+            const result = vm.taxRate(invoiceInTax, sageTaxTypeId);
+            expect(result).toBe(0);
+        });
+    });
+});

From 46ee2a00753cbc3299968f0af981922fdd3d83c9 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Thu, 9 Nov 2023 13:26:03 +0100
Subject: [PATCH 04/19] ref #5835 fix test

---
 src/i18n/en/index.js                                     | 2 +-
 test/cypress/integration/invoiceIn/invoiceInList.spec.js | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index b3fb32d9b..e7052c4f2 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -396,7 +396,7 @@ export default {
             list: 'List',
             createInvoiceIn: 'Create invoice in',
             summary: 'Summary',
-            basicData: 'Basic Data',
+            basicData: 'Basic data',
             vat: 'VAT',
             dueDay: 'Due day',
             intrastat: 'Intrastat',
diff --git a/test/cypress/integration/invoiceIn/invoiceInList.spec.js b/test/cypress/integration/invoiceIn/invoiceInList.spec.js
index 98e5a96a1..bd722edab 100644
--- a/test/cypress/integration/invoiceIn/invoiceInList.spec.js
+++ b/test/cypress/integration/invoiceIn/invoiceInList.spec.js
@@ -22,7 +22,7 @@ describe('InvoiceInList', () => {
 
     it('should open the details', () => {
         cy.get(firstDetailBtn).click();
-        cy.get(summaryHeaders).eq(1).contains('Basic Data');
-        cy.get(summaryHeaders).eq(5).contains('Vat');
+        cy.get(summaryHeaders).eq(1).contains('Basic data');
+        cy.get(summaryHeaders).eq(4).contains('Vat');
     });
 });

From b6e8658de9a3d65fdeb5294243ab2760958eaeb9 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Thu, 9 Nov 2023 15:17:09 +0100
Subject: [PATCH 05/19] ref #5835 fix due-day

---
 src/pages/InvoiceIn/Card/InvoiceInDueDay.vue  | 10 ++-------
 .../invoiceIn/invoiceInDueDay.spec.js         | 21 ++++++++++---------
 2 files changed, 13 insertions(+), 18 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
index ba6287c4d..e047876f3 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
@@ -65,16 +65,10 @@ const columns = computed(() => [
 ]);
 
 const isNotEuro = (code) => code != 'EUR';
-const areRows = ref(null);
 
 async function insert() {
-    if (!areRows.value) {
-        await axios.post('/InvoiceInDueDays/new ', { id: Number(invoiceId) });
-        await invoiceInFormRef.value.reload();
-    }
-    if (areRows.value) {
-        invoiceInFormRef.value.insert();
-    }
+    await axios.post('/InvoiceInDueDays/new ', { id: Number(invoiceId) });
+    await invoiceInFormRef.value.reload();
 }
 </script>
 <template>
diff --git a/test/cypress/integration/invoiceIn/invoiceInDueDay.spec.js b/test/cypress/integration/invoiceIn/invoiceInDueDay.spec.js
index 161e623c3..ee5ffe08d 100644
--- a/test/cypress/integration/invoiceIn/invoiceInDueDay.spec.js
+++ b/test/cypress/integration/invoiceIn/invoiceInDueDay.spec.js
@@ -2,28 +2,29 @@
 describe('InvoiceInDueDay', () => {
     const inputs = 'label input';
     const inputBtns = 'label button';
-    const dialogBtns = '.q-dialog button';
+    const addBtn = '.q-page-sticky > div > .q-btn > .q-btn__content';
 
     beforeEach(() => {
         cy.login('developer');
-        cy.visit(`/#/invoice-in/1/due-day`);
+        cy.visit(`/#/invoice-in/6/due-day`);
     });
 
     it('should update the amount', () => {
-        cy.get(inputBtns).eq(0).click();
+        cy.get(inputBtns).eq(1).click();
         cy.get(inputs).eq(3).type(23);
         cy.saveCard();
         cy.get('.q-notification__message').should('have.text', 'Data saved');
     });
 
-    it('should add a new row ', () => {
-        cy.addRow();
-        cy.get(inputs).eq(11).type(8);
-        cy.saveCard();
-        cy.get('.q-notification__message').should('have.text', 'Data saved');
-    });
-
     it('should remove the first line', () => {
         cy.removeRow(1);
     });
+
+    it('should add a new row ', () => {
+        cy.waitForElement('thead');
+        cy.get(addBtn).click();
+
+        cy.saveCard();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
 });

From 195bd4c6d7ba1715f951b78c0361d6ec538ed521 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Wed, 22 Nov 2023 09:01:55 +0100
Subject: [PATCH 06/19] refs 5835 fix bordered box

---
 src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue | 2 +-
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
index f37852fbd..ca660ce36 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
@@ -23,7 +23,7 @@ const entityId = computed(() => {
     return $props.id || route.params.id;
 });
 const totalAmount = ref([]);
-// Cuando Carlossa acabe de crear la lógica de card, usar store arrayData en lugar de hacer el fetch en el descriptor
+
 const filter = {
     include: [
         {
diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
index 6c3f0838c..2bb3f3f0a 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -450,7 +450,7 @@ function setData(entity) {
 }
 .bordered {
     border: 1px solid var(--vn-text);
-    width: 16em;
+    width: 18em;
 }
 </style>
 <i18n>

From 7e7154525dc06d5062e992e592001f781536360a Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Wed, 22 Nov 2023 10:08:51 +0100
Subject: [PATCH 07/19] refs #5835 fix front test

---
 .../__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js
index 1622bf59e..55ca19d71 100644
--- a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js
+++ b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInIntrastat.spec.js
@@ -6,15 +6,15 @@ describe('InvoiceInIntrastat', () => {
     let vm;
 
     beforeAll(() => {
-        vi.spyOn(axios, 'get').mockResolvedValue({ data: [{}] });
         vm = createWrapper(InvoiceInIntrastat, {
             global: {
-                stubs: [],
+                stubs: ['vnPaginate'],
                 mocks: {
                     fetch: vi.fn(),
                 },
             },
         }).vm;
+        vi.spyOn(axios, 'get').mockResolvedValue({ data: [{}] });
     });
 
     describe('getTotal()', () => {

From 9388b873c6ce55c20c7fc2958e845e5785bebe57 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Wed, 22 Nov 2023 15:18:18 +0100
Subject: [PATCH 08/19] refs #5835 refactor basicData

---
 .../InvoiceIn/Card/InvoiceInBasicData.vue     | 83 ++++++++-----------
 .../InvoiceIn/InvoiceInBasicData.spec.js      | 20 +----
 2 files changed, 35 insertions(+), 68 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
index 0aee913a4..9f794b91a 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
@@ -50,14 +50,10 @@ async function checkFileExists(dmsId) {
 async function setEditDms(dmsId) {
     const { data } = await axios.get(`Dms/${dmsId}`);
     dms.value = {
-        id: data.id,
         warehouseId: data.warehouseFk,
         companyId: data.companyFk,
         dmsTypeId: data.dmsTypeFk,
-        reference: data.reference,
-        description: data.description,
-        hasFile: data.hasFile,
-        hasFileAttached: data.hasFileAttached,
+        ...data,
     };
 
     if (!allowedContentTypes.value.length) await allowTypesRef.value.fetch();
@@ -83,12 +79,21 @@ async function setCreateDms() {
     createDmsRef.value.show();
 }
 
-async function edit() {
+async function upsert() {
     try {
-        if (!dms.value.companyId) throw Error(t(`The company can't be empty`));
-        if (!dms.value.warehouseId) throw Error(t(`The warehouse can't be empty`));
-        if (!dms.value.dmsTypeId) throw Error(t(`The DMS Type can't be empty`));
-        if (!dms.value.description) throw Error(t(`The description can't be empty`));
+        const isEdit = !!dms.value.id;
+        const errors = {
+            companyId: `The company can't be empty`,
+            warehouseId: `The warehouse can't be empty`,
+            dmsTypeId: `The DMS Type can't be empty`,
+            description: `The description can't be empty`,
+        };
+
+        Object.keys(errors).forEach((key) => {
+            if (!dms.value[key]) throw Error(t(errors[key]));
+        });
+
+        if (!isEdit && !dms.value.files) throw Error(t(`The files can't be empty`));
 
         const formData = new FormData();
 
@@ -98,47 +103,25 @@ async function edit() {
             dms.value.hasFileAttached = true;
         }
 
-        const { data } = await axios.post(`dms/${dms.value.id}/updateFile`, formData, {
-            params: dms.value,
-        });
+        if (!isEdit) {
+            const { data } = await axios.post('Dms/uploadFile', formData, {
+                params: dms.value,
+            });
+            if (data.length) invoiceIn.value.dmsFk = data[0].id;
+            createDmsRef.value.hide();
+        } else if (isEdit) {
+            const { data } = await axios.post(
+                `dms/${dms.value.id}/updateFile`,
+                formData,
+                {
+                    params: dms.value,
+                }
+            );
 
-        if (data.length) invoiceIn.value.dmsFk = data[0].id;
-        editDmsRef.value.hide();
-
-        quasar.notify({
-            message: t('globals.dataSaved'),
-            type: 'positive',
-        });
-    } catch (error) {
-        quasar.notify({
-            message: t(`${error.message}`),
-            type: 'negative',
-        });
-    }
-}
-
-async function create() {
-    try {
-        if (!dms.value.companyId) throw Error(t(`The company can't be empty`));
-        if (!dms.value.warehouseId) throw Error(t(`The warehouse can't be empty`));
-        if (!dms.value.dmsTypeId) throw Error(t(`The DMS Type can't be empty`));
-        if (!dms.value.description) throw Error(t(`The description can't be empty`));
-        if (!dms.value.files) throw Error(t(`The files can't be empty`));
-
-        const formData = new FormData();
-
-        if (dms.value.files) {
-            for (let i = 0; i < dms.value.files.length; i++)
-                formData.append(dms.value.files[i].name, dms.value.files[i]);
-            dms.value.hasFileAttached = true;
+            if (data.length) invoiceIn.value.dmsFk = data[0].id;
+            editDmsRef.value.hide();
         }
 
-        const { data } = await axios.post('Dms/uploadFile', formData, {
-            params: dms.value,
-        });
-        if (data.length) invoiceIn.value.dmsFk = data[0].id;
-        editDmsRef.value.hide();
-
         quasar.notify({
             message: t('globals.dataSaved'),
             type: 'positive',
@@ -558,7 +541,7 @@ async function create() {
             </QCardSection>
             <QCardActions class="justify-end">
                 <QBtn flat :label="t('globals.close')" color="primary" v-close-popup />
-                <QBtn :label="t('globals.save')" color="primary" @click="edit" />
+                <QBtn :label="t('globals.save')" color="primary" @click="upsert" />
             </QCardActions>
         </QCard>
     </QDialog>
@@ -670,7 +653,7 @@ async function create() {
             </QCardSection>
             <QCardActions align="right">
                 <QBtn flat :label="t('globals.close')" color="primary" v-close-popup />
-                <QBtn :label="t('globals.save')" color="primary" @click="create()" />
+                <QBtn :label="t('globals.save')" color="primary" @click="upsert" />
             </QCardActions>
         </QCard>
     </QDialog>
diff --git a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js
index 3e6d8f892..a3c383f74 100644
--- a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js
+++ b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInBasicData.spec.js
@@ -16,28 +16,12 @@ describe('InvoiceInBasicData', () => {
         }).vm;
     });
 
-    describe('edit()', () => {
+    describe('upsert()', () => {
         it('should throw an error when data is empty', async () => {
             vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
             vi.spyOn(vm.quasar, 'notify');
 
-            await vm.edit();
-
-            expect(vm.quasar.notify).toHaveBeenCalledWith(
-                expect.objectContaining({
-                    message: `The company can't be empty`,
-                    type: 'negative',
-                })
-            );
-        });
-    });
-
-    describe('create()', () => {
-        it('should throw an error when data is empty', async () => {
-            vi.spyOn(axios, 'post').mockResolvedValue({ data: [] });
-            vi.spyOn(vm.quasar, 'notify');
-
-            await vm.create();
+            await vm.upsert();
 
             expect(vm.quasar.notify).toHaveBeenCalledWith(
                 expect.objectContaining({

From dfddde1d5c6a193bd4ea7befd6b205aa580103f8 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Wed, 22 Nov 2023 15:22:25 +0100
Subject: [PATCH 09/19] refs #5835 refactor upsert

---
 .../InvoiceIn/Card/InvoiceInBasicData.vue     | 19 ++++++-------------
 1 file changed, 6 insertions(+), 13 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
index 9f794b91a..b169339d4 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
@@ -102,23 +102,16 @@ async function upsert() {
                 formData.append(dms.value.files[i].name, dms.value.files[i]);
             dms.value.hasFileAttached = true;
         }
+        const url = !isEdit ? 'Dms/uploadFile' : `dms/${dms.value.id}/updateFile`;
+        const { data } = await axios.post(url, formData, {
+            params: dms.value,
+        });
+
+        if (data.length) invoiceIn.value.dmsFk = data[0].id;
 
         if (!isEdit) {
-            const { data } = await axios.post('Dms/uploadFile', formData, {
-                params: dms.value,
-            });
-            if (data.length) invoiceIn.value.dmsFk = data[0].id;
             createDmsRef.value.hide();
         } else if (isEdit) {
-            const { data } = await axios.post(
-                `dms/${dms.value.id}/updateFile`,
-                formData,
-                {
-                    params: dms.value,
-                }
-            );
-
-            if (data.length) invoiceIn.value.dmsFk = data[0].id;
             editDmsRef.value.hide();
         }
 

From d97f69456327c153b0defc6e46d9277269554513 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Thu, 23 Nov 2023 08:42:09 +0100
Subject: [PATCH 10/19] refs #5835 upsert refactor

---
 src/pages/InvoiceIn/Card/InvoiceInBasicData.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
index b169339d4..20144d8ca 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
@@ -102,7 +102,7 @@ async function upsert() {
                 formData.append(dms.value.files[i].name, dms.value.files[i]);
             dms.value.hasFileAttached = true;
         }
-        const url = !isEdit ? 'Dms/uploadFile' : `dms/${dms.value.id}/updateFile`;
+        const url = isEdit ? `dms/${dms.value.id}/updateFile` : 'Dms/uploadFile';
         const { data } = await axios.post(url, formData, {
             params: dms.value,
         });
@@ -111,7 +111,7 @@ async function upsert() {
 
         if (!isEdit) {
             createDmsRef.value.hide();
-        } else if (isEdit) {
+        } else {
             editDmsRef.value.hide();
         }
 

From b00cff8b0b5073e796a0eada1d4393cd342d4c6c Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 24 Nov 2023 10:08:51 +0100
Subject: [PATCH 11/19] refs #5835 refactor getTotals

---
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
index 2bb3f3f0a..d2855f56a 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -164,10 +164,11 @@ function getAmountNotMatch(totals) {
 }
 
 function getIntrastatTotals(intrastat) {
-    const totals = {};
-    totals.amount = intrastat.reduce((acc, cur) => acc + cur.amount, 0);
-    totals.net = intrastat.reduce((acc, cur) => acc + cur.net, 0);
-    totals.stems = intrastat.reduce((acc, cur) => acc + cur.stems, 0);
+    const totals = {
+        amount: intrastat.reduce((acc, cur) => acc + cur.amount, 0),
+        net: intrastat.reduce((acc, cur) => acc + cur.net, 0),
+        stems: intrastat.reduce((acc, cur) => acc + cur.stems, 0),
+    };
 
     return totals;
 }

From 7595c01293a52237c755bbec3c4db7e43fa9ec80 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 24 Nov 2023 11:09:12 +0100
Subject: [PATCH 12/19] refs #5835 fix InvoiceInDescriptor

---
 src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
index ca660ce36..016d2779c 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
@@ -75,6 +75,7 @@ function setData(entity) {
         :title="data.title"
         :subtitle="data.subtitle"
         @on-fetch="setData"
+        data-key="invoiceInData"
     >
         <template #body="{ entity }">
             <VnLv :label="t('invoiceIn.card.issued')" :value="toDate(entity.issued)" />

From 0282f8dde81153f24e686d6df1bb06f5315ae6c6 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Tue, 28 Nov 2023 12:05:39 +0100
Subject: [PATCH 13/19] refs #5835 rate fixed & options descriptor created

---
 src/components/common/SendEmailDialog.vue     |   7 +-
 src/components/common/VnSelectFilter.vue      |   1 +
 src/components/ui/CardDescriptor.vue          |   4 +
 src/i18n/es/index.js                          |   4 +-
 src/pages/Claim/Card/ClaimDescriptorMenu.vue  |   2 +-
 .../InvoiceIn/Card/InvoiceInDescriptor.vue    | 268 +++++++++++++++++-
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue |  91 ++----
 .../{ => claim}/claimAction.spec.js           |   0
 8 files changed, 293 insertions(+), 84 deletions(-)
 rename test/cypress/integration/{ => claim}/claimAction.spec.js (100%)

diff --git a/src/components/common/SendEmailDialog.vue b/src/components/common/SendEmailDialog.vue
index ab83c0949..0f574a795 100644
--- a/src/components/common/SendEmailDialog.vue
+++ b/src/components/common/SendEmailDialog.vue
@@ -24,12 +24,13 @@ const address = ref(props.data.address);
 const isLoading = ref(false);
 
 async function confirm() {
-    const response = { address };
-
+    const response = { address: address.value };
     if (props.promise) {
         isLoading.value = true;
+        const { address: _address, ...restData } = props.data;
+
         try {
-            Object.assign(response, props.data);
+            Object.assign(response, restData);
             await props.promise(response);
         } finally {
             isLoading.value = false;
diff --git a/src/components/common/VnSelectFilter.vue b/src/components/common/VnSelectFilter.vue
index f6400fb4f..b808f1a8a 100644
--- a/src/components/common/VnSelectFilter.vue
+++ b/src/components/common/VnSelectFilter.vue
@@ -89,6 +89,7 @@ const value = computed({
         map-options
         use-input
         @filter="filterHandler"
+        hide-selected
         fill-input
         ref="vnSelectRef"
     >
diff --git a/src/components/ui/CardDescriptor.vue b/src/components/ui/CardDescriptor.vue
index eef2e020b..499c95beb 100644
--- a/src/components/ui/CardDescriptor.vue
+++ b/src/components/ui/CardDescriptor.vue
@@ -35,6 +35,10 @@ const $props = defineProps({
 const slots = useSlots();
 const { t } = useI18n();
 const entity = computed(() => useArrayData($props.dataKey).store.data);
+
+defineExpose({
+    getData,
+});
 onMounted(async () => {
     await getData();
     watch(
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index 4f946ffcc..d4deed5ee 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -427,8 +427,8 @@ export default {
             dueDay: 'Fecha de vencimiento',
         },
         summary: {
-            supplier: 'Supplier',
-            supplierRef: 'Supplier ref.',
+            supplier: 'Proveedor',
+            supplierRef: 'Ref. proveedor',
             currency: 'Divisa',
             docNumber: 'Número documento',
             issued: 'Fecha de expedición',
diff --git a/src/pages/Claim/Card/ClaimDescriptorMenu.vue b/src/pages/Claim/Card/ClaimDescriptorMenu.vue
index 5688613d6..d88c3d120 100644
--- a/src/pages/Claim/Card/ClaimDescriptorMenu.vue
+++ b/src/pages/Claim/Card/ClaimDescriptorMenu.vue
@@ -37,7 +37,7 @@ function confirmPickupOrder() {
             data: {
                 address: customer.email,
             },
-            send: sendPickupOrder,
+            promise: sendPickupOrder,
         },
     });
 }
diff --git a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
index 016d2779c..c70568c1b 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
@@ -1,12 +1,20 @@
 <script setup>
 import { ref, computed } from 'vue';
-import { useRoute } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
+import axios from 'axios';
 import { toCurrency, toDate } from 'src/filters';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
-import VnLv from 'src/components/ui/VnLv.vue';
+import { useRole } from 'src/composables/useRole';
 import useCardDescription from 'src/composables/useCardDescription';
+import { downloadFile } from 'src/composables/downloadFile';
+import { useArrayData } from 'src/composables/useArrayData';
+import { usePrintService } from 'composables/usePrintService';
+import VnLv from 'src/components/ui/VnLv.vue';
+import CardDescriptor from 'components/ui/CardDescriptor.vue';
 import FetchData from 'src/components/FetchData.vue';
+import SendEmailDialog from 'components/common/SendEmailDialog.vue';
+import VnConfirm from 'src/components/ui/VnConfirm.vue';
 
 const $props = defineProps({
     id: {
@@ -17,13 +25,41 @@ const $props = defineProps({
 });
 
 const route = useRoute();
+const router = useRouter();
+const quasar = useQuasar();
+const { hasAny } = useRole();
 const { t } = useI18n();
+const { openReport, sendEmail } = usePrintService();
+const arrayData = useArrayData('InvoiceIn');
 
-const entityId = computed(() => {
-    return $props.id || route.params.id;
-});
-const totalAmount = ref([]);
+const invoiceIn = computed(() => arrayData.store.data);
+const cardDescriptorRef = ref();
+const entityId = computed(() => $props.id || route.params.id);
+const totalAmount = ref();
+const currentAction = ref();
+const config = ref();
 
+const actions = {
+    book: {
+        title: 'Are you sure you want to book this invoice?',
+        cb: checkToBook,
+        action: toBook,
+    },
+    delete: {
+        title: 'Are you sure you want to delete this invoice?',
+        action: deleteInvoice,
+    },
+    clone: {
+        title: 'Are you sure you want to clone this invoice?',
+        action: cloneInvoice,
+    },
+    showPdf: {
+        cb: showPdfInvoice,
+    },
+    sendPdf: {
+        cb: sendPdfInvoiceConfirmation,
+    },
+};
 const filter = {
     include: [
         {
@@ -52,23 +88,130 @@ const filter = {
 };
 
 const data = ref(useCardDescription());
-function setData(entity) {
+
+async function setData(entity) {
     data.value = useCardDescription(entity.supplierRef, entity.id);
+    const { totalDueDay } = await getTotals();
+    totalAmount.value = totalDueDay;
+}
+
+async function getTotals() {
+    const { data } = await axios.get(`InvoiceIns/${entityId.value}/getTotals`);
+    return data;
+}
+
+function openDialog() {
+    quasar.dialog({
+        component: VnConfirm,
+        componentProps: {
+            title: currentAction.value.title,
+            promise: currentAction.value.action,
+        },
+    });
+}
+
+async function checkToBook() {
+    let directBooking = true;
+
+    const totals = await getTotals();
+    const taxableBaseNotEqualDueDay = totals.totalDueDay != totals.totalTaxableBase;
+    const vatNotEqualDueDay = totals.totalDueDay != totals.totalVat;
+
+    if (taxableBaseNotEqualDueDay && vatNotEqualDueDay) directBooking = false;
+
+    const { data: dueDaysCount } = await axios.get('InvoiceInDueDays/count', {
+        where: {
+            invoiceInFk: entityId.value,
+            dueDated: { gte: Date.vnNew() },
+        },
+    });
+
+    if (dueDaysCount) directBooking = false;
+
+    if (!directBooking) openDialog();
+    else toBook();
+}
+
+async function toBook() {
+    await axios.post(`InvoiceIns/${entityId.value}/toBook`);
+
+    // Pendiente de sincronizar todo con arrayData
+    quasar.notify({
+        type: 'positive',
+        message: t('globals.dataSaved'),
+    });
+
+    await cardDescriptorRef.value.getData();
+    setTimeout(() => location.reload(), 500);
+}
+
+async function deleteInvoice() {
+    await axios.delete(`InvoiceIns/${entityId.value}`);
+    quasar.notify({
+        type: 'positive',
+        message: t('Invoice deleted'),
+    });
+    router.push({ path: '/invoice-in' });
+}
+
+async function cloneInvoice() {
+    const { data } = await axios.post(`InvoiceIns/${entityId.value}/clone`);
+    quasar.notify({
+        type: 'positive',
+        message: t('Invoice cloned'),
+    });
+    router.push({ path: `/invoice-in/${data.id}/summary` });
+}
+
+const isAgricultural = () =>
+    invoiceIn.value.supplier.sageWithholdingFk == config.value[0].sageWithholdingFk;
+
+function showPdfInvoice() {
+    if (isAgricultural()) openReport(`InvoiceIns/${entityId.value}/invoice-in-pdf`);
+}
+
+function sendPdfInvoiceConfirmation() {
+    quasar.dialog({
+        component: SendEmailDialog,
+        componentProps: {
+            data: {
+                address: invoiceIn.value.supplier.contacts[0].email,
+            },
+            promise: sendPdfInvoice,
+        },
+    });
+}
+
+function sendPdfInvoice({ address }) {
+    if (!address)
+        quasar.notify({
+            type: 'negative',
+            message: t(`The email can't be empty`),
+        });
+    else
+        return sendEmail(`InvoiceIns/${entityId.value}/invoice-in-email`, {
+            recipientId: invoiceIn.value.supplier.id,
+            recipient: address,
+        });
+}
+
+function triggerMenu(type) {
+    currentAction.value = actions[type];
+    if (currentAction.value.cb) currentAction.value.cb();
+    else openDialog(type);
 }
 </script>
 
 <template>
-    <!--Refactor para añadir en el arrayData-->
     <FetchData
-        :url="`InvoiceIns/${entityId}/getTotals`"
-        @on-fetch="
-            (data) => {
-                totalAmount = data.totalDueDay;
-            }
-        "
+        url="InvoiceInConfigs"
+        :where="{ fields: ['sageWithholdingFk'] }"
         auto-load
+        @on-fetch="(data) => (config = data)"
     />
+    <!--Refactor para añadir en el arrayData-->
     <CardDescriptor
+        ref="cardDescriptorRef"
         module="InvoiceIn"
         :url="`InvoiceIns/${entityId}`"
         :filter="filter"
@@ -77,6 +220,79 @@ function setData(entity) {
         @on-fetch="setData"
         data-key="invoiceInData"
     >
+        <template #menu="{ entity }">
+            <QItem
+                v-if="!entity.isBooked && hasAny(['administrative'])"
+                v-ripple
+                clickable
+                @click="triggerMenu('book')"
+            >
+                <QItemSection avatar>
+                    <QIcon name="summarize" />
+                </QItemSection>
+                <QItemSection>{{ t('To book') }}</QItemSection>
+            </QItem>
+            <QSeparator />
+            <QItem
+                v-if="hasAny(['administrative'])"
+                v-ripple
+                clickable
+                @click="triggerMenu('delete')"
+            >
+                <QItemSection avatar>
+                    <QIcon name="delete" />
+                </QItemSection>
+                <QItemSection>{{ t('Delete invoice') }}</QItemSection>
+            </QItem>
+            <QSeparator />
+            <QItem
+                v-if="hasAny(['administrative'])"
+                v-ripple
+                clickable
+                @click="triggerMenu('clone')"
+            >
+                <QItemSection avatar>
+                    <QIcon name="file_copy" />
+                </QItemSection>
+                <QItemSection>{{ t('Clone invoice') }}</QItemSection>
+            </QItem>
+            <QSeparator />
+            <QItem
+                v-if="isAgricultural()"
+                v-ripple
+                clickable
+                @click="triggerMenu('showPdf')"
+            >
+                <QItemSection avatar>
+                    <QIcon name="picture_as_pdf" />
+                </QItemSection>
+                <QItemSection>{{ t('Show agricultural receipt as PDF') }}</QItemSection>
+            </QItem>
+            <QSeparator />
+            <QItem
+                v-if="isAgricultural()"
+                v-ripple
+                clickable
+                @click="triggerMenu('sendPdf')"
+            >
+                <QItemSection avatar>
+                    <QIcon name="mail" />
+                </QItemSection>
+                <QItemSection>{{ t('Send agricultural receipt as PDF') }}</QItemSection>
+            </QItem>
+            <QSeparator />
+            <QItem
+                v-if="entity.dmsFk"
+                v-ripple
+                clickable
+                @click="downloadFile(entity.dmsFk)"
+            >
+                <QItemSection avatar>
+                    <QIcon name="cloud_download" />
+                </QItemSection>
+                <QItemSection>{{ t('components.smartCard.downloadFile') }}</QItemSection>
+            </QItem>
+        </template>
         <template #body="{ entity }">
             <VnLv :label="t('invoiceIn.card.issued')" :value="toDate(entity.issued)" />
             <VnLv :label="t('invoiceIn.summary.booked')" :value="toDate(entity.booked)" />
@@ -107,3 +323,25 @@ function setData(entity) {
         </template>
     </CardDescriptor>
 </template>
+<style lang="scss" scoped>
+.q-dialog {
+    .q-card {
+        width: 35em;
+        max-width: 35em;
+    }
+}
+</style>
+<i18n>
+es:
+    To book: Contabilizar
+    Are you sure you want to book this invoice?: Estas seguro de querer asentar esta factura?
+    Delete invoice: Eliminar factura
+    Are you sure you want to delete this invoice?:  Estas seguro de querer eliminar esta factura?
+    Invoice deleted: Factura eliminada
+    Clone invoice: Clonar factura
+    Invoice cloned: Factura clonada
+    Show agricultural receipt as PDF: Ver recibo agrícola como PDF
+    Send agricultural receipt as PDF: Enviar recibo agrícola como PDF
+    Are you sure you want to send it?: Estás seguro que quieres enviarlo?
+    Send PDF invoice: Enviar factura a PDF
+</i18n>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
index d2855f56a..9c377e241 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -4,8 +4,6 @@ import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { toCurrency, toDate } from 'src/filters';
 import { getUrl } from 'src/composables/getUrl';
-import { downloadFile } from 'src/composables/downloadFile';
-
 import CardSummary from 'components/ui/CardSummary.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 
@@ -66,8 +64,8 @@ const vatColumns = ref([
     {
         name: 'rate',
         label: 'invoiceIn.summary.rate',
-        field: (row) => row.taxRate,
-        format: (value) => value,
+        field: (row) => taxRate(row.taxableBase, row.taxTypeSage?.rate),
+        format: (value) => toCurrency(value),
         sortable: true,
         align: 'left',
     },
@@ -173,6 +171,13 @@ function getIntrastatTotals(intrastat) {
     return totals;
 }
 
+function getTaxTotal(tax) {
+    return tax.reduce(
+        (acc, cur) => acc + taxRate(cur.taxableBase, cur.taxTypeSage?.rate),
+        0
+    );
+}
+
 function setData(entity) {
     if (!entity) return false;
 
@@ -181,6 +186,13 @@ function setData(entity) {
     if (entity.invoiceInIntrastat.length)
         intrastatTotals.value = { ...getIntrastatTotals(entity.invoiceInIntrastat) };
 }
+
+function taxRate(taxableBase, rate) {
+    if (rate && taxableBase) {
+        return (rate / 100) * taxableBase;
+    }
+    return 0;
+}
 </script>
 
 <template>
@@ -200,19 +212,6 @@ function setData(entity) {
                         {{ t('invoiceIn.pageTitles.basicData') }}
                         <QIcon name="open_in_new" color="primary" />
                     </a>
-                    <QBtn
-                        class="q-ml-sm"
-                        padding="xs"
-                        flat
-                        color="primary"
-                        round
-                        icon="cloud_download"
-                        @click.stop="downloadFile(invoiceIn.dmsFk)"
-                    >
-                        <QTooltip>
-                            {{ t('components.smartCard.downloadFile') }}
-                        </QTooltip>
-                    </QBtn>
                 </QCardSection>
                 <VnLv
                     :label="t('invoiceIn.summary.supplier')"
@@ -237,19 +236,6 @@ function setData(entity) {
                         {{ t('invoiceIn.pageTitles.basicData') }}
                         <QIcon name="open_in_new" color="primary" />
                     </a>
-                    <QBtn
-                        class="q-ml-sm"
-                        padding="xs"
-                        flat
-                        color="primary"
-                        round
-                        icon="cloud_download"
-                        @click.stop="downloadFile(invoiceIn.dmsFk)"
-                    >
-                        <QTooltip>
-                            {{ t('components.smartCard.downloadFile') }}
-                        </QTooltip>
-                    </QBtn>
                 </QCardSection>
                 <VnLv
                     :label="t('invoiceIn.summary.issued')"
@@ -274,19 +260,6 @@ function setData(entity) {
                         {{ t('invoiceIn.pageTitles.basicData') }}
                         <QIcon name="open_in_new" color="primary" />
                     </a>
-                    <QBtn
-                        class="q-ml-sm"
-                        padding="xs"
-                        flat
-                        color="primary"
-                        round
-                        icon="cloud_download"
-                        @click.stop="downloadFile(invoiceIn.dmsFk)"
-                    >
-                        <QTooltip>
-                            {{ t('components.smartCard.downloadFile') }}
-                        </QTooltip>
-                    </QBtn>
                 </QCardSection>
                 <QCardSection class="q-pa-none">
                     <div class="bordered q-px-sm q-mx-auto">
@@ -323,19 +296,6 @@ function setData(entity) {
                         {{ t('invoiceIn.pageTitles.basicData') }}
                         <QIcon name="open_in_new" color="primary" />
                     </a>
-                    <QBtn
-                        class="q-ml-sm"
-                        padding="xs"
-                        flat
-                        color="primary"
-                        round
-                        icon="cloud_download"
-                        @click.stop="downloadFile(invoiceIn.dmsFk)"
-                    >
-                        <QTooltip>
-                            {{ t('components.smartCard.downloadFile') }}
-                        </QTooltip>
-                    </QBtn>
                 </QCardSection>
                 <VnLv
                     :label="t('invoiceIn.summary.sage')"
@@ -356,8 +316,9 @@ function setData(entity) {
             </QCard>
             <!--Vat-->
             <QCard v-if="invoiceIn.invoiceInTax.length" class="vn-three">
-                <a class="header">
+                <a class="header" :href="`#/invoice-in/${entityId}/vat`">
                     {{ t('invoiceIn.card.vat') }}
+                    <QIcon name="open_in_new" color="primary" />
                 </a>
                 <QTable
                     :columns="vatColumns"
@@ -378,7 +339,9 @@ function setData(entity) {
                             <QTd>{{ toCurrency(invoiceIn.totals.totalTaxableBase) }}</QTd>
                             <QTd></QTd>
                             <QTd></QTd>
-                            <QTd></QTd>
+                            <QTd>{{
+                                toCurrency(getTaxTotal(invoiceIn.invoiceInTax))
+                            }}</QTd>
                             <QTd></QTd>
                         </QTr>
                     </template>
@@ -386,9 +349,10 @@ function setData(entity) {
             </QCard>
             <!--Due Day-->
             <QCard v-if="invoiceIn.invoiceInDueDay.length" class="vn-two">
-                <div class="header">
+                <a class="header" :href="`#/invoice-in/${entityId}/due-day`">
                     {{ t('invoiceIn.card.dueDay') }}
-                </div>
+                    <QIcon name="open_in_new" color="primary" />
+                </a>
                 <QTable
                     class="full-width"
                     :columns="dueDayColumns"
@@ -415,9 +379,10 @@ function setData(entity) {
             </QCard>
             <!--Intrastat-->
             <QCard v-if="invoiceIn.invoiceInIntrastat.length">
-                <div class="header">
+                <a class="header" :href="`#/invoice-in/${entityId}/intrastat`">
                     {{ t('invoiceIn.card.intrastat') }}
-                </div>
+                    <QIcon name="open_in_new" color="primary" />
+                </a>
                 <QTable
                     :columns="intrastatColumns"
                     :rows="invoiceIn.invoiceInIntrastat"
@@ -451,7 +416,7 @@ function setData(entity) {
 }
 .bordered {
     border: 1px solid var(--vn-text);
-    width: 18em;
+    max-width: 18em;
 }
 </style>
 <i18n>
diff --git a/test/cypress/integration/claimAction.spec.js b/test/cypress/integration/claim/claimAction.spec.js
similarity index 100%
rename from test/cypress/integration/claimAction.spec.js
rename to test/cypress/integration/claim/claimAction.spec.js

From 8d0403683657cfeb295769b2d54214296e30ce90 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 1 Dec 2023 08:28:05 +0100
Subject: [PATCH 14/19] refs #5835 change descriptor menu style

---
 .../InvoiceIn/Card/InvoiceInDescriptor.vue    | 27 +++----------------
 1 file changed, 3 insertions(+), 24 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
index c70568c1b..08df18e12 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
@@ -227,69 +227,48 @@ function triggerMenu(type) {
                 clickable
                 @click="triggerMenu('book')"
             >
-                <QItemSection avatar>
-                    <QIcon name="summarize" />
-                </QItemSection>
                 <QItemSection>{{ t('To book') }}</QItemSection>
             </QItem>
-            <QSeparator />
             <QItem
                 v-if="hasAny(['administrative'])"
                 v-ripple
                 clickable
                 @click="triggerMenu('delete')"
             >
-                <QItemSection avatar>
-                    <QIcon name="delete" />
-                </QItemSection>
                 <QItemSection>{{ t('Delete invoice') }}</QItemSection>
             </QItem>
-            <QSeparator />
             <QItem
                 v-if="hasAny(['administrative'])"
                 v-ripple
                 clickable
                 @click="triggerMenu('clone')"
             >
-                <QItemSection avatar>
-                    <QIcon name="file_copy" />
-                </QItemSection>
                 <QItemSection>{{ t('Clone invoice') }}</QItemSection>
             </QItem>
-            <QSeparator />
             <QItem
                 v-if="isAgricultural()"
                 v-ripple
                 clickable
                 @click="triggerMenu('showPdf')"
             >
-                <QItemSection avatar>
-                    <QIcon name="picture_as_pdf" />
-                </QItemSection>
                 <QItemSection>{{ t('Show agricultural receipt as PDF') }}</QItemSection>
             </QItem>
-            <QSeparator />
             <QItem
                 v-if="isAgricultural()"
                 v-ripple
                 clickable
                 @click="triggerMenu('sendPdf')"
             >
-                <QItemSection avatar>
-                    <QIcon name="mail" />
-                </QItemSection>
-                <QItemSection>{{ t('Send agricultural receipt as PDF') }}</QItemSection>
+                <QItemSection
+                    >{{ t('Send agricultural receipt as PDF') }}...</QItemSection
+                >
             </QItem>
-            <QSeparator />
             <QItem
                 v-if="entity.dmsFk"
                 v-ripple
                 clickable
                 @click="downloadFile(entity.dmsFk)"
             >
-                <QItemSection avatar>
-                    <QIcon name="cloud_download" />
-                </QItemSection>
                 <QItemSection>{{ t('components.smartCard.downloadFile') }}</QItemSection>
             </QItem>
         </template>

From 3d046e4bf760c19758b4482add89494d41fa872c Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 4 Dec 2023 14:21:29 +0100
Subject: [PATCH 15/19] refs #5835 summary grid updated

---
 src/components/ui/CardSummary.vue             |  3 +-
 src/components/ui/VnLv.vue                    |  8 ++-
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue | 53 ++++++++++---------
 3 files changed, 36 insertions(+), 28 deletions(-)

diff --git a/src/components/ui/CardSummary.vue b/src/components/ui/CardSummary.vue
index b54e44398..dc749f4a7 100644
--- a/src/components/ui/CardSummary.vue
+++ b/src/components/ui/CardSummary.vue
@@ -82,11 +82,13 @@ watch(props, async () => {
     .summaryBody {
         display: flex;
         flex-direction: row;
+        flex-wrap: wrap;
         justify-content: space-evenly;
         gap: 15px;
         padding: 15px;
 
         > .q-card.vn-one {
+            width: 350px;
             flex: 1;
         }
         > .q-card.vn-two {
@@ -123,7 +125,6 @@ watch(props, async () => {
                     width: max-content;
                     overflow: hidden;
                     white-space: nowrap;
-                    text-overflow: ellipsis;
                 }
             }
             .header {
diff --git a/src/components/ui/VnLv.vue b/src/components/ui/VnLv.vue
index 0f9b99713..b8da70feb 100644
--- a/src/components/ui/VnLv.vue
+++ b/src/components/ui/VnLv.vue
@@ -9,6 +9,7 @@ const $props = defineProps({
     titleValue: { type: [Number, String, Boolean], default: null },
     info: { type: String, default: null },
     dash: { type: Boolean, default: true },
+    ellipsisValue: { type: Boolean, default: true },
 });
 const isBooleanValue = computed(() => typeof $props.value === 'boolean');
 </script>
@@ -19,7 +20,7 @@ const isBooleanValue = computed(() => typeof $props.value === 'boolean');
                 <span :title="$props.titleLabel ?? $props.label">{{ $props.label }}</span>
             </slot>
         </div>
-        <div class="value">
+        <div class="value" :class="{ ellipsis: $props.ellipsisValue }">
             <span v-if="isBooleanValue">
                 <QIcon
                     :name="$props.value ? `check` : `close`"
@@ -42,3 +43,8 @@ const isBooleanValue = computed(() => typeof $props.value === 'boolean');
         </div>
     </div>
 </template>
+<style lang="scss" scoped>
+.ellipsis {
+    text-overflow: ellipsis !important;
+}
+</style>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
index 9c377e241..a5057ddd5 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -238,6 +238,7 @@ function taxRate(taxableBase, rate) {
                     </a>
                 </QCardSection>
                 <VnLv
+                    :ellipsis-value="false"
                     :label="t('invoiceIn.summary.issued')"
                     :value="toDate(invoiceIn.issued)"
                 />
@@ -254,6 +255,30 @@ function taxRate(taxableBase, rate) {
                     :value="toDate(invoiceIn.booked)"
                 />
             </QCard>
+            <QCard class="vn-one">
+                <QCardSection class="q-pa-none">
+                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                        {{ t('invoiceIn.pageTitles.basicData') }}
+                        <QIcon name="open_in_new" color="primary" />
+                    </a>
+                </QCardSection>
+                <VnLv
+                    :label="t('invoiceIn.summary.sage')"
+                    :value="invoiceIn.sageWithholding.withholding"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.vat')"
+                    :value="invoiceIn.expenseDeductible?.name"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.company')"
+                    :value="invoiceIn.company.code"
+                />
+                <VnLv
+                    :label="t('invoiceIn.summary.booked')"
+                    :value="invoiceIn.isBooked"
+                />
+            </QCard>
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
                     <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
@@ -290,32 +315,8 @@ function taxRate(taxableBase, rate) {
                     </div>
                 </QCardSection>
             </QCard>
-            <QCard class="q-mb-md">
-                <QCardSection class="q-pa-none">
-                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
-                        {{ t('invoiceIn.pageTitles.basicData') }}
-                        <QIcon name="open_in_new" color="primary" />
-                    </a>
-                </QCardSection>
-                <VnLv
-                    :label="t('invoiceIn.summary.sage')"
-                    :value="invoiceIn.sageWithholding.withholding"
-                />
-                <VnLv
-                    :label="t('invoiceIn.summary.vat')"
-                    :value="invoiceIn.expenseDeductible?.name"
-                />
-                <VnLv
-                    :label="t('invoiceIn.summary.company')"
-                    :value="invoiceIn.company.code"
-                />
-                <VnLv
-                    :label="t('invoiceIn.summary.booked')"
-                    :value="invoiceIn.isBooked"
-                />
-            </QCard>
             <!--Vat-->
-            <QCard v-if="invoiceIn.invoiceInTax.length" class="vn-three">
+            <QCard v-if="invoiceIn.invoiceInTax.length">
                 <a class="header" :href="`#/invoice-in/${entityId}/vat`">
                     {{ t('invoiceIn.card.vat') }}
                     <QIcon name="open_in_new" color="primary" />
@@ -348,7 +349,7 @@ function taxRate(taxableBase, rate) {
                 </QTable>
             </QCard>
             <!--Due Day-->
-            <QCard v-if="invoiceIn.invoiceInDueDay.length" class="vn-two">
+            <QCard v-if="invoiceIn.invoiceInDueDay.length">
                 <a class="header" :href="`#/invoice-in/${entityId}/due-day`">
                     {{ t('invoiceIn.card.dueDay') }}
                     <QIcon name="open_in_new" color="primary" />

From b43985b9db209f9cf5bdef15b050ea4629dfbdba Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 4 Dec 2023 15:26:19 +0100
Subject: [PATCH 16/19] refs #5835 refactor

---
 src/i18n/en/index.js                          |  2 +-
 src/i18n/es/index.js                          |  2 +-
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue | 18 +++++++++++-------
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 522c11100..26d37ae5a 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -347,7 +347,7 @@ export default {
     },
     invoiceOut: {
         pageTitles: {
-            invoiceOuts: 'Invoices Out',
+            invoiceOuts: 'Create invoice',
             list: 'List',
             createInvoiceOut: 'Create invoice out',
             summary: 'Summary',
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index d4deed5ee..791ba85f0 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -347,7 +347,7 @@ export default {
     },
     invoiceOut: {
         pageTitles: {
-            invoiceOuts: 'Fact. emitidas',
+            invoiceOuts: 'Crear factura',
             list: 'Listado',
             createInvoiceOut: 'Crear fact. emitida',
             summary: 'Resumen',
diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
index a5057ddd5..b3b4f37b6 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -193,6 +193,10 @@ function taxRate(taxableBase, rate) {
     }
     return 0;
 }
+
+function getLink(param) {
+    return `#/invoice-in/${entityId.value}/${param}`;
+}
 </script>
 
 <template>
@@ -208,7 +212,7 @@ function taxRate(taxableBase, rate) {
             <!--Basic Data-->
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
-                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                    <a class="header" :href="getLink('basic-data')">
                         {{ t('invoiceIn.pageTitles.basicData') }}
                         <QIcon name="open_in_new" color="primary" />
                     </a>
@@ -232,7 +236,7 @@ function taxRate(taxableBase, rate) {
             </QCard>
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
-                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                    <a class="header" :href="getLink('basic-data')">
                         {{ t('invoiceIn.pageTitles.basicData') }}
                         <QIcon name="open_in_new" color="primary" />
                     </a>
@@ -257,7 +261,7 @@ function taxRate(taxableBase, rate) {
             </QCard>
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
-                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                    <a class="header" :href="getLink('basic-data')">
                         {{ t('invoiceIn.pageTitles.basicData') }}
                         <QIcon name="open_in_new" color="primary" />
                     </a>
@@ -281,7 +285,7 @@ function taxRate(taxableBase, rate) {
             </QCard>
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
-                    <a class="header" :href="`#/invoice-in/${entityId}/basic-data`">
+                    <a class="header" :href="getLink('basic-data')">
                         {{ t('invoiceIn.pageTitles.basicData') }}
                         <QIcon name="open_in_new" color="primary" />
                     </a>
@@ -317,7 +321,7 @@ function taxRate(taxableBase, rate) {
             </QCard>
             <!--Vat-->
             <QCard v-if="invoiceIn.invoiceInTax.length">
-                <a class="header" :href="`#/invoice-in/${entityId}/vat`">
+                <a class="header" :href="getLink('vat')">
                     {{ t('invoiceIn.card.vat') }}
                     <QIcon name="open_in_new" color="primary" />
                 </a>
@@ -350,7 +354,7 @@ function taxRate(taxableBase, rate) {
             </QCard>
             <!--Due Day-->
             <QCard v-if="invoiceIn.invoiceInDueDay.length">
-                <a class="header" :href="`#/invoice-in/${entityId}/due-day`">
+                <a class="header" :href="getLink('due-day')">
                     {{ t('invoiceIn.card.dueDay') }}
                     <QIcon name="open_in_new" color="primary" />
                 </a>
@@ -380,7 +384,7 @@ function taxRate(taxableBase, rate) {
             </QCard>
             <!--Intrastat-->
             <QCard v-if="invoiceIn.invoiceInIntrastat.length">
-                <a class="header" :href="`#/invoice-in/${entityId}/intrastat`">
+                <a class="header" :href="getUrl('intrastat')">
                     {{ t('invoiceIn.card.intrastat') }}
                     <QIcon name="open_in_new" color="primary" />
                 </a>

From 22a634e7eb32c6856f6e9621b34372718a87e070 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 11 Dec 2023 13:49:50 +0100
Subject: [PATCH 17/19] refs #5835 refactor taxRate

---
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
index b3b4f37b6..d7039fe3d 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -187,11 +187,8 @@ function setData(entity) {
         intrastatTotals.value = { ...getIntrastatTotals(entity.invoiceInIntrastat) };
 }
 
-function taxRate(taxableBase, rate) {
-    if (rate && taxableBase) {
-        return (rate / 100) * taxableBase;
-    }
-    return 0;
+function taxRate(taxableBase = 0, rate = 0) {
+    return (rate / 100) * taxableBase;
 }
 
 function getLink(param) {

From 2c5dc276b224e49b015549a8355c4e90b6fc7bda Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Tue, 12 Dec 2023 09:01:32 +0100
Subject: [PATCH 18/19] refs #5835

---
 src/components/ui/VnLv.vue                    | 17 +++-----
 src/i18n/es/index.js                          |  2 +-
 .../InvoiceIn/Card/InvoiceInBasicData.vue     | 42 +++++++++++--------
 3 files changed, 32 insertions(+), 29 deletions(-)

diff --git a/src/components/ui/VnLv.vue b/src/components/ui/VnLv.vue
index b8da70feb..9a17fca05 100644
--- a/src/components/ui/VnLv.vue
+++ b/src/components/ui/VnLv.vue
@@ -4,12 +4,12 @@ import { dashIfEmpty } from 'src/filters';
 
 const $props = defineProps({
     label: { type: String, default: null },
-    value: { type: [Number, String, Boolean], default: null },
-    titleLabel: { type: String, default: null },
-    titleValue: { type: [Number, String, Boolean], default: null },
+    value: {
+        type: [String, Boolean],
+        default: null,
+    },
     info: { type: String, default: null },
     dash: { type: Boolean, default: true },
-    ellipsisValue: { type: Boolean, default: true },
 });
 const isBooleanValue = computed(() => typeof $props.value === 'boolean');
 </script>
@@ -17,10 +17,10 @@ const isBooleanValue = computed(() => typeof $props.value === 'boolean');
     <div class="vn-label-value">
         <div v-if="$props.label || $slots.label" class="label">
             <slot name="label">
-                <span :title="$props.titleLabel ?? $props.label">{{ $props.label }}</span>
+                <span>{{ $props.label }}</span>
             </slot>
         </div>
-        <div class="value" :class="{ ellipsis: $props.ellipsisValue }">
+        <div class="value">
             <span v-if="isBooleanValue">
                 <QIcon
                     :name="$props.value ? `check` : `close`"
@@ -43,8 +43,3 @@ const isBooleanValue = computed(() => typeof $props.value === 'boolean');
         </div>
     </div>
 </template>
-<style lang="scss" scoped>
-.ellipsis {
-    text-overflow: ellipsis !important;
-}
-</style>
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index 83893ece4..7fcd2e9c6 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -405,7 +405,7 @@ export default {
         pageTitles: {
             invoiceIns: 'Fact. recibidas',
             list: 'Listado',
-            createInvoiceOut: 'Crear fact. recibida',
+            createInvoiceIn: 'Crear fact. recibida',
             summary: 'Resumen',
             basicData: 'Datos básicos',
             vat: 'IVA',
diff --git a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
index 20144d8ca..4572c4c16 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
@@ -37,6 +37,10 @@ const inputFileRef = ref();
 const editDmsRef = ref();
 const createDmsRef = ref();
 
+const requiredFieldRule = (val) => val || t('Required field');
+const dateMask = '####-##-##';
+const fillMask = '_';
+
 async function checkFileExists(dmsId) {
     if (!dmsId) return;
     try {
@@ -212,10 +216,14 @@ async function upsert() {
                     <QInput
                         :label="t('Expedition date')"
                         v-model="data.issued"
-                        mask="####-##-##"
+                        :mask="dateMask"
                     >
                         <template #append>
-                            <QIcon name="event" class="cursor-pointer" fill-mask="_">
+                            <QIcon
+                                name="event"
+                                class="cursor-pointer"
+                                :fill-mask="fillMask"
+                            >
                                 <QPopupProxy
                                     cover
                                     transition-show="scale"
@@ -240,8 +248,8 @@ async function upsert() {
                     <QInput
                         :label="t('Operation date')"
                         v-model="data.operated"
-                        mask="####-##-##"
-                        fill-mask="_"
+                        :mask="dateMask"
+                        :fill-mask="fillMask"
                         autofocus
                     >
                         <template #append>
@@ -251,7 +259,7 @@ async function upsert() {
                                     transition-show="scale"
                                     transition-hide="scale"
                                 >
-                                    <QDate v-model="data.operated" mask="YYYY-MM-DD">
+                                    <QDate v-model="data.operated" :mask="dateMask">
                                         <div class="row items-center justify-end">
                                             <QBtn
                                                 v-close-popup
@@ -332,8 +340,8 @@ async function upsert() {
                         v-model="data.bookEntried"
                         clearable
                         clear-icon="close"
-                        mask="####-##-##"
-                        fill-mask="_"
+                        :mask="dateMask"
+                        :fill-mask="fillMask"
                     >
                         <template #append>
                             <QIcon name="event" class="cursor-pointer">
@@ -342,7 +350,7 @@ async function upsert() {
                                     transition-show="scale"
                                     transition-hide="scale"
                                 >
-                                    <QDate v-model="data.bookEntried" mask="YYYY-MM-DD">
+                                    <QDate v-model="data.bookEntried" :mask="dateMask">
                                         <div class="row items-center justify-end">
                                             <QBtn
                                                 v-close-popup
@@ -363,8 +371,8 @@ async function upsert() {
                         v-model="data.booked"
                         clearable
                         clear-icon="close"
-                        mask="####-##-##"
-                        fill-mask="_"
+                        :mask="dateMask"
+                        :fill-mask="fillMask"
                     >
                         <template #append>
                             <QIcon name="event" class="cursor-pointer">
@@ -373,7 +381,7 @@ async function upsert() {
                                     transition-show="scale"
                                     transition-hide="scale"
                                 >
-                                    <QDate v-model="data.booked" mask="YYYY-MM-DD">
+                                    <QDate v-model="data.booked" :mask="maskDate">
                                         <div class="row items-center justify-end">
                                             <QBtn
                                                 v-close-popup
@@ -452,7 +460,7 @@ async function upsert() {
                         option-value="id"
                         option-label="code"
                         @input-value="companiesRef.fetch()"
-                        :rules="[(val) => val || t('Required field')]"
+                        :rules="[requiredFieldRule]"
                     />
                 </QItem>
                 <QItem>
@@ -464,7 +472,7 @@ async function upsert() {
                         option-value="id"
                         option-label="name"
                         @input-value="warehousesRef.fetch()"
-                        :rules="[(val) => val || t('Required field')]"
+                        :rules="[requiredFieldRule]"
                     />
                     <VnSelectFilter
                         class="full-width q-pa-xs"
@@ -474,7 +482,7 @@ async function upsert() {
                         option-value="id"
                         option-label="name"
                         @input-value="dmsTypesRef.fetch()"
-                        :rules="[(val) => val || t('Required field')]"
+                        :rules="[requiredFieldRule]"
                     />
                 </QItem>
                 <QItem>
@@ -564,7 +572,7 @@ async function upsert() {
                         option-value="id"
                         option-label="code"
                         @input-value="companiesRef.fetch()"
-                        :rules="[(val) => val || t('Required field')]"
+                        :rules="[requiredFieldRule]"
                     />
                 </QItem>
                 <QItem>
@@ -576,7 +584,7 @@ async function upsert() {
                         option-value="id"
                         option-label="name"
                         @input-value="warehousesRef.fetch()"
-                        :rules="[(val) => val || t('Required field')]"
+                        :rules="[requiredFieldRule]"
                     />
                     <VnSelectFilter
                         class="full-width q-pa-xs"
@@ -586,7 +594,7 @@ async function upsert() {
                         option-value="id"
                         option-label="name"
                         @input-value="dmsTypesRef.fetch()"
-                        :rules="[(val) => val || t('Required field')]"
+                        :rules="[requiredFieldRule]"
                     />
                 </QItem>
                 <QItem>

From d1a5029ef727e70692171c1ca5f06017f007d119 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Tue, 12 Dec 2023 12:11:45 +0100
Subject: [PATCH 19/19] refs #5835 refactor

---
 .../InvoiceIn/Card/InvoiceInDescriptor.vue    |  9 +++++----
 src/pages/InvoiceIn/Card/InvoiceInDueDay.vue  |  8 +++++---
 src/pages/InvoiceIn/Card/InvoiceInVat.vue     | 19 +++++++------------
 .../pages/InvoiceIn/InvoiceInVat.spec.js      | 10 ++++------
 4 files changed, 21 insertions(+), 25 deletions(-)

diff --git a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
index 08df18e12..4e37102e9 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
@@ -163,6 +163,8 @@ async function cloneInvoice() {
     router.push({ path: `/invoice-in/${data.id}/summary` });
 }
 
+const isAdministrative = () => hasAny(['administrative']);
+
 const isAgricultural = () =>
     invoiceIn.value.supplier.sageWithholdingFk == config.value[0].sageWithholdingFk;
 
@@ -222,7 +224,7 @@ function triggerMenu(type) {
     >
         <template #menu="{ entity }">
             <QItem
-                v-if="!entity.isBooked && hasAny(['administrative'])"
+                v-if="!entity.isBooked && isAdministrative()"
                 v-ripple
                 clickable
                 @click="triggerMenu('book')"
@@ -230,7 +232,7 @@ function triggerMenu(type) {
                 <QItemSection>{{ t('To book') }}</QItemSection>
             </QItem>
             <QItem
-                v-if="hasAny(['administrative'])"
+                v-if="isAdministrative()"
                 v-ripple
                 clickable
                 @click="triggerMenu('delete')"
@@ -238,7 +240,7 @@ function triggerMenu(type) {
                 <QItemSection>{{ t('Delete invoice') }}</QItemSection>
             </QItem>
             <QItem
-                v-if="hasAny(['administrative'])"
+                v-if="isAdministrative()"
                 v-ripple
                 clickable
                 @click="triggerMenu('clone')"
@@ -306,7 +308,6 @@ function triggerMenu(type) {
 .q-dialog {
     .q-card {
         width: 35em;
-        max-width: 35em;
     }
 }
 </style>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
index e047876f3..e240e9a8c 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
@@ -19,6 +19,8 @@ const banks = ref([]);
 const invoiceInFormRef = ref();
 const invoiceId = route.params.id;
 
+const placeholder = 'yyyy/mm/dd';
+
 const filter = {
     where: {
         invoiceInFk: invoiceId,
@@ -67,7 +69,7 @@ const columns = computed(() => [
 const isNotEuro = (code) => code != 'EUR';
 
 async function insert() {
-    await axios.post('/InvoiceInDueDays/new ', { id: Number(invoiceId) });
+    await axios.post('/InvoiceInDueDays/new ', { id: +invoiceId });
     await invoiceInFormRef.value.reload();
 }
 </script>
@@ -99,7 +101,7 @@ async function insert() {
                         <QInput
                             v-model="row.dueDated"
                             mask="date"
-                            placeholder="yyyy/mm/dd"
+                            :placeholder="placeholder"
                             clearable
                             clear-icon="close"
                         >
@@ -186,7 +188,7 @@ async function insert() {
                                         :label="t('Date')"
                                         v-model="props.row.dueDated"
                                         mask="date"
-                                        placeholder="yyyy/mm/dd"
+                                        :placeholder="placeholder"
                                         clearable
                                         clear-icon="close"
                                     >
diff --git a/src/pages/InvoiceIn/Card/InvoiceInVat.vue b/src/pages/InvoiceIn/Card/InvoiceInVat.vue
index eb613943a..d8e742706 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInVat.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInVat.vue
@@ -112,16 +112,15 @@ const filter = {
 
 const isNotEuro = (code) => code != 'EUR';
 
-function taxRate(invoiceInTax, sageTaxTypeId) {
+function taxRate(invoiceInTax) {
+    const sageTaxTypeId = invoiceInTax.taxTypeSageFk;
     const taxRateSelection = sageTaxTypes.value.find(
         (transaction) => transaction.id == sageTaxTypeId
     );
-    const taxTypeSage = taxRateSelection && taxRateSelection.rate;
-    const taxableBase = invoiceInTax && invoiceInTax.taxableBase;
-    if (taxTypeSage && taxableBase) {
-        return (taxTypeSage / 100) * taxableBase;
-    }
-    return 0;
+    const taxTypeSage = taxRateSelection?.rate ?? 0;
+    const taxableBase = invoiceInTax?.taxableBase ?? 0;
+
+    return (taxTypeSage / 100) * taxableBase;
 }
 
 async function addExpense() {
@@ -395,11 +394,7 @@ async function addExpense() {
                                     </VnSelectFilter>
                                 </QItem>
                                 <QItem>
-                                    {{
-                                        toCurrency(
-                                            taxRate(props.row, props.row.taxTypeSageFk)
-                                        )
-                                    }}
+                                    {{ toCurrency(taxRate(props.row)) }}
                                 </QItem>
                                 <QItem>
                                     <QInput
diff --git a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInVat.spec.js b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInVat.spec.js
index 6ea9d6a5b..6cc082a35 100644
--- a/test/vitest/__tests__/pages/InvoiceIn/InvoiceInVat.spec.js
+++ b/test/vitest/__tests__/pages/InvoiceIn/InvoiceInVat.spec.js
@@ -53,22 +53,20 @@ describe('InvoiceInVat', () => {
 
     describe('taxRate()', () => {
         it('should correctly compute the tax rate', () => {
-            const invoiceInTax = { taxableBase: 100 };
-            const sageTaxTypeId = 1;
+            const invoiceInTax = { taxableBase: 100, taxTypeSageFk: 1 };
             vm.sageTaxTypes = [
                 { id: 1, rate: 10 },
                 { id: 2, rate: 20 },
             ];
-            const result = vm.taxRate(invoiceInTax, sageTaxTypeId);
+            const result = vm.taxRate(invoiceInTax);
             expect(result).toBe((10 / 100) * 100);
         });
 
         it('should return 0 if there is not tax rate', () => {
-            const invoiceInTax = { taxableBase: 100 };
-            const sageTaxTypeId = 1;
+            const invoiceInTax = { taxableBase: 100, taxTypeSageFk: 1 };
             vm.sageTaxTypes = [];
 
-            const result = vm.taxRate(invoiceInTax, sageTaxTypeId);
+            const result = vm.taxRate(invoiceInTax);
             expect(result).toBe(0);
         });
     });