ng-easycommerce 0.0.572 → 0.0.574

package/README.md

@@ -1,3 +1,11 @@
+# version 0.0.574
+- Decidir se reinicia modal al terminar o cancelar el agregar nueva tarjeta
+- Se agregó una alerta al registrar un usuario para que se muestre un mensaje de acuerdo a las siguientes condiciones:
+    - Si `isAccountVerificationRequired` es true, se muestra el mensaje `register-ok`.
+    - Si `isSendWelcomeEmail` es true y `isAccountVerificationRequired` es false, se muestra el mensaje `register-welcome`.
+    - Si ambos checks son false, se muestra el mensaje `register-success`.
+# version 0.0.573
+- Se modifica y se agrega funcion para actualizar el stock y cambie al disponible en caso de que sea mayor. Tambien lo elimina en caso de que el stock sea 0.
 # version 0.0.572
 - Se implementó la lógica para gestionar un observable `balanceCustomerSubject` en `cart.service` que contiene los datos referentes al crédito del usuario.  
 - Se añadió la validaciónes en `cart.service` y `product-detail`, para verificar si el usuario tiene suficientes créditos antes de continuar con la compra.  

package/assets/ec-i18n/ct.json

@@ -266,6 +266,8 @@
      "newsletter-thanks": "Gràcies per subscriure a les notícies",
      "notes": "Detalls addicionals d'enviament",
      "register-ok": "Es va enviar un mail a la seva casella de correu a la seva nova compte",
+     "register-welcome": "Registre completat amb èxit. S'ha enviat un correu electrònic de benvinguda a la seva bústia",
+     "register-success": "Registre completat amb èxit. Si us plau, iniciï sessió",
      "thanks-for-register-detail": "Ara ja podeu entrar. A continuació li deixem l'accés a l'inici de sessió",
      "thanks-for-register": "Gràcies per registrar",
      "pickup-store": "Botiga de recollida",

package/assets/ec-i18n/en.json

@@ -250,6 +250,8 @@
 	"redirect-cart": "Redirecting to cart",
 	"register": "Register",
 	"register-ok": "An email was sent to your mailbox to verify your new account",
+    "register-welcome": "Registration successful. A welcome email has been sent to your mailbox",
+    "register-success": "Registration successful. Please log in",
 	"related-products": "Related Products",
 	"repeat-new-password": "Repeat new password",
     "repeat-password": "Repeat password",

package/assets/ec-i18n/es.json

@@ -253,6 +253,8 @@
     "redirect-cart": "Redirigiendo al carrito",
     "register": "Solicitar Registro",
     "register-ok": "Se envió un mail a su casilla de correo para verificar su nueva cuenta",
+    "register-welcome": "Registro exitoso. Se ha enviado un email de bienvenida a su casilla de correo",
+    "register-success": "Registro exitoso. Por favor, inicie sesión",
     "related-products": "Productos relacionados",
     "repeat-new-password": "Repita nueva contraseña",
     "repeat-password": "Confirme la contraseña",

package/assets/ec-i18n/fr.json

@@ -258,6 +258,8 @@
      "newsletter-thanks": "Merci de vous être abonné aux nouvelles",
      "notes": "Détails d'expédition supplémentaires",
      "register-ok": "Un e-mail a été envoyé à votre boîte aux lettres pour vérifier votre nouveau compte",
+     "register-welcome": "Inscription réussie. Un e-mail de bienvenue a été envoyé à votre boîte de réception",
+     "register-success": "Inscription réussie. Veuillez vous connecter",
      "thanks-for-register-detail": "Vous pouvez maintenant vous connecter. Ensuite, nous vous laissons l'accès à la connexion",
      "thanks-for-register": "Merci de votre inscription",
      "pickup-store": "Magasin de ramassage",

package/assets/ec-i18n/gl.json

@@ -266,6 +266,8 @@
      "newsletter-thanks": "Grazas por subscribirte á noticia",
      "notes": "Detalles adicionais de envío",
      "register-ok": "Enviouse un correo electrónico á súa caixa de correo para verificar a súa nova conta",
+     "register-welcome": "Rexistro exitoso. Enviouse un correo electrónico de benvida á túa caixa de correo",
+     "register-success": "Rexistro exitoso. Por favor, inicie sesión",
      "thanks-for-register-detail": "Agora podes iniciar sesión. Entón deixámosche acceso ao inicio de sesión",
      "thanks-for-register": "Grazas por rexistrarse",
      "pickup-store": "Tenda de recollida",

