diff --git a/src/views/AssignPickerModal.vue b/src/views/AssignPickerModal.vue index 36e71c3b4..b9a3b1d37 100644 --- a/src/views/AssignPickerModal.vue +++ b/src/views/AssignPickerModal.vue @@ -10,7 +10,7 @@ - +
{{ translate('No picker found') }}
@@ -27,16 +27,18 @@ { - event.target.complete(); + ).then(async () => { + await event.target.complete(); }); }, async getPicker(vSize, vIndex) { @@ -201,6 +215,9 @@ export default defineComponent({ // getting picker information on initial load await this.getPicker(); }, + async ionViewWillEnter() { + this.isScrollingEnabled = false; + }, setup() { const store = useStore(); diff --git a/src/views/Catalog.vue b/src/views/Catalog.vue index 9968a47af..4021c5ef7 100644 --- a/src/views/Catalog.vue +++ b/src/views/Catalog.vue @@ -5,7 +5,7 @@ {{ translate("Catalog") }} - +
@@ -24,8 +24,8 @@ { - event.target.complete(); + ).then(async () => { + await event.target.complete(); }); }, async getProducts(vSize?: any, vIndex?: any) { @@ -116,6 +128,7 @@ export default defineComponent({ }, async ionViewWillEnter() { + this.isScrollingEnabled = false; this.queryString = this.products.queryString; this.getProducts(); }, diff --git a/src/views/Orders.vue b/src/views/Orders.vue index ca6d32d3c..25608770c 100644 --- a/src/views/Orders.vue +++ b/src/views/Orders.vue @@ -28,7 +28,7 @@ - +
@@ -158,8 +158,8 @@ + v-show="isScrollingEnabled && (segmentSelected === 'open' ? isOpenOrdersScrollable : segmentSelected === 'packed' ? isPackedOrdersScrollable : isCompletedOrdersScrollable)" + ref="infiniteScrollRef"> @@ -259,7 +259,8 @@ export default defineComponent({ }, data() { return { - queryString: '' + queryString: '', + isScrollingEnabled: false } }, methods: { @@ -339,28 +340,39 @@ export default defineComponent({ await this.store.dispatch("order/getCompletedOrders", { viewSize, viewIndex, queryString: this.queryString, facilityId: this.currentFacility.facilityId }); }, + enableScrolling() { + const parentElement = (this as any).$refs.contentRef.$el + const scrollEl = parentElement.shadowRoot.querySelector("main[part='scroll']") + let scrollHeight = scrollEl.scrollHeight, infiniteHeight = (this as any).$refs.infiniteScrollRef.$el.offsetHeight, scrollTop = scrollEl.scrollTop, threshold = 100, height = scrollEl.offsetHeight + const distanceFromInfinite = scrollHeight - infiniteHeight - scrollTop - threshold - height + if(distanceFromInfinite < 0) { + this.isScrollingEnabled = false; + } else { + this.isScrollingEnabled = true; + } + }, async loadMoreProducts (event: any) { if (this.segmentSelected === 'open') { this.getPickupOrders( undefined, Math.ceil(this.orders.length / process.env.VUE_APP_VIEW_SIZE).toString() - ).then(() => { - event.target.complete(); - }) + ).then(async () => { + await event.target.complete(); + }); } else if (this.segmentSelected === 'packed') { this.getPackedOrders( undefined, Math.ceil(this.packedOrders.length / process.env.VUE_APP_VIEW_SIZE).toString() - ).then(() => { - event.target.complete(); - }) + ).then(async () => { + await event.target.complete(); + }); } else { this.getCompletedOrders( undefined, Math.ceil(this.completedOrders.length / process.env.VUE_APP_VIEW_SIZE).toString() - ).then(() => { - event.target.complete(); - }) + ).then(async () => { + await event.target.complete(); + }); } }, async readyForPickup (order: any, part: any) { @@ -406,7 +418,6 @@ export default defineComponent({ } }, async searchOrders() { - console.log('serach', this.queryString); if(this.segmentSelected === 'open') { this.getPickupOrders() } else if(this.segmentSelected === 'packed') { @@ -462,6 +473,7 @@ export default defineComponent({ } }, ionViewWillEnter () { + this.isScrollingEnabled = false; this.queryString = ''; if(this.segmentSelected === 'open') { diff --git a/src/views/ShipToStoreOrders.vue b/src/views/ShipToStoreOrders.vue index b8e8a79c5..d3e6371e9 100644 --- a/src/views/ShipToStoreOrders.vue +++ b/src/views/ShipToStoreOrders.vue @@ -20,7 +20,7 @@
- +
@@ -91,8 +91,8 @@ + v-show="isScrollingEnabled && (segmentSelected === 'incoming' ? isIncomingOrdersScrollable : segmentSelected === 'readyForPickup' ? isReadyForPickupOrdersScrollable : isCompletedOrdersScrollable)" + ref="infiniteScrollRef"> @@ -180,7 +180,8 @@ export default defineComponent({ }, data() { return { - queryString: '' + queryString: '', + isScrollingEnabled: false } }, methods: { @@ -214,28 +215,39 @@ export default defineComponent({ await this.store.dispatch("order/getShipToStoreCompletedOrders", { viewSize, viewIndex, queryString: this.queryString, facilityId: this.currentFacility.facilityId }); }, + enableScrolling() { + const parentElement = (this as any).$refs.contentRef.$el + const scrollEl = parentElement.shadowRoot.querySelector("main[part='scroll']") + let scrollHeight = scrollEl.scrollHeight, infiniteHeight = (this as any).$refs.infiniteScrollRef.$el.offsetHeight, scrollTop = scrollEl.scrollTop, threshold = 100, height = scrollEl.offsetHeight + const distanceFromInfinite = scrollHeight - infiniteHeight - scrollTop - threshold - height + if(distanceFromInfinite < 0) { + this.isScrollingEnabled = false; + } else { + this.isScrollingEnabled = true; + } + }, async loadMoreOrders (event: any) { if (this.segmentSelected === 'incoming') { this.getIncomingOrders( undefined, Math.ceil(this.incomingOrders.length / process.env.VUE_APP_VIEW_SIZE).toString() - ).then(() => { - event.target.complete(); - }) + ).then(async () => { + await event.target.complete(); + }); } else if (this.segmentSelected === 'packed') { this.getReadyForPickupOrders( undefined, Math.ceil(this.readyForPickupOrders.length / process.env.VUE_APP_VIEW_SIZE).toString() - ).then(() => { - event.target.complete(); - }) + ).then(async () => { + await event.target.complete(); + }); } else { this.getCompletedOrders( undefined, Math.ceil(this.completedOrders.length / process.env.VUE_APP_VIEW_SIZE).toString() - ).then(() => { - event.target.complete(); - }) + ).then(async () => { + await event.target.complete(); + }); } }, segmentChanged (event: CustomEvent) { @@ -391,6 +403,7 @@ export default defineComponent({ }, }, ionViewWillEnter() { + this.isScrollingEnabled = false; this.queryString = ''; if (this.segmentSelected === 'incoming') { this.getIncomingOrders()