diff --git a/src/boot/axios.js b/src/boot/axios.js index 99a163cca..aee38e887 100644 --- a/src/boot/axios.js +++ b/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); }; diff --git a/src/boot/mainShortcutMixin.js b/src/boot/mainShortcutMixin.js deleted file mode 100644 index 8e5f147db..000000000 --- a/src/boot/mainShortcutMixin.js +++ /dev/null @@ -1,38 +0,0 @@ -import routes from 'src/router/modules'; -import { useRouter } from 'vue-router'; - -let isNotified = false; - -export default { - created: function () { - const router = useRouter(); - const keyBindingMap = routes - .filter((route) => route.meta.keyBinding) - .reduce((map, route) => { - map['Key' + route.meta.keyBinding.toUpperCase()] = route.path; - return map; - }, {}); - - const handleKeyDown = (event) => { - const { ctrlKey, altKey, code } = event; - - if (ctrlKey && altKey && keyBindingMap[code] && !isNotified) { - event.preventDefault(); - router.push(keyBindingMap[code]); - isNotified = true; - } - }; - - const handleKeyUp = (event) => { - const { ctrlKey, altKey } = event; - - // Resetea la bandera cuando se sueltan las teclas ctrl o alt - if (!ctrlKey || !altKey) { - isNotified = false; - } - }; - - window.addEventListener('keydown', handleKeyDown); - window.addEventListener('keyup', handleKeyUp); - }, -}; diff --git a/src/boot/quasar.js b/src/boot/quasar.js index 5db6edd24..01fe68d8b 100644 --- a/src/boot/quasar.js +++ b/src/boot/quasar.js @@ -1,16 +1,51 @@ import { boot } from 'quasar/wrappers'; 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'); }; }); diff --git a/src/components/CreateNewPostcodeForm.vue b/src/components/CreateNewPostcodeForm.vue index 99cba5360..03cba8ac7 100644 --- a/src/components/CreateNewPostcodeForm.vue +++ b/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({ @@ -102,10 +108,13 @@ watch( watch( () => postcodeFormData.provinceFk, - async (newProvinceFk) => { - if (newProvinceFk[0] && newProvinceFk[0] !== postcodeFormData.provinceFk) { + async (newProvinceFk, oldValueFk) => { + if (Array.isArray(newProvinceFk)) { + newProvinceFk = newProvinceFk[0]; + } + if (newProvinceFk !== oldValueFk) { await townsFetchDataRef.value.fetch({ - where: { provinceFk: newProvinceFk[0] }, + where: { provinceFk: newProvinceFk }, }); } } @@ -125,16 +134,20 @@ async function handleCountries(data) { - + { }, }" url="Autonomies/location" + :sort-by="['name ASC']" + :limit="30" /> diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue index 00faaebc2..9b0393489 100644 --- a/src/components/NavBar.vue +++ b/src/components/NavBar.vue @@ -3,6 +3,7 @@ import { onMounted, ref } from 'vue'; import { useI18n } from 'vue-i18n'; import { useState } from 'src/composables/useState'; import { useStateStore } from 'stores/useStateStore'; +import { useStateQueryStore } from 'src/stores/useStateQueryStore'; import { useQuasar } from 'quasar'; import PinnedModules from './PinnedModules.vue'; import UserPanel from 'components/UserPanel.vue'; @@ -12,6 +13,7 @@ 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(); + diff --git a/src/components/VnSelectProvince.vue b/src/components/VnSelectProvince.vue index 606799e50..9fcbef11e 100644 --- a/src/components/VnSelectProvince.vue +++ b/src/components/VnSelectProvince.vue @@ -1,5 +1,5 @@