package/assets/ec-i18n/pr.json

@@ -266,6 +266,8 @@
      "newsletter-thanks": "Obrigado por se inscrever nas notícias",
      "notes": "Detalhes adicionais de envio",
      "register-ok": "Um email foi enviado para sua caixa de correio para verificar sua nova conta",
+     "register-welcome": "Registro bem-sucedido. Um e-mail de boas-vindas foi enviado para sua caixa de correio",
+     "register-success": "Registro bem-sucedido. Por favor, faça login",
      "thanks-for-register-detail": "Agora você pode fazer login. Então deixamos você acessar o login",
      "thanks-for-register": "Obrigado por se registrar",
      "pickup-store": "Retiro na local",

package/bundles/ng-easycommerce.umd.js

@@ -7247,6 +7247,17 @@
             if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
         }
     };
+    var __values = (this && this.__values) || function(o) {
+        var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+        if (m) return m.call(o);
+        if (o && typeof o.length === "number") return {
+            next: function () {
+                if (o && i >= o.length) o = void 0;
+                return { value: o && o[i++], done: !o };
+            }
+        };
+        throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+    };
     var CartEcComponent = /** @class */ (function (_super) {
         __extends$g(CartEcComponent, _super);
         function CartEcComponent(cartService, authService, consts, productsService, router, modalService, toastrService, addressingService) {
@@ -7265,6 +7276,8 @@
             _this.promotions = [];
             _this.cargando = false;
             _this.channel = {};
+            _this.updateStock = false;
+            _this.exitUpdate = false;
             _this.toDecimal = function (amount) { return _this.consts.toDecimal(amount); };
             _this.actualizarCantidad = function (item, cantidad, stock, id) {
                 if (id) {
@@ -7519,7 +7532,78 @@
             $('#' + id).modal('hide');
         };
         CartEcComponent.prototype.checkStock = function (item) {
-            return item.quantity > item.product.variants[0].stock;
+            var e_1, _a;
+            try {
+                for (var _b = __values(item.product.variants), _c = _b.next(); !_c.done; _c = _b.next()) {
+                    var variant = _c.value;
+                    if (item.variant_id === variant.code) {
+                        if (variant.stock === 0) {
+                            this.updateStock = true;
+                            return '0';
+                        }
+                        else if (item.quantity > variant.stock) {
+                            this.updateStock = true;
+                            return variant.stock;
+                        }
+                    }
+                }
+            }
+            catch (e_1_1) { e_1 = { error: e_1_1 }; }
+            finally {
+                try {
+                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                }
+                finally { if (e_1) throw e_1.error; }
+            }
+            return false; // Solo se ejecuta si no se cumple la condición
+        };
+        CartEcComponent.prototype.updateAllStock = function () {
+            var _this = this;
+            var items = [];
+            // Define la suscripción antes de usarla
+            this.cartService.cartItems.subscribe(function (res) {
+                res.forEach(function (item) {
+                    var e_2, _a;
+                    try {
+                        for (var _b = __values(item.product.variants), _c = _b.next(); !_c.done; _c = _b.next()) {
+                            var variant = _c.value;
+                            if (item.variant_id === variant.code && !_this.exitUpdate) {
+                                if (variant.stock === 0) {
+                                    _this.cartService.deleteCartItem(item, false); // Borra el artículo
+                                }
+                                else if (item.quantity > variant.stock) {
+                                    items.push({
+                                        productCode: item.product.id,
+                                        quantity: variant.stock,
+                                        variantCode: variant.code,
+                                    });
+                                }
+                                else {
+                                    items.push({
+                                        productCode: item.product.id,
+                                        quantity: item.quantity,
+                                        variantCode: variant.code,
+                                    });
+                                }
+                            }
+                        }
+                    }
+                    catch (e_2_1) { e_2 = { error: e_2_1 }; }
+                    finally {
+                        try {
+                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                        }
+                        finally { if (e_2) throw e_2.error; }
+                    }
+                });
+                if (items.length > 0 && !_this.exitUpdate) {
+                    // subscription.unsubscribe();  // Desuscríbete antes de actualizar
+                    _this.cartService.addAllToCart(items); // Actualiza el carrito
+                    _this.updateStock = false;
+                    _this.exitUpdate = true;
+                    // this.updateAllStock();  // Vuelve a verificar el stock
+                }
+            });
         };
         CartEcComponent.prototype.createDiscountMessage = function (saleprice, price) {
             if (isNaN(saleprice) || isNaN(price) || saleprice >= price || saleprice <= 0 || price <= 0) {
@@ -8305,7 +8389,7 @@
             if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
         }
     };
-    var __values = (this && this.__values) || function(o) {
+    var __values$1 = (this && this.__values) || function(o) {
         var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
         if (m) return m.call(o);
         if (o && typeof o.length === "number") return {
@@ -8410,7 +8494,7 @@
             var e_1, _a;
             var parent = e.target.parentElement.children;
             try {
-                for (var parent_1 = __values(parent), parent_1_1 = parent_1.next(); !parent_1_1.done; parent_1_1 = parent_1.next()) {
+                for (var parent_1 = __values$1(parent), parent_1_1 = parent_1.next(); !parent_1_1.done; parent_1_1 = parent_1.next()) {
                     var button = parent_1_1.value;
                     if (button.classList.contains('active')) {
                         button.classList.remove('active');
@@ -8479,7 +8563,7 @@
         else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
         return c > 3 && r && Object.defineProperty(target, key, r), r;
     };
-    var __values$1 = (this && this.__values) || function(o) {
+    var __values$2 = (this && this.__values) || function(o) {
         var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
         if (m) return m.call(o);
         if (o && typeof o.length === "number") return {
@@ -8568,7 +8652,7 @@
             var e_1, _a;
             var parent = e.target.parentElement.children;
             try {
-                for (var parent_1 = __values$1(parent), parent_1_1 = parent_1.next(); !parent_1_1.done; parent_1_1 = parent_1.next()) {
+                for (var parent_1 = __values$2(parent), parent_1_1 = parent_1.next(); !parent_1_1.done; parent_1_1 = parent_1.next()) {
                     var button = parent_1_1.value;
                     if (button.classList.contains('active')) {
                         button.classList.remove('active');
@@ -12917,13 +13001,14 @@
     };
     var RegisterFormEcComponent = /** @class */ (function (_super) {
         __extends$O(RegisterFormEcComponent, _super);
-        function RegisterFormEcComponent(authService, toastr, router, analyticsService, formBuilder) {
+        function RegisterFormEcComponent(authService, toastr, router, analyticsService, formBuilder, channelConfigService) {
             var _this = _super.call(this) || this;
             _this.authService = authService;
             _this.toastr = toastr;
             _this.router = router;
             _this.analyticsService = analyticsService;
             _this.formBuilder = formBuilder;
+            _this.channelConfigService = channelConfigService;
             _this.isLogged = true;
             _this.darkMode = false;
             _this.redirect = true;
@@ -12940,6 +13025,8 @@
                 newsletter: false,
                 terms: false,
             };
+            _this.isAccountVerificationRequired = false;
+            _this.isSendWelcomeEmail = false;
             _this.setProp = function (prop, event) {
                 _this.registroUsuario[prop] = event.target.value;
             };
@@ -12964,7 +13051,18 @@
                 if (_this.registerForm.valid) {
                     _this.authService.signUp(_this.registerForm.value).toPromise().then(function (res) {
                         _this.register_loading = false;
-                        _this.toastr.show('register-ok');
+                        var messageKey;
+                        switch (true) {
+                            case _this.isAccountVerificationRequired:
+                                messageKey = 'register-ok';
+                                break;
+                            case _this.isSendWelcomeEmail:
+                                messageKey = 'register-welcome';
+                                break;
+                            default:
+                                messageKey = 'register-success';
+                        }
+                        _this.toastr.show(messageKey);
                         _this.analyticsService.callEvent('sign_up', {
                             firstName: _this.registerForm.value.firstName,
                             lastName: _this.registerForm.value.lastName,
@@ -12994,6 +13092,7 @@
             return _this;
         }
         RegisterFormEcComponent.prototype.ngOnInit = function () {
+            var _this = this;
             this.registerForm = this.formBuilder.group({
                 firstName: ['', forms.Validators.required],
                 lastName: ['', forms.Validators.required],
@@ -13003,6 +13102,20 @@
                 newsletter: [false],
                 terms: ['', forms.Validators.required],
             });
+            this.channelConfigService.channelConfig$.subscribe(function (config) {
+                if (config && config.isAccountVerificationRequired !== undefined) {
+                    _this.isAccountVerificationRequired = config.isAccountVerificationRequired;
+                }
+                else {
+                    _this.isAccountVerificationRequired = false;
+                }
+                if (config && config.isSendWelcomeEmail !== undefined) {
+                    _this.isSendWelcomeEmail = config.isSendWelcomeEmail;
+                }
+                else {
+                    _this.isSendWelcomeEmail = false;
+                }
+            });
             this.ecOnInit();
         };
         RegisterFormEcComponent.ctorParameters = function () { return [
@@ -13010,7 +13123,8 @@
             { type: ToastService },
             { type: router.Router },
             { type: AnalyticsService },
-            { type: forms.FormBuilder }
+            { type: forms.FormBuilder },
+            { type: ChannelConfigService }
         ]; };
         __decorate$1m([
             core.Input()
@@ -17373,6 +17487,9 @@
                 }, 1000);
             }
         };
+        BancardCatastroEcComponent.prototype.openModal = function () {
+            this.infoPreview = true;
+        };
         BancardCatastroEcComponent.prototype.closeModal = function () {
         };
         BancardCatastroEcComponent.ctorParameters = function () { return [
@@ -17408,7 +17525,7 @@
         BancardCatastroEcComponent = __decorate$1S([
             core.Component({
                 selector: 'app-bancard-catastro-ec',
-                template: "<div *ngIf=\"!loading; else loadingView\">\r\n    <div class=\"row my-3\">\r\n        <ng-container *ngIf=\"registered_cards && registered_cards.length > 0; else notCards\">\r\n            <ng-container *ngFor=\"let card of registered_cards; let x=index\">\r\n                <div class=\"col-12 col-md-6\">\r\n                    <div class=\"card my-2\">\r\n                        <div class=\"card-body\">\r\n                            <div class=\"row\">\r\n                                <div class=\"col-12 col-md-9\">\r\n                                    <h5 class=\"card-title\">Terminada en {{card.card_masked_number.slice(-4)}}</h5>\r\n                                    <!-- <h6 class=\"card-subtitle mb-2 text-muted\">Card subtitle</h6> -->\r\n                                    <!--                       <p class=\"card-text\">Some quick example text to build on the card title and make up the bulk of the card's content.</p>\r\n                                                                 -->\r\n                                    <p class=\"card-text text-muted\">{{card.card_brand}}</p>\r\n                                    <p class=\"card-text text-muted\">Vencimiento: {{card.expiration_date}}</p>\r\n                                </div>\r\n                                <div class=\"col-3 d-none d-md-flex\">\r\n                                    <div class=\"d-flex flex-column justify-content-between align-items-center w-100\">\r\n                                        <div class=\"d-flex justify-content-end w-100\">\r\n                                            <a class=\"cursor-pointer text-primary\" (click)=\"deleteCard(card.card_id)\">\r\n                                                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-trash3\"\r\n                                                    viewBox=\"0 0 16 16\">\r\n                                                    <path\r\n                                                        d=\"M6.5 1h3a.5.5 0 0 1 .5.5v1H6v-1a.5.5 0 0 1 .5-.5ZM11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3A1.5 1.5 0 0 0 5 1.5v1H2.506a.58.58 0 0 0-.01 0H1.5a.5.5 0 0 0 0 1h.538l.853 10.66A2 2 0 0 0 4.885 16h6.23a2 2 0 0 0 1.994-1.84l.853-10.66h.538a.5.5 0 0 0 0-1h-.995a.59.59 0 0 0-.01 0H11Zm1.958 1-.846 10.58a1 1 0 0 1-.997.92h-6.23a1 1 0 0 1-.997-.92L3.042 3.5h9.916Zm-7.487 1a.5.5 0 0 1 .528.47l.5 8.5a.5.5 0 0 1-.998.06L5 5.03a.5.5 0 0 1 .47-.53Zm5.058 0a.5.5 0 0 1 .47.53l-.5 8.5a.5.5 0 1 1-.998-.06l.5-8.5a.5.5 0 0 1 .528-.47ZM8 4.5a.5.5 0 0 1 .5.5v8.5a.5.5 0 0 1-1 0V5a.5.5 0 0 1 .5-.5Z\" />\r\n                                                </svg>\r\n                                            </a>\r\n                                        </div>\r\n                                        <img [src]=\"getCardImg(card.card_brand)\" class=\"img-card\" />\r\n                                        \r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"card-footer d-flex flex-row justify-content-end\">\r\n                            <ng-container *ngIf=\"!checkingPayment; else buttonLoading\">\r\n                                <button *ngIf=\"card.card_type == 'credit'; else debito\" class=\"btn comprar text-white\" data-bs-toggle=\"modal\"\r\n                                    data-bs-target=\"#modalCuotas\" (click)=\"setCurrentCardID(card.card_id)\">Pagar</button>\r\n                                <ng-template #debito>\r\n                                    <button class=\"btn comprar text-white\" (click)=\"toPay(card.card_id)\">Pagar</button>\r\n                                </ng-template>\r\n                            </ng-container>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </ng-container>\r\n        <ng-template #notCards>\r\n            <div class=\"col-12 d-flex justify-content-center\">\r\n                <h6>Usted no posee tarjetas registrada. Para continuar con este m\u00E9todo de pago por favor registre una\r\n                    tarjeta presionando el bot\u00F3n de <span class=\"text-decoration-underline fs-6\"> Nueva tarjeta</span>\r\n                </h6>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n    <div class=\"d-flex flex-row w-full justify-content-center\">\r\n        <button class=\"btn comprar text-white\" data-bs-toggle=\"modal\" data-bs-target=\"#catastro\"\r\n            (click)=\"getProcessId()\">Nueva Tarjeta</button>\r\n    </div>\r\n</div>\r\n\r\n<div class=\"modal\" tabindex=\"-1\" id=\"catastro\">\r\n    <div class=\"modal-dialog\">\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header\">\r\n                <!--  <h5 class=\"modal-title\">Modal title</h5> -->\r\n                <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"\r\n                    (click)=\"closeModal()\"></button>\r\n            </div>\r\n            <div class=\"modal-body d-flex flex-column justify-content-center align-items-center\">\r\n                <ng-container *ngIf=\"infoPreview; else iframe\">\r\n                    <div class=\"alert alert-warning \" role=\"alert\">\r\n                        <p class=\"mb-0\">Estimado usuario,</p>\r\n                        <p> A continuaci\u00F3n usted pasar\u00E1 por \u00FAnica vez por un proceso de\r\n                            validaci\u00F3n con preguntas de seguridad. Para iniciar favor tener en\r\n                            cuenta las siguientes recomendaciones:</p>\r\n                        <ol class=\"list-group list-group-numbered\">\r\n                            <li class=\"list-group-item list-group-item-warning\">Verifique su n\u00FAmero de c\u00E9dula de\r\n                                identidad</li>\r\n                            <li class=\"list-group-item list-group-item-warning\">Tenga a mano sus tarjetas de cr\u00E9dito y\r\n                                d\u00E9bito activas</li>\r\n                            <li class=\"list-group-item list-group-item-warning\">Verifique el monto y lugar de sus\r\n                                \u00FAltimas compras en\r\n                                comercios o extracciones en cajeros</li>\r\n                        </ol>\r\n                    </div>\r\n                    <div class=\"d-flex flex-row w-full justify-content-center\">\r\n                        <a class=\"cursor-pointer text-dark fs-xs\" (click)=\"skipInfoPreview()\">Saltar</a>\r\n                    </div>\r\n                </ng-container>\r\n                <ng-template #iframe>\r\n                    <iframe *ngIf=\"url; else loadingView\" [src]=\"url\" frameborder=\"0\" class=\"iframeStyle\"></iframe>\r\n                </ng-template>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n\r\n<!-- Modal -->\r\n<div class=\"modal fade\" id=\"modalCuotas\" tabindex=\"-1\" aria-labelledby=\"exampleModalLabel\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-dialog-centered modal-sm\">\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header\">\r\n                <h5 class=\"modal-title\" id=\"exampleModalLabel\">Elija el n\u00FAmero de cuotas</h5>\r\n                <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <select class=\"form-select\" aria-label=\"Default select example\"\r\n                    (change)=\"setNumberOfPayments($event.target.value)\">\r\n                    <option selected disabled>Selecciones la cantidad de cuotas</option>\r\n                    <option value=\"1\">1 cuota</option>\r\n                    <option value=\"3\">3 cuotas</option>\r\n                    <option value=\"6\">6 cuotas</option>\r\n                    <option value=\"12\">12 cuotas</option>\r\n                </select>\r\n            </div>\r\n            <div class=\"modal-footer\" *ngIf=\"canPay()\">\r\n                <button type=\"button\" class=\"btn comprar text-white\" data-bs-dismiss=\"modal\"\r\n                    (click)=\"toPay(currentCardID)\">Pagar</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #loadingView>\r\n    <div>\r\n        <app-loading-inline-ec></app-loading-inline-ec>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template #buttonLoading>\r\n    <button type=\"button\" class=\"btn comprar text-white\" data-bs-dismiss=\"modal\"> \r\n        <app-loading-inline-ec></app-loading-inline-ec>\r\n    </button>\r\n</ng-template>",
+                template: "<div *ngIf=\"!loading; else loadingView\">\r\n    <div class=\"row my-3\">\r\n        <ng-container *ngIf=\"registered_cards && registered_cards.length > 0; else notCards\">\r\n            <ng-container *ngFor=\"let card of registered_cards; let x=index\">\r\n                <div class=\"col-12 col-md-6\">\r\n                    <div class=\"card my-2\">\r\n                        <div class=\"card-body\">\r\n                            <div class=\"row\">\r\n                                <div class=\"col-12 col-md-9\">\r\n                                    <h5 class=\"card-title\">Terminada en {{card.card_masked_number.slice(-4)}}</h5>\r\n                                    <!-- <h6 class=\"card-subtitle mb-2 text-muted\">Card subtitle</h6> -->\r\n                                    <!--                       <p class=\"card-text\">Some quick example text to build on the card title and make up the bulk of the card's content.</p>\r\n                                                                 -->\r\n                                    <p class=\"card-text text-muted\">{{card.card_brand}}</p>\r\n                                    <p class=\"card-text text-muted\">Vencimiento: {{card.expiration_date}}</p>\r\n                                </div>\r\n                                <div class=\"col-3 d-none d-md-flex\">\r\n                                    <div class=\"d-flex flex-column justify-content-between align-items-center w-100\">\r\n                                        <div class=\"d-flex justify-content-end w-100\">\r\n                                            <a class=\"cursor-pointer text-primary\" (click)=\"deleteCard(card.card_id)\">\r\n                                                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-trash3\"\r\n                                                    viewBox=\"0 0 16 16\">\r\n                                                    <path\r\n                                                        d=\"M6.5 1h3a.5.5 0 0 1 .5.5v1H6v-1a.5.5 0 0 1 .5-.5ZM11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3A1.5 1.5 0 0 0 5 1.5v1H2.506a.58.58 0 0 0-.01 0H1.5a.5.5 0 0 0 0 1h.538l.853 10.66A2 2 0 0 0 4.885 16h6.23a2 2 0 0 0 1.994-1.84l.853-10.66h.538a.5.5 0 0 0 0-1h-.995a.59.59 0 0 0-.01 0H11Zm1.958 1-.846 10.58a1 1 0 0 1-.997.92h-6.23a1 1 0 0 1-.997-.92L3.042 3.5h9.916Zm-7.487 1a.5.5 0 0 1 .528.47l.5 8.5a.5.5 0 0 1-.998.06L5 5.03a.5.5 0 0 1 .47-.53Zm5.058 0a.5.5 0 0 1 .47.53l-.5 8.5a.5.5 0 1 1-.998-.06l.5-8.5a.5.5 0 0 1 .528-.47ZM8 4.5a.5.5 0 0 1 .5.5v8.5a.5.5 0 0 1-1 0V5a.5.5 0 0 1 .5-.5Z\" />\r\n                                                </svg>\r\n                                            </a>\r\n                                        </div>\r\n                                        <img [src]=\"getCardImg(card.card_brand)\" class=\"img-card\" />\r\n                                        \r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"card-footer d-flex flex-row justify-content-end\">\r\n                            <ng-container *ngIf=\"!checkingPayment; else buttonLoading\">\r\n                                <button *ngIf=\"card.card_type == 'credit'; else debito\" class=\"btn comprar text-white\" data-bs-toggle=\"modal\"\r\n                                    data-bs-target=\"#modalCuotas\" (click)=\"setCurrentCardID(card.card_id)\">Pagar</button>\r\n                                <ng-template #debito>\r\n                                    <button class=\"btn comprar text-white\" (click)=\"toPay(card.card_id)\">Pagar</button>\r\n                                </ng-template>\r\n                            </ng-container>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </ng-container>\r\n        <ng-template #notCards>\r\n            <div class=\"col-12 d-flex justify-content-center\">\r\n                <h6>Usted no posee tarjetas registrada. Para continuar con este m\u00E9todo de pago por favor registre una\r\n                    tarjeta presionando el bot\u00F3n de <span class=\"text-decoration-underline fs-6\"> Nueva tarjeta</span>\r\n                </h6>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n    <div class=\"d-flex flex-row w-full justify-content-center\">\r\n        <button class=\"btn comprar text-white\" data-bs-toggle=\"modal\" data-bs-target=\"#catastro\"\r\n            (click)=\"getProcessId(); openModal()\">Nueva Tarjeta</button>\r\n    </div>\r\n</div>\r\n\r\n<div class=\"modal\" tabindex=\"-1\" id=\"catastro\">\r\n    <div class=\"modal-dialog\">\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header\">\r\n                <!--  <h5 class=\"modal-title\">Modal title</h5> -->\r\n                <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"\r\n                    (click)=\"closeModal()\"></button>\r\n            </div>\r\n            <div class=\"modal-body d-flex flex-column justify-content-center align-items-center\">\r\n                <ng-container *ngIf=\"infoPreview; else iframe\">\r\n                    <div class=\"alert alert-warning \" role=\"alert\">\r\n                        <p class=\"mb-0\">Estimado usuario,</p>\r\n                        <p> A continuaci\u00F3n usted pasar\u00E1 por \u00FAnica vez por un proceso de\r\n                            validaci\u00F3n con preguntas de seguridad. Para iniciar favor tener en\r\n                            cuenta las siguientes recomendaciones:</p>\r\n                        <ol class=\"list-group list-group-numbered\">\r\n                            <li class=\"list-group-item list-group-item-warning\">Verifique su n\u00FAmero de c\u00E9dula de\r\n                                identidad</li>\r\n                            <li class=\"list-group-item list-group-item-warning\">Tenga a mano sus tarjetas de cr\u00E9dito y\r\n                                d\u00E9bito activas</li>\r\n                            <li class=\"list-group-item list-group-item-warning\">Verifique el monto y lugar de sus\r\n                                \u00FAltimas compras en\r\n                                comercios o extracciones en cajeros</li>\r\n                        </ol>\r\n                    </div>\r\n                    <div class=\"d-flex flex-row w-full justify-content-center\">\r\n                        <a class=\"cursor-pointer text-dark fs-xs\" (click)=\"skipInfoPreview()\">Saltar</a>\r\n                    </div>\r\n                </ng-container>\r\n                <ng-template #iframe>\r\n                    <iframe *ngIf=\"url; else loadingView\" [src]=\"url\" frameborder=\"0\" class=\"iframeStyle\"></iframe>\r\n                </ng-template>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n\r\n<!-- Modal -->\r\n<div class=\"modal fade\" id=\"modalCuotas\" tabindex=\"-1\" aria-labelledby=\"exampleModalLabel\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-dialog-centered modal-sm\">\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header\">\r\n                <h5 class=\"modal-title\" id=\"exampleModalLabel\">Elija el n\u00FAmero de cuotas</h5>\r\n                <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <select class=\"form-select\" aria-label=\"Default select example\"\r\n                    (change)=\"setNumberOfPayments($event.target.value)\">\r\n                    <option selected disabled>Selecciones la cantidad de cuotas</option>\r\n                    <option value=\"1\">1 cuota</option>\r\n                    <option value=\"3\">3 cuotas</option>\r\n                    <option value=\"6\">6 cuotas</option>\r\n                    <option value=\"12\">12 cuotas</option>\r\n                </select>\r\n            </div>\r\n            <div class=\"modal-footer\" *ngIf=\"canPay()\">\r\n                <button type=\"button\" class=\"btn comprar text-white\" data-bs-dismiss=\"modal\"\r\n                    (click)=\"toPay(currentCardID)\">Pagar</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #loadingView>\r\n    <div>\r\n        <app-loading-inline-ec></app-loading-inline-ec>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template #buttonLoading>\r\n    <button type=\"button\" class=\"btn comprar text-white\" data-bs-dismiss=\"modal\"> \r\n        <app-loading-inline-ec></app-loading-inline-ec>\r\n    </button>\r\n</ng-template>",
                 styles: [".iframeStyle{min-height:520px!important;width:80%}.img-card{width:90px;height:90px}"]
             })
         ], BancardCatastroEcComponent);