0
0
Fork 0

fix: CustomerDefaulter paginate

This commit is contained in:
Javier Segarra 2024-05-09 10:20:28 +02:00
parent b5951a5cef
commit dac00236bc
1 changed files with 88 additions and 65 deletions

View File

@ -6,8 +6,7 @@ import { QBtn, QCheckbox, useQuasar } from 'quasar';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { toCurrency, toDate } from 'filters/index'; import { toCurrency, toDate } from 'filters/index';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import FetchData from 'components/FetchData.vue';
import CustomerNotificationsFilter from './CustomerDefaulterFilter.vue'; import CustomerNotificationsFilter from './CustomerDefaulterFilter.vue';
import CustomerBalanceDueTotal from './CustomerBalanceDueTotal.vue'; import CustomerBalanceDueTotal from './CustomerBalanceDueTotal.vue';
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue'; import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
@ -16,6 +15,7 @@ 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();
@ -23,7 +23,6 @@ const dataRef = ref(null);
const balanceDueTotal = ref(0); const balanceDueTotal = ref(0);
const selected = ref([]); const selected = ref([]);
const rows = ref([]);
const tableColumnComponents = { const tableColumnComponents = {
client: { client: {
@ -171,7 +170,6 @@ const columns = computed(() => [
]); ]);
const setRows = (data) => { const setRows = (data) => {
rows.value = data;
balanceDueTotal.value = data.reduce((accumulator, currentValue) => { balanceDueTotal.value = data.reduce((accumulator, currentValue) => {
return accumulator + (currentValue['amount'] || 0); return accumulator + (currentValue['amount'] || 0);
}, 0); }, 0);
@ -217,13 +215,6 @@ const onFetch = (data) => {
</div> </div>
</Teleport></template </Teleport></template
> >
<FetchData
ref="dataRef"
:filter="filter"
@on-fetch="onFetch"
auto-load
url="Defaulters/filter"
/>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
@ -248,63 +239,95 @@ const onFetch = (data) => {
</VnSubToolbar> </VnSubToolbar>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QTable <VnPaginate
:columns="columns" @on-fetch="onFetch"
:rows="rows" data-key="CustomerDefaulter"
class="full-width q-mt-md" :key="refreshKey"
row-key="clientFk" :filter="filter"
selection="multiple" auto-load
v-model:selected="selected" url="Defaulters/filter"
> >
<template #header="props"> <template #body="{ rows }">
<QTr :props="props" class="bg"> <div class="q-pa-md">
<QTh> <QTable
<QCheckbox v-model="props.selected" /> :columns="columns"
</QTh> :rows="rows"
<QTh v-for="col in props.cols" :key="col.name" :props="props"> class="full-width q-mt-md"
{{ t(col.label) }} row-key="clientFk"
<QTooltip v-if="col.tooltip">{{ col.tooltip }}</QTooltip> selection="multiple"
</QTh> v-model:selected="selected"
</QTr> >
</template> <template #header="props">
<QTr :props="props" class="bg">
<QTh>
<QCheckbox v-model="props.selected" />
</QTh>
<QTh
v-for="col in props.cols"
:key="col.name"
:props="props"
>
{{ t(col.label) }}
<QTooltip v-if="col.tooltip">{{
col.tooltip
}}</QTooltip>
</QTh>
</QTr>
</template>
<template #body-cell="props"> <template #body-cell="props">
<QTd :props="props"> <QTd :props="props">
<QTr :props="props" class="cursor-pointer"> <QTr :props="props" class="cursor-pointer">
<component <component
:is="tableColumnComponents[props.col.name].component" :is="
class="col-content" tableColumnComponents[props.col.name]
v-bind="tableColumnComponents[props.col.name].props(props)" .component
@click="tableColumnComponents[props.col.name].event(props)" "
> class="col-content"
<template v-if="props.col.name !== 'isWorker'"> v-bind="
<div v-if="props.col.name === 'lastObservation'"> tableColumnComponents[props.col.name].props(
<VnInput props
type="textarea" )
v-model="props.value" "
autogrow @click="
/> tableColumnComponents[props.col.name].event(
</div> props
<div v-else>{{ props.value }}</div> )
</template> "
>
<template v-if="props.col.name !== 'isWorker'">
<div
v-if="
props.col.name === 'lastObservation'
"
>
<VnInput
type="textarea"
v-model="props.value"
autogrow
/>
</div>
<div v-else>{{ props.value }}</div>
</template>
<WorkerDescriptorProxy <WorkerDescriptorProxy
:id="props.row.salesPersonFk" :id="props.row.salesPersonFk"
v-if="props.col.name === 'salesPerson'" v-if="props.col.name === 'salesPerson'"
/> />
<WorkerDescriptorProxy <WorkerDescriptorProxy
:id="props.row.workerFk" :id="props.row.workerFk"
v-if="props.col.name === 'author'" v-if="props.col.name === 'author'"
/> />
<CustomerDescriptorProxy <CustomerDescriptorProxy
:id="props.row.clientFk" :id="props.row.clientFk"
v-if="props.col.name === 'client'" v-if="props.col.name === 'client'"
/> />
</component> </component>
</QTr> </QTr>
</QTd> </QTd>
</template> </template>
</QTable> </QTable></div></template
></VnPaginate>
</QPage> </QPage>
</template> </template>