From 02f8288b22e85da409d5635490d05ec2031121f0 Mon Sep 17 00:00:00 2001 From: alexm <alexm@verdnatura.es> Date: Wed, 19 Jun 2024 15:02:26 +0200 Subject: [PATCH] feat(customerList): add searchbar --- src/components/common/VnCard.vue | 9 +++++++-- src/pages/Customer/Card/CustomerCard.vue | 4 ++-- src/pages/Customer/CustomerList.vue | 8 +++++++- 3 files changed, 16 insertions(+), 5 deletions(-) diff --git a/src/components/common/VnCard.vue b/src/components/common/VnCard.vue index 98c079239..8517525df 100644 --- a/src/components/common/VnCard.vue +++ b/src/components/common/VnCard.vue @@ -1,5 +1,5 @@ <script setup> -import { computed } from 'vue'; +import { onBeforeMount, computed } from 'vue'; import { useRoute } from 'vue-router'; import { useArrayData } from 'src/composables/useArrayData'; import { useStateStore } from 'stores/useStateStore'; @@ -32,10 +32,15 @@ const url = computed(() => { return props.customUrl; }); -useArrayData(props.dataKey, { +const arrayData = useArrayData(props.dataKey, { url: url.value, filter: props.filter, }); + +onBeforeMount(async () => { + if (!props.baseUrl) arrayData.store.filter.where = { id: route.params.id }; + await arrayData.fetch({ append: false }); +}); </script> <template> <QDrawer diff --git a/src/pages/Customer/Card/CustomerCard.vue b/src/pages/Customer/Card/CustomerCard.vue index 98842a0c7..b8f4089fa 100644 --- a/src/pages/Customer/Card/CustomerCard.vue +++ b/src/pages/Customer/Card/CustomerCard.vue @@ -5,12 +5,12 @@ import CustomerFilter from '../CustomerFilter.vue'; </script> <template> <VnCard - data-key="Client" + data-key="Customer" base-url="Clients" :descriptor="CustomerDescriptor" :filter-panel="CustomerFilter" search-data-key="CustomerList" - search-url="Clients/filter" + search-url="Clients/extendedListFilter" searchbar-label="Search customer" searchbar-info="You can search by customer id or name" /> diff --git a/src/pages/Customer/CustomerList.vue b/src/pages/Customer/CustomerList.vue index 7eb3cefd0..ccd53e8b2 100644 --- a/src/pages/Customer/CustomerList.vue +++ b/src/pages/Customer/CustomerList.vue @@ -4,6 +4,7 @@ import { useI18n } from 'vue-i18n'; import { useRouter } from 'vue-router'; import VnTable from 'components/VnTable/VnTable.vue'; import VnLocation from 'src/components/common/VnLocation.vue'; +import VnSearchbar from 'components/ui/VnSearchbar.vue'; import CustomerSummary from './Card/CustomerSummary.vue'; import { useSummaryDialog } from 'src/composables/useSummaryDialog'; @@ -382,9 +383,14 @@ function handleLocation(data, location) { </script> <template> + <VnSearchbar + :info="t('You can search by customer id or name')" + :label="t('Search customer')" + data-key="Customer" + /> <VnTable ref="tableRef" - data-key="CustomerExtendedList" + data-key="Customer" url="Clients/extendedListFilter" :create="{ urlCreate: 'Clients/createWithUser',