verdnatura/salix-front
verdnatura
/
salix-front
1
2
Fork 1
Code Issues Pull Requests 63 Releases Wiki Activity

fix: CustomerNotifications paginate

This commit is contained in:
Javier Segarra 2024-05-09 10:15:24 +02:00
parent 2fc3868a25
commit b5951a5cef
1 changed files with 48 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
src/pages/Customer/Notifications/CustomerNotifications.vue
View File

@ -2,16 +2,15 @@
import { ref, computed } from 'vue'; import { ref, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { QBtn } from 'quasar'; import { QBtn } from 'quasar';
import FetchData from 'components/FetchData.vue';
import CustomerNotificationsFilter from './CustomerNotificationsFilter.vue'; import CustomerNotificationsFilter from './CustomerNotificationsFilter.vue';
import CustomerDescriptorProxy from '../Card/CustomerDescriptorProxy.vue'; import CustomerDescriptorProxy from '../Card/CustomerDescriptorProxy.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue'; import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import CustomerNotificationsCampaignConsumption from './CustomerNotificationsCampaignConsumption.vue'; import CustomerNotificationsCampaignConsumption from './CustomerNotificationsCampaignConsumption.vue';
const stateStore = useStateStore(); const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
const rows = ref([]);
const selected = ref([]); const selected = ref([]);
const selectedCustomerId = ref(0); const selectedCustomerId = ref(0);
@ -75,6 +74,7 @@ const columns = computed(() => [
name: 'email', name: 'email',
}, },
]); ]);
const refreshKey = ref(0);
const selectCustomerId = (id) => { const selectCustomerId = (id) => {
selectedCustomerId.value = id; selectedCustomerId.value = id;
@ -99,12 +99,6 @@ const selectCustomerId = (id) => {
</div> </div>
</Teleport> </Teleport>
</template> </template>
<FetchData
:filter="filter"
@on-fetch="(data) => (rows = data)"
auto-load
url="Clients"
/>
<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">
@ -121,30 +115,54 @@ const selectCustomerId = (id) => {
</template> </template>
</VnSubToolbar> </VnSubToolbar>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QTable <VnPaginate
:columns="columns" :key="refreshKey"
:rows="rows" data-key="CustomerNotifications"
class="full-width q-mt-md" url="Clients"
row-key="id" auto-load
selection="multiple"
v-model:selected="selected"
> >
<template #body-cell="props"> <template #body="{ rows }">
<QTd :props="props"> <div class="q-pa-md">
<QTr :props="props" class="cursor-pointer"> <QTable
<component :columns="columns"
:is="tableColumnComponents[props.col.name].component" :rows="rows"
class="col-content" class="full-width q-mt-md"
v-bind="tableColumnComponents[props.col.name].props(props)" row-key="id"
@click="tableColumnComponents[props.col.name].event(props)" selection="multiple"
> v-model:selected="selected"
{{ props.value }} >
<CustomerDescriptorProxy :id="selectedCustomerId" /> <template #body-cell="props">
</component> <QTd :props="props">
</QTr> <QTr :props="props" class="cursor-pointer">
</QTd> <component
:is="
tableColumnComponents[props.col.name]
.component
"
class="col-content"
v-bind="
tableColumnComponents[props.col.name].props(
props
)
"
@click="
tableColumnComponents[props.col.name].event(
props
)
"
>
{{ props.value }}
<CustomerDescriptorProxy
:id="selectedCustomerId"
/>
</component>
</QTr>
</QTd>
</template>
</QTable>
</div>
</template> </template>
</QTable> </VnPaginate>
</QPage> </QPage>
</template> </template>