fix: CustomerExtendedList paginate
gitea/salix-front/pipeline/pr-test This commit looks good Details

This commit is contained in:
Javier Segarra 2024-05-09 10:25:27 +02:00
parent dac00236bc
commit 437a75da4e
3 changed files with 90 additions and 72 deletions

View File

@ -15,7 +15,6 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import CustomerDefaulterAddObservation from './CustomerDefaulterAddObservation.vue'; import CustomerDefaulterAddObservation from './CustomerDefaulterAddObservation.vue';
const stateStore = useStateStore(); const stateStore = useStateStore();
const refreshKey = ref(0);
const { t } = useI18n(); const { t } = useI18n();
const quasar = useQuasar(); const quasar = useQuasar();
@ -242,7 +241,6 @@ const onFetch = (data) => {
<VnPaginate <VnPaginate
@on-fetch="onFetch" @on-fetch="onFetch"
data-key="CustomerDefaulter" data-key="CustomerDefaulter"
:key="refreshKey"
:filter="filter" :filter="filter"
auto-load auto-load
url="Defaulters/filter" url="Defaulters/filter"

View File

@ -10,7 +10,7 @@ import CustomerExtendedListActions from './CustomerExtendedListActions.vue';
import CustomerExtendedListFilter from './CustomerExtendedListFilter.vue'; import CustomerExtendedListFilter from './CustomerExtendedListFilter.vue';
import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue'; import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue'; import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { toDate } from 'src/filters'; import { toDate } from 'src/filters';
@ -37,8 +37,6 @@ onMounted(() => {
allColumnNames.value = filteredColumns.map((col) => col.name); allColumnNames.value = filteredColumns.map((col) => col.name);
}); });
const rows = computed(() => arrayData.value.store.data);
const selectedCustomerId = ref(0); const selectedCustomerId = ref(0);
const selectedSalesPersonId = ref(0); const selectedSalesPersonId = ref(0);
const allColumnNames = ref([]); const allColumnNames = ref([]);
@ -536,6 +534,13 @@ const selectSalesPersonId = (id) => (selectedSalesPersonId.value = id);
</VnSubToolbar> </VnSubToolbar>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<VnPaginate
data-key="CustomerExtendedList"
url="Clients/extendedListFilter"
auto-load
>
<template #body="{ rows }">
<div class="q-pa-md">
<QTable <QTable
:columns="columns" :columns="columns"
:rows="rows" :rows="rows"
@ -554,8 +559,12 @@ const selectSalesPersonId = (id) => (selectedSalesPersonId.value = id);
<component <component
:is="tableColumnComponents[props.col.name].component" :is="tableColumnComponents[props.col.name].component"
class="col-content" class="col-content"
v-bind="tableColumnComponents[props.col.name].props(props)" v-bind="
@click="tableColumnComponents[props.col.name].event(props)" tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
> >
</component> </component>
</QTd> </QTd>
@ -565,8 +574,12 @@ const selectSalesPersonId = (id) => (selectedSalesPersonId.value = id);
<component <component
:is="tableColumnComponents[props.col.name].component" :is="tableColumnComponents[props.col.name].component"
class="col-content" class="col-content"
v-bind="tableColumnComponents[props.col.name].props(props)" v-bind="
@click="tableColumnComponents[props.col.name].event(props)" tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
> >
<CustomerDescriptorProxy :id="props.row.id" /> <CustomerDescriptorProxy :id="props.row.id" />
{{ props.row.id }} {{ props.row.id }}
@ -579,10 +592,16 @@ const selectSalesPersonId = (id) => (selectedSalesPersonId.value = id);
v-if="props.row.salesPerson" v-if="props.row.salesPerson"
class="col-content" class="col-content"
:is="tableColumnComponents[props.col.name].component" :is="tableColumnComponents[props.col.name].component"
v-bind="tableColumnComponents[props.col.name].props(props)" v-bind="
@click="tableColumnComponents[props.col.name].event(props)" tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
> >
<WorkerDescriptorProxy :id="props.row.salesPersonFk" /> <WorkerDescriptorProxy
:id="props.row.salesPersonFk"
/>
{{ props.row.salesPerson }} {{ props.row.salesPerson }}
</component> </component>
<span class="col-content" v-else>-</span> <span class="col-content" v-else>-</span>
@ -593,12 +612,19 @@ const selectSalesPersonId = (id) => (selectedSalesPersonId.value = id);
<component <component
:is="tableColumnComponents[props.col.name].component" :is="tableColumnComponents[props.col.name].component"
class="col-content" class="col-content"
v-bind="tableColumnComponents[props.col.name].props(props)" v-bind="
@click="tableColumnComponents[props.col.name].event(props)" tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
/> />
</QTd> </QTd>
</template> </template>
</QTable> </QTable>
</div>
</template>
</VnPaginate>
</QPage> </QPage>
</template> </template>

View File

@ -74,7 +74,6 @@ const columns = computed(() => [
name: 'email', name: 'email',
}, },
]); ]);
const refreshKey = ref(0);
const selectCustomerId = (id) => { const selectCustomerId = (id) => {
selectedCustomerId.value = id; selectedCustomerId.value = id;
@ -115,12 +114,7 @@ const selectCustomerId = (id) => {
</template> </template>
</VnSubToolbar> </VnSubToolbar>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<VnPaginate <VnPaginate data-key="CustomerNotifications" url="Clients" auto-load>
:key="refreshKey"
data-key="CustomerNotifications"
url="Clients"
auto-load
>
<template #body="{ rows }"> <template #body="{ rows }">
<div class="q-pa-md"> <div class="q-pa-md">
<QTable <QTable