Merge pull request #2216 from Safelite/feature/CASH-77-again

Feature/cash 77 again - Updates to wait until SaveQuote calls are complete before showing success message

src/fmg-components/save-progress-modal-question/save-progress-modal-question.vue

@@ -37,6 +37,7 @@ import modal from "@/digital-components/modal/modal";
 import { storeActions } from "@/constants/store-actions.js";
 import buttonMain from "@/ux-components/button-main/button-main";
 import alert from "@/ux-components/alert/alert";
+import { saveQuote } from "@/helpers/heritage-integration/order-helper.js";
 
 export default {
     name: "save-progress-modal-question",
@@ -88,13 +89,16 @@ export default {
             // save email address to store
             await this.dispatchStoreAction(storeActions.SAVE_EMAIL, this.userInput, false);
 
+            // send store call to send to new API (that triggers an email send)
+            await saveQuote({ pageNameToLog: this.pageName });
+
             // hide save progress button; show success message alert
             this.isProgressSaved = true;
-
+            
+            // communicate to parent the new status
+            this.$emit("save-progress-saved");
+            
             this.modal.closeModal();
-
-            // send store call to send to new API (that triggers an email send)
-            this.$emit("save-progress");
         },
     },
 

src/fmg-components/save-progress-popup-question/save-progress-popup-question.vue

@@ -38,6 +38,7 @@ import modal from "@/digital-components/modal/modal";
 import { storeActions } from "@/constants/store-actions.js";
 import buttonMain from "@/ux-components/button-main/button-main";
 import alert from "@/ux-components/alert/alert";
+import { saveQuote } from "@/helpers/heritage-integration/order-helper.js";
 
 export default {
     name: "save-progress-popup-question",
@@ -99,15 +100,14 @@ export default {
             // save email address to store
             await this.dispatchStoreAction(storeActions.SAVE_EMAIL, this.userInput, false);
 
+            // send store call to send to new API (that triggers an email send)
+            await saveQuote({ pageNameToLog: this.pageName });
+
             // hide save progress button; show success message alert
             this.isProgressSaved = true;
 
-            // send store call to send to new API (that triggers an email send)
+            // communicate to parent the new status
-            this.$emit("save-progress");
+            this.$emit("save-progress-saved");
-
-            // send call to close popup
-            this.closeModal();
-            this.$emit("close-save-progress-popup");
         },
     },
 

src/layouts/capability-questions/capability-questions.vue

@@ -16,8 +16,8 @@
             <!-- save progress goes into <slot> on questions-page-layout -->
             <saveProgressModalQuestion
                 modalWidgetName="SaveProgressModalWidget"
-                v-if="!isEmailInStoreOnPageLoad"
+                pageName="capability-questions"
-                @save-progress="saveProgress" />
+                v-if="showSaveProgressModal" />
         </questions-page-layout>
     </Form>
 </template>
@@ -38,7 +38,6 @@ import { required } from "@/helpers/validation-rules";
 import { errorMessages } from "@/constants/error-messages";
 import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
 import baseMixin from "@/mixins/base-mixin.js";
-import { saveQuote } from "@/helpers/heritage-integration/order-helper.js";
 
 // DEFINE VALIDATION RULES
 defineRule("questions-required", required(errorMessages.OPTION_REQUIRED));
