ng-easycommerce 0.0.381 → 0.0.382

package/README.md

@@ -1,5 +1,22 @@
 # Ultimas Modificaciones
 
+### version: 0.0.382
+
+- Se soluciona fix filtros por atributos y categorias.
+
+- Se soluciona fix componente contact y newsletter.
+
+- Se agrega opcion de modicacion de label en campo nota en checkout atravez de parametros.
+    -- Formato codigo parametro : label_notes_[canal]_[locale] ejemplo label_notes_mayorista_es.
+
+- Se realizaron ajustes sobre seleccion de sedes en checkout.
+
+- Se realizaron ajustes sobre modal de seleccion de canales.
+
+- Se creo pipe para sanitizacion de HTML.
+
+- Se creo pipe para sanitizacion de URL.
+
 ### version: 0.0.381
 
 - Se realizaron mejoras sobre componente de newsletters para enviar otros atributos al backoffice.

package/bundles/ng-easycommerce.umd.js

@@ -703,16 +703,17 @@
                 _this.data = categories;
             };
             _this.createElement = function (filter, original, initial_value) {
+                var _a, _b, _c, _d;
                 if (filter.type == 'sub') {
                     filter.multi = false;
                     filter.shape = 'text';
                     filter.value = original.code;
-                    filter.selected = (initial_value && original.slug == initial_value);
+                    filter.selected = (initial_value && ((_a = original.slug) === null || _a === void 0 ? void 0 : _a.toLowerCase()) == ((_b = initial_value) === null || _b === void 0 ? void 0 : _b.toLowerCase()));
                     filter.children = filter.children.map(function (child, i) { return _this.createElement(child, original.children[i], initial_value); });
                 }
                 else {
                     filter.value = original.code;
-                    filter.selected = (initial_value && original.slug == initial_value);
+                    filter.selected = (initial_value && ((_c = original.slug) === null || _c === void 0 ? void 0 : _c.toLowerCase()) == ((_d = initial_value) === null || _d === void 0 ? void 0 : _d.toLowerCase()));
                 }
                 return filter;
             };
@@ -1105,6 +1106,7 @@
                 _this.data = attributes;
             };
             _this.createElement = function (filter, original, initial_value) {
+                var _a, _b;
                 if (filter.type == 'sub') {
                     filter.multi = false;
                     filter.shape = 'text';
@@ -1113,7 +1115,7 @@
                 }
                 else {
                     filter.value = original.code;
-                    filter.selected = (initial_value && original.slug == initial_value);
+                    filter.selected = (initial_value && ((_a = original.slug) === null || _a === void 0 ? void 0 : _a.toLowerCase()) == ((_b = initial_value) === null || _b === void 0 ? void 0 : _b.toLowerCase()));
                 }
                 return filter;
             };
