File
Metadata
| selector |
cx-order-summary |
| templateUrl |
./order-summary.component.html |
|
cart
|
Type : Cart
|
Decorators :
@Input()
|
|
|
import { Component, Input } from '@angular/core';
import { Cart } from '@spartacus/core';
@Component({
selector: 'cx-order-summary',
templateUrl: './order-summary.component.html',
})
export class OrderSummaryComponent {
@Input()
cart: Cart;
}
<h3>{{ 'orderCost.orderSummary' | cxTranslate }}</h3>
<div class="cx-summary-partials" *ngIf="cart">
<div class="cx-summary-row">
<div class="col-6 cx-summary-label">
{{ 'orderCost.subtotal' | cxTranslate }}
</div>
<div class="col-6 cx-summary-amount">
{{ cart.subTotal?.formattedValue }}
</div>
</div>
<div class="cx-summary-row">
<div class="col-6 cx-summary-label">
{{
(cart.deliveryCost?.formattedValue
? 'orderCost.shipping'
: 'orderCost.estimatedShipping'
) | cxTranslate
}}
</div>
<div class="col-6 cx-summary-amount">
{{
cart.deliveryCost?.formattedValue
? cart.deliveryCost.formattedValue
: ('orderCost.toBeDetermined' | cxTranslate)
}}
</div>
</div>
<div class="cx-summary-row" *ngIf="cart.net; else cartWithoutNet">
<div class="col-6 cx-summary-label">
{{ 'orderCost.salesTax' | cxTranslate }}
</div>
<div class="col-6 cx-summary-amount">
{{ cart.totalTax?.formattedValue }}
</div>
</div>
<div class="cx-summary-row cx-summary-total">
<div class="col-6 cx-summary-label">
{{ 'orderCost.total' | cxTranslate }}
</div>
<div class="col-6 cx-summary-amount">
{{ cart.totalPriceWithTax?.formattedValue }}
</div>
</div>
<div class="cx-summary-row" *ngIf="cart.totalDiscounts?.value > 0">
{{ 'orderCost.discount' | cxTranslate }}
{{ cart.totalDiscounts?.formattedValue }}
</div>
<ng-template #cartWithoutNet>
<div class="cx-summary-row">
{{
cart.totalPriceWithTax?.value !== cart.totalPrice?.value
? ('orderCost.grossTax' | cxTranslate)
: ('orderCost.grossIncludeTax' | cxTranslate)
}}
{{ cart.totalTax?.formattedValue }}.
</div>
</ng-template>
</div>
<!--
<cx-promotions
*ngIf="cart"
[promotions]="cart.appliedOrderPromotions"
></cx-promotions>
-->
<ng-container *cxFeatureLevel="'1.3'">
<cx-applied-coupons
[vouchers]="cart.appliedVouchers"
[isReadOnly]="true"
></cx-applied-coupons>
</ng-container>
Legend
Html element with directive