ng-easycommerce 0.1.1 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/README.md +4 -0
  2. package/assets/ec-i18n/ct.json +2 -0
  3. package/assets/ec-i18n/en.json +2 -0
  4. package/assets/ec-i18n/es.json +2 -0
  5. package/assets/ec-i18n/fr.json +2 -0
  6. package/assets/ec-i18n/gl.json +2 -0
  7. package/assets/ec-i18n/pr.json +2 -0
  8. package/bundles/ng-easycommerce.umd.js +84 -20
  9. package/bundles/ng-easycommerce.umd.js.map +1 -1
  10. package/bundles/ng-easycommerce.umd.min.js +1 -1
  11. package/bundles/ng-easycommerce.umd.min.js.map +1 -1
  12. package/esm2015/lib/ec-component/account-ec/order-ec/order-ec.component.js +2 -2
  13. package/esm2015/lib/ec-component/checkout-ec/checkout-ec.component.js +6 -2
  14. package/esm2015/lib/ec-component/checkout-ec/detail-checkout-block-ec/detail-checkout-block-ec.component.js +6 -2
  15. package/esm2015/lib/ec-component/checkout-ec/payment-ec/payment-ec.component.js +24 -9
  16. package/esm2015/lib/ec-component/checkout-ec/payment-ec-single/payment-ec-single.component.js +11 -3
  17. package/esm2015/lib/interfaces/checkout-data.js +1 -1
  18. package/esm2015/lib/services/cart.service.js +9 -1
  19. package/esm2015/lib/services/checkout/checkout.service.js +3 -1
  20. package/esm2015/lib/utils/order-util.service.js +22 -2
  21. package/esm5/lib/ec-component/account-ec/order-ec/order-ec.component.js +2 -2
  22. package/esm5/lib/ec-component/checkout-ec/checkout-ec.component.js +6 -2
  23. package/esm5/lib/ec-component/checkout-ec/detail-checkout-block-ec/detail-checkout-block-ec.component.js +6 -2
  24. package/esm5/lib/ec-component/checkout-ec/payment-ec/payment-ec.component.js +29 -14
  25. package/esm5/lib/ec-component/checkout-ec/payment-ec-single/payment-ec-single.component.js +11 -3
  26. package/esm5/lib/interfaces/checkout-data.js +1 -1
  27. package/esm5/lib/services/cart.service.js +13 -1
  28. package/esm5/lib/services/checkout/checkout.service.js +3 -2
  29. package/esm5/lib/utils/order-util.service.js +22 -2
  30. package/fesm2015/ng-easycommerce.js +75 -14
  31. package/fesm2015/ng-easycommerce.js.map +1 -1
  32. package/fesm5/ng-easycommerce.js +84 -20
  33. package/fesm5/ng-easycommerce.js.map +1 -1
  34. package/lib/ec-component/checkout-ec/checkout-ec.component.d.ts +1 -1
  35. package/lib/ec-component/checkout-ec/detail-checkout-block-ec/detail-checkout-block-ec.component.d.ts +1 -1
  36. package/lib/ec-component/checkout-ec/payment-ec/payment-ec.component.d.ts +3 -0
  37. package/lib/ec-component/checkout-ec/payment-ec-single/payment-ec-single.component.d.ts +3 -0
  38. package/lib/interfaces/checkout-data.d.ts +6 -1
  39. package/lib/services/cart.service.d.ts +3 -0
  40. package/lib/utils/order-util.service.d.ts +1 -0
  41. package/ng-easycommerce.metadata.json +1 -1
  42. package/package.json +1 -1
