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.
- package/README.md +4 -0
- package/assets/ec-i18n/ct.json +2 -0
- package/assets/ec-i18n/en.json +2 -0
- package/assets/ec-i18n/es.json +2 -0
- package/assets/ec-i18n/fr.json +2 -0
- package/assets/ec-i18n/gl.json +2 -0
- package/assets/ec-i18n/pr.json +2 -0
- package/bundles/ng-easycommerce.umd.js +84 -20
- package/bundles/ng-easycommerce.umd.js.map +1 -1
- package/bundles/ng-easycommerce.umd.min.js +1 -1
- package/bundles/ng-easycommerce.umd.min.js.map +1 -1
- package/esm2015/lib/ec-component/account-ec/order-ec/order-ec.component.js +2 -2
- package/esm2015/lib/ec-component/checkout-ec/checkout-ec.component.js +6 -2
- package/esm2015/lib/ec-component/checkout-ec/detail-checkout-block-ec/detail-checkout-block-ec.component.js +6 -2
- package/esm2015/lib/ec-component/checkout-ec/payment-ec/payment-ec.component.js +24 -9
- package/esm2015/lib/ec-component/checkout-ec/payment-ec-single/payment-ec-single.component.js +11 -3
- package/esm2015/lib/interfaces/checkout-data.js +1 -1
- package/esm2015/lib/services/cart.service.js +9 -1
- package/esm2015/lib/services/checkout/checkout.service.js +3 -1
- package/esm2015/lib/utils/order-util.service.js +22 -2
- package/esm5/lib/ec-component/account-ec/order-ec/order-ec.component.js +2 -2
- package/esm5/lib/ec-component/checkout-ec/checkout-ec.component.js +6 -2
- package/esm5/lib/ec-component/checkout-ec/detail-checkout-block-ec/detail-checkout-block-ec.component.js +6 -2
- package/esm5/lib/ec-component/checkout-ec/payment-ec/payment-ec.component.js +29 -14
- package/esm5/lib/ec-component/checkout-ec/payment-ec-single/payment-ec-single.component.js +11 -3
- package/esm5/lib/interfaces/checkout-data.js +1 -1
- package/esm5/lib/services/cart.service.js +13 -1
- package/esm5/lib/services/checkout/checkout.service.js +3 -2
- package/esm5/lib/utils/order-util.service.js +22 -2
- package/fesm2015/ng-easycommerce.js +75 -14
- package/fesm2015/ng-easycommerce.js.map +1 -1
- package/fesm5/ng-easycommerce.js +84 -20
- package/fesm5/ng-easycommerce.js.map +1 -1
- package/lib/ec-component/checkout-ec/checkout-ec.component.d.ts +1 -1
- package/lib/ec-component/checkout-ec/detail-checkout-block-ec/detail-checkout-block-ec.component.d.ts +1 -1
- package/lib/ec-component/checkout-ec/payment-ec/payment-ec.component.d.ts +3 -0
- package/lib/ec-component/checkout-ec/payment-ec-single/payment-ec-single.component.d.ts +3 -0
- package/lib/interfaces/checkout-data.d.ts +6 -1
- package/lib/services/cart.service.d.ts +3 -0
- package/lib/utils/order-util.service.d.ts +1 -0
- package/ng-easycommerce.metadata.json +1 -1
- package/package.json +1 -1
|
@@ -2299,7 +2299,7 @@
|
|
|
2299
2299
|
*/
|
|
2300
2300
|
this.getPromotions = function (cart, forCart) {
|
|
2301
2301
|
if (forCart === void 0) { forCart = false; }
|
|
2302
|
-
var _a;
|
|
2302
|
+
var _a, _b;
|
|
2303
2303
|
if (!((_a = cart) === null || _a === void 0 ? void 0 : _a.totals))
|
|
2304
2304
|
return [];
|
|
2305
2305
|
if (cart.checkoutState && cart.checkoutState == "completed")
|
|
@@ -2311,6 +2311,8 @@
|
|
|
2311
2311
|
// console.log(cart.cartDiscounts);
|
|
2312
2312
|
var cartDiscounts = Array.isArray(cart.cartDiscounts) ? cart.cartDiscounts : [];
|
|
2313
2313
|
for (var index = 0; index < cartDiscounts.length; index++) {
|
|
2314
|
+
if (((_b = cartDiscounts[index]) === null || _b === void 0 ? void 0 : _b.type) === 'payment_method')
|
|
2315
|
+
continue;
|
|
2314
2316
|
cartDiscounts[index].type = _this.formatType(cartDiscounts[index].type);
|
|
2315
2317
|
new_state.push({
|
|
2316
2318
|
type: cartDiscounts[index].type,
|
|
@@ -2326,6 +2328,8 @@
|
|
|
2326
2328
|
// amount: this.getAmount(cartDiscount, cart)
|
|
2327
2329
|
// });
|
|
2328
2330
|
// });
|
|
2331
|
+
var paymentMethodAdjustment = _this.getPaymentMethodAdjustment(cart);
|
|
2332
|
+
paymentMethodAdjustment && new_state.push(paymentMethodAdjustment);
|
|
2329
2333
|
!forCart && new_state.push(total);
|
|
2330
2334
|
return new_state;
|
|
2331
2335
|
};
|
|
@@ -2353,9 +2357,25 @@
|
|
|
2353
2357
|
name: 'discount',
|
|
2354
2358
|
amount: promotionAmount
|
|
2355
2359
|
});
|
|
2360
|
+
var paymentMethodAdjustment = _this.getPaymentMethodAdjustment(cart);
|
|
2361
|
+
paymentMethodAdjustment && new_state.push(paymentMethodAdjustment);
|
|
2356
2362
|
!forCart && new_state.push(total);
|
|
2357
2363
|
return new_state;
|
|
2358
2364
|
};
|
|
2365
|
+
this.getPaymentMethodAdjustment = function (cart) {
|
|
2366
|
+
var _a, _b, _c, _d;
|
|
2367
|
+
var rawAmount = (_b = (_a = cart) === null || _a === void 0 ? void 0 : _a.totals) === null || _b === void 0 ? void 0 : _b.paymentMethodAdjustment;
|
|
2368
|
+
if (rawAmount === null || rawAmount === undefined || Number(rawAmount) === 0)
|
|
2369
|
+
return null;
|
|
2370
|
+
var amount = Number(rawAmount);
|
|
2371
|
+
if (!Number.isFinite(amount))
|
|
2372
|
+
return null;
|
|
2373
|
+
return {
|
|
2374
|
+
type: 'paymentMethodAdjustment',
|
|
2375
|
+
name: ((_d = (_c = cart) === null || _c === void 0 ? void 0 : _c.totals) === null || _d === void 0 ? void 0 : _d.paymentMethodAdjustmentLabel) || (amount < 0 ? 'discount' : 'surcharge'),
|
|
2376
|
+
amount: amount
|
|
2377
|
+
};
|
|
2378
|
+
};
|
|
2359
2379
|
/**
|
|
2360
2380
|
* Devuelve el monto de envío que debe mostrarse en el resumen.
|
|
2361
2381
|
*
|
|
@@ -3994,6 +4014,7 @@
|
|
|
3994
4014
|
var summary = _this.cartService && _this.cartService.getCartSummaryPricePresentation
|
|
3995
4015
|
? _this.cartService.getCartSummaryPricePresentation(cart, undefined, true)
|
|
3996
4016
|
: null;
|
|
4017
|
+
var paymentMethodAdjustment = _this.orderUtils.getPaymentMethodAdjustment(cart);
|
|
3997
4018
|
if (((_a = summary) === null || _a === void 0 ? void 0 : _a.source) === 'linePricing') {
|
|
3998
4019
|
var result_1 = __spread$2([
|
|
3999
4020
|
{ type: 'productsBeforeDiscounts', name: 'products-before-discounts', amount: summary.productsBeforeDiscounts }
|
|
@@ -4011,7 +4032,7 @@
|
|
|
4011
4032
|
? [{ type: 'clientTaxes', name: 'clientTaxes', amount: summary.clientTaxes }]
|
|
4012
4033
|
: []), (summary.shipping !== null
|
|
4013
4034
|
? [{ type: 'shipment', name: 'shipment', amount: summary.shipping }]
|
|
4014
|
-
: []), [
|
|
4035
|
+
: []), (paymentMethodAdjustment ? [paymentMethodAdjustment] : []), [
|
|
4015
4036
|
{ type: 'total', name: 'total', amount: summary.total }
|
|
4016
4037
|
]);
|
|
4017
4038
|
_this.asociatedDataSubject.next(result_1);
|
|
@@ -5433,6 +5454,12 @@
|
|
|
5433
5454
|
: _this.couponSubject.next(null);
|
|
5434
5455
|
return true;
|
|
5435
5456
|
};
|
|
5457
|
+
this.updateCartAfterPaymentResponse = function (cart) {
|
|
5458
|
+
var _a;
|
|
5459
|
+
if (!((_a = cart) === null || _a === void 0 ? void 0 : _a.totals))
|
|
5460
|
+
return false;
|
|
5461
|
+
return _this.updateCartObj(cart, false);
|
|
5462
|
+
};
|
|
5436
5463
|
this.isItemInLocal = function (item_id) { return _this.items.some(function (item) { return item.item_id == item_id; }); };
|
|
5437
5464
|
/**
|
|
5438
5465
|
* @public
|
|
@@ -5660,6 +5687,12 @@
|
|
|
5660
5687
|
this.getTotalAmount = function () {
|
|
5661
5688
|
return _this.cart.pipe(operators.map(function (cart) { var _a, _b; return (_b = (_a = cart) === null || _a === void 0 ? void 0 : _a.totals) === null || _b === void 0 ? void 0 : _b.total; }));
|
|
5662
5689
|
};
|
|
5690
|
+
this.getPaymentMethodAdjustment = function () {
|
|
5691
|
+
return _this.cart.pipe(operators.map(function (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); }));
|
|
5692
|
+
};
|
|
5693
|
+
this.getPaymentMethodAdjustmentLabel = function () {
|
|
5694
|
+
return _this.cart.pipe(operators.map(function (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); }));
|
|
5695
|
+
};
|
|
5663
5696
|
/** Total para carrito/sidebar, sin envío persistido ni recargos de checkout. */
|
|
5664
5697
|
this.getCartTotalAmount = function () {
|
|
5665
5698
|
return _this.cart.pipe(operators.map(function (cart) { return _this.orderUtils.getCartTotalAmount(cart); }));
|
|
@@ -11397,9 +11430,9 @@
|
|
|
11397
11430
|
};
|
|
11398
11431
|
_this.setMethod = function (method) { return __awaiter$c(_this, void 0, void 0, function () {
|
|
11399
11432
|
var result, balanceCustomer, totals, isBalanceMethod, allowAny;
|
|
11400
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
11401
|
-
return __generator$c(this, function (
|
|
11402
|
-
switch (
|
|
11433
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
11434
|
+
return __generator$c(this, function (_l) {
|
|
11435
|
+
switch (_l.label) {
|
|
11403
11436
|
case 0:
|
|
11404
11437
|
if (this.compactPaymentView && this.selectedMethodCode === ((_a = method) === null || _a === void 0 ? void 0 : _a.code) && !this.loading_internal) {
|
|
11405
11438
|
return [2 /*return*/];
|
|
@@ -11418,23 +11451,26 @@
|
|
|
11418
11451
|
this.evaluateDirtyForSelection(((_d = method) === null || _d === void 0 ? void 0 : _d.code) || null);
|
|
11419
11452
|
this.methodDataSubject.next(null);
|
|
11420
11453
|
this.showMethodError = false;
|
|
11421
|
-
|
|
11454
|
+
_l.label = 1;
|
|
11422
11455
|
case 1:
|
|
11423
|
-
|
|
11456
|
+
_l.trys.push([1, , 3, 4]);
|
|
11424
11457
|
return [4 /*yield*/, this.paymentService.putPayment(method.code)];
|
|
11425
11458
|
case 2:
|
|
11426
|
-
result =
|
|
11427
|
-
|
|
11428
|
-
|
|
11429
|
-
|
|
11459
|
+
result = _l.sent();
|
|
11460
|
+
if ((_e = result) === null || _e === void 0 ? void 0 : _e.totals) {
|
|
11461
|
+
this.cartService.updateCartAfterPaymentResponse(result);
|
|
11462
|
+
}
|
|
11463
|
+
balanceCustomer = (_f = result) === null || _f === void 0 ? void 0 : _f.balanceCustomer;
|
|
11464
|
+
totals = (_g = result) === null || _g === void 0 ? void 0 : _g.totals;
|
|
11465
|
+
this.cartService.updateBalanceAttributes(balanceCustomer, (_h = totals) === null || _h === void 0 ? void 0 : _h.total);
|
|
11430
11466
|
isBalanceMethod = this.isBalanceInAccount(method.code);
|
|
11431
|
-
allowAny = (
|
|
11467
|
+
allowAny = (_j = balanceCustomer) === null || _j === void 0 ? void 0 : _j.allowAnyPaymentMethod;
|
|
11432
11468
|
// Validaciones de error
|
|
11433
11469
|
if ((balanceCustomer && allowAny === false && !isBalanceMethod) || // no permite otro método
|
|
11434
11470
|
(isBalanceMethod && !balanceCustomer) // seleccionó cuenta corriente pero no hay balance
|
|
11435
11471
|
) {
|
|
11436
11472
|
this.handleMethodError('this-payment-method-cannot-be-used', method);
|
|
11437
|
-
if (this.compactPaymentView && ((
|
|
11473
|
+
if (this.compactPaymentView && ((_k = method) === null || _k === void 0 ? void 0 : _k.code)) {
|
|
11438
11474
|
}
|
|
11439
11475
|
return [2 /*return*/];
|
|
11440
11476
|
}
|
|
@@ -11460,6 +11496,18 @@
|
|
|
11460
11496
|
}
|
|
11461
11497
|
});
|
|
11462
11498
|
}); };
|
|
11499
|
+
_this.getPaymentMethodAdjustmentPreview = function (method) {
|
|
11500
|
+
var _a, _b;
|
|
11501
|
+
var rawValue = (_a = method) === null || _a === void 0 ? void 0 : _a.chargeValue;
|
|
11502
|
+
if (rawValue === null || rawValue === undefined || Number(rawValue) === 0)
|
|
11503
|
+
return null;
|
|
11504
|
+
var value = Number(rawValue);
|
|
11505
|
+
var type = (_b = method) === null || _b === void 0 ? void 0 : _b.chargeType;
|
|
11506
|
+
if (!Number.isFinite(value) || (type !== 'percentage' && type !== 'fixed'))
|
|
11507
|
+
return null;
|
|
11508
|
+
return { type: type, value: value };
|
|
11509
|
+
};
|
|
11510
|
+
_this.getPaymentMethodAdjustmentPreviewSign = function (value) { return value > 0 ? '+' : ''; };
|
|
11463
11511
|
_this.setDirtyState = function (nextDirty) {
|
|
11464
11512
|
if (_this.isDirty === nextDirty)
|
|
11465
11513
|
return;
|
|
@@ -11693,9 +11741,9 @@
|
|
|
11693
11741
|
PaymentEcComponent = __decorate$U([
|
|
11694
11742
|
core.Component({
|
|
11695
11743
|
selector: 'app-payment-ec',
|
|
11696
|
-
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",
|
|
11744
|
+
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",
|
|
11697
11745
|
providers: [PaymentService],
|
|
11698
|
-
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}"]
|
|
11746
|
+
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}"]
|
|
11699
11747
|
})
|
|
11700
11748
|
], PaymentEcComponent);
|
|
11701
11749
|
return PaymentEcComponent;
|
|
@@ -11949,10 +11997,12 @@
|
|
|
11949
11997
|
_this.goToNextFromAddress = function () { return _this.goToNextSection('address'); };
|
|
11950
11998
|
_this.isSectionOpen = function (stepName) { return _this.openSections.includes(stepName); };
|
|
11951
11999
|
_this.getSummaryLabel = function (type, item) {
|
|
12000
|
+
var _a, _b;
|
|
11952
12001
|
switch (type) {
|
|
11953
12002
|
case 'productsBeforeDiscounts': return 'products-before-discounts';
|
|
11954
12003
|
case 'subtotal': return 'subtotal';
|
|
11955
12004
|
case 'discount': return 'discount';
|
|
12005
|
+
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';
|
|
11956
12006
|
case 'coupon': return 'coupon';
|
|
11957
12007
|
case 'lineDiscount': return 'line-discounts';
|
|
11958
12008
|
case 'shipment': return 'shipment';
|
|
@@ -12032,6 +12082,8 @@
|
|
|
12032
12082
|
return false;
|
|
12033
12083
|
if ((item.type === 'discount' || item.type === 'coupon') && _this.hideDiscounts)
|
|
12034
12084
|
return false;
|
|
12085
|
+
if (item.type === 'paymentMethodAdjustment' && (item.amount === 0 || item.amount == null))
|
|
12086
|
+
return false;
|
|
12035
12087
|
if (item.type === 'taxes' && (_this.hideTaxes || item.amount == 0))
|
|
12036
12088
|
return false;
|
|
12037
12089
|
if (item.type === 'clientTaxes' && (_this.hideTaxes || item.amount == 0))
|
|
@@ -12394,7 +12446,7 @@
|
|
|
12394
12446
|
CheckoutEcComponent = __decorate$V([
|
|
12395
12447
|
core.Component({
|
|
12396
12448
|
selector: 'app-checkout-ec',
|
|
12397
|
-
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 ✓\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",
|
|
12449
|
+
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 ✓\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",
|
|
12398
12450
|
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}"]
|
|
12399
12451
|
})
|
|
12400
12452
|
], CheckoutEcComponent);
|
|
@@ -12544,6 +12596,8 @@
|
|
|
12544
12596
|
this.balanceMethodRejected = false;
|
|
12545
12597
|
this.methods = [];
|
|
12546
12598
|
this.totalAmount = null;
|
|
12599
|
+
this.getPaymentMethodAdjustmentPreview = function () { return null; };
|
|
12600
|
+
this.getPaymentMethodAdjustmentPreviewSign = function () { return ''; };
|
|
12547
12601
|
this.isMethodDisabled = function () { return false; };
|
|
12548
12602
|
this.isMP = function () { return false; };
|
|
12549
12603
|
this.isMPTarjetaDeCredito = function () { return false; };
|
|
@@ -12606,6 +12660,12 @@
|
|
|
12606
12660
|
__decorate$X([
|
|
12607
12661
|
core.Input()
|
|
12608
12662
|
], PaymentEcSingleComponent.prototype, "totalAmount", void 0);
|
|
12663
|
+
__decorate$X([
|
|
12664
|
+
core.Input()
|
|
12665
|
+
], PaymentEcSingleComponent.prototype, "getPaymentMethodAdjustmentPreview", void 0);
|
|
12666
|
+
__decorate$X([
|
|
12667
|
+
core.Input()
|
|
12668
|
+
], PaymentEcSingleComponent.prototype, "getPaymentMethodAdjustmentPreviewSign", void 0);
|
|
12609
12669
|
__decorate$X([
|
|
12610
12670
|
core.Input()
|
|
12611
12671
|
], PaymentEcSingleComponent.prototype, "isMethodDisabled", void 0);
|
|
@@ -12681,8 +12741,8 @@
|
|
|
12681
12741
|
PaymentEcSingleComponent = __decorate$X([
|
|
12682
12742
|
core.Component({
|
|
12683
12743
|
selector: 'app-payment-ec-single',
|
|
12684
|
-
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",
|
|
12685
|
-
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)}"]
|
|
12744
|
+
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",
|
|
12745
|
+
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)}"]
|
|
12686
12746
|
})
|
|
12687
12747
|
], PaymentEcSingleComponent);
|
|
12688
12748
|
return PaymentEcSingleComponent;
|
|
@@ -18643,7 +18703,7 @@
|
|
|
18643
18703
|
OrderEcComponent = __decorate$1s([
|
|
18644
18704
|
core.Component({
|
|
18645
18705
|
selector: 'app-order-ec',
|
|
18646
|
-
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",
|
|
18706
|
+
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",
|
|
18647
18707
|
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}}"]
|
|
18648
18708
|
})
|
|
18649
18709
|
], OrderEcComponent);
|
|
@@ -19890,6 +19950,7 @@
|
|
|
19890
19950
|
case 'subtotal': return 'fas fa-boxes fa-2x';
|
|
19891
19951
|
case 'productsBeforeDiscounts': return 'fas fa-boxes fa-2x';
|
|
19892
19952
|
case 'taxes': return 'fas fa-file-invoice-dollar fa-2x';
|
|
19953
|
+
case 'paymentMethodAdjustment': return 'fas fa-credit-card fa-2x';
|
|
19893
19954
|
case 'total': return 'fas fa-shopping-basket fa-2x';
|
|
19894
19955
|
default: return 'fas fa-tags fa-2x';
|
|
19895
19956
|
}
|
|
@@ -19943,6 +20004,7 @@
|
|
|
19943
20004
|
}
|
|
19944
20005
|
};
|
|
19945
20006
|
DetailCheckoutBlockEcComponent.prototype.getTypeLabel = function (type, item) {
|
|
20007
|
+
var _a, _b;
|
|
19946
20008
|
if (type === 'taxes') {
|
|
19947
20009
|
if (item && item.taxesIncludedInTotal === true)
|
|
19948
20010
|
return 'taxes-included-in-total';
|
|
@@ -19952,6 +20014,8 @@
|
|
|
19952
20014
|
}
|
|
19953
20015
|
if (type === 'productsBeforeDiscounts')
|
|
19954
20016
|
return 'products-before-discounts';
|
|
20017
|
+
if (type === 'paymentMethodAdjustment')
|
|
20018
|
+
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';
|
|
19955
20019
|
return type;
|
|
19956
20020
|
};
|
|
19957
20021
|
DetailCheckoutBlockEcComponent.prototype.shouldShowItem = function (type, item) {
|
|
@@ -19994,7 +20058,7 @@
|
|
|
19994
20058
|
DetailCheckoutBlockEcComponent = __decorate$1B([
|
|
19995
20059
|
core.Component({
|
|
19996
20060
|
selector: 'app-detail-checkout-block-ec',
|
|
19997
|
-
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",
|
|
20061
|
+
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",
|
|
19998
20062
|
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}"]
|
|
19999
20063
|
})
|
|
20000
20064
|
], DetailCheckoutBlockEcComponent);
|