From 2fb794727874ac05a9e4428306e3a8fb410eefb4 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Fri, 25 Apr 2025 09:43:43 +0200
Subject: [PATCH 1/7] feat: add error handling and append slot to VnMultiCheck
 component

---
 src/components/common/VnCheckbox.vue   |  1 +
 src/components/common/VnMultiCheck.vue | 90 +++++++++++++++++---------
 2 files changed, 62 insertions(+), 29 deletions(-)

diff --git a/src/components/common/VnCheckbox.vue b/src/components/common/VnCheckbox.vue
index daaf891dc..c2c93d7e9 100644
--- a/src/components/common/VnCheckbox.vue
+++ b/src/components/common/VnCheckbox.vue
@@ -43,5 +43,6 @@ const checkboxModel = computed({
                 {{ info }}
             </QTooltip>
         </QIcon>
+        <slot name="append"></slot>
     </div>
 </template>
diff --git a/src/components/common/VnMultiCheck.vue b/src/components/common/VnMultiCheck.vue
index 19b93ffa9..fe8c52603 100644
--- a/src/components/common/VnMultiCheck.vue
+++ b/src/components/common/VnMultiCheck.vue
@@ -15,7 +15,6 @@ const props = defineProps({
     },
     url: {
         type: String,
-        default: null,
         required: true,
     },
     searchUrl: {
@@ -24,6 +23,8 @@ const props = defineProps({
     },
 });
 const value = ref(false);
+const menuRef = ref(null);
+const errorMessage = ref(null);
 const rows = ref(0);
 const onClick = () => {
     if (value.value) {
@@ -37,7 +38,11 @@ const onClick = () => {
             .then(({ data }) => {
                 rows.value = data;
             })
-            .catch(console.error);
+            .catch(({ response }) => {
+                if (response.data.error.name === 'UserError') {
+                    errorMessage.value = t('tooManyResults');
+                } else errorMessage.value = response.data.error.message;
+            });
     }
 };
 defineEmits(['update:selected', 'select:all']);
@@ -45,36 +50,63 @@ defineEmits(['update:selected', 'select:all']);
 
 <template>
     <div style="display: flex">
-        <VnCheckbox v-model="value" @click="$emit('update:selected', value)" />
-        <QBtn
-            v-if="value && $props.expand"
-            flat
-            dense
-            icon="expand_more"
-            @click="onClick"
-        >
-            <QMenu anchor="bottom right" self="top right">
-                <QList>
-                    <QItem v-ripple clickable @click="$emit('select:all', toRaw(rows))">
-                        {{ t('Select all', { rows: rows.length }) }}
-                    </QItem>
-                    <slot name="more-options"></slot>
-                </QList>
-            </QMenu>
-        </QBtn>
+        <VnCheckbox v-model="value" @click="$emit('update:selected', value)">
+            <template #append>
+                <QIcon
+                    data-cy="btnMultiCheck"
+                    v-if="value && $props.expand"
+                    name="expand_more"
+                    @click="onClick"
+                    class="cursor-pointer"
+                >
+                    <QMenu
+                        fit
+                        anchor="bottom start"
+                        self="top left"
+                        ref="menuRef"
+                        data-cy="menuMultiCheck"
+                    >
+                        <QList separator>
+                            <QItem
+                                data-cy="selectAll"
+                                v-ripple
+                                clickable
+                                @click="
+                                    $refs.menuRef.hide();
+                                    $emit('select:all', toRaw(rows));
+                                "
+                            >
+                                <QItemSection>
+                                    <QItemLabel>
+                                        <span v-text="t('Select all')" />
+                                    </QItemLabel>
+                                    <QItemLabel overline caption>
+                                        <span
+                                            v-if="errorMessage"
+                                            class="text-negative"
+                                            v-text="errorMessage"
+                                        />
+                                        <span
+                                            v-else
+                                            v-text="t('records', { rows: rows.length })"
+                                        />
+                                    </QItemLabel>
+                                </QItemSection>
+                            </QItem>
+                            <slot name="more-options"></slot>
+                        </QList>
+                    </QMenu>
+                </QIcon>
+            </template>
+        </VnCheckbox>
     </div>
 </template>
 <i18n lang="yml">
 en:
-    Select all: 'Select all ({rows})'
-fr:
-    Select all: 'Sélectionner tout ({rows})'
+    tooManyResults: Too many results. Please narrow down your search.
+    records: '{rows} records'
 es:
-    Select all: 'Seleccionar todo ({rows})'
-de:
-    Select all: 'Alle auswählen ({rows})'
-it:
-    Select all: 'Seleziona tutto ({rows})'
-pt:
-    Select all: 'Selecionar tudo ({rows})'
+    Select all: Seleccionar todo
+    tooManyResults: Demasiados registros. Restringe la búsqueda.
+    records: '{rows} registros'
 </i18n>

From 28c59f16b9d53befad9dae183ee9dab0785e37a7 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Fri, 25 Apr 2025 09:43:56 +0200
Subject: [PATCH 2/7] fix: remove unused promise prop from
 CustomerNotificationsCampaignConsumption

---
 src/pages/Customer/Notifications/CustomerNotifications.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/Customer/Notifications/CustomerNotifications.vue b/src/pages/Customer/Notifications/CustomerNotifications.vue
index 02792182c..84babe24d 100644
--- a/src/pages/Customer/Notifications/CustomerNotifications.vue
+++ b/src/pages/Customer/Notifications/CustomerNotifications.vue
@@ -89,7 +89,6 @@ const columns = computed(() => [
             <CustomerNotificationsCampaignConsumption
                 :selected-rows="selected.length > 0"
                 :clients="selected"
-                :promise="refreshData"
             />
         </template>
     </VnSubToolbar>

From 82a1d451ef9e450865b6a88b5494e8caf2cdb6c3 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Fri, 25 Apr 2025 10:12:17 +0200
Subject: [PATCH 3/7] fix: update campaign consumption message format to
 include record count

---
 .../CustomerNotificationsCampaignConsumption.vue              | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/Customer/Notifications/CustomerNotificationsCampaignConsumption.vue b/src/pages/Customer/Notifications/CustomerNotificationsCampaignConsumption.vue
index 141a02bfc..36157082b 100644
--- a/src/pages/Customer/Notifications/CustomerNotificationsCampaignConsumption.vue
+++ b/src/pages/Customer/Notifications/CustomerNotificationsCampaignConsumption.vue
@@ -142,13 +142,13 @@ onMounted(async () => {
             valentinesDay: Valentine's Day
             mothersDay: Mother's Day
             allSaints: All Saints' Day
-        Campaign consumption: Campaign consumption ({rows})
+        Campaign consumption: Campaign consumption - {rows} records
     es:
         params:
             valentinesDay: Día de San Valentín
             mothersDay: Día de la Madre
             allSaints: Día de Todos los Santos
-        Campaign consumption: Consumo campaña ({rows})
+        Campaign consumption: Consumo campaña - {rows} registros
         Campaign: Campaña
         From: Desde
         To: Hasta

From 91a8b9dcffc3cd458a5eee09b868c2f513262e18 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Mon, 28 Apr 2025 11:54:29 +0200
Subject: [PATCH 4/7] refactor: remove unused slot from VnCheckbox component

---
 src/components/common/VnCheckbox.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/common/VnCheckbox.vue b/src/components/common/VnCheckbox.vue
index c2c93d7e9..daaf891dc 100644
--- a/src/components/common/VnCheckbox.vue
+++ b/src/components/common/VnCheckbox.vue
@@ -43,6 +43,5 @@ const checkboxModel = computed({
                 {{ info }}
             </QTooltip>
         </QIcon>
-        <slot name="append"></slot>
     </div>
 </template>

From 34aa1282466729655cd6d67028a9463ab704a3a8 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Mon, 28 Apr 2025 11:54:47 +0200
Subject: [PATCH 5/7] refactor: replace VnMultiCheck with VnCheckboxMenu
 component

---
 src/components/VnTable/VnTable.vue       |   6 +-
 src/components/common/VnCheckboxMenu.vue | 113 +++++++++++++++++++++++
 src/components/common/VnMultiCheck.vue   | 112 ----------------------
 3 files changed, 116 insertions(+), 115 deletions(-)
 create mode 100644 src/components/common/VnCheckboxMenu.vue
 delete mode 100644 src/components/common/VnMultiCheck.vue

diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue
index 8915500fc..a177e6e4b 100644
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@@ -34,7 +34,7 @@ import VnTableFilter from './VnTableFilter.vue';
 import { getColAlign } from 'src/composables/getColAlign';
 import RightMenu from '../common/RightMenu.vue';
 import VnScroll from '../common/VnScroll.vue';
-import VnMultiCheck from '../common/VnMultiCheck.vue';
+import VnCheckboxMenu from '../common/VnCheckboxMenu.vue';
 
 const arrayData = useArrayData(useAttrs()['data-key']);
 const $props = defineProps({
@@ -724,14 +724,14 @@ const handleSelectedAll = (data) => {
                 :data-cy
             >
                 <template #header-selection>
-                    <VnMultiCheck
+                    <VnCheckboxMenu
                         :searchUrl="searchUrl"
                         :expand="$props.multiCheck.expand"
                         v-model="selectAll"
                         :url="$attrs['url']"
                         @update:selected="handleMultiCheck"
                         @select:all="handleSelectedAll"
-                    ></VnMultiCheck>
+                    />
                 </template>
 
                 <template #top-left v-if="!$props.withoutHeader">
diff --git a/src/components/common/VnCheckboxMenu.vue b/src/components/common/VnCheckboxMenu.vue
new file mode 100644
index 000000000..bfb5b4441
--- /dev/null
+++ b/src/components/common/VnCheckboxMenu.vue
@@ -0,0 +1,113 @@
+<script setup>
+import { ref } from 'vue';
+import VnCheckbox from './VnCheckbox.vue';
+import axios from 'axios';
+import { toRaw } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
+const route = useRoute();
+const { t } = useI18n();
+const model = defineModel({ type: [Boolean] });
+const props = defineProps({
+    expand: {
+        type: Boolean,
+        default: false,
+    },
+    url: {
+        type: String,
+        required: true,
+    },
+    searchUrl: {
+        type: [String, Boolean],
+        default: 'table',
+    },
+});
+const value = ref(false);
+const menuRef = ref(null);
+const errorMessage = ref(null);
+const rows = ref(0);
+const onClick = async () => {
+    if (value.value) {
+        const { filter } = JSON.parse(route.query[props.searchUrl]);
+        filter.limit = 0;
+        const params = {
+            params: { filter: JSON.stringify(filter) },
+        };
+        try {
+            const { data } = await axios.get(props.url, params);
+            rows.value = data;
+        } catch (error) {
+            const response = error.response;
+            if (response.data.error.name === 'UserError') {
+                errorMessage.value = t('tooManyResults');
+            } else {
+                errorMessage.value = response.data.error.message;
+            }
+        }
+    }
+};
+defineEmits(['update:selected', 'select:all']);
+</script>
+
+<template>
+    <div class="flex items-center no-wrap" style="display: flex">
+        <VnCheckbox v-model="value" @click="$emit('update:selected', value)" />
+        <QIcon
+            style="margin-left: -10px"
+            data-cy="btnMultiCheck"
+            v-if="value && $props.expand"
+            name="expand_more"
+            @click="onClick"
+            class="cursor-pointer"
+            color="primary"
+            size="xs"
+        >
+            <QMenu
+                fit
+                anchor="bottom start"
+                self="top left"
+                ref="menuRef"
+                data-cy="menuMultiCheck"
+            >
+                <QList separator>
+                    <QItem
+                        data-cy="selectAll"
+                        v-ripple
+                        clickable
+                        @click="
+                            $refs.menuRef.hide();
+                            $emit('select:all', toRaw(rows));
+                        "
+                    >
+                        <QItemSection>
+                            <QItemLabel>
+                                <span v-text="t('Select all')" />
+                            </QItemLabel>
+                            <QItemLabel overline caption>
+                                <span
+                                    v-if="errorMessage"
+                                    class="text-negative"
+                                    v-text="errorMessage"
+                                />
+                                <span
+                                    v-else
+                                    v-text="t('records', { rows: rows.length })"
+                                />
+                            </QItemLabel>
+                        </QItemSection>
+                    </QItem>
+                    <slot name="more-options"></slot>
+                </QList>
+            </QMenu>
+        </QIcon>
+    </div>
+</template>
+<i18n lang="yml">
+en:
+    tooManyResults: Too many results. Please narrow down your search.
+    records: '{rows} records'
+es:
+    Select all: Seleccionar todo
+    tooManyResults: Demasiados registros. Restringe la búsqueda.
+    records: '{rows} registros'
+</i18n>
diff --git a/src/components/common/VnMultiCheck.vue b/src/components/common/VnMultiCheck.vue
deleted file mode 100644
index fe8c52603..000000000
--- a/src/components/common/VnMultiCheck.vue
+++ /dev/null
@@ -1,112 +0,0 @@
-<script setup>
-import { ref } from 'vue';
-import VnCheckbox from './VnCheckbox.vue';
-import axios from 'axios';
-import { toRaw } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRoute } from 'vue-router';
-const route = useRoute();
-const { t } = useI18n();
-const model = defineModel({ type: [Boolean] });
-const props = defineProps({
-    expand: {
-        type: Boolean,
-        default: false,
-    },
-    url: {
-        type: String,
-        required: true,
-    },
-    searchUrl: {
-        type: [String, Boolean],
-        default: 'table',
-    },
-});
-const value = ref(false);
-const menuRef = ref(null);
-const errorMessage = ref(null);
-const rows = ref(0);
-const onClick = () => {
-    if (value.value) {
-        const { filter } = JSON.parse(route.query[props.searchUrl]);
-        filter.limit = 0;
-        const params = {
-            params: { filter: JSON.stringify(filter) },
-        };
-        axios
-            .get(props.url, params)
-            .then(({ data }) => {
-                rows.value = data;
-            })
-            .catch(({ response }) => {
-                if (response.data.error.name === 'UserError') {
-                    errorMessage.value = t('tooManyResults');
-                } else errorMessage.value = response.data.error.message;
-            });
-    }
-};
-defineEmits(['update:selected', 'select:all']);
-</script>
-
-<template>
-    <div style="display: flex">
-        <VnCheckbox v-model="value" @click="$emit('update:selected', value)">
-            <template #append>
-                <QIcon
-                    data-cy="btnMultiCheck"
-                    v-if="value && $props.expand"
-                    name="expand_more"
-                    @click="onClick"
-                    class="cursor-pointer"
-                >
-                    <QMenu
-                        fit
-                        anchor="bottom start"
-                        self="top left"
-                        ref="menuRef"
-                        data-cy="menuMultiCheck"
-                    >
-                        <QList separator>
-                            <QItem
-                                data-cy="selectAll"
-                                v-ripple
-                                clickable
-                                @click="
-                                    $refs.menuRef.hide();
-                                    $emit('select:all', toRaw(rows));
-                                "
-                            >
-                                <QItemSection>
-                                    <QItemLabel>
-                                        <span v-text="t('Select all')" />
-                                    </QItemLabel>
-                                    <QItemLabel overline caption>
-                                        <span
-                                            v-if="errorMessage"
-                                            class="text-negative"
-                                            v-text="errorMessage"
-                                        />
-                                        <span
-                                            v-else
-                                            v-text="t('records', { rows: rows.length })"
-                                        />
-                                    </QItemLabel>
-                                </QItemSection>
-                            </QItem>
-                            <slot name="more-options"></slot>
-                        </QList>
-                    </QMenu>
-                </QIcon>
-            </template>
-        </VnCheckbox>
-    </div>
-</template>
-<i18n lang="yml">
-en:
-    tooManyResults: Too many results. Please narrow down your search.
-    records: '{rows} records'
-es:
-    Select all: Seleccionar todo
-    tooManyResults: Demasiados registros. Restringe la búsqueda.
-    records: '{rows} registros'
-</i18n>

From 3c23b6b247c8a9fed3b17ce4e9cf4f7fc2be1b58 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 29 Apr 2025 09:02:50 +0200
Subject: [PATCH 6/7] refactor: rename multi-check handlers for clarity and
 improve selection logic

---
 src/components/VnTable/VnTable.vue | 19 ++++++-------------
 1 file changed, 6 insertions(+), 13 deletions(-)

diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue
index a177e6e4b..5cd783de9 100644
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@@ -644,21 +644,15 @@ const rowCtrlClickFunction = computed(() => {
         };
     return () => {};
 });
-const handleMultiCheck = (value) => {
-    if (value) {
+const handleHeaderSelection = (evt, data) => {
+    if (evt === 'selected' && data) {
         selected.value = tableRef.value.rows;
-    } else {
-        selected.value = [];
-    }
-    emit('update:selected', selected.value);
-};
-
-const handleSelectedAll = (data) => {
-    if (data) {
+    } else if (evt === 'selectAll') {
         selected.value = data;
     } else {
         selected.value = [];
     }
+
     emit('update:selected', selected.value);
 };
 </script>
@@ -718,7 +712,6 @@ const handleSelectedAll = (data) => {
                 :virtual-scroll="isTableMode"
                 @virtual-scroll="onVirtualScroll"
                 @row-click="(event, row) => handleRowClick(event, row)"
-                @update:selected="emit('update:selected', $event)"
                 @selection="(details) => handleSelection(details, rows)"
                 :hide-selected-banner="true"
                 :data-cy
@@ -729,8 +722,8 @@ const handleSelectedAll = (data) => {
                         :expand="$props.multiCheck.expand"
                         v-model="selectAll"
                         :url="$attrs['url']"
-                        @update:selected="handleMultiCheck"
-                        @select:all="handleSelectedAll"
+                        @update:selected="handleHeaderSelection('selected', $event)"
+                        @select:all="handleHeaderSelection('selectAll', $event)"
                     />
                 </template>
 

From 7e815080655754a8b8b6e057191551d849168560 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 29 Apr 2025 15:30:06 +0200
Subject: [PATCH 7/7] feat: emit update:selected event on header selection

---
 src/components/VnTable/VnTable.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue
index 5cd783de9..3c431fa14 100644
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@@ -712,6 +712,7 @@ const handleHeaderSelection = (evt, data) => {
                 :virtual-scroll="isTableMode"
                 @virtual-scroll="onVirtualScroll"
                 @row-click="(event, row) => handleRowClick(event, row)"
+                @update:selected="emit('update:selected', $event)"
                 @selection="(details) => handleSelection(details, rows)"
                 :hide-selected-banner="true"
                 :data-cy