Tech review changes

src/digital-components/button-question/button-question.vue

@@ -141,7 +141,7 @@ export default {
 
         const fieldOptions = {
             value: modelValue,
-            initialValue: modelValue,
+            initialValue: null,
         };
 
         const { errorMessage, handleBlur, handleChange, meta, validate, errors, resetField } =
@@ -255,10 +255,8 @@ export default {
         },
     },
     watch: {
-        modelValue(newValue) {
+        modelValue(newValue, oldValue) {
-            this.resetField({
+            this.resetField();
-                value: newValue,
-            });
         },
         answers() {
             //once we get the answers to display from parent, see if we need a GA event to log what we showed

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

@@ -151,7 +151,6 @@ export default {
             isRecalibrationServiceableMobile: null,
             selectedAppointmentType: this.getSelectedAppointmentType(),
             selectedProvider: this.getSelectedProvider(),
-            //selectedProviderNumber: this.getSelectedProvider().providerNumber,
             mobileFeePart: null,
             zipContainsMilitaryBase: false,
             zipCodeCtu: null,
@@ -336,6 +335,9 @@ export default {
                 this.zipContainsMilitaryBase = val;
             }
         },
+        setMobileFeePart(mobileFeePart) {
+            this.mobileFeePart = mobileFeePart;
+        },
         getServiceAddressFromStore() {
             return store.getters.order.serviceLocation.address;
         },
@@ -354,10 +356,7 @@ export default {
                 : store.getters.order.serviceLocation.appointmentType;
         },
         getSelectedProvider() {
-            return store.getters.order.serviceLocation.provider ?? null;
+            return store.getters.order.serviceLocation.provider;
-        },
-        setMobileFeePart(mobileFeePart) {
-            this.mobileFeePart = mobileFeePart;
         },
         resetMobileLocation() {
             this.streetAddress = "";
@@ -411,10 +410,14 @@ export default {
         async reloadShopData() {
             await this.$refs.shopQuestion.reloadShopData(this.zipCode);
         },
-        onProviderSelected(selectedProvider) {
-            this.selectedProvider = selectedProvider;
-        },
     },
+    // watch: {    
+    //     selectedAppointmentType: {
+    //         handler() {
+    //             this.selectedProvider = null;
+    //         }
+    //     }
+    // },
     components: {
         alert,
         serviceZipModalQuestion,

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

@@ -45,11 +45,13 @@ import textLink from "@/ux-components/text-link/text-link";
 import { storeActions } from "@/constants/store-actions.js";
 
 // Supporting files
-import { defineRule } from "vee-validate";
+import { defineRule, useField } from "vee-validate";
 import { required } from "@/helpers/validation-rules";
 import { errorMessages } from "@/constants/error-messages";
 import baseMixin from "@/mixins/base-mixin.js";
 import { nextTick } from "vue";
+import { deepClone } from "@/layouts/service-location/helpers/object-cloning-helper/object-cloning-helper";
+import { thisTypeAnnotation } from "@babel/types";
 
 defineRule("option-required", required(errorMessages.OPTION_REQUIRED));
 
@@ -68,6 +70,7 @@ export default {
     props: {
         modelValue: {
             type: Object,
+            default: () => (null)
         },
         serviceZipCode: String,
         selectedAppointmentType: String,
@@ -81,9 +84,10 @@ export default {
         },
         selectedValue: {
             get: function () {
-                return this.modelValue;
+                return this.modelValue?.providerNumber;
             },
             set: function (newValue) {
+                // Button Question only supports Number, String data types so we must get the full object to emit
                 const provider = this.getSelectedProviderObject(newValue);
                 this.$emit("update:modelValue", provider);
             },
@@ -165,11 +169,8 @@ export default {
         resetAnswers() {
             this.answers = [];
             this.shopIndex = 0;
-            this.selectedValue = "";
             
-            if (this.$refs.buttonQuestion) {
+
-                this.$refs.buttonQuestion.resetField();
-            }
         },
         async reloadShopData(serviceZipCode) {
             const result = await this.loadData(serviceZipCode);
@@ -181,7 +182,6 @@ export default {
             await this.getNextShopsFromList();
         },
         getSelectedProviderObject(providerNumber) {
-            // Button Question only supports primitive values so we must get the full object
             const provider = this.shopProviders?.find(
                 (provider) => provider.providerNumber == providerNumber
             );
@@ -203,6 +203,12 @@ export default {
 
                 await this.$nextTick();
 
+                this.selectedValue = null;
+
+                this.$refs.buttonQuestion?.resetField();
+
+                await this.$nextTick();
+
                 if (newValue !== "Mobile") {
                     await this.getNextShopsFromList();
                 }
@@ -210,8 +216,6 @@ export default {
         },
         shopProviders: {
             async handler(newValue) {
-                this.resetAnswers();
-
                 await this.$nextTick();
 
                 if (this.selectedAppointmentType) {