diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue index 68b3a7676..d78c3ba13 100644 --- a/src/components/ui/VnFilterPanel.vue +++ b/src/components/ui/VnFilterPanel.vue @@ -20,6 +20,10 @@ const props = defineProps({ required: false, default: null, }, + showAll: { + type: Boolean, + default: true, + }, }); const emit = defineEmits(['refresh', 'clear']); @@ -29,31 +33,34 @@ const store = arrayData.store; const userParams = ref({}); onMounted(() => { - if (props.params) userParams.value = props.params; - const params = store.userParams; - if (Object.keys(params).length > 0) { - userParams.value = Object.assign({}, params); + if (props.params) userParams.value = JSON.parse(JSON.stringify(props.params)); + if (Object.keys(store.userParams).length > 0) { + userParams.value = JSON.parse(JSON.stringify(store.userParams)); } }); const isLoading = ref(false); async function search() { - const params = userParams.value; - for (const param in params) { - if (params[param] === '' || params[param] === null) { + for (const param in userParams.value) { + if (userParams.value[param] === '' || userParams.value[param] === null) { delete userParams.value[param]; delete store.userParams[param]; } } - + const params = { ...userParams.value }; isLoading.value = true; await arrayData.addFilter({ params }); + if (!props.showAll && !Object.values(params).length) store.data = []; + isLoading.value = false; } async function reload() { isLoading.value = true; + const params = Object.values(userParams.value).filter((param) => param); + await arrayData.fetch({ append: false }); + if (!props.showAll && !params.length) store.data = []; isLoading.value = false; emit('refresh'); } @@ -62,6 +69,7 @@ async function clearFilters() { userParams.value = {}; isLoading.value = true; await arrayData.applyFilter({ params: {} }); + if (!props.showAll) store.data = []; isLoading.value = false; emit('clear'); diff --git a/src/composables/useArrayData.js b/src/composables/useArrayData.js index 4535cde0f..9aff0eaa8 100644 --- a/src/composables/useArrayData.js +++ b/src/composables/useArrayData.js @@ -136,7 +136,7 @@ export function useArrayData(key, userOptions) { } async function refresh() { - await fetch({ append: false }); + if (Object.values(store.userParams).length) await fetch({ append: false }); } function updateStateParams() { diff --git a/src/pages/Customer/CustomerPayments.vue b/src/pages/Customer/CustomerPayments.vue index 608aca2af..24e5efa39 100644 --- a/src/pages/Customer/CustomerPayments.vue +++ b/src/pages/Customer/CustomerPayments.vue @@ -110,12 +110,18 @@ function stateColor(row) { - + - +
{{ t('Web Payments') }} @@ -138,7 +144,7 @@ function stateColor(row) { order="created DESC" :limit="20" :offset="50" - auto-load + :auto-load="!!$route?.query.params" >