en enregistre en localstorage le filtrage de vue select, qui supplante les valeurs chargees par url

This commit is contained in:
Christophe 2022-04-26 08:55:52 +02:00
parent a44b88e941
commit 8d217bb0db
2 changed files with 79 additions and 32 deletions

View file

@ -244,6 +244,7 @@ let monTableau = {
options: [], options: [],
searchInputHead: '', searchInputHead: '',
searchInputVal: '', searchInputVal: '',
loadingVueSelect: true,
}; };
}, },
mounted() { mounted() {
@ -392,6 +393,23 @@ let monTableau = {
}); });
} }
}, },
filtreColSelected: {
handler() {
if (!this.loadingVueSelect) {
let ObfiltreSelect = [];
if (this.filtreColSelected) {
Object.entries(this.filtreColSelected).forEach(([champ, valeurs]) => {
if (!Array.isArray(valeurs)) {
valeurs = [valeurs];
}
ObfiltreSelect.push({ champ, valeurs });
});
}
localStorage.setItem('filtreselect_' + this.nameLocalStorage, JSON.stringify(ObfiltreSelect));
}
},
deep: true,
},
}, },
methods: { methods: {
hanldeSearchInput(event, head) { hanldeSearchInput(event, head) {
@ -403,6 +421,9 @@ let monTableau = {
this.searchInputVal = ''; this.searchInputVal = '';
this.searchInputHead = ''; this.searchInputHead = '';
}, },
endLoadingVueSelect() {
this.loadingVueSelect = false;
},
calculer_nameLocalStorage() { calculer_nameLocalStorage() {
if (this.apiuri) { if (this.apiuri) {
return this.apiuri.match(/.*page=(.*)/)[1]; return this.apiuri.match(/.*page=(.*)/)[1];
@ -514,8 +535,15 @@ let monTableau = {
Vue.nextTick(() => { Vue.nextTick(() => {
this.chargement = false; this.chargement = false;
console.log(this.filtreselect); let filtreselect = localStorage.getItem('filtreselect_' + this.nameLocalStorage);
if (this.filtreselect) { if (filtreselect) {
let Tfiltres = JSON.parse(filtreselect);
Tfiltres.forEach((col) => {
let v = col.valeurs;
this.filtreColSelected[col.champ] = [...this.filtreColSelected[col.champ], ...v];
});
this.filtreColModif++;
} else if (this.filtreselect) {
let Tfiltres = recupJson(decodeURIComponent(this.filtreselect)); let Tfiltres = recupJson(decodeURIComponent(this.filtreselect));
localStorage.setItem('filtreselect_' + this.nameLocalStorage, JSON.stringify(Tfiltres)); localStorage.setItem('filtreselect_' + this.nameLocalStorage, JSON.stringify(Tfiltres));
Tfiltres.forEach((col) => { Tfiltres.forEach((col) => {
@ -525,18 +553,6 @@ let monTableau = {
]; ];
}); });
this.filtreColModif++; this.filtreColModif++;
} else {
let filtreselect = localStorage.getItem('filtreselect_' + this.nameLocalStorage);
if (filtreselect) {
let Tfiltres = JSON.parse(filtreselect);
Tfiltres.forEach((col) => {
this.filtreColSelected[col.champ] = [
...this.filtreColSelected[col.champ],
...col.valeurs,
];
});
this.filtreColModif++;
}
} }
if (parseInt(this._id) > 0) { if (parseInt(this._id) > 0) {
@ -757,7 +773,8 @@ let monTableau = {
clear-on-close clear-on-close
searchable searchable
@selected="selectValCol" @selected="selectValCol"
@search:input="hanldeSearchInput($event, head)" @search:focus="endLoadingVueSelect"
@removed="endLoadingVueSelect"
> >
<template #tag="{ option, remove }"> <template #tag="{ option, remove }">
<div class="tag--un"> <div class="tag--un">
@ -773,7 +790,8 @@ let monTableau = {
v-model="filtreColSelected[head]" v-model="filtreColSelected[head]"
type="text" type="text"
placeholder="Rechercher" placeholder="Rechercher"
@keyup="selectValCol" @keydown="endLoadingVueSelect"
> >
<button <button
v-if="filtreColType[head] === 'input' && filtreColSelected[head].length !== 0" v-if="filtreColType[head] === 'input' && filtreColSelected[head].length !== 0"

File diff suppressed because one or more lines are too long