Merge pull request #64 from hotwax/57_virtual_facilities

Improved: Added pagination and improved logic.

src/services/FacilityService.ts

@@ -1,6 +1,7 @@
 import { api, hasError } from '@/adapter';
 import logger from '@/logger';
 import { DateTime } from 'luxon';
+import { prepareOrderQuery } from '@/utils/solrHelper';
 
 const createFacilityPostalAddress = async (payload: any): Promise<any> => {
   return api({
@@ -397,19 +398,82 @@ const removeFacilityCalendar = async (payload: any): Promise<any> => {
   })
 }
 
-const fetchJobs = async(payload: any): Promise <any> => {
-  return api({
-    url: "performFind",
-    method: "post",
-    data: payload
-  });
+const fetchJobData = async(): Promise <any> => {
+  const payload = {
+    inputFields: {
+      "statusId": "SERVICE_PENDING",
+      "systemJobEnumId": ["JOB_RLS_ORD_DTE", "JOB_BKR_ORD"],
+      "systemJobEnumId_op": "in",
+    },
+    orderBy: "runTime ASC",
+    entityName: "JobSandbox",
+    fieldList: ["jobId", "statusId", "serviceName", "systemJobEnumId", "runTime"],
+    viewSize: 10
+  }
+
+  try {
+    const resp = await api({
+      url: "performFind", 
+      method: "post",
+      data: payload
+    }) as any;
+
+    if (!hasError(resp) && resp.data.count > 0) {
+      const jobs = resp.data.docs;
+      const brokeringJob = jobs.find((job: any) => job.systemJobEnumId === 'JOB_BKR_ORD');
+      const autoReleaseJob = jobs.find((job: any) => job.systemJobEnumId === 'JOB_RLS_ORD_DTE');
+      return { brokeringJob, autoReleaseJob };
+    } else {
+      throw resp.data;
+    }
+  } catch(err) {
+    logger.error(err);
+  }
 }
-const fetchOrderCountsByFacility = async (query: any): Promise<any> => {
-  return api({
-    url: "solr-query",
-    method: "post",
-    data: query
-  });
+const fetchOrderCountsByFacility = async (facilityIds: Array<string>): Promise<any> => {
+  try {
+    const query = prepareOrderQuery({
+      viewSize: "0",  // passing viewSize as 0, as we don't want to fetch any data
+      sort: 'orderDate asc',
+      defType: "edismax",
+      docType: "ORDER",
+      filters: {
+        '-shipmentMethodTypeId': { value: 'STOREPICKUP' },
+        orderStatusId: { value: '(ORDER_APPROVED OR ORDER_CREATED)' },
+        orderTypeId: { value: 'SALES_ORDER' },
+        facilityId: { value: facilityIds }
+      },
+      facet: {
+        "facilityFacet": {
+          "field": "facilityId",
+          "mincount": 1,
+          "limit": -1,
+          "sort": "index",
+          "type": "terms",
+          "facet": {
+            "groups": "unique(orderId)",
+          }
+        }
+      }
+    })
+    const resp = await api({
+      url: "solr-query",
+      method: "post",
+      data: query
+    }) as any;
+    if (!hasError(resp)) {
+      const facilityFacets = resp.data.facets.facilityFacet.buckets;
+      const facilityOrderCounts = facilityFacets.reduce((countObject: any, facet: any) => {
+        countObject[facet.val] = facet.groups;
+        return countObject;
+      }, {});
+      return facilityOrderCounts;
+    } else {
+      throw resp.data;
+    }
+  } catch(error) {
+    logger.error(error);
+  }
 }
 
 export const FacilityService = {
@@ -437,7 +501,7 @@ export const FacilityService = {
   fetchFacilityMappings,
   fetchFacilityOrderCounts,
   fetchFacilityPrimaryMember,
-  fetchJobs,
+  fetchJobData,
   fetchOrderCountsByFacility,
   getFacilityProductStores,
   fetchShopifyFacilityMappings,

src/store/modules/facility/actions.ts

@@ -434,8 +434,9 @@ const actions: ActionTree<FacilityState, RootState> = {
     commit(types.FACILITY_SHOPIFY_MAPPINGS_UPDATED, shopifyFacilityMappings)
   },
 
-  async fetchVirtualFacilities({ commit, dispatch }) {
-    let facilities = [], total = 0; 
+  async fetchVirtualFacilities({ commit, dispatch, state }, payload) {
+    let facilities = [], total = 0;
+    if (payload.viewIndex === 0) emitter.emit("presentLoader"); 
 
     try {
       const params = {
@@ -445,14 +446,16 @@ const actions: ActionTree<FacilityState, RootState> = {
         orderBy: "facilityName ASC",
         entityName: "FacilityAndProductStore",
         fieldList: ["facilityId", "facilityName", "description", "facilityTypeId", "parentFacilityTypeId"],
-        viewSize: 100
+        ...payload
       }
 
       const resp = await FacilityService.fetchFacilities(params)
 
       if (!hasError(resp) && resp.data.count) {
         facilities = resp.data.docs
         total = resp.data.count
+
+        if (payload.viewIndex && payload.viewIndex > 0) facilities = JSON.parse(JSON.stringify(state.virtualFacilities.list)).concat(facilities)
       } else {
         throw resp.data
       }
@@ -468,85 +471,45 @@ const actions: ActionTree<FacilityState, RootState> = {
       return secondFacilityOrder - firstFacilityOrder;
     });
 
+    emitter.emit("dismissLoader");
     commit(types.FACILITY_VIRTUAL_FACILITY_LIST_UPDATED , { facilities, total });
     if (facilities.length) {
-      await dispatch('fetchVirtualFacilitiesAdditionalDetail')
+      await dispatch('fetchVirtualFacilitiesAdditionalDetail', payload)
     }
   },
 
-  async fetchVirtualFacilitiesAdditionalDetail({ commit, state }) {
-    let facilities = state.virtualFacilities.list;
+  async fetchVirtualFacilitiesAdditionalDetail({ commit, state }, payload) {
+    // getting all the facilties from state
+    const cachedFacilities = JSON.parse(JSON.stringify(state.virtualFacilities.list)); // maintaining cachedFacilities as to prepare the facilities payload to fetch additional information
+    let stateFacilities = JSON.parse(JSON.stringify(state.virtualFacilities.list)); // maintaining stateFacilities as to update the facility information once information in fetched
+    const total = state.virtualFacilities.total
 
-    try {
-      const params = {
-        inputFields: {
-          "statusId": "SERVICE_PENDING",
-          "systemJobEnumId": ["JOB_RLS_ORD_DTE", "JOB_BKR_ORD"],
-          "systemJobEnumId_op": "in",
-        },
-        orderBy: "runTime ASC",
-        entityName: "JobSandbox",
-        fieldList: ["jobId", "statusId", "serviceName", "systemJobEnumId", "runTime"],
-        viewSize: 10
-      }
+    const facilityIds: Array<string> = [];
 
-      let resp = await FacilityService.fetchJobs(params)
-      if (!hasError(resp) && resp.data.count) {
-        const jobs = resp.data.docs;
-        const brokeringJob = jobs.find((job: any) => job.systemJobEnumId === 'JOB_BKR_ORD');
-        const autoReleaseJob = jobs.find((job: any) => job.systemJobEnumId === 'JOB_RLS_ORD_DTE');
-
-        facilities.forEach((facility: any) => {
-          if (facility.facilityId === '_NA_') {
-            facility.brokeringJob = brokeringJob;
-          } else if (facility.facilityTypeId === 'BACKORDER') {
-            facility.autoReleaseJob = autoReleaseJob;
-          } else if (facility.facilityTypeId === 'PRE_ORDER') {
-            facility.autoReleaseJob = autoReleaseJob;
-          }
-        });
-      }
+    // splitting the facilities in batches to fetch the additional facilities information
+    const facilities = cachedFacilities.splice(payload.viewIndex * (process.env.VUE_APP_VIEW_SIZE as any), process.env.VUE_APP_VIEW_SIZE)
+    facilities.map((facility: any) => facilityIds.push(facility.facilityId))
 
-      const payload = prepareOrderQuery({
-        viewSize: "0",  // passing viewSize as 0, as we don't want to fetch any data
-        sort: 'orderDate asc',
-        defType: "edismax",
-        docType: "ORDER",
-        filters: {
-          '-shipmentMethodTypeId': { value: 'STOREPICKUP' },
-          orderStatusId: { value: '(ORDER_APPROVED OR ORDER_CREATED)' },
-          orderTypeId: { value: 'SALES_ORDER' },
-        },
-        facet: {
-          "facilityFacet": {
-            "field": "facilityId",
-            "mincount": 1,
-            "limit": -1,
-            "sort": "index",
-            "type": "terms",
-            "facet": {
-              "groups": "unique(orderId)",
-            }
-          }
+    stateFacilities = stateFacilities.filter((facility: any) => !facilityIds.includes(facility.facilityId))
+
+    try {
+      const [jobData, facilitiesOrderCount] = await Promise.all([FacilityService.fetchJobData(), FacilityService.fetchOrderCountsByFacility(facilityIds)])
+
+      facilities.map((facility: any) => {
+        if (facility.facilityId === '_NA_') {
+          facility.brokeringJob = jobData.brokeringJob;
+        } else if (facility.facilityTypeId === 'BACKORDER') {
+          facility.autoReleaseJob = jobData.autoReleaseJob;
+        } else if (facility.facilityTypeId === 'PRE_ORDER') {
+          facility.autoReleaseJob = jobData.autoReleaseJob;
         }
-      })
-      resp = await FacilityService.fetchOrderCountsByFacility(payload);
-      if (!hasError(resp)) {
-        const facilityFacets = resp.data.facets.facilityFacet.buckets;
-        const facilityOrderCounts = facilityFacets.reduce((countObject: any, facet: any) => {
-          countObject[facet.val] = facet.groups;
-          return countObject;
-        }, {});
+        facility.orderCount = facilitiesOrderCount[facility.facilityId] || 0
+      });
 
-        facilities = facilities.map((facility:any) => ({
-          ...facility,
-          orderCount: facilityOrderCounts[facility.facilityId] || 0
-        }));
-      }
     } catch(error) {
       logger.error(error)
     }
-    commit(types.FACILITY_VIRTUAL_FACILITY_LIST_UPDATED , { facilities });
+    commit(types.FACILITY_VIRTUAL_FACILITY_LIST_UPDATED , { facilities: stateFacilities.concat(facilities), total });
   }
 }
 

src/views/Parking.vue

@@ -25,7 +25,7 @@
                 </ion-item>
                 <ion-item lines="full">
                   <ion-label>{{ translate('Next brokering') }}</ion-label>
-                  <ion-note slot="end">{{ getDateTime(facility?.brokeringJob?.runTime) }}</ion-note>
+                  <ion-note slot="end">{{ facility?.brokeringJob?.runTime ? getDateTime(facility?.brokeringJob?.runTime) : '-' }}</ion-note>
                 </ion-item>
               </template>
               <ion-item v-else>
@@ -43,6 +43,16 @@
           </div>   
         </section>
       </main>
+      <ion-infinite-scroll
+        @ionInfinite="loadMoreFacilities($event)"
+        threshold="100px"
+        :disabled="!isScrollable"
+      >
+        <ion-infinite-scroll-content
+          loading-spinner="crescent"
+          :loading-text="translate('Loading')"
+        />
+      </ion-infinite-scroll>
     </ion-content>
   </ion-page>
 </template>
@@ -85,14 +95,34 @@ export default defineComponent({
   computed: {
     ...mapGetters({
       virtualFacilities: 'facility/getVirtualFacilities',
+      isScrollable: "facility/isScrollable",
     })
   },
-  async ionViewWillEnter() {
-    await this.store.dispatch('facility/fetchVirtualFacilities')
+  async mounted() {
+    await this.fetchFacilities();
   },
   methods: {
     getDateTime(time: any) {
       return DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED);
+    },
+    async fetchFacilities(vSize?: any, vIndex?: any) {
+      const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
+      const viewIndex = vIndex ? vIndex : 0;
+      const payload = {
+        viewSize,
+        viewIndex
+      };
+      await this.store.dispatch('facility/fetchVirtualFacilities', payload)
+    },
+    async loadMoreFacilities(event: any) {
+      this.fetchFacilities(
+        undefined,
+        Math.ceil(
+          this.virtualFacilities?.length / (process.env.VUE_APP_VIEW_SIZE as any)
+        ).toString()
+      ).then(() => {
+        event.target.complete();
+      });
     }
   },
   setup() {