WIP

src/layouts/service-location/appointment-type-question/appointment-type-question.vue

@@ -8,7 +8,7 @@
                 :answers="answersToDisplay"
                 :groupName="groupName"
                 buttonTypeString="listCard"
-                v-model="selectedValues"
+                v-model="selectedValue"
                 :suppressError="suppressError"
                 :validationRules="validationRules"
                 isRequired />
@@ -55,7 +55,7 @@ export default {
                   })
                 : [];
         },
-        selectedValues: {
+        selectedValue: {
             get: function () {
                 return this.modelValue;
             },

src/layouts/service-location/helpers/service-location-helper/service-location-helper.js

@@ -71,3 +71,18 @@ export async function getAvailabilityRating(
 
     return Promise.resolve(shopStatus);
 }
+
+// export function getMobileProvider(mobileProviderNumber) {
+//     const provider = {
+//         providerNumber: mobileProviderNumber,
+//         address: {
+//             streetAddress1: null,
+//             streetAddress2: null,
+//             city: null,
+//             state: null,
+//             zipCode: null,
+//             zipCodeCtu: null,
+//         },
+//     };
+//     return provider;
+// }

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

@@ -306,9 +306,10 @@ export default {
     margin-top: 0em;
 }
 
-#mobileLocationLinkPromptId {
+.update-mobile-location-text-link {
     white-space: pre-line;
 }
+
 .text-black {
     color: $black;
 }

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

@@ -31,7 +31,7 @@
                 class="my-5"
                 cmsWidgetName="AlertRecalNoMobileWidget"
                 v-if="displayRecalibrationWarning"
-                @text-link-clicked="openModalAction"
+                @text-link-clicked="openRecalibrationInformationModal"
                 alertClass="alert-warning" />
             <alert
                 ref="alertInshopOnly"
@@ -74,8 +74,9 @@
                 v-model="selectedProvider"
                 :selectedAppointmentType="selectedAppointmentType"
                 :isDisplayed="isShopQuestionDisplayed"
+                @updated-shop-list="setUpdatedShopList"
                 cmsWidgetName="ShopQuestionWidget" />
-            <contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" />
+            <contentGroupModal ref="recalibrationInformationModal" cmsWidgetName="RecalModal" />
             <funnel-footer
                 cmsWidgetName="FunnelFooterWidget"
                 ref="funnelFooter"
@@ -149,6 +150,7 @@ export default {
             mobileFeePart: null,
             zipContainsMilitaryBase: false,
             zipCodeCtu: null,
+            providerData: [],
         };
     },
     async beforeRouteEnter(to, from, next) {
@@ -302,6 +304,9 @@ export default {
         displayNoShopsAlert() {
             return !this.isServiceableInshop && !this.isServiceableMobile;
         },
+        recalibrationInformationModal() {
+            return this.$refs.recalibrationInformationModal;
+        },
     },
     methods: {
         arePagePrerequisitesValid() {
@@ -372,6 +377,15 @@ export default {
             this.isRecalibrationServiceableMobile =
                 serviceabilityDetails.isRecalibrationServiceableMobile;
         },
+        async reloadShopData(zipCode) {
+            await this.$refs.shopQuestion.reloadShopData(zipCode);
+        },
+        setUpdatedShopList(providerData) {
+            this.providerData = providerData;
+        },
+        openRecalibrationInformationModal() {
+            this.recalibrationInformationModal.openModal();
+        },
         backButtonAction() {
             this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);
         },
@@ -403,11 +417,24 @@ export default {
 
             this.$router.navigateWithSaving(this.navigationScenarios.CLICKED_FORWARD, this.$route);
         },
-        openModalAction(modalName) {
+    },
-            this.$refs[modalName].openModal();
+    watch: {
-        },
+        selectedAppointmentType: {
-        async reloadShopData() {
+            handler(newValue) {
-            await this.$refs.shopQuestion.reloadShopData(this.zipCode);
+                if (newValue === "Mobile") {
+                    this.selectedProvider = this.defaultProvider;
+                    this.selectedProvider.providerNumber = this.providerData.mobileProviderNumber;
+                }
+            },
+            providerData: {
+                handler(newValue) {
+                    if (newValue === "Mobile") {
+                        this.selectedProvider = this.defaultProvider;
+                        this.selectedProvider.providerNumber =
+                            this.providerData.mobileProviderNumber;
+                    }
+                },
+            },
         },
     },
     components: {

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

@@ -95,8 +95,10 @@ export default {
                 return this.selectedValue?.providerNumber;
             },
             set: function (newValue) {
+                console.log(`set: ${newValue}`);
                 // Button Question only supports Number, or String data types so we must get the full object to emit
-                this.selectedValue = this.getSelectedProviderObject(newValue);
+                this.selectedValue =
+                    this.getSelectedProviderObject(newValue) ?? this.defaultProvider;
             },
         },
         displayDropoffInformation() {
@@ -132,6 +134,7 @@ export default {
         },
         initializeComponent(shopQuestionInitialData) {
             this.shopProviders = shopQuestionInitialData.shopProviders;
+            this.$emit("updated-shop-list", shopQuestionInitialData);
         },
         async getNextShopsFromList(numberToGet = 3) {
             const shopIterator = (array, n) => {
@@ -195,16 +198,28 @@ export default {
         async reloadShopData(serviceZipCode) {
             const result = await this.loadData(serviceZipCode);
             this.initializeComponent(result.data);
-
+            console.log("reloadShopData");
             this.resetAnswers();
 
             await nextTick();
             await this.getNextShopsFromList();
         },
         getSelectedProviderObject(providerNumber) {
-            const provider = this.shopProviders?.find(
+            const defaultProvider = {
-                (provider) => provider.providerNumber == providerNumber
+                providerNumber: null,
-            );
+                address: {
+                    streetAddress1: null,
+                    streetAddress2: null,
+                    city: null,
+                    state: null,
+                    zipCode: null,
+                    zipCodeCtu: null,
+                },
+            };
+
+            const provider =
+                this.shopProviders?.find((provider) => provider.providerNumber == providerNumber) ??
+                defaultProvider;
 
             return provider;
         },
@@ -223,7 +238,9 @@ export default {
 
                 await nextTick();
 
-                this.selectedProviderNumber = null;
+                if (newValue !== "Mobile") {
+                    this.selectedProviderNumber = -1;
+                }
 
                 await nextTick();
 

src/store/index.js

@@ -1280,6 +1280,7 @@ export const actions = {
             ? convertGlassPieceToBackEndCompatibleFormat(order.damage.glassToReplace)
             : [];
         var payload = {
+            zipCode: order.serviceLocation.provider.zipCode,
             providerNumber: providerNumber,
             startDate: startDate,
             endDate: endDate,