Improved: Enabled infinite scrolling when applying filters on landing…

… pages (#531)
hotwax · Dec 16, 2024 · 7380943 · 7380943
1 parent d51c990
commit 7380943
Show file tree

Hide file tree

Showing 7 changed files with 19 additions and 15 deletions.
diff --git a/src/store/modules/count/actions.ts b/src/store/modules/count/actions.ts
@@ -127,7 +127,11 @@ const actions: ActionTree<CountState, RootState> = {
     } else if(router.currentRoute.value.name === "Closed") {
       statusId = "INV_COUNT_COMPLETED"
     }
-    dispatch("fetchCycleCounts", { statusId })
+    dispatch("fetchCycleCounts", { pageSize: process.env.VUE_APP_VIEW_SIZE, pageIndex: 0, statusId })
+  },
+
+  async updateQueryString({ commit }, payload) {
+    commit(types.COUNT_QUERY_UPDATED, payload)
   },
 
   async clearQuery({ commit }) {

diff --git a/src/store/modules/count/index.ts b/src/store/modules/count/index.ts
@@ -14,7 +14,7 @@ const countModule: Module<CountState, RootState> = {
     query: {
       facilityIds: [],
       noFacility: false,
-      queryString: []
+      queryString: ''
     },
     stats: {},
     cycleCountImportSystemMessages:[],

diff --git a/src/store/modules/count/mutations.ts b/src/store/modules/count/mutations.ts
@@ -15,7 +15,7 @@ const mutations: MutationTree <CountState> = {
     state.query = {
       facilityIds: [],
       noFacility: false,
-      queryString: []
+      queryString: ''
     }
   },
   [types.COUNT_STATS_UPDATED](state, payload) {

diff --git a/src/views/Assigned.vue b/src/views/Assigned.vue
@@ -14,7 +14,7 @@
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()" id="filter">
       <section>
-        <ion-searchbar v-model="query.queryString" @keyup.enter="updateQuery('queryString', $event.target.value)" />
+        <ion-searchbar v-model="query.queryString" @keyup.enter="updateQueryString('queryString', $event.target.value)" />
       </section>
       <p v-if="!cycleCounts.length" class="empty-state">
         {{ translate("No cycle counts found") }}
@@ -103,8 +103,8 @@ function enableScrolling() {
   }
 }
 
-async function updateQuery(key: string, value: any) {
-  await store.dispatch("count/updateQuery", { key, value })
+async function updateQueryString(key: string, value: any) {
+  await store.dispatch("count/updateQueryString", { key, value })
   fetchAssignedCycleCount();
 }
 

diff --git a/src/views/Closed.vue b/src/views/Closed.vue
@@ -15,7 +15,7 @@
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()" id="filter">
       <section>
-        <ion-searchbar v-model="query.queryString" @keyup.enter="updateQuery('queryString', $event.target.value)" />
+        <ion-searchbar v-model="query.queryString" @keyup.enter="updateQueryString('queryString', $event.target.value)" />
       </section>
       <p v-if="!cycleCounts.length" class="empty-state">
         {{ translate("No cycle counts found") }}
@@ -149,8 +149,8 @@ function enableScrolling() {
   }
 }
 
-async function updateQuery(key: string, value: any) {
-  await store.dispatch("count/updateQuery", { key, value })
+async function updateQueryString(key: string, value: any) {
+  await store.dispatch("count/updateQueryString", { key, value })
   fetchClosedCycleCounts();
 }
 

diff --git a/src/views/Draft.vue b/src/views/Draft.vue
@@ -15,7 +15,7 @@
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()" id="filter">
       <section>
-        <ion-searchbar v-model="query.queryString" @keyup.enter="updateQuery('queryString', $event.target.value)" />
+        <ion-searchbar v-model="query.queryString" @keyup.enter="updateQueryString('queryString', $event.target.value)" />
       </section>
       <p v-if="!cycleCounts.length" class="empty-state">
         {{ translate("No cycle counts found") }}
@@ -120,8 +120,8 @@ function enableScrolling() {
   }
 }
 
-async function updateQuery(key: string, value: any) {
-  await store.dispatch("count/updateQuery", { key, value })
+async function updateQueryString(key: string, value: any) {
+  await store.dispatch("count/updateQueryString", { key, value })
   fetchDraftCycleCounts();
 }
 

diff --git a/src/views/PendingReview.vue b/src/views/PendingReview.vue
@@ -14,7 +14,7 @@
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()" id="filter">
       <section>
-        <ion-searchbar v-model="query.queryString" @keyup.enter="updateQuery('queryString', $event.target.value)" />
+        <ion-searchbar v-model="query.queryString" @keyup.enter="updateQueryString('queryString', $event.target.value)" />
       </section>
       <p v-if="!cycleCounts.length" class="empty-state">
         {{ translate("No cycle counts found") }}
@@ -103,8 +103,8 @@ function enableScrolling() {
   }
 }
 
-async function updateQuery(key: string, value: any) {
-  await store.dispatch("count/updateQuery", { key, value })
+async function updateQueryString(key: string, value: any) {
+  await store.dispatch("count/updateQueryString", { key, value })
   fetchPendingCycleCounts();
 }