@@ -5302,7 +5304,7 @@
             _this.sendValue = function (key) {
                 try {
                     var keysearch = key[0].toUpperCase() + key.slice(1).toLowerCase();
-                    return _this.block['send' + keysearch];
+                    return _this.block && _this.block['send' + keysearch] || false;
                 }
                 catch (error) {
                     console.error(error);
@@ -5500,7 +5502,7 @@
             _this.sendValue = function (key) {
                 try {
                     var keysearch = key[0].toUpperCase() + key.slice(1).toLowerCase();
-                    return _this.block['send' + keysearch];
+                    return _this.block && _this.block['send' + keysearch] || false;
                 }
                 catch (error) {
                     console.error(error);
@@ -5982,7 +5984,7 @@
     };
     var DataFormEcComponent = /** @class */ (function (_super) {
         __extends$h(DataFormEcComponent, _super);
-        function DataFormEcComponent(authService, fb, toast, addressingService, cartService, modalService, consts) {
+        function DataFormEcComponent(authService, fb, toast, addressingService, cartService, modalService, paramsService, consts) {
             var _this = _super.call(this) || this;
             _this.authService = authService;
             _this.fb = fb;
@@ -5990,6 +5992,7 @@
             _this.addressingService = addressingService;
             _this.cartService = cartService;
             _this.modalService = modalService;
+            _this.paramsService = paramsService;
             _this.consts = consts;
             _this.countriesSubject = new rxjs.BehaviorSubject([]);
             _this.provincesSubject = new rxjs.BehaviorSubject([]);
@@ -6007,6 +6010,7 @@
             _this.addressBookSelected = { id: 0, notes: "" };
             _this.validado = false;
             _this.viewDataFacturacion = true;
+            _this.params = {};
             _this.showFormFacturacion = function () {
                 _this.viewDataFacturacion = !_this.viewDataFacturacion;
                 _this.onFormChange();
@@ -6089,6 +6093,9 @@
                             _a.label = 1;
                         case 1:
                             _a.trys.push([1, 3, , 4]);
+                            if (!this.addressBookSelected.id) {
+                                this.addressBookSelected.id = addressSelected.id || 0;
+                            }
                             request = {
                                 selected: this.addressBookSelected,
                                 shippingAddress: addressSelected
@@ -6127,6 +6134,7 @@
             _this.getCountry = function (code) { var _a; return ((_a = _this.addressingService.countriesList.find(function (paises) { return paises.code.toLocaleLowerCase().includes(code.toLocaleLowerCase()); })) === null || _a === void 0 ? void 0 : _a.name) || ""; };
             _this.getProvince = function (code) { var _a; return ((_a = _this.addressingService.provinceList.find(function (ct) { return ct.code == code; })) === null || _a === void 0 ? void 0 : _a.name) || ""; };
             _this.getDocumentType = function (code) { var _a; return ((_a = _this.addressingService.documentTypes.find(function (dt) { return dt.code == code; })) === null || _a === void 0 ? void 0 : _a.name) || ""; };
+            _this.getLabelNotesParam = function () { return _this.hasParams(_this.params, 'label_notes_' + _this.consts.getChannel() + '_' + _this.consts.getLocale().split('_')[0]); };
             _this.ecOnConstruct();
             _this.checkoutForm = _this.fb.group(_this.addressingService.getTypeForm().configForm.formAddres);
             _this.checkoutForm.statusChanges
@@ -6140,6 +6148,7 @@
         }
         DataFormEcComponent.prototype.ngOnInit = function () {
             var _this = this;
+            this.paramsService.parameters.subscribe(function (res) { return _this.params = res; });
             this.addressingService.initialize(this.step_id);
             var mailLocal = localStorage.getItem('mail');
             this.authService.isAuthenticated() && this.checkoutForm.controls['email'].setValue(mailLocal);
@@ -6174,6 +6183,7 @@
             { type: AddressingService },
             { type: CartService },
             { type: modal.BsModalService },
+            { type: ParametersService },
             { type: Constants }
         ]; };
         __decorate$K([
@@ -6182,8 +6192,9 @@
         DataFormEcComponent = __decorate$K([
             core.Component({
                 selector: 'app-dataform-ec',
-                template: "<ng-container *ngIf=\"getMode(); else addressSelection\">\n    <div *ngIf=\"!require_login; else requireLoginView\">\n\n        <div class=\"checkout-title\">\n            <h3>{{'billing-details'|translate}}</h3>\n        </div>\n\n        <form (submit)=\"verifyValidate()\">\n            <div class=\"form-row mt-df\">\n                <div class=\"form-group col-12 col-md-6\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.firstName.enabled\">\n                    <label class=\"field-label\">{{'first-name'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.firstName.required\"\n                            class=\"required\">*</span></label>\n                    <input class=\"form-control\" type=\"text\" name=\"firstName\"\n                        [formControl]=\"checkoutForm.controls['firstName']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.firstName.touched && checkoutForm.controls.firstName.errors?.required\">\n                        <span class=\"text-danger\">{{'first-name-help1'|translate}}</span>\n\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.firstName.touched && checkoutForm.controls.firstName.errors?.pattern\">\n                        <span class=\"text-danger\">\n                            {{'first-name-help2'|translate}}\n                        </span>\n                    </div>\n                </div>\n                <div class=\"form-group col-12 col-md-6\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.lastName.enabled\">\n                    <label class=\"field-label\">{{'last-name'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.lastName.required\"\n                            class=\"required\">*</span></label>\n                    <input class=\"form-control\" type=\"text\" name=\"lastName\"\n                        [formControl]=\"checkoutForm.controls['lastName']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.lastName.touched && checkoutForm.controls.lastName.errors?.required\">\n                        <span class=\"text-danger\">{{'last-name-help1'|translate}}</span>\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.lastName.touched && checkoutForm.controls.lastName.errors?.pattern\">\n                        <span class=\"text-danger\">{{'last-name-help2'|translate}}</span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"form-row mt-df\">\n                <div class=\"form-group col-12 col-md-3\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.phoneNumber.enabled\">\n                    <label class=\"field-label\">{{'phone'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.phoneNumber.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"phoneNumber\"\n                        [formControl]=\"checkoutForm.controls['phoneNumber']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.phoneNumber.touched && checkoutForm.controls.phoneNumber.errors?.required\">\n                        <span class=\"text-danger\">\n\n                            {{'phone-help1'|translate}}\n                        </span>\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.phoneNumber.touched && checkoutForm.controls.phoneNumber.errors?.pattern\">\n                        <span class=\"text-danger\">\n                            {{'phone-help2'|translate}}\n                        </span>\n                    </div>\n                </div>\n                <div class=\"form-group col-12 col-md-6\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.email.enabled\">\n                    <label class=\"field-label\">{{'email-address'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.email.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"email\"\n                        [formControl]=\"checkoutForm.controls['email']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.email.touched && checkoutForm.controls.email.errors?.required\">\n                        <span class=\"text-danger\">\n                            {{'email-address-help1'|translate}}\n                        </span>\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.email.touched && checkoutForm.controls.email.errors?.email\">\n                        <span class=\"text-danger\">\n                            {{'email-address-help2'|translate}}\n                        </span>\n                    </div>\n                </div>\n                <div class=\"form-group col-12 col-md-3\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.documentType.enabled\">\n                    <label class=\"field-label\">{{'document-type'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.documentType.required\"\n                            class=\"required\">*</span></label>\n                    <select name=\"documentType\" class=\"form-control\"\n                        [formControl]=\"checkoutForm.controls['documentType']\">\n                        <option value=\"\" selected>{{'document-type'|translate}}</option>\n                        <option *ngFor=\"let item of this.addressingService.getTypeForm().viewForms.documentType.values\"\n                            [value]=\"item.code\">{{item.name}}</option>\n                    </select>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.documentType.touched && checkoutForm.controls.documentType.errors?.required\">\n                        <span class=\"text-danger\">\n                            {{'type-document-help'|translate}}\n                        </span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"form-row mt-df\">\n                <div class=\"form-group col-12 col-md-4\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.documentNumber.enabled\">\n                    <label class=\"field-label\">{{'document-number'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.documentNumber.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\"\n                        [type]=\"(this.addressingService.typeForms == 'EUR' ? 'text' : 'number') \" name=\"documentNumber\"\n                        [formControl]=\"checkoutForm.controls['documentNumber']\" min=\"1\" max=\"99999999999\" value=\"\"\n                        placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.documentNumber.touched && checkoutForm.controls.documentNumber.errors?.required\">\n                        <span class=\"text-danger\">\n                            {{'document-number-help'|translate}}\n                        </span>\n                    </div>\n                </div>\n\n                <ng-container *ngIf=\"this.addressingService.getTypeForm().viewForms.countryCode.enabled\">\n                    <div class=\"form-group col-12 col-md-3\" *ngIf=\"(countries$ | async) as countries\">\n                        <label class=\"field-label\">{{'country'|translate}}<span\n                                *ngIf=\"this.addressingService.getTypeForm().viewForms.countryCode.required\"\n                                class=\"required\">*</span></label>\n                        <select class=\"form-control\" name=\"countryCode\"\n                            [formControl]=\"checkoutForm.controls['countryCode']\"\n                            (change)=\"onCountrySelected($event.target.value)\">\n                            <option selected [value]=\"null\">Seleccione un pais</option>\n                            <option *ngFor=\"let country of countries\" [value]=\"country.code\">{{ country.name }}</option>\n                        </select>\n                        <div *ngIf=\"checkoutForm.controls.countryCode.touched && checkoutForm.controls.countryCode.errors?.required\"\n                            class=\"text text-danger\">\n                            {{'country-help'|translate}}\n                        </div>\n                    </div>\n                </ng-container>\n\n                <div class=\"form-group col-12 col-md-5\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.street.enabled\">\n                    <label class=\"field-label\">{{'address'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.street.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"street\"\n                        [formControl]=\"checkoutForm.controls['street']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.street.touched && checkoutForm.controls.street.errors?.required\">\n                        <span class=\"text-danger\">{{'address-help1'|translate}}</span>\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.street.touched && checkoutForm.controls.street.errors?.maxlength\">\n                        <span class=\"text-danger\">{{'address-help2'|translate}}</span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"form-row mt-df\">\n                <div class=\"form-group col-12 col-md-4\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.city.enabled\">\n                    <label class=\"field-label\">{{'town-city'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.city.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"city\"\n                        [formControl]=\"checkoutForm.controls['city']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.city.touched && checkoutForm.controls.city.errors?.required\">\n                        <span class=\"text-danger\">{{'town-city-help'|translate}}</span>\n                    </div>\n                </div>\n                <ng-container *ngIf=\"this.addressingService.getTypeForm().viewForms.provinceCode.enabled\">\n                    <div class=\"form-group col-12 col-md-4\" *ngIf=\"(provinces$ | async) as provinces\">\n                        <label class=\"field-label\">{{'state'|translate}}<span\n                                *ngIf=\"this.addressingService.getTypeForm().viewForms.provinceCode.required\"\n                                class=\"required\">*</span></label>\n                        <select class=\"form-control\" name=\"provinceCode\"\n                            (change)=\"onProvincesSelected($event.target.value)\"\n                            [formControl]=\"checkoutForm.controls['provinceCode']\">\n                            <option selected [value]=\"null\">Seleccione una provincia</option>\n                            <option *ngFor=\"let province of provinces\" [value]=\"province.code\">{{ province.name }}\n                            </option>\n                        </select>\n                        <div *ngIf=\"checkoutForm.controls.provinceCode.touched && checkoutForm.controls.provinceCode.errors?.required\"\n                            class=\"text text-danger\">\n                            {{'state-help'|translate}}\n                        </div>\n                    </div>\n                </ng-container>\n\n                <div class=\"form-group col-12 col-md-4\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.postcode.enabled\">\n                    <label class=\"field-label\">{{'postal-code'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.postcode.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"postcode\"\n                        [formControl]=\"checkoutForm.controls['postcode']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.postcode.touched && checkoutForm.controls.postcode.errors?.required\">\n                        <span class=\"text-danger\">{{'postal-code-help'|translate}}</span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"form-row mt-df\">\n                <div class=\"form-group col-12 col-md-12\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.enabled\">\n                    <label class=\"field-label\">{{'notes'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"notes\"\n                        [formControl]=\"checkoutForm.controls['notes']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                </div>\n            </div>\n            <div class=\"form-row mt-df\">\n                <div class=\"form-group col-12 col-md-12\">\n                    <label for=\"formFact\"><b>Mismo datos de facturaci\u00F3n</b> <input type=\"checkbox\" class=\"ml-3\"\n                            [checked]=\"viewDataFacturacion\" (change)=\"showFormFacturacion()\" id=\"formFact\"></label>\n                </div>\n            </div>\n            <div class=\"form-row mt-df\">\n                <div class=\"col-12\">\n                    <p>\n                        <span class=\"required\">*</span>\n                        <label class=\"required text-underline\"> Campos requeridos</label>\n                    </p>\n                </div>\n            </div>\n            <div class=\"form-row mt-df\">\n                <div class=\"form-group col-12 col-md-12\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.terms.enabled\">\n                    <span *ngIf=\"this.addressingService.getTypeForm().viewForms.terms.required\"\n                        class=\"required\">*</span>\n                    <label class=\"\" for=\"\"> Acepto los t\u00E9rminos y condiciones <input class=\"\" name=\"terms\"\n                            [formControl]=\"checkoutForm.controls['terms']\" type=\"checkbox\" required\n                            (change)=\"onInputChange()\" /> </label>\n                    <a (click)=\"openModal(template)\" role=\"button\" class=\"ml-3 nota-input text-dark\">\u00BFQue es esto?</a>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.terms.touched && !checkoutForm.controls.terms.value\">\n                        <span class=\"text-danger\">Debe aceptar los t\u00E9rminos y condiciones para continuar.</span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"form-row\" *ngIf=\"viewDataFacturacion ; else datosFormFacturacion\"> </div>\n            <div class=\"checkout-btn-unique text-right mt-2\" *ngIf=\"!form_ready\">\n                <button type=\"submit\" [disabled]=\"!validado\" class=\"btn valid-btn\">{{ (allready_data ? 'update' :\n                    'ready') | translate}}</button>\n            </div>\n            <div *ngIf=\"loading\" class=\"d-flex flex-column jusitfy-content-center align-items-center\">\n                <app-loading-full-ec></app-loading-full-ec>\n            </div>\n        </form>\n    </div>\n</ng-container>\n\n<ng-template #addressSelection>\n    <div class=\"checkout-title\">\n        <h3>{{'address-selection'|translate}}</h3>\n    </div>\n    <div class=\"container\">\n        <div class=\"w-100 my-3\" *ngFor=\"let item of addressBook; let i = index\">\n            <!-- <pre> {{item | json}} </pre> -->\n            <div class=\"card w-100\">\n                <div class=\"card-body\">\n                    <div class=\"containes-fluid\">\n                        <div class=\"row\">\n                            <div class=\"col-1\">\n                                <input class=\"form-check-input\" type=\"radio\" [name]=\"'n-'+i\" [id]=\"i\"\n                                    [checked]=\"item.selected\" (click)=\"setSelectAddress(item)\">\n                            </div>\n                            <div class=\"col-11\">\n                                <div class=\"containes-fluid\">\n                                    <div class=\"row\">\n                                        <div class=\"col-md-6 col-12\">\n                                            <h5 class=\"card-title\"><b>{{'address'|translate}}</b> {{item.street}}</h5>\n                                            <h6 class=\"card-subtitle mb-2 text-muted\"><b>{{'country'|translate}}</b> {{getCountry(item.countryCode)}}</h6>\n                                            <h6 class=\"card-subtitle mb-2 text-muted\"><b>{{'state'|translate}}</b> {{getProvince(item.provinceCode)}}</h6>\n                                            <h6 class=\"card-subtitle mb-2 text-muted\"><b>{{'town-city'|translate}}</b> {{item.city}}</h6>\n                                            <h6 class=\"card-subtitle mb-2 text-muted\"><b>{{'postal-code'|translate}}</b> {{item.postcode}}</h6>\n                                        </div>\n                                        <div class=\"col-md-6 col-12\">\n                                            <div class=\"card w-100 p-2\">\n                                                <div class=\"card-body\">\n                                                    <h5 class=\"card-title\">{{'address-contact'|translate}}</h5>\n                                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                                        <b>{{'first-name'|translate}}</b> {{item.addressContact.firstName}}</h6>\n                                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                                        <b>{{'last-name'|translate}}</b> {{item.addressContact.lastName}}</h6>\n                                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                                        <b>{{'document-type'|translate}}</b> {{getDocumentType(item.addressContact.documentType)}}</h6>\n                                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                                        <b>{{'document-number'|translate}}</b> {{item.addressContact.documentNumber}}</h6>\n                                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                                        <b>{{'email-address'|translate}}</b> {{item.addressContact.email}}</h6>\n                                                </div>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </div>\n        <div class=\"w-100\">\n            <div class=\"form-row mt-df\">\n                <div class=\"form-group col-12 col-md-12\">\n                    <label class=\"field-label\">{{'notes'|translate}}</label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"notes\"\n                        [(ngModel)]=\"this.addressBookSelected.notes\" #ctrl=\"ngModel\" value=\"\" placeholder=\"\"\n                        autocomplete=\"off\">\n                </div>\n            </div>\n        </div>\n        <div class=\"checkout-btn-unique text-right mt-2\" *ngIf=\"!form_ready\">\n            <button (click)=\"selectAddress()\" class=\"btn valid-btn\"> {{ (allready_data ? 'update' : 'ready') |\n                translate}}</button>\n        </div>\n        <div *ngIf=\"loading\" class=\"d-flex flex-column jusitfy-content-center align-items-center\">\n            <app-loading-full-ec></app-loading-full-ec>\n        </div>\n    </div>\n</ng-template>\n\n\n<ng-template #requireLoginView>\n    <div id=\"loginCheckout\">\n        <div class=\"d-flex flex-column jusitfy-content-center align-items-center\" *ngIf=\"require_login\">\n            <div class=\"col-12\">\n                <app-login-form-ec (ready)=\"verifyValidate($event)\" [redirect]=\"false\" [title]=\"'need-login'\">\n                </app-login-form-ec>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n\n\n<ng-template #datosFormFacturacion>\n    <div class=\"container-fluid\">\n        <div class=\"form-row\">\n            <div class=\"col-12\">\n                <div class=\"card \">\n                    <div class=\"card-header text-dark text-center\">\n                        <h3>Datos de facturacion</h3>\n                    </div>\n                    <div class=\"card-body\">\n                        <form (submit)=\"verifyValidate()\">\n                            <div class=\"form-row mt-df\">\n                                <div class=\"form-group col-12 col-md-6\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.firstName.enabled\">\n                                    <label class=\"field-label\">{{'first-name'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.firstName.required\"\n                                            class=\"required\">*</span></label>\n                                    <input class=\"form-control\" type=\"text\" name=\"firstName\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['firstName']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.firstName.touched && checkoutFormFacturacion.controls.firstName.errors?.required\">\n                                        <span class=\"text-danger\">{{'first-name-help1'|translate}}</span>\n\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.firstName.touched && checkoutFormFacturacion.controls.firstName.errors?.pattern\">\n                                        <span class=\"text-danger\">\n                                            {{'first-name-help2'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                                <div class=\"form-group col-12 col-md-6\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.lastName.enabled\">\n                                    <label class=\"field-label\">{{'last-name'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.lastName.required\"\n                                            class=\"required\">*</span></label>\n                                    <input class=\"form-control\" type=\"text\" name=\"lastName\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['lastName']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.lastName.touched && checkoutFormFacturacion.controls.lastName.errors?.required\">\n                                        <span class=\"text-danger\">{{'last-name-help1'|translate}}</span>\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.lastName.touched && checkoutFormFacturacion.controls.lastName.errors?.pattern\">\n                                        <span class=\"text-danger\">{{'last-name-help2'|translate}}</span>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"form-row mt-df\">\n                                <div class=\"form-group col-12 col-md-3\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.phoneNumber.enabled\">\n                                    <label class=\"field-label\">{{'phone'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.phoneNumber.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\"\n                                        name=\"phoneNumber\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['phoneNumber']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.phoneNumber.touched && checkoutFormFacturacion.controls.phoneNumber.errors?.required\">\n                                        <span class=\"text-danger\">\n                                            {{'phone-help1'|translate}}\n                                        </span>\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.phoneNumber.touched && checkoutFormFacturacion.controls.phoneNumber.errors?.pattern\">\n                                        <span class=\"text-danger\">\n                                            {{'phone-help2'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                                <div class=\"form-group col-12 col-md-6\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.email.enabled\">\n                                    <label class=\"field-label\">{{'email-address'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.email.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"email\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['email']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.email.touched && checkoutFormFacturacion.controls.email.errors?.required\">\n                                        <span class=\"text-danger\">\n                                            {{'email-address-help1'|translate}}\n                                        </span>\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.email.touched && checkoutFormFacturacion.controls.email.errors?.email\">\n                                        <span class=\"text-danger\">\n                                            {{'email-address-help2'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                                <div class=\"form-group col-12 col-md-3\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.documentType.enabled\">\n                                    <label class=\"field-label\">{{'document-type'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.documentType.required\"\n                                            class=\"required\">*</span></label>\n                                    <select name=\"documentType\" class=\"form-control\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['documentType']\">\n                                        <option value=\"\" selected>{{'document-type'|translate}}</option>\n                                        <option\n                                            *ngFor=\"let item of this.addressingService.getTypeForm().viewForms.documentType.values\"\n                                            [value]=\"item.code\">{{item.name}}</option>\n                                    </select>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.documentType.touched && checkoutFormFacturacion.controls.documentType.errors?.required\">\n                                        <span class=\"text-danger\">\n                                            {{'type-document-help'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"form-row mt-df\">\n                                <div class=\"form-group col-12 col-md-4\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.documentNumber.enabled\">\n                                    <label class=\"field-label\">{{'document-number'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.documentNumber.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\"\n                                        [type]=\"(this.addressingService.typeForms == 'EUR' ? 'text' : 'number') \"\n                                        name=\"documentNumber\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['documentNumber']\" min=\"1\"\n                                        max=\"99999999999\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.documentNumber.touched && checkoutFormFacturacion.controls.documentNumber.errors?.required\">\n                                        <span class=\"text-danger\">\n                                            {{'document-number-help'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                                <ng-container\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.countryCode.enabled\">\n\n                                    <div class=\"form-group col-12 col-md-3\"\n                                        *ngIf=\"(countriesFacturacion$ | async) as countries\">\n                                        <label class=\"field-label\">{{'country'|translate}}<span\n                                                *ngIf=\"this.addressingService.getTypeForm().viewForms.countryCode.required\"\n                                                class=\"required\">*</span></label>\n                                        <select class=\"form-control\" name=\"countryCode\"\n                                            [formControl]=\"checkoutFormFacturacion.controls['countryCode']\"\n                                            (change)=\"onCountrySelectedFacturacion($event.target.value)\">\n                                            <option selected [value]=\"null\">Seleccione un pais</option>\n                                            <option *ngFor=\"let country of countries\" [value]=\"country.code\">\n                                                {{ country.name }}</option>\n                                        </select>\n                                        <div *ngIf=\"checkoutFormFacturacion.controls.countryCode.touched && checkoutFormFacturacion.controls.countryCode.errors?.required\"\n                                            class=\"text text-danger\">\n                                            {{'country-help'|translate}}\n                                        </div>\n                                    </div>\n                                </ng-container>\n                                <div class=\"form-group col-12 col-md-5\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.street.enabled\">\n                                    <label class=\"field-label\">{{'address'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.street.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"street\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['street']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.street.touched && checkoutFormFacturacion.controls.street.errors?.required\">\n                                        <span class=\"text-danger\">{{'address-help1'|translate}}</span>\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.street.touched && checkoutFormFacturacion.controls.street.errors?.maxlength\">\n                                        <span class=\"text-danger\">{{'address-help2'|translate}}</span>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"form-row mt-df\">\n                                <div class=\"form-group col-12 col-md-4\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.city.enabled\">\n                                    <label class=\"field-label\">{{'town-city'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.city.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"city\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['city']\" value=\"\" placeholder=\"\"\n                                        autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.city.touched && checkoutFormFacturacion.controls.city.errors?.required\">\n                                        <span class=\"text-danger\">{{'town-city-help'|translate}}</span>\n                                    </div>\n                                </div>\n                                <ng-container\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.provinceCode.enabled\">\n\n                                    <div class=\"form-group col-12 col-md-4\"\n                                        *ngIf=\"(provincesFacturacion$ | async) as provinces\">\n                                        <label class=\"field-label\">{{'state'|translate}}<span\n                                                *ngIf=\"this.addressingService.getTypeForm().viewForms.provinceCode.required\"\n                                                class=\"required\">*</span></label>\n                                        <select class=\"form-control\" name=\"provinceCode\"\n                                            (change)=\"onProvincesSelectedFacturacion($event.target.value)\"\n                                            [formControl]=\"checkoutFormFacturacion.controls['provinceCode']\">\n                                            <option selected [value]=\"null\">Seleccione una provincia</option>\n                                            <option *ngFor=\"let province of provinces\" [value]=\"province.code\">\n                                                {{ province.name }}\n                                            </option>\n                                        </select>\n                                        <div *ngIf=\"checkoutFormFacturacion.controls.provinceCode.touched && checkoutFormFacturacion.controls.provinceCode.errors?.required\"\n                                            class=\"text text-danger\">\n                                            {{'state-help'|translate}}\n                                        </div>\n                                    </div>\n                                </ng-container>\n                                <div class=\"form-group col-12 col-md-4\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.postcode.enabled\">\n                                    <label class=\"field-label\">{{'postal-code'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.postcode.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"postcode\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['postcode']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.postcode.touched && checkoutFormFacturacion.controls.postcode.errors?.required\">\n                                        <span class=\"text-danger\">{{'postal-code-help'|translate}}</span>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"form-row mt-df\">\n                                <div class=\"form-group col-12 col-md-12\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.enabled\">\n                                    <label class=\"field-label\">{{'notes'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"notes\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['notes']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                </div>\n                            </div>\n                        </form>\n                    </div>\n\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n\n\n<ng-template #template>\n    <div class=\"modal-content\">\n        <div class=\"modal-header\">\n            <button type=\"button\" class=\"close pull-right\" aria-label=\"Close\" (click)=\"modalRef.hide()\">\n                <span aria-hidden=\"true\">&times;</span>\n            </button>\n        </div>\n    </div>\n\n    <div class=\"modal-body scrol-if\">\n        <app-section-container-ec [name]=\"'terminos-y-condiciones'\"> </app-section-container-ec>\n    </div>\n\n</ng-template>",
-                styles: [".mt-df{margin:10px auto 0}.required{color:red}.field-label{color:#000}.btn.valid-btn{background-color:#000;color:#fff;margin-right:12px}label{color:#000}"]
+                template: "<ng-container *ngIf=\"getMode(); else addressSelection\">\n    <div *ngIf=\"!require_login; else requireLoginView\">\n\n        <div class=\"checkout-title\">\n            <h3>{{'billing-details'|translate}}</h3>\n        </div>\n\n        <form (submit)=\"verifyValidate()\">\n            <div class=\"row mt-df\">\n                <div class=\"form-group col-12 col-md-6\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.firstName.enabled\">\n                    <label class=\"field-label\">{{'first-name'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.firstName.required\"\n                            class=\"required\">*</span></label>\n                    <input class=\"form-control\" type=\"text\" name=\"firstName\"\n                        [formControl]=\"checkoutForm.controls['firstName']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.firstName.touched && checkoutForm.controls.firstName.errors?.required\">\n                        <span class=\"text-danger\">{{'first-name-help1'|translate}}</span>\n\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.firstName.touched && checkoutForm.controls.firstName.errors?.pattern\">\n                        <span class=\"text-danger\">\n                            {{'first-name-help2'|translate}}\n                        </span>\n                    </div>\n                </div>\n                <div class=\"form-group col-12 col-md-6\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.lastName.enabled\">\n                    <label class=\"field-label\">{{'last-name'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.lastName.required\"\n                            class=\"required\">*</span></label>\n                    <input class=\"form-control\" type=\"text\" name=\"lastName\"\n                        [formControl]=\"checkoutForm.controls['lastName']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.lastName.touched && checkoutForm.controls.lastName.errors?.required\">\n                        <span class=\"text-danger\">{{'last-name-help1'|translate}}</span>\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.lastName.touched && checkoutForm.controls.lastName.errors?.pattern\">\n                        <span class=\"text-danger\">{{'last-name-help2'|translate}}</span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row mt-df\">\n                <div class=\"form-group col-12 col-md-3\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.phoneNumber.enabled\">\n                    <label class=\"field-label\">{{'phone'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.phoneNumber.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"phoneNumber\"\n                        [formControl]=\"checkoutForm.controls['phoneNumber']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.phoneNumber.touched && checkoutForm.controls.phoneNumber.errors?.required\">\n                        <span class=\"text-danger\">\n\n                            {{'phone-help1'|translate}}\n                        </span>\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.phoneNumber.touched && checkoutForm.controls.phoneNumber.errors?.pattern\">\n                        <span class=\"text-danger\">\n                            {{'phone-help2'|translate}}\n                        </span>\n                    </div>\n                </div>\n                <div class=\"form-group col-12 col-md-6\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.email.enabled\">\n                    <label class=\"field-label\">{{'email-address'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.email.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"email\"\n                        [formControl]=\"checkoutForm.controls['email']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.email.touched && checkoutForm.controls.email.errors?.required\">\n                        <span class=\"text-danger\">\n                            {{'email-address-help1'|translate}}\n                        </span>\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.email.touched && checkoutForm.controls.email.errors?.email\">\n                        <span class=\"text-danger\">\n                            {{'email-address-help2'|translate}}\n                        </span>\n                    </div>\n                </div>\n                <div class=\"form-group col-12 col-md-3\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.documentType.enabled\">\n                    <label class=\"field-label\">{{'document-type'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.documentType.required\"\n                            class=\"required\">*</span></label>\n                    <select name=\"documentType\" class=\"form-control\"\n                        [formControl]=\"checkoutForm.controls['documentType']\">\n                        <option value=\"\" selected>{{'document-type'|translate}}</option>\n                        <option *ngFor=\"let item of this.addressingService.getTypeForm().viewForms.documentType.values\"\n                            [value]=\"item.code\">{{item.name}}</option>\n                    </select>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.documentType.touched && checkoutForm.controls.documentType.errors?.required\">\n                        <span class=\"text-danger\">\n                            {{'type-document-help'|translate}}\n                        </span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row mt-df\">\n                <div class=\"form-group col-12 col-md-4\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.documentNumber.enabled\">\n                    <label class=\"field-label\">{{'document-number'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.documentNumber.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\"\n                        [type]=\"(this.addressingService.typeForms == 'EUR' ? 'text' : 'number') \" name=\"documentNumber\"\n                        [formControl]=\"checkoutForm.controls['documentNumber']\" min=\"1\" max=\"99999999999\" value=\"\"\n                        placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.documentNumber.touched && checkoutForm.controls.documentNumber.errors?.required\">\n                        <span class=\"text-danger\">\n                            {{'document-number-help'|translate}}\n                        </span>\n                    </div>\n                </div>\n\n                <ng-container *ngIf=\"this.addressingService.getTypeForm().viewForms.countryCode.enabled\">\n                    <div class=\"form-group col-12 col-md-3\" *ngIf=\"(countries$ | async) as countries\">\n                        <label class=\"field-label\">{{'country'|translate}}<span\n                                *ngIf=\"this.addressingService.getTypeForm().viewForms.countryCode.required\"\n                                class=\"required\">*</span></label>\n                        <select class=\"form-control\" name=\"countryCode\"\n                            [formControl]=\"checkoutForm.controls['countryCode']\"\n                            (change)=\"onCountrySelected($event.target.value)\">\n                            <option selected [value]=\"null\">Seleccione un pais</option>\n                            <option *ngFor=\"let country of countries\" [value]=\"country.code\">{{ country.name }}</option>\n                        </select>\n                        <div *ngIf=\"checkoutForm.controls.countryCode.touched && checkoutForm.controls.countryCode.errors?.required\"\n                            class=\"text text-danger\">\n                            {{'country-help'|translate}}\n                        </div>\n                    </div>\n                </ng-container>\n\n                <div class=\"form-group col-12 col-md-5\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.street.enabled\">\n                    <label class=\"field-label\">{{'address'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.street.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"street\"\n                        [formControl]=\"checkoutForm.controls['street']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.street.touched && checkoutForm.controls.street.errors?.required\">\n                        <span class=\"text-danger\">{{'address-help1'|translate}}</span>\n                    </div>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.street.touched && checkoutForm.controls.street.errors?.maxlength\">\n                        <span class=\"text-danger\">{{'address-help2'|translate}}</span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row mt-df\">\n                <div class=\"form-group col-12 col-md-4\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.city.enabled\">\n                    <label class=\"field-label\">{{'town-city'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.city.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"city\"\n                        [formControl]=\"checkoutForm.controls['city']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.city.touched && checkoutForm.controls.city.errors?.required\">\n                        <span class=\"text-danger\">{{'town-city-help'|translate}}</span>\n                    </div>\n                </div>\n                <ng-container *ngIf=\"this.addressingService.getTypeForm().viewForms.provinceCode.enabled\">\n                    <div class=\"form-group col-12 col-md-4\" *ngIf=\"(provinces$ | async) as provinces\">\n                        <label class=\"field-label\">{{'state'|translate}}<span\n                                *ngIf=\"this.addressingService.getTypeForm().viewForms.provinceCode.required\"\n                                class=\"required\">*</span></label>\n                        <select class=\"form-control\" name=\"provinceCode\"\n                            (change)=\"onProvincesSelected($event.target.value)\"\n                            [formControl]=\"checkoutForm.controls['provinceCode']\">\n                            <option selected [value]=\"null\">Seleccione una provincia</option>\n                            <option *ngFor=\"let province of provinces\" [value]=\"province.code\">{{ province.name }}\n                            </option>\n                        </select>\n                        <div *ngIf=\"checkoutForm.controls.provinceCode.touched && checkoutForm.controls.provinceCode.errors?.required\"\n                            class=\"text text-danger\">\n                            {{'state-help'|translate}}\n                        </div>\n                    </div>\n                </ng-container>\n\n                <div class=\"form-group col-12 col-md-4\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.postcode.enabled\">\n                    <label class=\"field-label\">{{'postal-code'|translate}}<span\n                            *ngIf=\"this.addressingService.getTypeForm().viewForms.postcode.required\"\n                            class=\"required\">*</span></label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"postcode\"\n                        [formControl]=\"checkoutForm.controls['postcode']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.postcode.touched && checkoutForm.controls.postcode.errors?.required\">\n                        <span class=\"text-danger\">{{'postal-code-help'|translate}}</span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row mt-df\">\n                <div class=\"form-group col-12 col-md-12\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.enabled\">\n\n                    <label class=\"field-label\" *ngIf=\"!getLabelNotesParam()\">{{'notes'|translate}} <span *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.required\" class=\"required\">*</span></label>\n                    <label class=\"field-label\" *ngIf=\"getLabelNotesParam() as labelnotes\">{{labelnotes.value}} <span *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.required\" class=\"required\">*</span></label>\n\n                    <!-- <label class=\"field-label\">{{'notes'|translate}}<span *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.required\" class=\"required\">*</span></label> -->\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"notes\"\n                        [formControl]=\"checkoutForm.controls['notes']\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                </div>\n            </div>\n            <div class=\"row mt-df\">\n                <div class=\"form-group col-12 col-md-12\">\n                    <label for=\"formFact\"><b>Mismo datos de facturaci\u00F3n</b> <input type=\"checkbox\" class=\"ml-3\"\n                            [checked]=\"viewDataFacturacion\" (change)=\"showFormFacturacion()\" id=\"formFact\"></label>\n                </div>\n            </div>\n            <div class=\"row mt-df\">\n                <div class=\"col-12\">\n                    <p>\n                        <span class=\"required\">*</span>\n                        <label class=\"required text-underline\"> Campos requeridos</label>\n                    </p>\n                </div>\n            </div>\n            <div class=\"row mt-df\">\n                <div class=\"form-group col-12 col-md-12\"\n                    *ngIf=\"this.addressingService.getTypeForm().viewForms.terms.enabled\">\n                    <span *ngIf=\"this.addressingService.getTypeForm().viewForms.terms.required\"\n                        class=\"required\">*</span>\n                    <label class=\"\" for=\"\"> Acepto los t\u00E9rminos y condiciones <input class=\"\" name=\"terms\"\n                            [formControl]=\"checkoutForm.controls['terms']\" type=\"checkbox\" required\n                            (change)=\"onInputChange()\" /> </label>\n                    <a (click)=\"openModal(template)\" role=\"button\" class=\"ml-3 nota-input text-dark\">\u00BFQue es esto?</a>\n                    <div class=\"text-danger-container\"\n                        *ngIf=\"checkoutForm.controls.terms.touched && !checkoutForm.controls.terms.value\">\n                        <span class=\"text-danger\">Debe aceptar los t\u00E9rminos y condiciones para continuar.</span>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row\" *ngIf=\"viewDataFacturacion ; else datosFormFacturacion\"> </div>\n            <div class=\"checkout-btn-unique text-right mt-2\" *ngIf=\"!form_ready\">\n                <button type=\"submit\" [disabled]=\"!validado\" class=\"btn valid-btn\">{{ (allready_data ? 'update' :\n                    'ready') | translate}}</button>\n            </div>\n            <div *ngIf=\"loading\" class=\"d-flex flex-column jusitfy-content-center align-items-center\">\n                <app-loading-full-ec></app-loading-full-ec>\n            </div>\n        </form>\n    </div>\n</ng-container>\n\n<ng-template #addressSelection>\n    <div class=\"checkout-title\">\n        <h3>{{'address-selection'|translate}}</h3>\n    </div>\n    <div class=\"container\">\n        <div class=\"row\">\n            <div class=\"col-sm-6 col-12 my-3\" *ngFor=\"let item of addressBook; let i = index\">\n                <div class=\"card p-3\">\n                    <input class=\"ml-1 mt-3 form-check-input input-size-lg\"\n                    type=\"radio\" [name]=\"'n-'+i\" [id]=\"i\"\n                    [checked]=\"item.selected\" (click)=\"setSelectAddress(item)\" (change)=\"onInputChange()\">\n                    <div class=\"ml-5\">\n                        <h4 class=\"card-title\">\n                            <strong>{{'address'|translate}}</strong><br>\n                            <span class=\"text-uppercase h3\">{{item.street}}</span>\n                        </h4>\n                        <div class=\"row\">\n                            <h5 class=\"card-subtitle mb-2 text-muted col-auto\">\n                                <strong>{{'country'|translate}}</strong> {{getCountry(item.countryCode)}}\n                            </h5>\n                            <h5 class=\"card-subtitle mb-2 text-muted col-auto\">\n                                <strong>{{'state'|translate}}</strong> {{getProvince(item.provinceCode)}}\n                            </h5>\n                            <h5 class=\"card-subtitle mb-2 text-muted col-auto\">\n                                <strong>{{'town-city'|translate}}</strong> {{item.city}}\n                            </h5>\n                            <h5 class=\"card-subtitle mb-2 text-muted col-auto\">\n                                <strong>{{'postal-code'|translate}}</strong> {{item.postcode}}\n                            </h5>\n                        </div>\n                        <div class=\"row px-3\">\n                            <div class=\"card p-2 bg-light w-100\">\n                                <div class=\"card-body\">\n                                    <h5 class=\"card-title\">{{'address-contact'|translate}}</h5>\n                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                        <strong>{{'first-name'|translate}}</strong> {{item.addressContact.firstName}}\n                                    </h6>\n                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                        <strong>{{'last-name'|translate}}</strong> {{item.addressContact.lastName}}\n                                    </h6>\n                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                        <strong>{{'document-type'|translate}}</strong> {{getDocumentType(item.addressContact.documentType)}}\n                                    </h6>\n                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                        <strong>{{'document-number'|translate}}</strong> {{item.addressContact.documentNumber}}\n                                    </h6>\n                                    <h6 class=\"card-subtitle mb-2 text-muted\">\n                                        <strong>{{'email-address'|translate}}</strong> {{item.addressContact.email}}\n                                    </h6>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n\n        </div>\n\n        <div class=\"w-100\">\n            <div class=\"row mt-df\">\n                <div class=\"form-group col-12 col-md-12\">\n                    <label class=\"field-label\" *ngIf=\"!getLabelNotesParam()\" >{{'notes'|translate}}</label>\n                    <label class=\"field-label\" *ngIf=\"getLabelNotesParam() as labelnotes\" >{{labelnotes.value}}</label>\n                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"notes\"\n                        [(ngModel)]=\"this.addressBookSelected.notes\" #ctrl=\"ngModel\" value=\"\" placeholder=\"\"\n                        autocomplete=\"off\">\n                </div>\n            </div>\n        </div>\n        <div class=\"checkout-btn-unique text-right mt-2\" *ngIf=\"!form_ready\">\n            <button (click)=\"selectAddress()\" class=\"btn valid-btn\"> {{ (allready_data ? 'update' : 'ready') |\n                translate}}</button>\n        </div>\n        <div *ngIf=\"loading\" class=\"d-flex flex-column jusitfy-content-center align-items-center\">\n            <app-loading-full-ec></app-loading-full-ec>\n        </div>\n    </div>\n</ng-template>\n\n\n<ng-template #requireLoginView>\n    <div id=\"loginCheckout\">\n        <div class=\"d-flex flex-column jusitfy-content-center align-items-center\" *ngIf=\"require_login\">\n            <div class=\"col-12\">\n                <app-login-form-ec (ready)=\"verifyValidate($event)\" [redirect]=\"false\" [title]=\"'need-login'\">\n                </app-login-form-ec>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n\n\n<ng-template #datosFormFacturacion>\n    <div class=\"container-fluid\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <div class=\"card \">\n                    <div class=\"card-header text-dark text-center\">\n                        <h3>Datos de facturacion</h3>\n                    </div>\n                    <div class=\"card-body\">\n                        <form (submit)=\"verifyValidate()\">\n                            <div class=\"row mt-df\">\n                                <div class=\"form-group col-12 col-md-6\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.firstName.enabled\">\n                                    <label class=\"field-label\">{{'first-name'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.firstName.required\"\n                                            class=\"required\">*</span></label>\n                                    <input class=\"form-control\" type=\"text\" name=\"firstName\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['firstName']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.firstName.touched && checkoutFormFacturacion.controls.firstName.errors?.required\">\n                                        <span class=\"text-danger\">{{'first-name-help1'|translate}}</span>\n\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.firstName.touched && checkoutFormFacturacion.controls.firstName.errors?.pattern\">\n                                        <span class=\"text-danger\">\n                                            {{'first-name-help2'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                                <div class=\"form-group col-12 col-md-6\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.lastName.enabled\">\n                                    <label class=\"field-label\">{{'last-name'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.lastName.required\"\n                                            class=\"required\">*</span></label>\n                                    <input class=\"form-control\" type=\"text\" name=\"lastName\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['lastName']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.lastName.touched && checkoutFormFacturacion.controls.lastName.errors?.required\">\n                                        <span class=\"text-danger\">{{'last-name-help1'|translate}}</span>\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.lastName.touched && checkoutFormFacturacion.controls.lastName.errors?.pattern\">\n                                        <span class=\"text-danger\">{{'last-name-help2'|translate}}</span>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"row mt-df\">\n                                <div class=\"form-group col-12 col-md-3\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.phoneNumber.enabled\">\n                                    <label class=\"field-label\">{{'phone'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.phoneNumber.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\"\n                                        name=\"phoneNumber\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['phoneNumber']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.phoneNumber.touched && checkoutFormFacturacion.controls.phoneNumber.errors?.required\">\n                                        <span class=\"text-danger\">\n                                            {{'phone-help1'|translate}}\n                                        </span>\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.phoneNumber.touched && checkoutFormFacturacion.controls.phoneNumber.errors?.pattern\">\n                                        <span class=\"text-danger\">\n                                            {{'phone-help2'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                                <div class=\"form-group col-12 col-md-6\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.email.enabled\">\n                                    <label class=\"field-label\">{{'email-address'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.email.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"email\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['email']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.email.touched && checkoutFormFacturacion.controls.email.errors?.required\">\n                                        <span class=\"text-danger\">\n                                            {{'email-address-help1'|translate}}\n                                        </span>\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.email.touched && checkoutFormFacturacion.controls.email.errors?.email\">\n                                        <span class=\"text-danger\">\n                                            {{'email-address-help2'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                                <div class=\"form-group col-12 col-md-3\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.documentType.enabled\">\n                                    <label class=\"field-label\">{{'document-type'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.documentType.required\"\n                                            class=\"required\">*</span></label>\n                                    <select name=\"documentType\" class=\"form-control\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['documentType']\">\n                                        <option value=\"\" selected>{{'document-type'|translate}}</option>\n                                        <option\n                                            *ngFor=\"let item of this.addressingService.getTypeForm().viewForms.documentType.values\"\n                                            [value]=\"item.code\">{{item.name}}</option>\n                                    </select>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.documentType.touched && checkoutFormFacturacion.controls.documentType.errors?.required\">\n                                        <span class=\"text-danger\">\n                                            {{'type-document-help'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"row mt-df\">\n                                <div class=\"form-group col-12 col-md-4\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.documentNumber.enabled\">\n                                    <label class=\"field-label\">{{'document-number'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.documentNumber.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\"\n                                        [type]=\"(this.addressingService.typeForms == 'EUR' ? 'text' : 'number') \"\n                                        name=\"documentNumber\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['documentNumber']\" min=\"1\"\n                                        max=\"99999999999\" value=\"\" placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.documentNumber.touched && checkoutFormFacturacion.controls.documentNumber.errors?.required\">\n                                        <span class=\"text-danger\">\n                                            {{'document-number-help'|translate}}\n                                        </span>\n                                    </div>\n                                </div>\n                                <ng-container\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.countryCode.enabled\">\n\n                                    <div class=\"form-group col-12 col-md-3\"\n                                        *ngIf=\"(countriesFacturacion$ | async) as countries\">\n                                        <label class=\"field-label\">{{'country'|translate}}<span\n                                                *ngIf=\"this.addressingService.getTypeForm().viewForms.countryCode.required\"\n                                                class=\"required\">*</span></label>\n                                        <select class=\"form-control\" name=\"countryCode\"\n                                            [formControl]=\"checkoutFormFacturacion.controls['countryCode']\"\n                                            (change)=\"onCountrySelectedFacturacion($event.target.value)\">\n                                            <option selected [value]=\"null\">Seleccione un pais</option>\n                                            <option *ngFor=\"let country of countries\" [value]=\"country.code\">\n                                                {{ country.name }}</option>\n                                        </select>\n                                        <div *ngIf=\"checkoutFormFacturacion.controls.countryCode.touched && checkoutFormFacturacion.controls.countryCode.errors?.required\"\n                                            class=\"text text-danger\">\n                                            {{'country-help'|translate}}\n                                        </div>\n                                    </div>\n                                </ng-container>\n                                <div class=\"form-group col-12 col-md-5\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.street.enabled\">\n                                    <label class=\"field-label\">{{'address'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.street.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"street\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['street']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.street.touched && checkoutFormFacturacion.controls.street.errors?.required\">\n                                        <span class=\"text-danger\">{{'address-help1'|translate}}</span>\n                                    </div>\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.street.touched && checkoutFormFacturacion.controls.street.errors?.maxlength\">\n                                        <span class=\"text-danger\">{{'address-help2'|translate}}</span>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"row mt-df\">\n                                <div class=\"form-group col-12 col-md-4\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.city.enabled\">\n                                    <label class=\"field-label\">{{'town-city'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.city.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"city\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['city']\" value=\"\" placeholder=\"\"\n                                        autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.city.touched && checkoutFormFacturacion.controls.city.errors?.required\">\n                                        <span class=\"text-danger\">{{'town-city-help'|translate}}</span>\n                                    </div>\n                                </div>\n                                <ng-container\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.provinceCode.enabled\">\n\n                                    <div class=\"form-group col-12 col-md-4\"\n                                        *ngIf=\"(provincesFacturacion$ | async) as provinces\">\n                                        <label class=\"field-label\">{{'state'|translate}}<span\n                                                *ngIf=\"this.addressingService.getTypeForm().viewForms.provinceCode.required\"\n                                                class=\"required\">*</span></label>\n                                        <select class=\"form-control\" name=\"provinceCode\"\n                                            (change)=\"onProvincesSelectedFacturacion($event.target.value)\"\n                                            [formControl]=\"checkoutFormFacturacion.controls['provinceCode']\">\n                                            <option selected [value]=\"null\">Seleccione una provincia</option>\n                                            <option *ngFor=\"let province of provinces\" [value]=\"province.code\">\n                                                {{ province.name }}\n                                            </option>\n                                        </select>\n                                        <div *ngIf=\"checkoutFormFacturacion.controls.provinceCode.touched && checkoutFormFacturacion.controls.provinceCode.errors?.required\"\n                                            class=\"text text-danger\">\n                                            {{'state-help'|translate}}\n                                        </div>\n                                    </div>\n                                </ng-container>\n                                <div class=\"form-group col-12 col-md-4\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.postcode.enabled\">\n                                    <label class=\"field-label\">{{'postal-code'|translate}}<span\n                                            *ngIf=\"this.addressingService.getTypeForm().viewForms.postcode.required\"\n                                            class=\"required\">*</span></label>\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"postcode\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['postcode']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                    <div class=\"text-danger-container\"\n                                        *ngIf=\"checkoutFormFacturacion.controls.postcode.touched && checkoutFormFacturacion.controls.postcode.errors?.required\">\n                                        <span class=\"text-danger\">{{'postal-code-help'|translate}}</span>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"row mt-df\">\n                                <div class=\"form-group col-12 col-md-12\"\n                                    *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.enabled\">\n                                    <label class=\"field-label\" *ngIf=\"!getLabelNotesParam()\">{{'notes'|translate}} <span *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.required\" class=\"required\">*</span></label>\n                                    <label class=\"field-label\" *ngIf=\"getLabelNotesParam() as labelnotes\">{{labelnotes.value}} <span *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.required\" class=\"required\">*</span></label>\n                                    <!-- <label class=\"field-label\">{{'notes'|translate}}<span *ngIf=\"this.addressingService.getTypeForm().viewForms.notes.required\" class=\"required\">*</span></label> -->\n                                    <input (change)=\"onInputChange()\" class=\"form-control\" type=\"text\" name=\"notes\"\n                                        [formControl]=\"checkoutFormFacturacion.controls['notes']\" value=\"\"\n                                        placeholder=\"\" autocomplete=\"off\">\n                                </div>\n                            </div>\n                        </form>\n                    </div>\n\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n\n\n<ng-template #template>\n    <div class=\"modal-content\">\n        <div class=\"modal-header\">\n            <button type=\"button\" class=\"close pull-right\" aria-label=\"Close\" (click)=\"modalRef.hide()\">\n                <span aria-hidden=\"true\">&times;</span>\n            </button>\n        </div>\n    </div>\n\n    <div class=\"modal-body scrol-if\">\n        <app-section-container-ec [name]=\"'terminos-y-condiciones'\"> </app-section-container-ec>\n    </div>\n\n</ng-template>",
+                providers: [modal.BsModalService],
+                styles: [".mt-df{margin:10px auto 0}.required{color:red}.field-label{color:#000}.btn.valid-btn{background-color:#000;color:#fff;margin-right:-3px;margin-bottom:10px}label{color:#000}.input-size-lg{width:1.8rem;height:1.8rem}"]
             })
         ], DataFormEcComponent);
         return DataFormEcComponent;
@@ -11905,7 +11916,7 @@
                     }, 1000);
                 }
                 else {
-                    _this.bsModalRef = _this.modalService.show(_this.template, { class: 'modal-lg ', keyboard: false, backdrop: 'static', animated: true });
+                    _this.bsModalRef = _this.modalService.show(_this.template, { class: 'modal-sm modal-dialog-centered ', keyboard: false, backdrop: 'static', animated: true });
                     _this.subsModal = _this.modalService.onHide.subscribe(function (onClose) {
                         _this.bsModalRef = null;
                     });
@@ -11949,7 +11960,7 @@
         SelectChannelEcComponent = __decorate$1t([
             core.Component({
                 selector: 'select-channel-ec',
-                template: "<ng-template #template>\n    <div class=\"modal-content\">\n        <div class=\"modal-header\">\n            <h4 class=\"modal-title pull-left\">{{ 'select-channel' | translate }}</h4>\n        </div>\n        <div class=\"modal-body p-5\">\n            <div class=\"container\">\n                <div class=\"row\" *ngFor=\"let item of channels; let i = index\">\n                    <div class=\"col-1\">\n                        <input class=\"form-check-input\" type=\"radio\" [name]=\"'n-'+i\" [id]=\"i\" [checked]=\"item.selected\"\n                            (click)=\"setSelect(item)\">\n                    </div>\n                    <div class=\"col-11\">\n                        <h5 role=\"button\" (click)=\"setSelect(item)\">{{ 'channel' | translate }}: {{ item.name }}</h5>\n                    </div>\n                </div>\n            </div>\n        </div>\n        <div class=\"modal-footer\">\n            <button type=\"button\" class=\"btn btn-default\" (click)=\"setChannel()\">{{ 'continue' | translate }}</button>\n        </div>\n    </div>\n</ng-template>",
+                template: "<ng-template #template>\n    <div class=\"modal-content\" id=\"modalChanel\">\n        <div class=\"modal-header\">\n            <h5 class=\"modal-title w-100 text-center text-uppercase\">{{ 'select-channel' | translate }}</h5>\n        </div>\n        <div class=\"modal-body px-4\">\n            <div class=\"card p-3 my-2 bg-light\" *ngFor=\"let item of channels; let i = index\">\n                <div class=\"form-check\">\n                    <input class=\"form-check-input\" type=\"radio\" [name]=\"'n-'+i\" [id]=\"i\" [checked]=\"item.selected\" (click)=\"setSelect(item)\">\n                    <h5 class=\"form-check-label\" role=\"button\" (click)=\"setSelect(item)\">{{ 'channel' | translate }}: {{ item.name }}</h5>\n                </div>\n            </div>\n\n            <!-- <div class=\"row\" *ngFor=\"let item of channels; let i = index\">\n                <div class=\"col-1\">\n                    <input class=\"form-check-input\" type=\"radio\" [name]=\"'n-'+i\" [id]=\"i\" [checked]=\"item.selected\"\n                        (click)=\"setSelect(item)\">\n                </div>\n                <div class=\"col-11\">\n                    <h5 role=\"button\" (click)=\"setSelect(item)\">{{ 'channel' | translate }}: {{ item.name }}</h5>\n                </div>\n            </div> -->\n        </div>\n        <div class=\"modal-footer\">\n            <button type=\"button\" class=\"btn btn-primary px-3 py-2\" (click)=\"setChannel()\">{{ 'continue' | translate }}</button>\n        </div>\n    </div>\n</ng-template>",
                 providers: [modal.BsModalService],
                 styles: [".capitalize{text-transform:capitalize}"]
             })
@@ -12542,12 +12553,62 @@
         return ecCurrencySymbolPipe;
     }());
 
+    var __decorate$1A = (this && this.__decorate) || function (decorators, target, key, desc) {
+        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+        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 EcSanitizerHtmlPipe = /** @class */ (function () {
+        function EcSanitizerHtmlPipe(sanitizer) {
+            this.sanitizer = sanitizer;
+        }
+        EcSanitizerHtmlPipe.prototype.transform = function (value) {
+            return this.sanitizer.bypassSecurityTrustHtml(value);
+        };
+        EcSanitizerHtmlPipe.ctorParameters = function () { return [
+            { type: platformBrowser.DomSanitizer }
+        ]; };
+        EcSanitizerHtmlPipe = __decorate$1A([
+            core.Pipe({
+                name: 'ecSanitizerHtml'
+            })
+        ], EcSanitizerHtmlPipe);
+        return EcSanitizerHtmlPipe;
+    }());
+
+    var __decorate$1B = (this && this.__decorate) || function (decorators, target, key, desc) {
+        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+        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 EcSanitizerUrlPipe = /** @class */ (function () {
+        function EcSanitizerUrlPipe(sanitizer) {
+            this.sanitizer = sanitizer;
+        }
+        EcSanitizerUrlPipe.prototype.transform = function (value) {
+            return this.sanitizer.bypassSecurityTrustResourceUrl(value);
+        };
+        EcSanitizerUrlPipe.ctorParameters = function () { return [
+            { type: platformBrowser.DomSanitizer }
+        ]; };
+        EcSanitizerUrlPipe = __decorate$1B([
+            core.Pipe({
+                name: 'ecSanitizerUrl'
+            })
+        ], EcSanitizerUrlPipe);
+        return EcSanitizerUrlPipe;
+    }());
+
     //Pipes base
     var pipes = [
         ecCurrencySymbolPipe,
+        EcSanitizerHtmlPipe,
+        EcSanitizerUrlPipe
     ];
 
-    var __decorate$1A = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var __decorate$1C = (this && this.__decorate) || function (decorators, target, key, desc) {
         var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
         if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
         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;
@@ -12623,7 +12684,7 @@
             };
         };
         var NgEasycommerceModule_1;
-        NgEasycommerceModule = NgEasycommerceModule_1 = __decorate$1A([
+        NgEasycommerceModule = NgEasycommerceModule_1 = __decorate$1C([
             core.NgModule({
                 exports: [
                     OrderByPipe,
@@ -12650,6 +12711,8 @@
                     components,
                     directives,
                     pipes,
+                    EcSanitizerHtmlPipe,
+                    EcSanitizerUrlPipe,
                 ],
                 providers: []
             })
@@ -12692,7 +12755,7 @@
     // // Others
     // { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true }
 
-    var __decorate$1B = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var __decorate$1D = (this && this.__decorate) || function (decorators, target, key, desc) {
         var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
         if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
         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;
@@ -12740,7 +12803,7 @@
             { type: ConnectionService }
         ]; };
         GiftCardService$1.ɵprov = core.ɵɵdefineInjectable({ factory: function GiftCardService_Factory() { return new GiftCardService(core.ɵɵinject(Constants), core.ɵɵinject(CartService), core.ɵɵinject(ConnectionService)); }, token: GiftCardService, providedIn: "root" });
-        GiftCardService$1 = __decorate$1B([
+        GiftCardService$1 = __decorate$1D([
             core.Injectable({
                 providedIn: 'root'
             })
@@ -12748,7 +12811,7 @@
         return GiftCardService$1;
     }());
 
-    var __decorate$1C = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var __decorate$1E = (this && this.__decorate) || function (decorators, target, key, desc) {
         var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
         if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
         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;
@@ -12804,7 +12867,7 @@
             { type: ngxToastr.ToastrService }
         ]; };
         WishlistService$1.ɵprov = core.ɵɵdefineInjectable({ factory: function WishlistService_Factory() { return new WishlistService(core.ɵɵinject(ngxToastr.ToastrService)); }, token: WishlistService, providedIn: "root" });
-        WishlistService$1 = __decorate$1C([
+        WishlistService$1 = __decorate$1E([
             core.Injectable({
                 providedIn: 'root'
             })
@@ -12812,7 +12875,7 @@
         return WishlistService$1;
     }());
 
-    var __decorate$1D = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var __decorate$1F = (this && this.__decorate) || function (decorators, target, key, desc) {
         var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
         if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
         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;
@@ -12847,7 +12910,7 @@
         StandardReuseStrategy.ctorParameters = function () { return [
             { type: undefined, decorators: [{ type: core.Inject, args: ['env',] }] }
         ]; };
-        StandardReuseStrategy = __decorate$1D([
+        StandardReuseStrategy = __decorate$1F([
             core.Injectable(),
             __param$b(0, core.Inject('env'))
         ], StandardReuseStrategy);
@@ -12894,6 +12957,8 @@
     exports.DataformService = DataformService;
     exports.DetailCheckoutBlockEcComponent = DetailCheckoutBlockEcComponent;
     exports.DynamicsFilter = DynamicsFilter;
+    exports.EcSanitizerHtmlPipe = EcSanitizerHtmlPipe;
+    exports.EcSanitizerUrlPipe = EcSanitizerUrlPipe;
     exports.FaqsContentEcComponent = FaqsContentEcComponent;
     exports.Filter = Filter;
     exports.FiltersEcComponent = FiltersEcComponent;