refactor: streamline image build process in run.sh

Reviewed-on: #1725
Reviewed-by: Alex Moreno <alexm@verdnatura.es>

cypress.config.js

@@ -64,5 +64,6 @@ export default defineConfig({
         ...timeouts,
         includeShadowDom: true,
         waitForAnimations: true,
+        testIsolation: false,
     },
 });

src/boot/quasar.js

@@ -7,7 +7,7 @@ import { QLayout } from 'quasar';
 import mainShortcutMixin from './mainShortcutMixin';
 import { useCau } from 'src/composables/useCau';
 
-export default boot(({ app }) => {
+export default boot(({ app, router }) => {
     QForm.mixins = [qFormMixin];
     QLayout.mixins = [mainShortcutMixin];
 
@@ -22,6 +22,14 @@ export default boot(({ app }) => {
         }
 
         switch (response?.status) {
+            case 401:
+                if (!router.currentRoute.value.name.toLowerCase().includes('login')) {
+                    message = 'errors.sessionExpired';
+                } else message = 'login.loginError';
+                break;
+            case 403:
+                if (!message || message.toLowerCase() === 'access denied')
+                    message = 'errors.accessDenied';
             case 422:
                 if (error.name == 'ValidationError')
                     message += ` "${responseError.details.context}.${Object.keys(

src/components/CrudModel.vue

@@ -1,6 +1,6 @@
 <script setup>
 import axios from 'axios';
-import { computed, ref, useAttrs, watch } from 'vue';
+import { computed, ref, useAttrs, watch, nextTick } from 'vue';
 import { useRouter, onBeforeRouteLeave } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
@@ -42,7 +42,15 @@ const $props = defineProps({
     },
     dataRequired: {
         type: Object,
-        default: () => {},
+        default: () => ({}),
+    },
+    dataDefault: {
+        type: Object,
+        default: () => ({}),
+    },
+    insertOnLoad: {
+        type: Boolean,
+        default: false,
     },
     defaultSave: {
         type: Boolean,
@@ -87,6 +95,7 @@ const formData = ref();
 const saveButtonRef = ref(null);
 const watchChanges = ref();
 const formUrl = computed(() => $props.url);
+const rowsContainer = ref(null);
 
 const emit = defineEmits(['onFetch', 'update:selected', 'saveChanges']);
 
@@ -122,9 +131,11 @@ async function fetch(data) {
     const rows = keyData ? data[keyData] : data;
     resetData(rows);
     emit('onFetch', rows);
+    $props.insertOnLoad && await insert();
     return rows;
 }
 
+
 function resetData(data) {
     if (!data) return;
     if (data && Array.isArray(data)) {
@@ -135,9 +146,16 @@ function resetData(data) {
     formData.value = JSON.parse(JSON.stringify(data));
 
     if (watchChanges.value) watchChanges.value(); //destroy watcher
-    watchChanges.value = watch(formData, () => (hasChanges.value = true), { deep: true });
+    watchChanges.value = watch(formData, (nVal) => {
-}
+        hasChanges.value = false;
+        const filteredNewData = nVal.filter(row => !isRowEmpty(row) || row[$props.primaryKey]);
+        const filteredOriginal = originalData.value.filter(row => row[$props.primaryKey]);
 
+        const changes = getDifferences(filteredOriginal, filteredNewData);
+        hasChanges.value = !isEmpty(changes);
+
+    }, { deep: true });
+}
 async function reset() {
     await fetch(originalData.value);
     hasChanges.value = false;
@@ -165,7 +183,9 @@ async function onSubmit() {
         });
     }
     isLoading.value = true;
+    
     await saveChanges($props.saveFn ? formData.value : null);
+    
 }
 
 async function onSubmitAndGo() {
@@ -174,6 +194,10 @@ async function onSubmitAndGo() {
 }
 
 async function saveChanges(data) {
+    formData.value = formData.value.filter(row => 
+    row[$props.primaryKey] || !isRowEmpty(row)
+    );
+    
     if ($props.saveFn) {
         $props.saveFn(data, getChanges);
         isLoading.value = false;
@@ -203,14 +227,32 @@ async function saveChanges(data) {
     });
 }
 
-async function insert(pushData = $props.dataRequired) {
+async function insert(pushData = { ...$props.dataRequired, ...$props.dataDefault }) {
-    const $index = formData.value.length
+    formData.value = formData.value.filter(row => !isRowEmpty(row));
-        ? formData.value[formData.value.length - 1].$index + 1
+
-        : 0;
+    const lastRow = formData.value.at(-1);
-    formData.value.push(Object.assign({ $index }, pushData));
+    const isLastRowEmpty = lastRow ? isRowEmpty(lastRow) : false;
-    hasChanges.value = true;
+    
+    if (formData.value.length && isLastRowEmpty) return;
+    const $index = formData.value.length ? formData.value.at(-1).$index + 1 : 0;
+    
+    const nRow = Object.assign({ $index }, pushData);
+    formData.value.push(nRow);
+    
+    const hasChange = Object.keys(nRow).some(key => !isChange(nRow, key));
+    if (hasChange) hasChanges.value = true;
 }
 
+function isRowEmpty(row) {
+    return Object.keys(row).every(key => isChange(row, key));
+}
+
+
+function isChange(row,key){
+    return !row[key] || key == '$index' || Object.hasOwn($props.dataRequired || {}, key);
+}
+
+
 async function remove(data) {
     if (!data.length)
         return quasar.notify({
@@ -227,10 +269,8 @@ async function remove(data) {
         newData = newData.filter(
             (form) => !preRemove.some((index) => index == form.$index),
         );
-        const changes = getChanges();
+        formData.value = newData;
-        if (!changes.creates?.length && !changes.updates?.length)
+        hasChanges.value = JSON.stringify(removeIndexField(formData.value)) !== JSON.stringify(removeIndexField(originalData.value));
-            hasChanges.value = false;
-        fetch(newData);
     }
     if (ids.length) {
         quasar
@@ -248,9 +288,8 @@ async function remove(data) {
                 newData = newData.filter((form) => !ids.some((id) => id == form[pk]));
                 fetch(newData);
             });
-    } else {
-        reset();
     }
+
     emit('update:selected', []);
 }
 
@@ -261,7 +300,7 @@ function getChanges() {
     const pk = $props.primaryKey;
     for (const [i, row] of formData.value.entries()) {
         if (!row[pk]) {
-            creates.push(row);
+            creates.push(Object.assign(row, { ...$props.dataRequired }));
         } else if (originalData.value[i]) {
             const data = getDifferences(originalData.value[i], row);
             if (!isEmpty(data)) {
@@ -287,6 +326,33 @@ function isEmpty(obj) {
     return !Object.keys(obj).length;
 }
 
+function removeIndexField(data) {
+    if (Array.isArray(data)) {
+        return data.map(({ $index, ...rest }) => rest);
+    } else if (typeof data === 'object' && data !== null) {
+        const { $index, ...rest } = data;
+        return rest;
+    }
+}
+
+async function handleTab(event) {
+    event.preventDefault();
+    const { shiftKey, target } = event;
+    const focusableSelector = `tbody tr td:not(:first-child) :is(a, button, input, textarea, select, details):not([disabled])`;
+    const focusableElements = rowsContainer.value?.querySelectorAll(focusableSelector);
+    const currentIndex = Array.prototype.indexOf.call(focusableElements, target);
+    const index = shiftKey ? currentIndex - 1 : currentIndex + 1;
+    const isLast = target === focusableElements[focusableElements.length - 1];
+    const isFirst = currentIndex === 0;
+
+    if ((shiftKey && !isFirst) || (!shiftKey && !isLast))
+        focusableElements[index]?.focus();
+    else if (isLast) {
+        await insert();
+        await nextTick();
+    }
+}
+
 async function reload(params) {
     const data = await vnPaginateRef.value.fetch(params);
     fetch(data);
@@ -312,12 +378,14 @@ watch(formUrl, async () => {
         v-bind="$attrs"
     >
         <template #body v-if="formData">
+            <div ref="rowsContainer" @keydown.tab="handleTab">
                 <slot
                     name="body"
                     :rows="formData"
                     :validate="validate"
                     :filter="filter"
                 ></slot>
+            </div>
         </template>
     </VnPaginate>
     <Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown() && hasSubToolbar">

src/components/VnTable/VnColumn.vue

@@ -181,6 +181,10 @@ const col = computed(() => {
         newColumn.component = 'checkbox';
     if ($props.default && !newColumn.component) newColumn.component = $props.default;
     
+    if (typeof newColumn.component !== 'string') {
+        newColumn.attrs = { ...newColumn.component.attrs, autofocus: $props.autofocus };
+        newColumn.event = { ...newColumn.component.event, ...$props?.eventHandlers };
+    }
     return newColumn;
 });
 

src/components/VnTable/VnTable.vue

@@ -331,15 +331,9 @@ function stopEventPropagation(event) {
     event.stopPropagation();
 }
 
-function clearSelected() {
-    if ($props.multiCheck.expand) {
-        selectAll.value = false;
-        selected.value = [];
-    }
-}
-
 function reload(params) {
-    clearSelected();
+    selected.value = [];
+    selectAll.value = false;
     CrudModelRef.value.reload(params);
 }
 
@@ -690,7 +684,10 @@ const handleHeaderSelection = (evt, data) => {
         ref="CrudModelRef"
         @on-fetch="
             (...args) => {
-                clearSelected();
+                if ($props.multiCheck.expand) {
+                    selectAll = false;
+                    selected = [];
+                }
                 emit('onFetch', ...args);
             }
         "

src/components/__tests__/CrudModel.spec.js

@@ -193,11 +193,11 @@ describe('CrudModel', () => {
         });
 
         it('should set originalData and formatData with data and generate watchChanges', async () => {
-            data = {
+            data = [{
                 name: 'Tony',
                 lastName: 'Stark',
                 age: 42,
-            };
+            }];
 
             vm.resetData(data);
 

src/components/common/VnBankDetailsForm.vue

@@ -72,7 +72,7 @@ const getBankEntities = (data) => {
         :acls="[{ model: 'BankEntity', props: '*', accessType: 'WRITE' }]"
         :options="bankEntities"
         hide-selected
-        option-label="name"
+        option-label="bic"
         option-value="id"
         v-model="bankEntityFk"
         @update:model-value="$emit('updateBic', { iban, bankEntityFk })"

src/components/common/VnSelectExpense.vue

@@ -0,0 +1,49 @@
+<script setup>
+import { ref, useTemplateRef } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useAccountShortToStandard } from 'src/composables/useAccountShortToStandard';
+import VnSelectDialog from './VnSelectDialog.vue';
+import CreateNewExpenseForm from '../CreateNewExpenseForm.vue';
+import FetchData from '../FetchData.vue';
+
+const model = defineModel({ type: [String, Number, Object] });
+const { t } = useI18n();
+const expenses = ref([]);
+const selectDialogRef = useTemplateRef('selectDialogRef');
+
+async function autocompleteExpense(evt) {
+    const val = evt.target.value;
+    if (!val || isNaN(val)) return;
+    const lookup = expenses.value.find(({ id }) => id == useAccountShortToStandard(val));
+    if (selectDialogRef.value)
+        selectDialogRef.value.vnSelectDialogRef.vnSelectRef.toggleOption(lookup);
+}
+</script>
+<template>
+    <VnSelectDialog
+        v-bind="$attrs"
+        ref="selectDialogRef"
+        v-model="model"
+        :options="expenses"
+        option-value="id"
+        :option-label="(x) => `${x.id}: ${x.name}`"
+        :filter-options="['id', 'name']"
+        :tooltip="t('Create a new expense')"
+        :acls="[{ model: 'Expense', props: '*', accessType: 'WRITE' }]"
+        @keydown.tab.prevent="autocompleteExpense"
+    >
+        <template #form>
+            <CreateNewExpenseForm @on-data-saved="$refs.expensesRef.fetch()" />
+        </template>
+    </VnSelectDialog>
+    <FetchData
+        ref="expensesRef"
+        url="Expenses"
+        auto-load
+        @on-fetch="(data) => (expenses = data)"
+    />
+</template>
+<i18n>
+es:
+    Create a new expense: Crear nuevo gasto
+</i18n>

src/components/common/__tests__/VnBankDetailsForm.spec.js

@@ -40,4 +40,11 @@ describe('VnBankDetail Component', () => {
         await vm.autofillBic('ES1234567891324567891234');
         expect(vm.bankEntityFk).toBe(null);
     });
+
+    it('should not update bankEntityFk if IBAN country is not ES', async () => {
+        vm.bankEntities = bankEntities;
+
+        await vm.autofillBic('FR1420041010050500013M02606');
+        expect(vm.bankEntityFk).toBe(null);
+    });
 });

src/components/ui/VnNotes.vue

@@ -35,6 +35,7 @@ const $props = defineProps({
     selectType: { type: Boolean, default: false },
     justInput: { type: Boolean, default: false },
     goTo: { type: String, default: '' },
+    useUserRelation: { type: Boolean, default: true },
 });
 
 const { t } = useI18n();
@@ -54,6 +55,26 @@ const defaultObservationType = computed(
 let savedNote = false;
 let originalText;
 
+onBeforeRouteLeave((to, from, next) => {
+    if (
+        (newNote.text && !$props.justInput) ||
+        (newNote.text !== originalText && $props.justInput)
+    )
+        quasar.dialog({
+            component: VnConfirm,
+            componentProps: {
+                title: t('globals.unsavedPopup.title'),
+                message: t('globals.unsavedPopup.subtitle'),
+                promise: () => next(),
+            },
+        });
+    else next();
+});
+
+onMounted(() => {
+    nextTick(() => (componentIsRendered.value = true));
+});
+
 function handleClick(e) {
     if (e.shiftKey && e.key === 'Enter') return;
     if ($props.justInput) confirmAndUpdate();
@@ -108,22 +129,6 @@ async function update() {
     );
 }
 
-onBeforeRouteLeave((to, from, next) => {
-    if (
-        (newNote.text && !$props.justInput) ||
-        (newNote.text !== originalText && $props.justInput)
-    )
-        quasar.dialog({
-            component: VnConfirm,
-            componentProps: {
-                title: t('globals.unsavedPopup.title'),
-                message: t('globals.unsavedPopup.subtitle'),
-                promise: () => next(),
-            },
-        });
-    else next();
-});
-
 function fetchData([data]) {
     newNote.text = data?.notes;
     originalText = data?.notes;
@@ -137,16 +142,38 @@ const handleObservationTypes = (data) => {
     }
 };
 
-onMounted(() => {
-    nextTick(() => (componentIsRendered.value = true));
-});
-
 async function saveAndGo() {
     savedNote = false;
     await insert();
-    await savedNote;
     router.push({ path: $props.goTo });
 }
+
+function getUserFilter() {
+    const newUserFilter = $props.userFilter ?? {};
+    const userInclude = {
+        relation: 'user',
+        scope: {
+            fields: ['id', 'nickname', 'name'],
+        },
+    };
+    if (newUserFilter.include) {
+        if (Array.isArray(newUserFilter.include)) {
+            newUserFilter.include.push(userInclude);
+        } else {
+            newUserFilter.include = [userInclude, newUserFilter.include];
+        }
+    } else {
+        newUserFilter.include = userInclude;
+    }
+
+    if ($props.useUserRelation) {
+        return {
+            ...newUserFilter,
+            ...$props.userFilter,
+        };
+    }
+    return $props.filter;
+}
 </script>
 <template>
     <Teleport
@@ -242,7 +269,7 @@ async function saveAndGo() {
         :url="$props.url"
         order="created DESC"
         :limit="0"
-        :user-filter="userFilter"
+        :user-filter="getUserFilter()"
         :filter="filter"
         auto-load
         ref="vnPaginateRef"
@@ -261,15 +288,15 @@ async function saveAndGo() {
                     <QCardSection horizontal>
                         <VnAvatar
                             :descriptor="false"
-                            :worker-id="note.workerFk"
+                            :worker-id="note.user?.id"
                             size="md"
-                            :title="note.worker?.user.nickname"
+                            :title="note.user?.nickname"
                         />
                         <div class="full-width row justify-between q-pa-xs">
                             <div>
                                 <VnUserLink
-                                    :name="`${note.worker.user.name}`"
+                                    :name="`${note.user?.name}`"
-                                    :worker-id="note.worker.id"
+                                    :worker-id="note.user?.id"
                                 />
                                 <QBadge
                                     class="q-ml-xs"

src/i18n/locale/en.yml

@@ -400,6 +400,8 @@ errors:
     updateUserConfig: Error updating user config
     tokenConfig: Error fetching token config
     writeRequest: The requested operation could not be completed
+    sessionExpired: Your session has expired. Please log in again
+    accessDenied: Access denied
     claimBeginningQuantity: Cannot import a line with a claimed quantity of 0
 login:
     title: Login

src/i18n/locale/es.yml

@@ -396,6 +396,8 @@ errors:
     updateUserConfig: Error al actualizar la configuración de usuario
     tokenConfig: Error al obtener configuración de token
     writeRequest: No se pudo completar la operación solicitada
+    sessionExpired: Tu sesión ha expirado, por favor vuelve a iniciar sesión
+    accessDenied: Acceso denegado
     claimBeginningQuantity: No se puede importar una linea sin una cantidad reclamada
 login:
     title: Inicio de sesión

src/pages/Claim/Card/ClaimDevelopment.vue

@@ -138,6 +138,7 @@ const columns = computed(() => [
         :filter="developmentsFilter"
         ref="claimDevelopmentForm"
         :data-required="{ claimFk: route.params.id }"
+        :insert-on-load="true"
         v-model:selected="selected"
         @save-changes="$router.push(`/claim/${route.params.id}/action`)"
         :default-save="false"

src/pages/Claim/Card/ClaimNotes.vue

@@ -1,12 +1,9 @@
 <script setup>
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
-import { useState } from 'src/composables/useState';
 import VnNotes from 'src/components/ui/VnNotes.vue';
 
 const route = useRoute();
-const state = useState();
-const user = state.getUser();
 
 const $props = defineProps({
     id: { type: [Number, String], default: null },
@@ -15,24 +12,13 @@ const $props = defineProps({
 const claimId = computed(() => $props.id || route.params.id);
 
 const claimFilter = {
-    fields: ['id', 'created', 'workerFk', 'text'],
+    fields: ['id', 'created', 'userFk', 'text'],
-    include: {
-        relation: 'worker',
-        scope: {
-            fields: ['id', 'firstName', 'lastName'],
     include: {
         relation: 'user',
         scope: {
             fields: ['id', 'nickname', 'name'],
         },
     },
-        },
-    },
-};
-
-const body = {
-    claimFk: claimId.value,
-    workerFk: user.value.id,
 };
 </script>
 
@@ -43,7 +29,9 @@ const body = {
         :add-note="$props.addNote"
         :user-filter="claimFilter"
         :filter="{ where: { claimFk: claimId } }"
-        :body="body"
+        :body="{
+            claimFk: claimId,
+        }"
         v-bind="$attrs"
         style="overflow-y: auto"
     />

src/pages/Customer/Card/CustomerNotes.vue

@@ -1,12 +1,15 @@
 <script setup>
 import VnNotes from 'src/components/ui/VnNotes.vue';
+import { useState } from 'src/composables/useState';
+const state = useState();
+const user = state.getUser();
 </script>
 <template>
     <VnNotes
         url="clientObservations"
         :add-note="true"
         :filter="{ where: { clientFk: $route.params.id } }"
-        :body="{ clientFk: $route.params.id }"
+        :body="{ clientFk: $route.params.id, userFk: user.id }"
         style="overflow-y: auto"
         :select-type="true"
         required

src/pages/Customer/Defaulter/CustomerDefaulter.vue

@@ -76,7 +76,7 @@ const columns = computed(() => [
     },
     {
         align: 'left',
-        name: 'workerFk',
+        name: 'userFk',
         label: t('Author'),
         tooltip: t('Worker who made the last observation'),
         columnFilter: {
@@ -155,7 +155,7 @@ function exprBuilder(param, value) {
             return { [`c.${param}`]: value };
         case 'payMethod':
             return { [`c.payMethodFk`]: value };
-        case 'workerFk':
+        case 'userFk':
             return { [`co.${param}`]: value };
         case 'departmentFk':
             return { [`c.${param}`]: value };
@@ -229,10 +229,10 @@ function exprBuilder(param, value) {
                 <DepartmentDescriptorProxy :id="row.departmentFk" />
             </span>
         </template>
-        <template #column-workerFk="{ row }">
+        <template #column-userFk="{ row }">
             <span class="link" @click.stop>
                 {{ row.workerName }}
-                <WorkerDescriptorProxy :id="row.workerFk" />
+                <WorkerDescriptorProxy :id="row.userFk" />
             </span>
         </template>
     </VnTable>

src/pages/Entry/EntryPreAccount.vue

@@ -73,6 +73,7 @@ const columns = computed(() => [
             optionLabel: 'code',
             options: companies.value,
         },
+        orderBy: false,
     },
     {
         name: 'warehouse',

src/pages/InvoiceIn/Card/InvoiceInIntrastat.vue

@@ -90,6 +90,7 @@ const columns = computed(() => [
             auto-load
             :data-required="{ invoiceInFk: invoiceInId }"
             :filter="filter"
+            :insert-on-load="true"
             v-model:selected="rowsSelected"
             @on-fetch="(data) => (invoceInIntrastat = data)"
         >

src/pages/InvoiceIn/Card/InvoiceInVat.vue

@@ -1,21 +1,16 @@
 <script setup>
-import { ref, computed, nextTick } from 'vue';
+import { ref, computed, markRaw } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useArrayData } from 'src/composables/useArrayData';
 import { getTotal } from 'src/composables/getTotal';
 import { toCurrency } from 'src/filters';
 import FetchData from 'src/components/FetchData.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
-import CrudModel from 'src/components/CrudModel.vue';
-import VnInputNumber from 'src/components/common/VnInputNumber.vue';
-import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
-import CreateNewExpenseForm from 'src/components/CreateNewExpenseForm.vue';
 import { getExchange } from 'src/composables/getExchange';
-import { useAccountShortToStandard } from 'src/composables/useAccountShortToStandard';
+import VnTable from 'src/components/VnTable/VnTable.vue';
+import VnSelectExpense from 'src/components/common/VnSelectExpense.vue';
 
 const { t } = useI18n();
-
 const arrayData = useArrayData();
 const route = useRoute();
 const invoiceIn = computed(() => arrayData.store.data);
@@ -24,100 +19,142 @@ const expenses = ref([]);
 const sageTaxTypes = ref([]);
 const sageTransactionTypes = ref([]);
 const rowsSelected = ref([]);
-const invoiceInFormRef = ref();
+const invoiceInVatTableRef = ref();
 
-defineProps({
+defineProps({ actionIcon: { type: String, default: 'add' } });
-    actionIcon: {
+
-        type: String,
+function taxRate(invoiceInTax) {
-        default: 'add',
+    const sageTaxTypeId = invoiceInTax.taxTypeSageFk;
-    },
+    const taxRateSelection = sageTaxTypes.value.find(
-});
+        (transaction) => transaction.id == sageTaxTypeId,
+    );
+    const taxTypeSage = taxRateSelection?.rate ?? 0;
+    const taxableBase = invoiceInTax?.taxableBase ?? 0;
+
+    return (taxTypeSage / 100) * taxableBase;
+}
 
 const columns = computed(() => [
     {
-        name: 'expense',
+        name: 'expenseFk',
         label: t('Expense'),
-        field: (row) => row.expenseFk,
+        component: markRaw(VnSelectExpense),
-        options: expenses.value,
+        format: (row) => {
-        model: 'expenseFk',
+            const expense = expenses.value.find((e) => e.id === row.expenseFk);
-        optionValue: 'id',
+            return expense ? `${expense.id}: ${expense.name}` : row.expenseFk;
-        optionLabel: (row) => `${row.id}: ${row.name}`,
+        },
         sortable: true,
         align: 'left',
+        isEditable: true,
+        create: true,
+        width: '250px',
     },
     {
-        name: 'taxablebase',
+        name: 'taxableBase',
         label: t('Taxable base'),
-        field: (row) => row.taxableBase,
+        component: 'number',
-        model: 'taxableBase',
+        attrs: {
+            clearable: true,
+            'clear-icon': 'close',
+        },
         sortable: true,
         align: 'left',
+        isEditable: true,
+        create: true,
     },
     {
         name: 'isDeductible',
         label: t('invoiceIn.isDeductible'),
-        field: (row) => row.isDeductible,
+        component: 'checkbox',
-        model: 'isDeductible',
         align: 'center',
+        isEditable: true,
+        create: true,
+        createAttrs: {
+            defaultValue: true,
+        },
+        width: '100px',
     },
     {
-        name: 'sageiva',
+        name: 'taxTypeSageFk',
         label: t('Sage iva'),
-        field: (row) => row.taxTypeSageFk,
+        component: 'select',
+        attrs: {
             options: sageTaxTypes.value,
-        model: 'taxTypeSageFk',
             optionValue: 'id',
             optionLabel: (row) => `${row.id}: ${row.vat}`,
+            filterOptions: ['id', 'vat'],
+            'data-cy': 'vat-sageiva',
+        },
+        format: (row) => {
+            const taxType = sageTaxTypes.value.find((t) => t.id === row.taxTypeSageFk);
+            return taxType ? `${taxType.id}: ${taxType.vat}` : row.taxTypeSageFk;
+        },
         sortable: true,
         align: 'left',
+        isEditable: true,
+        create: true,
     },
     {
-        name: 'sagetransaction',
+        name: 'transactionTypeSageFk',
         label: t('Sage transaction'),
-        field: (row) => row.transactionTypeSageFk,
+        component: 'select',
+        attrs: {
             options: sageTransactionTypes.value,
-        model: 'transactionTypeSageFk',
             optionValue: 'id',
             optionLabel: (row) => `${row.id}: ${row.transaction}`,
+            filterOptions: ['id', 'transaction'],
+        },
+        format: (row) => {
+            const transType = sageTransactionTypes.value.find(
+                (t) => t.id === row.transactionTypeSageFk,
+            );
+            return transType
+                ? `${transType.id}: ${transType.transaction}`
+                : row.transactionTypeSageFk;
+        },
         sortable: true,
         align: 'left',
+        isEditable: true,
+        create: true,
     },
     {
         name: 'rate',
         label: t('Rate'),
-        sortable: true,
+        sortable: false,
-        field: (row) => taxRate(row, row.taxTypeSageFk),
+        format: (row) => taxRate(row).toFixed(2),
         align: 'left',
     },
     {
-        name: 'foreignvalue',
+        name: 'foreignValue',
         label: t('Foreign value'),
+        component: 'number',
         sortable: true,
-        field: (row) => row.foreignValue,
         align: 'left',
+        create: true,
+        disable: !isNotEuro(currency.value),
     },
     {
         name: 'total',
-        label: 'Total',
+        label: t('Total'),
         align: 'left',
+        format: (row) => (Number(row.taxableBase || 0) + Number(taxRate(row))).toFixed(2),
     },
 ]);
 
+const tableRows = computed(
+    () => invoiceInVatTableRef.value?.CrudModelRef?.formData || [],
+);
 const taxableBaseTotal = computed(() => {
-    return getTotal(invoiceInFormRef.value.formData, 'taxableBase');
+    return getTotal(tableRows.value, 'taxableBase');
 });
-
 const taxRateTotal = computed(() => {
-    return getTotal(invoiceInFormRef.value.formData, null, {
+    return tableRows.value.reduce((sum, row) => sum + Number(taxRate(row)), 0);
-        cb: taxRate,
-    });
 });
-
 const combinedTotal = computed(() => {
     return +taxableBaseTotal.value + +taxRateTotal.value;
 });
 
-const filter = {
+const filter = computed(() => ({
     fields: [
         'id',
         'invoiceInFk',
@@ -131,388 +168,75 @@ const filter = {
     where: {
         invoiceInFk: route.params.id,
     },
-};
+}));
 
 const isNotEuro = (code) => code != 'EUR';
 
-function taxRate(invoiceInTax) {
+async function handleForeignValueUpdate(val, row) {
-    const sageTaxTypeId = invoiceInTax.taxTypeSageFk;
+    if (!isNotEuro(currency.value)) return;
-    const taxRateSelection = sageTaxTypes.value.find(
+    row.taxableBase = await getExchange(
-        (transaction) => transaction.id == sageTaxTypeId,
+        val,
+        invoiceIn.value?.currencyFk,
+        invoiceIn.value?.issued,
     );
-    const taxTypeSage = taxRateSelection?.rate ?? 0;
-    const taxableBase = invoiceInTax?.taxableBase ?? 0;
-
-    return ((taxTypeSage / 100) * taxableBase).toFixed(2);
-}
-
-function autocompleteExpense(evt, row, col, ref) {
-    const val = evt.target.value;
-    if (!val) return;
-
-    const param = isNaN(val) ? row[col.model] : val;
-    const lookup = expenses.value.find(
-        ({ id }) => id == useAccountShortToStandard(param),
-    );
-
-    ref.vnSelectDialogRef.vnSelectRef.toggleOption(lookup);
-}
-
-function setCursor(ref) {
-    nextTick(() => {
-        const select = ref.vnSelectDialogRef
-            ? ref.vnSelectDialogRef.vnSelectRef
-            : ref.vnSelectRef;
-        select.$el.querySelector('input').setSelectionRange(0, 0);
-    });
 }
 </script>
 <template>
-    <FetchData
+    <FetchData url="Expenses" auto-load @on-fetch="(data) => (expenses = data)" />
-        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
+    <VnTable
-        ref="invoiceInFormRef"
         v-if="invoiceIn"
+        ref="invoiceInVatTableRef"
         data-key="InvoiceInTaxes"
         url="InvoiceInTaxes"
+        save-url="InvoiceInTaxes/crud"
         :filter="filter"
         :data-required="{ invoiceInFk: $route.params.id }"
+        :insert-on-load="true"
         auto-load
         v-model:selected="rowsSelected"
-        :go-to="`/invoice-in/${$route.params.id}/due-day`"
-    >
-        <template #body="{ rows }">
-            <QTable
-                v-model:selected="rowsSelected"
-                selection="multiple"
         :columns="columns"
-                :rows="rows"
+        :is-editable="true"
-                row-key="$index"
+        :table="{ selection: 'multiple', 'row-key': '$index' }"
-                :grid="$q.screen.lt.sm"
+        footer
-            >
+        :right-search="false"
-                <template #body-cell-expense="{ row, col }">
+        :column-search="false"
-                    <QTd>
+        :disable-option="{ card: true }"
-                        <VnSelectDialog
+        class="q-pa-none"
-                            :ref="`expenseRef-${row.$index}`"
+        :create="{
-                            v-model="row[col.model]"
+            urlCreate: 'InvoiceInTaxes',
-                            :options="col.options"
+            title: t('Add tax'),
-                            :option-value="col.optionValue"
+            formInitialData: { invoiceInFk: $route.params.id, isDeductible: true },
-                            :option-label="col.optionLabel"
+            onDataSaved: () => invoiceInVatTableRef.reload(),
-                            :filter-options="['id', 'name']"
-                            :tooltip="t('Create a new expense')"
-                            :acls="[
-                                { model: 'Expense', props: '*', accessType: 'WRITE' },
-                            ]"
-                            @keydown.tab.prevent="
-                                autocompleteExpense(
-                                    $event,
-                                    row,
-                                    col,
-                                    $refs[`expenseRef-${row.$index}`],
-                                )
-                            "
-                            @update:model-value="
-                                setCursor($refs[`expenseRef-${row.$index}`])
-                            "
-                        >
-                            <template #option="scope">
-                                <QItem v-bind="scope.itemProps">
-                                    {{ `${scope.opt.id}: ${scope.opt.name}` }}
-                                </QItem>
-                            </template>
-                            <template #form>
-                                <CreateNewExpenseForm
-                                    @on-data-saved="$refs.expensesRef.fetch()"
-                                />
-                            </template>
-                        </VnSelectDialog>
-                    </QTd>
-                </template>
-                <template #body-cell-isDeductible="{ row }">
-                    <QTd align="center">
-                        <QCheckbox
-                            v-model="row.isDeductible"
-                            data-cy="isDeductible_checkbox"
-                        />
-                    </QTd>
-                </template>
-                <template #body-cell-taxablebase="{ row }">
-                    <QTd shrink>
-                        <VnInputNumber
-                            clear-icon="close"
-                            v-model="row.taxableBase"
-                            clearable
-                        />
-                    </QTd>
-                </template>
-                <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">
-                                    <QItemSection>
-                                        <QItemLabel>{{ scope.opt.vat }}</QItemLabel>
-                                        <QItemLabel>
-                                            {{ `#${scope.opt.id}` }}
-                                        </QItemLabel>
-                                    </QItemSection>
-                                </QItem>
-                            </template>
-                        </VnSelect>
-                    </QTd>
-                </template>
-                <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">
-                                    <QItemSection>
-                                        <QItemLabel>{{
-                                            scope.opt.transaction
-                                        }}</QItemLabel>
-                                        <QItemLabel>
-                                            {{ `#${scope.opt.id}` }}
-                                        </QItemLabel>
-                                    </QItemSection>
-                                </QItem>
-                            </template>
-                        </VnSelect>
-                    </QTd>
-                </template>
-                <template #body-cell-foreignvalue="{ row }">
-                    <QTd shrink>
-                        <VnInputNumber
-                            :class="{
-                                'no-pointer-events': !isNotEuro(currency),
         }"
-                            :disable="!isNotEuro(currency)"
+        :crud-model="{ goTo: `/invoice-in/${$route.params.id}/due-day` }"
-                            v-model="row.foreignValue"
+    >
-                            @update:model-value="
+        <template #column-footer-taxableBase>
-                                async (val) => {
-                                    if (!isNotEuro(currency)) return;
-                                    row.taxableBase = await getExchange(
-                                        val,
-                                        row.currencyFk,
-                                        invoiceIn.issued,
-                                    );
-                                }
-                            "
-                        />
-                    </QTd>
-                </template>
-                <template #bottom-row>
-                    <QTr class="bg">
-                        <QTd />
-                        <QTd />
-                        <QTd>
             {{ toCurrency(taxableBaseTotal) }}
-                        </QTd>
+        </template>
-                        <QTd />
+        <template #column-footer-rate>
-                        <QTd />
-                        <QTd />
-                        <QTd>
             {{ toCurrency(taxRateTotal) }}
-                        </QTd>
+        </template>
-                        <QTd />
+        <template #column-footer-total>
-                        <QTd>
             {{ toCurrency(combinedTotal) }}
-                        </QTd>
-                    </QTr>
         </template>
-
+    </VnTable>
-                <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>
-                                    <VnSelectDialog
-                                        :label="t('Expense')"
-                                        class="full-width"
-                                        v-model="props.row['expenseFk']"
-                                        :options="expenses"
-                                        option-value="id"
-                                        :option-label="(row) => `${row.id}:${row.name}`"
-                                        :filter-options="['id', 'name']"
-                                        :tooltip="t('Create a new expense')"
-                                    >
-                                        <template #option="scope">
-                                            <QItem v-bind="scope.itemProps">
-                                                {{ `${scope.opt.id}: ${scope.opt.name}` }}
-                                            </QItem>
-                                        </template>
-                                        <template #form>
-                                            <CreateNewExpenseForm />
-                                        </template>
-                                    </VnSelectDialog>
-                                </QItem>
-                                <QItem>
-                                    <VnInputNumber
-                                        :label="t('Taxable base')"
-                                        :class="{
-                                            'no-pointer-events': isNotEuro(currency),
-                                        }"
-                                        class="full-width"
-                                        :disable="isNotEuro(currency)"
-                                        clear-icon="close"
-                                        v-model="props.row.taxableBase"
-                                        clearable
-                                    />
-                                </QItem>
-                                <QItem>
-                                    <VnSelect
-                                        :label="t('Sage iva')"
-                                        class="full-width"
-                                        v-model="props.row['taxTypeSageFk']"
-                                        :options="sageTaxTypes"
-                                        option-value="id"
-                                        :option-label="(row) => `${row.id}:${row.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>
-                                    </VnSelect>
-                                </QItem>
-                                <QItem>
-                                    <VnSelect
-                                        class="full-width"
-                                        v-model="props.row['transactionTypeSageFk']"
-                                        :options="sageTransactionTypes"
-                                        option-value="id"
-                                        :option-label="
-                                            (row) => `${row.id}:${row.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>
-                                    </VnSelect>
-                                </QItem>
-                                <QItem>
-                                    {{ toCurrency(taxRate(props.row), currency) }}
-                                </QItem>
-                                <QItem>
-                                    <VnInputNumber
-                                        :label="t('Foreign value')"
-                                        class="full-width"
-                                        :class="{
-                                            'no-pointer-events': !isNotEuro(currency),
-                                        }"
-                                        :disable="!isNotEuro(currency)"
-                                        v-model="props.row.foreignValue"
-                                    />
-                                </QItem>
-                            </QList>
-                        </QCard>
-                    </div>
-                </template>
-            </QTable>
-        </template>
-    </CrudModel>
-    <QPageSticky position="bottom-right" :offset="[25, 25]">
-        <QBtn
-            color="primary"
-            icon="add"
-            size="lg"
-            v-shortcut="'+'"
-            round
-            @click="invoiceInFormRef.insert()"
-        >
-            <QTooltip>{{ t('Add tax') }}</QTooltip>
-        </QBtn>
-    </QPageSticky>
 </template>
-
-<style lang="scss" scoped>
-.bg {
-    background-color: var(--vn-light-gray);
-}
-@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;
-}
-.default-icon {
-    cursor: pointer;
-    border-radius: 50px;
-    background-color: $primary;
-}
-</style>
 <i18n>
 es:
     Expense: Gasto
     Create a new expense: Crear nuevo gasto
-    Add tax: Crear gasto
+    Add tax: Añadir Gasto/IVA # Changed label slightly
     Taxable base: Base imp.
-    Sage tax: Sage iva
+    Sage iva: Sage iva # Kept original label
     Sage transaction: Sage transacción
-    Rate: Tasa
+    Rate: Cuota # Changed label
     Foreign value: Divisa
+    Total: Total
+    invoiceIn.isDeductible: Deducible
 </i18n>

src/pages/Item/Card/ItemBarcode.vue

@@ -51,6 +51,7 @@ const submit = async (rows) => {
             <CrudModel
                 :data-required="{ itemFk: route.params.id }"
                 :default-remove="false"
+                :insert-on-load="true"
                 :filter="{
                     fields: ['id', 'itemFk', 'code'],
                     where: { itemFk: route.params.id },

src/pages/Item/Card/ItemTags.vue

@@ -76,15 +76,22 @@ const insertTag = (rows) => {
                 model="ItemTags"
                 url="ItemTags"
                 :data-required="{
-                    $index: undefined,
                     itemFk: route.params.id,
-                    priority: undefined,
                     tag: {
-                        isFree: undefined,
+                        isFree: true,
+                        value: undefined,
+                        name: undefined,
+                    },
+                    
+                }"
+                :data-default="{
+                    tag: {
+                        isFree: true,
                         value: undefined,
                         name: undefined,
                     },
                     tagFk: undefined,
+                    priority: undefined,
                 }"
                 :default-remove="false"
                 :user-filter="{

src/pages/Login/LoginMain.vue

@@ -1,12 +1,11 @@
 <script setup>
 import { ref } from 'vue';
-import { Notify } from 'quasar';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 import { useSession } from 'src/composables/useSession';
 import { useLogin } from 'src/composables/useLogin';
-
+import useNotify from 'src/composables/useNotify';
 import VnLogo from 'components/ui/VnLogo.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import axios from 'axios';
@@ -15,16 +14,14 @@ const session = useSession();
 const loginCache = useLogin();
 const router = useRouter();
 const { t } = useI18n();
+const { notify } = useNotify();
 
 const username = ref('');
 const password = ref('');
 const keepLogin = ref(true);
 
 async function onSubmit() {
-    const params = {
+    const params = { user: username.value, password: password.value };
-        user: username.value,
-        password: password.value,
-    };
     try {
         const { data } = await axios.post('Accounts/login', params);
         if (!data) return;
@@ -33,11 +30,7 @@ async function onSubmit() {
         await session.setLogin(data);
     } catch (res) {
         if (res.response?.data?.error?.code === 'REQUIRES_2FA') {
-            Notify.create({
+            notify(t('login.twoFactorRequired'), 'warning', 'phoneLink_lock');
-                message: t('login.twoFactorRequired'),
-                icon: 'phoneLink_lock',
-                type: 'warning',
-            });
             params.keepLogin = keepLogin.value;
             loginCache.setUser(params);
             return router.push({
@@ -45,10 +38,7 @@ async function onSubmit() {
                 query: router.currentRoute.value?.query,
             });
         }
-        Notify.create({
+        throw res;
-            message: t('login.loginError'),
-            type: 'negative',
-        });
     }
 }
 </script>

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

@@ -18,7 +18,7 @@ const noteFilter = computed(() => {
 
 const body = {
     vehicleFk: vehicleId.value,
-    workerFk: user.value.id,
+    userFk: user.value.id,
 };
 </script>
 

src/pages/Ticket/Card/TicketPackage.vue

@@ -24,10 +24,10 @@ const crudModelFilter = reactive({
     where: { ticketFk: route.params.id },
 });
 
-const crudModelRequiredData = computed(() => ({
+const crudModelDefaultData = computed(() => ({
+    created: Date.vnNew(),
     packagingFk: null,
     quantity: 0,
-    created: Date.vnNew(),
     ticketFk: route.params.id,
 }));
 
@@ -63,7 +63,7 @@ watch(
                 url="TicketPackagings"
                 model="TicketPackagings"
                 :filter="crudModelFilter"
-                :data-required="crudModelRequiredData"
+                :data-default="crudModelDefaultData"
                 :default-remove="false"
                 auto-load
             >

src/pages/Ticket/Card/TicketSale.vue

@@ -719,6 +719,7 @@ watch(
         :create-as-dialog="false"
         :crud-model="{
             disableInfiniteScroll: true,
+            insertOnLoad: false,
         }"
         :default-remove="false"
         :default-reset="false"

src/pages/Ticket/Negative/TicketLackList.vue

@@ -181,6 +181,7 @@ const setUserParams = (params) => {
         :create="false"
         :crud-model="{
             disableInfiniteScroll: true,
+            insertOnLoad: false,
         }"
         :table="{
             'row-key': 'itemFk',

src/pages/Travel/ExtraCommunity.vue

@@ -547,6 +547,7 @@ watch(route, () => {
                                     },
                                 ]"
                                 v-text="col.value"
+                                :data-cy="`extra-community-${col.name}`"
                             />
                             <TravelDescriptorProxy
                                 v-if="col.name === 'id'"

src/pages/Worker/Card/WorkerBalance.vue

@@ -99,6 +99,10 @@ const columns = computed(() => [
                 workerFk: entityId,
             },
         }"
+        :crud-model="{
+            insertOnLoad: false,
+        }"
+
         order="paymentDate DESC"
         :columns="columns"
         auto-load

src/pages/Worker/Card/WorkerFormation.vue

@@ -128,6 +128,9 @@ const columns = computed(() => [
                 workerFk: entityId,
             },
         }"
+        :crud-model="{
+            insertOnLoad: false,
+        }"
         order="id DESC"
         :columns="columns"
         auto-load

src/pages/Worker/Card/WorkerMedical.vue

@@ -109,6 +109,9 @@ const columns = [
                 workerFk: entityId,
             },
         }"
+        :crud-model="{
+            insertOnLoad: false,
+        }"
         order="date DESC"
         :columns="columns"
         auto-load

src/pages/Worker/Card/WorkerNotes.vue

@@ -1,28 +1,26 @@
 <script setup>
 import { useRoute } from 'vue-router';
-
+import { useState } from 'src/composables/useState';
 import VnNotes from 'src/components/ui/VnNotes.vue';
 
 const route = useRoute();
+const state = useState();
+const user = state.getUser();
 
 const userFilter = {
     order: 'created DESC',
-
-    include: {
-        relation: 'worker',
-        scope: {
-            fields: ['id', 'firstName', 'lastName'],
     include: {
         relation: 'user',
         scope: {
             fields: ['id', 'nickname', 'name'],
         },
     },
-        },
-    },
 };
 
-const body = { workerFk: route.params.id };
+const body = {
+    workerFk: route.params.id,
+    userFk: user.value.id,
+};
 </script>
 
 <template>

src/pages/Worker/Card/WorkerPda.vue

@@ -170,6 +170,9 @@ function isSigned(row) {
             'row-key': 'deviceProductionFk',
             selection: 'multiple',
         }"
+        :crud-model="{
+            insertOnLoad: false,
+        }"
         :table-filter="{ hiddenTags: ['userFk'] }"
     >
         <template #moreBeforeActions>

src/pages/Zone/Card/ZoneEventExclusionForm.vue

@@ -66,6 +66,8 @@ const excludeType = computed({
 const arrayData = useArrayData('ZoneEvents');
 
 const exclusionGeoCreate = async () => {
+    if (await zoneHasTickets(route.params.id, dated.value)) return;
+
     const params = {
         zoneFk: parseInt(route.params.id),
         date: dated.value,
@@ -87,6 +89,8 @@ const exclusionCreate = async () => {
     };
     const zoneIds = props.zoneIds?.length ? props.zoneIds : [route.params.id];
     for (const id of zoneIds) {
+        if (await zoneHasTickets(id, dated.value)) return;
+
         const url = `Zones/${id}/exclusions`;
         let today = moment(dated.value);
         let lastDay = today.clone().add(nMonths, 'months').endOf('month');
@@ -123,6 +127,26 @@ const exclusionCreate = async () => {
     await refetchEvents();
 };
 
+const zoneHasTickets = async (zoneId, date) => {
+    const filter = {
+        where: {
+            zoneFk: zoneId,
+            shipped: date,
+        },
+    };
+    const params = { filter: JSON.stringify(filter) };
+    const { data } = await axios.get('Tickets', { params });
+    if (data.length > 0) {
+        quasar.notify({
+            message: t('eventsExclusionForm.cantCloseZone'),
+            type: 'negative',
+        });
+        await refetchEvents();
+        return true;
+    }
+    return false;
+};
+
 const onSubmit = async () => {
     if (excludeType.value === 'all') exclusionCreate();
     else exclusionGeoCreate();

src/pages/Zone/locale/en.yml

@@ -80,6 +80,7 @@ eventsExclusionForm:
     all: All
     specificLocations: Specific locations
     rootTreeLabel: Locations where it is not distributed
+    cantCloseZone: Can not close this zone because there are tickets programmed for that day
 eventsInclusionForm:
     addEvent: Add event
     editEvent: Edit event

src/pages/Zone/locale/es.yml

@@ -81,6 +81,7 @@ eventsExclusionForm:
     all: Todo
     specificLocations: Localizaciones concretas
     rootTreeLabel: Localizaciones en las que no se reparte
+    cantCloseZone: No se puede cerrar la zona porque hay tickets programados para ese día
 eventsInclusionForm:
     addEvent: Añadir evento
     editEvent: Editar evento

test/cypress/docker/run.sh

@@ -24,13 +24,8 @@ export CI=true
 export TZ=Europe/Madrid
 
 # IMAGES
-docker build -t registry.verdnatura.es/salix-back:dev -f "$salix_dir/back/Dockerfile" "$salix_dir"
+docker-compose -f test/cypress/docker-compose.yml --project-directory . pull db
-cd "$salix_dir" && npx myt run -t
+docker-compose -f test/cypress/docker-compose.yml --project-directory . pull back
-docker exec vn-database sh -c "rm -rf /mysql-template"
-docker exec vn-database sh -c "cp -a /var/lib/mysql /mysql-template"
-docker commit vn-database registry.verdnatura.es/salix-db:dev
-docker rm -f vn-database
-cd "$current_dir"
 docker build -f ./docs/Dockerfile.dev -t lilium-dev .
 # END IMAGES
 

test/cypress/integration/account/accountDescriptorMenu.spec.js

@@ -1,4 +1,4 @@
-describe('Account descriptor', () => {
+describe('Account descriptor', { testIsolation: true }, () => {
     const descriptorOptions = '[data-cy="descriptor-more-opts-menu"] > .q-list';
     const url = '/#/account/1/summary';
 

test/cypress/integration/claim/claimDevelopment.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('ClaimDevelopment', () => {
+describe('ClaimDevelopment', { testIsolation: true }, () => {
     const claimId = 1;
     const firstLineReason = 'tbody > :nth-child(1) > :nth-child(2)';
     const thirdRow = 'tbody > :nth-child(3)';

test/cypress/integration/customer/clientFiscalData.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('Client fiscal data', () => {
+describe('Client fiscal data', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.viewport(1280, 720);
         cy.login('developer');

test/cypress/integration/customer/clientList.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('Client list', () => {
+describe('Client list', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.login('developer');
         cy.visit('/#/customer/list', {

test/cypress/integration/entry/entryPreAccount.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('Entry PreAccount Functionality', () => {
+describe('Entry PreAccount Functionality', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.login('administrative');
         cy.visit('/#/entry/pre-account');

test/cypress/integration/invoiceIn/invoiceInBasicData.spec.js

@@ -1,6 +1,6 @@
 /// <reference types="cypress" />
 import moment from 'moment';
-describe('InvoiceInBasicData', () => {
+describe('InvoiceInBasicData', { testIsolation: true }, () => {
     const dialogInputs = '.q-dialog input';
     const getDocumentBtns = (opt) => `[data-cy="dms-buttons"]  > :nth-child(${opt})`;
     const futureDate = moment().add(1, 'days').format('DD-MM-YYYY');

test/cypress/integration/invoiceIn/invoiceInCorrective.spec.js

@@ -1,4 +1,4 @@
-describe('invoiceInCorrective', () => {
+describe('invoiceInCorrective', { testIsolation: true }, () => {
     beforeEach(() => cy.login('administrative'));
 
     it('should modify the invoice', () => {

test/cypress/integration/invoiceIn/invoiceInDescriptor.spec.js

@@ -1,4 +1,4 @@
-describe('InvoiceInDescriptor', () => {
+describe('InvoiceInDescriptor', { testIsolation: true }, () => {
     beforeEach(() => cy.login('administrative'));
 
     describe('more options', () => {

test/cypress/integration/invoiceOut/invoiceOutList.spec.js

@@ -24,6 +24,7 @@ describe('InvoiceOut list', () => {
     });
 
     it.skip('should download all pdfs', () => {
+        cy.get(columnCheckbox).click();
         cy.get(columnCheckbox).click();
         cy.dataCy('InvoiceOutDownloadPdfBtn').click();
     });

test/cypress/integration/invoiceOut/invoiceOutSummary.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('InvoiceOut summary', () => {
+describe('InvoiceOut summary', { testIsolation: true }, () => {
     const transferInvoice = {
         Client: { val: 'employee', type: 'select' },
         Type: { val: 'Error in customer data', type: 'select' },

test/cypress/integration/item/itemBarcodes.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('ItemBarcodes', () => {
+describe('ItemBarcodes', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.login('developer');
         cy.visit(`/#/item/1/barcode`);

test/cypress/integration/item/itemSummary.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('Item summary', () => {
+describe('Item summary', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.login('developer');
         cy.visit(`/#/item/1/summary`);

test/cypress/integration/item/itemTag.spec.js

@@ -1,4 +1,4 @@
-describe('Item tag', () => {
+describe('Item tag', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.login('developer');
         cy.visit(`/#/item/1/tags`);

test/cypress/integration/login/login.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('Login', () => {
+describe('Login', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.visit('/#/login');
         cy.get('#switchLanguage').click();

test/cypress/integration/login/logout.spec.js

@@ -1,18 +1,17 @@
 /// <reference types="cypress" />
-describe('Logout', () => {
+describe('Logout', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.login('developer');
         cy.visit(`/#/dashboard`);
         cy.waitForElement('.q-page', 6000);
     });
-    describe('by user', () => {
+
     it('should logout', () => {
         cy.get('#user').click();
         cy.get('#logout').click();
     });
-    });
+
-    describe('not user', () => {
+    it('should throw session expired error if token has expired or is not valid during navigation', () => {
-        beforeEach(() => {
         cy.intercept('GET', '**StarredModules**', {
             statusCode: 401,
             body: {
@@ -25,13 +24,9 @@ describe('Logout', () => {
             },
             statusMessage: 'AUTHORIZATION_REQUIRED',
         }).as('badRequest');
-        });
-
-        it('when token not exists', () => {
         cy.get('.q-list').should('be.visible').first().should('be.visible').click();
         cy.wait('@badRequest');
 
-            cy.checkNotification('Authorization Required');
+        cy.checkNotification('Your session has expired. Please log in again');
-        });
     });
 });

test/cypress/integration/monitor/monitorTicket.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('Monitor Tickets Table', () => {
+describe('Monitor Tickets Table', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.viewport(1920, 1080);
         cy.login('salesPerson');

test/cypress/integration/order/orderCatalog.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe.skip('OrderCatalog', () => {
+describe('OrderCatalog', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.login('developer');
         cy.viewport(1920, 1080);

test/cypress/integration/order/orderList.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('OrderList', () => {
+describe('OrderList', { testIsolation: true }, () => {
     const clientCreateSelect = '#formModel [data-cy="Client_select"]';
     const addressCreateSelect = '#formModel [data-cy="Address_select"]';
     const agencyCreateSelect = '#formModel [data-cy="Agency_select"]';

test/cypress/integration/route/cmr/cmrList.spec.js

@@ -1,4 +1,4 @@
-describe('Cmr list', () => {
+describe('Cmr list', { testIsolation: true }, () => {
     const getLinkSelector = (colField) =>
         `tr:first-child > [data-col-field="${colField}"] > .no-padding > .link`;
 

test/cypress/integration/route/roadMap/roadmapList.spec.js

@@ -1,4 +1,4 @@
-describe('RoadMap', () => {
+describe.skip('RoadMap', () => {
     const getSelector = (colField) =>
         `tr:last-child > [data-col-field="${colField}"] > .no-padding`;
 

test/cypress/integration/route/routeAutonomous.spec.js

@@ -1,4 +1,4 @@
-describe('RouteAutonomous', () => {
+describe('RouteAutonomous', { testIsolation: true }, () => {
     const getLinkSelector = (colField, link = true) =>
         `tr:first-child > [data-col-field="${colField}"] > .no-padding${
             link ? ' > .link' : ''

test/cypress/integration/route/routeList.spec.js

@@ -1,4 +1,4 @@
-describe('Route', () => {
+describe('Route', { testIsolation: true }, () => {
     const getSelector = (colField) =>
         `tr:last-child > [data-col-field="${colField}"] > .no-padding > .link`;
 

test/cypress/integration/route/vehicle/vehicleDms.spec.js

@@ -1,4 +1,4 @@
-describe('Vehicle DMS', () => {
+describe('Vehicle DMS', { testIsolation: true }, () => {
     const getSelector = (btnPosition) =>
         `tr:last-child > .text-right > .no-wrap > :nth-child(${btnPosition}) > .q-btn > .q-btn__content > .q-icon`;
 

test/cypress/integration/ticket/ticketSale.spec.js

@@ -1,7 +1,7 @@
 /// <reference types="cypress" />
 const firstRow = 'tbody > :nth-child(1)';
 
-describe('TicketSale', () => {
+describe('TicketSale', { testIsolation: true }, () => {
     describe('Ticket  #23', () => {
         beforeEach(() => {
             cy.login('claimManager');

test/cypress/integration/travel/ExtraCommunity.spec.js

@@ -0,0 +1,16 @@
+describe('Travel Extracommunity', () => {
+    it('Should show travels', () => {
+        cy.login('logistic');
+        cy.visit(`/#/travel/extra-community`);
+        cy.get('.q-page').should('be.visible');
+    });
+
+    it('Should show travels when user is supplier', () => {
+        cy.login('petterparker');
+        cy.visit(`/#/travel/extra-community`);
+        cy.get('[data-cy="vnFilterPanelChip_continent"] > .q-chip__icon--remove').click();
+        cy.dataCy('extra-community-cargoSupplierNickname').each(($el) => {
+            cy.wrap($el).should('contain.text', 'The farmer');
+        });
+    });
+});

test/cypress/integration/vnComponent/UserPanel.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('UserPanel', () => {
+describe('UserPanel', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.viewport(1280, 720);
         cy.login('developer');

test/cypress/integration/vnComponent/VnBreadcrumbs.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('VnBreadcrumbs', () => {
+describe('VnBreadcrumbs', { testIsolation: true }, () => {
     const lastBreadcrumb = '.q-breadcrumbs--last > .q-breadcrumbs__el';
     beforeEach(() => {
         cy.login('developer');

test/cypress/integration/vnComponent/VnLocation.spec.js

@@ -1,6 +1,6 @@
 const { randomNumber, randomString } = require('../../support');
 
-describe('VnLocation', () => {
+describe('VnLocation', { testIsolation: true }, () => {
     const locationOptions = '[role="listbox"] > div.q-virtual-scroll__content > .q-item';
     const dialogInputs = '.q-dialog label input';
     const createLocationButton = '.q-form > .q-card > .vn-row:nth-child(6) .--add-icon';

test/cypress/integration/vnComponent/VnLog.spec.js

@@ -1,5 +1,5 @@
 /// <reference types="cypress" />
-describe('VnLog', () => {
+describe('VnLog', { testIsolation: true }, () => {
     beforeEach(() => {
         cy.login('developer');
         cy.visit(`/#/claim/${1}/log`);

test/cypress/integration/worker/workerCreate.spec.js

@@ -1,4 +1,4 @@
-describe('WorkerCreate', () => {
+describe('WorkerCreate', { testIsolation: true }, () => {
     const externalRadio = '.q-radio:nth-child(2)';
     const developerBossId = 120;
     const payMethodCross =

test/cypress/integration/worker/workerManagement.spec.js

@@ -1,4 +1,4 @@
-describe('WorkerManagement', () => {
+describe('WorkerManagement', { testIsolation: true }, () => {
     const nif = '12091201A';
     const searchButton = '.q-scrollarea__content > .q-btn--standard > .q-btn__content';
     const url = '/#/worker/management';

test/cypress/integration/worker/workerNotificationsManager.spec.js

@@ -1,4 +1,4 @@
-describe('WorkerNotificationsManager', () => {
+describe('WorkerNotificationsManager', { testIsolation: true }, () => {
     const salesPersonId = 18;
     const developerId = 9;
 

test/cypress/integration/zone/zoneBasicData.spec.js

@@ -1,4 +1,4 @@
-describe('ZoneBasicData', () => {
+describe('ZoneBasicData', { testIsolation: true }, () => {
     const priceBasicData = '[data-cy="ZoneBasicDataPrice"]';
     const saveBtn = '.q-btn-group > .q-btn--standard';
 

test/cypress/integration/zone/zoneCalendar.spec.js

@@ -1,4 +1,4 @@
-describe('ZoneCalendar', () => {
+describe('ZoneCalendar', { testIsolation: true }, () => {
     const addEventBtn = '.q-page-sticky > div > .q-btn';
     const submitBtn = '.q-mt-lg > .q-btn--standard';
     const deleteBtn = 'ZoneEventsPanelDeleteBtn';
@@ -47,4 +47,20 @@ describe('ZoneCalendar', () => {
         cy.dataCy('ZoneEventExclusionDeleteBtn').click();
         cy.dataCy('VnConfirm_confirm').click();
     });
+
+    it(
+        'should not exclude an event if there are tickets for that zone and day',
+        { testIsoaltion: true },
+        () => {
+            cy.visit(`/#/zone/3/events`);
+            cy.get('.q-mb-sm > .q-radio__inner').click();
+            cy.get(
+                '.q-current-day > .q-calendar-month__day--content > [data-cy="ZoneCalendarDay"]',
+            ).click();
+            cy.get('.q-mt-lg > .q-btn--standard').click();
+            cy.checkNotification(
+                'Can not close this zone because there are tickets programmed for that day',
+            );
+        },
+    );
 });

test/cypress/integration/zone/zoneCreate.spec.js

@@ -1,4 +1,4 @@
-describe('ZoneCreate', () => {
+describe('ZoneCreate', { testIsolation: true }, () => {
     const data = {
         Name: { val: 'Zone pickup D' },
         Price: { val: '3' },

test/cypress/integration/zone/zoneDeliveryDays.spec.js

@@ -26,27 +26,8 @@ describe('ZoneDeliveryDays', () => {
             });
         }).as('events');
 
-        cy.dataCy('ZoneDeliveryDaysPostcodeSelect').type(postcode);
+        cy.selectOption('[data-cy="ZoneDeliveryDaysPostcodeSelect"]', postcode);
-        cy.get('.q-menu .q-item').contains(postcode).click();
+        cy.selectOption('[data-cy="ZoneDeliveryDaysAgencySelect"]', agency);
-        cy.get('.q-menu').then(($menu) => {
-            if ($menu.is(':visible')) {
-                cy.get('[data-cy="ZoneDeliveryDaysPostcodeSelect"]')
-                    .as('focusedElement')
-                    .focus();
-                cy.get('@focusedElement').blur();
-            }
-        });
-
-        cy.dataCy('ZoneDeliveryDaysAgencySelect').type(agency);
-        cy.get('.q-menu .q-item').contains(agency).click();
-        cy.get('.q-menu').then(($menu) => {
-            if ($menu.is(':visible')) {
-                cy.get('[data-cy="ZoneDeliveryDaysAgencySelect"]')
-                    .as('focusedElement')
-                    .focus();
-                cy.get('@focusedElement').blur();
-            }
-        });
 
         cy.get(submitForm).click();
         cy.wait('@events').then((interception) => {