diff --git a/packages/theme/components/CartSidebar.vue b/packages/theme/components/CartSidebar.vue index 7dbc88ead..8cfbae88c 100644 --- a/packages/theme/components/CartSidebar.vue +++ b/packages/theme/components/CartSidebar.vue @@ -202,15 +202,37 @@
+ + + + +
+ + @@ -322,6 +344,7 @@ export default defineComponent({ }, }))); const totals = computed(() => cartGetters.getTotals(cart.value)); + const discount = computed(() => -cartGetters.getDiscountAmount(cart.value)); const totalItems = computed(() => cartGetters.getTotalItems(cart.value)); const getAttributes = (product: ConfigurableCartItem) => product.configurable_options || []; const getBundles = (product: BundleCartItem) => product.bundle_options?.map((b) => b.values).flat() || []; @@ -393,6 +416,7 @@ export default defineComponent({ isInStock, imageSizes, getMagentoImage, + discount, }; }, }); @@ -451,10 +475,14 @@ export default defineComponent({ margin: 0; } + &__subtotal, &__discount { + --price-font-weight: var(--font-weight--light); + } + &__total-price { - --price-font-size: var(--font-size--xl); + --price-font-size: var(--font-size--lg); --price-font-weight: var(--font-weight--medium); - margin: 0 0 var(--spacer-base) 0; + margin: var(--spacer-base) 0 var(--spacer-base) 0; } } diff --git a/packages/theme/components/Checkout/CartPreview.vue b/packages/theme/components/Checkout/CartPreview.vue index a09fde007..3cf375e7d 100644 --- a/packages/theme/components/Checkout/CartPreview.vue +++ b/packages/theme/components/Checkout/CartPreview.vue @@ -21,7 +21,7 @@ cartGetters.getItems(cart.value)); const totalItems = computed(() => cartGetters.getTotalItems(cart.value)); const totals = computed(() => cartGetters.getTotals(cart.value)); - const discounts = computed(() => cartGetters.getDiscounts(cart.value)); - const hasDiscounts = computed(() => discounts.value.length > 0); - const discountsAmount = computed( - () => -1 * discounts.value.reduce((a, el) => el.value + a, 0), - ); + const discount = computed(() => -cartGetters.getDiscountAmount(cart.value)); + const hasDiscounts = computed(() => Math.abs(discount.value) > 0); const selectedShippingMethod = computed(() => cartGetters.getSelectedShippingMethod(cart.value)); return { cart, - discounts, - discountsAmount, + discount, hasDiscounts, totalItems, listIsHidden, diff --git a/packages/theme/getters/types.d.ts b/packages/theme/getters/types.d.ts index 4acdd5184..92b229689 100644 --- a/packages/theme/getters/types.d.ts +++ b/packages/theme/getters/types.d.ts @@ -67,14 +67,6 @@ export interface UserShippingGetters { isDefault: (address: USER_SHIPPING_ITEM) => boolean; } -export interface UserGetters { - getFirstName: (customer: USER) => string; - getLastName: (customer: USER) => string; - getFullName: (customer: USER) => string; - getEmailAddress: (customer: USER) => string; - [getterName: string]: (element: any, options?: any) => unknown; -} - export interface WishlistGetters { getItems: (wishlist: WISHLIST) => WISHLIST_ITEM[]; getItemName: (wishlistItem: WISHLIST_ITEM) => string; @@ -101,5 +93,6 @@ export interface CartGetters { // @deprecated - use getDiscounts instead getCoupons: (cart: CART) => Coupon[]; getDiscounts: (cart: CART) => CartDiscount[]; + getDiscountAmount: (cart: CART) => number; [getterName: string]: (element: any, options?: any) => unknown; } diff --git a/packages/theme/modules/checkout/getters/cartGetters.ts b/packages/theme/modules/checkout/getters/cartGetters.ts index c4b63e695..0b0302736 100644 --- a/packages/theme/modules/checkout/getters/cartGetters.ts +++ b/packages/theme/modules/checkout/getters/cartGetters.ts @@ -146,6 +146,8 @@ export const getDiscounts = (cart: Cart): CartDiscount[] => (Array.isArray(cart? code: d.label, } as CartDiscount)) : []); +export const getDiscountAmount = (cart: Cart): number => calculateDiscounts(cart?.prices?.discounts ?? []); + export const getAppliedCoupon = (cart: Cart): Coupon | null => (Array.isArray(cart?.applied_coupons) && cart?.applied_coupons.length > 0 ? { id: cart.applied_coupons[0].code, name: cart.applied_coupons[0].code, @@ -189,6 +191,7 @@ const cartGetters: CartGetters = { getShippingPrice, getTotalItems, getTotals, + getDiscountAmount, productHasSpecialPrice, getStockStatus, getConfiguredVariant,