vk-payments 0.1.2 → 0.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/vk-payments.umd.js +17 -155
- package/bundles/vk-payments.umd.js.map +1 -1
- package/bundles/vk-payments.umd.min.js +1 -1
- package/bundles/vk-payments.umd.min.js.map +1 -1
- package/esm2015/lib/go-cuotas/components/go-cuotas.component.js +17 -52
- package/esm2015/lib/go-cuotas/services/go-cuotas.api.service.js +1 -50
- package/esm5/lib/go-cuotas/components/go-cuotas.component.js +17 -61
- package/esm5/lib/go-cuotas/services/go-cuotas.api.service.js +2 -96
- package/fesm2015/vk-payments.js +16 -100
- package/fesm2015/vk-payments.js.map +1 -1
- package/fesm5/vk-payments.js +17 -155
- package/fesm5/vk-payments.js.map +1 -1
- package/lib/go-cuotas/components/go-cuotas.component.d.ts +0 -2
- package/lib/go-cuotas/services/go-cuotas.api.service.d.ts +1 -3
- package/package.json +1 -1
- package/vk-payments.metadata.json +1 -1
|
@@ -2628,62 +2628,13 @@
|
|
|
2628
2628
|
}
|
|
2629
2629
|
return url;
|
|
2630
2630
|
};
|
|
2631
|
-
// public sendCode(access_token: string, url: string, initPayment: InitPayment): Observable<InitPaymentResponse> {
|
|
2632
|
-
// this._setAuthHeaders(access_token);
|
|
2633
|
-
// const body = {
|
|
2634
|
-
// cardholder: initPayment.cardholder,
|
|
2635
|
-
// creditCardHash: initPayment.creditCardHash,
|
|
2636
|
-
// amount: initPayment.amount,
|
|
2637
|
-
// installments: initPayment.installments,
|
|
2638
|
-
// documentNumber: initPayment.documentNumber,
|
|
2639
|
-
// areaCode: initPayment.areaCode,
|
|
2640
|
-
// phoneNumber: initPayment.phoneNumber,
|
|
2641
|
-
// idVen: initPayment.idVen,
|
|
2642
|
-
// storeId: initPayment.storeId,
|
|
2643
|
-
// data: initPayment.data
|
|
2644
|
-
// };
|
|
2645
|
-
// return this.httpClient.post<InitPaymentResponse>(this.normalizeUrl(url) + '/send_code', body, { headers: this.authHeaders });
|
|
2646
|
-
// }
|
|
2647
|
-
// public sendCode(access_token: string, url: string, initPayment: InitPayment): Observable<InitPaymentResponse> {
|
|
2648
|
-
// this._setAuthHeaders(access_token);
|
|
2649
|
-
// const body = {
|
|
2650
|
-
// cardholder: initPayment.cardholder,
|
|
2651
|
-
// creditCardHash: initPayment.creditCardHash,
|
|
2652
|
-
// amount: initPayment.amount,
|
|
2653
|
-
// installments: initPayment.installments,
|
|
2654
|
-
// documentNumber: initPayment.documentNumber,
|
|
2655
|
-
// areaCode: initPayment.areaCode,
|
|
2656
|
-
// phoneNumber: initPayment.phoneNumber,
|
|
2657
|
-
// idVen: initPayment.idVen,
|
|
2658
|
-
// storeId: initPayment.storeId,
|
|
2659
|
-
// data: initPayment.data
|
|
2660
|
-
// };
|
|
2661
|
-
// return this.httpClient.post<InitPaymentResponse>(this.normalizeUrl(url) + '/send_code', body, { headers: this.authHeaders });
|
|
2662
|
-
// }
|
|
2663
2631
|
/**
|
|
2664
2632
|
* @param {?} access_token
|
|
2665
2633
|
* @param {?} url
|
|
2666
2634
|
* @param {?} initPayment
|
|
2667
2635
|
* @return {?}
|
|
2668
2636
|
*/
|
|
2669
|
-
GoCuotasApiService.prototype.initPayment =
|
|
2670
|
-
// public sendCode(access_token: string, url: string, initPayment: InitPayment): Observable<InitPaymentResponse> {
|
|
2671
|
-
// this._setAuthHeaders(access_token);
|
|
2672
|
-
// const body = {
|
|
2673
|
-
// cardholder: initPayment.cardholder,
|
|
2674
|
-
// creditCardHash: initPayment.creditCardHash,
|
|
2675
|
-
// amount: initPayment.amount,
|
|
2676
|
-
// installments: initPayment.installments,
|
|
2677
|
-
// documentNumber: initPayment.documentNumber,
|
|
2678
|
-
// areaCode: initPayment.areaCode,
|
|
2679
|
-
// phoneNumber: initPayment.phoneNumber,
|
|
2680
|
-
// idVen: initPayment.idVen,
|
|
2681
|
-
// storeId: initPayment.storeId,
|
|
2682
|
-
// data: initPayment.data
|
|
2683
|
-
// };
|
|
2684
|
-
// return this.httpClient.post<InitPaymentResponse>(this.normalizeUrl(url) + '/send_code', body, { headers: this.authHeaders });
|
|
2685
|
-
// }
|
|
2686
|
-
/**
|
|
2637
|
+
GoCuotasApiService.prototype.initPayment = /**
|
|
2687
2638
|
* @param {?} access_token
|
|
2688
2639
|
* @param {?} url
|
|
2689
2640
|
* @param {?} initPayment
|
|
@@ -2706,27 +2657,6 @@
|
|
|
2706
2657
|
};
|
|
2707
2658
|
return this.httpClient.post(this.normalizeUrl(url) + '/init-payment', body, { headers: this.authHeaders });
|
|
2708
2659
|
};
|
|
2709
|
-
/**
|
|
2710
|
-
* @param {?} access_token
|
|
2711
|
-
* @param {?} url
|
|
2712
|
-
* @param {?} verificationCodeRequest
|
|
2713
|
-
* @return {?}
|
|
2714
|
-
*/
|
|
2715
|
-
GoCuotasApiService.prototype.verificationCode = /**
|
|
2716
|
-
* @param {?} access_token
|
|
2717
|
-
* @param {?} url
|
|
2718
|
-
* @param {?} verificationCodeRequest
|
|
2719
|
-
* @return {?}
|
|
2720
|
-
*/
|
|
2721
|
-
function (access_token, url, verificationCodeRequest) {
|
|
2722
|
-
this._setAuthHeaders(access_token);
|
|
2723
|
-
/** @type {?} */
|
|
2724
|
-
var body = {
|
|
2725
|
-
code: verificationCodeRequest.code,
|
|
2726
|
-
sale_token: verificationCodeRequest.sale_token
|
|
2727
|
-
};
|
|
2728
|
-
return this.httpClient.post(this.normalizeUrl(url) + '/code_verification', body, { headers: this.authHeaders });
|
|
2729
|
-
};
|
|
2730
2660
|
/**
|
|
2731
2661
|
* @param {?} access_token
|
|
2732
2662
|
* @param {?} url
|
|
@@ -2741,30 +2671,6 @@
|
|
|
2741
2671
|
this._setAuthHeaders(access_token);
|
|
2742
2672
|
return this.httpClient.get(this.normalizeUrl(url) + '/orders', { headers: this.authHeaders });
|
|
2743
2673
|
};
|
|
2744
|
-
/**
|
|
2745
|
-
* @param {?} access_token
|
|
2746
|
-
* @param {?} url
|
|
2747
|
-
* @param {?} cardRequest
|
|
2748
|
-
* @return {?}
|
|
2749
|
-
*/
|
|
2750
|
-
GoCuotasApiService.prototype.addOrUpdateCard = /**
|
|
2751
|
-
* @param {?} access_token
|
|
2752
|
-
* @param {?} url
|
|
2753
|
-
* @param {?} cardRequest
|
|
2754
|
-
* @return {?}
|
|
2755
|
-
*/
|
|
2756
|
-
function (access_token, url, cardRequest) {
|
|
2757
|
-
this._setAuthHeaders(access_token);
|
|
2758
|
-
/** @type {?} */
|
|
2759
|
-
var body = {
|
|
2760
|
-
sale_token: cardRequest.sale_token,
|
|
2761
|
-
number: cardRequest.number,
|
|
2762
|
-
expiration_month: cardRequest.expiration_month,
|
|
2763
|
-
expiration_year: cardRequest.expiration_year,
|
|
2764
|
-
security_code: cardRequest.security_code
|
|
2765
|
-
};
|
|
2766
|
-
return this.httpClient.post(this.normalizeUrl(url) + '/cards', body, { headers: this.authHeaders });
|
|
2767
|
-
};
|
|
2768
2674
|
/**
|
|
2769
2675
|
* @param {?} access_token
|
|
2770
2676
|
* @param {?} url
|
|
@@ -3077,7 +2983,7 @@
|
|
|
3077
2983
|
{ value: 3, label: '3 Cuotas' },
|
|
3078
2984
|
{ value: 4, label: '4 Cuotas' }
|
|
3079
2985
|
]; // Opciones para "Cantidad de cuotas"
|
|
3080
|
-
this.totalAmount = Number(this.paymentAmount)
|
|
2986
|
+
this.totalAmount = Number(this.paymentAmount);
|
|
3081
2987
|
};
|
|
3082
2988
|
/**
|
|
3083
2989
|
* @param {?} event
|
|
@@ -3098,7 +3004,7 @@
|
|
|
3098
3004
|
this.loadingMessage = 'Iniciando el pago...';
|
|
3099
3005
|
this.paymentResult = { success: false, paymentId: '', integrator: 'GOCUOTAS' };
|
|
3100
3006
|
this.OinitPayment = {
|
|
3101
|
-
amount: Number(this.paymentAmount),
|
|
3007
|
+
amount: Number(this.paymentAmount) * 100,
|
|
3102
3008
|
areaCode: this.codAreaText,
|
|
3103
3009
|
installments: this.installments,
|
|
3104
3010
|
documentNumber: this.dniText,
|
|
@@ -3146,7 +3052,6 @@
|
|
|
3146
3052
|
*/
|
|
3147
3053
|
function (response) {
|
|
3148
3054
|
if (!response.success) {
|
|
3149
|
-
console.log(response.errorsMessages);
|
|
3150
3055
|
this.error_message = response.errorsMessages[0];
|
|
3151
3056
|
return;
|
|
3152
3057
|
}
|
|
@@ -3221,65 +3126,22 @@
|
|
|
3221
3126
|
this.hasError = true;
|
|
3222
3127
|
return;
|
|
3223
3128
|
}
|
|
3224
|
-
if
|
|
3225
|
-
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
|
|
3229
|
-
}
|
|
3230
|
-
if
|
|
3231
|
-
|
|
3232
|
-
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
}
|
|
3129
|
+
// if(!response.error.data.code_successfully_sent && this.paymentStatus === 'sentCode') {
|
|
3130
|
+
// this.error_message = response.error.errorsMessages[0];
|
|
3131
|
+
// this.isLoading = false;
|
|
3132
|
+
// this.hasError = true;
|
|
3133
|
+
// return;
|
|
3134
|
+
// }
|
|
3135
|
+
// if(!response.error.data.code_successfully_verified && this.paymentStatus === 'ok') {
|
|
3136
|
+
// this.notificationService.showError(response.error.errorsMessages[0], 'ERROR: ')
|
|
3137
|
+
// this.isLoading = false;
|
|
3138
|
+
// this.modal.openModal();
|
|
3139
|
+
// return;
|
|
3140
|
+
// }
|
|
3236
3141
|
this.error_message = response.error.errorsMessages[0];
|
|
3237
3142
|
this.isLoading = false;
|
|
3238
3143
|
this.hasError = true;
|
|
3239
3144
|
};
|
|
3240
|
-
/**
|
|
3241
|
-
* @return {?}
|
|
3242
|
-
*/
|
|
3243
|
-
GoCuotasComponent.prototype.addOrUpdateCard = /**
|
|
3244
|
-
* @return {?}
|
|
3245
|
-
*/
|
|
3246
|
-
function () {
|
|
3247
|
-
var _this = this;
|
|
3248
|
-
this.cardRequest = {
|
|
3249
|
-
sale_token: this.sale_token,
|
|
3250
|
-
number: Number(this.cardText),
|
|
3251
|
-
expiration_month: Number(this.monthText),
|
|
3252
|
-
expiration_year: Number(this.yearText),
|
|
3253
|
-
security_code: Number(this.cvcText)
|
|
3254
|
-
};
|
|
3255
|
-
this.goCuotasApiService.addOrUpdateCard(this.accessToken, this.vkUrlApi, this.cardRequest)
|
|
3256
|
-
.subscribe({
|
|
3257
|
-
next: (/**
|
|
3258
|
-
* @param {?} v
|
|
3259
|
-
* @return {?}
|
|
3260
|
-
*/
|
|
3261
|
-
function (v) { return _this.AddOrUpdateCardResponseHandler(v); }),
|
|
3262
|
-
error: (/**
|
|
3263
|
-
* @param {?} v
|
|
3264
|
-
* @return {?}
|
|
3265
|
-
*/
|
|
3266
|
-
function (v) { return _this.ResponseHandlerError(v); })
|
|
3267
|
-
});
|
|
3268
|
-
};
|
|
3269
|
-
/**
|
|
3270
|
-
* @private
|
|
3271
|
-
* @param {?} response
|
|
3272
|
-
* @return {?}
|
|
3273
|
-
*/
|
|
3274
|
-
GoCuotasComponent.prototype.AddOrUpdateCardResponseHandler = /**
|
|
3275
|
-
* @private
|
|
3276
|
-
* @param {?} response
|
|
3277
|
-
* @return {?}
|
|
3278
|
-
*/
|
|
3279
|
-
function (response) {
|
|
3280
|
-
this.loadingMessage = 'Registrando tarjeta...';
|
|
3281
|
-
console.log(response);
|
|
3282
|
-
};
|
|
3283
3145
|
/**
|
|
3284
3146
|
* @private
|
|
3285
3147
|
* @param {?} response
|
|
@@ -3542,8 +3404,8 @@
|
|
|
3542
3404
|
GoCuotasComponent.decorators = [
|
|
3543
3405
|
{ type: core.Component, args: [{
|
|
3544
3406
|
selector: 'lib-go-cuotas',
|
|
3545
|
-
template: "<div *ngIf=\"isLoading\" class=\"loading-overlay\">\n <div class=\"loading-message\">\n <p>{{ loadingMessage }}</p>\n <div *ngIf=\"!paymentCompleted\" class=\"spinner\"></div>\n <div *ngIf=\"paymentCompleted\" class=\"success-icon\">\u2714\uFE0F</div>\n </div>\n</div>\n\n<div *ngIf=\"hasError\" class=\"error-overlay\">\n <div class=\"error-message\">\n <p>{{ error_message }}</p>\n <button (click)=\"restartForm()\">Reintentar</button>\n </div>\n</div>\n\n<form\n (ngSubmit)=\"onSubmit($event)\"\n class=\"gc-payment\"\n id=\"formulario\"\n #f=\"ngForm\"\n autocomplete=\"off\"\n>\n <div class=\"formRow\">\n <label for=\"cardholderName\">
|
|
3546
|
-
styles: ["@charset \"UTF-8\";.gc-payment{background-color:transparent;font-family:inherit,sans-serif}.gc-payment label{font-size:14px;color:#888}.formRow{margin-top:10px}:focus{outline:0}.form-row-2col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-2col .formRow{width:49%;margin-top:0}.form-row-3col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-3col .formRow{width:32%;margin-top:0}span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:15px;height:23px;width:100%;text-transform:uppercase;vertical-align:top}select{width:100%;font-size:15px;height:30px;padding:2px 10px;border:.5px solid #707070;border-radius:2px;display:block;margin-top:4px;-webkit-appearance:none;-moz-appearance:none;position:relative;z-index:1;background:0 0}select:focus{background-color:#e0e0e0;border-color:#009ee3;outline:0}option[disabled]{color:#bbb;font-weight:400}.select-icon{position:relative}.select-icon::after{content:\"\uE5CF\";font-family:\"Material Icons\";position:absolute;right:0;top:3px;font-size:24px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:13px;color:#009ee3;margin-top:7px;margin-bottom:0}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:2000;display:flex;justify-content:center;align-items:center;color:#fff}.loading-message{display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center}.spinner{border:4px solid rgba(255,255,255,.2);border-left-color:#fff;border-radius:50%;width:40px;height:40px;-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}@-webkit-keyframes spin{to{transform:rotate(360deg)}}@keyframes spin{to{transform:rotate(360deg)}}.error-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:2000;display:flex;justify-content:center;align-items:center;color:#fff}.error-message{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem;max-width:600px}.error-message p{font-size:1.2rem}.error-message button{background-color:#ff4d4d;color:#fff;border:none;padding:.5rem 1rem;font-size:1rem;border-radius:5px;cursor:pointer;min-width:250px;max-width:250px}.error-message button:hover{background-color:#f33}.success-icon{font-size:3rem;color:#4caf50;margin-bottom:1rem}"]
|
|
3407
|
+
template: "<div *ngIf=\"isLoading\" class=\"loading-overlay\">\n <div class=\"loading-message\">\n <p>{{ loadingMessage }}</p>\n <div *ngIf=\"!paymentCompleted\" class=\"spinner\"></div>\n <div *ngIf=\"paymentCompleted\" class=\"success-icon\">\u2714\uFE0F</div>\n </div>\n</div>\n\n<div *ngIf=\"hasError\" class=\"error-overlay\">\n <div class=\"error-message\">\n <p>{{ error_message }}</p>\n <button (click)=\"restartForm()\">Reintentar</button>\n </div>\n</div>\n\n<form\n (ngSubmit)=\"onSubmit($event)\"\n class=\"gc-payment\"\n id=\"formulario\"\n #f=\"ngForm\"\n autocomplete=\"off\"\n>\n <div class=\"formRow\">\n <label for=\"cardholderName\">Nombre y Apellido impreso en la tarjeta</label>\n <span>\n <input\n id=\"cardholderName\"\n type=\"text\"\n name=\"cardholderName\"\n required\n maxlength=\"22\"\n data-checkout=\"cardholderName\"\n [disabled]=\"disabled\"\n (paste)=\"onPaste()\"\n (input)=\"onPayerNameChange()\"\n [(ngModel)]=\"defaultName\"\n pattern=\"^[a-zA-Z\\s]+$\"\n #cardholderName=\"ngModel\"\n />\n </span>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardholderName.valid && submitted\">\n Ingres\u00E1 el nombre completo que figura en la tarjeta.\n </p>\n </div>\n\n <div class=\"formRow\">\n <div class=\"form-row-2col\">\n\n <!-- Tipo de documento-->\n <div class=\"formRow\">\n <label for=\"docType\">Tipo Doc.</label>\n <div class=\"select-icon\">\n <select id=\"docType\" name=\"docType\" data-checkout=\"docType\" required ngModel [disabled]=\"disabled\"\n [(ngModel)]=\"defaultDocType\" #docType=\"ngModel\">\n <option value=\"\" disabled selected>Sin Seleccionar...</option>\n <option value=\"dni\">DNI</option>\n <option value=\"cuil\">CUIL</option>\n </select> \n </div>\n </div>\n\n <!-- DNI -->\n <div class=\"formRow\">\n <label for=\"docNumber\">N\u00BA de Doc.</label>\n <span>\n <input id=\"docNumber\" type=\"text\" name=\"docNumber\" data-checkout=\"docNumber\" minlength=\"7\" maxlength=\"8\"\n required [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onDniChange()\" [(ngModel)]=\"dniText\"\n #docNumber=\"ngModel\" />\n </span>\n </div>\n\n </div>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!docNumber.valid && submitted\">\n Complet\u00E1 el n\u00FAmero de documento.\n </p>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!docType.valid && submitted\">\n Seleccion\u00E1 el tipo de documento.\n </p>\n </div>\n\n <!-- Numero de tarjeta -->\n <div class=\"formRow\">\n <label for=\"cardNumber\">N\u00FAmero de Tarjeta</label>\n <span>\n <input\n id=\"cardNumber\"\n type=\"text\"\n name=\"cardNumber\"\n data-checkout=\"cardNumber\"\n maxlength=\"19\"\n required\n thumbnail\n (input)=\"onCardChange()\"\n (paste)=\"onPaste()\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"cardText\"\n #cardNumber=\"ngModel\"\n />\n </span>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardNumber.valid && submitted\">\n Ingres\u00E1 el n\u00FAmero de tarjeta.\n </p>\n </div>\n\n <div class=\"form-row-3col\">\n <!-- Expiry-month-->\n <div class=\"formRow\">\n <label for=\"cardExpirationMonth\">Mes de expiraci\u00F3n</label>\n <span>\n <input\n id=\"cardExpirationMonth\"\n type=\"text\"\n name=\"cardExpirationMonth\"\n placeholder=\"MM\"\n minlength=\"2\"\n maxlength=\"2\"\n data-checkout=\"cardExpirationMonth\"\n required\n [disabled]=\"disabled\"\n (paste)=\"onPaste()\"\n (input)=\"onMonthChange()\"\n (focusout)=\"onMonthLostFocus()\"\n [(ngModel)]=\"monthText\"\n #cardExpirationMonth=\"ngModel\"\n />\n </span>\n </div>\n\n <!-- Expiry-year-->\n <div class=\"formRow\">\n <label for=\"cardExpirationYear\">A\u00F1o de expiraci\u00F3n</label>\n <span>\n <input\n id=\"cardExpirationYear\"\n type=\"text\"\n name=\"cardExpirationYear\"\n placeholder=\"AA\"\n minlength=\"2\"\n maxlength=\"2\"\n data-checkout=\"cardExpirationYear\"\n required\n [disabled]=\"disabled\"\n (paste)=\"onPaste()\"\n (input)=\"onYearChange()\"\n [(ngModel)]=\"yearText\"\n #cardExpirationYear=\"ngModel\"\n />\n </span>\n </div>\n\n <!-- CVC -->\n <div class=\"formRow\">\n <label for=\"securityCode\">C\u00F3digo de seguridad</label>\n <span>\n <input\n id=\"securityCode\"\n type=\"text\"\n name=\"securityCode\"\n placeholder=\"CSC\"\n minlength=\"3\"\n maxlength=\"4\"\n data-checkout=\"securityCode\"\n required\n [disabled]=\"disabled\"\n (paste)=\"onPaste()\"\n (input)=\"onCodeChange()\"\n [(ngModel)]=\"cvcText\"\n #securityCode=\"ngModel\"\n />\n </span>\n </div>\n </div>\n\n <div>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardExpirationMonth.valid && submitted\">\n Complet\u00E1 el mes de vencimiento.\n </p>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardExpirationYear.valid && submitted\">\n Complet\u00E1 el a\u00F1o de vencimiento.\n </p>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!securityCode.valid && submitted\">\n Ingres\u00E1 el c\u00F3digo de seguridad.\n </p>\n </div>\n\n <!--Cantidad de cuotas-->\n <div class=\"formRow\">\n <label for=\"installments\">Cuotas</label>\n <div class=\"select-icon\">\n <select id=\"installments\" name=\"installments\" aria-required=\"true\" required ngModel\n [(ngModel)]=\"installments\" (change)=\"onInstallmentsChange()\" [disabled]=\"disabled\" #inst=\"ngModel\">\n <option value=\"0\" disabled selected>Sin Seleccionar...</option>\n <option *ngFor=\"let current of currentInstallments\" [value]=\"current.value\">\n {{ current.label }}\n </option>\n </select>\n </div>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!inst.valid && submitted\">\n Eleg\u00ED la cantidad de cuotas.\n </p>\n </div>\n\n <div class=\"formRow\">\n <div class=\"form-row-3col\">\n\n <!-- Correo electr\u00F3nico -->\n <div class=\"formRow\">\n <label for=\"mail\">Correo electr\u00F3nico</label>\n <span>\n <input id=\"mail\" type=\"text\" name=\"mail\" data-checkout=\"mail\" pattern=\"^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$\"\n required [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onMailChange()\" [(ngModel)]=\"mailText\"\n #mail=\"ngModel\"/>\n </span>\n </div>\n\n <!-- C\u00F3digo de \u00E1rea -->\n <div class=\"formRow\">\n <label for=\"codArea\">Cod. \u00C1rea</label>\n <span>\n <input id=\"codArea\" type=\"text\" name=\"codArea\" data-checkout=\"codArea\" minlength=\"2\" maxlength=\"4\"\n required [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onCodAreaChange()\" [(ngModel)]=\"codAreaText\"\n #codArea=\"ngModel\" />\n </span>\n </div>\n\n <!-- Tel\u00E9fono -->\n <div class=\"formRow\">\n <label for=\"tel\">Tel\u00E9fono</label>\n <span>\n <input id=\"tel\" type=\"text\" name=\"tel\" data-checkout=\"tel\" minlength=\"6\" maxlength=\"8\"\n required [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onTelChange()\" [(ngModel)]=\"telText\"\n #tel=\"ngModel\" />\n </span>\n </div>\n\n </div>\n </div>\n\n <div>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!mail.valid && submitted\">\n Complet\u00E1 el correo electr\u00F3nico.\n </p>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!codArea.valid && submitted\">\n Complet\u00E1 el c\u00F3digo de \u00E1rea.\n </p>\n <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!tel.valid && submitted\">\n Ingres\u00E1 el tel\u00E9fono.\n </p>\n </div>\n\n <button type=\"submit\">Pagar ${{ totalAmount }}</button>\n</form>\n\n<div class=\"logo\">\n <img [src]=\"logoGC\" alt=\"Go Cuotas\" class=\"responsive-img\" style=\"width: 150px;\">\n</div>\n\n<lib-modal (codeVerified)=\"onCodeSent($event)\"></lib-modal>",
|
|
3408
|
+
styles: ["@charset \"UTF-8\";.gc-payment{background-color:transparent;font-family:inherit,sans-serif}.gc-payment label{font-size:14px;color:#888}.formRow{margin-top:10px}:focus{outline:0}.form-row-2col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-2col .formRow{width:49%;margin-top:0}.form-row-3col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-3col .formRow{width:32%;margin-top:0}span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:15px;height:23px;width:100%;text-transform:uppercase;vertical-align:top}select{width:100%;font-size:15px;height:30px;padding:2px 10px;border:.5px solid #707070;border-radius:2px;display:block;margin-top:4px;-webkit-appearance:none;-moz-appearance:none;position:relative;z-index:1;background:0 0}select:focus{background-color:#e0e0e0;border-color:#009ee3;outline:0}option[disabled]{color:#bbb;font-weight:400}.select-icon{position:relative}.select-icon::after{content:\"\uE5CF\";font-family:\"Material Icons\";position:absolute;right:0;top:3px;font-size:24px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:13px;color:#009ee3;margin-top:7px;margin-bottom:0}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:2000;display:flex;justify-content:center;align-items:center;color:#fff}.loading-message{display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center}.spinner{border:4px solid rgba(255,255,255,.2);border-left-color:#fff;border-radius:50%;width:40px;height:40px;-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}@-webkit-keyframes spin{to{transform:rotate(360deg)}}@keyframes spin{to{transform:rotate(360deg)}}.error-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:2000;display:flex;justify-content:center;align-items:center;color:#fff}.error-message{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem;max-width:600px}.error-message p{font-size:1.2rem}.error-message button{background-color:#ff4d4d;color:#fff;border:none;padding:.5rem 1rem;font-size:1rem;border-radius:5px;cursor:pointer;min-width:250px;max-width:250px}.error-message button:hover{background-color:#f33}.success-icon{font-size:3rem;color:#4caf50;margin-bottom:1rem}.logo{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;padding-top:10px}"]
|
|
3547
3409
|
}] }
|
|
3548
3410
|
];
|
|
3549
3411
|
/** @nocollapse */
|