-
- {{ cartItem.name }}
+ :key="i"
+ class="non-packaged-cart-item"
+ :class="[
+ i % 2 == 0 ? 'even' : 'odd',
+ cartItem.isRemovable ? 'removable-cart-item' : '',
+ ]">
+ {{ cartItem.name }}
- {{ currencyFormatter.format(cartItem.subTotal) }}
-
-
-
-
- {{ currencyFormatter.format(recycleFeeCartItem.subTotal) }}
+ {{ currencyFormatter.format(cartItem.subTotal) }}
-
- {{ mobileFeeCartItem.name }}{{ currencyFormatter.format(mobileFeeCartItem.subTotal) }}
-
-
-
- {{ premiumAppointmentDiscountCartItem.name }}
-
- {{
- currencyFormatter.format(premiumAppointmentDiscountCartItem.subTotal)
- }}
-
-
@@ -336,13 +308,13 @@ export default {
const nonpackageCartItems = [];
this.cartItems.forEach((cartItem) => {
- if (
- cartItem == this.recycleFeeCartItem ||
- cartItem == this.mobileFeeCartItem ||
- cartItem == this.premiumAppointmentDiscountCartItem
- ) {
- return;
- }
+ // if (
+ // cartItem == this.recycleFeeCartItem ||
+ // cartItem == this.mobileFeeCartItem ||
+ // cartItem == this.premiumAppointmentDiscountCartItem
+ // ) {
+ // return;
+ // }
if (!this.packageCartItems.find((packageCartItem) => packageCartItem == cartItem)) {
if (cartItem.isDisplayed) {
@@ -441,6 +413,7 @@ export default {
category: cartItemCategories.VAPS,
cartItemType: cartItemTypes.RAIN_DEFENSE,
isDisplayed: true,
+ isRemovable: true,
subTotal: 0,
salesTax: 0,
lineItems: [],
@@ -469,6 +442,7 @@ export default {
category: cartItemCategories.GLASS_PARTS,
cartItemType: cartItemTypes.GLASS_PARTS,
isDisplayed: false,
+ isRemovable: false,
subTotal:
(lineItem.kitPrice ?? 0) +
(lineItem.laborAmount ?? 0) +
@@ -511,6 +485,7 @@ export default {
category: cartItemCategories.SUPPORTING_ITEMS,
cartItemType: cartItemTypes.RECYCLE_FEE,
isDisplayed: true,
+ isRemovable: false,
subTotal: 0,
salesTax: 0,
lineItems: [],
@@ -545,6 +520,7 @@ export default {
category: cartItemCategories.SUPPORTING_ITEMS,
cartItemType: cartItemTypes.MOBILE_FEE,
isDisplayed: true,
+ isRemovable: false,
subTotal: 0,
salesTax: 0,
lineItems: [],
@@ -579,6 +555,7 @@ export default {
category: cartItemCategories.SUPPORTING_ITEMS,
cartItemType: cartItemTypes.SUPPORTING_ITEMS,
isDisplayed: false,
+ isRemovable: false,
subTotal: 0,
salesTax: 0,
lineItems: [],
@@ -714,9 +691,9 @@ export default {
display: flex;
justify-content: space-between;
padding: 0.5rem 1.5rem;
- &:nth-child(odd) {
- background-color: #f5f5f5;
- }
+ // &:nth-child(odd) {
+ // background-color: #f5f5f5;
+ // }
&:nth-last-child(-n + 3) {
background-color: #e3f2ea;
}
@@ -725,7 +702,12 @@ export default {
color: #ffffff;
}
}
- .vaps {
+ .service-type {
+ background-color: #f5f5f5;
+ //padding-left: 2.5rem;
+ align-items: center;
+ }
+ .packaged-cart-item {
background-color: #f5f5f5;
padding-left: 2.5rem;
align-items: center;
@@ -743,6 +725,28 @@ export default {
font-size: 0.875rem;
}
}
+ .non-packaged-cart-item {
+ &.odd {
+ background: var(--neutrals-gray-100, #f4f4f4);
+ }
+ }
+ .non-packaged-cart-item {
+ &.even {
+ background-color: var(--neutrals-white, #fff);
+ }
+ }
+ // Custom order/wrap for removable nonpackaged Cart Items
+ .removable-cart-item {
+ flex-wrap: wrap;
+ span {
+ display: flex;
+ justify-content: space-between;
+ }
+ a {
+ order: 3;
+ margin-right: 100%;
+ }
+ }
.package-type,
.service-type {
//background-color: #f5f5f5;
@@ -764,18 +768,6 @@ export default {
padding: 0;
}
}
- // Custom order/wrap for nonpackaged Cart Items
- .premium-appt-cart-item {
- flex-wrap: wrap;
- span {
- display: flex;
- justify-content: space-between;
- }
- a {
- order: 3;
- margin-right: 100%;
- }
- }
}
.vin-toggle {
&:after {
diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index 8a5f3a21d..d0d83c498 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -27,7 +27,6 @@
:allowItemRemoval="true"
v-model="lineItems"
servicePackageOptionsCmsName="ServicePackageTitle"
- @cart-remove="cartRemove"
recyclingModalCmsWidgetName="RecycleModal" />