Merge branch 'dev' into 7731-clientViesCode

src/boot/defaults/constants.js

@@ -1,2 +0,0 @@
-export const langs = ['en', 'es'];
-export const decimalPlaces = 2;

src/components/VnTable/VnTableFilter.vue

@@ -27,7 +27,7 @@ function columnName(col) {
 </script>
 <template>
     <VnFilterPanel v-bind="$attrs" :search-button="true" :disable-submit-event="true">
-        <template #body="{ params, orders, searchFn }">
+        <template #body="{ params, orders }">
             <div
                 class="row no-wrap flex-center"
                 v-for="col of columns.filter((c) => c.columnFilter ?? true)"
@@ -52,7 +52,6 @@ function columnName(col) {
             <slot
                 name="moreFilterPanel"
                 :params="params"
-                :search-fn="searchFn"
                 :orders="orders"
                 :columns="columns"
             />

src/components/common/VnSection.vue

@@ -106,14 +106,7 @@ function checkIsMain() {
                     :data-key="dataKey"
                     :array-data="arrayData"
                     :columns="columns"
-                >
-                    <template #moreFilterPanel="{ params, orders, searchFn }">
-                        <slot
-                            name="moreFilterPanel"
-                            v-bind="{ params, orders, searchFn }"
-                        />
-                    </template>
-                </VnTableFilter>
+                />
             </slot>
         </template>
     </RightAdvancedMenu>

src/components/common/VnSelect.vue

@@ -171,8 +171,7 @@ onMounted(() => {
 });
 
 const arrayDataKey =
-    $props.dataKey ??
-    ($props.url?.length > 0 ? $props.url : ($attrs.name ?? $attrs.label));
+    $props.dataKey ?? ($props.url?.length > 0 ? $props.url : $attrs.name ?? $attrs.label);
 
 const arrayData = useArrayData(arrayDataKey, {
     url: $props.url,
@@ -221,7 +220,7 @@ async function fetchFilter(val) {
         optionFilterValue.value ??
         (new RegExp(/\d/g).test(val)
             ? optionValue.value
-            : (optionFilter.value ?? optionLabel.value));
+            : optionFilter.value ?? optionLabel.value);
 
     let defaultWhere = {};
     if ($props.filterOptions.length) {
@@ -240,7 +239,7 @@ async function fetchFilter(val) {
 
     const { data } = await arrayData.applyFilter(
         { filter: filterOptions },
-        { updateRouter: false },
+        { updateRouter: false }
     );
     setOptions(data);
     return data;
@@ -273,7 +272,7 @@ async function filterHandler(val, update) {
                 ref.setOptionIndex(-1);
                 ref.moveOptionSelection(1, true);
             }
-        },
+        }
     );
 }
 
@@ -309,7 +308,7 @@ function handleKeyDown(event) {
         if (inputValue) {
             const matchingOption = myOptions.value.find(
                 (option) =>
-                    option[optionLabel.value].toLowerCase() === inputValue.toLowerCase(),
+                    option[optionLabel.value].toLowerCase() === inputValue.toLowerCase()
             );
 
             if (matchingOption) {
@@ -321,11 +320,11 @@ function handleKeyDown(event) {
         }
 
         const focusableElements = document.querySelectorAll(
-            'a:not([disabled]), button:not([disabled]), input:not([disabled]), textarea:not([disabled]), select:not([disabled]), details:not([disabled]), [tabindex]:not([tabindex="-1"]):not([disabled])',
+            'a:not([disabled]), button:not([disabled]), input:not([disabled]), textarea:not([disabled]), select:not([disabled]), details:not([disabled]), [tabindex]:not([tabindex="-1"]):not([disabled])'
         );
         const currentIndex = Array.prototype.indexOf.call(
             focusableElements,
-            event.target,
+            event.target
         );
         if (currentIndex >= 0 && currentIndex < focusableElements.length - 1) {
             focusableElements[currentIndex + 1].focus();

src/components/common/VnSelectSupplier.vue

@@ -1,7 +1,9 @@
 <script setup>
+import { computed } from 'vue';
 import VnSelect from 'components/common/VnSelect.vue';
 
 const model = defineModel({ type: [String, Number, Object] });
+const url = 'Suppliers';
 </script>
 
 <template>
@@ -9,11 +11,10 @@ const model = defineModel({ type: [String, Number, Object] });
         :label="$t('globals.supplier')"
         v-bind="$attrs"
         v-model="model"
-        url="Suppliers"
+        :url="url"
         option-value="id"
         option-label="nickname"
         :fields="['id', 'name', 'nickname', 'nif']"
-        :filter-options="['id', 'name', 'nickname', 'nif']"
         sort-by="name ASC"
     >
         <template #option="scope">

src/components/common/VnSelectVies.vue

@@ -0,0 +1,81 @@
+<script setup>
+import { ref } from 'vue';
+import VnSelect from 'src/components/common/VnSelect.vue';
+import FetchData from 'components/FetchData.vue';
+import { useI18n } from 'vue-i18n';
+
+const { t } = useI18n();
+const model = defineModel({ type: String, required: true });
+const countriesOption = ref([]);
+const countriesOptionCopy = ref([]);
+const lastVal = ref();
+
+function handleBlur() {
+    if (lastVal.value == '') lastVal.value = null;
+    model.value = lastVal.value && lastVal.value.toUpperCase().slice(0, 2);
+}
+
+function filterFn(val, update) {
+    update(
+        () => {
+            if (val === '') {
+                countriesOptionCopy.value = JSON.parse(
+                    JSON.stringify(countriesOption.value)
+                );
+                return;
+            }
+
+            const exist = countriesOption.value.filter((c) =>
+                c.code.toLowerCase().includes(val.toLowerCase())
+            );
+            if (exist) return (countriesOptionCopy.value = exist);
+            countriesOptionCopy.value = JSON.parse(JSON.stringify([{ code: val }]));
+        },
+        (ref) => {
+            if (val !== '' && ref.options.length > 0) {
+                ref.setOptionIndex(-1);
+                ref.moveOptionSelection(1, true);
+            }
+        }
+    );
+}
+</script>
+<template>
+    <FetchData auto-load @on-fetch="(data) => (countriesOption = data)" url="Countries" />
+    <VnSelect
+        :label="t('Vies')"
+        v-model="model"
+        :input-debounce="0"
+        :options="countriesOptionCopy"
+        @input-value="(evt) => (lastVal = evt) && handleBlur()"
+        @filter="filterFn"
+        option-label="code"
+        option-value="code"
+        v-bind="$attrs"
+    >
+        <template #option="scope">
+            <QItem v-bind="scope.itemProps">
+                <QItemSection>
+                    <QItemLabel>{{ scope.opt?.code }}</QItemLabel>
+                    <QItemLabel caption>
+                        {{ scope.opt?.code }},
+                        {{ scope.opt?.name }}
+                    </QItemLabel>
+                </QItemSection>
+            </QItem>
+        </template>
+        <template #after>
+            <QIcon name="info" class="cursor-pointer">
+                <QTooltip>{{ t('viesTip') }}</QTooltip>
+            </QIcon>
+        </template>
+    </VnSelect>
+</template>
+<i18n>
+es:
+    viesTip: El campo puede contener valores que no este en la lista
+
+en:
+    viesTip: The field may contain value that are not in the list
+
+</i18n>

src/i18n/locale/en.yml

@@ -635,8 +635,6 @@ wagon:
         name: Name
 
 supplier:
-    search: Search supplier
-    searchInfo: Search supplier by id or name
     list:
         payMethod: Pay method
         account: Account

src/i18n/locale/es.yml

@@ -352,7 +352,7 @@ globals:
         from: Desde
         to: Hasta
         supplierFk: Proveedor
-        supplierRef: Nº factura
+        supplierRef: Ref. proveedor
         serial: Serie
         amount: Importe
         awbCode: AWB
@@ -644,8 +644,6 @@ wagon:
         volume: Volumen
         name: Nombre
 supplier:
-    search: Buscar proveedor
-    searchInfo: Buscar proveedor por id o nombre
     list:
         payMethod: Método de pago
         account: Cuenta
@@ -653,7 +651,6 @@ supplier:
         tableVisibleColumns:
             nif: NIF/CIF
             account: Cuenta
-        
     summary:
         responsible: Responsable
         verified: Verificado

src/layouts/OutLayout.vue

@@ -1,12 +1,12 @@
 <script setup>
 import { Dark, Quasar } from 'quasar';
-import { computed, onMounted } from 'vue';
+import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { localeEquivalence } from 'src/i18n/index';
 import quasarLang from 'src/utils/quasarLang';
-import { langs } from 'src/boot/defaults/constants.js';
 
 const { t, locale } = useI18n();
+
 const userLocale = computed({
     get() {
         return locale.value;
@@ -28,6 +28,7 @@ const darkMode = computed({
         Dark.set(value);
     },
 });
+const langs = ['en', 'es'];
 </script>
 
 <template>

src/pages/Customer/Card/CustomerConsumption.vue

@@ -119,7 +119,7 @@ const openSendEmailDialog = async () => {
     openConfirmationModal(
         t('The consumption report will be sent'),
         t('Please, confirm'),
-        () => sendCampaignMetricsEmail({ address: arrayData.store.data.email }),
+        () => sendCampaignMetricsEmail({ address: arrayData.store.data.email })
     );
 };
 const sendCampaignMetricsEmail = ({ address }) => {
@@ -152,7 +152,7 @@ const updateDateParams = (value, params) => {
         v-if="campaignList"
         data-key="CustomerConsumption"
         url="Clients/consumption"
-        :order="['itemTypeFk', 'itemName', 'itemSize', 'description']"
+        :order="['itemTypeFk', 'itemName', 'itemSize', 'description']"        
         :filter="{ where: { clientFk: route.params.id } }"
         :columns="columns"
         search-url="consumption"

src/pages/Customer/Card/CustomerFiscalData.vue

@@ -8,6 +8,7 @@ import FormModel from 'components/FormModel.vue';
 import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
+import VnSelectVies from 'src/components/common/VnSelectVies.vue';
 import VnLocation from 'src/components/common/VnLocation.vue';
 
 const { t } = useI18n();
@@ -103,6 +104,7 @@ function handleLocation(data, location) {
                     :required="true"
                     @update:model-value="(location) => handleLocation(data, location)"
                 />
+                <VnSelectVies v-model="data.viesCode" style="max-width: 30%" />
             </VnRow>
             <VnRow>
                 <QCheckbox :label="t('Active')" v-model="data.isActive" />
@@ -110,14 +112,7 @@ function handleLocation(data, location) {
             </VnRow>
             <VnRow>
                 <QCheckbox :label="t('Has to invoice')" v-model="data.hasToInvoice" />
-                <div>
-                    <QCheckbox :label="t('globals.isVies')" v-model="data.isVies" />
-                    <QIcon name="info" class="cursor-info q-ml-sm" size="sm">
-                        <QTooltip>
-                            {{ t('whenActivatingIt') }}
-                        </QTooltip>
-                    </QIcon>
-                </div>
+                <QCheckbox :label="t('Verified data')" v-model="data.isTaxDataChecked" />
             </VnRow>
 
             <VnRow>
@@ -147,9 +142,6 @@ function handleLocation(data, location) {
                 <QCheckbox
                     :label="t('Electronic invoice')"
                     v-model="data.hasElectronicInvoice"
-                /><QCheckbox
-                    :label="t('Verified data')"
-                    v-model="data.isTaxDataChecked"
                 />
             </VnRow>
         </template>
@@ -177,11 +169,9 @@ es:
     Incoterms authorization: Autorización incoterms
     Electronic invoice: Factura electrónica
     onlyLetters: Sólo se pueden usar letras, números y espacios
-    whenActivatingIt: Al activarlo, no informar el código del país en el campo nif
     inOrderToInvoice: Para facturar no se consulta este campo, sino el RE de consignatario. Al modificar este campo si no esta marcada la casilla Facturar por consignatario, se propagará automaticamente el cambio a todos lo consignatarios, en caso contrario preguntará al usuario si quiere o no propagar
     Daily invoice: Facturación diaria
 en:
     onlyLetters: Only letters, numbers and spaces can be used
-    whenActivatingIt: When activating it, do not enter the country code in the ID field
     inOrderToInvoice: In order to invoice, this field is not contulted, but the consignee's ET. When modifiying this field if the invoice by address option is not checked, the change will be automatically propagated to all addresses, otherwise the user will be asked if he wants to propagate it or not
 </i18n>

src/pages/InvoiceIn/Card/InvoiceInBasicData.vue

@@ -125,7 +125,7 @@ function deleteFile(dmsFk) {
                 <VnInput
                     clearable
                     clear-icon="close"
-                    :label="t('invoiceIn.supplierRef')"
+                    :label="t('Supplier ref')"
                     v-model="data.supplierRef"
                 />
             </VnRow>
@@ -310,6 +310,7 @@ function deleteFile(dmsFk) {
         supplierFk: Supplier
     es:
         supplierFk: Proveedor
+        Supplier ref: Ref. proveedor
         Expedition date: Fecha expedición
         Operation date: Fecha operación
         Undeductible VAT: Iva no deducible

src/pages/InvoiceIn/Card/InvoiceInDescriptorMenu.vue

@@ -186,7 +186,7 @@ const createInvoiceInCorrection = async () => {
                 clickable
                 @click="book(entityId)"
             >
-                <QItemSection>{{ t('invoiceIn.descriptorMenu.book') }}</QItemSection>
+                <QItemSection>{{ t('invoiceIn.descriptorMenu.toBook') }}</QItemSection>
             </QItem>
         </template>
     </InvoiceInToBook>
@@ -197,7 +197,7 @@ const createInvoiceInCorrection = async () => {
         @click="triggerMenu('unbook')"
     >
         <QItemSection>
-            {{ t('invoiceIn.descriptorMenu.unbook') }}
+            {{ t('invoiceIn.descriptorMenu.toUnbook') }}
         </QItemSection>
     </QItem>
     <QItem

src/pages/InvoiceIn/Card/InvoiceInDueDay.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed, onBeforeMount } from 'vue';
+import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import axios from 'axios';
@@ -12,7 +12,6 @@ import VnSelect from 'src/components/common/VnSelect.vue';
 import useNotify from 'src/composables/useNotify.js';
 import VnInputDate from 'src/components/common/VnInputDate.vue';
 import VnInputNumber from 'src/components/common/VnInputNumber.vue';
-import { toCurrency } from 'filters/index';
 
 const route = useRoute();
 const { notify } = useNotify();
@@ -27,7 +26,7 @@ const invoiceInFormRef = ref();
 const invoiceId = +route.params.id;
 const filter = { where: { invoiceInFk: invoiceId } };
 const areRows = ref(false);
-const totals = ref();
+
 const columns = computed(() => [
     {
         name: 'duedate',
@@ -67,8 +66,6 @@ const columns = computed(() => [
     },
 ]);
 
-const totalAmount = computed(() => getTotal(invoiceInFormRef.value.formData, 'amount'));
-
 const isNotEuro = (code) => code != 'EUR';
 
 async function insert() {
@@ -76,10 +73,6 @@ async function insert() {
     await invoiceInFormRef.value.reload();
     notify(t('globals.dataSaved'), 'positive');
 }
-
-onBeforeMount(async () => {
-    totals.value = (await axios.get(`InvoiceIns/${invoiceId}/getTotals`)).data;
-});
 </script>
 <template>
     <FetchData
@@ -160,7 +153,7 @@ onBeforeMount(async () => {
                         <QTd />
                         <QTd />
                         <QTd>
-                            {{ toCurrency(totalAmount) }}
+                            {{ getTotal(rows, 'amount', { currency: 'default' }) }}
                         </QTd>
                         <QTd>
                             <template v-if="isNotEuro(invoiceIn.currency.code)">
@@ -242,16 +235,7 @@ onBeforeMount(async () => {
             v-shortcut="'+'"
             size="lg"
             round
-            @click="
-                () => {
-                    if (!areRows) insert();
-                    else
-                        invoiceInFormRef.insert({
-                            amount: (totals.totalTaxableBase - totalAmount).toFixed(2),
-                            invoiceInFk: invoiceId,
-                        });
-                }
-            "
+            @click="!areRows ? insert() : invoiceInFormRef.insert()"
         />
     </QPageSticky>
 </template>

src/pages/InvoiceIn/Card/InvoiceInSummary.vue

@@ -193,7 +193,7 @@ const getLink = (param) => `#/invoice-in/${entityId.value}/${param}`;
             <InvoiceIntoBook>
                 <template #content="{ book }">
                     <QBtn
-                        :label="t('Book')"
+                        :label="t('To book')"
                         color="orange-11"
                         text-color="black"
                         @click="book(entityId)"
@@ -224,7 +224,10 @@ const getLink = (param) => `#/invoice-in/${entityId.value}/${param}`;
                         </span>
                     </template>
                 </VnLv>
-                <VnLv :label="t('invoiceIn.supplierRef')" :value="entity.supplierRef" />
+                <VnLv
+                    :label="t('invoiceIn.list.supplierRef')"
+                    :value="entity.supplierRef"
+                />
                 <VnLv
                     :label="t('invoiceIn.summary.currency')"
                     :value="entity.currency?.code"
@@ -354,7 +357,7 @@ const getLink = (param) => `#/invoice-in/${entityId.value}/${param}`;
                                 entity.totals.totalTaxableBaseForeignValue &&
                                 toCurrency(
                                     entity.totals.totalTaxableBaseForeignValue,
-                                    currency,
+                                    currency
                                 )
                             }}</QTd>
                         </QTr>
@@ -389,7 +392,7 @@ const getLink = (param) => `#/invoice-in/${entityId.value}/${param}`;
                                     entity.totals.totalDueDayForeignValue &&
                                     toCurrency(
                                         entity.totals.totalDueDayForeignValue,
-                                        currency,
+                                        currency
                                     )
                                 }}
                             </QTd>
@@ -469,5 +472,5 @@ const getLink = (param) => `#/invoice-in/${entityId.value}/${param}`;
         Search invoice: Buscar factura recibida
         You can search by invoice reference: Puedes buscar por referencia de la factura
         Totals: Totales
-        Book: Contabilizar
+        To book: Contabilizar
 </i18n>

src/pages/InvoiceIn/Card/InvoiceInVat.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed, nextTick } from 'vue';
+import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useArrayData } from 'src/composables/useArrayData';
@@ -25,6 +25,7 @@ const sageTaxTypes = ref([]);
 const sageTransactionTypes = ref([]);
 const rowsSelected = ref([]);
 const invoiceInFormRef = ref();
+const expenseRef = ref();
 
 defineProps({
     actionIcon: {
@@ -96,20 +97,6 @@ const columns = computed(() => [
     },
 ]);
 
-const taxableBaseTotal = computed(() => {
-    return getTotal(invoiceInFormRef.value.formData, 'taxableBase');
-});
-
-const taxRateTotal = computed(() => {
-    return getTotal(invoiceInFormRef.value.formData, null, {
-        cb: taxRate,
-    });
-});
-
-const combinedTotal = computed(() => {
-    return +taxableBaseTotal.value + +taxRateTotal.value;
-});
-
 const filter = {
     fields: [
         'id',
@@ -138,7 +125,7 @@ function taxRate(invoiceInTax) {
     return ((taxTypeSage / 100) * taxableBase).toFixed(2);
 }
 
-function autocompleteExpense(evt, row, col, ref) {
+function autocompleteExpense(evt, row, col) {
     const val = evt.target.value;
     if (!val) return;
 
@@ -147,17 +134,22 @@ function autocompleteExpense(evt, row, col, ref) {
         ({ id }) => id == useAccountShortToStandard(param),
     );
 
-    ref.vnSelectDialogRef.vnSelectRef.toggleOption(lookup);
+    expenseRef.value.vnSelectDialogRef.vnSelectRef.toggleOption(lookup);
 }
 
-function setCursor(ref) {
-    nextTick(() => {
-        const select = ref.vnSelectDialogRef
-            ? ref.vnSelectDialogRef.vnSelectRef
-            : ref.vnSelectRef;
-        select.$el.querySelector('input').setSelectionRange(0, 0);
+const taxableBaseTotal = computed(() => {
+    return getTotal(invoiceInFormRef.value.formData, 'taxableBase');
+});
+
+const taxRateTotal = computed(() => {
+    return getTotal(invoiceInFormRef.value.formData, null, {
+        cb: taxRate,
     });
-}
+});
+
+const combinedTotal = computed(() => {
+    return +taxableBaseTotal.value + +taxRateTotal.value;
+});
 </script>
 <template>
     <FetchData
@@ -195,24 +187,14 @@ function setCursor(ref) {
                 <template #body-cell-expense="{ row, col }">
                     <QTd>
                         <VnSelectDialog
-                            :ref="`expenseRef-${row.$index}`"
+                            ref="expenseRef"
                             v-model="row[col.model]"
                             :options="col.options"
                             :option-value="col.optionValue"
                             :option-label="col.optionLabel"
                             :filter-options="['id', 'name']"
                             :tooltip="t('Create a new expense')"
-                            @keydown.tab="
-                                autocompleteExpense(
-                                    $event,
-                                    row,
-                                    col,
-                                    $refs[`expenseRef-${row.$index}`],
-                                )
-                            "
-                            @update:model-value="
-                                setCursor($refs[`expenseRef-${row.$index}`])
-                            "
+                            @keydown.tab="autocompleteExpense($event, row, col)"
                         >
                             <template #option="scope">
                                 <QItem v-bind="scope.itemProps">
@@ -228,7 +210,7 @@ function setCursor(ref) {
                     </QTd>
                 </template>
                 <template #body-cell-taxablebase="{ row }">
-                    <QTd shrink>
+                    <QTd>
                         <VnInputNumber
                             clear-icon="close"
                             v-model="row.taxableBase"
@@ -239,16 +221,12 @@ function setCursor(ref) {
                 <template #body-cell-sageiva="{ row, col }">
                     <QTd>
                         <VnSelect
-                            :ref="`sageivaRef-${row.$index}`"
                             v-model="row[col.model]"
                             :options="col.options"
                             :option-value="col.optionValue"
                             :option-label="col.optionLabel"
                             :filter-options="['id', 'vat']"
                             data-cy="vat-sageiva"
-                            @update:model-value="
-                                setCursor($refs[`sageivaRef-${row.$index}`])
-                            "
                         >
                             <template #option="scope">
                                 <QItem v-bind="scope.itemProps">
@@ -266,15 +244,11 @@ function setCursor(ref) {
                 <template #body-cell-sagetransaction="{ row, col }">
                     <QTd>
                         <VnSelect
-                            :ref="`sagetransactionRef-${row.$index}`"
                             v-model="row[col.model]"
                             :options="col.options"
                             :option-value="col.optionValue"
                             :option-label="col.optionLabel"
                             :filter-options="['id', 'transaction']"
-                            @update:model-value="
-                                setCursor($refs[`sagetransactionRef-${row.$index}`])
-                            "
                         >
                             <template #option="scope">
                                 <QItem v-bind="scope.itemProps">
@@ -292,7 +266,7 @@ function setCursor(ref) {
                     </QTd>
                 </template>
                 <template #body-cell-foreignvalue="{ row }">
-                    <QTd shrink>
+                    <QTd>
                         <VnInputNumber
                             :class="{
                                 'no-pointer-events': !isNotEuro(currency),

src/pages/InvoiceIn/InvoiceInList.vue

@@ -56,7 +56,7 @@ const cols = computed(() => [
     {
         align: 'left',
         name: 'supplierRef',
-        label: t('invoiceIn.supplierRef'),
+        label: t('invoiceIn.list.supplierRef'),
     },
     {
         align: 'left',
@@ -177,7 +177,7 @@ const cols = computed(() => [
                         :required="true"
                     />
                     <VnInput
-                        :label="t('invoiceIn.supplierRef')"
+                        :label="t('invoiceIn.list.supplierRef')"
                         v-model="data.supplierRef"
                     />
                     <VnSelect

src/pages/InvoiceIn/InvoiceInToBook.vue

@@ -4,7 +4,6 @@ import { useQuasar } from 'quasar';
 import { useI18n } from 'vue-i18n';
 import VnConfirm from 'src/components/ui/VnConfirm.vue';
 import { useArrayData } from 'src/composables/useArrayData';
-import qs from 'qs';
 const { notify, dialog } = useQuasar();
 const { t } = useI18n();
 
@@ -13,51 +12,29 @@ defineExpose({ checkToBook });
 const { store } = useArrayData();
 
 async function checkToBook(id) {
-    let messages = [];
-
-    const hasProblemWithTax = (
-        await axios.get('InvoiceInTaxes/count', {
-            params: {
-                where: JSON.stringify({
-                    invoiceInFk: id,
-                    or: [{ taxTypeSageFk: null }, { transactionTypeSageFk: null }],
-                }),
-            },
-        })
-    ).data?.count;
-
-    if (hasProblemWithTax)
-        messages.push(t('The VAT and Transaction fields have not been informed'));
+    let directBooking = true;
 
     const { data: totals } = await axios.get(`InvoiceIns/${id}/getTotals`);
     const taxableBaseNotEqualDueDay = totals.totalDueDay != totals.totalTaxableBase;
     const vatNotEqualDueDay = totals.totalDueDay != totals.totalVat;
 
-    if (taxableBaseNotEqualDueDay && vatNotEqualDueDay)
-        messages.push(t('The sum of the taxable bases does not match the due dates'));
+    if (taxableBaseNotEqualDueDay && vatNotEqualDueDay) directBooking = false;
 
-    const dueDaysCount = (
-        await axios.get('InvoiceInDueDays/count', {
-            params: {
-                where: JSON.stringify({
-                    invoiceInFk: id,
-                    dueDated: { gte: Date.vnNew() },
-                }),
-            },
-        })
-    ).data?.count;
+    const { data: dueDaysCount } = await axios.get('InvoiceInDueDays/count', {
+        where: {
+            invoiceInFk: id,
+            dueDated: { gte: Date.vnNew() },
+        },
+    });
 
-    if (dueDaysCount) messages.push(t('Some due dates are less than or equal to today'));
+    if (dueDaysCount) directBooking = false;
 
-    if (!messages.length) toBook(id);
-    else
-        dialog({
-            component: VnConfirm,
-            componentProps: {
-                title: t('Are you sure you want to book this invoice?'),
-                message: messages.reduce((acc, msg) => `${acc}<p>${msg}</p>`, ''),
-            },
-        }).onOk(() => toBook(id));
+    if (directBooking) return toBook(id);
+
+    dialog({
+        component: VnConfirm,
+        componentProps: { title: t('Are you sure you want to book this invoice?') },
+    }).onOk(async () => await toBook(id));
 }
 
 async function toBook(id) {
@@ -82,7 +59,4 @@ async function toBook(id) {
 es:
     Are you sure you want to book this invoice?: ¿Estás seguro de querer asentar esta factura?
     It was not able to book the invoice: No se pudo contabilizar la factura
-    Some due dates are less than or equal to today: Algún vencimiento tiene una fecha menor o igual que hoy
-    The sum of the taxable bases does not match the due dates: La suma de las bases imponibles no coincide con la de los vencimientos
-    The VAT and Transaction fields have not been informed: No se han informado los campos de iva y/o transacción
 </i18n>

src/pages/InvoiceIn/locale/en.yml

@@ -3,10 +3,10 @@ invoiceIn:
     searchInfo: Search incoming invoices by ID or supplier fiscal name
     serial: Serial
     isBooked: Is booked
-    supplierRef: Invoice nº
     list:
         ref: Reference
         supplier: Supplier
+        supplierRef: Supplier ref.
         file: File
         issued: Issued
         dueDated: Due dated
@@ -19,6 +19,8 @@ invoiceIn:
         unbook: Unbook
         delete: Delete
         clone: Clone
+        toBook: To book
+        toUnbook: To unbook
         deleteInvoice: Delete invoice
         invoiceDeleted: invoice deleted
         cloneInvoice: Clone invoice
@@ -68,3 +70,4 @@ invoiceIn:
         isBooked: Is booked
         account: Ledger account
         correctingFk: Rectificative
+        

src/pages/InvoiceIn/locale/es.yml

@@ -3,10 +3,10 @@ invoiceIn:
     searchInfo: Buscar facturas recibidas por ID o nombre fiscal del proveedor
     serial: Serie
     isBooked: Contabilizada
-    supplierRef: Nº factura
     list:
         ref: Referencia
         supplier: Proveedor
+        supplierRef: Ref. proveedor
         issued: F. emisión
         dueDated: F. vencimiento
         file: Fichero
@@ -15,10 +15,12 @@ invoiceIn:
     descriptor:
         ticketList: Listado de tickets
     descriptorMenu:
-        book: Contabilizar
-        unbook: Descontabilizar
+        book: Asentar
+        unbook: Desasentar
         delete: Eliminar
         clone: Clonar
+        toBook: Contabilizar
+        toUnbook: Descontabilizar
         deleteInvoice: Eliminar factura
         invoiceDeleted: Factura eliminada
         cloneInvoice: Clonar factura
@@ -66,3 +68,4 @@ invoiceIn:
         isBooked: Contabilizada
         account: Cuenta contable
         correctingFk: Rectificativa
+

src/pages/Item/ItemFixedPrice.vue

@@ -65,19 +65,10 @@ const columns = computed(() => [
         name: 'name',
         ...defaultColumnAttrs,
         create: true,
-        columnFilter: {
-            component: 'select',
-            attrs: {
-                url: 'Items',
-                fields: ['id', 'name', 'subName'],
-                optionLabel: 'name',
-                optionValue: 'name',
-                uppercase: false,
-            },
-        },
     },
     {
         label: t('item.fixedPrice.groupingPrice'),
+        field: 'rate2',
         name: 'rate2',
         ...defaultColumnAttrs,
         component: 'input',
@@ -85,6 +76,7 @@ const columns = computed(() => [
     },
     {
         label: t('item.fixedPrice.packingPrice'),
+        field: 'rate3',
         name: 'rate3',
         ...defaultColumnAttrs,
         component: 'input',
@@ -93,6 +85,7 @@ const columns = computed(() => [
 
     {
         label: t('item.fixedPrice.minPrice'),
+        field: 'minPrice',
         name: 'minPrice',
         ...defaultColumnAttrs,
         component: 'input',
@@ -115,6 +108,7 @@ const columns = computed(() => [
     },
     {
         label: t('item.fixedPrice.ended'),
+        field: 'ended',
         name: 'ended',
         ...defaultColumnAttrs,
         columnField: {
@@ -130,6 +124,7 @@ const columns = computed(() => [
 
     {
         label: t('globals.warehouse'),
+        field: 'warehouseFk',
         name: 'warehouseFk',
         ...defaultColumnAttrs,
         columnClass: 'shrink',
@@ -420,6 +415,7 @@ function handleOnDataSave({ CrudModelRef }) {
             'row-key': 'id',
             selection: 'multiple',
         }"
+        :use-model="true"
         v-model:selected="rowsSelected"
         :create-as-dialog="false"
         :create="{

src/pages/Route/Vehicle/Card/VehicleCard.vue

@@ -6,7 +6,7 @@ import VehicleFilter from '../VehicleFilter.js';
 <template>
     <VnCardBeta
         data-key="Vehicle"
-        url="Vehicles"
+        base-url="Vehicles"
         :filter="VehicleFilter"
         :descriptor="VehicleDescriptor"
     />

src/pages/Route/Vehicle/VehicleList.vue

@@ -136,7 +136,7 @@ const columns = computed(() => [
     />
     <FetchData
         url="Countries"
-        :filter="{ fields: ['name', 'code'] }"
+        :filter="{ fields: ['code'] }"
         @on-fetch="(data) => (countries = data)"
         auto-load
     />
@@ -209,7 +209,7 @@ const columns = computed(() => [
                         v-model="data.countryCodeFk"
                         :label="$t('globals.country')"
                         option-value="code"
-                        option-label="name"
+                        option-label="code"
                         :options="countries"
                     />
                     <VnInput

src/pages/Supplier/Card/SupplierCard.vue

@@ -1,13 +1,19 @@
 <script setup>
+import VnCard from 'components/common/VnCard.vue';
 import SupplierDescriptor from './SupplierDescriptor.vue';
-import VnCardBeta from 'src/components/common/VnCardBeta.vue';
 import filter from './SupplierFilter.js';
 </script>
 <template>
-    <VnCardBeta
+    <VnCard
         data-key="Supplier"
         url="Suppliers"
-        :descriptor="SupplierDescriptor"
         :filter="filter"
+        :descriptor="SupplierDescriptor"
+        search-data-key="SupplierList"
+        :searchbar-props="{
+            url: 'Suppliers/filter',
+            searchUrl: 'table',
+            label: 'Search suppliers',
+        }"
     />
 </template>

src/pages/Supplier/Card/SupplierConsumption.vue

@@ -16,7 +16,6 @@ import axios from 'axios';
 import { useStateStore } from 'stores/useStateStore';
 import { useState } from 'src/composables/useState';
 import { useArrayData } from 'composables/useArrayData';
-import RightMenu from 'src/components/common/RightMenu.vue';
 
 const state = useState();
 const stateStore = useStateStore();
@@ -174,59 +173,59 @@ onMounted(async () => {
             </div>
         </div>
     </Teleport>
-    <RightMenu>
-        <template #right-panel>
+    <QPage class="column items-center q-pa-md">
+        <Teleport to="#right-panel" v-if="stateStore.isHeaderMounted()">
             <SupplierConsumptionFilter data-key="SupplierConsumption" />
-        </template>
-    </RightMenu>
-    <QTable
-        :rows="rows"
-        row-key="id"
-        hide-header
-        class="full-width q-mt-md"
-        :no-data-label="t('No results')"
-    >
-        <template #body="{ row }">
-            <QTr>
-                <QTd no-hover>
-                    <span class="label">{{ t('supplier.consumption.entry') }}: </span>
-                    <span>{{ row.id }}</span>
-                </QTd>
-                <QTd no-hover>
-                    <span class="label">{{ t('globals.date') }}: </span>
-                    <span>{{ toDate(row.shipped) }}</span></QTd
-                >
-                <QTd colspan="6" no-hover>
-                    <span class="label">{{ t('globals.reference') }}: </span>
-                    <span>{{ row.invoiceNumber }}</span>
-                </QTd>
-            </QTr>
-            <QTr v-for="(buy, index) in row.buys" :key="index">
-                <QTd no-hover>
-                    <QBtn flat color="blue" dense no-caps>{{ buy.itemName }}</QBtn>
-                    <ItemDescriptorProxy :id="buy.itemFk" />
-                </QTd>
+        </Teleport>
+        <QTable
+            :rows="rows"
+            row-key="id"
+            hide-header
+            class="full-width q-mt-md"
+            :no-data-label="t('No results')"
+        >
+            <template #body="{ row }">
+                <QTr>
+                    <QTd no-hover>
+                        <span class="label">{{ t('supplier.consumption.entry') }}: </span>
+                        <span>{{ row.id }}</span>
+                    </QTd>
+                    <QTd no-hover>
+                        <span class="label">{{ t('globals.date') }}: </span>
+                        <span>{{ toDate(row.shipped) }}</span></QTd
+                    >
+                    <QTd colspan="6" no-hover>
+                        <span class="label">{{ t('globals.reference') }}: </span>
+                        <span>{{ row.invoiceNumber }}</span>
+                    </QTd>
+                </QTr>
+                <QTr v-for="(buy, index) in row.buys" :key="index">
+                    <QTd no-hover>
+                        <QBtn flat color="blue" dense no-caps>{{ buy.itemName }}</QBtn>
+                        <ItemDescriptorProxy :id="buy.itemFk" />
+                    </QTd>
 
-                <QTd no-hover>
-                    <span>{{ buy.subName }}</span>
-                    <FetchedTags :item="buy" />
-                </QTd>
-                <QTd no-hover> {{ dashIfEmpty(buy.quantity) }}</QTd>
-                <QTd no-hover> {{ dashIfEmpty(buy.price) }}</QTd>
-                <QTd colspan="2" no-hover> {{ dashIfEmpty(buy.total) }}</QTd>
-            </QTr>
-            <QTr>
-                <QTd colspan="5" no-hover>
-                    <span class="label">{{ t('Total entry') }}: </span>
-                    <span>{{ row.total }} €</span>
-                </QTd>
-                <QTd no-hover>
-                    <span class="label">{{ t('Total stems') }}: </span>
-                    <span>{{ row.quantity }}</span>
-                </QTd>
-            </QTr>
-        </template>
-    </QTable>
+                    <QTd no-hover>
+                        <span>{{ buy.subName }}</span>
+                        <FetchedTags :item="buy" />
+                    </QTd>
+                    <QTd no-hover> {{ dashIfEmpty(buy.quantity) }}</QTd>
+                    <QTd no-hover> {{ dashIfEmpty(buy.price) }}</QTd>
+                    <QTd colspan="2" no-hover> {{ dashIfEmpty(buy.total) }}</QTd>
+                </QTr>
+                <QTr>
+                    <QTd colspan="5" no-hover>
+                        <span class="label">{{ t('Total entry') }}: </span>
+                        <span>{{ row.total }} €</span>
+                    </QTd>
+                    <QTd no-hover>
+                        <span class="label">{{ t('Total stems') }}: </span>
+                        <span>{{ row.quantity }}</span>
+                    </QTd>
+                </QTr>
+            </template>
+        </QTable>
+    </QPage>
 </template>
 
 <style scoped lang="scss">

src/pages/Supplier/Card/SupplierFiscalData.vue

@@ -9,6 +9,7 @@ import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnLocation from 'src/components/common/VnLocation.vue';
+import VnSelectVies from 'src/components/common/VnSelectVies.vue';
 import VnAccountNumber from 'src/components/common/VnAccountNumber.vue';
 
 const route = useRoute();
@@ -68,7 +69,7 @@ function handleLocation(data, location) {
                 'supplierActivityFk',
                 'healthRegister',
                 'street',
-                'isVies',
+                'viesCode',
                 'isTrucker',
             ],
             include: [
@@ -173,34 +174,15 @@ function handleLocation(data, location) {
                         country: data.country,
                     }"
                     @update:model-value="(location) => handleLocation(data, location)"
-                >
-                </VnLocation>
+                />
             </VnRow>
             <VnRow>
-                <div class="col flex justify-around">
-                    <QCheckbox
-                        v-model="data.isTrucker"
-                        :label="t('supplier.fiscalData.isTrucker')"
-                    />
-                    <div class="row items-center">
-                        <QCheckbox v-model="data.isVies" :label="t('globals.isVies')" />
-                        <QIcon name="info" size="xs" class="cursor-pointer q-ml-sm">
-                            <QTooltip>
-                                {{
-                                    t(
-                                        'When activating it, do not enter the country code in the ID field.'
-                                    )
-                                }}
-                            </QTooltip>
-                        </QIcon>
-                    </div>
-                </div>
+                <VnSelectVies v-model="data.viesCode" />
+                <QCheckbox
+                    v-model="data.isTrucker"
+                    :label="t('supplier.fiscalData.isTrucker')"
+                />
             </VnRow>
         </template>
     </FormModel>
 </template>
-
-<i18n>
-es:
-    When activating it, do not enter the country code in the ID field.: Al activarlo, no informar el código del país en el campo nif
-</i18n>

src/pages/Supplier/SupplierList.vue

@@ -2,15 +2,14 @@
 import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import VnTable from 'components/VnTable/VnTable.vue';
-import VnSection from 'src/components/common/VnSection.vue';
+import VnSearchbar from 'components/ui/VnSearchbar.vue';
+import RightMenu from 'src/components/common/RightMenu.vue';
+import SupplierListFilter from './SupplierListFilter.vue';
 import VnInput from 'src/components/common/VnInput.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
-import FetchData from 'src/components/FetchData.vue';
 
 const { t } = useI18n();
 const tableRef = ref();
-const dataKey = 'SupplierList';
-const provincesOptions = ref([]);
+
 const columns = computed(() => [
     {
         align: 'left',
@@ -105,62 +104,38 @@ const columns = computed(() => [
     },
 ]);
 </script>
+
 <template>
-    <FetchData
-        url="Provinces"
-        :filter="{ fields: ['id', 'name'], order: 'name ASC' }"
-        @on-fetch="(data) => (provincesOptions = data)"
-        auto-load
-    />
-    <VnSection
-        :data-key="dataKey"
-        :columns="columns"
-        prefix="supplier"
-        :array-data-props="{
-            url: 'Suppliers/filter',
-            order: 'id ASC',
+    <VnSearchbar data-key="SuppliersList" :limit="20" :label="t('Search suppliers')" />
+    <RightMenu>
+        <template #right-panel>
+            <SupplierListFilter data-key="SuppliersList" />
+        </template>
+    </RightMenu>
+    <VnTable
+        ref="tableRef"
+        data-key="SuppliersList"
+        url="Suppliers/filter"
+        redirect="supplier"
+        :create="{
+            urlCreate: 'Suppliers/newSupplier',
+            title: t('Create Supplier'),
+            onDataSaved: ({ id }) => tableRef.redirect(id),
+            formInitialData: {},
+            mapper: (data) => {
+                data.name = data.socialName;
+
+                return data;
+            },
         }"
+        :right-search="false"
+        order="id ASC"
+        :columns="columns"
     >
-        <template #body>
-            <VnTable
-                ref="tableRef"
-                :data-key="dataKey"
-                :create="{
-                    urlCreate: 'Suppliers/newSupplier',
-                    title: t('Create Supplier'),
-                    onDataSaved: ({ id }) => tableRef.redirect(id),
-                    formInitialData: {},
-                    mapper: (data) => {
-                        data.name = data.socialName;
-                        delete data.socialName;
-                        return data;
-                    },
-                }"
-                :columns="columns"
-                redirect="supplier"
-                :right-search="false"
-            >
-                <template #more-create-dialog="{ data }">
-                    <VnInput
-                        :label="t('globals.name')"
-                        v-model="data.socialName"
-                        :uppercase="true"
-                    />
-                </template>
-            </VnTable>
-        </template>
-        <template #moreFilterPanel="{ params, searchFn }">
-            <VnSelect
-                :label="t('globals.params.provinceFk')"
-                v-model="params.provinceFk"
-                @update:model-value="searchFn()"
-                :options="provincesOptions"
-                filled
-                dense
-                class="q-px-sm q-pr-lg"
-            />
-        </template>
-    </VnSection>
+        <template #more-create-dialog="{ data }">
+            <VnInput :label="t('globals.name')" v-model="data.socialName" :uppercase="true" />
+            </template>
+    </VnTable>
 </template>
 
 <i18n>

src/pages/Supplier/SupplierListFilter.vue

@@ -0,0 +1,122 @@
+<script setup>
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
+import VnSelect from 'src/components/common/VnSelect.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+import FetchData from 'components/FetchData.vue';
+
+const props = defineProps({
+    dataKey: {
+        type: String,
+        required: true,
+    },
+});
+
+const { t } = useI18n();
+
+const provincesOptions = ref([]);
+const countriesOptions = ref([]);
+</script>
+
+<template>
+    <FetchData
+        url="Provinces"
+        :filter="{ fields: ['id', 'name'], order: 'name ASC'}"
+        @on-fetch="(data) => (provincesOptions = data)"
+        auto-load
+    />
+    <FetchData
+        url="countries"
+        :filter="{ fields: ['id', 'name'], order: 'name ASC'}"
+        @on-fetch="(data) => (countriesOptions = data)"
+        auto-load
+    />
+    <VnFilterPanel
+        :data-key="props.dataKey"
+        :search-button="true"
+        :unremovable-params="['supplierFk']"
+    >
+        <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 }">
+            <QItem>
+                <QItemSection>
+                    <VnInput
+                        v-model="params.search"
+                        :label="t('params.search')"
+                        is-outlined
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnInput
+                        v-model="params.nickname"
+                        :label="t('params.nickname')"
+                        is-outlined
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnInput v-model="params.nif" :label="t('params.nif')" is-outlined />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnSelect
+                        :label="t('params.provinceFk')"
+                        v-model="params.provinceFk"
+                        @update:model-value="searchFn()"
+                        :options="provincesOptions"
+                        option-value="id"
+                        option-label="name"
+                        hide-selected
+                        dense
+                        outlined
+                        rounded
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnSelect
+                        :label="t('params.countryFk')"
+                        v-model="params.countryFk"
+                        @update:model-value="searchFn()"
+                        :options="countriesOptions"
+                        option-value="id"
+                        option-label="name"
+                        hide-selected
+                        dense
+                        outlined
+                        rounded
+                    />
+                </QItemSection>
+            </QItem>
+        </template>
+    </VnFilterPanel>
+</template>
+
+<i18n>
+en:
+    params:
+        search: General search
+        nickname: Alias
+        nif: Tax number
+        provinceFk: Province
+        countryFk: Country
+es:
+    params:
+        search: Búsqueda general
+        nickname: Alias
+        nif: NIF/CIF
+        provinceFk: Provincia
+        countryFk: País
+</i18n>

src/pages/Ticket/TicketFuture.vue

@@ -376,30 +376,6 @@ onMounted(async () => {
             </template>
             <template #body-cell-problems="{ row }">
                 <QTd class="q-gutter-x-xs">
-                    <QIcon
-                        v-if="row.futureAgencyFk !== row.agencyFk && row.agencyFk"
-                        color="primary"
-                        name="vn:agency-term"
-                        size="xs"
-                        class="q-mr-xs"
-                    >
-                        <QTooltip class="column">
-                            <span>
-                                {{
-                                    t('advanceTickets.originAgency', {
-                                        agency: row.futureAgency,
-                                    })
-                                }}
-                            </span>
-                            <span>
-                                {{
-                                    t('advanceTickets.destinationAgency', {
-                                        agency: row.agency,
-                                    })
-                                }}
-                            </span>
-                        </QTooltip>
-                    </QIcon>
                     <QIcon
                         v-if="row.isTaxDataChecked === 0"
                         color="primary"

src/router/index.js

@@ -107,10 +107,7 @@ export default defineRouter(function (/* { store, ssrContext } */) {
             'Failed to fetch dynamically imported module',
             'Importing a module script failed',
         ];
-        state.set(
-            'error',
-            errorMessages.some((error) => message.startsWith(error)),
-        );
+        state.set('error', errorMessages.some(message.includes));
     });
     return Router;
 });

src/router/modules/supplier.js

@@ -1,12 +1,19 @@
 import { RouterView } from 'vue-router';
 
-const supplierCard = {
-    name: 'SupplierCard',
-    path: ':id',
-    component: () => import('src/pages/Supplier/Card/SupplierCard.vue'),
-    redirect: { name: 'SupplierSummary' },
+export default {
+    path: '/supplier',
+    name: 'Supplier',
     meta: {
-        menu: [
+        title: 'suppliers',
+        icon: 'vn:supplier',
+        moduleName: 'Supplier',
+        keyBinding: 'p',
+    },
+    component: RouterView,
+    redirect: { name: 'SupplierMain' },
+    menus: {
+        main: ['SupplierList'],
+        card: [
             'SupplierBasicData',
             'SupplierFiscalData',
             'SupplierBillingData',
@@ -20,165 +27,21 @@ const supplierCard = {
             'SupplierDms',
         ],
     },
-    children: [
-        {
-            name: 'SupplierSummary',
-            path: 'summary',
-            meta: {
-                title: 'summary',
-                icon: 'launch',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierSummary.vue'),
-        },
-        {
-            path: 'basic-data',
-            name: 'SupplierBasicData',
-            meta: {
-                title: 'basicData',
-                icon: 'vn:settings',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierBasicData.vue'),
-        },
-        {
-            path: 'fiscal-data',
-            name: 'SupplierFiscalData',
-            meta: {
-                title: 'fiscalData',
-                icon: 'vn:dfiscales',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierFiscalData.vue'),
-        },
-        {
-            path: 'billing-data',
-            name: 'SupplierBillingData',
-            meta: {
-                title: 'billingData',
-                icon: 'vn:payment',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierBillingData.vue'),
-        },
-        {
-            path: 'log',
-            name: 'SupplierLog',
-            meta: {
-                title: 'log',
-                icon: 'vn:History',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierLog.vue'),
-        },
-        {
-            path: 'account',
-            name: 'SupplierAccounts',
-            meta: {
-                title: 'accounts',
-                icon: 'vn:credit',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierAccounts.vue'),
-        },
-        {
-            path: 'contact',
-            name: 'SupplierContacts',
-            meta: {
-                title: 'contacts',
-                icon: 'contact_phone',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierContacts.vue'),
-        },
-        {
-            path: 'address',
-            name: 'SupplierAddresses',
-            meta: {
-                title: 'addresses',
-                icon: 'vn:delivery',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierAddresses.vue'),
-        },
-        {
-            path: 'address/create',
-            name: 'SupplierAddressesCreate',
-            component: () =>
-                import('src/pages/Supplier/Card/SupplierAddressesCreate.vue'),
-        },
-        {
-            path: 'balance',
-            name: 'SupplierBalance',
-            meta: {
-                title: 'balance',
-                icon: 'balance',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierBalance.vue'),
-        },
-        {
-            path: 'consumption',
-            name: 'SupplierConsumption',
-            meta: {
-                title: 'consumption',
-                icon: 'show_chart',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierConsumption.vue'),
-        },
-        {
-            path: 'agency-term',
-            name: 'SupplierAgencyTerm',
-            meta: {
-                title: 'agencyTerm',
-                icon: 'vn:agency-term',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierAgencyTerm.vue'),
-        },
-        {
-            path: 'dms',
-            name: 'SupplierDms',
-            meta: {
-                title: 'dms',
-                icon: 'smb_share',
-            },
-            component: () => import('src/pages/Supplier/Card/SupplierDms.vue'),
-        },
-        {
-            path: 'agency-term/create',
-            name: 'SupplierAgencyTermCreate',
-            component: () =>
-                import('src/pages/Supplier/Card/SupplierAgencyTermCreate.vue'),
-        },
-    ],
-};
-
-export default {
-    name: 'Supplier',
-    path: '/supplier',
-    meta: {
-        title: 'suppliers',
-        icon: 'vn:supplier',
-        moduleName: 'Supplier',
-        keyBinding: 'p',
-        menu: ['SupplierList'],
-    },
-    component: RouterView,
-    redirect: { name: 'SupplierMain' },
     children: [
         {
             path: '',
             name: 'SupplierMain',
             component: () => import('src/components/common/VnModule.vue'),
-            redirect: { name: 'SupplierIndexMain' },
+            redirect: { name: 'SupplierList' },
             children: [
                 {
-                    path: '',
-                    name: 'SupplierIndexMain',
-                    redirect: { name: 'SupplierList' },
+                    path: 'list',
+                    name: 'SupplierList',
+                    meta: {
+                        title: 'list',
+                        icon: 'view_list',
+                    },
                     component: () => import('src/pages/Supplier/SupplierList.vue'),
-                    children: [
-                        {
-                            path: 'list',
-                            name: 'SupplierList',
-                            meta: {
-                                title: 'list',
-                                icon: 'view_list',
-                            },
-                        },
-                        supplierCard,
-                    ],
                 },
                 {
                     path: 'create',
@@ -191,5 +54,143 @@ export default {
                 },
             ],
         },
+        {
+            name: 'SupplierCard',
+            path: ':id',
+            component: () => import('src/pages/Supplier/Card/SupplierCard.vue'),
+            redirect: { name: 'SupplierSummary' },
+            children: [
+                {
+                    name: 'SupplierSummary',
+                    path: 'summary',
+                    meta: {
+                        title: 'summary',
+                        icon: 'launch',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierSummary.vue'),
+                },
+                {
+                    path: 'basic-data',
+                    name: 'SupplierBasicData',
+                    meta: {
+                        title: 'basicData',
+                        icon: 'vn:settings',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierBasicData.vue'),
+                },
+                {
+                    path: 'fiscal-data',
+                    name: 'SupplierFiscalData',
+                    meta: {
+                        title: 'fiscalData',
+                        icon: 'vn:dfiscales',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierFiscalData.vue'),
+                },
+                {
+                    path: 'billing-data',
+                    name: 'SupplierBillingData',
+                    meta: {
+                        title: 'billingData',
+                        icon: 'vn:payment',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierBillingData.vue'),
+                },
+                {
+                    path: 'log',
+                    name: 'SupplierLog',
+                    meta: {
+                        title: 'log',
+                        icon: 'vn:History',
+                    },
+                    component: () => import('src/pages/Supplier/Card/SupplierLog.vue'),
+                },
+                {
+                    path: 'account',
+                    name: 'SupplierAccounts',
+                    meta: {
+                        title: 'accounts',
+                        icon: 'vn:credit',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierAccounts.vue'),
+                },
+                {
+                    path: 'contact',
+                    name: 'SupplierContacts',
+                    meta: {
+                        title: 'contacts',
+                        icon: 'contact_phone',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierContacts.vue'),
+                },
+                {
+                    path: 'address',
+                    name: 'SupplierAddresses',
+                    meta: {
+                        title: 'addresses',
+                        icon: 'vn:delivery',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierAddresses.vue'),
+                },
+                {
+                    path: 'address/create',
+                    name: 'SupplierAddressesCreate',
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierAddressesCreate.vue'),
+                },
+                {
+                    path: 'balance',
+                    name: 'SupplierBalance',
+                    meta: {
+                        title: 'balance',
+                        icon: 'balance',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierBalance.vue'),
+                },
+                {
+                    path: 'consumption',
+                    name: 'SupplierConsumption',
+                    meta: {
+                        title: 'consumption',
+                        icon: 'show_chart',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierConsumption.vue'),
+                },
+                {
+                    path: 'agency-term',
+                    name: 'SupplierAgencyTerm',
+                    meta: {
+                        title: 'agencyTerm',
+                        icon: 'vn:agency-term',
+                    },
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierAgencyTerm.vue'),
+                },
+                {
+                    path: 'dms',
+                    name: 'SupplierDms',
+                    meta: {
+                        title: 'dms',
+                        icon: 'smb_share',
+                    },
+                    component: () => import('src/pages/Supplier/Card/SupplierDms.vue'),
+                },
+                {
+                    path: 'agency-term/create',
+                    name: 'SupplierAgencyTermCreate',
+                    component: () =>
+                        import('src/pages/Supplier/Card/SupplierAgencyTermCreate.vue'),
+                },
+            ],
+        },
     ],
 };