Merge branch 'release/2024.12.03' into develop

src/fmg-components/cart/cart.vue

@@ -199,6 +199,7 @@ export default {
         shouldHideRecalibration: Boolean,
         isItac: Boolean,
         isNoComp: Boolean,
+        isExpandedOnLoad: Boolean,
     },
     data() {
         return {
@@ -217,7 +218,7 @@ export default {
             this.isExpanded = !this.isExpanded;
         },
         updateIsExpandedWithDefault() {
-            this.isExpanded = this.shouldHideRecalibration;
+            this.isExpanded = this.isExpandedOnLoad;
         },
         getVapsPrice(packageName) {
             const vapsItems = this.getVapsCartItemsForSelectedPackage(packageName);
@@ -331,9 +332,8 @@ export default {
     },
     computed: {
         isCartReadyToLoad() {
-            var myReturn = this.shouldHideRecalibration !== null;
             this.updateIsExpandedWithDefault();
-            return myReturn;
+            return this.isExpandedOnLoad !== null;
         },
         lineItems: {
             get: function () {
@@ -749,8 +749,12 @@ export default {
         recycleFeeCartItemName() {
             return this.getCmsContent("RecycleFeeTextWidget", "Text");
         },
-        requiresRecycleFeeCartItem() {
+        showRecycleFeeCartItem() {
-            return !this.isRepair;
+            if (!this.isInsurance || this.isItac || this.isNoComp) {  // CASH, ITAC, NOCOMP ORDERS
+                return !this.isRepair;
+            } else {
+                return false;
+            }
         },
         recycleFeeCartItem() {
             let cartItem = null;
@@ -759,7 +763,7 @@ export default {
                 (supportingItem) => supportingItem.partType == partTypeStrings.REPLACE_FEE
             );
 
-            if (!recycleFeeLineItem && this.requiresRecycleFeeCartItem) {
+            if (!recycleFeeLineItem && this.showRecycleFeeCartItem) {
                 recycleFeeLineItem = {
                     partNumber: partTypeStrings.RECYCLE_FEE,
                     partType: partTypeStrings.REPLACE_FEE,

src/layouts/confirmation/confirmation.vue

@@ -60,6 +60,7 @@
                                 :insuranceCompanyName="insuranceCompanyName"
                                 :showInsuranceCoverageAs="showInsuranceCoverageAs"
                                 :shouldHideRecalibration="shouldHideRecalibration"
+                                :isExpandedOnLoad="false"
                                 :isItac="isItac"
                                 :isNoComp="isNoComp" />
 
@@ -111,6 +112,8 @@ import { containsRecalParts } from "@/helpers/recal-helper.js";
 export default {
     name: "confirmation",
     async beforeRouteEnter(to, from, next) {
+        const hasRecalPriceRemoveExperiment = await store.getters.shouldHideRecalibration;
+
         await baseMixin.methods.dispatchStoreAction(storeActions.CREATE_SUBMITTED_ORDER); // This nulls the Store order
 
         // Call APIs
@@ -155,10 +158,6 @@ export default {
         const isNoComp = submittedOrder?.policy?.isNoComp;
         const isItac = submittedOrder?.policy?.isItac;
         const isRecalibrationOnOrder = containsRecalParts(lineItemsFromSubmittedOrder);
-        const hasRecalPriceRemoveExperiment =
-            experimentMixin.methods
-                .getSettingValue(experimentSettings.RECAL_PRICE_REMOVE)
-                ?.toLowerCase() === "true";
 
         const shouldHideRecalibration = () => {
             if (isNoComp || isItac) {

src/layouts/payment-method/payment-method.vue

@@ -31,6 +31,7 @@
                         :insuranceCompanyName="insuranceCompanyName"
                         :showInsuranceCoverageAs="showInsuranceCoverageAs"
                         :shouldHideRecalibration="shouldHideRecalibration"
+                        :isExpandedOnLoad="false"
                         :isItac="isItac"
                         :isNoComp="isNoComp" />
 
@@ -46,7 +47,7 @@
                             v-bind:isDismissible="false" />
                     </div>
 
-                    <div v-if="!isInsurance" class="questions-about-service my-5">
+                    <div v-if="isRecalibrationOnOrder && shouldHideRecalibration" class="questions-about-service my-5">
                         <textBlock
                             cmsWidgetName="QuestionsAboutYourServiceWidget"
                             justifyText="left"
@@ -54,8 +55,7 @@
                         <textBlock cmsWidgetName="CallOrTextWidget" justifyText="left" />
                         <hr class="my-5" />
                         <div
-                            class="d-flex flex-row checkbox-group"
+                            class="d-flex flex-row checkbox-group">
-                            v-if="isRecalibrationOnOrder && shouldHideRecalibration">
                             <checkboxQuestion
                                 cmsWidgetName="RecalConfirmWidget"
                                 class="mb-5"

src/layouts/payment/payment.vue

@@ -59,7 +59,8 @@
                         :insuranceCompanyName="insuranceCompanyName"
                         :showInsuranceCoverageAs="showInsuranceCoverageAs"
                         :isItac="isItac"
-                        :isNocomp="isNocomp" />
+                        :isNocomp="isNocomp"
+                        :isExpandedOnLoad="true" />
 
                     <hr class="mb-5" />
 

src/layouts/quote/quote.vue

@@ -429,7 +429,11 @@ export default {
         },
         shouldHideRecalibration() {
             if (this.isInsuranceSelected) return false;
-            return (experimentMixin.methods.getSettingValue(experimentSettings.RECAL_PRICE_REMOVE)?.toLowerCase() === "true" && this.isRecalibrationOnOrder);
+            return (
+                experimentMixin.methods
+                    .getSettingValue(experimentSettings.RECAL_PRICE_REMOVE)
+                    ?.toLowerCase() === "true" && this.isRecalibrationOnOrder
+            );
         },
         showAfterpayBanner() {
             return (

src/layouts/vehicle-damage/vehicle-damage.vue

@@ -436,7 +436,6 @@ export default {
                 policy.policyNumber !== "";
 
             const skipVin = await skipVinLookup();
-
             if (vehicleChangedDuringPolicyLookupInHeritage) {
                 if (skipVin) {
                     this.$router.navigateWithSaving(
@@ -455,13 +454,22 @@ export default {
                             { [routerParams.DISPLAY_VEHICLE_CHANGE_ALERT]: false }
                         );
                     } else {
-                        this.$router.navigateWithSaving(
+                        if (store.getters.vehicle.vin) {
-                            this.navigationScenarios
+                            this.$router.navigateWithSaving(
-                                .CLICKED_FORWARD_WITH_REPLACE_AND_VERIFIED_INSURANCE,
+                                this.navigationScenarios
-                            this.$route,
+                                    .CLICKED_FORWARD_WITH_REPLACE_AND_VERIFIED_INSURANCE,
-                            {},
+                                this.$route,
-                            { [routerParams.DISPLAY_VEHICLE_CHANGE_ALERT]: false }
+                                {},
-                        );
+                                { [routerParams.DISPLAY_VEHICLE_CHANGE_ALERT]: false }
+                            );
+                        } else {
+                            this.$router.navigateWithSaving(
+                                this.navigationScenarios.CLICKED_FORWARD_WITHOUT_VIN,
+                                this.$route,
+                                {},
+                                { [routerParams.DISPLAY_VEHICLE_CHANGE_ALERT]: false }
+                            );
+                        }
                     }
                 }
             }

src/styles/common-styles.scss

@@ -71,15 +71,11 @@ body {
 
     // Fix "iOS viewport scroll bug" issue on iPhone
     // where bottom of page is covered by address bar
-    @media only screen 
+    @media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: portrait) {
-        and (min-device-width: 375px) 
+        .page-container-grouped-styles {
-        and (max-device-width: 812px) 
+            padding-bottom: 3rem;
-        and (-webkit-min-device-pixel-ratio: 3)
+        }
-        and (orientation: portrait) { 
+    }
-        .page-container-grouped-styles {                           
-            padding-bottom: 3rem;                         
-        }   
-    } 
 }
 .modal-open {
     .container-fluid {