@@ -65,7 +64,7 @@ export default {
         // Call the "next" function to complete the transition to this page.
         next(async (vm) => {
             vm.setCmsContent(resultMap.cmsContent);
-            vm.isEmailInStoreOnPageLoad = emailFromStore?.length > 0;
+            vm.showSaveProgressModal = !(emailFromStore?.length > 0);
             if (store.getters.externalParameterState?.isExternalParameter) {
                 if (store.getters.externalParameterServiceZip.zipCode) {
                     await baseMixin.methods.dispatchStoreAction(
@@ -87,7 +86,7 @@ export default {
             questionsData: null,
             selectedAnswers: {},
             currentGlassIndex: 0,
-            isEmailInStoreOnPageLoad: null,
+            showSaveProgressModal: null,
         };
     },
     computed: {
@@ -157,9 +156,6 @@ export default {
                 this.questionsData
             );
         },
-        saveProgress() {
-            saveQuote({ pageNameToLog: "capability-questions" });
-        },
         async forwardButtonAction() {
             const questionAnswersArray = this.questionsData.map((glass) => {
                 // get answerResult2 of returned answer

src/layouts/molding-questions/molding-questions.vue

@@ -16,8 +16,8 @@
             <!-- save progress goes into <slot> on questions-page-layout -->
             <saveProgressModalQuestion
                 modalWidgetName="SaveProgressModalWidget"
-                v-if="!isEmailInStoreOnPageLoad"
+                pageName="molding-questions"
-                @save-progress="saveProgress" />
+                v-if="showSaveProgressModal" />
         </questions-page-layout>
     </Form>
 </template>
@@ -38,7 +38,6 @@ import { required } from "@/helpers/validation-rules";
 import { errorMessages } from "@/constants/error-messages";
 import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
 import baseMixin from "@/mixins/base-mixin.js";
-import { saveQuote } from "@/helpers/heritage-integration/order-helper.js";
 
 // DEFINE VALIDATION RULES
 defineRule("questions-required", required(errorMessages.OPTION_REQUIRED));
@@ -65,7 +64,7 @@ export default {
         // Call the "next" function to complete the transition to this page.
         next(async (vm) => {
             vm.setCmsContent(resultMap.cmsContent);
-            vm.isEmailInStoreOnPageLoad = emailFromStore?.length > 0;
+            vm.showSaveProgressModal = !(emailFromStore?.length > 0);
             if (store.getters.externalParameterState?.isExternalParameter) {
                 if (store.getters.externalParameterServiceZip.zipCode) {
                     await baseMixin.methods.dispatchStoreAction(
@@ -88,7 +87,7 @@ export default {
             questionsData: null,
             selectedAnswers: {},
             currentGlassIndex: 0,
-            isEmailInStoreOnPageLoad: null,
+            showSaveProgressModal: null,
         };
     },
     computed: {
@@ -157,9 +156,6 @@ export default {
                 this.questionsData
             );
         },
-        saveProgress() {
-            saveQuote({ pageNameToLog: "molding-questions" });
-        },
         async forwardButtonAction() {
             const questionAnswersArray = this.questionsData.map((glass) => {
                 return {

src/layouts/part-questions/part-questions.vue

@@ -16,8 +16,8 @@
             <!-- save progress goes into <slot> on questions-page-layout -->
             <saveProgressModalQuestion
                 modalWidgetName="SaveProgressModalWidget"
-                v-if="!isEmailInStoreOnPageLoad"
+                pageName="part-questions"
-                @save-progress="saveProgress" />
+                v-if="showSaveProgressModal" />
         </questions-page-layout>
     </Form>
 </template>
@@ -38,7 +38,6 @@ import { required } from "@/helpers/validation-rules";
 import { errorMessages } from "@/constants/error-messages";
 import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
 import baseMixin from "@/mixins/base-mixin.js";
-import { saveQuote } from "@/helpers/heritage-integration/order-helper.js";
 
 // DEFINE VALIDATION RULES
 defineRule("questions-required", required(errorMessages.OPTION_REQUIRED));
@@ -65,7 +64,7 @@ export default {
         // Call the "next" function to complete the transition to this page.
         next(async (vm) => {
             vm.setCmsContent(resultMap.cmsContent);
-            vm.isEmailInStoreOnPageLoad = emailFromStore?.length > 0;
+            vm.showSaveProgressModal = !(emailFromStore?.length > 0);
             if (store.getters.externalParameterState?.isExternalParameter) {
                 if (store.getters.externalParameterServiceZip.zipCode) {
                     const serviceState = store.getters.order.serviceLocation.state;
@@ -89,7 +88,7 @@ export default {
             questionsData: null,
             selectedAnswers: {},
             currentGlassIndex: 0,
-            isEmailInStoreOnPageLoad: null,
+            showSaveProgressModal: null,
         };
     },
     computed: {
@@ -156,9 +155,6 @@ export default {
                 this.questionsData
             );
         },
-        saveProgress() {
-            saveQuote({ pageNameToLog: "part-questions" });
-        },
         async forwardButtonAction() {
             const questionAnswersArray = this.questionsData.map((glass) => {
                 return {

src/layouts/quote/quote.vue

@@ -82,8 +82,9 @@
                     <saveProgressModalQuestion
                         modalWidgetName="SaveProgressModalWidget"
                         modalName="SaveProgressModal"
-                        v-if="!isEmailInStoreOnPageLoad"
+                        v-if="showSaveProgressModal"
-                        @save-progress="saveProgress" />
+                        pageName="quote"
+                        @save-progress-saved="updateSaveProgressAsSaved" />
 
                     <textBlock
                         cmsWidgetName="quoteDisclaimer"
@@ -98,9 +99,10 @@
                     <saveProgressPopupQuestion
                         modalWidgetName="SaveProgressPopupWidget"
                         modalName="SaveProgressPopup"
-                        v-if="!isEmailInStoreOnPageLoad && showSaveProgressPopup"
+                        pageName="quote"
+                        v-if="showSaveProgressPopup"
                         :showSaveProgressPopup="showSaveProgressPopup"
-                        @save-progress="saveProgress"
+                        @save-progress-saved="updateSaveProgressAsSaved"
                         @close-save-progress-popup="closeSaveProgressPopup" />
                 </div>
             </div>
@@ -209,6 +211,7 @@ export default {
         const emailFromStore = store.getters.order.customer.emailAddress;
         const isEmailInStoreOnPageLoad = emailFromStore?.length > 0;
         const showSaveProgressPopup = isEmailInStoreOnPageLoad ? false : true;
+        const showSaveProgressModal = isEmailInStoreOnPageLoad ? false : true;
 
         const lineItems = deepClone(store.getters.order.lineItems);
         lineItems.vaps = lineItems.vaps ?? [];
@@ -290,8 +293,8 @@ export default {
         // Call the "next" function to complete the transition to this page.
         next(async (vm) => {
             vm.setCmsContent(resultMap.cmsContent);
-            vm.isEmailInStoreOnPageLoad = isEmailInStoreOnPageLoad;
             vm.showSaveProgressPopup = showSaveProgressPopup;
+            vm.showSaveProgressModal = showSaveProgressModal;
             vm.addableVaps = addableVaps;
             vm.lineItems = lineItems;
             vm.availableLineItems = pricingResults;
@@ -438,8 +441,9 @@ export default {
             servicePackage: null,
             holdParentAccountNumber: null,
             holdBillToAccountNumber: null,
-            isEmailInStoreOnPageLoad: null,
             showSaveProgressPopup: null,
+            showSaveProgressModal: null,
+            isSaveProgressComplete: null,
         };
     },
     mounted() {
@@ -529,10 +533,8 @@ export default {
         backButtonAction() {
             vehicleQuestionsMixin.methods.navigateBack(this);
         },
-        saveProgress() {
+        updateSaveProgressAsSaved() {
-            this.isEmailInStoreOnPageLoad = true;
+            this.showSaveProgressModal = false;
-            this.showSaveProgressPopup = false;
-            saveQuote({ pageNameToLog: "quote" });
         },
         closeSaveProgressPopup() {
             this.showSaveProgressPopup = false;

src/layouts/vehicle-parts/vehicle-parts.vue

@@ -48,8 +48,8 @@
 
                         <saveProgressModalQuestion
                             modalWidgetName="SaveProgressModalWidget"
-                            v-if="!isEmailInStoreOnPageLoad"
+                            pageName="vehicle-parts"
-                            @save-progress="saveProgress" />
+                            v-if="showSaveProgressModal" />
                     </div>
                 </div>
             </div>
@@ -75,7 +75,6 @@ import store from "@/store";
 import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
 import baseMixin from "@/mixins/base-mixin.js";
 import { partTypeStrings } from "@/constants/part-type-strings";
-import { saveQuote } from "@/helpers/heritage-integration/order-helper.js";
 
 export default {
     name: "vehicle-parts",
@@ -95,7 +94,7 @@ export default {
         // Call the "next" function to complete the transition to this page.
         next((vm) => {
             vm.setCmsContent(resultMap.cmsContent);
-            vm.isEmailInStoreOnPageLoad = emailFromStore?.length > 0;
+            vm.showSaveProgressModal = !(emailFromStore?.length > 0);
             // Glass Part Question dynamic component
             Object.keys(vm.$refs)
                 .filter((r) => r.includes(vm.RefPrefix) && vm.$refs[r][0] !== undefined)
@@ -115,7 +114,7 @@ export default {
             selectedGlassParts: {},
             alertWidgetData: Object,
             alreadyPopulatedPartsData: [],
-            isEmailInStoreOnPageLoad: null,
+            showSaveProgressModal: null,
         };
     },
     computed: {
@@ -234,9 +233,6 @@ export default {
                 });
             });
         },
-        saveProgress() {
-            saveQuote({ pageNameToLog: "vehicle-parts" });
-        },
     },
     mounted() {
         this.LoadInitialPartsData();