From ae59685d511f65bfbaff6c4efccdffbc70a4daa8 Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Wed, 31 Jul 2024 11:41:30 +0530 Subject: [PATCH] Improved: logic for client side searching (#360) --- src/components/AddProductFiltersModal.vue | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue index bf12ad02..6fc7115d 100644 --- a/src/components/AddProductFiltersModal.vue +++ b/src/components/AddProductFiltersModal.vue @@ -89,6 +89,7 @@ const facetOptions = ref([]) as any; const queryString = ref(''); const selectedValues = ref([]) as any; const filteredOptions = ref([]) as any; +const availableOptions = ref([]) as any; const pageSize = process.env.VUE_APP_VIEW_SIZE || 0; const currentPage = ref(0); @@ -108,6 +109,7 @@ onMounted(async() => { isLoading.value = true; await store.dispatch("util/fetchProductFilters", { facetToSelect: props.facetToSelect, searchfield: props.searchfield }) facetOptions.value = getFacetOptions.value(props.searchfield); + availableOptions.value = JSON.parse(JSON.stringify(facetOptions.value)) getFilters(); selectedValues.value = JSON.parse(JSON.stringify(appliedFilters.value[props.type][props.searchfield])) isLoading.value = false; @@ -122,6 +124,11 @@ function search() { currentPage.value = 0; filteredOptions.value = [] + if(queryString.value.trim()) { + availableOptions.value = facetOptions.value.filter((option: any) => option.label.toLowerCase().includes(queryString.value.trim().toLowerCase())) + } else { + availableOptions.value = JSON.parse(JSON.stringify(facetOptions.value)) + } getFilters(); } @@ -137,12 +144,7 @@ async function loadMoreFilters(event: any){ } async function getFilters() { - let options = facetOptions.value - if(queryString.value) { - options = facetOptions.value.filter((option: any) => option.label.toLowerCase().includes(queryString.value.toLowerCase())) - } - - const nextPageItems = options.slice(currentPage.value * pageSize, (currentPage.value + 1) * pageSize); + const nextPageItems = availableOptions.value.slice(currentPage.value * pageSize, (currentPage.value + 1) * pageSize); filteredOptions.value = filteredOptions.value.concat(nextPageItems); currentPage.value += 1;