CSR-1742: work on cart to update for insurance orders

This commit is contained in:
Adam Caouette 2024-04-23 09:30:25 -04:00
parent 35a8dc6045
commit 120920178c
3 changed files with 191 additions and 25 deletions

View file

@ -16,3 +16,5 @@ export function coverageStatusValue(intCoverageStatus) {
return null;
}
}
export { coverageStatus };

View file

@ -10,11 +10,28 @@
href="javascript:void(0)"
class="col d-flex justify-content-between py-0">
<span class="label">{{ amountDueText }}</span>
<span class="label amount-due">{{ getFormattedAmount("", amountDue) }}</span>
<span class="label amount-due">{{
isInsuranceStatusPending
? verifyingCoverageText
: getFormattedAmount("", amountDue)
}}</span>
</a>
</div>
<div class="cart-panel">
<div class="price-table">
<!-- Deductible, if applicable -->
<div v-if="deductibleLineItem" class="deductible">
<textBlock cmsWidgetName="DeductibleTextWidget" />
<span>
{{
isInsuranceStatusPending
? verifyingCoverageText
: getFormattedAmount("", deductibleLineItem.subTotal)
}}
</span>
</div>
<!-- Service Type -->
<div class="service-type">
<textBlock :cmsWidgetName="servicePackageTitleWidget" />
<span>
@ -78,13 +95,23 @@
<span v-else-if="cartItem == recycleFeeCartItem">
{{ recycleFeeCartItem.name }}
</span>
<span>{{ getFormattedAmount(cartItem.category, cartItem.subTotal) }}</span>
<span
v-if="
!isInsuranceStatusVerified ||
(isInsuranceStatusVerified && !cartItem.isCoveredByInsurance)
"
>{{ getFormattedAmount(cartItem.category, cartItem.subTotal) }}</span
>
</div>
<!-- Sub total, sales tax, total columns -->
<div class="sub-total">
<span>{{ subtotalText }}</span
><span>{{ getFormattedAmount("", subTotal) }}</span>
><span>{{
isInsuranceStatusPending
? verifyingCoverageText
: getFormattedAmount("", subTotal)
}}</span>
</div>
<div class="sales-tax">
<span>{{ salesTaxText }}</span
@ -96,9 +123,16 @@
</div>
<div class="amount-due">
<span>{{ amountDueText }}</span
><span>{{ getFormattedAmount("", amountDue) }}</span>
><span>{{
isInsuranceStatusPending
? verifyingCoverageText
: getFormattedAmount("", amountDue)
}}</span>
</div>
</div>
<div v-if="insuranceCompanyName" class="insurance-company-name caption">
{{ insuranceCompanyName }}
</div>
<promoModalQuestion
ref="promoModalQuestion"
class="small mt-4"
@ -141,6 +175,7 @@ import { getPromoCodeWithoutBundleIdentifier } from "@/helpers/promotions-helper
import { partTypeStrings } from "@/constants/part-type-strings";
import { cartItemCategories } from "@/constants/cart-item-categories";
import { cartItemTypes } from "@/constants/cart-item-types";
import { coverageStatus, coverageStatusValue } from "@/constants/coverage-status";
export default {
name: "cart",
@ -153,6 +188,9 @@ export default {
allowItemRemoval: Boolean,
recyclingModalCmsWidgetName: String,
showAsPaid: Boolean,
currentDeductibleFromStore: Number,
insuranceCompanyName: String,
insuranceCoverageStatus: String,
},
data() {
return {
@ -255,6 +293,23 @@ export default {
this.$emit("update:modelValue", newValue);
},
},
isInsuranceStatusPending() {
if (this.insuranceCoverageStatus === coverageStatus.PENDING) return true;
if (
this.insuranceCoverageStatus === coverageStatus.VERIFIED &&
!(this.currentDeductible === 0 || this.currentDeductible > 0)
)
return true;
return false;
},
isInsuranceStatusVerified() {
return this.insuranceCoverageStatus === coverageStatus.VERIFIED;
},
currentDeductible() {
if (this.insuranceCoverageStatus === coverageStatusValue(2))
return this.currentDeductibleFromStore;
return null;
},
screenReaderTotalAmountDueText() {
return this.getCmsContent("ScreenReaderTotalAmountDueWidget", "Text");
},
@ -364,11 +419,16 @@ export default {
return tier;
},
packagePrice() {
let packagePrice = this.isInsuranceSelected
? 0
: baseMixin.methods.getTierOnePackagePrice(
baseMixin.methods.filterOutFees(this.availableLineItems)
);
let packagePrice = 0;
if (
!this.isInsuranceStatusVerified ||
(this.isInsuranceStatusVerified && this.isInsuranceStatusPending)
) {
packagePrice = baseMixin.methods.getTierOnePackagePrice(
baseMixin.methods.filterOutFees(this.availableLineItems)
);
}
packagePrice += this.getVapsPrice(this.packageLevel);
@ -410,7 +470,25 @@ export default {
const promos = this.lineItems?.promos;
return promos?.length > 0 ? promos : [];
},
// Cart Items
deductibleLineItemName() {
return this.getCmsContent("DeductibleTextWidget", "Text");
},
deductibleLineItem() {
let lineItem = null;
if (this.isInsuranceStatusVerified || this.isInsuranceStatusPending) {
lineItem = {
name: this.deductibleLineItemName,
subTotal: this.currentDeductible >= 0 ? this.currentDeductible : null,
};
}
return lineItem;
},
verifyingCoverageText() {
return this.getCmsContent("VerifyingCoverageTextWidget", "Text");
},
// Cart Item Groupings
packageCartItems() {
return this.getVapsCartItemsForSelectedPackage(this.packageLevel);
},
@ -426,6 +504,7 @@ export default {
});
return nonpackageCartItems;
},
// Individual Cart Items
frontWiperCartItemName() {
return this.getCmsContentForVapsType(partTypeStrings.FRONT_WIPER);
},
@ -446,6 +525,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: false,
};
frontWiperLineItems.forEach((lineItem) => {
@ -483,6 +563,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: false,
};
rearWiperLineItems.forEach((lineItem) => {
@ -520,6 +601,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: false,
};
rainDefenseLineItem.cartItemType = cartItem.cartItemType;
@ -553,6 +635,7 @@ export default {
salesTax: lineItem.salesTax ?? 0,
lineItems: [],
isCoveredByInsurance: true,
};
if (lineItem.childParts?.length > 0) {
@ -592,6 +675,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: true,
};
recycleFeeLineItem.cartItemType = cartItem.cartItemType;
@ -629,6 +713,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: true,
};
suppliesRepairLineItem.cartItemType = cartItem.cartItemType;
@ -664,6 +749,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: false,
};
mobileFeeLineItem.cartItemType = cartItem.cartItemType;
@ -697,6 +783,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: true,
};
otherSupportingItemsLineItems.forEach((lineItem) => {
@ -715,7 +802,7 @@ export default {
return cartItem;
},
premiumAppointmentDiscountCartItemName() {
return "Early bird appointment"; // TODO: get from CMS
return this.getCmsContent("PremiumAppointmentTextWidget", "Text");
},
premiumAppointmentDiscountCartItem() {
let cartItem = null;
@ -734,6 +821,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: false,
};
premiumAppointmentDiscountLineItem.cartItemType = cartItem.cartItemType;
@ -779,6 +867,7 @@ export default {
subTotal: 0,
salesTax: 0,
lineItems: [],
isCoveredByInsurance: false,
};
promoLineItems.forEach((promoLineItem) => {
@ -820,17 +909,38 @@ export default {
subTotal() {
let subTotal = 0;
this.cartItems.forEach((cartItem) => {
subTotal += cartItem.subTotal;
});
if (this.isInsuranceStatusVerified) {
// only include items NOT covered by insurance
this.cartItems.forEach((cartItem) => {
if (!cartItem.isCoveredByInsurance) {
subTotal += cartItem.subTotal ?? 0;
}
});
// add deductible amount still to pay
subTotal += this.deductibleLineItem.subTotal ?? 0;
} else {
this.cartItems.forEach((cartItem) => {
subTotal += cartItem.subTotal ?? 0;
});
}
return subTotal;
},
salesTax() {
let salesTax = 0;
this.cartItems.forEach((cartItem) => {
salesTax += cartItem.salesTax ?? 0;
});
if (this.isInsuranceStatusVerified) {
// only include items NOT covered by insurance
this.cartItems.forEach((cartItem) => {
if (!cartItem.isCoveredByInsurance) {
salesTax += cartItem.salesTax ?? 0;
}
});
} else {
this.cartItems.forEach((cartItem) => {
salesTax += cartItem.salesTax ?? 0;
});
}
return salesTax;
},
@ -893,7 +1003,7 @@ export default {
display: flex;
justify-content: space-between;
padding: 0.5rem 1.5rem;
&:nth-last-child(-n + 4) {
&:nth-last-child(-n + 3) {
background-color: $green-100;
}
&:last-child {
@ -901,16 +1011,26 @@ export default {
color: #ffffff;
}
}
.deductible {
background-color: $gray-100;
}
.service-type {
background-color: $gray-100;
align-items: center;
}
.deductible ~ .service-type {
background: $white;
}
.service-type ~ .packaged-cart-item {
background-color: $gray-100;
}
.deductible ~ .packaged-cart-item {
background: $white;
}
.struck-out-price {
text-decoration: line-through;
padding-left: 0.5rem;
}
.packaged-cart-item {
background-color: $gray-100;
padding-left: 2.5rem;
align-items: center;
span {
@ -937,6 +1057,11 @@ export default {
background: $gray-100;
}
}
.deductible ~ .non-packaged-cart-item {
&.odd {
background: $white;
}
}
.non-packaged-cart-item {
&.even {
background-color: $white;
@ -945,6 +1070,11 @@ export default {
line-height: 1.625;
}
}
.deductible ~ .non-packaged-cart-item {
&.even {
background-color: $gray-100;
}
}
// Custom order/wrap for removable nonpackaged Cart Items
.removable-cart-item {
flex-wrap: wrap;
@ -959,8 +1089,8 @@ export default {
}
}
.package-type,
.service-type {
//background-color: #f5f5f5;
.service-type,
.deductible {
align-items: center;
}
.sub-total,
@ -973,15 +1103,19 @@ export default {
.sub-total {
border-top: 1px solid $green;
}
.service-type {
// background-color: #f5f5f5;
.service-type,
.deductible {
.text-block {
background: transparent;
margin-top: 0;
padding: 0;
width: 50%;
}
}
}
.insurance-company-name {
margin-top: 0.5rem;
}
.vin-toggle {
&:after {
content: "";

View file

@ -28,7 +28,10 @@
v-model="lineItems"
pageName="payment-method"
servicePackageOptionsCmsName="ServicePackageTitle"
recyclingModalCmsWidgetName="RecycleModal" />
recyclingModalCmsWidgetName="RecycleModal"
:currentDeductibleFromStore="currentDeductible"
:insuranceCompanyName="insuranceCompanyName"
:insuranceCoverageStatus="insuranceCoverageStatus" />
<hr class="my-5" />
@ -110,6 +113,7 @@ import { errorMessages } from "@/constants/error-messages";
import { AppointmentTypeStrings } from "@/constants/schedule-constants";
import { partTypeStrings } from "@/constants/part-type-strings";
import { mapTaxedLineItemsToStoreFormat } from "../../store";
import { coverageStatus } from "@/constants/coverage-status";
defineRule("option-required", required(errorMessages.OPTION_REQUIRED));
@ -496,6 +500,32 @@ export default {
damageInfo() {
return this.$store.getters.damage;
},
isInsurance() {
return this.$store.getters.payment.isInsurance;
},
isNoComp() {
return this.$store.getters.policy.isNoComp;
},
hasVapsInCart() {
if (this.lineItems?.vaps?.length > 0) {
return true;
}
return false;
},
insuranceCoverageStatus() {
if (!this.isInsurance) return null;
if (this.isNoComp) {
return coverageStatus.NOCOMP;
} else {
return this.$store.getters.payment.insuranceCoverage.coverageStatus;
}
},
currentDeductible() {
return this.$store.getters.policy.currentDeductible;
},
insuranceCompanyName() {
return this.$store.getters.policy.insuranceCompanyName;
},
noPiaDisclaimer() {
return this.getCmsContent("NoPiaDisclaimerWidget", "Text");
},