Fixes a few defects on order-confirmation:

- INSR-8676: Display proper copy for windshield repair
- INSR-8684 Fix some display differences for paid orders
- Also fixes a defect where the cart was real close to the footer on
  mobile
This commit is contained in:
Alex Humphries 2026-02-27 15:56:33 -05:00
parent 24160e8b48
commit f49168b4da
2 changed files with 34 additions and 12 deletions

View file

@ -1,6 +1,6 @@
<template>
<div
v-if="!isDeductibleOnly"
v-if="!isDeductibleOnly || showAsPaid"
class="cart-table">
<div class="cart-item-list">
<div
@ -53,7 +53,7 @@
id="cart-footer"
class="cart-footer">
<div
v-if="!isUnverified"
v-if="!isUnverified && !isDeductibleOnly"
id="cart-subtotal-and-tax"
class="subtotal-and-tax">
<div
@ -68,10 +68,21 @@
<span id="sales-tax-label">{{ salesTaxLabel }}</span>
<span id="sales-tax-value">{{ formatAmountInDollars(salesTax) }}</span>
</div>
<div
v-if="showAsPaid"
id="cart-amount-paid"
class="py-2 col d-flex justify-content-between">
</div>
<div
v-if="showAsPaid"
id="cart-total"
class="cart-item">
<div class="price-row">
<span id="total-label">{{ totalLabel }}</span>
<span if="total-value">{{ getDisplayed(total) }}</span>
</div>
</div>
<div
v-if="showAsPaid"
id="cart-amount-paid"
class="cart-item">
<div class="price-row">
<span id="amount-paid-label">{{ amountPaidLabel }}</span>
<span if="amount-paid-value">{{ getDisplayed(amountPaid) }}</span>
</div>
@ -141,7 +152,8 @@ export default {
servicePackage: 'ServicePackageTitle',
vapsItemDescriptions: 'VapsItemDescriptions',
warrantyText: 'WarrantyCartItemTextWidget',
guaranteeText: 'GuaranteeCartItemTextWidget'
guaranteeText: 'GuaranteeCartItemTextWidget',
total: 'TotalWidget'
},
cartItemType
};
@ -176,7 +188,8 @@ export default {
},
servicePrice() {
const price = getPriceOfLineItems(getServiceLineItems(this.cartOrder)) ?? 0;
return price - this.recalibrationPrice;
const recycleFee = getPriceOfLineItems([this.recycleFeeLineItem]) ?? 0;
return price - this.recalibrationPrice - recycleFee;
},
isUnverified() {
return isOrderUnverified(this.cartOrder);
@ -198,10 +211,10 @@ export default {
return getCartTotal(this.cartOrder);
},
amountDue() {
return this.showAsPaid ? 0 : this.total;
return this.total - this.amountPaid;
},
amountPaid() {
return !this.showAsPaid ? 0 : this.total;
return !this.showAsPaid ? 0 : this.cartOrder.settledTenderAmount;
},
availableLineItems() {
const { supportingItems, glassParts, otherParts, feeItems } = this.lineItems;
@ -278,6 +291,9 @@ export default {
salesTaxLabel() {
return this.getCmsContent(this.widget.salesTax, widgetFields.TEXT_BLOCK_WIDGET.TEXT);
},
totalLabel() {
return this.getCmsContent(this.widget.total, widgetFields.TEXT_BLOCK_WIDGET.TEXT);
},
recycleFeeCartItem() {
return this.recycleFeeLineItem
? this.getCartItem(
@ -414,6 +430,10 @@ export default {
a:hover {
color: $heritage-blue-secondary;
}
#amount-paid-label {
font-weight: 600;
}
}
.cart-footer {

View file

@ -281,11 +281,13 @@ export default {
},
serviceTypeText() {
const glassPieces = this.submittedOrder.lineItems.glassParts?.map((part) => part.partType.toLowerCase()) ?? [];
let glassList = getGlassList(glassPieces);
let glassList = '';
let workType = '';
if (this.isRepair) {
glassList = 'windshield';
workType = 'repair';
} else {
glassList = getGlassList(glassPieces);
workType = 'replacement';
if (this.hasRecalibrationPart) {
if (glassList === 'windshield') {
@ -622,7 +624,7 @@ export default {
}
.cart-container {
padding: 0 .9375rem;
padding: 0 .9375rem 2.1875rem;
}
.header {