0
0
Fork 0

refactor: refs #7274 changed CustomerNotificationsCampaignConsumption template and logic

This commit is contained in:
Jon Elias 2024-05-03 08:40:53 +02:00
parent c2ba7bfe22
commit 3467f30b12
2 changed files with 50 additions and 77 deletions

View File

@ -1,10 +1,7 @@
<script setup>
import { ref, computed } from 'vue';
import { useQuasar } from 'quasar';
import { useI18n } from 'vue-i18n';
import { QBtn } from 'quasar';
import FetchData from 'components/FetchData.vue';
import CustomerNotificationsFilter from './CustomerNotificationsFilter.vue';
import CustomerDescriptorProxy from '../Card/CustomerDescriptorProxy.vue';
@ -13,14 +10,10 @@ import { useStateStore } from 'stores/useStateStore';
import CustomerNotificationsCampaignConsumption from './CustomerNotificationsCampaignConsumption.vue';
const stateStore = useStateStore();
const { t } = useI18n();
const rows = ref([]);
const selected = ref([]);
const selectedCustomerId = ref(0);
const quasar = useQuasar();
const dataRef = ref(null);
const tableColumnComponents = {
id: {
@ -86,19 +79,6 @@ const columns = computed(() => [
const selectCustomerId = (id) => {
selectedCustomerId.value = id;
};
const campaignConsumption = () => {
quasar.dialog({
component: CustomerNotificationsCampaignConsumption,
componentProps: {
clients: selected,
promise: refreshData,
},
});
};
const refreshData = async () => {
await dataRef.value.fetch();
};
</script>
<template>
@ -117,8 +97,8 @@ const refreshData = async () => {
</QTooltip>
</QBtn>
</div>
</Teleport></template
>
</Teleport>
</template>
<FetchData
:filter="filter"
@on-fetch="(data) => (rows = data)"
@ -133,15 +113,11 @@ const refreshData = async () => {
</QDrawer>
<VnSubToolbar class="justify-end">
<template #st-data>
<QBtn
icon="show_chart"
color="primary"
class="q-mr-sm"
:disabled="!selected.length"
@click="campaignConsumption"
>
<QTooltip>{{ t('Campaign consumption') }}</QTooltip>
</QBtn>
<CustomerNotificationsCampaignConsumption
:selected-rows="selected.length > 0"
:clients="selected"
:promise="refreshData"
/>
</template>
</VnSubToolbar>
<QPage class="column items-center q-pa-md">

View File

@ -2,7 +2,6 @@
import { ref, reactive } from 'vue';
import { useI18n } from 'vue-i18n';
import axios from 'axios';
import { useDialogPluginComponent } from 'quasar';
import useNotify from 'src/composables/useNotify';
import { useValidator } from 'src/composables/useValidator';
import VnRow from 'components/ui/VnRow.vue';
@ -19,23 +18,24 @@ const $props = defineProps({
type: Function,
required: true,
},
selectedRows: {
type: Boolean,
},
});
const { dialogRef } = useDialogPluginComponent();
const { notify } = useNotify();
const { t } = useI18n();
const validationsStore = useValidator();
const campaignParams = reactive({});
const moreFields = ref([]);
async function onSubmit() {
const onSubmit = async () => {
try {
const data = {
clients: $props.clients._value.map((item) => item.id),
from: this.campaignParams.from,
to: this.campaignParams.to,
clients: $props.clients.map((item) => item.id),
from: campaignParams.from,
to: campaignParams.to,
};
const params = JSON.stringify(data);
await axios.post('ClientConsumptionQueues', { params });
@ -43,7 +43,7 @@ async function onSubmit() {
} catch (error) {
notify(error.message, 'negative');
}
}
};
onMounted(async () => {
const { models } = validationsStore;
const properties = models.Item?.properties || {};
@ -68,44 +68,41 @@ onMounted(async () => {
:filter="{ fields: ['id', 'code', 'dated'], order: 'code ASC', limit: 30 }"
auto-load
/>
<QDialog ref="dialogRef">
<QCard class="q-pa-md q-mb-md">
<QCardSection>
<QForm @submit="onSubmit()" class="q-pa-sm">
<div>
{{ t('Campaign consumption') }}
</div>
<VnRow class="row q-gutter-md q-mb-md">
<QSelect
:options="moreFields"
v-model="campaignParams.campaign"
:label="t('Campaign')"
option-label="label"
/>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnInputDate v-model="campaignParams.from" :label="t('From')" />
<VnInputDate v-model="campaignParams.to" :label="t('To')" />
</VnRow>
<div class="q-mt-lg row justify-end">
<QBtn
:label="t('globals.cancel')"
color="primary"
flat
class="q-mr-md"
v-close-popup
/>
<QBtn
:label="t('globals.save')"
type="submit"
color="primary"
v-close-popup
/>
</div>
</QForm>
</QCardSection>
</QCard>
</QDialog>
<QBtn color="primary" icon="show_chart" :disable="!selectedRows">
<QPopupProxy ref="popupProxyRef">
<QCard class="column q-pa-md">
<span class="text-body1 q-mb-sm">{{ t('Campaign consumption') }}</span>
<VnRow class="row q-gutter-md q-mb-md">
<QSelect
:options="moreFields"
v-model="campaignParams.campaign"
:label="t('Campaign')"
option-label="label"
/>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnInputDate v-model="campaignParams.from" :label="t('From')" />
<VnInputDate v-model="campaignParams.to" :label="t('To')" />
</VnRow>
<div class="q-mt-lg row justify-end">
<QBtn
:label="t('globals.cancel')"
color="primary"
flat
class="q-mr-md"
v-close-popup
/>
<QBtn
:label="t('globals.save')"
type="submit"
color="primary"
@click="onSubmit()"
/>
</div>
</QCard>
</QPopupProxy>
<QTooltip>{{ t('Campaign consumption') }}</QTooltip>
</QBtn>
</template>
<i18n>