Merge pull request 'hotFix_arrayData_store_data' (!929) from hotFix_arrayData_store_data into master

Reviewed-on: #929 Reviewed-by: Javier Segarra <jsegarra@verdnatura.es> Reviewed-by: Carlos Satorres <carlossa@verdnatura.es>
2024-11-18 09:12:21 +00:00 · 2024-11-18 09:12:21 +00:00 · 27a1d7460d
parent ff9d793378 149f92bc93
commit 27a1d7460d
27 changed files with 43 additions and 40 deletions
--- a/src/components/CrudModel.vue
+++ b/src/components/CrudModel.vue
@ -77,7 +77,7 @@ const isLoading = ref(false);
 const hasChanges = ref(false);
 const originalData = ref();
 const vnPaginateRef = ref();
-const formData = ref();
+const formData = ref([]);
 const saveButtonRef = ref(null);
 const watchChanges = ref();
 const formUrl = computed(() => $props.url);
--- a/src/components/VnTable/VnFilter.vue
+++ b/src/components/VnTable/VnFilter.vue
@ -25,7 +25,7 @@ const $props = defineProps({
    },
    searchUrl: {
        type: String,
-        default: 'params',
+        default: 'table',
    },
 });

--- a/src/components/VnTable/VnOrder.vue
+++ b/src/components/VnTable/VnOrder.vue
@ -17,7 +17,7 @@ const $props = defineProps({
    },
    searchUrl: {
        type: String,
-        default: 'params',
+        default: 'table',
    },
    vertical: {
        type: Boolean,
--- a/src/components/ui/VnFilterPanel.vue
+++ b/src/components/ui/VnFilterPanel.vue
@ -49,7 +49,7 @@ const $props = defineProps({
    },
    searchUrl: {
        type: String,
-        default: 'params',
+        default: 'table',
    },
    redirect: {
        type: Boolean,
--- a/src/components/ui/VnPaginate.vue
+++ b/src/components/ui/VnPaginate.vue
@ -44,7 +44,7 @@ const props = defineProps({
    },
    limit: {
        type: Number,
-        default: 10,
+        default: 20,
    },
    userParams: {
        type: Object,
@ -100,7 +100,7 @@ const arrayData = useArrayData(props.dataKey, {
 const store = arrayData.store;

 onMounted(async () => {
-    if (props.autoLoad) await fetch();
+    if (props.autoLoad && !store.data?.length) await fetch();
    mounted.value = true;
 });

@ -115,7 +115,11 @@ watch(

 watch(
    () => store.data,
-    (data) => emit('onChange', data)
+    (data) => {
+        if (!mounted.value) return;
+        emit('onChange', data);
+    },
+    { immediate: true }
 );

 watch(
--- a/src/components/ui/VnSearchbar.vue
+++ b/src/components/ui/VnSearchbar.vue
@ -45,7 +45,7 @@ const props = defineProps({
    },
    limit: {
        type: Number,
-        default: 10,
+        default: 20,
    },
    userParams: {
        type: Object,
--- a/src/composables/useArrayData.js
+++ b/src/composables/useArrayData.js
@ -270,7 +270,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
                const pushUrl = { path: to };
                if (to.endsWith('/list') || to.endsWith('/'))
                    pushUrl.query = newUrl.query;
-                destroy();
+                else destroy();
                return router.push(pushUrl);
            }
        }
--- a/src/pages/Account/AccountList.vue
+++ b/src/pages/Account/AccountList.vue
@ -104,7 +104,7 @@ const exprBuilder = (param, value) => {

 <template>
    <VnSearchbar
-        data-key="AccountUsers"
+        data-key="AccountList"
        :expr-builder="exprBuilder"
        :label="t('account.search')"
        :info="t('account.searchInfo')"
@ -112,12 +112,12 @@ const exprBuilder = (param, value) => {
    />
    <RightMenu>
        <template #right-panel>
-            <AccountFilter data-key="AccountUsers" />
+            <AccountFilter data-key="AccountList" />
        </template>
    </RightMenu>
    <VnTable
        ref="tableRef"
-        data-key="AccountUsers"
+        data-key="AccountList"
        url="VnUsers/preview"
        :filter="filter"
        order="id DESC"
--- a/src/pages/Account/Role/AccountRoles.vue
+++ b/src/pages/Account/Role/AccountRoles.vue
@ -82,14 +82,14 @@ const exprBuilder = (param, value) => {

 <template>
    <VnSearchbar
-        data-key="Roles"
+        data-key="AccountRolesList"
        :expr-builder="exprBuilder"
        :label="t('role.searchRoles')"
        :info="t('role.searchInfo')"
    />
    <VnTable
        ref="tableRef"
-        data-key="Roles"
+        data-key="AccountRolesList"
        :url="`VnRoles`"
        :create="{
            urlCreate: 'VnRoles',
--- a/src/pages/Account/Role/Card/RoleCard.vue
+++ b/src/pages/Account/Role/Card/RoleCard.vue
@ -9,7 +9,7 @@ const { t } = useI18n();
    <VnCard
        data-key="Role"
        :descriptor="RoleDescriptor"
-        search-data-key="AccountRoles"
+        search-data-key="AccountRolesList"
        :searchbar-props="{
            url: 'VnRoles',
            label: t('role.searchRoles'),
--- a/src/pages/Claim/ClaimFilter.vue
+++ b/src/pages/Claim/ClaimFilter.vue
@ -23,7 +23,7 @@ defineExpose({ states });

 <template>
    <FetchData url="ClaimStates" @on-fetch="(data) => (states = data)" auto-load />
-    <VnFilterPanel :data-key="props.dataKey" :search-button="true" search-url="table">
+    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
        <template #tags="{ tag, formatFn }">
            <div class="q-gutter-x-xs">
                <strong>{{ t(`params.${tag.label}`) }}: </strong>
--- a/src/pages/Customer/CustomerFilter.vue
+++ b/src/pages/Customer/CustomerFilter.vue
@ -28,7 +28,7 @@ const exprBuilder = (param, value) => {
 </script>

 <template>
-    <VnFilterPanel :data-key="dataKey" :search-button="true" search-url="table">
+    <VnFilterPanel :data-key="dataKey" :search-button="true">
        <template #tags="{ tag, formatFn }">
            <div class="q-gutter-x-xs">
                <strong>{{ t(`params.${tag.label}`) }}: </strong>
--- a/src/pages/Customer/CustomerList.vue
+++ b/src/pages/Customer/CustomerList.vue
@ -394,16 +394,16 @@ function handleLocation(data, location) {
    <VnSearchbar
        :info="t('You can search by customer id or name')"
        :label="t('Search customer')"
-        data-key="Customer"
+        data-key="CustomerList"
    />
    <RightMenu>
        <template #right-panel>
-            <CustomerFilter data-key="Customer" />
+            <CustomerFilter data-key="CustomerList" />
        </template>
    </RightMenu>
    <VnTable
        ref="tableRef"
-        data-key="Customer"
+        data-key="CustomerList"
        url="Clients/filter"
        :create="{
            urlCreate: 'Clients/createWithUser',
--- a/src/pages/InvoiceIn/InvoiceInList.vue
+++ b/src/pages/InvoiceIn/InvoiceInList.vue
@ -122,7 +122,7 @@ const cols = computed(() => [
        :columns="cols"
        :right-search="false"
        :disable-option="{ card: true }"
-        :auto-load="!!$route.query.params"
+        :auto-load="!!$route.query.table"
    >
        <template #column-supplierFk="{ row }">
            <span class="link" @click.stop>
--- a/src/pages/InvoiceOut/InvoiceOutList.vue
+++ b/src/pages/InvoiceOut/InvoiceOutList.vue
@ -182,11 +182,11 @@ watchEffect(selectedRows);
    <VnSearchbar
        :info="t('youCanSearchByInvoiceReference')"
        :label="t('searchInvoice')"
-        data-key="invoiceOut"
+        data-key="invoiceOutList"
    />
    <RightMenu>
        <template #right-panel>
-            <InvoiceOutFilter data-key="invoiceOut" />
+            <InvoiceOutFilter data-key="invoiceOutList" />
        </template>
    </RightMenu>
    <VnSubToolbar>
@ -203,7 +203,7 @@ watchEffect(selectedRows);
    </VnSubToolbar>
    <VnTable
        ref="tableRef"
-        data-key="invoiceOut"
+        data-key="invoiceOutList"
        :url="`${MODEL}/filter`"
        :create="{
            urlCreate: 'InvoiceOuts/createManualInvoice',
--- a/src/pages/Ticket/Card/TicketDescriptorMenu.vue
+++ b/src/pages/Ticket/Card/TicketDescriptorMenu.vue
@ -348,7 +348,6 @@ async function hasDocuware() {
 }

 async function uploadDocuware(force) {
-    console.log('force: ', force);
    if (!force)
        return quasar
            .dialog({
--- a/src/pages/Ticket/TicketFilter.vue
+++ b/src/pages/Ticket/TicketFilter.vue
@ -47,7 +47,7 @@ const getGroupedStates = (data) => {
    />
    <FetchData url="AgencyModes" @on-fetch="(data) => (agencies = data)" auto-load />
    <FetchData url="Warehouses" @on-fetch="(data) => (warehouses = data)" auto-load />
-    <VnFilterPanel :data-key="props.dataKey" :search-button="true" search-url="table">
+    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
        <template #tags="{ tag, formatFn }">
            <div class="q-gutter-x-xs">
                <strong>{{ t(`params.${tag.label}`) }}: </strong>
--- a/src/pages/Ticket/TicketList.vue
+++ b/src/pages/Ticket/TicketList.vue
@ -460,18 +460,18 @@ function setReference(data) {
        auto-load
    />
    <VnSearchbar
-        data-key="Ticket"
+        data-key="TicketList"
        :label="t('Search ticket')"
        :info="t('You can search by ticket id or alias')"
    />
    <RightMenu>
        <template #right-panel>
-            <TicketFilter data-key="Ticket" />
+            <TicketFilter data-key="TicketList" />
        </template>
    </RightMenu>
    <VnTable
        ref="tableRef"
-        data-key="Ticket"
+        data-key="TicketList"
        url="Tickets/filter"
        :create="{
            urlCreate: 'Tickets/new',
--- a/src/pages/Travel/TravelFilter.vue
+++ b/src/pages/Travel/TravelFilter.vue
@ -24,7 +24,7 @@ defineExpose({ states });

 <template>
    <FetchData url="warehouses" @on-fetch="(data) => (states = data)" auto-load />
-    <VnFilterPanel :data-key="props.dataKey" :search-button="true" search-url="table">
+    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
        <template #tags="{ tag, formatFn }">
            <div class="q-gutter-x-xs">
                <strong>{{ t(`params.${tag.label}`) }}: </strong>
--- a/src/pages/Worker/Card/WorkerCard.vue
+++ b/src/pages/Worker/Card/WorkerCard.vue
@ -14,6 +14,7 @@ import WorkerFilter from '../WorkerFilter.vue';
            url: 'Workers/filter',
            label: 'Search worker',
            info: 'You can search by worker id or name',
+            order: 'id DESC',
        }"
        :redirect-on-error="true"
    />
--- a/src/pages/Worker/Card/WorkerNotificationsManager.vue
+++ b/src/pages/Worker/Card/WorkerNotificationsManager.vue
@ -69,7 +69,7 @@ function setNotifications(data) {
        :default-reset="false"
        :default-remove="false"
        :default-save="false"
-        @on-fetch="setNotifications"
+        @on-fetch="(data) => data && setNotifications(data)"
        search-url="notifications"
    >
        <template #body>
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@ -169,7 +169,7 @@ async function autofillBic(worker) {
 </script>
 <template>
    <VnSearchbar
-        data-key="Worker"
+        data-key="WorkerList"
        :label="t('Search worker')"
        :info="t('You can search by worker id or name')"
    />
@ -191,13 +191,13 @@ async function autofillBic(worker) {
    />
    <RightMenu>
        <template #right-panel>
-            <WorkerFilter data-key="Worker" />
+            <WorkerFilter data-key="WorkerList" />
        </template>
    </RightMenu>
    <VnTable
        v-if="defaultPayMethod"
        ref="tableRef"
-        data-key="Worker"
+        data-key="WorkerList"
        url="Workers/filter"
        :create="{
            urlCreate: 'Workers/new',
--- a/src/pages/Zone/Card/ZoneSearchbar.vue
+++ b/src/pages/Zone/Card/ZoneSearchbar.vue
@ -26,7 +26,7 @@ const exprBuilder = (param, value) => {

 <template>
    <VnSearchbar
-        data-key="Zones"
+        data-key="ZonesList"
        url="Zones"
        :filter="{
            include: { relation: 'agencyMode', scope: { fields: ['name'] } },
--- a/src/pages/Zone/ZoneFilterPanel.vue
+++ b/src/pages/Zone/ZoneFilterPanel.vue
@ -32,7 +32,6 @@ const agencies = ref([]);
        :data-key="props.dataKey"
        :search-button="true"
        :hidden-tags="['search']"
-        search-url="table"
    >
        <template #tags="{ tag }">
            <div class="q-gutter-x-xs">
--- a/src/pages/Zone/ZoneList.vue
+++ b/src/pages/Zone/ZoneList.vue
@ -139,12 +139,12 @@ onMounted(() => (stateStore.rightDrawer = true));
    <ZoneSearchbar />
    <RightMenu>
        <template #right-panel>
-            <ZoneFilterPanel data-key="Zones" />
+            <ZoneFilterPanel data-key="ZonesList" />
        </template>
    </RightMenu>
    <VnTable
        ref="tableRef"
-        data-key="Zones"
+        data-key="ZonesList"
        url="Zones"
        :create="{
            urlCreate: 'Zones',
--- a/src/stores/useArrayDataStore.js
+++ b/src/stores/useArrayDataStore.js
@ -8,7 +8,7 @@ export const useArrayDataStore = defineStore('arrayDataStore', () => {
        userFilter: {},
        userParams: {},
        url: '',
-        limit: 10,
+        limit: 20,
        skip: 0,
        order: '',
        isLoading: false,
--- a/test/vitest/tests/composables/useArrayData.spec.js
+++ b/test/vitest/tests/composables/useArrayData.spec.js
@ -5,7 +5,7 @@ import { useRouter } from 'vue-router';
 import * as vueRouter from 'vue-router';

 describe('useArrayData', () => {
-    const filter = '{"limit":10,"skip":0}';
+    const filter = '{"limit":20,"skip":0}';
    const params = { supplierFk: 2 };
    beforeEach(() => {
        vi.spyOn(useRouter(), 'replace');