package/fesm2015/ng-easycommerce.js CHANGED
@@ -1972,7 +1972,7 @@ let OrderUtilityService = class OrderUtilityService {
1972
1972
  * @description Devuelve un listado con todas las promociones que posee el carro/orden
1973
1973
  */
1974
1974
  this.getPromotions = (cart, forCart = false) => {
1975
- var _a;
1975
+ var _a, _b;
1976
1976
  if (!((_a = cart) === null || _a === void 0 ? void 0 : _a.totals))
1977
1977
  return [];
1978
1978
  if (cart.checkoutState && cart.checkoutState == "completed")
@@ -1984,6 +1984,8 @@ let OrderUtilityService = class OrderUtilityService {
1984
1984
  // console.log(cart.cartDiscounts);
1985
1985
  const cartDiscounts = Array.isArray(cart.cartDiscounts) ? cart.cartDiscounts : [];
1986
1986
  for (let index = 0; index < cartDiscounts.length; index++) {
1987
+ if (((_b = cartDiscounts[index]) === null || _b === void 0 ? void 0 : _b.type) === 'payment_method')
1988
+ continue;
1987
1989
  cartDiscounts[index].type = this.formatType(cartDiscounts[index].type);
1988
1990
  new_state.push({
1989
1991
  type: cartDiscounts[index].type,
@@ -1999,6 +2001,8 @@ let OrderUtilityService = class OrderUtilityService {
1999
2001
  // amount: this.getAmount(cartDiscount, cart)
2000
2002
  // });
2001
2003
  // });
2004
+ const paymentMethodAdjustment = this.getPaymentMethodAdjustment(cart);
2005
+ paymentMethodAdjustment && new_state.push(paymentMethodAdjustment);
2002
2006
  !forCart && new_state.push(total);
2003
2007
  return new_state;
2004
2008
  };
@@ -2025,9 +2029,25 @@ let OrderUtilityService = class OrderUtilityService {
2025
2029
  name: 'discount',
2026
2030
  amount: promotionAmount
2027
2031
  });
2032
+ const paymentMethodAdjustment = this.getPaymentMethodAdjustment(cart);
2033
+ paymentMethodAdjustment && new_state.push(paymentMethodAdjustment);
2028
2034
  !forCart && new_state.push(total);
2029
2035
  return new_state;
2030
2036
  };
2037
+ this.getPaymentMethodAdjustment = (cart) => {
2038
+ var _a, _b, _c, _d;
2039
+ const rawAmount = (_b = (_a = cart) === null || _a === void 0 ? void 0 : _a.totals) === null || _b === void 0 ? void 0 : _b.paymentMethodAdjustment;
2040
+ if (rawAmount === null || rawAmount === undefined || Number(rawAmount) === 0)
2041
+ return null;
2042
+ const amount = Number(rawAmount);
2043
+ if (!Number.isFinite(amount))
2044
+ return null;
2045
+ return {
2046
+ type: 'paymentMethodAdjustment',
2047
+ name: ((_d = (_c = cart) === null || _c === void 0 ? void 0 : _c.totals) === null || _d === void 0 ? void 0 : _d.paymentMethodAdjustmentLabel) || (amount < 0 ? 'discount' : 'surcharge'),
2048
+ amount
2049
+ };
2050
+ };
2031
2051
  /**
2032
2052
  * Devuelve el monto de envío que debe mostrarse en el resumen.
2033
2053
  *
@@ -3522,6 +3542,7 @@ let CheckoutService = class CheckoutService {
3522
3542
  const summary = this.cartService && this.cartService.getCartSummaryPricePresentation
3523
3543
  ? this.cartService.getCartSummaryPricePresentation(cart, undefined, true)
3524
3544
  : null;
3545
+ const paymentMethodAdjustment = this.orderUtils.getPaymentMethodAdjustment(cart);
3525
3546
  if (((_a = summary) === null || _a === void 0 ? void 0 : _a.source) === 'linePricing') {
3526
3547
  const result = [
3527
3548
  { type: 'productsBeforeDiscounts', name: 'products-before-discounts', amount: summary.productsBeforeDiscounts },
@@ -3544,6 +3565,7 @@ let CheckoutService = class CheckoutService {
3544
3565
  ...(summary.shipping !== null
3545
3566
  ? [{ type: 'shipment', name: 'shipment', amount: summary.shipping }]
3546
3567
  : []),
3568
+ ...(paymentMethodAdjustment ? [paymentMethodAdjustment] : []),
3547
3569
  { type: 'total', name: 'total', amount: summary.total }
3548
3570
  ];
3549
3571
  this.asociatedDataSubject.next(result);
@@ -4712,6 +4734,12 @@ let CartService = class CartService {
4712
4734
  : this.couponSubject.next(null);
4713
4735
  return true;
4714
4736
  };
4737
+ this.updateCartAfterPaymentResponse = (cart) => {
4738
+ var _a;
4739
+ if (!((_a = cart) === null || _a === void 0 ? void 0 : _a.totals))
4740
+ return false;
4741
+ return this.updateCartObj(cart, false);
4742
+ };
4715
4743
  this.isItemInLocal = (item_id) => this.items.some(item => item.item_id == item_id);
4716
4744
  /**
4717
4745
  * @public
@@ -4928,6 +4956,8 @@ let CartService = class CartService {
4928
4956
  this.getCartToken = () => this.cart_token;
4929
4957
  this.getLocale = () => this.locale;
4930
4958
  this.getTotalAmount = () => this.cart.pipe(map((cart) => { var _a, _b; return (_b = (_a = cart) === null || _a === void 0 ? void 0 : _a.totals) === null || _b === void 0 ? void 0 : _b.total; }));
4959
+ this.getPaymentMethodAdjustment = () => this.cart.pipe(map((cart) => { var _a, _b, _c; return _c = (_b = (_a = cart) === null || _a === void 0 ? void 0 : _a.totals) === null || _b === void 0 ? void 0 : _b.paymentMethodAdjustment, (_c !== null && _c !== void 0 ? _c : null); }));
4960
+ this.getPaymentMethodAdjustmentLabel = () => this.cart.pipe(map((cart) => { var _a, _b, _c; return _c = (_b = (_a = cart) === null || _a === void 0 ? void 0 : _a.totals) === null || _b === void 0 ? void 0 : _b.paymentMethodAdjustmentLabel, (_c !== null && _c !== void 0 ? _c : null); }));
4931
4961
  /** Total para carrito/sidebar, sin envío persistido ni recargos de checkout. */
4932
4962
  this.getCartTotalAmount = () => this.cart.pipe(map((cart) => this.orderUtils.getCartTotalAmount(cart)));
4933
4963
  this.getCountCartItems = () => this.cartItems.pipe(map((cartItems) => { var _a; return (_a = cartItems) === null || _a === void 0 ? void 0 : _a.length; }));
@@ -9683,7 +9713,7 @@ let PaymentEcComponent = class PaymentEcComponent extends ComponentHelper {
9683
9713
  this.emitResult();
9684
9714
  };
9685
9715
  this.setMethod = (method) => __awaiter$c(this, void 0, void 0, function* () {
9686
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
9716
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
9687
9717
  if (this.compactPaymentView && this.selectedMethodCode === ((_a = method) === null || _a === void 0 ? void 0 : _a.code) && !this.loading_internal) {
9688
9718
  return;
9689
9719
  }
@@ -9703,17 +9733,20 @@ let PaymentEcComponent = class PaymentEcComponent extends ComponentHelper {
9703
9733
  this.showMethodError = false;
9704
9734
  try {
9705
9735
  const result = yield this.paymentService.putPayment(method.code);
9706
- const balanceCustomer = (_e = result) === null || _e === void 0 ? void 0 : _e.balanceCustomer;
9707
- const totals = (_f = result) === null || _f === void 0 ? void 0 : _f.totals;
9708
- this.cartService.updateBalanceAttributes(balanceCustomer, (_g = totals) === null || _g === void 0 ? void 0 : _g.total);
9736
+ if ((_e = result) === null || _e === void 0 ? void 0 : _e.totals) {
9737
+ this.cartService.updateCartAfterPaymentResponse(result);
9738
+ }
9739
+ const balanceCustomer = (_f = result) === null || _f === void 0 ? void 0 : _f.balanceCustomer;
9740
+ const totals = (_g = result) === null || _g === void 0 ? void 0 : _g.totals;
9741
+ this.cartService.updateBalanceAttributes(balanceCustomer, (_h = totals) === null || _h === void 0 ? void 0 : _h.total);
9709
9742
  const isBalanceMethod = this.isBalanceInAccount(method.code);
9710
- const allowAny = (_h = balanceCustomer) === null || _h === void 0 ? void 0 : _h.allowAnyPaymentMethod;
9743
+ const allowAny = (_j = balanceCustomer) === null || _j === void 0 ? void 0 : _j.allowAnyPaymentMethod;
9711
9744
  // Validaciones de error
9712
9745
  if ((balanceCustomer && allowAny === false && !isBalanceMethod) || // no permite otro método
9713
9746
  (isBalanceMethod && !balanceCustomer) // seleccionó cuenta corriente pero no hay balance
9714
9747
  ) {
9715
9748
  this.handleMethodError('this-payment-method-cannot-be-used', method);
9716
- if (this.compactPaymentView && ((_j = method) === null || _j === void 0 ? void 0 : _j.code)) {
9749
+ if (this.compactPaymentView && ((_k = method) === null || _k === void 0 ? void 0 : _k.code)) {
9717
9750
  }
9718
9751
  return;
9719
9752
  }
@@ -9737,6 +9770,18 @@ let PaymentEcComponent = class PaymentEcComponent extends ComponentHelper {
9737
9770
  this.validatingMethodCode = null;
9738
9771
  }
9739
9772
  });
9773
+ this.getPaymentMethodAdjustmentPreview = (method) => {
9774
+ var _a, _b;
9775
+ const rawValue = (_a = method) === null || _a === void 0 ? void 0 : _a.chargeValue;
9776
+ if (rawValue === null || rawValue === undefined || Number(rawValue) === 0)
9777
+ return null;
9778
+ const value = Number(rawValue);
9779
+ const type = (_b = method) === null || _b === void 0 ? void 0 : _b.chargeType;
9780
+ if (!Number.isFinite(value) || (type !== 'percentage' && type !== 'fixed'))
9781
+ return null;
9782
+ return { type, value };
9783
+ };
9784
+ this.getPaymentMethodAdjustmentPreviewSign = (value) => value > 0 ? '+' : '';
9740
9785
  this.setDirtyState = (nextDirty) => {
9741
9786
  if (this.isDirty === nextDirty)
9742
9787
  return;
@@ -9958,9 +10003,9 @@ __decorate$U([
9958
10003
  PaymentEcComponent = __decorate$U([
9959
10004
  Component({
9960
10005
  selector: 'app-payment-ec',
9961
- template: "<div *ngIf=\"(paymentService.methods$ | async) as methods\"\n [ngClass]=\"compactPaymentView ? '' : 'container-fluid'\">\n <ng-container *ngIf=\"compactPaymentView; else legacyPayment\">\n <app-payment-ec-single\n [loadingInternal]=\"loading_internal\"\n [loadingInternalMp]=\"loading_internal_mp\"\n [paymentLocked]=\"paymentLocked\"\n [validatingMethodCode]=\"validatingMethodCode\"\n [selectedMethodCode]=\"selectedMethodCode\"\n [currentMethod]=\"currentMethod\"\n [showMethodError]=\"showMethodError\"\n [balanceMethodRejected]=\"balanceMethodRejected\"\n [methods]=\"methods\"\n [totalAmount]=\"total_amount\"\n [isMethodDisabled]=\"isPaymentMethodDisabled\"\n [isMP]=\"isMP.bind(this)\"\n [isMPTarjetaDeCredito]=\"isMPTarjetaDeCredito.bind(this)\"\n [isRedirectRedsys]=\"isRedirectRedsys.bind(this)\"\n [isRedirectCecaBank]=\"isRedirectCecaBank.bind(this)\"\n [isPeyPalExpress]=\"isPeyPalExpress.bind(this)\"\n [isMobbex]=\"isMobbex.bind(this)\"\n [isBancard]=\"isBancard.bind(this)\"\n [isDecidir]=\"isDecidir.bind(this)\"\n [isMethodOffline]=\"isMethodOffline.bind(this)\"\n [isCulqi]=\"isCulqi.bind(this)\"\n [isCatastro]=\"isCatastro.bind(this)\"\n [isBamboo]=\"isBamboo.bind(this)\"\n [isBankTransfer]=\"isBankTransfer.bind(this)\"\n [isPlaceToPay]=\"isPlaceToPay.bind(this)\"\n [isBalanceInAccount]=\"isBalanceInAccount.bind(this)\"\n [getPK]=\"getPK.bind(this)\"\n [getPKCulqi]=\"getPKCulqi.bind(this)\"\n [getImageUrl]=\"getPaymentImageUrl.bind(this)\"\n [allData]=\"allData.bind(this)\"\n [paymentServiceInst]=\"paymentService\"\n (selectMethod)=\"setMethod($event)\"\n (verifyValidate)=\"verifyValidate($event)\"\n (setLoading)=\"setLoading()\">\n </app-payment-ec-single>\n </ng-container>\n <ng-template #legacyPayment>\n <div class=\"row\">\n <div class=\"col-12\">\n <div class=\"card \">\n <div class=\"card-header text-dark text-center\">\n <h4>{{ 'select-method' | translate }}</h4>\n <div class=\"btn-toolbar justify-content-center\" role=\"toolbar\" aria-label=\"Envios toolbar\">\n <div class=\"\" role=\"group\" aria-label=\"Grupo botones envio\">\n <div class=\"d-flex align-content-start justify-content-center flex-wrap\">\n <button type=\"button\" class=\"btn btn-outline-secondary mx-1 mb-1\"\n *ngFor=\"let method of methods; let x = index\"\n (click)=\"setMethod(method) ; setActive($event)\">\n {{ method.name | translate }}\n </button>\n </div>\n </div>\n </div>\n </div>\n <div class=\"card-body text-center\">\n <div class=\"row justify-content-center\" *ngIf=\"(method_data$ | async) as method\">\n <ng-container *ngIf=\"!loading_internal ; else loading\">\n <!-- cuenta corriente tiene una configuari\u00F3n de permitir o no otros metodos de pago -->\n <ng-container *ngIf=\"method && !showMethodError\">\n <div class=\"method-container text-dark\" *ngIf=\"isMP(method.code)\">\n <p id=\"faqs\" class=\"qt px-5 \">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <app-mp-redirect-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [paymentServiceInst]=\"paymentService\"\n [allData]=\"allData()\"></app-mp-redirect-ec>\n </div>\n <div class=\"method-container text-dark text-left\"\n *ngIf=\"isMPTarjetaDeCredito(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <p id=\"faqs\" class=\"qt px-5 \">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <div app-mp-credit-ec (ready)=\"verifyValidate()\"\n [public_key]=\"getPK(method)\" [user_data]=\"allData()\"\n [total_amount]=\"total_amount\">\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\"\n *ngIf=\"isRedirectRedsys(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <ng-container\n *ngIf=\"!method.code.includes('bizum') && !method.code.includes('_out_')\">\n <app-redsys-redirect-ec (ready)=\"verifyValidate($event)\"\n [method]=\"method\" [user_data]=\"allData()\">\n </app-redsys-redirect-ec>\n </ng-container>\n <ng-container\n *ngIf=\"method.code.includes('bizum') || method.code.includes('_out_')\">\n <app-redsys-redirect-out-ec (ready)=\"verifyValidate($event)\"\n [method]=\"method\" [user_data]=\"allData()\">\n </app-redsys-redirect-out-ec>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\"\n *ngIf=\"isRedirectCecaBank(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <app-ceca-redirect-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\">\n </app-ceca-redirect-ec>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isPeyPalExpress(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-paypal-express-ec (ready)=\"verifyValidate($event)\"\n [method]=\"method\" [user_data]=\"allData()\"\n [total_amount]=\"total_amount\">\n </app-paypal-express-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isMobbex(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-mobbex-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\">\n </app-mobbex-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isBancard(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bancard-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\">\n </app-bancard-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isDecidir(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-decidir-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\">\n </app-decidir-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isMethodOffline(method.code)\">\n <p id=\"faqs\" class=\"qt px-5\">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading() && verifyValidate()\">{{\n ('pay-with-offline'| translate) }}</button>\n </div>\n <ng-container *ngIf=\"(loading$ | async) as load\">\n <div class=\"mt-2\" *ngIf=\"load\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isCulqi(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <!-- <app-mobbex-ec (ready)=\"verifyValidate($event)\" [method]=\"method\" [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\">\n </app-mobbex-ec> -->\n <app-culqi-ec [apiKey]=\"getPKCulqi(method)\" [method]=\"method\"\n [amount]=\"total_amount\" [customStyle]=\"true\"\n (ready)=\"verifyValidate()\"></app-culqi-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isCatastro(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bancard-catastro-ec (ready)=\"verifyValidate($event)\"\n [method]=\"method\" [user_data]=\"allData()\"\n [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\"></app-bancard-catastro-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isBamboo(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bamboo-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\"></app-bamboo-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isBankTransfer(method.code)\">\n <div class=\"row px-0 description-cont\">\n <ng-container\n *ngFor=\"let line of method.description.split('\\r\\n'); let i=index\">\n <p [id]=\"'faqs-'+i\" [class]=\"'qt px-5 m-0 line-'+i\">{{ line }}</p>\n </ng-container>\n </div>\n <hr *ngIf=\"method.instructions\">\n <div *ngIf=\"method.instructions\" class=\"row px-0 instructions-cont mb-1\">\n <h5 class=\"instructions-title\">{{ ('instructions' | translate) }}</h5>\n <ng-container\n *ngFor=\"let line of method.instructions.split('\\r\\n'); let i=index\">\n <p [class]=\"'px-5 m-0 instructions-text line-'+i \">{{ line }}</p>\n </ng-container>\n </div>\n\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading() && verifyValidate()\">{{\n ('pay-with-transfer'\n | translate) }}</button>\n </div>\n <ng-container *ngIf=\"(loading$ | async) as load\">\n <div class=\"mt-2\" *ngIf=\"load\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isPlaceToPay(method.code)\">\n <p id=\"faqs\" *ngIf=\"method.description\" class=\"qt px-5 \">{{ method.description }}\n </p>\n <p class=\"px-5\" *ngIf=\"method.instructions\">{{ method.instructions }}</p>\n <app-place-to-pay-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [paymentServiceInst]=\"paymentService\" [allData]=\"allData()\">\n </app-place-to-pay-ec>\n </div>\n </ng-container>\n <ng-container *ngIf=\"showMethodError\">\n <div class=\"text-danger mt-2 px-3 fw-bold\">\n {{ 'this-payment-method-cannot-be-used' | translate }}\n </div>\n </ng-container>\n <div class=\"method-container text-dark\"\n *ngIf=\"isBalanceInAccount(method.code) && !showMethodError\">\n <div class=\"row px-0 description-cont\" *ngIf=\"method.description\">\n <ng-container *ngFor=\"let line of method.description.split('\\r\\n'); let i = index\">\n <p [id]=\"'cc-desc-'+i\" [class]=\"'qt px-5 m-0 line-'+i\">{{ line }}</p>\n </ng-container>\n </div>\n\n <hr *ngIf=\"method.instructions\">\n\n <div *ngIf=\"method.instructions\" class=\"row px-0 instructions-cont mb-1\">\n <h5 class=\"instructions-title\">{{ ('instructions' | translate) }}</h5>\n <ng-container *ngFor=\"let line of method.instructions.split('\\r\\n'); let i = index\">\n <p [class]=\"'px-5 m-0 instructions-text line-'+i \">{{ line }}</p>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"!balanceMethodRejected; else showCreditError\">\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading() && verifyValidate()\">\n {{ 'pay-with' | translate }} {{ method.name }}\n </button>\n </div>\n </ng-container>\n\n <ng-template #showCreditError>\n <div class=\"text-danger mt-2 px-3 fw-bold\">\n {{ 'not-enough-credits-to-complete' | translate }}\n </div>\n </ng-template>\n\n <ng-container *ngIf=\"(loading$ | async) as load\">\n <div class=\"mt-2\" *ngIf=\"load\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n</div>\n\n<ng-template #mercadoPago>\n <div class=\"row \">\n <div class=\"col-12 text-center\">\n <app-loading-inline-ec *ngIf=\"loading_internal_mp\"></app-loading-inline-ec>\n <form action=\"javascript:void(0)\" #formContainer></form>\n </div>\n </div>\n</ng-template>\n\n<ng-template #loading>\n <ng-container *ngIf=\"!compactPaymentView\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </ng-container>\n</ng-template>\n",
10006
+ template: "<div *ngIf=\"(paymentService.methods$ | async) as methods\"\n [ngClass]=\"compactPaymentView ? '' : 'container-fluid'\">\n <ng-container *ngIf=\"compactPaymentView; else legacyPayment\">\n <app-payment-ec-single\n [loadingInternal]=\"loading_internal\"\n [loadingInternalMp]=\"loading_internal_mp\"\n [paymentLocked]=\"paymentLocked\"\n [validatingMethodCode]=\"validatingMethodCode\"\n [selectedMethodCode]=\"selectedMethodCode\"\n [currentMethod]=\"currentMethod\"\n [showMethodError]=\"showMethodError\"\n [balanceMethodRejected]=\"balanceMethodRejected\"\n [methods]=\"methods\"\n [totalAmount]=\"total_amount\"\n [getPaymentMethodAdjustmentPreview]=\"getPaymentMethodAdjustmentPreview\"\n [getPaymentMethodAdjustmentPreviewSign]=\"getPaymentMethodAdjustmentPreviewSign\"\n [isMethodDisabled]=\"isPaymentMethodDisabled\"\n [isMP]=\"isMP.bind(this)\"\n [isMPTarjetaDeCredito]=\"isMPTarjetaDeCredito.bind(this)\"\n [isRedirectRedsys]=\"isRedirectRedsys.bind(this)\"\n [isRedirectCecaBank]=\"isRedirectCecaBank.bind(this)\"\n [isPeyPalExpress]=\"isPeyPalExpress.bind(this)\"\n [isMobbex]=\"isMobbex.bind(this)\"\n [isBancard]=\"isBancard.bind(this)\"\n [isDecidir]=\"isDecidir.bind(this)\"\n [isMethodOffline]=\"isMethodOffline.bind(this)\"\n [isCulqi]=\"isCulqi.bind(this)\"\n [isCatastro]=\"isCatastro.bind(this)\"\n [isBamboo]=\"isBamboo.bind(this)\"\n [isBankTransfer]=\"isBankTransfer.bind(this)\"\n [isPlaceToPay]=\"isPlaceToPay.bind(this)\"\n [isBalanceInAccount]=\"isBalanceInAccount.bind(this)\"\n [getPK]=\"getPK.bind(this)\"\n [getPKCulqi]=\"getPKCulqi.bind(this)\"\n [getImageUrl]=\"getPaymentImageUrl.bind(this)\"\n [allData]=\"allData.bind(this)\"\n [paymentServiceInst]=\"paymentService\"\n (selectMethod)=\"setMethod($event)\"\n (verifyValidate)=\"verifyValidate($event)\"\n (setLoading)=\"setLoading()\">\n </app-payment-ec-single>\n </ng-container>\n <ng-template #legacyPayment>\n <div class=\"row\">\n <div class=\"col-12\">\n <div class=\"card \">\n <div class=\"card-header text-dark text-center\">\n <h4>{{ 'select-method' | translate }}</h4>\n <div class=\"btn-toolbar justify-content-center\" role=\"toolbar\" aria-label=\"Envios toolbar\">\n <div class=\"\" role=\"group\" aria-label=\"Grupo botones envio\">\n <div class=\"d-flex align-content-start justify-content-center flex-wrap\">\n <button type=\"button\" class=\"btn btn-outline-secondary mx-1 mb-1\"\n *ngFor=\"let method of methods; let x = index\"\n (click)=\"setMethod(method) ; setActive($event)\">\n {{ method.name | translate }}\n <ng-container *ngIf=\"getPaymentMethodAdjustmentPreview(method) as adjustmentPreview\">\n <small class=\"payment-option-adjustment\">\n <ng-container *ngIf=\"adjustmentPreview.type === 'percentage'; else legacyFixedAdjustment\">\n {{ getPaymentMethodAdjustmentPreviewSign(adjustmentPreview.value) }}{{ adjustmentPreview.value }}%\n </ng-container>\n <ng-template #legacyFixedAdjustment>\n {{ getPaymentMethodAdjustmentPreviewSign(adjustmentPreview.value) }}{{ adjustmentPreview.value | ecCurrencySymbol:'alwaysShowDecimals' }}\n </ng-template>\n </small>\n </ng-container>\n </button>\n </div>\n </div>\n </div>\n </div>\n <div class=\"card-body text-center\">\n <div class=\"row justify-content-center\" *ngIf=\"(method_data$ | async) as method\">\n <ng-container *ngIf=\"!loading_internal ; else loading\">\n <!-- cuenta corriente tiene una configuari\u00F3n de permitir o no otros metodos de pago -->\n <ng-container *ngIf=\"method && !showMethodError\">\n <div class=\"method-container text-dark\" *ngIf=\"isMP(method.code)\">\n <p id=\"faqs\" class=\"qt px-5 \">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <app-mp-redirect-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [paymentServiceInst]=\"paymentService\"\n [allData]=\"allData()\"></app-mp-redirect-ec>\n </div>\n <div class=\"method-container text-dark text-left\"\n *ngIf=\"isMPTarjetaDeCredito(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <p id=\"faqs\" class=\"qt px-5 \">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <div app-mp-credit-ec (ready)=\"verifyValidate()\"\n [public_key]=\"getPK(method)\" [user_data]=\"allData()\"\n [total_amount]=\"total_amount\">\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\"\n *ngIf=\"isRedirectRedsys(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <ng-container\n *ngIf=\"!method.code.includes('bizum') && !method.code.includes('_out_')\">\n <app-redsys-redirect-ec (ready)=\"verifyValidate($event)\"\n [method]=\"method\" [user_data]=\"allData()\">\n </app-redsys-redirect-ec>\n </ng-container>\n <ng-container\n *ngIf=\"method.code.includes('bizum') || method.code.includes('_out_')\">\n <app-redsys-redirect-out-ec (ready)=\"verifyValidate($event)\"\n [method]=\"method\" [user_data]=\"allData()\">\n </app-redsys-redirect-out-ec>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\"\n *ngIf=\"isRedirectCecaBank(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <app-ceca-redirect-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\">\n </app-ceca-redirect-ec>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isPeyPalExpress(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-paypal-express-ec (ready)=\"verifyValidate($event)\"\n [method]=\"method\" [user_data]=\"allData()\"\n [total_amount]=\"total_amount\">\n </app-paypal-express-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isMobbex(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-mobbex-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\">\n </app-mobbex-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isBancard(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bancard-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\">\n </app-bancard-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isDecidir(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-decidir-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\">\n </app-decidir-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isMethodOffline(method.code)\">\n <p id=\"faqs\" class=\"qt px-5\">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading() && verifyValidate()\">{{\n ('pay-with-offline'| translate) }}</button>\n </div>\n <ng-container *ngIf=\"(loading$ | async) as load\">\n <div class=\"mt-2\" *ngIf=\"load\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isCulqi(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <!-- <app-mobbex-ec (ready)=\"verifyValidate($event)\" [method]=\"method\" [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\">\n </app-mobbex-ec> -->\n <app-culqi-ec [apiKey]=\"getPKCulqi(method)\" [method]=\"method\"\n [amount]=\"total_amount\" [customStyle]=\"true\"\n (ready)=\"verifyValidate()\"></app-culqi-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isCatastro(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bancard-catastro-ec (ready)=\"verifyValidate($event)\"\n [method]=\"method\" [user_data]=\"allData()\"\n [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\"></app-bancard-catastro-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isBamboo(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bamboo-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentService\"\n [total_amount]=\"total_amount\"></app-bamboo-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isBankTransfer(method.code)\">\n <div class=\"row px-0 description-cont\">\n <ng-container\n *ngFor=\"let line of method.description.split('\\r\\n'); let i=index\">\n <p [id]=\"'faqs-'+i\" [class]=\"'qt px-5 m-0 line-'+i\">{{ line }}</p>\n </ng-container>\n </div>\n <hr *ngIf=\"method.instructions\">\n <div *ngIf=\"method.instructions\" class=\"row px-0 instructions-cont mb-1\">\n <h5 class=\"instructions-title\">{{ ('instructions' | translate) }}</h5>\n <ng-container\n *ngFor=\"let line of method.instructions.split('\\r\\n'); let i=index\">\n <p [class]=\"'px-5 m-0 instructions-text line-'+i \">{{ line }}</p>\n </ng-container>\n </div>\n\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading() && verifyValidate()\">{{\n ('pay-with-transfer'\n | translate) }}</button>\n </div>\n <ng-container *ngIf=\"(loading$ | async) as load\">\n <div class=\"mt-2\" *ngIf=\"load\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isPlaceToPay(method.code)\">\n <p id=\"faqs\" *ngIf=\"method.description\" class=\"qt px-5 \">{{ method.description }}\n </p>\n <p class=\"px-5\" *ngIf=\"method.instructions\">{{ method.instructions }}</p>\n <app-place-to-pay-ec (ready)=\"verifyValidate($event)\" [method]=\"method\"\n [paymentServiceInst]=\"paymentService\" [allData]=\"allData()\">\n </app-place-to-pay-ec>\n </div>\n </ng-container>\n <ng-container *ngIf=\"showMethodError\">\n <div class=\"text-danger mt-2 px-3 fw-bold\">\n {{ 'this-payment-method-cannot-be-used' | translate }}\n </div>\n </ng-container>\n <div class=\"method-container text-dark\"\n *ngIf=\"isBalanceInAccount(method.code) && !showMethodError\">\n <div class=\"row px-0 description-cont\" *ngIf=\"method.description\">\n <ng-container *ngFor=\"let line of method.description.split('\\r\\n'); let i = index\">\n <p [id]=\"'cc-desc-'+i\" [class]=\"'qt px-5 m-0 line-'+i\">{{ line }}</p>\n </ng-container>\n </div>\n\n <hr *ngIf=\"method.instructions\">\n\n <div *ngIf=\"method.instructions\" class=\"row px-0 instructions-cont mb-1\">\n <h5 class=\"instructions-title\">{{ ('instructions' | translate) }}</h5>\n <ng-container *ngFor=\"let line of method.instructions.split('\\r\\n'); let i = index\">\n <p [class]=\"'px-5 m-0 instructions-text line-'+i \">{{ line }}</p>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"!balanceMethodRejected; else showCreditError\">\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading() && verifyValidate()\">\n {{ 'pay-with' | translate }} {{ method.name }}\n </button>\n </div>\n </ng-container>\n\n <ng-template #showCreditError>\n <div class=\"text-danger mt-2 px-3 fw-bold\">\n {{ 'not-enough-credits-to-complete' | translate }}\n </div>\n </ng-template>\n\n <ng-container *ngIf=\"(loading$ | async) as load\">\n <div class=\"mt-2\" *ngIf=\"load\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n</div>\n\n<ng-template #mercadoPago>\n <div class=\"row \">\n <div class=\"col-12 text-center\">\n <app-loading-inline-ec *ngIf=\"loading_internal_mp\"></app-loading-inline-ec>\n <form action=\"javascript:void(0)\" #formContainer></form>\n </div>\n </div>\n</ng-template>\n\n<ng-template #loading>\n <ng-container *ngIf=\"!compactPaymentView\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </ng-container>\n</ng-template>\n",
9962
10007
  providers: [PaymentService],
9963
- styles: ["div.col-12 form{text-align:center}.option-container>div{margin-bottom:15px}@media only screen and (min-width:600px){.option-container{display:flex;justify-content:space-between;margin-top:20px}}.method-container{width:100%}.active{background-color:#000!important;color:#fff!important}.comprar{background:#000;color:#fff;display:inline-block;font-size:18px;font-weight:600;padding:10px 25px;text-decoration:none;text-transform:uppercase}"]
10008
+ styles: ["div.col-12 form{text-align:center}.option-container>div{margin-bottom:15px}@media only screen and (min-width:600px){.option-container{display:flex;justify-content:space-between;margin-top:20px}}.method-container{width:100%}.active{background-color:#000!important;color:#fff!important}.comprar{background:#000;color:#fff;display:inline-block;font-size:18px;font-weight:600;padding:10px 25px;text-decoration:none;text-transform:uppercase}.payment-option-adjustment{color:#dc3545;font-weight:700;white-space:nowrap}"]
9964
10009
  })
9965
10010
  ], PaymentEcComponent);
9966
10011
 
@@ -10167,10 +10212,12 @@ let CheckoutEcComponent = class CheckoutEcComponent extends ComponentHelper {
10167
10212
  this.goToNextFromAddress = () => this.goToNextSection('address');
10168
10213
  this.isSectionOpen = (stepName) => this.openSections.includes(stepName);
10169
10214
  this.getSummaryLabel = (type, item) => {
10215
+ var _a, _b;
10170
10216
  switch (type) {
10171
10217
  case 'productsBeforeDiscounts': return 'products-before-discounts';
10172
10218
  case 'subtotal': return 'subtotal';
10173
10219
  case 'discount': return 'discount';
10220
+ case 'paymentMethodAdjustment': return (_b = (_a = item) === null || _a === void 0 ? void 0 : _a.amount, (_b !== null && _b !== void 0 ? _b : 0)) < 0 ? 'payment-method-discount' : 'payment-method-surcharge';
10174
10221
  case 'coupon': return 'coupon';
10175
10222
  case 'lineDiscount': return 'line-discounts';
10176
10223
  case 'shipment': return 'shipment';
@@ -10250,6 +10297,8 @@ let CheckoutEcComponent = class CheckoutEcComponent extends ComponentHelper {
10250
10297
  return false;
10251
10298
  if ((item.type === 'discount' || item.type === 'coupon') && this.hideDiscounts)
10252
10299
  return false;
10300
+ if (item.type === 'paymentMethodAdjustment' && (item.amount === 0 || item.amount == null))
10301
+ return false;
10253
10302
  if (item.type === 'taxes' && (this.hideTaxes || item.amount == 0))
10254
10303
  return false;
10255
10304
  if (item.type === 'clientTaxes' && (this.hideTaxes || item.amount == 0))
@@ -10609,7 +10658,7 @@ __decorate$V([
10609
10658
  CheckoutEcComponent = __decorate$V([
10610
10659
  Component({
10611
10660
  selector: 'app-checkout-ec',
10612
- template: "<main class=\"py-4\" id=\"appCheckoutEc\">\n <ng-container *ngIf=\"(checkoutService.loading$ | async) as load\">\n <div class=\"checkout-loading-overlay\" *ngIf=\"load\">\n <div class=\"checkout-loading-card\">\n <app-loading-full-ec></app-loading-full-ec>\n <h5>{{ 'processing-payment' | translate }}</h5>\n </div>\n </div>\n </ng-container>\n <div *ngIf=\"canCheckout; else cartEmpty\">\n <ng-container *ngIf=\"checkoutView === 'single'; else legacyCheckout\">\n <div class=\"container\">\n <div class=\"row checkout-single-row\">\n <div class=\"col-lg-8 col-12\">\n <div class=\"checkout-single\">\n <div class=\"checkout-section\" *ngFor=\"let step of steps; let x=index\"\n [attr.data-step]=\"step.name\"\n [class.is-disabled]=\"!isStepEnabled(step.name)\"\n [class.is-complete]=\"isStepComplete(step.name)\">\n <button class=\"section-header\" type=\"button\"\n [attr.aria-expanded]=\"isSectionOpen(step.name)\"\n [disabled]=\"!isStepEnabled(step.name)\"\n (click)=\"toggleSection(step.name)\">\n <span class=\"section-index\">{{ x + 1 }}</span>\n <span class=\"section-title\">\n {{ getSingleStepTitle(step) | translate }}\n </span>\n <span class=\"section-state\" *ngIf=\"isStepComplete(step.name)\">\n &#10003;\n </span>\n </button>\n <div class=\"section-summary\" *ngIf=\"isStepComplete(step.name) && !isSectionOpen(step.name)\"\n role=\"button\" tabindex=\"0\"\n (click)=\"toggleSection(step.name)\"\n (keydown.enter)=\"toggleSection(step.name)\"\n (keydown.space)=\"toggleSection(step.name)\">\n <span class=\"section-summary-label\">\n {{ getSingleSummaryLabel(step) }}\n </span>\n <span class=\"section-summary-value\">\n {{ getSingleSummaryValue(step) }}\n </span>\n <span class=\"section-summary-edit\"\n role=\"button\"\n tabindex=\"0\"\n (click)=\"toggleSection(step.name); $event.stopPropagation()\"\n (keydown.enter)=\"toggleSection(step.name); $event.stopPropagation()\"\n (keydown.space)=\"toggleSection(step.name); $event.stopPropagation()\">\n {{ 'edit' | translate }}\n </span>\n </div>\n <div class=\"section-body\" [hidden]=\"!isSectionOpen(step.name)\">\n <ng-container [ngSwitch]=\"step.name\">\n <ng-container *ngSwitchCase=\"'address'\">\n <app-dataform-ec [step_id]=\"step.step\" [isLastOne]=\"false\"\n [nextStep]=\"goToNextFromAddress\" [compactAddressView]=\"true\"\n (dirtyChange)=\"onStepDirtyChange('address', $event)\">\n </app-dataform-ec>\n </ng-container>\n <ng-container *ngSwitchCase=\"'shipment'\">\n <app-shipment-ec [step_id]=\"step.step\" [compactShipmentView]=\"true\"\n (advanceStep)=\"goToNextSection(step.name)\"\n (summaryChange)=\"setShipmentSummary($event)\">\n </app-shipment-ec>\n </ng-container>\n <ng-container *ngSwitchCase=\"'payment'\">\n <app-payment-ec [step_id]=\"step.step\" [compactPaymentView]=\"true\"\n (dirtyChange)=\"onStepDirtyChange('payment', $event)\"></app-payment-ec>\n </ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-lg-4 col-12\">\n <ng-container *ngIf=\"(checkoutService.state$ | async) as checkoutState\">\n <aside class=\"checkout-summary\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true) || (areAllStepsReady(checkoutState) && !shouldHideFinishButton(checkoutState))\">\n <ng-container *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <h4 class=\"summary-title\">\n {{ checkoutView === 'single' ? ('payment-summary' | translate) : ('purchase-summary' | translate) }}\n </h4>\n <div class=\"summary-totals\" *ngIf=\"(checkoutService.asociatedData$ | async) as data\">\n <ng-container *ngFor=\"let item of getSummaryData(data)\">\n <div class=\"summary-total-row\" *ngIf=\"shouldShowSummaryItem(item)\"\n [class.summary-total-row-total]=\"item.type === 'total'\"\n [class.summary-total-row-tax-info]=\"item.type === 'taxes' && item.taxesIncludedInTotal === true\">\n <span>{{ getSummaryLabel(item.type, item) | translate }}</span>\n <ng-container *ngIf=\"getSummaryAmountView(item) as priceView\">\n <span class=\"summary-total-row-price\"\n [class.summary-total-row-price--discounted]=\"priceView.showOriginalPrice\"\n [class.summary-total-row-price--free]=\"priceView.isFree\">\n <del *ngIf=\"priceView.showOriginalPrice\">\n {{ priceView.originalPrice | ecCurrencySymbol:'alwaysShowDecimals' }}\n </del>\n <strong>\n <ng-container *ngIf=\"priceView.isFree; else summaryValue\">\n {{ 'free' | translate }}\n </ng-container>\n <ng-template #summaryValue>\n {{ priceView.finalPrice | ecCurrencySymbol:'alwaysShowDecimals' }}\n </ng-template>\n </strong>\n </span>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n <button class=\"btn valid-btn w-100 mt-3 text-uppercase\"\n id=\"checkoutFinishBtn\"\n *ngIf=\"areAllStepsReady(checkoutState) && !shouldHideFinishButton(checkoutState)\"\n (click)=\"endCheckout()\">\n {{ 'finish-checkout' | translate }}\n </button>\n </aside>\n </ng-container>\n </div>\n </div>\n <ng-container *ngIf=\"(checkoutService.asociatedData$ | async) as data\">\n <ng-container *ngIf=\"(checkoutService.state$ | async) as checkoutState\">\n <div class=\"summary-mobile-bar\" [class.is-hidden]=\"hideMobileSummaryBar\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <div class=\"summary-mobile-total\">\n <span class=\"summary-mobile-label\">{{ 'total' | translate }}</span>\n <span class=\"summary-mobile-value\">\n {{ getTotalAmount(data) != null ? (getTotalAmount(data) | ecCurrencySymbol:'alwaysShowDecimals') : '--' }}\n </span>\n </div>\n <button class=\"btn valid-btn summary-mobile-btn\"\n *ngIf=\"!shouldHideFinishButton(checkoutState)\"\n [disabled]=\"!areAllStepsReady(checkoutState)\"\n (click)=\"endCheckout()\">\n {{ 'finish-checkout' | translate }}\n </button>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #unsavedChangesModal>\n <div class=\"modal-content checkout-unsaved-modal-content\">\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">{{ 'unsaved-changes-title' | translate }}</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\"\n (click)=\"cancelUnsavedClose()\"></button>\n </div>\n <div class=\"modal-body\">\n {{ 'unsaved-changes-body' | translate }}\n </div>\n <div class=\"modal-footer\">\n <button type=\"button\" class=\"btn btn-outline-secondary btn-keep-editing\"\n (click)=\"cancelUnsavedClose()\">\n {{ 'unsaved-changes-continue' | translate }}\n </button>\n <button type=\"button\" class=\"btn btn-primary btn-discard\" (click)=\"confirmUnsavedDiscard()\">\n {{ 'unsaved-changes-discard' | translate }}\n </button>\n </div>\n </div>\n </ng-template>\n </div>\n </ng-container>\n <ng-template #legacyCheckout>\n <app-detail-checkout-block-ec></app-detail-checkout-block-ec>\n <div class=\"container\">\n <div class=\"row\">\n <div class=\"col-md-12 col-12\">\n <div id=\"stepper\" class=\"bs-stepper\" *ngIf=\"(checkoutService.state$ | async) as state\">\n\n <div class=\"row mb-3 position-relative stepperContainer\">\n <ng-container *ngFor=\"let step of steps; let x=index\">\n <div [class]=\"'px-0 col-'+(12 / steps.length)\">\n <div [class]=\"'step ' + getClassToStepper(x)\" [attr.data-target]=\"'#test-l-'+step.step\">\n <button class=\"step-trigger\">\n <span class=\"bs-stepper-circle\">{{x+1}}</span>\n <span class=\"bs-stepper-label\">{{ step.label |translate}}</span>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n\n <!-- CONTENT -->\n <div class=\"bs-stepper-content margin-bottom-i\">\n <div *ngIf=\"(checkoutService.state$ | async) as checkoutState\">\n <ng-container *ngFor=\"let step of steps; let x=index\">\n <div [id]=\"'test-l-'+step.step\" class=\"content\">\n <app-step-ec [step_id]=\"step.step\" [id_step]=\"x+1\" [previousStep]=\"steps[x-1] ? steps[x-1].name : step.name\" [nextStep]=\"steps[x+1] ? next : endCheckout\" [goBack]=\"goBack\" [lastStep]=\"steps[x+1] ? false : true\"> \n </app-step-ec> \n </div>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"(checkoutService.loading$ | async) as load\">\n <div class=\"col-md-12 col-12\">\n <div *ngIf=\"load\" class=\"d-flex flex-column jusitfy-content-center align-items-center mt-2\">\n <app-loading-full-ec></app-loading-full-ec>\n <h5>{{ 'processing-payment' | translate }}</h5>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n </ng-template>\n </div>\n</main>\n\n<ng-template #cartEmpty>\n <div class=\"wrap\">\n <div *ngIf=\"(loading$ | async) as load\">\n <app-loading-full-ec *ngIf=\"canCheckout\"></app-loading-full-ec>\n </div>\n <section id=\"cart\" *ngIf=\"!canCheckout\">\n <section id=\"cart bg-white h-50\">\n <div class=\"d-flex flex-column justify-content-center align-items-center text-center\">\n <h4>{{ 'empty-cart' | translate }}</h4>\n <h5>{{ 'empty-cart-detail' | translate }}</h5>\n </div>\n </section>\n </section>\n </div>\n</ng-template>\n\n<ng-template #loading>\n <app-loading-full-ec></app-loading-full-ec>\n</ng-template>\n\n<ng-template #requireLoginView>\n</ng-template>\n\n\n<!-- <ec-checkout-error></ec-checkout-error> -->\n",
10661
+ template: "<main class=\"py-4\" id=\"appCheckoutEc\">\n <ng-container *ngIf=\"(checkoutService.loading$ | async) as load\">\n <div class=\"checkout-loading-overlay\" *ngIf=\"load\">\n <div class=\"checkout-loading-card\">\n <app-loading-full-ec></app-loading-full-ec>\n <h5>{{ 'processing-payment' | translate }}</h5>\n </div>\n </div>\n </ng-container>\n <div *ngIf=\"canCheckout; else cartEmpty\">\n <ng-container *ngIf=\"checkoutView === 'single'; else legacyCheckout\">\n <div class=\"container\">\n <div class=\"row checkout-single-row\">\n <div class=\"col-lg-8 col-12\">\n <div class=\"checkout-single\">\n <div class=\"checkout-section\" *ngFor=\"let step of steps; let x=index\"\n [attr.data-step]=\"step.name\"\n [class.is-disabled]=\"!isStepEnabled(step.name)\"\n [class.is-complete]=\"isStepComplete(step.name)\">\n <button class=\"section-header\" type=\"button\"\n [attr.aria-expanded]=\"isSectionOpen(step.name)\"\n [disabled]=\"!isStepEnabled(step.name)\"\n (click)=\"toggleSection(step.name)\">\n <span class=\"section-index\">{{ x + 1 }}</span>\n <span class=\"section-title\">\n {{ getSingleStepTitle(step) | translate }}\n </span>\n <span class=\"section-state\" *ngIf=\"isStepComplete(step.name)\">\n &#10003;\n </span>\n </button>\n <div class=\"section-summary\" *ngIf=\"isStepComplete(step.name) && !isSectionOpen(step.name)\"\n role=\"button\" tabindex=\"0\"\n (click)=\"toggleSection(step.name)\"\n (keydown.enter)=\"toggleSection(step.name)\"\n (keydown.space)=\"toggleSection(step.name)\">\n <span class=\"section-summary-label\">\n {{ getSingleSummaryLabel(step) }}\n </span>\n <span class=\"section-summary-value\">\n {{ getSingleSummaryValue(step) }}\n </span>\n <span class=\"section-summary-edit\"\n role=\"button\"\n tabindex=\"0\"\n (click)=\"toggleSection(step.name); $event.stopPropagation()\"\n (keydown.enter)=\"toggleSection(step.name); $event.stopPropagation()\"\n (keydown.space)=\"toggleSection(step.name); $event.stopPropagation()\">\n {{ 'edit' | translate }}\n </span>\n </div>\n <div class=\"section-body\" [hidden]=\"!isSectionOpen(step.name)\">\n <ng-container [ngSwitch]=\"step.name\">\n <ng-container *ngSwitchCase=\"'address'\">\n <app-dataform-ec [step_id]=\"step.step\" [isLastOne]=\"false\"\n [nextStep]=\"goToNextFromAddress\" [compactAddressView]=\"true\"\n (dirtyChange)=\"onStepDirtyChange('address', $event)\">\n </app-dataform-ec>\n </ng-container>\n <ng-container *ngSwitchCase=\"'shipment'\">\n <app-shipment-ec [step_id]=\"step.step\" [compactShipmentView]=\"true\"\n (advanceStep)=\"goToNextSection(step.name)\"\n (summaryChange)=\"setShipmentSummary($event)\">\n </app-shipment-ec>\n </ng-container>\n <ng-container *ngSwitchCase=\"'payment'\">\n <app-payment-ec [step_id]=\"step.step\" [compactPaymentView]=\"true\"\n (dirtyChange)=\"onStepDirtyChange('payment', $event)\"></app-payment-ec>\n </ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-lg-4 col-12\">\n <ng-container *ngIf=\"(checkoutService.state$ | async) as checkoutState\">\n <aside class=\"checkout-summary\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true) || (areAllStepsReady(checkoutState) && !shouldHideFinishButton(checkoutState))\">\n <ng-container *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <h4 class=\"summary-title\">\n {{ checkoutView === 'single' ? ('payment-summary' | translate) : ('purchase-summary' | translate) }}\n </h4>\n <div class=\"summary-totals\" *ngIf=\"(checkoutService.asociatedData$ | async) as data\">\n <ng-container *ngFor=\"let item of getSummaryData(data)\">\n <div class=\"summary-total-row\" *ngIf=\"shouldShowSummaryItem(item)\"\n [class.summary-total-row-total]=\"item.type === 'total'\"\n [class.summary-total-row-tax-info]=\"item.type === 'taxes' && item.taxesIncludedInTotal === true\">\n <span>\n {{ getSummaryLabel(item.type, item) | translate }}\n <ng-container *ngIf=\"item.type === 'paymentMethodAdjustment' && item.name && item.name !== 'discount' && item.name !== 'surcharge'\">\n \u00B7 {{ item.name }}\n </ng-container>\n </span>\n <ng-container *ngIf=\"getSummaryAmountView(item) as priceView\">\n <span class=\"summary-total-row-price\"\n [class.summary-total-row-price--discounted]=\"priceView.showOriginalPrice\"\n [class.summary-total-row-price--free]=\"priceView.isFree\">\n <del *ngIf=\"priceView.showOriginalPrice\">\n {{ priceView.originalPrice | ecCurrencySymbol:'alwaysShowDecimals' }}\n </del>\n <strong>\n <ng-container *ngIf=\"priceView.isFree; else summaryValue\">\n {{ 'free' | translate }}\n </ng-container>\n <ng-template #summaryValue>\n {{ priceView.finalPrice | ecCurrencySymbol:'alwaysShowDecimals' }}\n </ng-template>\n </strong>\n </span>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n <button class=\"btn valid-btn w-100 mt-3 text-uppercase\"\n id=\"checkoutFinishBtn\"\n *ngIf=\"areAllStepsReady(checkoutState) && !shouldHideFinishButton(checkoutState)\"\n (click)=\"endCheckout()\">\n {{ 'finish-checkout' | translate }}\n </button>\n </aside>\n </ng-container>\n </div>\n </div>\n <ng-container *ngIf=\"(checkoutService.asociatedData$ | async) as data\">\n <ng-container *ngIf=\"(checkoutService.state$ | async) as checkoutState\">\n <div class=\"summary-mobile-bar\" [class.is-hidden]=\"hideMobileSummaryBar\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <div class=\"summary-mobile-total\">\n <span class=\"summary-mobile-label\">{{ 'total' | translate }}</span>\n <span class=\"summary-mobile-value\">\n {{ getTotalAmount(data) != null ? (getTotalAmount(data) | ecCurrencySymbol:'alwaysShowDecimals') : '--' }}\n </span>\n </div>\n <button class=\"btn valid-btn summary-mobile-btn\"\n *ngIf=\"!shouldHideFinishButton(checkoutState)\"\n [disabled]=\"!areAllStepsReady(checkoutState)\"\n (click)=\"endCheckout()\">\n {{ 'finish-checkout' | translate }}\n </button>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #unsavedChangesModal>\n <div class=\"modal-content checkout-unsaved-modal-content\">\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">{{ 'unsaved-changes-title' | translate }}</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\"\n (click)=\"cancelUnsavedClose()\"></button>\n </div>\n <div class=\"modal-body\">\n {{ 'unsaved-changes-body' | translate }}\n </div>\n <div class=\"modal-footer\">\n <button type=\"button\" class=\"btn btn-outline-secondary btn-keep-editing\"\n (click)=\"cancelUnsavedClose()\">\n {{ 'unsaved-changes-continue' | translate }}\n </button>\n <button type=\"button\" class=\"btn btn-primary btn-discard\" (click)=\"confirmUnsavedDiscard()\">\n {{ 'unsaved-changes-discard' | translate }}\n </button>\n </div>\n </div>\n </ng-template>\n </div>\n </ng-container>\n <ng-template #legacyCheckout>\n <app-detail-checkout-block-ec></app-detail-checkout-block-ec>\n <div class=\"container\">\n <div class=\"row\">\n <div class=\"col-md-12 col-12\">\n <div id=\"stepper\" class=\"bs-stepper\" *ngIf=\"(checkoutService.state$ | async) as state\">\n\n <div class=\"row mb-3 position-relative stepperContainer\">\n <ng-container *ngFor=\"let step of steps; let x=index\">\n <div [class]=\"'px-0 col-'+(12 / steps.length)\">\n <div [class]=\"'step ' + getClassToStepper(x)\" [attr.data-target]=\"'#test-l-'+step.step\">\n <button class=\"step-trigger\">\n <span class=\"bs-stepper-circle\">{{x+1}}</span>\n <span class=\"bs-stepper-label\">{{ step.label |translate}}</span>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n\n <!-- CONTENT -->\n <div class=\"bs-stepper-content margin-bottom-i\">\n <div *ngIf=\"(checkoutService.state$ | async) as checkoutState\">\n <ng-container *ngFor=\"let step of steps; let x=index\">\n <div [id]=\"'test-l-'+step.step\" class=\"content\">\n <app-step-ec [step_id]=\"step.step\" [id_step]=\"x+1\" [previousStep]=\"steps[x-1] ? steps[x-1].name : step.name\" [nextStep]=\"steps[x+1] ? next : endCheckout\" [goBack]=\"goBack\" [lastStep]=\"steps[x+1] ? false : true\"> \n </app-step-ec> \n </div>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"(checkoutService.loading$ | async) as load\">\n <div class=\"col-md-12 col-12\">\n <div *ngIf=\"load\" class=\"d-flex flex-column jusitfy-content-center align-items-center mt-2\">\n <app-loading-full-ec></app-loading-full-ec>\n <h5>{{ 'processing-payment' | translate }}</h5>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n </ng-template>\n </div>\n</main>\n\n<ng-template #cartEmpty>\n <div class=\"wrap\">\n <div *ngIf=\"(loading$ | async) as load\">\n <app-loading-full-ec *ngIf=\"canCheckout\"></app-loading-full-ec>\n </div>\n <section id=\"cart\" *ngIf=\"!canCheckout\">\n <section id=\"cart bg-white h-50\">\n <div class=\"d-flex flex-column justify-content-center align-items-center text-center\">\n <h4>{{ 'empty-cart' | translate }}</h4>\n <h5>{{ 'empty-cart-detail' | translate }}</h5>\n </div>\n </section>\n </section>\n </div>\n</ng-template>\n\n<ng-template #loading>\n <app-loading-full-ec></app-loading-full-ec>\n</ng-template>\n\n<ng-template #requireLoginView>\n</ng-template>\n\n\n<!-- <ec-checkout-error></ec-checkout-error> -->\n",
10613
10662
  styles: ["@import url(https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&family=Roboto:wght@400;500;700&family=Source+Sans+Pro:wght@400;600;700&display=swap);.btn.valid-btn{background-color:var(--ec-primary,#000);border-color:var(--ec-primary,#000);color:var(--ec-primary-contrast,#fff);margin-right:12px}.btn.valid-btn:disabled,.btn.valid-btn[disabled]{background-color:var(--ec-primary-muted,#6c757d);border-color:var(--ec-primary-muted,#6c757d);color:var(--ec-primary-contrast,#fff);opacity:.8}.switch{position:relative;display:inline-block;width:16%!important;height:34px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.slider:before{position:absolute;content:\"\";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;transition:.4s}input:checked+.slider{background-color:#000}input:focus+.slider{box-shadow:0 0 1px #000}input:checked+.slider:before{transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.bg-white{background-color:#fff}#appCheckoutEc,#appCheckoutEc *{font-family:var(--ec-checkout-font, \"Source Sans Pro\", Roboto, \"Open Sans\", \"Helvetica Neue\", Arial, sans-serif)!important}.active .bs-stepper-circle{background-color:#000}.margin-bottom-i{margin-bottom:3%}.Main{margin-top:140px;min-height:60vh}.btn:disabled{opacity:.65}.co-data-icon{height:50px;-o-object-fit:contain;object-fit:contain}.checkout-btn-container{display:flex;justify-content:space-between}.loading-container-line{display:flex;flex-direction:row;justify-content:center}.stepperContainer::after{content:\"\";border-top:1px solid #000;position:absolute;width:95%;top:48%;left:10px;margin:auto;z-index:-1}.bs-stepper .step-trigger{background-color:#fff}.bs-stepper .step-trigger.disabled,.bs-stepper .step-trigger:disabled{opacity:1}@media screen and (max-width:992px){.stepperContainer::after{display:none}.step{text-align:left!important}}@media screen and (max-width:576px){.step{text-align:center!important}.resumen i{font-size:2em}.resumen strong{font-size:.8em}.resumen span{font-size:1em}}@media screen and (max-width:768px){.step-trigger .bs-stepper-label{font-size:.75rem}.content.fade.active.dstepper-block{padding-top:1rem}}.checkout-single{display:flex;flex-direction:column;gap:1rem;--ec-accent:#000;--ec-accent-contrast:#fff;--ec-accent-soft:#f5f8ff;--ec-border:#e3e3e3;--ec-muted:#666;--ec-surface:#fff;--ec-surface-alt:#fafafa;--ec-success:#16a34a}:host ::ng-deep .checkout-unsaved-modal .modal-dialog{max-width:420px;margin:1.5rem auto}:host ::ng-deep .checkout-unsaved-modal-content{border-radius:10px;border:1px solid rgba(0,0,0,.08);box-shadow:0 18px 36px rgba(0,0,0,.18)}:host ::ng-deep .checkout-unsaved-modal-content .modal-header{border-bottom:0;padding:1.1rem 1.25rem .5rem;align-items:flex-start}:host ::ng-deep .checkout-unsaved-modal-content .modal-title{font-size:1.05rem;font-weight:600;color:#111}:host ::ng-deep .checkout-unsaved-modal-content .modal-body{padding:.4rem 1.25rem 1rem;color:#555;font-size:.95rem;line-height:1.4}:host ::ng-deep .checkout-unsaved-modal-content .modal-footer{border-top:0;padding:0 1.25rem 1.25rem;display:flex;gap:.6rem;justify-content:flex-end}:host ::ng-deep .checkout-unsaved-modal-content .btn-keep-editing{border-color:#d0d5dd;color:#344054;background:#fff;font-weight:600}:host ::ng-deep .checkout-unsaved-modal-content .btn-discard{background-color:var(--ec-primary,#000);border-color:var(--ec-primary,#000);color:var(--ec-primary-contrast,#fff);font-weight:600}.checkout-section{border:1px solid var(--ec-border);border-radius:6px;background:var(--ec-surface);overflow:hidden}.checkout-single .checkout-section{overflow:visible}.checkout-section.is-disabled{opacity:.6}.checkout-section.is-complete{border-color:var(--ec-success)}.section-header{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem;background:var(--ec-surface-alt);border:0;text-align:left}.checkout-section.is-complete .section-header{background:rgba(22,163,74,.08)}.checkout-section.is-complete .section-index,.checkout-section.is-complete .section-state{background:var(--ec-success);color:#fff}.section-index{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--ec-accent);color:var(--ec-accent-contrast);font-weight:600}.section-summary{display:-ms-grid;display:grid;-ms-grid-columns:1fr auto;grid-template-columns:1fr auto;-ms-grid-rows:auto auto;grid-template-rows:auto auto;gap:.2rem .75rem;align-items:center;padding:.5rem 1rem .85rem;font-size:.9rem;color:var(--ec-muted)}.section-summary-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ec-muted)}.section-summary-value{font-weight:600;color:#111;-ms-grid-column:1;-ms-grid-column-span:1;grid-column:1/2}.section-summary-edit{-ms-grid-column:2;-ms-grid-column-span:1;grid-column:2/3;-ms-grid-row:1;-ms-grid-row-span:2;grid-row:1/3;-ms-grid-row-align:center;align-self:center;-ms-grid-column-align:end;justify-self:end;font-size:.8rem;font-weight:700;color:var(--ec-accent,#000);text-transform:uppercase;letter-spacing:.04em}.section-summary-edit:focus{outline:2px solid var(--ec-accent,#000);outline-offset:2px;border-radius:4px}.section-title{flex:1;font-weight:600}.section-state{width:32px;height:32px;border-radius:50%;background:#e7f6ea;color:#2f7a32;display:inline-flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;line-height:1}.section-body{padding:1rem 1.25rem}.section-actions{display:flex;justify-content:flex-end;margin-top:1rem}.checkout-summary{border:1px solid #e3e3e3;border-radius:6px;padding:1rem;background:#fff;position:-webkit-sticky;position:sticky;top:var(--ec-checkout-sticky-top,1rem)}.summary-title{font-weight:600;margin-bottom:1rem}.checkout-single .valid-btn{font-size:1rem;padding:.7rem 1.1rem;letter-spacing:.02em;text-transform:uppercase}.checkout-single #checkoutFinishBtn,.checkout-single .summary-mobile-btn{background-color:var(--ec-primary,#000);border-color:var(--ec-primary,#000);color:var(--ec-primary-contrast,#fff);text-transform:uppercase}.checkout-single #checkoutFinishBtn:disabled,.checkout-single #checkoutFinishBtn[disabled],.checkout-single .summary-mobile-btn:disabled,.checkout-single .summary-mobile-btn[disabled]{background-color:var(--ec-primary-muted,#6c757d);border-color:var(--ec-primary-muted,#6c757d);color:var(--ec-primary-contrast,#fff);opacity:.8}.summary-products{border-bottom:1px solid #eee;margin-bottom:1rem;padding-bottom:1rem}.summary-product{display:-ms-grid;display:grid;-ms-grid-columns:1fr auto;grid-template-columns:1fr auto;gap:.25rem .5rem;align-items:center;padding:.35rem 0;border-bottom:1px solid #f1f1f1}.summary-product:last-child{border-bottom:0}.summary-product-main{display:flex;flex-direction:column;gap:.2rem;min-width:0}.summary-product-name{font-weight:500;font-size:.95rem;color:#222;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.summary-product-qty{font-size:.85rem;color:#666}.summary-product-price{font-weight:600;font-size:.9rem;color:#222}.summary-totals{display:flex;flex-direction:column;gap:.5rem;padding-top:.75rem}.summary-total-row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font-weight:500;font-size:.95rem;color:#555}.summary-total-row>span:first-child{min-width:0}.summary-total-row-total{font-size:1.1rem;font-weight:700;color:#111;margin-top:.5rem;padding-top:.75rem;border-top:1px solid #e5e7eb}.summary-total-row-tax-info{order:1;font-size:.82rem;font-weight:400;color:#6b7280;gap:.75rem}.summary-total-row-tax-info .summary-total-row-price,.summary-total-row-tax-info .summary-total-row-price strong{font-weight:400;color:#6b7280}.summary-total-row-price{flex:0 0 auto;white-space:nowrap;display:inline-flex;flex-direction:column;align-items:flex-end;gap:.15rem;text-align:right}.summary-total-row-price del{color:#888;font-weight:500;text-decoration-thickness:1px}.summary-total-row-price strong{font-weight:700}.summary-total-row-price--free strong{color:var(--ec-success,#198754)}.summary-total-row-price--discounted strong{color:#111}.summary-mobile-bar{display:none}@media screen and (max-width:992px){.checkout-summary{position:static;margin-top:.75rem}.checkout-single{padding-bottom:20px}.summary-mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:var(--ec-checkout-summary-mobile-z-index,10040);display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.6rem .9rem calc(.6rem + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #e5e7eb;box-shadow:0 -6px 18px rgba(15,23,42,.08)}.summary-mobile-total{display:flex;flex-direction:column;gap:.2rem}.summary-mobile-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:#6b7280}.summary-mobile-value{font-weight:700;font-size:1.05rem;color:#111827}.summary-mobile-btn{padding:.7rem 1.1rem;font-size:.95rem;white-space:nowrap}}:host-context(.modal-open) .summary-mobile-bar{z-index:var(--ec-checkout-summary-mobile-z-index-modal-open,1030)}.checkout-loading-overlay{position:fixed;inset:0;background:rgba(17,24,39,.45);display:flex;align-items:center;justify-content:center;z-index:var(--ec-checkout-overlay-z-index,10050);padding:1.5rem}.checkout-loading-card{background:#fff;border-radius:12px;padding:1.5rem 2rem;box-shadow:0 20px 40px rgba(0,0,0,.2);display:flex;flex-direction:column;align-items:center;gap:.75rem;text-align:center}.checkout-loading-card h5{margin:0;font-weight:600;color:#111}.summary-mobile-bar.is-hidden{display:none}"]
10614
10663
  })
10615
10664
  ], CheckoutEcComponent);
@@ -10756,6 +10805,8 @@ let PaymentEcSingleComponent = class PaymentEcSingleComponent {
10756
10805
  this.balanceMethodRejected = false;
10757
10806
  this.methods = [];
10758
10807
  this.totalAmount = null;
10808
+ this.getPaymentMethodAdjustmentPreview = () => null;
10809
+ this.getPaymentMethodAdjustmentPreviewSign = () => '';
10759
10810
  this.isMethodDisabled = () => false;
10760
10811
  this.isMP = () => false;
10761
10812
  this.isMPTarjetaDeCredito = () => false;
@@ -10813,6 +10864,12 @@ __decorate$X([
10813
10864
  __decorate$X([
10814
10865
  Input()
10815
10866
  ], PaymentEcSingleComponent.prototype, "totalAmount", void 0);
10867
+ __decorate$X([
10868
+ Input()
10869
+ ], PaymentEcSingleComponent.prototype, "getPaymentMethodAdjustmentPreview", void 0);
10870
+ __decorate$X([
10871
+ Input()
10872
+ ], PaymentEcSingleComponent.prototype, "getPaymentMethodAdjustmentPreviewSign", void 0);
10816
10873
  __decorate$X([
10817
10874
  Input()
10818
10875
  ], PaymentEcSingleComponent.prototype, "isMethodDisabled", void 0);
@@ -10888,8 +10945,8 @@ __decorate$X([
10888
10945
  PaymentEcSingleComponent = __decorate$X([
10889
10946
  Component({
10890
10947
  selector: 'app-payment-ec-single',
10891
- template: "<div *ngIf=\"methods?.length\">\n <div class=\"payment-compact payment-compact-flat payment-step-surface\">\n <div class=\"single-step-overlay\" *ngIf=\"loadingInternalMp\">\n <app-loading-full-ec></app-loading-full-ec>\n </div>\n <div class=\"card-body\">\n <div class=\"payment-lock-message\" *ngIf=\"paymentLocked\">\n {{ 'shipment-method-required' | translate }}\n </div>\n <div class=\"payment-options\" [class.is-locked]=\"paymentLocked\">\n <ng-container *ngFor=\"let method of methods\">\n <label class=\"payment-option\"\n [class.is-selected]=\"selectedMethodCode === method.code\"\n [class.is-disabled]=\"isMethodDisabled(method)\">\n <input class=\"payment-option-input\" type=\"radio\" name=\"payment-option\"\n [checked]=\"selectedMethodCode === method.code\"\n [disabled]=\"paymentLocked || isMethodDisabled(method)\"\n (click)=\"selectMethod.emit(method)\">\n <span class=\"payment-option-title\">{{ method.name | translate }}</span>\n <span class=\"payment-option-logos\" *ngIf=\"method.images?.length\">\n <img class=\"payment-option-logo\"\n *ngFor=\"let logo of getVisibleImages(method.images)\"\n [src]=\"getImageUrl ? getImageUrl(logo) : (logo?.path || logo?.url || logo?.src || logo)\"\n [alt]=\"logo?.name || (method.name || '')\"\n [title]=\"logo?.name || (method.name || '')\">\n <span class=\"payment-option-more\"\n *ngIf=\"method.images.length > 4\"\n [tooltip]=\"hiddenImagesTpl\"\n placement=\"top\"\n container=\"body\"\n triggers=\"hover\">\n +{{ method.images.length - 3 }}\n </span>\n <ng-template #hiddenImagesTpl>\n <span class=\"payment-tooltip-logos\">\n <img class=\"payment-tooltip-logo\"\n *ngFor=\"let logo of getHiddenImages(method.images)\"\n [src]=\"getImageUrl ? getImageUrl(logo) : (logo?.path || logo?.url || logo?.src || logo)\"\n [alt]=\"logo?.name || ''\">\n </span>\n </ng-template>\n </span>\n </label>\n <div class=\"payment-option-details\" *ngIf=\"selectedMethodCode === method.code\">\n <ng-container *ngIf=\"validatingMethodCode === method.code; else methodContent\">\n <div class=\"d-flex justify-content-center py-2\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n <ng-template #methodContent>\n <ng-container *ngIf=\"!showMethodError && currentMethod?.code === method.code\">\n <div class=\"method-container text-dark\" *ngIf=\"isMP(method.code)\">\n <p id=\"faqs\" class=\"qt px-5 \">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <app-mp-redirect-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [paymentServiceInst]=\"paymentServiceInst\"\n [allData]=\"allData()\"></app-mp-redirect-ec>\n </div>\n <div class=\"method-container text-dark text-left\"\n *ngIf=\"isMPTarjetaDeCredito(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <p id=\"faqs\" class=\"qt px-5 \">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <div app-mp-credit-ec (ready)=\"verifyValidate.emit()\"\n [public_key]=\"getPK(method)\" [user_data]=\"allData()\"\n [total_amount]=\"totalAmount\">\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\"\n *ngIf=\"isRedirectRedsys(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <ng-container\n *ngIf=\"!method.code.includes('bizum') && !method.code.includes('_out_')\">\n <app-redsys-redirect-ec (ready)=\"verifyValidate.emit($event)\"\n [method]=\"method\" [user_data]=\"allData()\">\n </app-redsys-redirect-ec>\n </ng-container>\n <ng-container\n *ngIf=\"method.code.includes('bizum') || method.code.includes('_out_')\">\n <app-redsys-redirect-out-ec (ready)=\"verifyValidate.emit($event)\"\n [method]=\"method\" [user_data]=\"allData()\">\n </app-redsys-redirect-out-ec>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\"\n *ngIf=\"isRedirectCecaBank(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <app-ceca-redirect-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\">\n </app-ceca-redirect-ec>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isPeyPalExpress(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-paypal-express-ec (ready)=\"verifyValidate.emit($event)\"\n [method]=\"method\" [user_data]=\"allData()\"\n [total_amount]=\"totalAmount\">\n </app-paypal-express-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isMobbex(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-mobbex-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\">\n </app-mobbex-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isBancard(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bancard-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\">\n </app-bancard-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isDecidir(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-decidir-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\">\n </app-decidir-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isMethodOffline(method.code)\">\n <p id=\"faqs\" class=\"qt px-5\">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading.emit(); verifyValidate.emit()\">{{\n ('pay-with-offline'| translate) }}</button>\n </div>\n <ng-container *ngIf=\"loadingInternal\">\n <div class=\"mt-2\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isCulqi(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-culqi-ec [apiKey]=\"getPKCulqi(method)\" [method]=\"method\"\n [amount]=\"totalAmount\" [customStyle]=\"true\"\n (ready)=\"verifyValidate.emit()\"></app-culqi-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isCatastro(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bancard-catastro-ec (ready)=\"verifyValidate.emit($event)\"\n [method]=\"method\" [user_data]=\"allData()\"\n [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\"></app-bancard-catastro-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isBamboo(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bamboo-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\"></app-bamboo-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isBankTransfer(method.code)\">\n <div class=\"row px-0 description-cont\">\n <ng-container\n *ngFor=\"let line of method.description.split('\\r\\n'); let i=index\">\n <p [id]=\"'faqs-'+i\" [class]=\"'qt px-5 m-0 line-'+i\">{{ line }}</p>\n </ng-container>\n </div>\n <hr *ngIf=\"method.instructions\">\n <div *ngIf=\"method.instructions\" class=\"row px-0 instructions-cont mb-1\">\n <h5 class=\"instructions-title\">{{ ('instructions' | translate) }}</h5>\n <ng-container\n *ngFor=\"let line of method.instructions.split('\\r\\n'); let i=index\">\n <p [class]=\"'px-5 m-0 instructions-text line-'+i \">{{ line }}</p>\n </ng-container>\n </div>\n\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading.emit(); verifyValidate.emit()\">{{\n ('pay-with-transfer'\n | translate) }}</button>\n </div>\n <ng-container *ngIf=\"loadingInternal\">\n <div class=\"mt-2\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isPlaceToPay(method.code)\">\n <p id=\"faqs\" *ngIf=\"method.description\" class=\"qt px-5 \">{{ method.description }}\n </p>\n <p class=\"px-5\" *ngIf=\"method.instructions\">{{ method.instructions }}</p>\n <app-place-to-pay-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [paymentServiceInst]=\"paymentServiceInst\" [allData]=\"allData()\">\n </app-place-to-pay-ec>\n </div>\n </ng-container>\n <ng-container *ngIf=\"showMethodError\">\n <div class=\"text-danger mt-2 px-3 fw-bold\">\n {{ 'this-payment-method-cannot-be-used' | translate }}\n </div>\n </ng-container>\n <div class=\"method-container text-dark\"\n *ngIf=\"currentMethod?.code === method.code && isBalanceInAccount(method.code) && !showMethodError\">\n <div class=\"row px-0 description-cont\" *ngIf=\"method.description\">\n <ng-container *ngFor=\"let line of method.description.split('\\r\\n'); let i = index\">\n <p [id]=\"'cc-desc-'+i\" [class]=\"'qt px-5 m-0 line-'+i\">{{ line }}</p>\n </ng-container>\n </div>\n\n <hr *ngIf=\"method.instructions\">\n\n <div *ngIf=\"method.instructions\" class=\"row px-0 instructions-cont mb-1\">\n <h5 class=\"instructions-title\">{{ ('instructions' | translate) }}</h5>\n <ng-container *ngFor=\"let line of method.instructions.split('\\r\\n'); let i = index\">\n <p [class]=\"'px-5 m-0 instructions-text line-'+i \">{{ line }}</p>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"!balanceMethodRejected; else showCreditError\">\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading.emit(); verifyValidate.emit()\">\n {{ 'pay-with' | translate }} {{ method.name }}\n </button>\n </div>\n </ng-container>\n\n <ng-template #showCreditError>\n <div class=\"text-danger mt-2 px-3 fw-bold\">\n {{ 'not-enough-credits-to-complete' | translate }}\n </div>\n </ng-template>\n <ng-container *ngIf=\"loadingInternal\">\n <div class=\"mt-2\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n</div>\n",
10892
- styles: [".payment-compact{border:1px solid var(--ec-border,#e3e3e3);border-radius:6px;width:100%}.payment-compact-flat{border:0;background:0 0;width:100%}.payment-compact-flat .card-body{padding:0}.payment-step-surface{position:relative}.single-step-overlay{position:absolute;inset:0;background:rgba(255,255,255,.6);display:flex;align-items:center;justify-content:center;z-index:5}.payment-options{display:-ms-grid;display:grid;gap:0;border:1px solid var(--ec-border,#e3e3e3);border-radius:6px;overflow:visible;background:var(--ec-surface,#fff);width:100%}.payment-option{display:-ms-grid;display:grid;-ms-grid-columns:auto 1fr auto;grid-template-columns:auto 1fr auto;gap:.75rem;padding:.75rem;border-top:1px solid var(--ec-border,#e3e3e3);cursor:pointer;align-items:center;background:var(--ec-surface,#fff);transition:border-color .2s,box-shadow .2s;margin:0}.payment-option:first-child{border-top:0}.payment-option.is-selected{border-color:var(--ec-accent,#2563eb);background:var(--ec-accent-soft,#f5f8ff);box-shadow:inset 0 0 0 1px var(--ec-accent,#2563eb)}.payment-option.is-disabled{opacity:.6;cursor:not-allowed}.payment-option-input{margin-top:.1rem}.payment-option-title{font-weight:600}.payment-option-logos{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.payment-option-logo{width:44px;height:28px;-o-object-fit:contain;object-fit:contain;background:#fff;border:1px solid #e5e7eb;border-radius:6px;box-shadow:0 1px 2px rgba(15,23,42,.08);padding:3px;filter:saturate(.96) contrast(1.02)}.payment-option-more{width:44px;height:28px;display:inline-flex;align-items:center;justify-content:center;background:#f8fafc;border:1px solid #e5e7eb;border-radius:6px;font-size:12px;font-weight:600;color:#475569;box-shadow:0 1px 2px rgba(15,23,42,.08)}.payment-tooltip-logos{display:flex;gap:.5rem;align-items:center;padding:.25rem .4rem}.payment-tooltip-logo{width:44px;height:28px;-o-object-fit:contain;object-fit:contain;background:#fff;border:1px solid #e5e7eb;border-radius:6px;box-shadow:0 1px 2px rgba(15,23,42,.08);padding:3px}.payment-option-details{border-top:1px solid var(--ec-border,#e3e3e3);padding:1rem;background:var(--ec-surface-alt,#fafafa)}.payment-option-details .method-container{padding:0 .5rem .5rem}.payment-option-details .container,.payment-option-details .row{margin-left:0;margin-right:0}.payment-option-details .px-5{padding-left:.75rem!important;padding-right:.75rem!important}.payment-option-details .end-button{padding:0 .75rem .5rem}.payment-option-details .instructions-text,.payment-option-details .instructions-title{padding-left:.75rem;padding-right:.75rem}.payment-compact-flat .comprar{font-size:14px;padding:8px 16px;border-radius:6px}.comprar{background:var(--ec-accent,#000);color:var(--ec-accent-contrast,#fff);display:inline-block;font-weight:600;text-decoration:none;text-transform:uppercase;border:0}.payment-lock-message{background:#fff7e6;border:1px solid #f0c36d;color:#8a5a00;padding:.75rem 1rem;border-radius:8px;margin-bottom:.75rem;font-weight:600}.payment-options.is-locked{opacity:.55;filter:grayscale(.2)}"]
10948
+ template: "<div *ngIf=\"methods?.length\">\n <div class=\"payment-compact payment-compact-flat payment-step-surface\">\n <div class=\"single-step-overlay\" *ngIf=\"loadingInternalMp\">\n <app-loading-full-ec></app-loading-full-ec>\n </div>\n <div class=\"card-body\">\n <div class=\"payment-lock-message\" *ngIf=\"paymentLocked\">\n {{ 'shipment-method-required' | translate }}\n </div>\n <div class=\"payment-options\" [class.is-locked]=\"paymentLocked\">\n <ng-container *ngFor=\"let method of methods\">\n <label class=\"payment-option\"\n [class.is-selected]=\"selectedMethodCode === method.code\"\n [class.is-disabled]=\"isMethodDisabled(method)\">\n <input class=\"payment-option-input\" type=\"radio\" name=\"payment-option\"\n [checked]=\"selectedMethodCode === method.code\"\n [disabled]=\"paymentLocked || isMethodDisabled(method)\"\n (click)=\"selectMethod.emit(method)\">\n <span class=\"payment-option-info\">\n <span class=\"payment-option-title\">{{ method.name | translate }}</span>\n <span class=\"payment-option-adjustment\"\n *ngIf=\"getPaymentMethodAdjustmentPreview(method) as adjustmentPreview\">\n <ng-container *ngIf=\"adjustmentPreview.type === 'percentage'; else fixedAdjustment\">\n {{ getPaymentMethodAdjustmentPreviewSign(adjustmentPreview.value) }}{{ adjustmentPreview.value }}%\n </ng-container>\n <ng-template #fixedAdjustment>\n {{ getPaymentMethodAdjustmentPreviewSign(adjustmentPreview.value) }}{{ adjustmentPreview.value | ecCurrencySymbol:'alwaysShowDecimals' }}\n </ng-template>\n </span>\n </span>\n <span class=\"payment-option-logos\" *ngIf=\"method.images?.length\">\n <img class=\"payment-option-logo\"\n *ngFor=\"let logo of getVisibleImages(method.images)\"\n [src]=\"getImageUrl ? getImageUrl(logo) : (logo?.path || logo?.url || logo?.src || logo)\"\n [alt]=\"logo?.name || (method.name || '')\"\n [title]=\"logo?.name || (method.name || '')\">\n <span class=\"payment-option-more\"\n *ngIf=\"method.images.length > 4\"\n [tooltip]=\"hiddenImagesTpl\"\n placement=\"top\"\n container=\"body\"\n triggers=\"hover\">\n +{{ method.images.length - 3 }}\n </span>\n <ng-template #hiddenImagesTpl>\n <span class=\"payment-tooltip-logos\">\n <img class=\"payment-tooltip-logo\"\n *ngFor=\"let logo of getHiddenImages(method.images)\"\n [src]=\"getImageUrl ? getImageUrl(logo) : (logo?.path || logo?.url || logo?.src || logo)\"\n [alt]=\"logo?.name || ''\">\n </span>\n </ng-template>\n </span>\n </label>\n <div class=\"payment-option-details\" *ngIf=\"selectedMethodCode === method.code\">\n <ng-container *ngIf=\"validatingMethodCode === method.code; else methodContent\">\n <div class=\"d-flex justify-content-center py-2\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n <ng-template #methodContent>\n <ng-container *ngIf=\"!showMethodError && currentMethod?.code === method.code\">\n <div class=\"method-container text-dark\" *ngIf=\"isMP(method.code)\">\n <p id=\"faqs\" class=\"qt px-5 \">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <app-mp-redirect-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [paymentServiceInst]=\"paymentServiceInst\"\n [allData]=\"allData()\"></app-mp-redirect-ec>\n </div>\n <div class=\"method-container text-dark text-left\"\n *ngIf=\"isMPTarjetaDeCredito(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <p id=\"faqs\" class=\"qt px-5 \">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <div app-mp-credit-ec (ready)=\"verifyValidate.emit()\"\n [public_key]=\"getPK(method)\" [user_data]=\"allData()\"\n [total_amount]=\"totalAmount\">\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\"\n *ngIf=\"isRedirectRedsys(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <ng-container\n *ngIf=\"!method.code.includes('bizum') && !method.code.includes('_out_')\">\n <app-redsys-redirect-ec (ready)=\"verifyValidate.emit($event)\"\n [method]=\"method\" [user_data]=\"allData()\">\n </app-redsys-redirect-ec>\n </ng-container>\n <ng-container\n *ngIf=\"method.code.includes('bizum') || method.code.includes('_out_')\">\n <app-redsys-redirect-out-ec (ready)=\"verifyValidate.emit($event)\"\n [method]=\"method\" [user_data]=\"allData()\">\n </app-redsys-redirect-out-ec>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\"\n *ngIf=\"isRedirectCecaBank(method.code)\">\n <div class=\"row\">\n <div class=\"col-12\">\n <app-ceca-redirect-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\">\n </app-ceca-redirect-ec>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isPeyPalExpress(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-paypal-express-ec (ready)=\"verifyValidate.emit($event)\"\n [method]=\"method\" [user_data]=\"allData()\"\n [total_amount]=\"totalAmount\">\n </app-paypal-express-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isMobbex(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-mobbex-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\">\n </app-mobbex-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isBancard(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bancard-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\">\n </app-bancard-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isDecidir(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-decidir-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\">\n </app-decidir-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isMethodOffline(method.code)\">\n <p id=\"faqs\" class=\"qt px-5\">{{ method.description }}</p>\n <p class=\"px-5\">{{ method.instructions }}</p>\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading.emit(); verifyValidate.emit()\">{{\n ('pay-with-offline'| translate) }}</button>\n </div>\n <ng-container *ngIf=\"loadingInternal\">\n <div class=\"mt-2\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isCulqi(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-culqi-ec [apiKey]=\"getPKCulqi(method)\" [method]=\"method\"\n [amount]=\"totalAmount\" [customStyle]=\"true\"\n (ready)=\"verifyValidate.emit()\"></app-culqi-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isCatastro(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bancard-catastro-ec (ready)=\"verifyValidate.emit($event)\"\n [method]=\"method\" [user_data]=\"allData()\"\n [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\"></app-bancard-catastro-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark text-start\" *ngIf=\"isBamboo(method.code)\">\n <div class=\"container\">\n <div class=\"row justify-content-center\">\n <div class=\"col-12\">\n <app-bamboo-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [user_data]=\"allData()\" [paymentServiceInst]=\"paymentServiceInst\"\n [total_amount]=\"totalAmount\"></app-bamboo-ec>\n </div>\n </div>\n </div>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isBankTransfer(method.code)\">\n <div class=\"row px-0 description-cont\">\n <ng-container\n *ngFor=\"let line of method.description.split('\\r\\n'); let i=index\">\n <p [id]=\"'faqs-'+i\" [class]=\"'qt px-5 m-0 line-'+i\">{{ line }}</p>\n </ng-container>\n </div>\n <hr *ngIf=\"method.instructions\">\n <div *ngIf=\"method.instructions\" class=\"row px-0 instructions-cont mb-1\">\n <h5 class=\"instructions-title\">{{ ('instructions' | translate) }}</h5>\n <ng-container\n *ngFor=\"let line of method.instructions.split('\\r\\n'); let i=index\">\n <p [class]=\"'px-5 m-0 instructions-text line-'+i \">{{ line }}</p>\n </ng-container>\n </div>\n\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading.emit(); verifyValidate.emit()\">{{\n ('pay-with-transfer'\n | translate) }}</button>\n </div>\n <ng-container *ngIf=\"loadingInternal\">\n <div class=\"mt-2\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n <div class=\"method-container text-dark\" *ngIf=\"isPlaceToPay(method.code)\">\n <p id=\"faqs\" *ngIf=\"method.description\" class=\"qt px-5 \">{{ method.description }}\n </p>\n <p class=\"px-5\" *ngIf=\"method.instructions\">{{ method.instructions }}</p>\n <app-place-to-pay-ec (ready)=\"verifyValidate.emit($event)\" [method]=\"method\"\n [paymentServiceInst]=\"paymentServiceInst\" [allData]=\"allData()\">\n </app-place-to-pay-ec>\n </div>\n </ng-container>\n <ng-container *ngIf=\"showMethodError\">\n <div class=\"text-danger mt-2 px-3 fw-bold\">\n {{ 'this-payment-method-cannot-be-used' | translate }}\n </div>\n </ng-container>\n <div class=\"method-container text-dark\"\n *ngIf=\"currentMethod?.code === method.code && isBalanceInAccount(method.code) && !showMethodError\">\n <div class=\"row px-0 description-cont\" *ngIf=\"method.description\">\n <ng-container *ngFor=\"let line of method.description.split('\\r\\n'); let i = index\">\n <p [id]=\"'cc-desc-'+i\" [class]=\"'qt px-5 m-0 line-'+i\">{{ line }}</p>\n </ng-container>\n </div>\n\n <hr *ngIf=\"method.instructions\">\n\n <div *ngIf=\"method.instructions\" class=\"row px-0 instructions-cont mb-1\">\n <h5 class=\"instructions-title\">{{ ('instructions' | translate) }}</h5>\n <ng-container *ngFor=\"let line of method.instructions.split('\\r\\n'); let i = index\">\n <p [class]=\"'px-5 m-0 instructions-text line-'+i \">{{ line }}</p>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"!balanceMethodRejected; else showCreditError\">\n <div class=\"end-button\">\n <button class=\"btn comprar\" (click)=\"setLoading.emit(); verifyValidate.emit()\">\n {{ 'pay-with' | translate }} {{ method.name }}\n </button>\n </div>\n </ng-container>\n\n <ng-template #showCreditError>\n <div class=\"text-danger mt-2 px-3 fw-bold\">\n {{ 'not-enough-credits-to-complete' | translate }}\n </div>\n </ng-template>\n <ng-container *ngIf=\"loadingInternal\">\n <div class=\"mt-2\">\n <app-loading-inline-ec></app-loading-inline-ec>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n</div>\n",
10949
+ styles: [".payment-compact{border:1px solid var(--ec-border,#e3e3e3);border-radius:6px;width:100%}.payment-compact-flat{border:0;background:0 0;width:100%}.payment-compact-flat .card-body{padding:0}.payment-step-surface{position:relative}.single-step-overlay{position:absolute;inset:0;background:rgba(255,255,255,.6);display:flex;align-items:center;justify-content:center;z-index:5}.payment-options{display:-ms-grid;display:grid;gap:0;border:1px solid var(--ec-border,#e3e3e3);border-radius:6px;overflow:visible;background:var(--ec-surface,#fff);width:100%}.payment-option{display:-ms-grid;display:grid;-ms-grid-columns:auto 1fr auto;grid-template-columns:auto 1fr auto;gap:.75rem;padding:.75rem;border-top:1px solid var(--ec-border,#e3e3e3);cursor:pointer;align-items:center;background:var(--ec-surface,#fff);transition:border-color .2s,box-shadow .2s;margin:0}.payment-option:first-child{border-top:0}.payment-option.is-selected{border-color:var(--ec-accent,#2563eb);background:var(--ec-accent-soft,#f5f8ff);box-shadow:inset 0 0 0 1px var(--ec-accent,#2563eb)}.payment-option.is-disabled{opacity:.6;cursor:not-allowed}.payment-option-input{margin-top:.1rem}.payment-option-title{font-weight:600}.payment-option-info{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-width:0}.payment-option-adjustment{color:#dc3545;font-weight:700;white-space:nowrap}.payment-option-logos{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.payment-option-logo{width:44px;height:28px;-o-object-fit:contain;object-fit:contain;background:#fff;border:1px solid #e5e7eb;border-radius:6px;box-shadow:0 1px 2px rgba(15,23,42,.08);padding:3px;filter:saturate(.96) contrast(1.02)}.payment-option-more{width:44px;height:28px;display:inline-flex;align-items:center;justify-content:center;background:#f8fafc;border:1px solid #e5e7eb;border-radius:6px;font-size:12px;font-weight:600;color:#475569;box-shadow:0 1px 2px rgba(15,23,42,.08)}.payment-tooltip-logos{display:flex;gap:.5rem;align-items:center;padding:.25rem .4rem}.payment-tooltip-logo{width:44px;height:28px;-o-object-fit:contain;object-fit:contain;background:#fff;border:1px solid #e5e7eb;border-radius:6px;box-shadow:0 1px 2px rgba(15,23,42,.08);padding:3px}.payment-option-details{border-top:1px solid var(--ec-border,#e3e3e3);padding:1rem;background:var(--ec-surface-alt,#fafafa)}.payment-option-details .method-container{padding:0 .5rem .5rem}.payment-option-details .container,.payment-option-details .row{margin-left:0;margin-right:0}.payment-option-details .px-5{padding-left:.75rem!important;padding-right:.75rem!important}.payment-option-details .end-button{padding:0 .75rem .5rem}.payment-option-details .instructions-text,.payment-option-details .instructions-title{padding-left:.75rem;padding-right:.75rem}.payment-compact-flat .comprar{font-size:14px;padding:8px 16px;border-radius:6px}.comprar{background:var(--ec-accent,#000);color:var(--ec-accent-contrast,#fff);display:inline-block;font-weight:600;text-decoration:none;text-transform:uppercase;border:0}.payment-lock-message{background:#fff7e6;border:1px solid #f0c36d;color:#8a5a00;padding:.75rem 1rem;border-radius:8px;margin-bottom:.75rem;font-weight:600}.payment-options.is-locked{opacity:.55;filter:grayscale(.2)}"]
10893
10950
  })
10894
10951
  ], PaymentEcSingleComponent);
10895
10952
 
@@ -15898,7 +15955,7 @@ __decorate$1s([
15898
15955
  OrderEcComponent = __decorate$1s([
15899
15956
  Component({
15900
15957
  selector: 'app-order-ec',
15901
- template: "<main class=\"py-5\" id=\"orderEcComponent\">\n <div class=\"container\">\n <div class=\"wrap\" *ngIf=\"!loading; else loadingView\">\n <div *ngIf=\"order; else noOrder\">\n\n <div class=\"row justify-content-between \">\n <div class=\"col-sm-auto col-12 font-brandon\">\n <h4 class=\"tit1 fw-bold\">{{ ('order' | translate) + ': ' + order.number }}</h4>\n </div>\n <ng-container *ngIf=\"order?.invoice\">\n <div class=\"col-sm col-12 font-brandon\" *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <a target=\"_blank\" [href]=\"consts.getUrlBase().slice(0, -1) + order.invoice\"\n class=\"btn btn-link btn-invoice\">\n <i class=\"fas fa-file-download me-1\"></i>\n {{ 'download' | translate }} {{ 'invoices' | translate | titlecase }}\n </a>\n </div>\n </ng-container>\n <a (click)=\"volver()\" class=\"col-auto text-end\">\n <button class=\"btn btvolver bg-gray text-white\">{{ 'back-to-orders' | translate }}</button>\n </a>\n </div>\n\n <section id=\"orders\">\n <div class=\"row pt-2\">\n <div class=\"col-md-2 col-12\">\n <p class=\"st\">{{ 'payment-state' | translate }}:</p>\n <p class=\"\">\n {{ order.payments[0].state | translate }}\n </p>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\">\n <p class=\"st\">{{ 'shipment-state' | translate }}:</p>\n <p class=\"\">\n {{ order.shipments[0].state | translate }}\n </p>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\">\n <p class=\"st\">{{ 'payment-method' | translate }}:</p>\n <p class=\"\">\n {{ order.payments[0]?.method?.name | translate }}\n </p>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\">\n <p class=\"st\">{{ 'shipment-method' | translate }}:</p>\n <p class=\"\">\n {{ order.shipments[0].method.name }}\n </p>\n <!-- ACA DEBERIA IR EL LINK DE SEGUIMIENTO -->\n <a *ngIf=\"order.tracking\" [href]=\"order.tracking\"\n class=\"btn btn-outline-dark btnLogout px-3 py-1 font-size-10 w-auto btn-sm\">Ver\n seguimiento</a>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\">\n <p class=\"st\">{{ 'date' | translate }}:</p>\n <p class=\"\">\n {{ toDate(order.checkoutCompletedAt, 'DD/MM/YYYY') | translate }}<br>\n {{ toDate(order.checkoutCompletedAt, 'h:mm:ss a') | translate }}\n </p>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <p class=\"st\">{{ 'total' | translate }}:</p>\n <h5 class=\"fw-bold\">\n {{ (order.totals.total) | ecCurrencySymbol:'alwaysShowDecimals'}}\n\n </h5>\n </div>\n </div>\n </section>\n\n <div class=\"text-end mt-3\" *ngIf=\"!hidePrices && allowRepeatOrders\">\n <button class=\"btn btn-primary mb-2\" (click)=\"repeatOrder()\">\n {{ 'repeat-order' | translate }}\n </button>\n </div>\n\n <div class=\"container py-3 border-top border-bottom\">\n <div *ngIf=\"order.items.length; else noProducts\" class=\"row\">\n <div class=\"col-2 font-sm font-brandon d-none d-md-block\">\n {{ 'product' | translate | uppercase }}\n </div>\n <div class=\"col-3 font-sm font-brandon d-none d-md-block\">\n {{ 'description' | translate | uppercase }}\n </div>\n <div id=\"colLots\" *ngIf=\"ordersService.channelConfig.applyOrderLot\"\n class=\"col-1 font-sm font-brandon d-none d-md-block\">\n <!-- {{ 'description' | translate | uppercase }} -->\n {{ 'lots' | translate | uppercase }}\n </div>\n <div class=\"col-2 text-end font-sm font-brandon d-none d-md-block\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n {{ 'unit-price' | translate | uppercase }}\n </div>\n <div class=\"col-1 text-center font-sm font-brandon d-none d-md-block\">\n {{ 'quantity' | translate | uppercase }}\n </div>\n <div class=\"col-1 text-end font-sm font-brandon d-none d-md-block\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n {{ 'discount' | translate | uppercase }}\n </div>\n <div class=\"col-2 text-end font-sm font-brandon d-none d-md-block\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n {{ 'subtotal' | translate | uppercase }}\n </div>\n </div>\n <ng-container *ngFor=\"let item of order.items; let i = index\">\n <div class=\"row cart-items\">\n <div class=\"col-5 col-md-2 py-2\">\n <ng-container *ngIf=\"item.product.variants[0]?.images?.length ; else defaultpicture\">\n <img class=\"smc maxwidth img-fluid rounded-custom \"\n [src]=\"consts.mediaUrl() + item.product.variants[0].images[0]\" alt=\"\">\n </ng-container>\n <ng-template #defaultpicture>\n <img *ngIf=\"item.product.picturesdefault\"\n class=\"smc maxwidth img-fluid rounded-custom\"\n [src]=\"consts.mediaUrl() + item.product.picturesdefault[0]\" alt=\"\">\n </ng-template>\n </div> \n <div\n class=\"col-md-3 col-7 d-flex flex-column justify-content-center\">\n <p class=\"font-brandon d-flex w-100 mb-0\">\n {{ item.product.name }} (Cod:{{ item.product.variants[0].code }})\n </p>\n <p *ngIf=\"enableFieldNotesInArticleFile && item.comments\" class=\"comment-truncated fst-italic small text-muted mt-1\">\n \"{{ item.comments }}\"\n </p>\n </div>\n <div class=\"col-md-1 col-1 flex-column flex-md-row justify-content-start d-flex align-items-center\"\n *ngIf=\"ordersService.channelConfig.applyOrderLot\">\n <input type=\"button\" class=\"btn btn-primary btnSeguir m-0 text-center\" type=\"button\"\n [attr.data-bs-toggle]=\"'collapse'\" [attr.data-bs-target]=\"'#collapseExample'+i\"\n aria-expanded=\"false\" [attr.aria-controls]=\"'collapseExample'+i\"\n value=\"{{ 'see' | translate | uppercase }}\">\n </div>\n <div class=\"container d-md-none\">\n <div class=\"row\">\n <div class=\"col-3\">\n <small class=\"order-line-label\">{{ 'unit-price' | translate }}</small>\n <p class=\"text-center w-100 m-0\" *ngIf=\"hasOrderLineValue(item, 'unit'); else noMobileUnit\">\n {{ getOrderLineValue(item, 'unit') | ecCurrencySymbol:'alwaysShowDecimals' }}\n </p>\n <ng-template #noMobileUnit>-</ng-template>\n </div>\n <div class=\"col-3\">\n <small class=\"order-line-label\">{{ 'quantity' | translate }}</small>\n <p class=\"text-center w-100 m-0\">{{ item.quantity }}</p>\n </div>\n <div class=\"col-3\">\n <small class=\"order-line-label\">{{ 'discount' | translate }}</small>\n <p class=\"text-center w-100 m-0\" *ngIf=\"getOrderLineValue(item, 'discount') !== 0; else noMobileDiscount\">\n {{ getOrderLineValue(item, 'discount') | ecCurrencySymbol:'alwaysShowDecimals' }}\n </p>\n <ng-template #noMobileDiscount>-</ng-template>\n </div>\n <div class=\"col-3\">\n <small class=\"order-line-label\">{{ 'subtotal' | translate }}</small>\n <p class=\"text-center w-100 m-0\" *ngIf=\"hasOrderLineValue(item, 'subtotal'); else noMobileSubtotal\">\n {{ getOrderLineValue(item, 'subtotal') | ecCurrencySymbol:'alwaysShowDecimals' }}\n </p>\n <ng-template #noMobileSubtotal>-</ng-template>\n </div>\n </div>\n </div>\n\n <div class=\"col-2 d-none d-md-flex align-items-center\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <p class=\"text-end w-100 m-0\">\n {{ hasOrderLineValue(item, 'unit') ? (getOrderLineValue(item, 'unit') | ecCurrencySymbol:'alwaysShowDecimals') : '-' }}\n </p>\n </div>\n <div class=\"col-1 d-none d-md-flex align-items-center\">\n <p class=\"text-center w-100 m-0\"> {{ item.quantity }}</p>\n </div>\n <div class=\"col-1 d-none d-md-flex align-items-center\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <p class=\"text-end w-100 m-0\" [class.text-muted]=\"getOrderLineValue(item, 'discount') === 0\">\n {{ getOrderLineValue(item, 'discount') !== 0 ? (getOrderLineValue(item, 'discount') | ecCurrencySymbol:'alwaysShowDecimals') : '-' }}\n </p>\n </div>\n <div class=\"col-2 d-none d-md-flex align-items-center\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <p class=\"text-end w-100 m-0\">\n {{ hasOrderLineValue(item, 'subtotal') ? (getOrderLineValue(item, 'subtotal') | ecCurrencySymbol:'alwaysShowDecimals') : '-' }}\n </p>\n </div>\n <div class=\"collapse\" [attr.id]=\"'collapseExample'+i\">\n <div class=\"card card-body\">\n <table class=\"table table-striped\">\n <thead>\n <tr>\n <th scope=\"col\">#</th>\n <th scope=\"col\">Estado</th>\n <th scope=\"col\">Cantidad</th>\n <th scope=\"col\">Fecha Solicitada</th>\n <th scope=\"col\">Fecha Estimada</th>\n <th scope=\"col\">Sede</th>\n <th scope=\"col\">Nota</th>\n <th scope=\"col\">Total Lote</th>\n </tr>\n </thead>\n <tbody>\n <ng-container *ngFor=\"let lot of item.orderItemLot\">\n <tr>\n <th scope=\"row\">{{lot.id}}</th>\n <td>{{lot.lot_status}}</td>\n <td>{{lot.quantity}}</td>\n <td>{{ toDate(lot.date_request, 'DD/MM/YYYY') | translate }}</td>\n <td *ngIf=\"lot.date_deliver; else sinFechaEstimada\">{{\n toDate(lot.date_deliver, 'DD/MM/YYYY') | translate }}</td>\n <ng-template #sinFechaEstimada>\n <td>Pendiente</td>\n </ng-template>\n <td>{{lot.shipping_address_name}}</td>\n <td>{{lot.notes}}</td>\n <td>{{lot.total_lot | ecCurrencySymbol:'alwaysShowDecimals'}}</td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n </div>\n </div>\n\n </ng-container>\n </div>\n\n <div class=\"container\">\n <div class=\"row\">\n <div class=\"col-12 col-md-6\"></div>\n <div class=\"col-12 col-md-6\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <div class=\"order-summary py-4\">\n <div class=\"order-summary-row\">\n <span>{{ 'subtotal' | translate }}</span>\n <strong>\n {{ getHistoricalProductsSubtotal() !== null\n ? (getHistoricalProductsSubtotal() | ecCurrencySymbol:'alwaysShowDecimals')\n : '-' }}\n </strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--discount\"\n *ngIf=\"!hideDiscounts && getHistoricalOrderDiscount() !== null && getHistoricalOrderDiscount() !== 0\">\n <span>{{ 'discount' | translate }}</span>\n <strong>{{ getHistoricalOrderDiscount() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--discount\"\n *ngIf=\"!hideDiscounts && getHistoricalCouponDiscount() !== null && getHistoricalCouponDiscount() !== 0\">\n <span>{{ 'coupon' | translate }}</span>\n <strong>{{ getHistoricalCouponDiscount() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--tax\"\n *ngIf=\"!showPriceWithTaxesWhileBrowsing && !hideTaxes && hasHistoricalTaxes()\">\n <span>{{ 'taxes' | translate }}</span>\n <strong>{{ getHistoricalTaxes() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row\"\n *ngIf=\"getHistoricalShipping() !== null\">\n <span>{{ 'shipment' | translate }}</span>\n <strong>{{ getHistoricalShipping() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--total\">\n <span>{{ 'total' | translate | uppercase }}</span>\n <strong>\n {{ getHistoricalTotal() !== null\n ? (getHistoricalTotal() | ecCurrencySymbol:'alwaysShowDecimals')\n : '-' }}\n </strong>\n </div>\n\n <div class=\"order-summary-tax-info\"\n *ngIf=\"showPriceWithTaxesWhileBrowsing && !hideTaxes && hasHistoricalTaxes()\">\n <span>{{ 'taxes-included-in-total' | translate }}</span>\n <strong>{{ getHistoricalTaxes() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n</main>\n\n<ng-template #noOrder>\n <div class=\"w-100 h-50\">\n <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\n <h5>{{ 'no-orders' | translate }}</h5>\n </div>\n </div>\n</ng-template>\n\n<ng-template #loadingView>\n <div class=\"w-100 h-50 py-5\">\n <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\n <app-loading-full-ec></app-loading-full-ec>\n </div>\n </div>\n</ng-template>\n",
15958
+ template: "<main class=\"py-5\" id=\"orderEcComponent\">\n <div class=\"container\">\n <div class=\"wrap\" *ngIf=\"!loading; else loadingView\">\n <div *ngIf=\"order; else noOrder\">\n\n <div class=\"row justify-content-between \">\n <div class=\"col-sm-auto col-12 font-brandon\">\n <h4 class=\"tit1 fw-bold\">{{ ('order' | translate) + ': ' + order.number }}</h4>\n </div>\n <ng-container *ngIf=\"order?.invoice\">\n <div class=\"col-sm col-12 font-brandon\" *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <a target=\"_blank\" [href]=\"consts.getUrlBase().slice(0, -1) + order.invoice\"\n class=\"btn btn-link btn-invoice\">\n <i class=\"fas fa-file-download me-1\"></i>\n {{ 'download' | translate }} {{ 'invoices' | translate | titlecase }}\n </a>\n </div>\n </ng-container>\n <a (click)=\"volver()\" class=\"col-auto text-end\">\n <button class=\"btn btvolver bg-gray text-white\">{{ 'back-to-orders' | translate }}</button>\n </a>\n </div>\n\n <section id=\"orders\">\n <div class=\"row pt-2\">\n <div class=\"col-md-2 col-12\">\n <p class=\"st\">{{ 'payment-state' | translate }}:</p>\n <p class=\"\">\n {{ order.payments[0].state | translate }}\n </p>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\">\n <p class=\"st\">{{ 'shipment-state' | translate }}:</p>\n <p class=\"\">\n {{ order.shipments[0].state | translate }}\n </p>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\">\n <p class=\"st\">{{ 'payment-method' | translate }}:</p>\n <p class=\"\">\n {{ order.payments[0]?.method?.name | translate }}\n </p>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\">\n <p class=\"st\">{{ 'shipment-method' | translate }}:</p>\n <p class=\"\">\n {{ order.shipments[0].method.name }}\n </p>\n <!-- ACA DEBERIA IR EL LINK DE SEGUIMIENTO -->\n <a *ngIf=\"order.tracking\" [href]=\"order.tracking\"\n class=\"btn btn-outline-dark btnLogout px-3 py-1 font-size-10 w-auto btn-sm\">Ver\n seguimiento</a>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\">\n <p class=\"st\">{{ 'date' | translate }}:</p>\n <p class=\"\">\n {{ toDate(order.checkoutCompletedAt, 'DD/MM/YYYY') | translate }}<br>\n {{ toDate(order.checkoutCompletedAt, 'h:mm:ss a') | translate }}\n </p>\n </div>\n <div class=\"col-md-2 col-12 font-brandon\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <p class=\"st\">{{ 'total' | translate }}:</p>\n <h5 class=\"fw-bold\">\n {{ (order.totals.total) | ecCurrencySymbol:'alwaysShowDecimals'}}\n\n </h5>\n </div>\n </div>\n </section>\n\n <div class=\"text-end mt-3\" *ngIf=\"!hidePrices && allowRepeatOrders\">\n <button class=\"btn btn-primary mb-2\" (click)=\"repeatOrder()\">\n {{ 'repeat-order' | translate }}\n </button>\n </div>\n\n <div class=\"container py-3 border-top border-bottom\">\n <div *ngIf=\"order.items.length; else noProducts\" class=\"row\">\n <div class=\"col-2 font-sm font-brandon d-none d-md-block\">\n {{ 'product' | translate | uppercase }}\n </div>\n <div class=\"col-3 font-sm font-brandon d-none d-md-block\">\n {{ 'description' | translate | uppercase }}\n </div>\n <div id=\"colLots\" *ngIf=\"ordersService.channelConfig.applyOrderLot\"\n class=\"col-1 font-sm font-brandon d-none d-md-block\">\n <!-- {{ 'description' | translate | uppercase }} -->\n {{ 'lots' | translate | uppercase }}\n </div>\n <div class=\"col-2 text-end font-sm font-brandon d-none d-md-block\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n {{ 'unit-price' | translate | uppercase }}\n </div>\n <div class=\"col-1 text-center font-sm font-brandon d-none d-md-block\">\n {{ 'quantity' | translate | uppercase }}\n </div>\n <div class=\"col-1 text-end font-sm font-brandon d-none d-md-block\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n {{ 'discount' | translate | uppercase }}\n </div>\n <div class=\"col-2 text-end font-sm font-brandon d-none d-md-block\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n {{ 'subtotal' | translate | uppercase }}\n </div>\n </div>\n <ng-container *ngFor=\"let item of order.items; let i = index\">\n <div class=\"row cart-items\">\n <div class=\"col-5 col-md-2 py-2\">\n <ng-container *ngIf=\"item.product.variants[0]?.images?.length ; else defaultpicture\">\n <img class=\"smc maxwidth img-fluid rounded-custom \"\n [src]=\"consts.mediaUrl() + item.product.variants[0].images[0]\" alt=\"\">\n </ng-container>\n <ng-template #defaultpicture>\n <img *ngIf=\"item.product.picturesdefault\"\n class=\"smc maxwidth img-fluid rounded-custom\"\n [src]=\"consts.mediaUrl() + item.product.picturesdefault[0]\" alt=\"\">\n </ng-template>\n </div> \n <div\n class=\"col-md-3 col-7 d-flex flex-column justify-content-center\">\n <p class=\"font-brandon d-flex w-100 mb-0\">\n {{ item.product.name }} (Cod:{{ item.product.variants[0].code }})\n </p>\n <p *ngIf=\"enableFieldNotesInArticleFile && item.comments\" class=\"comment-truncated fst-italic small text-muted mt-1\">\n \"{{ item.comments }}\"\n </p>\n </div>\n <div class=\"col-md-1 col-1 flex-column flex-md-row justify-content-start d-flex align-items-center\"\n *ngIf=\"ordersService.channelConfig.applyOrderLot\">\n <input type=\"button\" class=\"btn btn-primary btnSeguir m-0 text-center\" type=\"button\"\n [attr.data-bs-toggle]=\"'collapse'\" [attr.data-bs-target]=\"'#collapseExample'+i\"\n aria-expanded=\"false\" [attr.aria-controls]=\"'collapseExample'+i\"\n value=\"{{ 'see' | translate | uppercase }}\">\n </div>\n <div class=\"container d-md-none\">\n <div class=\"row\">\n <div class=\"col-3\">\n <small class=\"order-line-label\">{{ 'unit-price' | translate }}</small>\n <p class=\"text-center w-100 m-0\" *ngIf=\"hasOrderLineValue(item, 'unit'); else noMobileUnit\">\n {{ getOrderLineValue(item, 'unit') | ecCurrencySymbol:'alwaysShowDecimals' }}\n </p>\n <ng-template #noMobileUnit>-</ng-template>\n </div>\n <div class=\"col-3\">\n <small class=\"order-line-label\">{{ 'quantity' | translate }}</small>\n <p class=\"text-center w-100 m-0\">{{ item.quantity }}</p>\n </div>\n <div class=\"col-3\">\n <small class=\"order-line-label\">{{ 'discount' | translate }}</small>\n <p class=\"text-center w-100 m-0\" *ngIf=\"getOrderLineValue(item, 'discount') !== 0; else noMobileDiscount\">\n {{ getOrderLineValue(item, 'discount') | ecCurrencySymbol:'alwaysShowDecimals' }}\n </p>\n <ng-template #noMobileDiscount>-</ng-template>\n </div>\n <div class=\"col-3\">\n <small class=\"order-line-label\">{{ 'subtotal' | translate }}</small>\n <p class=\"text-center w-100 m-0\" *ngIf=\"hasOrderLineValue(item, 'subtotal'); else noMobileSubtotal\">\n {{ getOrderLineValue(item, 'subtotal') | ecCurrencySymbol:'alwaysShowDecimals' }}\n </p>\n <ng-template #noMobileSubtotal>-</ng-template>\n </div>\n </div>\n </div>\n\n <div class=\"col-2 d-none d-md-flex align-items-center\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <p class=\"text-end w-100 m-0\">\n {{ hasOrderLineValue(item, 'unit') ? (getOrderLineValue(item, 'unit') | ecCurrencySymbol:'alwaysShowDecimals') : '-' }}\n </p>\n </div>\n <div class=\"col-1 d-none d-md-flex align-items-center\">\n <p class=\"text-center w-100 m-0\"> {{ item.quantity }}</p>\n </div>\n <div class=\"col-1 d-none d-md-flex align-items-center\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <p class=\"text-end w-100 m-0\" [class.text-muted]=\"getOrderLineValue(item, 'discount') === 0\">\n {{ getOrderLineValue(item, 'discount') !== 0 ? (getOrderLineValue(item, 'discount') | ecCurrencySymbol:'alwaysShowDecimals') : '-' }}\n </p>\n </div>\n <div class=\"col-2 d-none d-md-flex align-items-center\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <p class=\"text-end w-100 m-0\">\n {{ hasOrderLineValue(item, 'subtotal') ? (getOrderLineValue(item, 'subtotal') | ecCurrencySymbol:'alwaysShowDecimals') : '-' }}\n </p>\n </div>\n <div class=\"collapse\" [attr.id]=\"'collapseExample'+i\">\n <div class=\"card card-body\">\n <table class=\"table table-striped\">\n <thead>\n <tr>\n <th scope=\"col\">#</th>\n <th scope=\"col\">Estado</th>\n <th scope=\"col\">Cantidad</th>\n <th scope=\"col\">Fecha Solicitada</th>\n <th scope=\"col\">Fecha Estimada</th>\n <th scope=\"col\">Sede</th>\n <th scope=\"col\">Nota</th>\n <th scope=\"col\">Total Lote</th>\n </tr>\n </thead>\n <tbody>\n <ng-container *ngFor=\"let lot of item.orderItemLot\">\n <tr>\n <th scope=\"row\">{{lot.id}}</th>\n <td>{{lot.lot_status}}</td>\n <td>{{lot.quantity}}</td>\n <td>{{ toDate(lot.date_request, 'DD/MM/YYYY') | translate }}</td>\n <td *ngIf=\"lot.date_deliver; else sinFechaEstimada\">{{\n toDate(lot.date_deliver, 'DD/MM/YYYY') | translate }}</td>\n <ng-template #sinFechaEstimada>\n <td>Pendiente</td>\n </ng-template>\n <td>{{lot.shipping_address_name}}</td>\n <td>{{lot.notes}}</td>\n <td>{{lot.total_lot | ecCurrencySymbol:'alwaysShowDecimals'}}</td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n </div>\n </div>\n\n </ng-container>\n </div>\n\n <div class=\"container\">\n <div class=\"row\">\n <div class=\"col-12 col-md-6\"></div>\n <div class=\"col-12 col-md-6\"\n *ngIf=\"(creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <div class=\"order-summary py-4\">\n <div class=\"order-summary-row\">\n <span>{{ 'subtotal' | translate }}</span>\n <strong>\n {{ getHistoricalProductsSubtotal() !== null\n ? (getHistoricalProductsSubtotal() | ecCurrencySymbol:'alwaysShowDecimals')\n : '-' }}\n </strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--discount\"\n *ngIf=\"!hideDiscounts && getHistoricalOrderDiscount() !== null && getHistoricalOrderDiscount() !== 0\">\n <span>{{ 'discount' | translate }}</span>\n <strong>{{ getHistoricalOrderDiscount() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--discount\"\n *ngIf=\"!hideDiscounts && getHistoricalCouponDiscount() !== null && getHistoricalCouponDiscount() !== 0\">\n <span>{{ 'coupon' | translate }}</span>\n <strong>{{ getHistoricalCouponDiscount() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--discount\"\n *ngIf=\"order?.totals?.paymentMethodAdjustment !== null && order?.totals?.paymentMethodAdjustment !== undefined && order?.totals?.paymentMethodAdjustment !== 0\">\n <span>\n {{ (order.totals.paymentMethodAdjustment < 0 ? 'payment-method-discount' : 'payment-method-surcharge') | translate }}\n <ng-container *ngIf=\"order.totals.paymentMethodAdjustmentLabel\">\n \u00B7 {{ order.totals.paymentMethodAdjustmentLabel }}\n </ng-container>\n </span>\n <strong>{{ order.totals.paymentMethodAdjustment | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--tax\"\n *ngIf=\"!showPriceWithTaxesWhileBrowsing && !hideTaxes && hasHistoricalTaxes()\">\n <span>{{ 'taxes' | translate }}</span>\n <strong>{{ getHistoricalTaxes() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row\"\n *ngIf=\"getHistoricalShipping() !== null\">\n <span>{{ 'shipment' | translate }}</span>\n <strong>{{ getHistoricalShipping() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n\n <div class=\"order-summary-row order-summary-row--total\">\n <span>{{ 'total' | translate | uppercase }}</span>\n <strong>\n {{ getHistoricalTotal() !== null\n ? (getHistoricalTotal() | ecCurrencySymbol:'alwaysShowDecimals')\n : '-' }}\n </strong>\n </div>\n\n <div class=\"order-summary-tax-info\"\n *ngIf=\"showPriceWithTaxesWhileBrowsing && !hideTaxes && hasHistoricalTaxes()\">\n <span>{{ 'taxes-included-in-total' | translate }}</span>\n <strong>{{ getHistoricalTaxes() | ecCurrencySymbol:'alwaysShowDecimals' }}</strong>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n</main>\n\n<ng-template #noOrder>\n <div class=\"w-100 h-50\">\n <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\n <h5>{{ 'no-orders' | translate }}</h5>\n </div>\n </div>\n</ng-template>\n\n<ng-template #loadingView>\n <div class=\"w-100 h-50 py-5\">\n <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\n <app-loading-full-ec></app-loading-full-ec>\n </div>\n </div>\n</ng-template>\n",
15902
15959
  styles: [".maxwidth{max-width:100px}.comment-truncated{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-height:3em}.order-line-label{display:block;color:#6b7280;font-size:.72rem;line-height:1.2;text-transform:uppercase}.order-summary{display:flex;flex-direction:column;gap:.65rem;color:#4b5563}.order-summary-row{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;min-width:0;font-size:.95rem}.order-summary-row span{min-width:0}.order-summary-row strong{flex:0 0 auto;white-space:nowrap;color:#111827;font-weight:600;text-align:right}.order-summary-row--discount strong{color:#15803d}.order-summary-row--tax{color:#4b5563}.order-summary-row--total{margin-top:.35rem;padding-top:.8rem;border-top:1px solid #d1d5db;color:#111827;font-size:1.15rem;font-weight:700}.order-summary-row--total strong{font-size:1.2rem;font-weight:700}.order-summary-tax-info{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-top:-.15rem;color:#6b7280;font-size:.82rem;font-weight:400}.order-summary-tax-info strong{flex:0 0 auto;white-space:nowrap;font-weight:400}@media (max-width:767.98px){.order-summary{padding-top:1rem;padding-bottom:1rem}.order-summary-row,.order-summary-tax-info{gap:.75rem}.order-summary-row--total{font-size:1.05rem}.order-summary-row--total strong{font-size:1.1rem}}"]
15903
15960
  })
15904
15961
  ], OrderEcComponent);
@@ -16970,6 +17027,7 @@ let DetailCheckoutBlockEcComponent = class DetailCheckoutBlockEcComponent extend
16970
17027
  case 'subtotal': return 'fas fa-boxes fa-2x';
16971
17028
  case 'productsBeforeDiscounts': return 'fas fa-boxes fa-2x';
16972
17029
  case 'taxes': return 'fas fa-file-invoice-dollar fa-2x';
17030
+ case 'paymentMethodAdjustment': return 'fas fa-credit-card fa-2x';
16973
17031
  case 'total': return 'fas fa-shopping-basket fa-2x';
16974
17032
  default: return 'fas fa-tags fa-2x';
16975
17033
  }
@@ -17021,6 +17079,7 @@ let DetailCheckoutBlockEcComponent = class DetailCheckoutBlockEcComponent extend
17021
17079
  }
17022
17080
  }
17023
17081
  getTypeLabel(type, item) {
17082
+ var _a, _b;
17024
17083
  if (type === 'taxes') {
17025
17084
  if (item && item.taxesIncludedInTotal === true)
17026
17085
  return 'taxes-included-in-total';
@@ -17030,6 +17089,8 @@ let DetailCheckoutBlockEcComponent = class DetailCheckoutBlockEcComponent extend
17030
17089
  }
17031
17090
  if (type === 'productsBeforeDiscounts')
17032
17091
  return 'products-before-discounts';
17092
+ if (type === 'paymentMethodAdjustment')
17093
+ return (_b = (_a = item) === null || _a === void 0 ? void 0 : _a.amount, (_b !== null && _b !== void 0 ? _b : 0)) < 0 ? 'payment-method-discount' : 'payment-method-surcharge';
17033
17094
  return type;
17034
17095
  }
17035
17096
  shouldShowItem(type, item) {
@@ -17073,7 +17134,7 @@ __decorate$1B([
17073
17134
  DetailCheckoutBlockEcComponent = __decorate$1B([
17074
17135
  Component({
17075
17136
  selector: 'app-detail-checkout-block-ec',
17076
- template: "<div id=\"appDetailCheckoutBlockEc\" class=\"d-flex flex-row w-100 justify-content-center flex-wrap\"\n *ngIf=\"data && (creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <ng-container *ngFor=\"let item of data; let i = index\">\n <ng-container *ngIf=\"shouldShowItem(item.type, item) && !shouldHideSubtotal(item)\">\n <div class=\"d-flex flex-column justify-content-center mx-sm-3 mx-2 text-center mb-4 resumen\">\n <i ngClass=\"mb-2 colorIconoCheckout\" [class]=\"getIcon(item)\"></i>\n <strong class=\"text-center w-100 font-brandon font-md mb-1\">\n {{ getTypeLabel(item.type, item) | translate }}\n </strong>\n <ng-container *ngIf=\"getAmountView(item) as priceView\">\n <span class=\"text-center w-100 font-brandon font-md text-gray resumen-price\"\n [class.resumen-price--discounted]=\"priceView.showOriginalPrice\"\n [class.resumen-price--free]=\"priceView.isFree\">\n <del *ngIf=\"priceView.showOriginalPrice\">\n {{ priceView.originalPrice | ecCurrencySymbol:'alwaysShowDecimals' }}\n </del>\n <strong>\n <ng-container *ngIf=\"priceView.isFree; else resumenPriceValue\">\n {{ 'free' | translate }}\n </ng-container>\n <ng-template #resumenPriceValue>\n {{ priceView.finalPrice | ecCurrencySymbol:'alwaysShowDecimals' }}\n </ng-template>\n </strong>\n </span>\n </ng-container>\n </div>\n </ng-container>\n\n\n <!-- Mostrar total de descuentos -->\n <div class=\"d-flex flex-column justify-content-center mx-sm-3 mx-2 text-center mb-4 resumen\"\n *ngIf=\"!hideDiscounts && this.discountTotal != 0 && i === 1\">\n <i ngClass=\"mb-2 colorIconoCheckout\" [class]=\"getIcon2('discount')\"></i>\n <strong class=\"text-center w-100 font-brandon font-md mb-1\">Descuento</strong>\n <span class=\"text-center w-100 font-brandon font-md text-gray\">{{ (this.discountTotal | ecCurrencySymbol:'alwaysShowDecimals')\n }}</span>\n </div>\n\n <!-- Mostrar total de cupones -->\n <div class=\"d-flex flex-column justify-content-center mx-sm-3 mx-2 text-center mb-4 resumen\"\n *ngIf=\"!hideDiscounts && this.couponTotal != 0 && i === 1\">\n <i ngClass=\"mb-2 colorIconoCheckout\" [class]=\"getIcon2('coupon')\"></i>\n <strong class=\"text-center w-100 font-brandon font-md mb-1\">Cupon</strong>\n <span class=\"text-center w-100 font-brandon font-md text-gray\">{{(this.couponTotal| ecCurrencySymbol:'alwaysShowDecimals')\n }}</span>\n </div>\n <div class=\"d-flex flex-column justify-content-center mx-sm-3 mx-2 text-center mb-4 resumen\"\n *ngIf=\"!hideTaxes && this.clientTaxes != 0 && i === 1\">\n <i ngClass=\"mb-2 colorIconoCheckout\" [class]=\"getIcon2('clienTaxe')\"></i>\n <strong class=\"text-center w-100 font-brandon font-md mb-1\">{{ 'clientTaxes' | translate }}</strong>\n <span class=\"text-center w-100 font-brandon font-md text-gray\">{{(this.clientTaxes | ecCurrencySymbol:'alwaysShowDecimals')\n }}</span>\n </div>\n </ng-container>\n <ng-container *ngFor=\"let item of data\">\n <div class=\"checkout-tax-info\"\n *ngIf=\"item.type === 'taxes' && item.taxesIncludedInTotal === true && !hideTaxes\">\n <span>{{ getTypeLabel(item.type, item) | translate }}</span>\n <span>{{ item.amount | ecCurrencySymbol:'alwaysShowDecimals' }}</span>\n </div>\n </ng-container>\n</div>\n",
17137
+ template: "<div id=\"appDetailCheckoutBlockEc\" class=\"d-flex flex-row w-100 justify-content-center flex-wrap\"\n *ngIf=\"data && (creditAccountShowPrices !== null ? creditAccountShowPrices : true)\">\n <ng-container *ngFor=\"let item of data; let i = index\">\n <ng-container *ngIf=\"shouldShowItem(item.type, item) && !shouldHideSubtotal(item)\">\n <div class=\"d-flex flex-column justify-content-center mx-sm-3 mx-2 text-center mb-4 resumen\">\n <i ngClass=\"mb-2 colorIconoCheckout\" [class]=\"getIcon(item)\"></i>\n <strong class=\"text-center w-100 font-brandon font-md mb-1\">\n {{ getTypeLabel(item.type, item) | translate }}\n <ng-container *ngIf=\"item.type === 'paymentMethodAdjustment' && item.name && item.name !== 'discount' && item.name !== 'surcharge'\">\n \u00B7 {{ item.name }}\n </ng-container>\n </strong>\n <ng-container *ngIf=\"getAmountView(item) as priceView\">\n <span class=\"text-center w-100 font-brandon font-md text-gray resumen-price\"\n [class.resumen-price--discounted]=\"priceView.showOriginalPrice\"\n [class.resumen-price--free]=\"priceView.isFree\">\n <del *ngIf=\"priceView.showOriginalPrice\">\n {{ priceView.originalPrice | ecCurrencySymbol:'alwaysShowDecimals' }}\n </del>\n <strong>\n <ng-container *ngIf=\"priceView.isFree; else resumenPriceValue\">\n {{ 'free' | translate }}\n </ng-container>\n <ng-template #resumenPriceValue>\n {{ priceView.finalPrice | ecCurrencySymbol:'alwaysShowDecimals' }}\n </ng-template>\n </strong>\n </span>\n </ng-container>\n </div>\n </ng-container>\n\n\n <!-- Mostrar total de descuentos -->\n <div class=\"d-flex flex-column justify-content-center mx-sm-3 mx-2 text-center mb-4 resumen\"\n *ngIf=\"!hideDiscounts && this.discountTotal != 0 && i === 1\">\n <i ngClass=\"mb-2 colorIconoCheckout\" [class]=\"getIcon2('discount')\"></i>\n <strong class=\"text-center w-100 font-brandon font-md mb-1\">Descuento</strong>\n <span class=\"text-center w-100 font-brandon font-md text-gray\">{{ (this.discountTotal | ecCurrencySymbol:'alwaysShowDecimals')\n }}</span>\n </div>\n\n <!-- Mostrar total de cupones -->\n <div class=\"d-flex flex-column justify-content-center mx-sm-3 mx-2 text-center mb-4 resumen\"\n *ngIf=\"!hideDiscounts && this.couponTotal != 0 && i === 1\">\n <i ngClass=\"mb-2 colorIconoCheckout\" [class]=\"getIcon2('coupon')\"></i>\n <strong class=\"text-center w-100 font-brandon font-md mb-1\">Cupon</strong>\n <span class=\"text-center w-100 font-brandon font-md text-gray\">{{(this.couponTotal| ecCurrencySymbol:'alwaysShowDecimals')\n }}</span>\n </div>\n <div class=\"d-flex flex-column justify-content-center mx-sm-3 mx-2 text-center mb-4 resumen\"\n *ngIf=\"!hideTaxes && this.clientTaxes != 0 && i === 1\">\n <i ngClass=\"mb-2 colorIconoCheckout\" [class]=\"getIcon2('clienTaxe')\"></i>\n <strong class=\"text-center w-100 font-brandon font-md mb-1\">{{ 'clientTaxes' | translate }}</strong>\n <span class=\"text-center w-100 font-brandon font-md text-gray\">{{(this.clientTaxes | ecCurrencySymbol:'alwaysShowDecimals')\n }}</span>\n </div>\n </ng-container>\n <ng-container *ngFor=\"let item of data\">\n <div class=\"checkout-tax-info\"\n *ngIf=\"item.type === 'taxes' && item.taxesIncludedInTotal === true && !hideTaxes\">\n <span>{{ getTypeLabel(item.type, item) | translate }}</span>\n <span>{{ item.amount | ecCurrencySymbol:'alwaysShowDecimals' }}</span>\n </div>\n </ng-container>\n</div>\n",
17077
17138
  styles: [".resumen-price{display:inline-flex;flex-direction:column;align-items:center;gap:.15rem}.resumen-price del{color:#888;font-weight:500;text-decoration-thickness:1px}.resumen-price strong{font-weight:700}.resumen-price--free strong{color:var(--ec-success,#198754)}.checkout-tax-info{flex:0 0 100%;display:flex;justify-content:center;gap:.75rem;margin:-.5rem 0 1rem;padding-top:.75rem;border-top:1px solid #e5e7eb;color:#6b7280;font-size:.82rem;font-weight:400}.checkout-tax-info span:last-child{white-space:nowrap}"]
17078
17139
  })
17079
17140
  ], DetailCheckoutBlockEcComponent);