Merge branch 'test' of https://gitea.verdnatura.es/verdnatura/salix-front into dev

Reviewed-on: verdnatura/salix-front#850
Reviewed-by: Jorge Penadés <jorgep@verdnatura.es>

.eslintrc.cjs

@@ -25,7 +25,7 @@ module.exports = {
         // 'plugin:vue/vue3-essential', // Priority A: Essential (Error Prevention)
         'plugin:vue/vue3-strongly-recommended', // Priority B: Strongly Recommended (Improving Readability)
         // 'plugin:vue/vue3-recommended', // Priority C: Recommended (Minimizing Arbitrary Choices and Cognitive Overhead)
-        'plugin:cypress/recommended',
+
         // https://github.com/prettier/eslint-config-prettier#installation
         // usage with Prettier, provided by 'eslint-config-prettier'.
         'prettier',
@@ -58,7 +58,7 @@ module.exports = {
     rules: {
         'prefer-promise-reject-errors': 'off',
         'no-unused-vars': 'warn',
-        'vue/no-multiple-template-root': 'off',
+        "vue/no-multiple-template-root": "off" ,
         // allow debugger during development only
         'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
     },

.vscode/launch.json

@@ -1,15 +0,0 @@
-{
-    // Use IntelliSense to learn about possible attributes.
-    // Hover to view descriptions of existing attributes.
-    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
-    "version": "0.2.0",
-    "configurations": [
-        {
-            "type": "msedge",
-            "request": "launch",
-            "name": "Launch Chrome against localhost",
-            "url": "http://localhost:5000",
-            "webRoot": "${workspaceFolder}"
-        }
-    ]
-}

cypress.config.js

@@ -1,12 +1,6 @@
 const { defineConfig } = require('cypress');
-const {
-    injectQuasarDevServerConfig,
-} = require('@quasar/quasar-app-extension-testing-e2e-cypress/cct-dev-server');
 
 module.exports = defineConfig({
-    env: {
-        baseUrl: 'http://localhost:9000/',
-    },
     e2e: {
         baseUrl: 'http://localhost:9000/',
         experimentalStudio: true,
@@ -24,29 +18,6 @@ module.exports = defineConfig({
         },
         setupNodeEvents(on, config) {
             // implement node event listeners here
-            on('after:spec', (results) => {
-                // `results` is the tests results
-                console.error('results: ', results);
-                cy.exec('cd ../salix && gulp docker');
-            });
-        },
-    },
-
-    component: {
-        indexHtmlFile: 'test/cypress/support/component-index.html',
-        supportFile: 'test/cypress/support/component.js',
-        specPattern: 'test/cypress/components/**/*.spec.js',
-        devServer: {
-            framework: 'quasar',
-            bundler: 'vite',
-        },
-        setupNodeEvents(on, config) {
-            // implement node event listeners here
-            on('after:spec', (results) => {
-                // `results` is the tests results
-                console.error('results: ', results);
-                cy.exec('cd ../salix && gulp docker');
-            });
         },
     },
 });

generate-tests.js

@@ -1,45 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-// Ruta de la carpeta de componentes
-
-// Ruta de la carpeta de pruebas
-// ['common', 'ui'].forEach((folder) => {
-generateTest('folder');
-// });
-function generateTest(type) {
-    const componentsDir = path.join(__dirname, `src/components`);
-    const testDir = path.join(__dirname, `test/cypress/components`);
-    // Leer todos los archivos en la carpeta de componentes
-    fs.readdir(componentsDir, (err, files) => {
-        if (err) return console.error('Error leyendo la carpeta de componentes:', err);
-
-        // Filtrar solo archivos .vue
-        const vueFiles = files.filter((file) => file.endsWith('.vue'));
-
-        vueFiles.forEach((file) => {
-            const componentName = path.basename(file, '.vue');
-            const testFileName = `${componentName}.spec.js`;
-            const testFilePath = path.join(testDir, testFileName);
-
-            // Contenido del archivo de prueba
-            const testFileContent = `
-import ${componentName} from 'src/components/${file}';
-
-describe.skip('<${componentName} />', () => {
-    it('TODO: boilerplate', () => {
-        // see: https://on.cypress.io/mounting-vue
-        cy.createWrapper(${componentName});
-    });
-});
-`;
-
-            // Escribir el archivo de prueba
-            fs.writeFile(testFilePath, testFileContent, (err) => {
-                if (err)
-                    return console.error('Error escribiendo el archivo de prueba:', err);
-
-                console.log(`Archivo de prueba generado: ${testFileName}`);
-            });
-        });
-    });
-}

package.json

@@ -10,19 +10,15 @@
         "lint": "eslint --ext .js,.vue ./",
         "format": "prettier --write \"**/*.{js,vue,scss,html,md,json}\" --ignore-path .gitignore",
         "test:e2e": "cypress open",
-        "test:e2e:unit": "cypress run  --component",
-        "test:e2e:unit:ci": "cypress run -p 9000 --component",
         "test:e2e:ci": "cd ../salix && gulp docker && cd ../salix-front && cypress run",
         "test": "echo \"See package.json => scripts for available tests.\" && exit 0",
         "test:unit": "vitest",
         "test:unit:ci": "vitest run",
-        "cypr": "cross-env CYPRESS_REMOTE_DEBUGGING_PORT=9222 cypress open",
         "commitlint": "commitlint --edit",
         "prepare": "npx husky install",
         "addReferenceTag": "node .husky/addReferenceTag.js"
     },
     "dependencies": {
-        "@modyfi/vite-plugin-yaml": "1.0.4",
         "@quasar/cli": "^2.3.0",
         "@quasar/extras": "^1.16.9",
         "axios": "^1.4.0",
@@ -42,9 +38,7 @@
         "@pinia/testing": "^0.1.2",
         "@quasar/app-vite": "^1.7.3",
         "@quasar/quasar-app-extension-qcalendar": "4.0.0-beta.15",
-        "@quasar/quasar-app-extension-testing-e2e-cypress": "^6.1.0",
         "@quasar/quasar-app-extension-testing-unit-vitest": "^0.4.0",
-        "@vitest/ui": "^1.6.0",
         "@vue/test-utils": "^2.4.4",
         "autoprefixer": "^10.4.14",
         "cypress": "^13.6.6",

quasar.config.js

@@ -87,7 +87,6 @@ module.exports = configure(function (/* ctx */) {
             alias: {
                 composables: path.join(__dirname, './src/composables'),
                 filters: path.join(__dirname, './src/filters'),
-                components: path.join(__dirname, './src/components'),
             },
 
             vitePlugins: [

src/boot/axios.js

@@ -2,9 +2,11 @@ import axios from 'axios';
 import { useSession } from 'src/composables/useSession';
 import { Router } from 'src/router';
 import useNotify from 'src/composables/useNotify.js';
+import { useStateQueryStore } from 'src/stores/useStateQueryStore';
 
 const session = useSession();
 const { notify } = useNotify();
+const stateQuery = useStateQueryStore();
 const baseUrl = '/api/';
 
 axios.defaults.baseURL = baseUrl;
@@ -15,7 +17,7 @@ const onRequest = (config) => {
     if (token.length && !config.headers.Authorization) {
         config.headers.Authorization = token;
     }
-
+    stateQuery.add(config);
     return config;
 };
 
@@ -24,10 +26,10 @@ const onRequestError = (error) => {
 };
 
 const onResponse = (response) => {
-    const { method } = response.config;
+    const config = response.config;
+    stateQuery.remove(config);
 
-    const isSaveRequest = method === 'patch';
-    if (isSaveRequest) {
+    if (config.method === 'patch') {
         notify('globals.dataSaved', 'positive');
     }
 
@@ -35,37 +37,9 @@ const onResponse = (response) => {
 };
 
 const onResponseError = (error) => {
-    let message = '';
+    stateQuery.remove(error.config);
 
-    const response = error.response;
-    const responseData = response && response.data;
-    const responseError = responseData && response.data.error;
-    if (responseError) {
-        message = responseError.message;
-    }
-
-    switch (response?.status) {
-        case 422:
-            if (error.name == 'ValidationError')
-                message +=
-                    ' "' +
-                    responseError.details.context +
-                    '.' +
-                    Object.keys(responseError.details.codes).join(',') +
-                    '"';
-            break;
-        case 500:
-            message = 'errors.statusInternalServerError';
-            break;
-        case 502:
-            message = 'errors.statusBadGateway';
-            break;
-        case 504:
-            message = 'errors.statusGatewayTimeout';
-            break;
-    }
-
-    if (session.isLoggedIn() && response?.status === 401) {
+    if (session.isLoggedIn() && error.response?.status === 401) {
         session.destroy(false);
         const hash = window.location.hash;
         const url = hash.slice(1);
@@ -74,8 +48,6 @@ const onResponseError = (error) => {
         return Promise.reject(error);
     }
 
-    notify(message, 'negative');
-
     return Promise.reject(error);
 };
 

src/boot/quasar.js

@@ -3,14 +3,51 @@ import qFormMixin from './qformMixin';
 import mainShortcutMixin from './mainShortcutMixin';
 import keyShortcut from './keyShortcut';
 import useNotify from 'src/composables/useNotify.js';
+import { CanceledError } from 'axios';
+
 const { notify } = useNotify();
 
 export default boot(({ app }) => {
     app.mixin(qFormMixin);
     app.mixin(mainShortcutMixin);
     app.directive('shortcut', keyShortcut);
-    app.config.errorHandler = function (err) {
-        console.error(err);
-        notify('globals.error', 'negative', 'error');
+    app.config.errorHandler = (error) => {
+        let message;
+        const response = error.response;
+        const responseData = response?.data;
+        const responseError = responseData && response.data.error;
+        if (responseError) {
+            message = responseError.message;
+        }
+
+        switch (response?.status) {
+            case 422:
+                if (error.name == 'ValidationError')
+                    message +=
+                        ' "' +
+                        responseError.details.context +
+                        '.' +
+                        Object.keys(responseError.details.codes).join(',') +
+                        '"';
+                break;
+            case 500:
+                message = 'errors.statusInternalServerError';
+                break;
+            case 502:
+                message = 'errors.statusBadGateway';
+                break;
+            case 504:
+                message = 'errors.statusGatewayTimeout';
+                break;
+        }
+
+        console.error(error);
+        if (error instanceof CanceledError) {
+            const env = process.env.NODE_ENV;
+            if (env && env !== 'development') return;
+            message = 'Duplicate request';
+        }
+
+        notify(message ?? 'globals.error', 'negative', 'error');
     };
 });

src/components/CreateBankEntityForm.vue

@@ -2,9 +2,10 @@
 import { reactive, ref, onMounted, nextTick, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import VnInput from 'src/components/common/VnInput.vue';
+
 import VnSelect from 'src/components/common/VnSelect.vue';
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import FormModelPopup from './FormModelPopup.vue';
 import { useState } from 'src/composables/useState';
 
@@ -36,7 +37,7 @@ const onDataSaved = (...args) => {
 
 onMounted(async () => {
     await nextTick();
-    bicInputRef?.value?.focus();
+    bicInputRef.value.focus();
 });
 </script>
 
@@ -97,7 +98,7 @@ onMounted(async () => {
     </FormModelPopup>
 </template>
 
-<i18n lang="yml">
+<i18n>
 en:
     title: New bank entity
     subtitle: Please, ensure you put the correct data!

src/components/CreateManualInvoiceForm.vue

@@ -3,8 +3,8 @@ import { reactive, ref, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import FormModelPopup from './FormModelPopup.vue';
@@ -141,7 +141,7 @@ const onDataSaved = async (formData, requestResponse) => {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 es:
     Create manual invoice: Crear factura manual
     Ticket: Ticket

src/components/CreateNewCityForm.vue

@@ -2,10 +2,9 @@
 import { onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
-import VnSelectProvince from 'src/components/VnSelectProvince.vue';
-import VnInput from 'src/components/common/VnInput.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import VnSelectProvince from 'components/VnSelectProvince.vue';
+import VnInput from 'components/common/VnInput.vue';
 import FormModelPopup from './FormModelPopup.vue';
 
 const emit = defineEmits(['onDataSaved']);
@@ -64,7 +63,7 @@ const onDataSaved = (...args) => {
     </FormModelPopup>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     New city: Nueva ciudad
     Please, ensure you put the correct data!: ¡Por favor, asegúrese de poner los datos correctos!

src/components/CreateNewExpenseForm.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
-import VnRow from 'src/components/ui/VnRow.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import FormModelPopup from './FormModelPopup.vue';
 
@@ -43,7 +43,7 @@ const { t } = useI18n();
     </FormModelPopup>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     New expense: Nuevo gasto
     It's a withholding: Es una retención

src/components/CreateNewPostcodeForm.vue

@@ -79,14 +79,20 @@ async function onProvinceCreated(data) {
 watch(
     () => [postcodeFormData.countryFk],
     async (newCountryFk, oldValueFk) => {
-        if (!!oldValueFk[0] && newCountryFk[0] !== oldValueFk[0]) {
+        if (Array.isArray(newCountryFk)) {
+            newCountryFk = newCountryFk[0];
+        }
+        if (Array.isArray(oldValueFk)) {
+            oldValueFk = oldValueFk[0];
+        }
+        if (!!oldValueFk && newCountryFk !== oldValueFk) {
             postcodeFormData.provinceFk = null;
             postcodeFormData.townFk = null;
         }
-        if ((newCountryFk, newCountryFk !== postcodeFormData.countryFk)) {
+        if (oldValueFk !== newCountryFk) {
             await provincesFetchDataRef.value.fetch({
                 where: {
-                    countryFk: newCountryFk[0],
+                    countryFk: newCountryFk,
                 },
             });
             await townsFetchDataRef.value.fetch({
@@ -103,9 +109,12 @@ watch(
 watch(
     () => postcodeFormData.provinceFk,
     async (newProvinceFk) => {
-        if (newProvinceFk[0] && newProvinceFk[0] !== postcodeFormData.provinceFk) {
+        if (Array.isArray(newProvinceFk)) {
+            newProvinceFk = newProvinceFk[0];
+        }
+        if (newProvinceFk !== postcodeFormData.provinceFk) {
             await townsFetchDataRef.value.fetch({
-                where: { provinceFk: newProvinceFk[0] },
+                where: { provinceFk: newProvinceFk },
             });
         }
     }
@@ -125,16 +134,26 @@ async function handleCountries(data) {
     <FetchData
         ref="provincesFetchDataRef"
         @on-fetch="handleProvinces"
+        :sort-by="['name ASC']"
+        :limit="30"
         auto-load
         url="Provinces/location"
     />
     <FetchData
         ref="townsFetchDataRef"
+        :sort-by="['name ASC']"
+        :limit="30"
         @on-fetch="handleTowns"
         auto-load
         url="Towns/location"
     />
-    <FetchData @on-fetch="handleCountries" auto-load url="Countries" />
+    <FetchData
+        @on-fetch="handleCountries"
+        :sort-by="['name ASC']"
+        :limit="30"
+        auto-load
+        url="Countries"
+    />
     <FormModelPopup
         url-create="postcodes"
         model="postcode"

src/components/CreateNewProvinceForm.vue

@@ -2,8 +2,8 @@
 import { reactive, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import FormModelPopup from './FormModelPopup.vue';
@@ -46,6 +46,8 @@ const onDataSaved = (dataSaved, requestResponse) => {
             },
         }"
         url="Autonomies/location"
+        :sort-by="['name ASC']"
+        :limit="30"
     />
     <FormModelPopup
         :title="t('New province')"
@@ -85,7 +87,7 @@ const onDataSaved = (dataSaved, requestResponse) => {
     </FormModelPopup>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     New province: Nueva provincia
     Please, ensure you put the correct data!: ¡Por favor, asegúrese de poner los datos correctos!

src/components/CreateThermographForm.vue

@@ -2,8 +2,8 @@
 import { reactive, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import FormModelPopup from './FormModelPopup.vue';
@@ -95,7 +95,7 @@ const onDataSaved = (dataSaved) => {
     </FormModelPopup>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Identifier: Identificador
     Model: Modelo

src/components/CrudModel.vue

@@ -5,10 +5,10 @@ import { useRouter, onBeforeRouteLeave } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
 import { useValidator } from 'src/composables/useValidator';
-import { useStateStore } from 'src/stores/useStateStore';
-import VnPaginate from 'src/components/ui/VnPaginate.vue';
-import VnConfirm from 'src/components/ui/VnConfirm.vue';
-import SkeletonTable from 'src/components/ui/SkeletonTable.vue';
+import { useStateStore } from 'stores/useStateStore';
+import VnPaginate from 'components/ui/VnPaginate.vue';
+import VnConfirm from 'components/ui/VnConfirm.vue';
+import SkeletonTable from 'components/ui/SkeletonTable.vue';
 import { tMobile } from 'src/composables/tMobile';
 
 const { push } = useRouter();

src/components/EditPictureForm.vue

@@ -3,8 +3,8 @@ import { reactive, computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import VnSelect from 'src/components/common/VnSelect.vue';
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 
 import Croppie from 'croppie/croppie';
@@ -336,7 +336,7 @@ const makeRequest = async () => {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 es:
     Edit photo: Editar foto
     Select from computer: Seleccionar desde ordenador

src/components/EditTableCellValueForm.vue

@@ -5,7 +5,7 @@ import { useI18n } from 'vue-i18n';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnInputDate from 'src/components/common/VnInputDate.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import { QCheckbox } from 'quasar';
 
 import axios from 'axios';
@@ -142,7 +142,7 @@ const closeForm = () => {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 es:
     Edit: Editar
     buy(s): compra(s)

src/components/FilterItemForm.vue

@@ -2,10 +2,10 @@
 import { ref, reactive, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import VnRow from 'src/components/ui/VnRow.vue';
-import FetchData from 'src/components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
 import VnInput from 'src/components/common/VnInput.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
+import VnSelect from 'components/common/VnSelect.vue';
 import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 
 import axios from 'axios';
@@ -208,7 +208,7 @@ const selectItem = ({ id }) => {
     </QForm>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Filter item: Filtrar artículo
     Enter a new search: Introduce una nueva búsqueda

src/components/FilterTravelForm.vue

@@ -2,10 +2,10 @@
 import { ref, reactive, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import VnRow from 'src/components/ui/VnRow.vue';
-import FetchData from 'src/components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
 import VnInputDate from 'src/components/common/VnInputDate.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
+import VnSelect from 'components/common/VnSelect.vue';
 import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue';
 
 import axios from 'axios';
@@ -207,7 +207,7 @@ const selectTravel = ({ id }) => {
     </QForm>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Filter travels: Filtro envíos
     Enter a new search: Introduce una nueva búsqueda

src/components/FormModel.vue

@@ -5,10 +5,10 @@ import { onBeforeRouteLeave, useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
 import { useState } from 'src/composables/useState';
-import { useStateStore } from 'src/stores/useStateStore';
+import { useStateStore } from 'stores/useStateStore';
 import { useValidator } from 'src/composables/useValidator';
 import useNotify from 'src/composables/useNotify.js';
-import SkeletonForm from 'src/components/ui/SkeletonForm.vue';
+import SkeletonForm from 'components/ui/SkeletonForm.vue';
 import VnConfirm from './ui/VnConfirm.vue';
 import { tMobile } from 'src/composables/tMobile';
 import { useArrayData } from 'src/composables/useArrayData';
@@ -217,9 +217,6 @@ async function save() {
         updateAndEmit('onDataSaved', formData.value, response?.data);
         if ($props.reload) await arrayData.fetch({});
         hasChanges.value = false;
-    } catch (err) {
-        console.error(err);
-        notify('errors.writeRequest', 'negative');
     } finally {
         isLoading.value = false;
     }
@@ -302,7 +299,7 @@ defineExpose({
     <Teleport
         to="#st-actions"
         v-if="
-            $props?.defaultActions &&
+            $props.defaultActions &&
             stateStore?.isSubToolbarShown() &&
             componentIsRendered
         "
@@ -363,7 +360,7 @@ defineExpose({
 
     <QInnerLoading
         :showing="isLoading"
-        :label="$t('globals.pleaseWait')"
+        :label="t('globals.pleaseWait')"
         color="primary"
         style="min-width: 100%"
     />

src/components/FormModelPopup.vue

@@ -2,7 +2,7 @@
 import { ref, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import FormModel from 'src/components/FormModel.vue';
+import FormModel from 'components/FormModel.vue';
 
 const emit = defineEmits(['onDataSaved', 'onDataCanceled']);
 
@@ -61,6 +61,7 @@ defineExpose({
                     :loading="isLoading"
                     @click="emit('onDataCanceled')"
                     v-close-popup
+                    data-cy="FormModelPopup_cancel"
                 />
                 <QBtn
                     :label="t('globals.save')"
@@ -70,6 +71,7 @@ defineExpose({
                     class="q-ml-sm"
                     :disabled="isLoading"
                     :loading="isLoading"
+                    data-cy="FormModelPopup_save"
                 />
             </div>
         </template>

src/components/ItemsFilterPanel.vue

@@ -2,11 +2,11 @@
 import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import VnInput from 'src/components/common/VnInput.vue';
-import FetchData from 'src/components/FetchData.vue';
+import VnInput from 'components/common/VnInput.vue';
+import FetchData from 'components/FetchData.vue';
 import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
-import VnFilterPanelChip from 'src/components/ui/VnFilterPanelChip.vue';
+import VnSelect from 'components/common/VnSelect.vue';
+import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue';
 
 import axios from 'axios';
 
@@ -336,7 +336,7 @@ const removeTag = (index, params, search) => {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 en:
     params:
         supplier: Supplier

src/components/NavBar.vue

@@ -2,16 +2,18 @@
 import { onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useState } from 'src/composables/useState';
-import { useStateStore } from 'src/stores/useStateStore';
+import { useStateStore } from 'stores/useStateStore';
+import { useStateQueryStore } from 'src/stores/useStateQueryStore';
 import { useQuasar } from 'quasar';
 import PinnedModules from './PinnedModules.vue';
-import UserPanel from 'src/components/UserPanel.vue';
+import UserPanel from 'components/UserPanel.vue';
 import VnBreadcrumbs from './common/VnBreadcrumbs.vue';
 import VnAvatar from './ui/VnAvatar.vue';
 
 const { t } = useI18n();
 const stateStore = useStateStore();
 const quasar = useQuasar();
+const stateQuery = useStateQueryStore();
 const state = useState();
 const user = state.getUser();
 const appName = 'Lilium';
@@ -50,6 +52,14 @@ const pinnedModulesRef = ref();
                 </QBtn>
             </RouterLink>
             <VnBreadcrumbs v-if="$q.screen.gt.sm" />
+            <QSpinner
+                color="primary"
+                class="q-ml-md"
+                :class="{
+                    'no-visible': !stateQuery.isLoading().value,
+                }"
+                size="xs"
+            />
             <QSpace />
             <div id="searchbar" class="searchbar"></div>
             <QSpace />
@@ -98,8 +108,6 @@ const pinnedModulesRef = ref();
 </template>
 
 <style lang="scss" scoped>
-@import '/src/css/quasar.variables.scss';
-
 .searchbar {
     width: max-content;
 }
@@ -107,7 +115,7 @@ const pinnedModulesRef = ref();
     background-color: var(--vn-section-color);
 }
 </style>
-<i18n lang="yml">
+<i18n>
 en:
     Go to Salix: Go to Salix
 es:

src/components/PinnedModules.vue

@@ -78,7 +78,7 @@ async function redirect() {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 en:
     Home: Home
 es:

src/components/RefundInvoiceForm.vue

@@ -3,9 +3,9 @@ import { ref, reactive } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 import { useDialogPluginComponent } from 'quasar';
-import VnRow from 'src/components/ui/VnRow.vue';
-import FetchData from 'src/components/FetchData.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnSelect from 'components/common/VnSelect.vue';
 import FormPopup from './FormPopup.vue';
 import axios from 'axios';
 import useNotify from 'src/composables/useNotify.js';
@@ -150,7 +150,7 @@ const refund = async () => {
     </QDialog>
 </template>
 
-<i18n lang="yml">
+<i18n>
 en:
     Refund invoice: Refund invoice
     Rectificative type: Rectificative type

src/components/RegularizeStockForm.vue

@@ -3,8 +3,8 @@ import { reactive, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import VnSelect from 'src/components/common/VnSelect.vue';
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import FormModelPopup from './FormModelPopup.vue';
 
 const emit = defineEmits(['onDataSaved']);
@@ -73,7 +73,7 @@ const onDataSaved = (data) => {
     </FormModelPopup>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Warehouse: Almacén
     Type the visible quantity: Introduce la cantidad visible

src/components/TransferInvoiceForm.vue

@@ -3,10 +3,10 @@ import { ref, reactive } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 import { useQuasar, useDialogPluginComponent } from 'quasar';
-import VnConfirm from 'src/components/ui/VnConfirm.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
-import FetchData from 'src/components/FetchData.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
+import VnConfirm from 'components/ui/VnConfirm.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnSelect from 'components/common/VnSelect.vue';
 import FormPopup from './FormPopup.vue';
 import axios from 'axios';
 import useNotify from 'src/composables/useNotify.js';
@@ -205,7 +205,7 @@ const makeInvoice = async () => {
     </QDialog>
 </template>
 
-<i18n lang="yml">
+<i18n>
 en:
     checkInfo: New tickets from the destination customer will be generated in the consignee by default.
     transferInvoiceInfo: Destination customer is marked to bill in the consignee

src/components/UserPanel.vue

@@ -8,8 +8,8 @@ import { useState } from 'src/composables/useState';
 import { useSession } from 'src/composables/useSession';
 import { localeEquivalence } from 'src/i18n/index';
 import VnSelect from 'src/components/common/VnSelect.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
-import FetchData from 'src/components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
 import { useClipboard } from 'src/composables/useClipboard';
 import { useRole } from 'src/composables/useRole';
 import VnAvatar from './ui/VnAvatar.vue';

src/components/VnSelectProvince.vue

@@ -3,8 +3,8 @@ import { ref } from 'vue';
 import { useValidator } from 'src/composables/useValidator';
 import { useI18n } from 'vue-i18n';
 
-import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
-import FetchData from 'src/components/FetchData.vue';
+import VnSelectDialog from 'components/common/VnSelectDialog.vue';
+import FetchData from 'components/FetchData.vue';
 import CreateNewProvinceForm from './CreateNewProvinceForm.vue';
 
 const emit = defineEmits(['onProvinceCreated']);
@@ -78,8 +78,8 @@ async function handleProvinces(data) {
         </template>
     </VnSelectDialog>
 </template>
-<i18n lang="yml">
-es:
-    Province: Provincia
+<i18n>
+    es:
+        Province: Provincia
         Create province: Crear provincia
 </i18n>

src/components/VnTable/VnColumn.vue

@@ -4,14 +4,14 @@ import { QIcon, QCheckbox } from 'quasar';
 import { dashIfEmpty } from 'src/filters';
 
 /* basic input */
-import VnSelect from 'src/components/common/VnSelect.vue';
-import VnSelectCache from 'src/components/common/VnSelectCache.vue';
-import VnInput from 'src/components/common/VnInput.vue';
-import VnInputNumber from 'src/components/common/VnInputNumber.vue';
-import VnInputDate from 'src/components/common/VnInputDate.vue';
-import VnInputTime from 'src/components/common/VnInputTime.vue';
-import VnComponent from 'src/components/common/VnComponent.vue';
-import VnUserLink from 'src/components/ui/VnUserLink.vue';
+import VnSelect from 'components/common/VnSelect.vue';
+import VnSelectCache from 'components/common/VnSelectCache.vue';
+import VnInput from 'components/common/VnInput.vue';
+import VnInputNumber from 'components/common/VnInputNumber.vue';
+import VnInputDate from 'components/common/VnInputDate.vue';
+import VnInputTime from 'components/common/VnInputTime.vue';
+import VnComponent from 'components/common/VnComponent.vue';
+import VnUserLink from 'components/ui/VnUserLink.vue';
 
 const model = defineModel(undefined, { required: true });
 const $props = defineProps({

src/components/VnTable/VnFilter.vue

@@ -1,14 +1,14 @@
 <script setup>
 import { markRaw, computed, defineModel } from 'vue';
 import { QCheckbox } from 'quasar';
-import { useArrayData } from 'src/composables/useArrayData';
+import { useArrayData } from 'composables/useArrayData';
 
 /* basic input */
-import VnSelect from 'src/components/common/VnSelect.vue';
-import VnInput from 'src/components/common/VnInput.vue';
-import VnInputDate from 'src/components/common/VnInputDate.vue';
-import VnInputTime from 'src/components/common/VnInputTime.vue';
-import VnTableColumn from 'src/components/VnTable/VnColumn.vue';
+import VnSelect from 'components/common/VnSelect.vue';
+import VnInput from 'components/common/VnInput.vue';
+import VnInputDate from 'components/common/VnInputDate.vue';
+import VnInputTime from 'components/common/VnInputTime.vue';
+import VnTableColumn from 'components/VnTable/VnColumn.vue';
 
 const $props = defineProps({
     column: {

src/components/VnTable/VnOrder.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { ref } from 'vue';
-import { useArrayData } from 'src/composables/useArrayData';
+import { useArrayData } from 'composables/useArrayData';
 const model = defineModel({ type: Object });
 const $props = defineProps({
     name: {

src/components/VnTable/VnTable.vue

@@ -6,14 +6,14 @@ import { useQuasar } from 'quasar';
 import { useStateStore } from 'stores/useStateStore';
 
 import CrudModel from 'src/components/CrudModel.vue';
-import FormModelPopup from 'src/components/FormModelPopup.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
 
-import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
-import VnTableColumn from 'src/components/VnTable/VnColumn.vue';
-import VnFilter from 'src/components/VnTable/VnFilter.vue';
-import VnTableChip from 'src/components/VnTable/VnChip.vue';
+import VnFilterPanel from 'components/ui/VnFilterPanel.vue';
+import VnTableColumn from 'components/VnTable/VnColumn.vue';
+import VnFilter from 'components/VnTable/VnFilter.vue';
+import VnTableChip from 'components/VnTable/VnChip.vue';
 import VnVisibleColumn from 'src/components/VnTable/VnVisibleColumn.vue';
-import VnLv from 'src/components/ui/VnLv.vue';
+import VnLv from 'components/ui/VnLv.vue';
 import VnTableOrder from 'src/components/VnTable/VnOrder.vue';
 
 const $props = defineProps({
@@ -316,6 +316,7 @@ defineExpose({
     selected,
     CrudModelRef,
     params,
+    tableRef,
 });
 
 function handleOnDataSaved(_) {
@@ -416,6 +417,7 @@ function handleScroll() {
                 ref="tableRef"
                 v-bind="table"
                 class="vnTable"
+                :class="{ 'last-row-sticky': $props.footer }"
                 :columns="splittedColumns.columns"
                 :rows="rows"
                 v-model:selected="selected"
@@ -455,7 +457,11 @@ function handleScroll() {
                     />
                 </template>
                 <template #header-cell="{ col }">
-                    <QTh v-if="col.visible ?? true">
+                    <QTh
+                        v-if="col.visible ?? true"
+                        :style="col.headerStyle"
+                        :class="col.headerClass"
+                    >
                         <div
                             class="column self-start q-ml-xs ellipsis"
                             :class="`text-${col?.align ?? 'left'}`"
@@ -751,7 +757,7 @@ function handleScroll() {
         </FormModelPopup>
     </QDialog>
 </template>
-<i18n lang="yml">
+<i18n>
 en:
     status: Status
     table view: Table view
@@ -815,6 +821,7 @@ es:
         top: 0;
     }
 }
+
 .vnTable {
     thead tr th {
         position: sticky;
@@ -853,6 +860,9 @@ es:
     table tbody th {
         position: relative;
     }
+}
+
+.last-row-sticky {
     tbody:nth-last-child(1) {
         @extend .bg-header;
         position: sticky;

src/components/VnTable/VnVisibleColumn.vue

@@ -181,9 +181,9 @@ onMounted(async () => {
 }
 </style>
 
-<i18n lang="yml">
-es:
-    Check the columns you want to see: Marca las columnas que quieres ver
-    Visible columns: Columnas visibles
-    Tick all: Marcar todas
+<i18n>
+    es:
+        Check the columns you want to see: Marca las columnas que quieres ver
+        Visible columns: Columnas visibles
+        Tick all: Marcar todas
 </i18n>

src/components/common/RightMenu.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { ref, onMounted, useSlots } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStateStore } from 'src/stores/useStateStore';
+import { useStateStore } from 'stores/useStateStore';
 
 const slots = useSlots();
 const hasContent = ref(false);

src/components/common/SendEmailDialog.vue

@@ -78,8 +78,8 @@ async function confirm() {
 }
 </style>
 
-<i18n lang="yml">
-es:
-    Send email notification: Enviar notificación por correo
-    The notification will be sent to the following address: La notificación se enviará a la siguiente dirección
+<i18n>
+    es:
+        Send email notification: Enviar notificación por correo
+        The notification will be sent to the following address: La notificación se enviará a la siguiente dirección
 </i18n>

src/components/common/SendSmsDialog.vue

@@ -1,15 +1,15 @@
 <script setup>
-import { useDialogPluginComponent } from 'quasar';
-import { useI18n } from 'vue-i18n';
-import { computed, ref } from 'vue';
-import VnInput from 'src/components/common/VnInput.vue';
+import {useDialogPluginComponent} from 'quasar';
+import {useI18n} from 'vue-i18n';
+import {computed, ref} from 'vue';
+import VnInput from 'components/common/VnInput.vue';
 import axios from 'axios';
-import useNotify from 'src/composables/useNotify';
+import useNotify from "composables/useNotify";
 
 const MESSAGE_MAX_LENGTH = 160;
 
-const { t } = useI18n();
-const { notify } = useNotify();
+const {t} = useI18n();
+const {notify} = useNotify();
 const props = defineProps({
     title: {
         type: String,
@@ -34,7 +34,7 @@ const props = defineProps({
 });
 
 const emit = defineEmits([...useDialogPluginComponent.emits, 'sent']);
-const { dialogRef, onDialogHide } = useDialogPluginComponent();
+const {dialogRef, onDialogHide} = useDialogPluginComponent();
 
 const smsRules = [
     (val) => (val && val.length > 0) || t("The message can't be empty"),
@@ -144,7 +144,7 @@ const onSubmit = async () => {
     max-width: 450px;
 }
 </style>
-<i18n lang="yml">
+<i18n>
 es:
     Message: Mensaje
     Send: Enviar

src/components/common/TableVisibleColumns.vue

@@ -191,8 +191,8 @@ onMounted(async () => {
 }
 </style>
 
-<i18n lang="yml">
-es:
-    Check the columns you want to see: Marca las columnas que quieres ver
-    Visible columns: Columnas visibles
+<i18n>
+    es:
+        Check the columns you want to see: Marca las columnas que quieres ver
+        Visible columns: Columnas visibles
 </i18n>

src/components/common/VnBreadcrumbs.vue

@@ -67,10 +67,7 @@ function getBreadcrumb(param) {
         />
     </QBreadcrumbs>
 </template>
-<style lang="scss" scoped>
-@import '/src/css/quasar.variables.scss';
-@import '/node_modules/quasar/src/css/variables.sass';
-
+<style lang="scss">
 .q-breadcrumbs {
     &__el,
     > div {

src/components/common/VnBtnSelect.vue

@@ -0,0 +1,19 @@
+<script setup>
+import VnSelect from './VnSelect.vue';
+
+defineProps({
+    selectProps: { type: Object, required: true },
+    promise: { type: Function, default: () => {} },
+});
+</script>
+<template>
+    <QBtnDropdown v-bind="$attrs" color="primary">
+        <VnSelect
+            v-bind="selectProps"
+            hide-selected
+            hide-dropdown-icon
+            focus-on-mount
+            @update:model-value="promise"
+        />
+    </QBtnDropdown>
+</template>

src/components/common/VnCard.vue

@@ -5,9 +5,9 @@ import { useArrayData } from 'src/composables/useArrayData';
 import { useStateStore } from 'stores/useStateStore';
 import useCardSize from 'src/composables/useCardSize';
 import VnSubToolbar from '../ui/VnSubToolbar.vue';
-import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
-import LeftMenu from 'src/components/LeftMenu.vue';
-import RightMenu from 'src/components/common/RightMenu.vue';
+import VnSearchbar from 'components/ui/VnSearchbar.vue';
+import LeftMenu from 'components/LeftMenu.vue';
+import RightMenu from 'components/common/RightMenu.vue';
 const props = defineProps({
     dataKey: { type: String, required: true },
     baseUrl: { type: String, default: undefined },

src/components/common/VnDms.vue

@@ -4,11 +4,11 @@ import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import axios from 'axios';
 
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
-import FormModelPopup from 'src/components/FormModelPopup.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
 
 const route = useRoute();
 const { t } = useI18n();
@@ -195,7 +195,7 @@ function addDefaultData(data) {
     row-gap: 20px;
 }
 </style>
-<i18n lang="yml">
+<i18n>
 en:
     contentTypesInfo: Allowed file types {allowedContentTypes}
     EntryDmsDescription: Reference {reference}
@@ -207,4 +207,5 @@ es:
     EntryDmsDescription: Referencia {reference}
     WorkersDescription: Laboral del empleado {reference}
     SupplierDmsDescription: Referencia {reference}
+
 </i18n>

src/components/common/VnDmsList.vue

@@ -7,11 +7,11 @@ import axios from 'axios';
 
 import VnUserLink from '../ui/VnUserLink.vue';
 import { downloadFile } from 'src/composables/downloadFile';
-import VnImg from 'src/components/ui/VnImg.vue';
-import VnPaginate from 'src/components/ui/VnPaginate.vue';
+import VnImg from 'components/ui/VnImg.vue';
+import VnPaginate from 'components/ui/VnPaginate.vue';
 import VnDms from 'src/components/common/VnDms.vue';
-import VnConfirm from 'src/components/ui/VnConfirm.vue';
-import VnInputDate from 'src/components/common/VnInputDate.vue';
+import VnConfirm from 'components/ui/VnConfirm.vue';
+import VnInputDate from 'components/common/VnInputDate.vue';
 import { useSession } from 'src/composables/useSession';
 
 const route = useRoute();
@@ -419,7 +419,7 @@ defineExpose({
     color: var(--vn-label-color);
 }
 </style>
-<i18n lang="yml">
+<i18n>
 en:
     contentTypesInfo: Allowed file types {allowedContentTypes}
     The documentation is available in paper form: The documentation is available in paper form

src/components/common/VnInput.vue

@@ -118,13 +118,13 @@ const mixinRules = [
         </QInput>
     </div>
 </template>
-<i18n lang="yml">
-en:
-    inputMin: Must be more than {value}
-    inputMax: Must be less than {value}
-es:
-    inputMin: Debe ser mayor a {value}
-    inputMax: Debe ser menor a {value}
+<i18n>
+    en:
+        inputMin: Must be more than {value}
+        inputMax: Must be less than {value}
+    es:
+        inputMin: Debe ser mayor a {value}
+        inputMax: Debe ser menor a {value}
 </i18n>
 <style lang="scss">
 .q-field__append {

src/components/common/VnInputDate.vue

@@ -161,7 +161,7 @@ const manageDate = (date) => {
     border-style: solid;
 }
 </style>
-<i18n lang="yml">
-es:
-    Open date: Abrir fecha
+<i18n>
+    es:
+        Open date: Abrir fecha
 </i18n>

src/components/common/VnInputTime.vue

@@ -140,7 +140,7 @@ function dateToTime(newDate) {
     display: none;
 }
 </style>
-<i18n lang="yml">
-es:
-    Open time: Abrir tiempo
+<i18n>
+    es:
+        Open time: Abrir tiempo
 </i18n>

src/components/common/VnLocation.vue

@@ -1,6 +1,6 @@
 <script setup>
 import CreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
-import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
+import VnSelectDialog from 'components/common/VnSelectDialog.vue';
 import { useI18n } from 'vue-i18n';
 import { ref } from 'vue';
 const { t } = useI18n();
@@ -96,8 +96,6 @@ const handleModelValue = (data) => {
     </VnSelectDialog>
 </template>
 <style lang="scss" scoped>
-@import 'src/css/quasar.variables.scss';
-
 .add-icon {
     cursor: pointer;
     background-color: $primary;
@@ -105,7 +103,7 @@ const handleModelValue = (data) => {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 en:
     search_by_postalcode: Search by postalcode, town, province or country
     Create new location: Create new location

src/components/common/VnLog.vue

@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
 import { useRoute, useRouter } from 'vue-router';
 import axios from 'axios';
 import { date } from 'quasar';
-import { useStateStore } from 'src/stores/useStateStore';
+import { useStateStore } from 'stores/useStateStore';
 import { toRelativeDate } from 'src/filters';
 import { useColor } from 'src/composables/useColor';
 import { useCapitalize } from 'src/composables/useCapitalize';
@@ -852,8 +852,6 @@ watch(
     </QPageSticky>
 </template>
 <style lang="scss" scoped>
-@import 'src/css/quasar.variables.scss';
-
 .q-card {
     background-color: var(--vn-section-color);
 }
@@ -1040,7 +1038,7 @@ watch(
     }
 }
 </style>
-<i18n lang="yml">
+<i18n>
 en:
     to: To
     pointRecord: View record at this point in time

src/components/common/VnLogFilter.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import FetchData from 'src/components/FetchData.vue';
+import FetchData from 'components/FetchData.vue';
 import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
 
 const { t } = useI18n();
@@ -62,7 +62,7 @@ const workers = ref();
     </VnFilterPanel>
 </template>
 
-<i18n lang="yml">
+<i18n>
 en:
     params:
         search: Contains

src/components/common/VnProgressModal.vue

@@ -9,10 +9,6 @@ const $props = defineProps({
         type: Number, //Progress value (1.0 > x > 0.0)
         required: true,
     },
-    showDialog: {
-        type: Boolean,
-        required: true,
-    },
     cancelled: {
         type: Boolean,
         required: false,
@@ -24,30 +20,22 @@ const emit = defineEmits(['cancel', 'close']);
 
 const dialogRef = ref(null);
 
-const _showDialog = computed({
-    get: () => $props.showDialog,
-    set: (value) => {
-        if (value) dialogRef.value.show();
-    },
+const showDialog = defineModel('showDialog', {
+    type: Boolean,
+    default: false,
 });
 
 const _progress = computed(() => $props.progress);
-
 const progressLabel = computed(() => `${Math.round($props.progress * 100)}%`);
-
-const cancel = () => {
-    dialogRef.value.hide();
-    emit('cancel');
-};
 </script>
 
 <template>
-    <QDialog ref="dialogRef" v-model="_showDialog" @hide="onDialogHide">
+    <QDialog ref="dialogRef" v-model="showDialog" @hide="emit('close')">
         <QCard class="full-width dialog">
             <QCardSection class="row">
                 <span class="text-h6">{{ t('Progress') }}</span>
                 <QSpace />
-                <QBtn icon="close" flat round dense @click="emit('close')" />
+                <QBtn icon="close" flat round dense v-close-popup />
             </QCardSection>
             <QCardSection>
                 <div class="column">
@@ -80,7 +68,7 @@ const cancel = () => {
                     type="button"
                     flat
                     class="text-primary"
-                    @click="cancel()"
+                    v-close-popup
                 >
                     {{ t('globals.cancel') }}
                 </QBtn>
@@ -89,7 +77,7 @@ const cancel = () => {
     </QDialog>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Progress: Progreso
     Total progress: Progreso total

src/components/common/VnSectionMain.vue

@@ -1,6 +1,6 @@
 <script setup>
-import { useStateStore } from 'src/stores/useStateStore';
-import LeftMenu from 'src/components/LeftMenu.vue';
+import { useStateStore } from 'stores/useStateStore';
+import LeftMenu from 'components/LeftMenu.vue';
 import { onMounted } from 'vue';
 import { useQuasar } from 'quasar';
 

src/components/common/VnSelect.vue

@@ -86,10 +86,6 @@ const $props = defineProps({
         type: Boolean,
         default: false,
     },
-    sortByWeight: {
-        type: Boolean,
-        default: false,
-    },
 });
 const { validations } = useValidator();
 const requiredFieldRule = (val) => validations().required($attrs.required, val);
@@ -145,6 +141,7 @@ function findKeyInOptions() {
 function setOptions(data) {
     myOptions.value = JSON.parse(JSON.stringify(data));
     myOptionsOriginal.value = JSON.parse(JSON.stringify(data));
+    emit('update:options', data);
 }
 
 function filter(val, options) {

src/components/common/VnSelectDialog.vue

@@ -64,8 +64,6 @@ const isAllowedToCreate = computed(() => {
 </template>
 
 <style lang="scss" scoped>
-@import 'src/css/quasar.variables.scss';
-
 .default-icon {
     cursor: pointer;
     color: $primary;

src/components/common/VnSelectEnum.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { onBeforeMount, ref, useAttrs } from 'vue';
 import axios from 'axios';
-import VnSelect from 'src/components/common/VnSelect.vue';
+import VnSelect from 'components/common/VnSelect.vue';
 
 const { schema, table, column, translation, defaultOptions } = defineProps({
     schema: {

src/components/common/VnSmsDialog.vue

@@ -176,7 +176,7 @@ async function send() {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 en:
     templates:
         pendingPayment: 'Your order is pending of payment.
@@ -218,8 +218,7 @@ fr:
     Message: Message
     messageTooltip: Les caractères spéciaux comme les accents comptent comme plusieurs
     templates:
-        pendingPayment:
-            'Verdnatura : Commande en attente de règlement. Veuillez régler votre commande avant 9h.
+        pendingPayment: 'Verdnatura : Commande en attente de règlement. Veuillez régler votre commande avant 9h.
             Sinon elle sera décalée en fonction de vos jours de livraison . Merci'
         minAmount: 'Verdnatura vous rappelle :
             Montant minimum nécessaire de 50 euros pour recevoir la commande { orderId } livraison { landing }.

src/components/common/vnDiscount.vue

@@ -127,7 +127,7 @@ function cancel({ cancel }) {
     </QPopupEdit>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     New amount: Nuevo importe
     Update discount: Actualizar descuento

src/components/test_FetchData.vue

@@ -1,16 +0,0 @@
-import { mount } from '@cypress/vue'; import FetchData from
-'../../src/components/FetchData.vue'; import axios from 'axios'; import { ref } from
-'vue'; // Mock axios jest.mock('axios'); describe('FetchData Component', () => {
-it('fetches data on mount when autoLoad is true', () => { const mockData = { data: [{ id:
-1, name: 'Test' }] }; axios.get.mockResolvedValue(mockData); const onFetch =
-cy.spy().as('onFetch'); mount(FetchData, { props: { autoLoad: true, url:
-'https://api.example.com/data', }, attrs: { onFetch, }, });
-cy.get('@onFetch').should('have.been.calledWith', mockData.data); }); it('does not fetch
-data on mount when autoLoad is false', () => { const onFetch = cy.spy().as('onFetch');
-mount(FetchData, { props: { autoLoad: false, url: 'https://api.example.com/data', },
-attrs: { onFetch, }, }); cy.get('@onFetch').should('not.have.been.called'); });
-it('fetches data when fetch method is called', () => { const mockData = { data: [{ id: 1,
-name: 'Test' }] }; axios.get.mockResolvedValue(mockData); const onFetch =
-cy.spy().as('onFetch'); const wrapper = mount(FetchData, { props: { autoLoad: false, url:
-'https://api.example.com/data', }, attrs: { onFetch, }, }); wrapper.vm.fetch();
-cy.get('@onFetch').should('have.been.calledWith', mockData.data); }); });

src/components/ui/CardDescriptor.vue

@@ -1,8 +1,8 @@
 <script setup>
 import { onBeforeMount, watch, computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import SkeletonDescriptor from 'src/components/ui/SkeletonDescriptor.vue';
-import { useArrayData } from 'src/composables/useArrayData';
+import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
+import { useArrayData } from 'composables/useArrayData';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import { useState } from 'src/composables/useState';
 import { useRoute } from 'vue-router';

src/components/ui/CardList.vue

@@ -124,7 +124,7 @@ const toggleCardCheck = (item) => {
 }
 </style>
 
-<i18n lang="yml">
-es:
-    ID: ID
+<i18n>
+    es:
+        ID: ID
 </i18n>

src/components/ui/CardSummary.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { ref, computed, watch, onBeforeMount } from 'vue';
 import { useRoute } from 'vue-router';
-import SkeletonSummary from 'src/components/ui/SkeletonSummary.vue';
+import SkeletonSummary from 'components/ui/SkeletonSummary.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import { useArrayData } from 'src/composables/useArrayData';
 
@@ -111,8 +111,6 @@ function existSummary(routes) {
 </template>
 
 <style lang="scss">
-@import 'src/css/quasar.variables.scss';
-
 .summary.container {
     display: flex;
     justify-content: center;
@@ -207,8 +205,6 @@ function existSummary(routes) {
 }
 </style>
 <style lang="scss" scoped>
-@import 'src/css/quasar.variables.scss';
-
 .summaryHeader .vn-label-value {
     display: flex;
     flex-direction: row;

src/components/ui/CatalogItem.vue

@@ -2,7 +2,7 @@
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import VnLv from 'src/components/ui/VnLv.vue';
+import VnLv from 'components/ui/VnLv.vue';
 import VnImg from 'src/components/ui/VnImg.vue';
 import OrderCatalogItemDialog from 'pages/Order/Card/OrderCatalogItemDialog.vue';
 import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
@@ -101,8 +101,6 @@ const dialog = ref(null);
 }
 </style>
 <style lang="scss" scoped>
-@import 'src/css/quasar.variables.scss';
-
 .container {
     max-width: 448px;
     width: 100%;
@@ -181,7 +179,7 @@ const dialog = ref(null);
     }
 }
 </style>
-<i18n lang="yml">
+<i18n>
 es:
     to: to
     price-kg: Precio por Kg

src/components/ui/FetchedTags.vue

@@ -46,8 +46,6 @@ const tags = computed(() => {
 </template>
 
 <style lang="scss" scoped>
-@import 'src/css/quasar.variables.scss';
-
 .fetchedTags {
     align-items: center;
     .wrap {

src/components/ui/VnConfirm.vue

@@ -102,7 +102,7 @@ async function confirm() {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 es:
     Confirm: Confirmar
     Are you sure you want to continue?: ¿Seguro que quieres continuar?

src/components/ui/VnFilterPanel.vue

@@ -1,10 +1,10 @@
 <script setup>
 import { onMounted, ref, computed, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useArrayData } from 'src/composables/useArrayData';
+import { useArrayData } from 'composables/useArrayData';
 import { useRoute } from 'vue-router';
 import toDate from 'filters/toDate';
-import VnFilterPanelChip from 'src/components/ui/VnFilterPanelChip.vue';
+import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue';
 
 const { t } = useI18n();
 const $props = defineProps({
@@ -283,7 +283,7 @@ function sanitizer(params) {
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 es:
     No filters applied: No se han aplicado filtros
     Applied filters: Filtros aplicados

src/components/ui/VnNotes.vue

@@ -8,14 +8,14 @@ import { useQuasar } from 'quasar';
 import { toDateHourMin } from 'src/filters';
 import { useState } from 'src/composables/useState';
 
-import VnPaginate from 'src/components/ui/VnPaginate.vue';
-import VnUserLink from 'src/components/ui/VnUserLink.vue';
-import VnConfirm from 'src/components/ui/VnConfirm.vue';
-import VnAvatar from 'src/components/ui/VnAvatar.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
-import FetchData from 'src/components/FetchData.vue';
-import VnInput from 'src/components/common/VnInput.vue';
+import VnPaginate from 'components/ui/VnPaginate.vue';
+import VnUserLink from 'components/ui/VnUserLink.vue';
+import VnConfirm from 'components/ui/VnConfirm.vue';
+import VnAvatar from 'components/ui/VnAvatar.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import VnSelect from 'components/common/VnSelect.vue';
+import FetchData from 'components/FetchData.vue';
+import VnInput from 'components/common/VnInput.vue';
 
 const $props = defineProps({
     url: { type: String, default: null },
@@ -205,10 +205,10 @@ onBeforeRouteLeave((to, from, next) => {
     }
 }
 </style>
-<i18n lang="yml">
-es:
-    Add note here...: Añadir nota aquí...
-    New note: Nueva nota
-    Save (Enter): Guardar (Intro)
-    Observation type: Tipo de observación
+<i18n>
+    es:
+        Add note here...: Añadir nota aquí...
+        New note: Nueva nota
+        Save (Enter): Guardar (Intro)
+        Observation type: Tipo de observación
 </i18n>

src/components/ui/VnPaginate.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { onBeforeUnmount, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useArrayData } from 'src/composables/useArrayData';
+import { useArrayData } from 'composables/useArrayData';
 
 const { t } = useI18n();
 
@@ -245,7 +245,7 @@ defineExpose({ fetch, addFilter, paginate });
 }
 </style>
 
-<i18n lang="yml">
+<i18n>
 es:
     No data to display: Sin datos que mostrar
     No results found: No se han encontrado resultados

src/components/ui/VnSearchbar.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { onMounted, ref, watch } from 'vue';
 import { useQuasar } from 'quasar';
-import { useArrayData } from 'src/composables/useArrayData';
+import { useArrayData } from 'composables/useArrayData';
 import VnInput from 'src/components/common/VnInput.vue';
 import { useI18n } from 'vue-i18n';
 import { useStateStore } from 'src/stores/useStateStore';

src/components/ui/VnToSummary.vue

@@ -0,0 +1,33 @@
+<script setup>
+import { useRoute } from 'vue-router';
+import { defineProps } from 'vue';
+
+const props = defineProps({
+    routeName: {
+        type: String,
+        required: true,
+    },
+    entityId: {
+        type: [String, Number],
+        required: true,
+    },
+    url: {
+        type: String,
+        default: null,
+    },
+});
+
+const route = useRoute();
+const id = props.entityId;
+</script>
+
+<template>
+    <router-link
+        v-if="route?.name !== routeName"
+        :to="{ name: routeName, params: { id: id } }"
+        class="header link"
+        :href="url"
+    >
+        <QIcon name="open_in_new" color="white" size="sm" />
+    </router-link>
+</template>

src/components/ui/VnUsesMana.vue

@@ -0,0 +1,55 @@
+<script setup>
+import { defineProps, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+const { t } = useI18n();
+const props = defineProps({
+    usesMana: {
+        type: Boolean,
+        required: true,
+    },
+    manaCode: {
+        type: String,
+        required: true,
+    },
+    manaVal: {
+        type: String,
+        default: 'mana',
+    },
+    manaLabel: {
+        type: String,
+        default: 'Promotion mana',
+    },
+    manaClaimVal: {
+        type: String,
+        default: 'manaClaim',
+    },
+    claimLabel: {
+        type: String,
+        default: 'Claim mana',
+    },
+});
+
+const manaCode = ref(props.manaCode);
+</script>
+
+<template>
+    <div class="column q-gutter-y-sm q-mt-sm">
+        <QRadio
+            v-model="manaCode"
+            dense
+            :val="manaVal"
+            :label="t(manaLabel)"
+            :dark="true"
+            class="q-mb-sm"
+        />
+        <QRadio
+            v-model="manaCode"
+            dense
+            :val="manaClaimVal"
+            :label="t(claimLabel)"
+            :dark="true"
+            class="q-mb-sm"
+        />
+    </div>
+</template>

src/composables/useArrayData.js

@@ -1,8 +1,10 @@
 import { onMounted, computed } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
 import axios from 'axios';
-import { useArrayDataStore } from 'src/stores/useArrayDataStore';
-import { buildFilter } from 'src/filters/filterPanel';
+import { useArrayDataStore } from 'stores/useArrayDataStore';
+import { buildFilter } from 'filters/filterPanel';
+
+const arrayDataStore = useArrayDataStore();
 
 export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
     if (!key) throw new Error('ArrayData: A key is required to use this composable');
@@ -296,5 +298,3 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         reset,
     };
 }
-
-const arrayDataStore = useArrayDataStore();

src/composables/useVnConfirm.js

@@ -1,4 +1,4 @@
-import VnConfirm from 'src/components/ui/VnConfirm.vue';
+import VnConfirm from 'components/ui/VnConfirm.vue';
 import { useQuasar } from 'quasar';
 
 export function useVnConfirm() {

src/css/app.scss

@@ -288,3 +288,7 @@ input::-webkit-inner-spin-button {
         color: $info;
     }
 }
+
+.no-visible {
+    visibility: hidden;
+}

src/filters/toHour.js

@@ -1,4 +1,4 @@
-import isValidDate from 'src/filters/isValidDate';
+import isValidDate from 'filters/isValidDate';
 
 export default function toHour(date) {
     if (!isValidDate(date)) {

src/i18n/locale/en.yml

@@ -304,12 +304,14 @@ globals:
         from: From
         To: To
         stateFk: State
-        departmentFk: Department
         email: Email
         SSN: SSN
         fi: FI
+        myTeam: My team
+        departmentFk: Department
     changePass: Change password
     deleteConfirmTitle: Delete selected elements
+    changeState: Change state
 errors:
     statusUnauthorized: Access denied
     statusInternalServerError: An internal server error has ocurred
@@ -556,7 +558,6 @@ ticket:
         package: Package
         taxClass: Tax class
         services: Services
-        changeState: Change state
         requester: Requester
         atender: Atender
         request: Request

src/i18n/locale/es.yml

@@ -312,8 +312,10 @@ globals:
         email: Correo
         SSN: NSS
         fi: NIF
+        myTeam: Mi equipo
     changePass: Cambiar contraseña
     deleteConfirmTitle: Eliminar los elementos seleccionados
+    changeState: Cambiar estado
 errors:
     statusUnauthorized: Acceso denegado
     statusInternalServerError: Ha ocurrido un error interno del servidor
@@ -565,7 +567,6 @@ ticket:
         package: Embalaje
         taxClass: Tipo IVA
         services: Servicios
-        changeState: Cambiar estado
         requester: Solicitante
         atender: Comprador
         request: Petición de compra

src/pages/Account/AccountAccounts.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
-import FormModel from 'src/components/FormModel.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FormModel from 'components/FormModel.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import axios from 'axios';
@@ -95,7 +95,7 @@ const onSynchronizeRoles = async () => {
     </QPage>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Roles synchronized!: ¡Roles sincronizados!
     Synchronizing in the background: Sincronizando en segundo plano

src/pages/Account/AccountAcls.vue

@@ -6,9 +6,9 @@ import axios from 'axios';
 import useNotify from 'src/composables/useNotify.js';
 import { useQuasar } from 'quasar';
 
-import VnTable from 'src/components/VnTable/VnTable.vue';
-import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
-import VnConfirm from 'src/components/ui/VnConfirm.vue';
+import VnTable from 'components/VnTable/VnTable.vue';
+import VnSearchbar from 'components/ui/VnSearchbar.vue';
+import VnConfirm from 'components/ui/VnConfirm.vue';
 
 defineProps({
     id: {
@@ -150,7 +150,7 @@ const deleteAcl = async ({ id }) => {
     />
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     New ACL: Nuevo ACL
     ACL removed: ACL eliminado

src/pages/Account/AccountAliasList.vue

@@ -1,8 +1,8 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
 import { ref, computed } from 'vue';
-import VnTable from 'src/components/VnTable/VnTable.vue';
-import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
+import VnTable from 'components/VnTable/VnTable.vue';
+import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import { useStateStore } from 'stores/useStateStore';
 
 const tableRef = ref();
@@ -74,9 +74,9 @@ const columns = computed(() => [
     />
 </template>
 
-<i18n lang="yml">
-es:
-    Id: Id
-    Alias: Alias
-    Description: Descripción
+<i18n>
+    es:
+        Id: Id
+        Alias: Alias
+        Description: Descripción
 </i18n>

src/pages/Account/AccountConnections.vue

@@ -2,13 +2,13 @@
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import VnPaginate from 'src/components/ui/VnPaginate.vue';
+import VnPaginate from 'components/ui/VnPaginate.vue';
 import CardList from 'src/components/ui/CardList.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import { toDateTimeFormat } from 'src/filters/date.js';
 import axios from 'axios';
 import useNotify from 'src/composables/useNotify.js';
-import { useVnConfirm } from 'src/composables/useVnConfirm';
+import { useVnConfirm } from 'composables/useVnConfirm';
 
 const { t } = useI18n();
 const router = useRouter();
@@ -102,7 +102,7 @@ const killSession = async ({ userId, created }) => {
     </QPage>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Session killed: Sesión matada
     Session will be killed: Se va a matar la sesión

src/pages/Account/AccountCreate.vue

@@ -2,9 +2,9 @@
 import { reactive, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
-import FormModelPopup from 'src/components/FormModelPopup.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
-import FetchData from 'src/components/FetchData.vue';
+import FetchData from 'components/FetchData.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 
 const { t } = useI18n();

src/pages/Account/AccountFilter.vue

@@ -1,9 +1,9 @@
 <script setup>
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import FetchData from 'src/components/FetchData.vue';
+import FetchData from 'components/FetchData.vue';
 import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
+import VnSelect from 'components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 
 const { t } = useI18n();

src/pages/Account/AccountLdap.vue

@@ -1,8 +1,8 @@
 <script setup>
 import { ref, onMounted, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
-import FormModel from 'src/components/FormModel.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FormModel from 'components/FormModel.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import { useArrayData } from 'src/composables/useArrayData';
@@ -156,7 +156,7 @@ onMounted(async () => await getInitialLdapConfig());
     </QPage>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     LDAP connection established!: ¡Conexión con LDAP establecida!
 </i18n>

src/pages/Account/AccountList.vue

@@ -1,8 +1,8 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
 import { ref, computed } from 'vue';
-import VnTable from 'src/components/VnTable/VnTable.vue';
-import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
+import VnTable from 'components/VnTable/VnTable.vue';
+import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import AccountSummary from './Card/AccountSummary.vue';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import AccountFilter from './AccountFilter.vue';
@@ -130,9 +130,9 @@ const exprBuilder = (param, value) => {
     />
 </template>
 
-<i18n lang="yml">
-es:
-    Id: Id
-    Nickname: Nickname
-    Name: Nombre
+<i18n>
+    es:
+        Id: Id
+        Nickname: Nickname
+        Name: Nombre
 </i18n>

src/pages/Account/AccountSamba.vue

@@ -1,8 +1,8 @@
 <script setup>
 import { ref, onMounted, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
-import FormModel from 'src/components/FormModel.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FormModel from 'components/FormModel.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import { useArrayData } from 'src/composables/useArrayData';
@@ -176,7 +176,7 @@ onMounted(async () => await getInitialSambaConfig());
     </QPage>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Samba connection established!: ¡Conexión con LDAP establecida!
 </i18n>

src/pages/Account/Acls/AclFilter.vue

@@ -2,9 +2,9 @@
 import { ref, onBeforeMount } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import FetchData from 'src/components/FetchData.vue';
+import FetchData from 'components/FetchData.vue';
 import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
+import VnSelect from 'components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 
 import { useValidator } from 'src/composables/useValidator';

src/pages/Account/Acls/AclFormView.vue

@@ -4,7 +4,7 @@ import { ref, onBeforeMount, onMounted } from 'vue';
 
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
-import FormModelPopup from 'src/components/FormModelPopup.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
 
 import { useValidator } from 'src/composables/useValidator';
 import { useArrayData } from 'src/composables/useArrayData';

src/pages/Account/Alias/AliasCreateForm.vue

@@ -2,8 +2,8 @@
 import { useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
-import FormModelPopup from 'src/components/FormModelPopup.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
+import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 
 import { useArrayData } from 'src/composables/useArrayData';
@@ -51,7 +51,7 @@ const onDataSaved = ({ id }) => {
     </FormModelPopup>
 </template>
 
-<i18n lang="yml">
-es:
-    Create alias: Crear alias
+<i18n>
+    es:
+        Create alias: Crear alias
 </i18n>

src/pages/Account/Alias/Card/AliasBasicData.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
 
-import FormModel from 'src/components/FormModel.vue';
+import FormModel from 'components/FormModel.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 
 const { t } = useI18n();

src/pages/Account/Alias/Card/AliasCard.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
-import VnCard from 'src/components/common/VnCard.vue';
+import VnCard from 'components/common/VnCard.vue';
 import AliasDescriptor from './AliasDescriptor.vue';
 const { t } = useI18n();
 </script>

src/pages/Account/Alias/Card/AliasDescriptor.vue

@@ -4,7 +4,7 @@ import { useRoute, useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
 
-import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
+import CardDescriptor from 'components/ui/CardDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 
 import useCardDescription from 'src/composables/useCardDescription';
@@ -76,13 +76,13 @@ const removeAlias = () => {
     </CardDescriptor>
 </template>
 
-<i18n lang="yml">
-en:
-    accountRate: Claming rate
-es:
-    accountRate: Ratio de reclamación
-    Delete: Eliminar
-    Alias will be removed: El alias será eliminado
-    Are you sure you want to continue?: ¿Seguro que quieres continuar?
-    Alias removed: Alias eliminado
+<i18n>
+    en:
+        accountRate: Claming rate
+    es:
+        accountRate: Ratio de reclamación
+        Delete: Eliminar
+        Alias will be removed: El alias será eliminado
+        Are you sure you want to continue?: ¿Seguro que quieres continuar?
+        Alias removed: Alias eliminado
 </i18n>

src/pages/Account/Alias/Card/AliasSummary.vue

@@ -3,7 +3,7 @@ import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
-import CardSummary from 'src/components/ui/CardSummary.vue';
+import CardSummary from 'components/ui/CardSummary.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 
 import { useArrayData } from 'src/composables/useArrayData';

src/pages/Account/Alias/Card/AliasUsers.vue

@@ -3,10 +3,10 @@ import { useRoute } from 'vue-router';
 import { computed, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import VnPaginate from 'src/components/ui/VnPaginate.vue';
+import VnPaginate from 'components/ui/VnPaginate.vue';
 
-import { useVnConfirm } from 'src/composables/useVnConfirm';
-import { useArrayData } from 'src/composables/useArrayData';
+import { useVnConfirm } from 'composables/useVnConfirm';
+import { useArrayData } from 'composables/useArrayData';
 import useNotify from 'src/composables/useNotify.js';
 import axios from 'axios';
 
@@ -46,13 +46,9 @@ const columns = computed(() => [
 ]);
 
 const deleteAlias = async (row) => {
-    try {
-        await axios.delete(`${urlPath.value}/${row.id}`);
-        notify(t('User removed'), 'positive');
-        fetchAliases();
-    } catch (error) {
-        console.error(error);
-    }
+    await axios.delete(`${urlPath.value}/${row.id}`);
+    notify(t('User removed'), 'positive');
+    fetchAliases();
 };
 
 watch(
@@ -113,7 +109,7 @@ const fetchAliases = () => paginateRef.value.fetch();
     </QPage>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     User will be removed from alias: El usuario será borrado del alias
     Are you sure you want to continue?: ¿Seguro que quieres continuar?

src/pages/Account/Card/AccountBasicData.vue

@@ -3,7 +3,7 @@ import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnSelectEnum from 'src/components/common/VnSelectEnum.vue';
-import FormModel from 'src/components/FormModel.vue';
+import FormModel from 'components/FormModel.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import { ref, watch } from 'vue';
 

src/pages/Account/Card/AccountCard.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
-import VnCard from 'src/components/common/VnCard.vue';
+import VnCard from 'components/common/VnCard.vue';
 import AccountDescriptor from './AccountDescriptor.vue';
 
 const { t } = useI18n();

src/pages/Account/Card/AccountDescriptor.vue

@@ -2,7 +2,7 @@
 import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
+import CardDescriptor from 'components/ui/CardDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import useCardDescription from 'src/composables/useCardDescription';
 import AccountDescriptorMenu from './AccountDescriptorMenu.vue';
@@ -108,9 +108,9 @@ const hasAccount = ref(false);
     margin-top: 0;
 }
 </style>
-<i18n lang="yml">
-en:
-    accountRate: Claming rate
-es:
-    accountRate: Ratio de reclamación
+<i18n>
+    en:
+        accountRate: Claming rate
+    es:
+        accountRate: Ratio de reclamación
 </i18n>

src/pages/Account/Card/AccountDescriptorMenu.vue

@@ -2,7 +2,7 @@
 import axios from 'axios';
 import { computed, ref, toRefs } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useVnConfirm } from 'src/composables/useVnConfirm';
+import { useVnConfirm } from 'composables/useVnConfirm';
 import { useRoute } from 'vue-router';
 import { useAcl } from 'src/composables/useAcl';
 import { useArrayData } from 'src/composables/useArrayData';

src/pages/Account/Card/AccountMailAlias.vue

@@ -3,11 +3,11 @@ import { computed, ref, watch, onMounted, nextTick } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 
-import VnPaginate from 'src/components/ui/VnPaginate.vue';
+import VnPaginate from 'components/ui/VnPaginate.vue';
 import AccountMailAliasCreateForm from './AccountMailAliasCreateForm.vue';
 
-import { useVnConfirm } from 'src/composables/useVnConfirm';
-import { useArrayData } from 'src/composables/useArrayData';
+import { useVnConfirm } from 'composables/useVnConfirm';
+import { useArrayData } from 'composables/useArrayData';
 import useNotify from 'src/composables/useNotify.js';
 import axios from 'axios';
 
@@ -61,23 +61,15 @@ const fetchAccountExistence = async () => {
 };
 
 const deleteMailAlias = async (row) => {
-    try {
-        await axios.delete(`${urlPath}/${row.id}`);
-        fetchMailAliases();
-        notify(t('Unsubscribed from alias!'), 'positive');
-    } catch (error) {
-        console.error(error);
-    }
+    await axios.delete(`${urlPath}/${row.id}`);
+    fetchMailAliases();
+    notify(t('Unsubscribed from alias!'), 'positive');
 };
 
 const createMailAlias = async (mailAliasFormData) => {
-    try {
-        await axios.post(urlPath, mailAliasFormData);
-        notify(t('Subscribed to alias!'), 'positive');
-        fetchMailAliases();
-    } catch (error) {
-        console.error(error);
-    }
+    await axios.post(urlPath, mailAliasFormData);
+    notify(t('Subscribed to alias!'), 'positive');
+    fetchMailAliases();
 };
 
 const fetchMailAliases = async () => {
@@ -182,7 +174,7 @@ onMounted(async () => await getAccountData(false));
     </QPage>
 </template>
 
-<i18n lang="yml">
+<i18n>
 es:
     Unsubscribed from alias!: ¡Desuscrito del alias!
     Subscribed to alias!: ¡Suscrito al alias!

src/pages/Account/Card/AccountMailAliasCreateForm.vue

@@ -4,9 +4,9 @@ import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 
 import VnSelect from 'src/components/common/VnSelect.vue';
-import FetchData from 'src/components/FetchData.vue';
-import VnRow from 'src/components/ui/VnRow.vue';
-import FormPopup from 'src/components/FormPopup.vue';
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import FormPopup from 'components/FormPopup.vue';
 
 const emit = defineEmits(['onSubmitCreateAlias']);