Fixed: infinite scroll issue when used with searchbar(#289)

hotwax · Apr 16, 2024 · cf86d54 · cf86d54
1 parent 0fba5d7
commit cf86d54
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 2 deletions.
diff --git a/src/views/AssignPickerModal.vue b/src/views/AssignPickerModal.vue
@@ -29,6 +29,7 @@
       @ionInfinite="loadMorePickers($event)"
       threshold="100px"
       :disabled="!isScrollable"
+      :key="queryString"
     >
       <ion-infinite-scroll-content
         loading-spinner="crescent"

diff --git a/src/views/Catalog.vue b/src/views/Catalog.vue
@@ -25,6 +25,7 @@
         @ionInfinite="loadMoreProducts($event)"
         threshold="100px"
         :disabled="!isScrollable"
+        :key="queryString"
       >
         <ion-infinite-scroll-content
           loading-spinner="crescent"

diff --git a/src/views/Orders.vue b/src/views/Orders.vue
@@ -157,7 +157,9 @@
       <ion-refresher slot="fixed" @ionRefresh="refreshOrders($event)">
         <ion-refresher-content pullingIcon="crescent" refreshingSpinner="crescent" />
       </ion-refresher>
-      <ion-infinite-scroll @ionInfinite="loadMoreProducts($event)" threshold="100px" :disabled="segmentSelected === 'open' ? !isOpenOrdersScrollable : segmentSelected === 'packed' ? !isPackedOrdersScrollable : !isCompletedOrdersScrollable">
+      <ion-infinite-scroll @ionInfinite="loadMoreProducts($event)" threshold="100px" 
+        :disabled="segmentSelected === 'open' ? !isOpenOrdersScrollable : segmentSelected === 'packed' ? !isPackedOrdersScrollable : !isCompletedOrdersScrollable"
+        :key="queryString">
         <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="translate('Loading')" />
       </ion-infinite-scroll>
     </ion-content>
@@ -404,6 +406,7 @@ export default defineComponent({
       }
     },
     async searchOrders() {
+      console.log('serach', this.queryString);
       if(this.segmentSelected === 'open') {
         this.getPickupOrders()
       } else if(this.segmentSelected === 'packed') {

diff --git a/src/views/ShipToStoreOrders.vue b/src/views/ShipToStoreOrders.vue
@@ -90,7 +90,9 @@
       <ion-refresher slot="fixed" @ionRefresh="refreshOrders($event)">
         <ion-refresher-content pullingIcon="crescent" refreshingSpinner="crescent" />
       </ion-refresher>
-      <ion-infinite-scroll @ionInfinite="loadMoreOrders($event)" threshold="100px" :disabled="segmentSelected === 'incoming' ? !isIncomingOrdersScrollable : segmentSelected === 'readyForPickup' ? !isReadyForPickupOrdersScrollable : !isCompletedOrdersScrollable">
+      <ion-infinite-scroll @ionInfinite="loadMoreOrders($event)" threshold="100px" 
+        :disabled="segmentSelected === 'incoming' ? !isIncomingOrdersScrollable : segmentSelected === 'readyForPickup' ? !isReadyForPickupOrdersScrollable : !isCompletedOrdersScrollable"
+        :key="queryString">
         <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="translate('Loading')" />
       </ion-infinite-scroll>
     </ion-content>