Merge branch 'develop' into feature/digital/SSR-540

# Conflicts:
#	src/layouts/coverage-statement/coverage-statement.vue

src/digital-components/base-input-button/base-input-button.vue

@@ -121,9 +121,7 @@ export default {
             return this.isMultiSelect ? "checkbox" : "radio";
         },
         buttonId() {
-            return `${this.groupName?.replace(" ", "-")}-${this.value
+            return `${this.groupName}-${this.value}`.replaceAll(" ", "-");
-                ?.toString()
-                ?.replace(" ", "-")}`;
         },
         isValueSelectedOnClick() {
             return this.isMultiSelect || this.selectingInitiatesLoad;

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

@@ -31,7 +31,7 @@
                     <div
                         :class="getComponentWrapperClasses"
                         v-for="answer in buttonsInfo"
-                        :key="answer.value ? answer.value : answer">
+                        :key="answer.value ?? answer">
                         <component
                             :is="buttonTypeString"
                             :buttonLabel="answer.buttonLabel"

src/digital-components/modal/modal.vue

@@ -23,7 +23,7 @@
                         @keypress.space="closeModal"
                         aria-label="Close"></button>
                 </div>
-                <div class="modal-body ps-5 pe-5 pb-4 pt-0">
+                <div class="modal-body ps-5 pe-5 pb-5 pt-0">
                     <slot></slot>
                 </div>
                 <div class="modal-footer px-5 py-4">

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

@@ -1,6 +1,7 @@
 <template>
     <div class="textbox-question" :class="(errors && errors.length) || hasError ? 'has-error' : ''">
         <label
+            v-if="displayQuestionText"
             :for="inputId"
             :aria-label="questionText"
             class="form-label"
@@ -66,6 +67,10 @@ export default {
             type: String,
             default: "",
         },
+        displayQuestionText: {
+            type: Boolean,
+            default: true,
+        },
         modelValue: String,
         inputId: {
             type: String,

src/iss-components/questions-page-layout/questions-page-layout.vue

@@ -29,7 +29,7 @@
                                     :validationRules="validationRules" />
                                 </div>
                                 <siteFooter
-                                class="mt-3"
+                                class="mt-5"
                                 ref="siteFooter"
                                 cmsWidgetName="SiteFooterWidget"
                                 :isForwardActionDisabled="!isMetaValid"

src/layouts/coverage-statement/coverage-statement.vue

@@ -32,6 +32,7 @@
                                   
                               </div>
                               <siteFooter
+                                class="mt-5"
                                 cmsWidgetName="SiteFooterWidget"
                                 :isForwardActionDisabled="!meta.valid"
                                 @backClicked="navigateBack"
@@ -81,14 +82,6 @@ export default {
       recalModal,
       steeringText
   },
-  data () {
-    return {
-        isITAC: false,
-        deductible: "",
-        policyVehicles: useMainStore().pageData(issPageValues.POLICY_VEHICLES),
-        isVerified: useMainStore().order.payment.insuranceCoverage.isVerified,
-    }
-  },
   mounted() { 
     setupModalLinks(this);
     this.getPriceInfo();
@@ -239,55 +232,17 @@ export default {
       });
   },
   methods: {
-    processIfStatements,
-    getSubheaderTextFromCms(cmsWidgetName) {
-      const subHeader = this.getCmsContent(cmsWidgetName, 'SubHeaderText');
-      return this.processIfStatements(subHeader, "custom", this.getCustomValueFromString);
-    },
-    getBodyTextFromCms(cmsWidgetName) {
-      const bodyText = this.getCmsContent(cmsWidgetName, "BodyText");
-      return this.processIfStatements(bodyText, "custom", this.getCustomValueFromString);
-    },
-    getSecondaryTextFromCms(cmsWidgetName) {
-      const secondaryText = this.getCmsContent(cmsWidgetName, "SecondaryText");
-      return this.processIfStatements(secondaryText, "custom", this.getCustomValueFromString);
-    },
       arePagePrerequisitesValid() {
           if (useMainStore().vehicle.vin) {
               return true;
           }
           return false;
       },
-    getCustomValueFromString(str) {
-      switch (str) {
-        case 'coverageUnverified':
-          return this.coverageUnverified;
-        case 'verifiedDeductible':
-          return this.verifiedDeductible;
-        case 'verifiedITAC':
-          return this.verifiedITAC;
-        case 'verifiedNoComp':
-          return this.verifiedNoComp;
-        case 'ADASReplace':
-          return this.ADASReplace;
-        case 'nonADASReplace':
-          return this.nonADASReplace;
-        case 'nonADASRepair':
-          return this.nonADASRepair;
-        default:
-          return null;
-      }
-    },
-    getPriceInfo() {
-      const servicePrice = store.getPriceOrderItems();
       
-      if (servicePrice > this.vehicleDeductible) {
-        return this.isITAC = true;
-      }
-    },
       async forwardButtonAction() {
           return this.navigateForward();
       },
+
       navigateForward() {
           this.$router.navigate(
               this.navigationScenarios.CLICKED_FORWARD,

src/layouts/policy-vehicles/policy-vehicles.vue

@@ -193,12 +193,12 @@ export default {
                     const vehicle = await this.lookupVehicleByVin(value);
 
                     // handle error in case vehicle info doesn't come back for selected VIN
-                    if (vehicle?.error ?? true) {
+                    if (vehicle?.error === true) {
                       this.mainStore.resetVehicleState();
                       this.displayGeneric = true;
                       return;
                     } 
-
+                    if (vehicle) {
                       // save selected vehicle to the store
                       this.mainStore.updateVehicle(vehicle.data);
                       this.displayGeneric = true;
@@ -207,13 +207,13 @@ export default {
                       const styleOptions = await this.mainStore.getVehicleStyles(
                         vehicle.data.year,
                         vehicle.data.make,
-                        vehicle.data.model
+                        vehicle.data.model,
-                    )
+                      );
-
                       // if there is more than 1 style for the selected vehicle, display generic/blurred image
                       this.displayGeneric = styleOptions?.data?.length > 1;
                     }
                 }
+            }
         },     
         components: {
             siteHeader,

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

@@ -31,12 +31,8 @@
                                         validationRules="selection-required"
                                         class="service-location-button-question mb-1"/>
                                         <div class="select-car">
-                                        <div class="container-fluid pb-2 g-0">
-                                            <div class="row">
-                                                <div class="col px-0">
-                                                    <div class="select-car-form rounded">
                                         <siteFooter
-                                                        class="mt-4"
+                                            class="mt-5"
                                             cmsWidgetName="SiteFooterWidget"
                                             :isForwardActionDisabled="!meta.valid"
                                             @backClicked="backButtonAction"
@@ -51,10 +47,6 @@
                 </div>
             </div>
         </div>
-                    </div>
-                </div>
-            </div>
-        </div>
     </Form>
 </template>
 <script>
@@ -81,7 +73,7 @@ import serviceZipModalQuestion from '@/layouts/service-location/service-zip-moda
 defineRule("selection-required", required(errorMessages.OPTION_REQUIRED));
 export default {
     name: "service-location",
-    mixins: [baseFormMixin, baseMixin],
+    mixins: [baseFormMixin],
     async beforeRouteEnter(to, from, next) {
         // Call APIs
         const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);

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

@@ -12,6 +12,7 @@
     </div>
     <modal
         :ref="modalName"
+        :headerText="modalHeaderText"
         :onModalOpenedCallback="onModalOpened"
         :onModalClosedCallback="onModalClosed"
         :footerButtonText="modalFooterText"

src/layouts/service-packages/service-packages.vue

@@ -8,7 +8,6 @@
                 issContainingPage="service-packages"
                 />
                 <div class="mx-5">
-            
                     <servicePackageQuestion ref="servicePackage"
                     cmsWidgetName="ServicePackage"
                     groupName="ServicePackageQuestion"
@@ -18,9 +17,7 @@
                     validationRules="option-required"
                     isRequired
                     />
-                    
                     <p class="caption disclaimer" v-html="PriceDisclaimerText"></p>
-                    
                     <siteFooter cmsWidgetName="SiteFooterWidget"
                     :isForwardActionDisabled="!meta.valid"
                     @back-clicked="backButtonAction"
@@ -177,7 +174,7 @@
         }
 
         .disclaimer {
-        margin-top: 1.3rem;
+            margin: 1.3rem 0 1.5rem 0;
 
             a {
                 color: #4D5151;

src/layouts/vehicle-lookup/vehicle-lookup.vue

@@ -11,7 +11,7 @@
                                     <VehicleBanner class="mt-2 mb-4" cms-widget-name="VehicleBannerWidget" :display-generic-vehicle-image="false" />
                                     <SiteSubHeader cms-widget-name="SiteSubHeaderWidget" class="mt-5 mb-2" />
                                     <VinLookupMethods v-model="selectedVinLookupMethod" cms-widget-name="VINLookupMethod" group-name="VinLookupMethods" ref="VinLookupMethods" />
-                                    <SiteFooter cms-widget-name="SiteFooterWidget" :is-forward-action-disabled="isForwardActionDisabled" @back-clicked="backButtonAction" @forward-clicked="forwardButtonAction" class="mt-3"/>
+                                    <SiteFooter cms-widget-name="SiteFooterWidget" :is-forward-action-disabled="isForwardActionDisabled" @back-clicked="backButtonAction" @forward-clicked="forwardButtonAction" class="mt-5"/>
                                 </div>
                             </div>
                         </div>

src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue

@@ -12,7 +12,7 @@
                     :isWide="true"
                     altText=""
                     isRequired
-                    :groupName="`${glassLocation}-${glassName}`"
+                    :groupName="replaceAllSpaceWithDash(`${glassLocation}-${glassName}`)"
                     :validationRules="tintValidationRules">
                     <div class="row my-2" aria-live="polite">
                         <div class="col">
@@ -27,7 +27,7 @@
                                 :loaderEnabled="false"
                                 isRequired
                                 isSmallQuestionText
-                                :groupName="`${glassLocation}-${glassName}-${selectedTint}`"
+                                :groupName="replaceAllSpaceWithDash(`${glassLocation}-${glassName}-${selectedTint}`)"
                                 :validationRules="partValidationRules" />
                         </div>
                     </div>
@@ -210,6 +210,10 @@ export default {
                 }
             });
         },
+
+        replaceAllSpaceWithDash(str) {
+            return String(str).replaceAll(" ", "-");
+        },
     },
     watch: {
         selectedTint() {

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

@@ -38,6 +38,7 @@
                                         :alreadyPopulatedPartsData="alreadyPopulatedPartsData" />
                                     </div>
                                     <siteFooter
+                                    class="mt-5"
                                     cmsWidgetName="SiteFooterWidget"
                                     ref="siteFooter"
                                     :isForwardActionDisabled="isForwardActionDisabled"

src/ux-components/radio/radio.vue

@@ -76,20 +76,26 @@ export default {
             value: inputValue,
             handleChange,
             errors,
+            resetField
         } = useField(props.groupName, props.validationRules,
         {
-                type: inputType,
+            type: inputType
-                checkedValue: props.value,
         });
+
         return {
             handleChange,
             errors,
+            resetField
         };
     },
+    unmounted(){
+        this.resetField();
+    }
 };
 </script>
 
 <style lang="scss" scoped>
+
 .form-check {
     position: relative;