#6992 add URL params #273
|
@ -9,6 +9,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||
|
||||
### Added
|
||||
|
||||
### Fixed
|
||||
|
||||
- (General) => Se vuelven a mostrar los parámetros en la url al aplicar un filtro
|
||||
|
||||
## [2414.01] - 2024-04-04
|
||||
|
||||
### Added
|
||||
|
|
|
@ -101,16 +101,16 @@ onMounted(async () => {
|
|||
});
|
||||
|
||||
onBeforeRouteLeave((to, from, next) => {
|
||||
if (!hasChanges.value) next();
|
||||
|
||||
quasar.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
title: t('Unsaved changes will be lost'),
|
||||
message: t('Are you sure exit without saving?'),
|
||||
promise: () => next(),
|
||||
},
|
||||
});
|
||||
if (hasChanges.value)
|
||||
|
||||
quasar.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
title: t('Unsaved changes will be lost'),
|
||||
message: t('Are you sure exit without saving?'),
|
||||
promise: () => next(),
|
||||
},
|
||||
});
|
||||
else next();
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
|
|
|
@ -5,7 +5,7 @@ import { useCapitalize } from 'src/composables/useCapitalize';
|
|||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: { type: String, default: '' },
|
||||
modelValue: { type: [String, Number], default: '' },
|
||||
jorgep
commented
Soluciona warning de consola Soluciona warning de consola
|
||||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import { onMounted, ref, computed } from 'vue';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import { useRoute } from 'vue-router';
|
||||
import axios from 'axios';
|
||||
import { useArrayDataStore } from 'stores/useArrayDataStore';
|
||||
import { buildFilter } from 'filters/filterPanel';
|
||||
|
@ -15,7 +15,6 @@ export function useArrayData(key, userOptions) {
|
|||
|
||||
const store = arrayDataStore.get(key);
|
||||
const hasMoreData = ref(false);
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
let canceller = null;
|
||||
|
||||
|
@ -105,7 +104,7 @@ export function useArrayData(key, userOptions) {
|
|||
for (const row of response.data) store.data.push(row);
|
||||
} else {
|
||||
jorgep marked this conversation as resolved
Outdated
jsegarra
commented
Se que no lo has modificado, pero puedes eliminar el warning de la línea 18? Se que no lo has modificado, pero puedes eliminar el warning de la línea 18?
|
||||
store.data = response.data;
|
||||
if (!document.querySelectorAll('[role="dialog"]'))
|
||||
if (!document.querySelectorAll('[role="dialog"]').length)
|
||||
updateRouter && updateStateParams();
|
||||
jsegarra marked this conversation as resolved
Outdated
jsegarra
commented
Mmm, esa linea lleva ahi desde el 8/2/24...a ti te ha funcionado?Porque quizás habría que darle una vuelta, queryselectorAll siempre devolverá un array. Mmm, esa linea lleva ahi desde el 8/2/24...a ti te ha funcionado?Porque quizás habría que darle una vuelta, queryselectorAll siempre devolverá un array.
a lo mejor hacer length > 0
Así como curiosidad, GPT me ha dicho que use esta sentencia:
` window.Quasar?.dialog?.manager?.__showing?.length > 0` pero no lo tengo claro
jorgep
commented
Sí, la línea funciona. Hacer !array.length es lo mismo que !array.length>0 . he probado eso y no parece existir en el navegador Sí, la línea funciona. Hacer !array.length es lo mismo que !array.length>0 . he probado eso y no parece existir en el navegador
|
||||
}
|
||||
|
||||
|
@ -188,11 +187,15 @@ export function useArrayData(key, userOptions) {
|
|||
if (store.userParams && Object.keys(store.userParams).length !== 0)
|
||||
query.params = JSON.stringify(store.userParams);
|
||||
|
||||
if (router)
|
||||
jorgep
commented
Esto redirige, por lo que no es lo más correcto. Alex y Juan me dan el ok. Esto redirige, por lo que no es lo más correcto. Alex y Juan me dan el ok.
|
||||
router.replace({
|
||||
path: route.path,
|
||||
query: query,
|
||||
});
|
||||
const url = new URL(window.location.href);
|
||||
const { hash: currentHash } = url;
|
||||
const [currentRoute] = currentHash.split('?');
|
||||
|
||||
const params = new URLSearchParams();
|
||||
for (const param in query) params.append(param, query[param]);
|
||||
|
||||
url.hash = currentRoute + '?' + params.toString();
|
||||
window.history.pushState({}, '', url.hash);
|
||||
jsegarra marked this conversation as resolved
Outdated
jsegarra
commented
porque no usas currentHash? porque no usas currentHash?
Idem para la siguiente linea
jorgep
commented
Porque currentRoute es solo la ruta . Ej. currentRoute = #/claim/list y currentHash = #/claim/list?order=priority+ASC%2Ccreated+DESC&limit=10¶ms=%7B%22clientName%22%3A%22br%22%7D . CurrentHash es la ruta con los parámetros actuales. Porque currentRoute es solo la ruta . Ej. currentRoute = #/claim/list y currentHash = #/claim/list?order=priority+ASC%2Ccreated+DESC&limit=10¶ms=%7B%22clientName%22%3A%22br%22%7D . CurrentHash es la ruta con los parámetros actuales.
|
||||
}
|
||||
|
||||
const totalRows = computed(() => (store.data && store.data.length) || 0);
|
||||
|
|
|
@ -36,7 +36,7 @@ describe('VnSearchBar', () => {
|
|||
const checkCardListAndUrl = (expectedLength) => {
|
||||
cy.get(cardList).then(($cardList) => {
|
||||
expect($cardList.find('.q-card').length).to.equal(expectedLength);
|
||||
cy.url().then((currentUrl) => expect(currentUrl).to.equal(url));
|
||||
cy.url().then((currentUrl) => expect(currentUrl).to.contain(url));
|
||||
});
|
||||
};
|
||||
});
|
||||
|
|
|
@ -0,0 +1,31 @@
|
|||
import { describe, expect, it, beforeAll } from 'vitest';
|
||||
import { axios } from 'app/test/vitest/helper';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
|
||||
describe('useArrayData', () => {
|
||||
let arrayData;
|
||||
beforeAll(() => {
|
||||
axios.get.mockResolvedValue({ data: [] });
|
||||
arrayData = useArrayData('InvoiceIn', { url: 'invoice-in/list' });
|
||||
Object.defineProperty(window.location, 'href', {
|
||||
writable: true,
|
||||
value: 'localhost:9000/invoice-in/list',
|
||||
});
|
||||
|
||||
jorgep marked this conversation as resolved
Outdated
jorgep
commented
No sé porque vitest no reconoce esta función, tampoco reconoce la clase URL, he tenido que simular el comportamiento. No sé porque vitest no reconoce esta función, tampoco reconoce la clase URL, he tenido que simular el comportamiento.
jsegarra
commented
hablas de la función de pushState? hablas de la función de pushState?
jorgep
commented
sí sí
jsegarra
commented
Poner comentario indicando que se está mockeando el método para usar dentro de useArrayData e igual para class URL Poner comentario indicando que se está mockeando el método para usar dentro de useArrayData e igual para class URL
|
||||
// Mock the window.history.pushState method within useArrayData
|
||||
window.history.pushState = (data, title, url) => (window.location.href = url);
|
||||
|
||||
// Mock the URL constructor within useArrayData
|
||||
global.URL = class URL {
|
||||
constructor(url) {
|
||||
this.hash = url.split('localhost:9000/')[1];
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
it('should add the params to the url', async () => {
|
||||
arrayData.store.userParams = { supplierFk: 2 };
|
||||
arrayData.updateStateParams();
|
||||
expect(window.location.href).contain('params=%7B%22supplierFk%22%3A2%7D');
|
||||
});
|
||||
});
|
Arregla el funcionamiento.