From 126e1323bf7f074047c781f2533a135327df2ec3 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Thu, 14 Dec 2023 12:06:25 +0100
Subject: [PATCH 1/7] refs #6334 refresh

---
 src/pages/Claim/Card/ClaimLines.vue | 116 ++++++----------------------
 1 file changed, 25 insertions(+), 91 deletions(-)

diff --git a/src/pages/Claim/Card/ClaimLines.vue b/src/pages/Claim/Card/ClaimLines.vue
index 9d2a12804..4eaef2958 100644
--- a/src/pages/Claim/Card/ClaimLines.vue
+++ b/src/pages/Claim/Card/ClaimLines.vue
@@ -6,9 +6,8 @@ import { useQuasar } from 'quasar';
 import { useRoute } from 'vue-router';
 import { useArrayData } from 'composables/useArrayData';
 import { useStateStore } from 'stores/useStateStore';
-import VnPaginate from 'components/ui/VnPaginate.vue';
+import CrudModel from 'components/CrudModel.vue';
 import FetchData from 'components/FetchData.vue';
-import VnConfirm from 'components/ui/VnConfirm.vue';
 
 import { toDate, toCurrency, toPercentage } from 'filters/index';
 import VnDiscount from 'components/common/vnDiscount.vue';
@@ -17,6 +16,7 @@ import ClaimLinesImport from './ClaimLinesImport.vue';
 const quasar = useQuasar();
 const route = useRoute();
 const { t } = useI18n();
+
 const stateStore = useStateStore();
 const arrayData = useArrayData('ClaimLines');
 const store = arrayData.store;
@@ -36,16 +36,17 @@ const linesFilter = {
     },
 };
 
+const claimLinesForm = ref();
 const claim = ref(null);
 async function onFetchClaim(data) {
     claim.value = data;
-
     fetchMana();
 }
 
-const amount = ref(0);
-const amountClaimed = ref(0);
+const amount = ref();
+const amountClaimed = ref();
 async function onFetch(rows) {
+    if (!rows || !rows.length) return;
     amount.value = rows.reduce(
         (acumulator, { sale }) => acumulator + sale.price * sale.quantity,
         0
@@ -141,60 +142,23 @@ function onUpdateDiscount(response) {
     });
 }
 
-async function confirmRemove() {
-    const rows = selected.value;
-    const count = rows.length;
-
-    if (count === 0) {
-        return quasar.notify({
-            message: 'You must select at least one row',
-            type: 'warning',
-        });
-    }
-
-    quasar
-        .dialog({
-            component: VnConfirm,
-            componentProps: {
-                title: t('Delete claimed sales'),
-                message: t('You are about to remove {count} rows', count, { count }),
-                data: { rows },
-                promise: remove,
-            },
-        })
-        .onOk(() => {
-            for (const row of rows) {
-                const orgData = store.data;
-                const index = orgData.findIndex((item) => item.id === row.id);
-                store.data.splice(index, 1);
-                selected.value = [];
-            }
-        });
-}
-
-async function remove({ rows }) {
-    if (!rows.length) return;
-    const body = { deletes: rows.map((row) => row.id) };
-    await axios.post(`ClaimBeginnings/crud`, body);
-    quasar.notify({
-        type: 'positive',
-        message: t('globals.rowRemoved'),
-    });
-}
-
 function showImportDialog() {
     quasar
         .dialog({
             component: ClaimLinesImport,
+            componentProps: {
+                ticketId: claim.value.ticketFk,
+            },
         })
-        .onOk(() => arrayData.refresh());
+        .onOk(() => claimLinesForm.value.reload());
+}
+function isSubToolbarShown() {
+    return amount.value && amountClaimed;
 }
 </script>
 <template>
