From 68fc5653241e7cb67cb580599dcc67bc9fd28394 Mon Sep 17 00:00:00 2001
From: alexm <alexm@verdnatura.es>
Date: Wed, 4 Dec 2024 09:44:09 +0100
Subject: [PATCH] feat(VnPaginate): refs #8197  hold data when change to Card

---
 src/components/common/VnSelect.vue           |  2 +-
 src/components/ui/VnFilterPanel.vue          |  2 +-
 src/components/ui/VnPaginate.vue             |  6 ++++--
 src/components/ui/VnSearchbar.vue            |  2 +-
 src/composables/useArrayData.js              | 10 +++++++---
 src/pages/Account/AccountList.vue            |  2 +-
 src/pages/Account/Card/AccountCard.vue       |  2 +-
 src/pages/Account/Card/AccountDescriptor.vue |  2 +-
 src/stores/useArrayDataStore.js              |  6 ++++++
 9 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/src/components/common/VnSelect.vue b/src/components/common/VnSelect.vue
index f24f054a5..db47231f4 100644
--- a/src/components/common/VnSelect.vue
+++ b/src/components/common/VnSelect.vue
@@ -201,7 +201,7 @@ async function fetchFilter(val) {
     const fetchOptions = { where, include, limit };
     if (fields) fetchOptions.fields = fields;
     if (sortBy) fetchOptions.order = sortBy;
-    arrayData.reset(['skip', 'filter.skip', 'page']);
+    arrayData.resetPagination();
 
     const { data } = await arrayData.applyFilter({ filter: fetchOptions });
     setOptions(data);
diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue
index b188bde48..716d8331f 100644
--- a/src/components/ui/VnFilterPanel.vue
+++ b/src/components/ui/VnFilterPanel.vue
@@ -138,7 +138,7 @@ async function clearFilters() {
     try {
         isLoading.value = true;
         store.userParamsChanged = true;
-        arrayData.reset(['skip', 'filter.skip', 'page']);
+        arrayData.resetPagination();
         // Filtrar los params no removibles
         const removableFilters = Object.keys(userParams.value).filter((param) =>
             $props.unremovableParams.includes(param)
diff --git a/src/components/ui/VnPaginate.vue b/src/components/ui/VnPaginate.vue
index 3649ba8f5..c5fbbb731 100644
--- a/src/components/ui/VnPaginate.vue
+++ b/src/components/ui/VnPaginate.vue
@@ -104,7 +104,9 @@ onMounted(async () => {
     mounted.value = true;
 });
 
-onBeforeUnmount(() => arrayData.reset());
+onBeforeUnmount(() => {
+    arrayData.resetPagination();
+});
 
 watch(
     () => props.data,
@@ -132,7 +134,7 @@ const addFilter = async (filter, params) => {
 
 async function fetch(params) {
     useArrayData(props.dataKey, params);
-    arrayData.reset(['filter.skip', 'skip', 'page']);
+    arrayData.resetPagination();
     await arrayData.fetch({ append: false, updateRouter: mounted.value });
     return emitStoreData();
 }
diff --git a/src/components/ui/VnSearchbar.vue b/src/components/ui/VnSearchbar.vue
index da2d370fe..a5690f35a 100644
--- a/src/components/ui/VnSearchbar.vue
+++ b/src/components/ui/VnSearchbar.vue
@@ -101,7 +101,7 @@ onMounted(() => {
 
 async function search() {
     const staticParams = Object.entries(store.userParams);
-    arrayData.reset(['skip', 'page']);
+    arrayData.resetPagination();
 
     const filter = {
         params: {
diff --git a/src/composables/useArrayData.js b/src/composables/useArrayData.js
index 028819a83..ee66f6be7 100644
--- a/src/composables/useArrayData.js
+++ b/src/composables/useArrayData.js
@@ -142,6 +142,10 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         if (arrayDataStore.get(key)) arrayDataStore.reset(key, opts);
     }
 
+    function resetPagination() {
+        if (arrayDataStore.get(key)) arrayDataStore.resetPagination(key);
+    }
+
     function cancelRequest() {
         if (canceller) {
             canceller.abort();
@@ -165,7 +169,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         userParams = sanitizerParams(userParams, store?.exprBuilder);
 
         store.userParams = userParams;
-        reset(['skip', 'filter.skip', 'page']);
+        resetPagination();
 
         await fetch({});
         return { filter, params };
@@ -192,7 +196,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         }
 
         store.order = order;
-        reset(['skip', 'filter.skip', 'page']);
+        resetPagination();
         fetch({});
         index++;
 
@@ -275,7 +279,6 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
                 const pushUrl = { path: to };
                 if (to.endsWith('/list') || to.endsWith('/'))
                     pushUrl.query = newUrl.query;
-                else destroy();
                 return router.push(pushUrl);
             }
         }
@@ -302,5 +305,6 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         isLoading,
         deleteOption,
         reset,
+        resetPagination,
     };
 }
diff --git a/src/pages/Account/AccountList.vue b/src/pages/Account/AccountList.vue
index 0c88e6ac8..4b8e8fb28 100644
--- a/src/pages/Account/AccountList.vue
+++ b/src/pages/Account/AccountList.vue
@@ -6,6 +6,7 @@ import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import AccountSummary from './Card/AccountSummary.vue';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import VnCardMain from 'src/components/common/VnCardMain.vue';
+
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
 const tableRef = ref();
@@ -117,7 +118,6 @@ const exprBuilder = (param, value) => {
         </template>
         <template #body>
             <VnTable
-                :style="{ display: !!$route.name.endsWith('List') ? '' : 'none' }"
                 ref="tableRef"
                 :data-key="dataKey"
                 :url="url"
diff --git a/src/pages/Account/Card/AccountCard.vue b/src/pages/Account/Card/AccountCard.vue
index f69bba778..ba9040852 100644
--- a/src/pages/Account/Card/AccountCard.vue
+++ b/src/pages/Account/Card/AccountCard.vue
@@ -4,5 +4,5 @@ import AccountDescriptor from './AccountDescriptor.vue';
 </script>
 
 <template>
-    <VnCard data-key="Account" :descriptor="AccountDescriptor" />
+    <VnCard data-key="AccountId" :descriptor="AccountDescriptor" />
 </template>
diff --git a/src/pages/Account/Card/AccountDescriptor.vue b/src/pages/Account/Card/AccountDescriptor.vue
index 3156f8e1e..4e10e1366 100644
--- a/src/pages/Account/Card/AccountDescriptor.vue
+++ b/src/pages/Account/Card/AccountDescriptor.vue
@@ -41,7 +41,7 @@ const hasAccount = ref(false);
     />
     <CardDescriptor
         ref="descriptor"
-        :url="`VnUsers/preview`"
+        url="VnUsers/preview"
         :filter="filter"
         module="Account"
         @on-fetch="setData"
diff --git a/src/stores/useArrayDataStore.js b/src/stores/useArrayDataStore.js
index 6a0e7dfa8..be65de19a 100644
--- a/src/stores/useArrayDataStore.js
+++ b/src/stores/useArrayDataStore.js
@@ -49,10 +49,16 @@ export const useArrayDataStore = defineStore('arrayDataStore', () => {
         });
     }
 
+    function resetPagination(key) {
+        reset(key, ['skip', 'filter.skip', 'page']);
+    }
+
     return {
+        state,
         get,
         set,
         clear,
         reset,
+        resetPagination,
     };
 });