fix: Update from-to when cmpaign changes

src/pages/Customer/Notifications/CustomerNotificationsCampaignConsumption.vue

@@ -5,6 +5,7 @@ import axios from 'axios';
 import useNotify from 'src/composables/useNotify';
 import { useValidator } from 'src/composables/useValidator';
 import VnRow from 'components/ui/VnRow.vue';
+import VnSelectFilter from 'components/common/VnSelectFilter.vue';
 import VnInputDate from 'components/common/VnInputDate.vue';
 import FetchData from 'src/components/FetchData.vue';
 import { watch } from 'vue';
@@ -28,18 +29,25 @@ const { notify } = useNotify();
 const { t } = useI18n();
 const validationsStore = useValidator();
 const campaignParams = ref(null);
+const campaignsOptions = ref(null);
 const moreFields = ref([]);
 const popupProxyRef = ref(null);
 const upcomingOptions = ref(null);
-
-watch(selectedRows, () => {
-    const from = new Date(upcomingOptions.value.dated);
-    from.setDate(from.getDate() - upcomingOptions.value.scopeDays);
-    campaignParams.value = {
-        code: upcomingOptions.value.code,
-        from: from,
-        to: upcomingOptions.value.dated,
+const campaignChange = ({ name }) => {
+    const campaign = campaignsOptions.value.find((c) => c.code === name);
+    handleDates(campaign);
 };
+const handleDates = (campaign) => {
+    const from = new Date(campaign.dated);
+    from.setDate(from.getDate() - campaign.scopeDays);
+    campaignParams.value = {
+        code: campaign.code,
+        from: from,
+        to: campaign.dated,
+    };
+};
+watch(selectedRows, () => {
+    handleDates(upcomingOptions.value);
 });
 const onSubmit = async () => {
     try {
@@ -90,14 +98,15 @@ onMounted(async () => {
     <QBtn color="primary" icon="show_chart" :disable="!selectedRows">
         <QPopupProxy ref="popupProxyRef">
             <QCard class="column q-pa-md">
-                {{ campaignParams }}
                 <span class="text-body1 q-mb-sm">{{ t('Campaign consumption') }}</span>
                 <VnRow class="row q-gutter-md q-mb-md">
-                    <QSelect
+                    <VnSelectFilter
                         :options="moreFields"
+                        option-value="code"
+                        option-label="label"
                         v-model="campaignParams.code"
                         :label="t('Campaign')"
-                        option-label="label"
+                        @update:model-value="campaignChange"
                     />
                 </VnRow>
                 <VnRow class="row q-gutter-md q-mb-md">