-    <QPageSticky position="top" :offset="[0, 0]" expand>
-        <QToolbar class="bg-dark text-white">
-            <QToolbarTitle> {{ t('Claimed lines') }} </QToolbarTitle>
-            <QSpace />
+    <Teleport to="#st-data" v-if="isSubToolbarShown()">
+        <QToolbar>
             <div class="row q-gutter-md">
                 <div>
                     {{ t('Amount') }}
@@ -211,7 +175,7 @@ function showImportDialog() {
                 </div>
             </div>
         </QToolbar>
-    </QPageSticky>
+    </Teleport>
 
     <FetchData
         :url="`Claims/${route.params.id}`"
@@ -221,11 +185,16 @@ function showImportDialog() {
     />
     <div class="column items-center">
         <div class="list">
-            <VnPaginate
+            <CrudModel
                 data-key="ClaimLines"
+                ref="claimLinesForm"
                 :url="`Claims/${route.params.id}/lines`"
+                save-url="ClaimBeginnings/crud"
                 :filter="linesFilter"
                 @on-fetch="onFetch"
+                v-model:selected="selected"
+                :default-save="false"
+                :default-reset="false"
                 auto-load
             >
                 <template #body="{ rows }">
@@ -361,46 +330,12 @@ function showImportDialog() {
                         </template>
                     </QTable>
                 </template>
-            </VnPaginate>
+            </CrudModel>
         </div>
     </div>
 
-    <Teleport
-        v-if="stateStore.isHeaderMounted() && !$q.screen.lt.sm"
-        to="#actions-prepend"
-    >
-        <div class="row q-gutter-x-sm">
-            <QBtn
-                v-if="selected.length > 0"
-                @click="confirmRemove"
-                icon="delete"
-                color="primary"
-                flat
-                dense
-                rounded
-            >
-                <QTooltip bottom> {{ t('globals.remove') }} </QTooltip>
-            </QBtn>
-            <QBtn @click="showImportDialog" icon="add" color="primary" flat dense rounded>
-                <QTooltip bottom> {{ t('globals.add') }} </QTooltip>
-            </QBtn>
-            <QSeparator vertical />
-        </div>
-    </Teleport>
-    <!-- v-if="quasar.platform.is.mobile" -->
-    <QPageSticky v-if="$q.screen.lt.sm" position="bottom" :offset="[0, 0]" expand>
-        <QToolbar class="bg-primary text-white q-pa-none">
-            <QTabs class="full-width" align="justify" inline-label narrow-indicator>
-                <QTab @click="showImportDialog" icon="add" :label="t('globals.add')" />
-                <QSeparator vertical inset />
-                <QTab
-                    @click="confirmRemove"
-                    icon="delete"
-                    :label="t('globals.remove')"
-                    :disable="selected.length === 0"
-                />
-            </QTabs>
-        </QToolbar>
+    <QPageSticky position="bottom-right" :offset="[25, 25]">
+        <QBtn fab color="primary" icon="add" @click="showImportDialog()" />
     </QPageSticky>
 </template>
 
@@ -421,7 +356,6 @@ en:
         You are about to remove <strong>{count}</strong> row |
         You are about to remove  <strong>{count}</strong> rows'
 es:
-    Claimed lines: Líneas reclamadas
     Delivered: Entregado
     Quantity: Cantidad
     Claimed: Reclamada

From 3acc4b0d58d73c1e421a4f648d1b3d946d3f504e Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Wed, 3 Jan 2024 09:59:27 +0100
Subject: [PATCH 2/7] vn qtoolbar

---
 src/pages/Claim/Card/ClaimCard.vue       | 14 +++++++++++++-
 src/pages/Claim/Card/ClaimLines.vue      |  4 +++-
 src/pages/Customer/Card/CustomerCard.vue |  7 +++++++
 src/stores/useStateStore.js              | 11 +++++++----
 4 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/src/pages/Claim/Card/ClaimCard.vue b/src/pages/Claim/Card/ClaimCard.vue
index a8c832967..41e4a46cb 100644
--- a/src/pages/Claim/Card/ClaimCard.vue
+++ b/src/pages/Claim/Card/ClaimCard.vue
@@ -8,7 +8,7 @@ import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 import ClaimDescriptor from './ClaimDescriptor.vue';
 
-import { onMounted } from 'vue';
+import { onMounted, onUnmounted } from 'vue';
 const stateStore = useStateStore();
 const { t } = useI18n();
 const route = useRoute();
@@ -22,6 +22,18 @@ const $props = defineProps({
 const entityId = computed(() => {
     return $props.id || route.params.id;
 });
+
+onMounted(() => {
+    console.log('MOUNTED', stateStore.isSubToolbarShown());
+    stateStore.toggleSubToolbar();
+    console.log('MOUNTED', stateStore.isSubToolbarShown());
+});
+
+onUnmounted(() => {
+    console.log('MOUNTED', stateStore.isSubToolbarShown());
+    stateStore.toggleSubToolbar();
+    console.log('MOUNTED', stateStore.isSubToolbarShown());
+});
 </script>
 <template>
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
diff --git a/src/pages/Claim/Card/ClaimLines.vue b/src/pages/Claim/Card/ClaimLines.vue
index 4eaef2958..d1022b731 100644
--- a/src/pages/Claim/Card/ClaimLines.vue
+++ b/src/pages/Claim/Card/ClaimLines.vue
@@ -18,6 +18,7 @@ const route = useRoute();
 const { t } = useI18n();
 
 const stateStore = useStateStore();
+const subToolbarLoaded = computed(() => stateStore.isSubToolbarShown());
 const arrayData = useArrayData('ClaimLines');
 const store = arrayData.store;
 
@@ -157,7 +158,8 @@ function isSubToolbarShown() {
 }
 </script>
 <template>
-    <Teleport to="#st-data" v-if="isSubToolbarShown()">
+    {{ subToolbarLoaded }}
+    <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
         <QToolbar>
             <div class="row q-gutter-md">
                 <div>
diff --git a/src/pages/Customer/Card/CustomerCard.vue b/src/pages/Customer/Card/CustomerCard.vue
index c833d0cf9..26b8202a2 100644
--- a/src/pages/Customer/Card/CustomerCard.vue
+++ b/src/pages/Customer/Card/CustomerCard.vue
@@ -5,10 +5,17 @@ import { useRoute } from 'vue-router';
 import CustomerDescriptor from './CustomerDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
+import { onMounted } from 'vue';
 
 const stateStore = useStateStore();
 const route = useRoute();
 const { t } = useI18n();
+
+onMounted(() => {
+    console.log('MOUNTED', stateStore.isSubToolbarShown());
+    stateStore.toggleSubToolbar();
+    console.log('MOUNTED', stateStore.isSubToolbarShown());
+});
 </script>
 <template>
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
diff --git a/src/stores/useStateStore.js b/src/stores/useStateStore.js
index 74b65e71f..328df9978 100644
--- a/src/stores/useStateStore.js
+++ b/src/stores/useStateStore.js
@@ -5,6 +5,7 @@ export const useStateStore = defineStore('stateStore', () => {
     const isMounted = ref(false);
     const leftDrawer = ref(false);
     const rightDrawer = ref(false);
+    const subToolbar = ref(false);
 
     function toggleLeftDrawer() {
         leftDrawer.value = !leftDrawer.value;
@@ -14,6 +15,10 @@ export const useStateStore = defineStore('stateStore', () => {
         rightDrawer.value = !rightDrawer.value;
     }
 
+    function toggleSubToolbar() {
+        subToolbar.value = !subToolbar.value;
+    }
+
     function setMounted() {
         isMounted.value = true;
     }
@@ -31,10 +36,7 @@ export const useStateStore = defineStore('stateStore', () => {
     }
 
     function isSubToolbarShown() {
-        return (
-            !!document.querySelector('#st-data') &&
-            !!document.querySelector('#st-actions')
-        );
+        return subToolbar.value;
     }
 
     return {
@@ -47,5 +49,6 @@ export const useStateStore = defineStore('stateStore', () => {
         isLeftDrawerShown,
         isRightDrawerShown,
         isSubToolbarShown,
+        toggleSubToolbar,
     };
 });

From 6b23c988b384bde3dba1f5090d541208270345fc Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Wed, 3 Jan 2024 11:06:03 +0100
Subject: [PATCH 3/7] refs #6618 component vnSubToolBar

---
 src/components/ui/vnSubToolBar.vue  | 32 +++++++++++++++++++++++++++++
 src/pages/Claim/Card/ClaimLines.vue | 22 ++++++++++++++++++--
 2 files changed, 52 insertions(+), 2 deletions(-)
 create mode 100644 src/components/ui/vnSubToolBar.vue

diff --git a/src/components/ui/vnSubToolBar.vue b/src/components/ui/vnSubToolBar.vue
new file mode 100644
index 000000000..31c67cf63
--- /dev/null
+++ b/src/components/ui/vnSubToolBar.vue
@@ -0,0 +1,32 @@
+<script setup>
+import { onMounted, onUnmounted, ref } from 'vue';
+import { defineStore } from 'pinia';
+
+const useStateStore = defineStore('stateStore', () => {
+    const subToolbar = ref(false);
+
+    function toggleSubToolbar() {
+        subToolbar.value = !subToolbar.value;
+    }
+
+    return {
+        toggleSubToolbar,
+    };
+});
+
+onMounted(() => {
+    useStateStore();
+});
+
+onUnmounted(() => {
+    useStateStore();
+});
+</script>
+
+<template>
+    <QToolbar class="bg-vn-dark justify-end">
+        <div id="st-data"></div>
+        <QSpace />
+        <div id="st-actions"></div>
+    </QToolbar>
+</template>
diff --git a/src/pages/Claim/Card/ClaimLines.vue b/src/pages/Claim/Card/ClaimLines.vue
index d1022b731..a47e18fdf 100644
--- a/src/pages/Claim/Card/ClaimLines.vue
+++ b/src/pages/Claim/Card/ClaimLines.vue
@@ -12,6 +12,7 @@ import FetchData from 'components/FetchData.vue';
 import { toDate, toCurrency, toPercentage } from 'filters/index';
 import VnDiscount from 'components/common/vnDiscount.vue';
 import ClaimLinesImport from './ClaimLinesImport.vue';
+import VnSubToolBar from 'src/components/ui/vnSubToolBar.vue';
 
 const quasar = useQuasar();
 const route = useRoute();
@@ -159,7 +160,24 @@ function isSubToolbarShown() {
 </script>
 <template>
     {{ subToolbarLoaded }}
-    <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
+    <VnSubToolBar>
+        <div class="row q-gutter-md">
+            <div>
+                {{ t('Amount') }}
+                <QChip :dense="$q.screen.lt.sm">
+                    {{ toCurrency(amount) }}
+                </QChip>
+            </div>
+            <QSeparator dark vertical />
+            <div>
+                {{ t('Amount Claimed') }}
+                <QChip color="positive" :dense="$q.screen.lt.sm">
+                    {{ toCurrency(amountClaimed) }}
+                </QChip>
+            </div>
+        </div>
+    </VnSubToolBar>
+    <!-- <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
         <QToolbar>
             <div class="row q-gutter-md">
                 <div>
@@ -177,7 +195,7 @@ function isSubToolbarShown() {
                 </div>
             </div>
         </QToolbar>
-    </Teleport>
+    </Teleport> -->
 
     <FetchData
         :url="`Claims/${route.params.id}`"

From 3c98d099b3b31b52753966810bf4a09a76f7d8b4 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Wed, 3 Jan 2024 13:00:45 +0100
Subject: [PATCH 4/7] refs #6618 component Cards

---
 src/components/ui/VnSubToolBar.vue           | 21 ++++++++++++
 src/components/ui/vnSubToolBar.vue           | 32 ------------------
 src/pages/Claim/Card/ClaimCard.vue           | 20 ++---------
 src/pages/Claim/Card/ClaimLines.vue          | 35 +++++---------------
 src/pages/Customer/Card/CustomerCard.vue     |  6 ----
 src/pages/InvoiceOut/Card/InvoiceOutCard.vue |  8 ++---
 src/pages/Shelving/Card/ShelvingForm.vue     |  9 ++---
 7 files changed, 36 insertions(+), 95 deletions(-)
 create mode 100644 src/components/ui/VnSubToolBar.vue
 delete mode 100644 src/components/ui/vnSubToolBar.vue

diff --git a/src/components/ui/VnSubToolBar.vue b/src/components/ui/VnSubToolBar.vue
new file mode 100644
index 000000000..81a1820f1
--- /dev/null
+++ b/src/components/ui/VnSubToolBar.vue
@@ -0,0 +1,21 @@
+<script setup>
+import { onMounted, onUnmounted, ref } from 'vue';
+import { useStateStore } from 'stores/useStateStore';
+const stateStore = useStateStore();
+
+onMounted(() => {
+    stateStore.toggleSubToolbar();
+});
+
+onUnmounted(() => {
+    stateStore.toggleSubToolbar();
+});
+</script>
+
+<template>
+    <QToolbar class="bg-vn-dark justify-end">
+        <div id="st-data"></div>
+        <QSpace />
+        <div id="st-actions"></div>
+    </QToolbar>
+</template>
diff --git a/src/components/ui/vnSubToolBar.vue b/src/components/ui/vnSubToolBar.vue
deleted file mode 100644
index 31c67cf63..000000000
--- a/src/components/ui/vnSubToolBar.vue
+++ /dev/null
@@ -1,32 +0,0 @@
-<script setup>
-import { onMounted, onUnmounted, ref } from 'vue';
-import { defineStore } from 'pinia';
-
-const useStateStore = defineStore('stateStore', () => {
-    const subToolbar = ref(false);
-
-    function toggleSubToolbar() {
-        subToolbar.value = !subToolbar.value;
-    }
-
-    return {
-        toggleSubToolbar,
-    };
-});
-
-onMounted(() => {
-    useStateStore();
-});
-
-onUnmounted(() => {
-    useStateStore();
-});
-</script>
-
-<template>
-    <QToolbar class="bg-vn-dark justify-end">
-        <div id="st-data"></div>
-        <QSpace />
-        <div id="st-actions"></div>
-    </QToolbar>
-</template>
diff --git a/src/pages/Claim/Card/ClaimCard.vue b/src/pages/Claim/Card/ClaimCard.vue
index 41e4a46cb..2c0642509 100644
--- a/src/pages/Claim/Card/ClaimCard.vue
+++ b/src/pages/Claim/Card/ClaimCard.vue
@@ -7,8 +7,8 @@ import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 import ClaimDescriptor from './ClaimDescriptor.vue';
+import VnSubToolBar from 'src/components/ui/VnSubToolBar.vue';
 
-import { onMounted, onUnmounted } from 'vue';
 const stateStore = useStateStore();
 const { t } = useI18n();
 const route = useRoute();
@@ -22,18 +22,6 @@ const $props = defineProps({
 const entityId = computed(() => {
     return $props.id || route.params.id;
 });
-
-onMounted(() => {
-    console.log('MOUNTED', stateStore.isSubToolbarShown());
-    stateStore.toggleSubToolbar();
-    console.log('MOUNTED', stateStore.isSubToolbarShown());
-});
-
-onUnmounted(() => {
-    console.log('MOUNTED', stateStore.isSubToolbarShown());
-    stateStore.toggleSubToolbar();
-    console.log('MOUNTED', stateStore.isSubToolbarShown());
-});
 </script>
 <template>
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
@@ -53,11 +41,7 @@ onUnmounted(() => {
     </QDrawer>
     <QPageContainer>
         <QPage>
-            <QToolbar class="bg-vn-dark justify-end">
-                <div id="st-data"></div>
-                <QSpace />
-                <div id="st-actions"></div>
-            </QToolbar>
+            <VnSubToolBar />
             <div class="q-pa-md"><RouterView></RouterView></div>
         </QPage>
     </QPageContainer>
diff --git a/src/pages/Claim/Card/ClaimLines.vue b/src/pages/Claim/Card/ClaimLines.vue
index a47e18fdf..e7f67bcc2 100644
--- a/src/pages/Claim/Card/ClaimLines.vue
+++ b/src/pages/Claim/Card/ClaimLines.vue
@@ -12,14 +12,12 @@ import FetchData from 'components/FetchData.vue';
 import { toDate, toCurrency, toPercentage } from 'filters/index';
 import VnDiscount from 'components/common/vnDiscount.vue';
 import ClaimLinesImport from './ClaimLinesImport.vue';
-import VnSubToolBar from 'src/components/ui/vnSubToolBar.vue';
 
 const quasar = useQuasar();
 const route = useRoute();
 const { t } = useI18n();
 
 const stateStore = useStateStore();
-const subToolbarLoaded = computed(() => stateStore.isSubToolbarShown());
 const arrayData = useArrayData('ClaimLines');
 const store = arrayData.store;
 
@@ -48,14 +46,17 @@ async function onFetchClaim(data) {
 const amount = ref();
 const amountClaimed = ref();
 async function onFetch(rows) {
+    amount.value = 0;
+    amountClaimed.value = 0;
     if (!rows || !rows.length) return;
+
     amount.value = rows.reduce(
-        (acumulator, { sale }) => acumulator + sale.price * sale.quantity,
+        (accumulator, { sale }) => accumulator + sale.price * sale.quantity,
         0
     );
 
     amountClaimed.value = rows.reduce(
-        (acumulator, line) => acumulator + line.sale.price * line.quantity,
+        (accumulator, line) => accumulator + line.sale.price * line.quantity,
         0
     );
 }
@@ -154,30 +155,9 @@ function showImportDialog() {
         })
         .onOk(() => claimLinesForm.value.reload());
 }
-function isSubToolbarShown() {
-    return amount.value && amountClaimed;
-}
 </script>
 <template>
-    {{ subToolbarLoaded }}
-    <VnSubToolBar>
-        <div class="row q-gutter-md">
-            <div>
-                {{ t('Amount') }}
-                <QChip :dense="$q.screen.lt.sm">
-                    {{ toCurrency(amount) }}
-                </QChip>
-            </div>
-            <QSeparator dark vertical />
-            <div>
-                {{ t('Amount Claimed') }}
-                <QChip color="positive" :dense="$q.screen.lt.sm">
-                    {{ toCurrency(amountClaimed) }}
-                </QChip>
-            </div>
-        </div>
-    </VnSubToolBar>
-    <!-- <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
+    <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
         <QToolbar>
             <div class="row q-gutter-md">
                 <div>
@@ -195,7 +175,7 @@ function isSubToolbarShown() {
                 </div>
             </div>
         </QToolbar>
-    </Teleport> -->
+    </Teleport>
 
     <FetchData
         :url="`Claims/${route.params.id}`"
@@ -212,6 +192,7 @@ function isSubToolbarShown() {
                 save-url="ClaimBeginnings/crud"
                 :filter="linesFilter"
                 @on-fetch="onFetch"
+                @save-changes="onFetch"
                 v-model:selected="selected"
                 :default-save="false"
                 :default-reset="false"
diff --git a/src/pages/Customer/Card/CustomerCard.vue b/src/pages/Customer/Card/CustomerCard.vue
index 26b8202a2..ebe1235b2 100644
--- a/src/pages/Customer/Card/CustomerCard.vue
+++ b/src/pages/Customer/Card/CustomerCard.vue
@@ -10,12 +10,6 @@ import { onMounted } from 'vue';
 const stateStore = useStateStore();
 const route = useRoute();
 const { t } = useI18n();
-
-onMounted(() => {
-    console.log('MOUNTED', stateStore.isSubToolbarShown());
-    stateStore.toggleSubToolbar();
-    console.log('MOUNTED', stateStore.isSubToolbarShown());
-});
 </script>
 <template>
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
diff --git a/src/pages/InvoiceOut/Card/InvoiceOutCard.vue b/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
index d24eb3ef2..f5e8e86b8 100644
--- a/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
+++ b/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
@@ -4,6 +4,7 @@ import { useStateStore } from 'stores/useStateStore';
 import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
+import VnSubToolBar from 'src/components/ui/VnSubToolBar.vue';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -26,12 +27,7 @@ const { t } = useI18n();
     </QDrawer>
     <QPageContainer>
         <QPage>
-            <QToolbar class="bg-vn-dark justify-end">
-                <div id="st-data"></div>
-                <QSpace />
-                <div id="st-actions"></div>
-            </QToolbar>
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <VnSubToolBar />
         </QPage>
     </QPageContainer>
 </template>
diff --git a/src/pages/Shelving/Card/ShelvingForm.vue b/src/pages/Shelving/Card/ShelvingForm.vue
index e30ac1939..c5221aad0 100644
--- a/src/pages/Shelving/Card/ShelvingForm.vue
+++ b/src/pages/Shelving/Card/ShelvingForm.vue
@@ -5,6 +5,7 @@ import { useRoute } from 'vue-router';
 import VnRow from 'components/ui/VnRow.vue';
 import FetchData from 'components/FetchData.vue';
 import FormModel from 'components/FormModel.vue';
+import VnSubToolBar from 'src/components/ui/VnSubToolBar.vue';
 
 const { t } = useI18n();
 const route = useRoute();
@@ -15,7 +16,7 @@ const defaultInitialData = {
     priority: 0,
     code: null,
     isRecyclable: false,
-}
+};
 
 const parkingFilter = { fields: ['id', 'code'] };
 const parkingList = ref([]);
@@ -58,11 +59,7 @@ const shelvingFilter = {
 };
 </script>
 <template>
-    <QToolbar class="bg-vn-dark justify-end">
-        <div id="st-data"></div>
-        <QSpace />
-        <div id="st-actions"></div>
-    </QToolbar>
+    <VnSubToolBar />
     <FetchData
         url="Parkings"
         :filter="parkingFilter"

From 9a9bb2fa4483e738aeed906c8299aa7521c47c32 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Wed, 3 Jan 2024 13:24:49 +0100
Subject: [PATCH 5/7] refs #6618 invoiceOut fix

---
 src/pages/InvoiceOut/Card/InvoiceOutCard.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/InvoiceOut/Card/InvoiceOutCard.vue b/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
index f5e8e86b8..e20b1345a 100644
--- a/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
+++ b/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
@@ -4,7 +4,6 @@ import { useStateStore } from 'stores/useStateStore';
 import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
-import VnSubToolBar from 'src/components/ui/VnSubToolBar.vue';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -28,6 +27,7 @@ const { t } = useI18n();
     <QPageContainer>
         <QPage>
             <VnSubToolBar />
+            <div class="q-pa-md"><RouterView></RouterView></div>
         </QPage>
     </QPageContainer>
 </template>

From 9cd20439a678566b78a941f419422a9cd388cb35 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Wed, 3 Jan 2024 14:09:29 +0100
Subject: [PATCH 6/7] refs #6618 fix name

---
 src/components/ui/{VnSubToolBar.vue => VnSubToolbar.vue} | 0
 src/pages/Claim/Card/ClaimCard.vue                       | 4 ++--
 src/pages/InvoiceOut/Card/InvoiceOutCard.vue             | 3 ++-
 src/pages/Shelving/Card/ShelvingForm.vue                 | 4 ++--
 4 files changed, 6 insertions(+), 5 deletions(-)
 rename src/components/ui/{VnSubToolBar.vue => VnSubToolbar.vue} (100%)

diff --git a/src/components/ui/VnSubToolBar.vue b/src/components/ui/VnSubToolbar.vue
similarity index 100%
rename from src/components/ui/VnSubToolBar.vue
rename to src/components/ui/VnSubToolbar.vue
diff --git a/src/pages/Claim/Card/ClaimCard.vue b/src/pages/Claim/Card/ClaimCard.vue
index 2c0642509..b6c948c96 100644
--- a/src/pages/Claim/Card/ClaimCard.vue
+++ b/src/pages/Claim/Card/ClaimCard.vue
@@ -7,7 +7,7 @@ import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 import ClaimDescriptor from './ClaimDescriptor.vue';
-import VnSubToolBar from 'src/components/ui/VnSubToolBar.vue';
+import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -41,7 +41,7 @@ const entityId = computed(() => {
     </QDrawer>
     <QPageContainer>
         <QPage>
-            <VnSubToolBar />
+            <VnSubToolbar />
             <div class="q-pa-md"><RouterView></RouterView></div>
         </QPage>
     </QPageContainer>
diff --git a/src/pages/InvoiceOut/Card/InvoiceOutCard.vue b/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
index e20b1345a..bfab4b9e1 100644
--- a/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
+++ b/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
@@ -4,6 +4,7 @@ import { useStateStore } from 'stores/useStateStore';
 import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
+import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -26,7 +27,7 @@ const { t } = useI18n();
     </QDrawer>
     <QPageContainer>
         <QPage>
-            <VnSubToolBar />
+            <VnSubToolbar />
             <div class="q-pa-md"><RouterView></RouterView></div>
         </QPage>
     </QPageContainer>
diff --git a/src/pages/Shelving/Card/ShelvingForm.vue b/src/pages/Shelving/Card/ShelvingForm.vue
index c5221aad0..9740e3664 100644
--- a/src/pages/Shelving/Card/ShelvingForm.vue
+++ b/src/pages/Shelving/Card/ShelvingForm.vue
@@ -5,7 +5,7 @@ import { useRoute } from 'vue-router';
 import VnRow from 'components/ui/VnRow.vue';
 import FetchData from 'components/FetchData.vue';
 import FormModel from 'components/FormModel.vue';
-import VnSubToolBar from 'src/components/ui/VnSubToolBar.vue';
+import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 
 const { t } = useI18n();
 const route = useRoute();
@@ -59,7 +59,7 @@ const shelvingFilter = {
 };
 </script>
 <template>
-    <VnSubToolBar />
+    <VnSubToolbar />
     <FetchData
         url="Parkings"
         :filter="parkingFilter"

From 96acd00469cd62864cc91148d21869beb9076d69 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Thu, 4 Jan 2024 10:33:11 +0100
Subject: [PATCH 7/7] refs #6618 remove import

---
 src/pages/Customer/Card/CustomerCard.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/Customer/Card/CustomerCard.vue b/src/pages/Customer/Card/CustomerCard.vue
index ebe1235b2..c833d0cf9 100644
--- a/src/pages/Customer/Card/CustomerCard.vue
+++ b/src/pages/Customer/Card/CustomerCard.vue
@@ -5,7 +5,6 @@ import { useRoute } from 'vue-router';
 import CustomerDescriptor from './CustomerDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
-import { onMounted } from 'vue';
 
 const stateStore = useStateStore();
 const route = useRoute();