discontprice

src/constants/part-type-strings.js

@@ -8,6 +8,7 @@ const partTypeStrings = {
     MOBILE_FEE: "MOBILE FEE",
     REPAIR_FEE: "REPAIR FEE",
     EARLY_BIRD: "EARLY BIRD",
+    SERVICE_PACKAGE_DISCOUNT: "SERVICE PACKAGE DISCOUNT",
 };
 
 export { partTypeStrings };

src/layouts/quote/quote.vue

@@ -129,11 +129,6 @@ export default {
             null,
             "quote"
         );
-        const servicePackageDiscountPromise = baseMixin.methods.dispatchStoreActionWithLogging(
-            storeActions.CASH_SERVICE_PACKAGE_DISCOUNT,
-            null,
-            "quote"
-        );
         const supportingItemsPromise = baseMixin.methods.dispatchStoreActionWithLogging(
             storeActions.GET_SUPPORTING_ITEMS,
             null,
@@ -153,10 +148,6 @@ export default {
                 resultKey: "rainDefense",
                 promise: rainDefensePromise,
             },
-            {
-                resultKey: "servicePackageDiscount",
-                promise: servicePackageDiscountPromise,
-            },
             {
                 resultKey: "supportingItems",
                 promise: supportingItemsPromise,
@@ -167,17 +158,13 @@ export default {
         const lineItems = deepClone(store.getters.order.lineItems);
         lineItems.vaps = lineItems.vaps ?? [];
         const nullSafeGlassParts = lineItems.glassParts ?? [];
-        lineItems.supportingItems = [
-            ...resultMap.supportingItems,
-            resultMap.servicePackageDiscount,
-        ];
         const availableLineItems = [
             resultMap.rainDefense,
-            ...lineItems.supportingItems,
+            ...resultMap.supportingItems,
             ...resultMap.wipers,
             ...nullSafeGlassParts,
         ];
-
+        lineItems.supportingItems = resultMap.supportingItems;
         const pricingResults = await baseMixin.methods.dispatchStoreActionWithLogging(
             storeActions.PRICE_ORDER_ITEMS_AND_SAVE_SERVER_DATA,
             {
@@ -186,6 +173,7 @@ export default {
             "quote",
             false
         );
+
         baseMixin.methods.dispatchStoreAction(
             storeActions.SAVE_SUPPORTING_ITEMS,
             lineItems.supportingItems,
@@ -252,16 +240,45 @@ export default {
             return Object.assign({}, this.lineItems);
         },
         getServicePackageDiscount() {
-            const isServicePackageDiscount = this.getSettingValue(
+            const servicePackageDiscountSettingValue= this.getSettingValue(
                 experimentSettings.SERVICE_PACKAGE_DISCOUNT
             );
-            return isServicePackageDiscount === "True";
+            const isServicePackageDiscount = servicePackageDiscountSettingValue === "True";
+
+            if (isServicePackageDiscount) {
+                this.getServicePackageDiscountPrice();
+            }
+            return isServicePackageDiscount;
         },
     },
     methods: {
         openModalAction(modalName) {
             this.$refs[modalName].openModal();
         },
+        async getServicePackageDiscountPrice() {
+            const servicePackageDiscount = await baseMixin.methods.dispatchStoreActionWithLogging(
+                storeActions.CASH_SERVICE_PACKAGE_DISCOUNT,
+                null,
+                "quote"
+            );
+            const availableLineItems = [servicePackageDiscount.data];
+
+            await baseMixin.methods.dispatchStoreActionWithLogging(
+                storeActions.PRICE_ORDER_ITEMS_AND_SAVE_SERVER_DATA,
+                {
+                    availableLineItems: availableLineItems,
+                },
+                "quote",
+                false
+            );
+
+            this.lineItems.supportingItems.push(...availableLineItems);
+            baseMixin.methods.dispatchStoreAction(
+                storeActions.SAVE_SUPPORTING_ITEMS,
+                this.lineItems.supportingItems,
+                false
+            );
+        },
         arePagePrerequisitesValid() {
             return (
                 store.getters.order.serviceLocation.zipCode &&

src/layouts/quote/service-package-question/service-package-question.vue

@@ -101,11 +101,15 @@ export default {
                 buttonLabel: this.getHeaderTextFromCms(answer.SubWidgetName),
                 buttonLabelSubCopy: this.getSubheaderTextFromCms(answer.SubWidgetName),
                 buttonBodyCopy: this.getBodyTextFromCms(answer.SubWidgetName),
-                buttonAuxillaryCopy: this.getDiscountedPackagePriceString(answer.Name),
+                buttonAuxillaryCopy: this.getDiscountedPackagePriceString(
+                    answer.Name,
+                    this.isDiscount && answer.Text != ""
+                ),
                 buttonFooterCopy: this.getFooterTextFromCms(answer.SubWidgetName),
                 additionalButtonData: {
                     strikeThroughPrice: this.getPackagePriceString(answer.Name),
-                    discountedPrice: this.getServicePackageDiscount(),
+                    servicePackageDiscount: this.isDiscount && answer.Text != "",
+                    Text: answer.Text,
                 },
             }));
             return modifiedAnswers;
@@ -192,9 +196,21 @@ export default {
             return (this.isInsuranceSelected ? "As little as $" : "$") + formattedPriceFloat;
         },
         getPackagePrice(packageName, { discountedPrice = false }) {
-            const lineItemsToPrice = [...this.nullSafeAvailableLineItems];
+            var lineItemsToPrice = [...this.nullSafeAvailableLineItems];
+
             if (discountedPrice) {
                 lineItemsToPrice.push(...removeVapsPromosFromPromoArray(this.activePromos));
+            } else {
+                //remove service package discount part
+                const servicePackageDiscountParts = findLineItemsWithPartType(
+                    partTypeStrings.SERVICE_PACKAGE_DISCOUNT,
+                    this.nullSafeAvailableLineItems
+                );
+                if (servicePackageDiscountParts) {
+                    lineItemsToPrice = lineItemsToPrice.filter((item) => {
+                        return item != servicePackageDiscountParts;
+                    });
+                }
             }
             let priceFloat = this.isInsuranceSelected
                 ? 0
@@ -208,7 +224,6 @@ export default {
         },
         getVapsPrice(packageName, applyPromoDiscounts = false) {
             const vapsItems = this.getVapsLineItemsForSelectedPackage(packageName);
-
             let price = 0;
 
             vapsItems.forEach((item) => {
@@ -227,17 +242,6 @@ export default {
 
             return price;
         },
-        // getServicePackageDiscountPrice(packageName, packageDiscount = false) {
-        //     let price = 0;
-        //     const discount = this.getDiscountedPackagePrice(packageName);
-        //     if (packageDiscount) {
-        //         price += baseMixin.methods.getTotalLineItemPrice(discount);
-        //     }
-        //     return price;
-        // },
-        getServicePackageDiscount() {
-            if (!this.isInsuranceSelected && this.isDiscount) return true;
-        },
         selectDefaultPackage() {
             const promosWithAddableVaps = getPromosWithAddableVaps(this.activePromos);
             const vapsThatMatchPromos = getLineItemsThatMatchPromos(

src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue

@@ -2,7 +2,10 @@
     <baseInputButton v-bind="$props" @buttonClicked="handleAnswerChange" v-model="selectedValue">
         <div
             class="package-label"
-            :class="[this.buttonLabelSubCopy ? 'has-subheader' : '']"
+            :class="[
+                this.buttonLabelSubCopy ? 'has-subheader' : '',
+                this.additionalButtonData.servicePackageDiscount ? 'has-text' : '',
+            ]"
             for="testradio">
             <div class="package-specs">
                 <p class="m-0">
@@ -55,9 +58,10 @@
                         v-if="this.buttonFooterCopy"
                         v-html="this.buttonFooterCopy"></div>
                 </div>
-                <span class="alert-success" v-if="this.additionalButtonData.discountedPrice"
+                <span
-                    >Special: Save $ {{
+                    :class="[this.additionalButtonData.Text ? 'discount-text' : '']"
-                }}</span>
+                    v-if="this.additionalButtonData.servicePackageDiscount"
+                    v-html="this.additionalButtonData.Text"></span>
             </div>
         </div>
     </baseInputButton>
@@ -142,6 +146,9 @@ export default {
                 &.has-subheader {
                     min-height: 80px;
                 }
+                &.has-text {
+                    min-height: 124px;
+                }
 
                 &:before {
                     content: "";
@@ -276,6 +283,17 @@ export default {
             .hide-when-closed {
                 display: none;
             }
+            .discount-text {
+                width: 143px;
+                height: 40px;
+                padding: 8px 16px 8px 16px;
+                background-color: #e6f2ec;
+                font-size: 14px;
+                font-weight: 500;
+                line-height: 24px;
+                text-align: center;
+                color: #075f35;
+            }
         }
     }
 }