Merge pull request #1013 from Safelite/feature/richardson/CSR-1064

Updates from TR

src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue

@@ -64,7 +64,7 @@ import { getPricedMobileFeePart } from "@/layouts/service-location/helpers/servi
 
 export default {
     name: "mobile-location-modal-questions",
-    emits: ["update:modelValue", "updated-mobile-fee-part"],
+    emits: ["update:modelValue", "updated-mobile-fee-part", "updated-contains-military-base"],
     data() {
         return {
             internalModel: deepClone(this.modelValue),
@@ -187,6 +187,7 @@ export default {
 
                 // Update the page level model
                 this.$emit("update:modelValue", this.internalModel);
+                this.$emit("updated-contains-military-base", zipCodeData.containsMilitaryBase);
                 this.closeModal();
             }
         },

src/layouts/service-location/service-location.spec.js

@@ -319,11 +319,15 @@ describe("service-location.vue", () => {
                 state: "OH",
             };
 
-            // Assert
-            wrapper.setData({ zipCode: newServiceZipCodeQuestion.zipCode });
-            wrapper.vm.$nextTick(() => {
-                expect(wrapper.vm.zipContainsMilitaryBase).toBe(true);
+            const serviceZipCodeComponent = wrapper.findComponent({
+                ref: "serviceZipCodeQuestion",
             });
+
+            // Act
+            serviceZipCodeComponent.vm.$emit("updated-contains-military-base", true);
+
+            // Assert
+            expect(wrapper.vm.zipContainsMilitaryBase).toBe(true);
         });
     });
 

src/layouts/service-location/service-location.vue

@@ -10,11 +10,12 @@
                 :mobileFeePart="mobileFeePart"
                 @updated-mobile-fee-part="setMobileFeePart"
                 linkWidgetName="ServiceZipLinkWidget"
-                modalWidgetName="ServiceZipModalWidget" />
+                modalWidgetName="ServiceZipModalWidget"
+                @updated-contains-military-base="setContainsMilitaryBase" />
             <alert
                 class="my-4"
                 cmsWidgetName="AlertMilitaryBaseZipWidget"
-                v-if="zipContainsMilitaryBase"
+                v-if="showMilitaryZipAlert"
                 alertClass="alert-warning" />
             <mobileLocationModalQuestions
                 v-model="mobileLocationQuestions"
@@ -22,11 +23,12 @@
                 @updated-mobile-fee-part="setMobileFeePart"
                 ref="mobileLocationModalQuestions"
                 linkWidgetName="MobileLocationLinkWidget"
-                modalWidgetName="MobileLocationModalWidget" />
+                modalWidgetName="MobileLocationModalWidget"
+                @updated-contains-military-base="setContainsMilitaryBase" />
             <funnel-footer
                 cmsWidgetName="FunnelFooterWidget"
                 ref="funnelFooter"
-                :isForwardActionDisabled="!meta.valid || shouldDisableForwardAction"
+                :isForwardActionDisabled="!meta.valid"
                 @back-clicked="backButtonAction"
                 @ForwardClicked="forwardButtonAction" />
         </div>
@@ -141,8 +143,11 @@ export default {
                 this.isVehicleProtected = newValue.isVehicleProtected;
             },
         },
-        shouldDisableForwardAction() {
-            return this.zipContainsMilitaryBase;
+        showMilitaryZipAlert() {
+            return (
+                this.zipContainsMilitaryBase &&
+                (this.isZipServiceableMobile == null || this.isZipServiceableMobile === true)
+            );
         },
     },
     methods: {
@@ -158,6 +163,11 @@ export default {
                 this.mobileFeePart = mobileFeePart;
             }
         },
+        setContainsMilitaryBase(val) {
+            if (this.zipContainsMilitaryBase !== val) {
+                this.zipContainsMilitaryBase = val;
+            }
+        },
         getServiceAddressFromStore() {
             return store.getters.order.serviceLocation.address;
         },
@@ -187,15 +197,6 @@ export default {
             navigateToHeritageFunnel({ loadingModal: this.$refs.loadingModal });
         },
     },
-    watch: {
-        zipCode(current, previous) {
-            if (current !== previous) {
-                baseMixin.methods.getZipCodeData(current).then((r) => {
-                    this.zipContainsMilitaryBase = r.containsMilitaryBase;
-                });
-            }
-        },
-    },
     components: {
         alert,
         serviceZipModalQuestion,

src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue

@@ -43,7 +43,7 @@ import { getPricedMobileFeePart } from "@/layouts/service-location/helpers/servi
 
 export default {
     name: "service-zip-modal-question",
-    emits: ["update:modelValue", "updated-mobile-fee-part"],
+    emits: ["update:modelValue", "updated-mobile-fee-part", "updated-contains-military-base"],
     data() {
         return {
             internalModel: this.copyModel(this.modelValue),
@@ -160,6 +160,8 @@ export default {
 
                 // Update the page level model
                 this.$emit("update:modelValue", this.internalModel);
+                this.$emit("updated-contains-military-base", zipCodeData.containsMilitaryBase);
+
                 this.closeModal();
             }
         },