vk-payments 0.2.29 → 0.2.30
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 +67 -28
- 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/bank-transfer/components/bank-transfer.component.js +53 -26
- package/esm5/lib/bank-transfer/components/bank-transfer.component.js +69 -30
- package/fesm2015/vk-payments.js +52 -25
- package/fesm2015/vk-payments.js.map +1 -1
- package/fesm5/vk-payments.js +68 -29
- package/fesm5/vk-payments.js.map +1 -1
- package/lib/bank-transfer/components/bank-transfer.component.d.ts +6 -0
- package/package.json +1 -1
- package/vk-payments.metadata.json +1 -1
|
@@ -3970,26 +3970,48 @@
|
|
|
3970
3970
|
var BankTransferComponent = /** @class */ (function () {
|
|
3971
3971
|
function BankTransferComponent(bankTransferApi) {
|
|
3972
3972
|
this.bankTransferApi = bankTransferApi;
|
|
3973
|
+
this.discountRate = 0.10; // Tasa de descuento (10% por defecto)
|
|
3974
|
+
// Tasa de descuento (10% por defecto)
|
|
3973
3975
|
this.statusPay = new core.EventEmitter();
|
|
3974
3976
|
this.isLoading = false;
|
|
3975
3977
|
this.errorMessage = '';
|
|
3978
|
+
this.submittedSuccessfully = false;
|
|
3979
|
+
this.amountCopied = false;
|
|
3980
|
+
// CUIT no se pide al usuario por ahora — se envía valor genérico
|
|
3976
3981
|
this.paymentForm = new forms.FormGroup({
|
|
3977
|
-
cuit: new forms.FormControl(''
|
|
3978
|
-
forms.Validators.required,
|
|
3979
|
-
forms.Validators.minLength(11),
|
|
3980
|
-
forms.Validators.maxLength(11),
|
|
3981
|
-
forms.Validators.pattern('^[0-9]*$')
|
|
3982
|
-
]),
|
|
3982
|
+
cuit: new forms.FormControl('00000000000')
|
|
3983
3983
|
});
|
|
3984
3984
|
}
|
|
3985
|
+
Object.defineProperty(BankTransferComponent.prototype, "subtotalAmount", {
|
|
3986
|
+
// Calculados a partir de `amount` (que ya tiene el descuento aplicado)
|
|
3987
|
+
get:
|
|
3988
|
+
// Calculados a partir de `amount` (que ya tiene el descuento aplicado)
|
|
3989
|
+
/**
|
|
3990
|
+
* @return {?}
|
|
3991
|
+
*/
|
|
3992
|
+
function () {
|
|
3993
|
+
return this.amount ? Math.round(this.amount / (1 - this.discountRate)) : 0;
|
|
3994
|
+
},
|
|
3995
|
+
enumerable: true,
|
|
3996
|
+
configurable: true
|
|
3997
|
+
});
|
|
3998
|
+
Object.defineProperty(BankTransferComponent.prototype, "discountAmount", {
|
|
3999
|
+
get: /**
|
|
4000
|
+
* @return {?}
|
|
4001
|
+
*/
|
|
4002
|
+
function () {
|
|
4003
|
+
return this.subtotalAmount - (this.amount || 0);
|
|
4004
|
+
},
|
|
4005
|
+
enumerable: true,
|
|
4006
|
+
configurable: true
|
|
4007
|
+
});
|
|
3985
4008
|
/**
|
|
3986
4009
|
* @return {?}
|
|
3987
4010
|
*/
|
|
3988
4011
|
BankTransferComponent.prototype.ngOnInit = /**
|
|
3989
4012
|
* @return {?}
|
|
3990
4013
|
*/
|
|
3991
|
-
function () {
|
|
3992
|
-
};
|
|
4014
|
+
function () { };
|
|
3993
4015
|
/**
|
|
3994
4016
|
* @param {?} text
|
|
3995
4017
|
* @return {?}
|
|
@@ -4003,7 +4025,6 @@
|
|
|
4003
4025
|
* @return {?}
|
|
4004
4026
|
*/
|
|
4005
4027
|
function () {
|
|
4006
|
-
// fallback para browsers sin clipboard API
|
|
4007
4028
|
/** @type {?} */
|
|
4008
4029
|
var el = document.createElement('textarea');
|
|
4009
4030
|
el.value = text;
|
|
@@ -4013,6 +4034,23 @@
|
|
|
4013
4034
|
document.body.removeChild(el);
|
|
4014
4035
|
}));
|
|
4015
4036
|
};
|
|
4037
|
+
/**
|
|
4038
|
+
* @return {?}
|
|
4039
|
+
*/
|
|
4040
|
+
BankTransferComponent.prototype.copyAmount = /**
|
|
4041
|
+
* @return {?}
|
|
4042
|
+
*/
|
|
4043
|
+
function () {
|
|
4044
|
+
var _this = this;
|
|
4045
|
+
/** @type {?} */
|
|
4046
|
+
var amountStr = this.amount ? this.amount.toFixed(2) : '0';
|
|
4047
|
+
this.copyToClipboard(amountStr);
|
|
4048
|
+
this.amountCopied = true;
|
|
4049
|
+
setTimeout((/**
|
|
4050
|
+
* @return {?}
|
|
4051
|
+
*/
|
|
4052
|
+
function () { return _this.amountCopied = false; }), 2000);
|
|
4053
|
+
};
|
|
4016
4054
|
/**
|
|
4017
4055
|
* @return {?}
|
|
4018
4056
|
*/
|
|
@@ -4021,19 +4059,14 @@
|
|
|
4021
4059
|
*/
|
|
4022
4060
|
function () {
|
|
4023
4061
|
var _this = this;
|
|
4024
|
-
if (this.
|
|
4025
|
-
this.paymentForm.markAllAsTouched();
|
|
4062
|
+
if (this.submittedSuccessfully || this.isLoading)
|
|
4026
4063
|
return;
|
|
4027
|
-
}
|
|
4028
4064
|
this.isLoading = true;
|
|
4029
4065
|
this.errorMessage = '';
|
|
4030
4066
|
/** @type {?} */
|
|
4031
|
-
var cuitControl = this.paymentForm.get('cuit');
|
|
4032
|
-
/** @type {?} */
|
|
4033
|
-
var cuitValue = cuitControl ? cuitControl.value : '';
|
|
4034
|
-
/** @type {?} */
|
|
4035
4067
|
var request = {
|
|
4036
|
-
cuit:
|
|
4068
|
+
cuit: '00000000000',
|
|
4069
|
+
// Valor genérico mientras no se pide al usuario
|
|
4037
4070
|
checkoutId: this.checkoutId,
|
|
4038
4071
|
checkoutAdditionalData: this.checkoutAdditionalData,
|
|
4039
4072
|
storeName: this.storeName || 'Tienda VK',
|
|
@@ -4046,7 +4079,7 @@
|
|
|
4046
4079
|
function (response) {
|
|
4047
4080
|
_this.isLoading = false;
|
|
4048
4081
|
if (response && response.success) {
|
|
4049
|
-
|
|
4082
|
+
_this.submittedSuccessfully = true;
|
|
4050
4083
|
_this.statusPay.emit({
|
|
4051
4084
|
success: true,
|
|
4052
4085
|
paymentId: (response.data && response.data.bankTransferEcommId) ? response.data.bankTransferEcommId : '',
|
|
@@ -4054,8 +4087,9 @@
|
|
|
4054
4087
|
});
|
|
4055
4088
|
}
|
|
4056
4089
|
else {
|
|
4057
|
-
|
|
4058
|
-
|
|
4090
|
+
_this.errorMessage = (response.errorsMessages && response.errorsMessages.length > 0)
|
|
4091
|
+
? response.errorsMessages[0]
|
|
4092
|
+
: 'Ocurrió un error al registrar la transferencia.';
|
|
4059
4093
|
_this.statusPay.emit({
|
|
4060
4094
|
success: false,
|
|
4061
4095
|
paymentId: '',
|
|
@@ -4067,9 +4101,10 @@
|
|
|
4067
4101
|
* @return {?}
|
|
4068
4102
|
*/
|
|
4069
4103
|
function (error) {
|
|
4070
|
-
// Error HTTP (500, 400, etc)
|
|
4071
4104
|
_this.isLoading = false;
|
|
4072
|
-
_this.errorMessage = (error && error.error && error.error.errorsMessages && error.error.errorsMessages.length > 0)
|
|
4105
|
+
_this.errorMessage = (error && error.error && error.error.errorsMessages && error.error.errorsMessages.length > 0)
|
|
4106
|
+
? error.error.errorsMessages[0]
|
|
4107
|
+
: 'Ocurrió un error de conexión al registrar la transferencia.';
|
|
4073
4108
|
_this.statusPay.emit({
|
|
4074
4109
|
success: false,
|
|
4075
4110
|
paymentId: '',
|
|
@@ -4079,10 +4114,7 @@
|
|
|
4079
4114
|
}));
|
|
4080
4115
|
};
|
|
4081
4116
|
Object.defineProperty(BankTransferComponent.prototype, "cuitControl", {
|
|
4082
|
-
|
|
4083
|
-
get:
|
|
4084
|
-
// Helper para validación visual en el template
|
|
4085
|
-
/**
|
|
4117
|
+
get: /**
|
|
4086
4118
|
* @return {?}
|
|
4087
4119
|
*/
|
|
4088
4120
|
function () {
|
|
@@ -4094,8 +4126,8 @@
|
|
|
4094
4126
|
BankTransferComponent.decorators = [
|
|
4095
4127
|
{ type: core.Component, args: [{
|
|
4096
4128
|
selector: 'vk-bank-transfer',
|
|
4097
|
-
template: "<form\n [formGroup]=\"paymentForm\"\n (ngSubmit)=\"onSubmit()\"\n class=\"bt-payment\"\n id=\"formularioBT\"\n autocomplete=\"off\"\n>\n\n
|
|
4098
|
-
styles: [".bt-payment{background-color:transparent;font-family:inherit,sans-serif;padding:0 12px}.bt-payment p.description{font-size:16px;color:#888;margin-bottom:5px}.bt-payment .bank-info-box{border:1px solid #c8e0f0;border-radius:8px;overflow:hidden;margin-bottom:18px}.bt-payment .bank-info-box .bank-info-header{display:flex;align-items:center;gap:8px;background-color:#009ee3;color:#fff;padding:10px 14px;font-size:18px;font-weight:600;letter-spacing:.4px;text-transform:uppercase}.bt-payment .bank-info-box .bank-info-header i.material-icons{font-size:18px}.bt-payment .bank-info-box .bank-info-row{display:flex;justify-content:space-between;align-items:center;font-size:18px;padding:8px 14px;background-color:#fff;border-bottom:1px solid #eef3f7}.bt-payment .bank-info-box .bank-info-row:last-child{border-bottom:none}.bt-payment .bank-info-box .bank-info-label{display:flex;align-items:center;gap:6px;color:#777;flex-shrink:0;margin-right:8px}.bt-payment .bank-info-box .bank-info-label i.material-icons{font-size:15px;color:#009ee3}.bt-payment .bank-info-box .bank-info-value{font-weight:600;color:#1a1a1a;text-align:right}.bt-payment .bank-info-box .bank-info-value.bank-info-copy{display:flex;align-items:center;gap:4px}.bt-payment .bank-info-box .bank-info-value .bank-info-copy-text{font-family:\"Courier New\",monospace;font-size:18px;letter-spacing:.3px}.bt-payment .bank-info-box .copy-btn{background:0 0;border:none;cursor:pointer;padding:2px 4px;border-radius:4px;color:#009ee3;display:flex;align-items:center;margin-top:0;width:auto;min-width:unset}.bt-payment .bank-info-box .copy-btn i.material-icons{font-size:16px}.bt-payment .bank-info-box .copy-btn:hover{background-color:#e8f4fb}.bt-payment .bank-info-box .copy-btn:disabled{background-color:transparent;cursor:default}.bt-payment .
|
|
4129
|
+
template: "<form\n [formGroup]=\"paymentForm\"\n (ngSubmit)=\"onSubmit()\"\n class=\"bt-payment\"\n id=\"formularioBT\"\n autocomplete=\"off\"\n>\n\n <!-- Datos bancarios -->\n <div class=\"bank-info-box\">\n <div class=\"bank-info-header\">\n <i class=\"material-icons\">account_balance</i>\n <span>Datos para la transferencia</span>\n </div>\n <div class=\"bank-info-row\">\n <span class=\"bank-info-label\"><i class=\"material-icons\">tag</i>N\u00FAmero de cuenta</span>\n <span class=\"bank-info-value\">2-311972/1</span>\n </div>\n <div class=\"bank-info-row\">\n <span class=\"bank-info-label\"><i class=\"material-icons\">qr_code</i>CBU</span>\n <span class=\"bank-info-value bank-info-copy\">\n <span class=\"bank-info-copy-text\">4150002012003119720013</span>\n <button class=\"copy-btn\" type=\"button\" title=\"Copiar CBU\" (click)=\"copyToClipboard('4150002012003119720013')\">\n <i class=\"material-icons\">content_copy</i>\n </button>\n </span>\n </div>\n <div class=\"bank-info-row\">\n <span class=\"bank-info-label\"><i class=\"material-icons\">alternate_email</i>Alias</span>\n <span class=\"bank-info-value bank-info-copy\">\n <span class=\"bank-info-copy-text\">reba.vitnik</span>\n <button class=\"copy-btn\" type=\"button\" title=\"Copiar alias\" (click)=\"copyToClipboard('reba.vitnik')\">\n <i class=\"material-icons\">content_copy</i>\n </button>\n </span>\n </div>\n <div class=\"bank-info-row\">\n <span class=\"bank-info-label\"><i class=\"material-icons\">badge</i>CUIT/CUIL</span>\n <span class=\"bank-info-value\">30708777893</span>\n </div>\n <div class=\"bank-info-row\">\n <span class=\"bank-info-label\"><i class=\"material-icons\">attach_money</i>Moneda</span>\n <span class=\"bank-info-value\">Peso Argentino</span>\n </div>\n </div>\n\n <!-- Resumen con desglose del descuento -->\n <div class=\"summary-box\">\n <div class=\"summary-row\">\n <span class=\"summary-label\">Subtotal</span>\n <span class=\"summary-value\">${{ subtotalAmount | number:'1.2-2' }}</span>\n </div>\n <div class=\"summary-row discount\">\n <span class=\"summary-label\">\n <i class=\"material-icons\">local_offer</i>\n Descuento transferencia ({{ discountRate * 100 | number:'1.0-0' }}%)\n </span>\n <span class=\"summary-value discount-value\">-${{ discountAmount | number:'1.2-2' }}</span>\n </div>\n <div class=\"summary-row total\">\n <span class=\"summary-label\">Total a transferir</span>\n <span class=\"summary-value total-value\">\n ${{ amount | number:'1.2-2' }}\n <button\n class=\"copy-btn copy-amount-btn\"\n type=\"button\"\n [title]=\"amountCopied ? 'Copiado!' : 'Copiar monto'\"\n (click)=\"copyAmount()\"\n >\n <i class=\"material-icons\">{{ amountCopied ? 'check' : 'content_copy' }}</i>\n </button>\n </span>\n </div>\n </div>\n\n <!-- Leyenda de monto exacto -->\n <div class=\"exact-amount-notice\">\n <i class=\"material-icons notice-icon\">info</i>\n <p>\n <strong>\u00A1Ya casi es tuyo!</strong> Para que podamos procesar tu pedido sin demoras,\n asegurate de que el importe de la transferencia sea <strong>id\u00E9ntico</strong> al total indicado arriba.\n </p>\n </div>\n\n <!-- Error devuelto por la API -->\n <div class=\"pay-message error\" *ngIf=\"errorMessage && !isLoading\">\n <i class=\"material-icons\">error</i>\n <p>{{ errorMessage }}</p>\n </div>\n\n <!-- Loading -->\n <div *ngIf=\"isLoading\" class=\"pay-message info\">\n <i class=\"material-icons\">info</i>\n <p>Procesando informaci\u00F3n de transferencia...</p>\n </div>\n\n <!-- Bot\u00F3n confirmar (oculto tras \u00E9xito) -->\n <div *ngIf=\"!submittedSuccessfully\">\n <button type=\"submit\" [disabled]=\"paymentForm.invalid || isLoading\">\n Confirmar Transferencia\n </button>\n </div>\n\n</form>\n",
|
|
4130
|
+
styles: [".bt-payment{background-color:transparent;font-family:inherit,sans-serif;padding:0 12px}.bt-payment p.description{font-size:16px;color:#888;margin-bottom:5px}.bt-payment .bank-info-box{border:1px solid #c8e0f0;border-radius:8px;overflow:hidden;margin-bottom:18px}.bt-payment .bank-info-box .bank-info-header{display:flex;align-items:center;gap:8px;background-color:#009ee3;color:#fff;padding:10px 14px;font-size:18px;font-weight:600;letter-spacing:.4px;text-transform:uppercase}.bt-payment .bank-info-box .bank-info-header i.material-icons{font-size:18px}.bt-payment .bank-info-box .bank-info-row{display:flex;justify-content:space-between;align-items:center;font-size:18px;padding:8px 14px;background-color:#fff;border-bottom:1px solid #eef3f7}.bt-payment .bank-info-box .bank-info-row:last-child{border-bottom:none}.bt-payment .bank-info-box .bank-info-label{display:flex;align-items:center;gap:6px;color:#777;flex-shrink:0;margin-right:8px}.bt-payment .bank-info-box .bank-info-label i.material-icons{font-size:15px;color:#009ee3}.bt-payment .bank-info-box .bank-info-value{font-weight:600;color:#1a1a1a;text-align:right}.bt-payment .bank-info-box .bank-info-value.bank-info-copy{display:flex;align-items:center;gap:4px}.bt-payment .bank-info-box .bank-info-value .bank-info-copy-text{font-family:\"Courier New\",monospace;font-size:18px;letter-spacing:.3px}.bt-payment .bank-info-box .copy-btn{background:0 0;border:none;cursor:pointer;padding:2px 4px;border-radius:4px;color:#009ee3;display:flex;align-items:center;margin-top:0;width:auto;min-width:unset}.bt-payment .bank-info-box .copy-btn i.material-icons{font-size:16px}.bt-payment .bank-info-box .copy-btn:hover{background-color:#e8f4fb}.bt-payment .bank-info-box .copy-btn:disabled{background-color:transparent;cursor:default}.bt-payment .summary-box{margin:20px 0;border:1px solid #e0e0e0;border-radius:8px;overflow:hidden}.bt-payment .summary-box .summary-row{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;font-size:16px;background-color:#fff;border-bottom:1px solid #f0f0f0}.bt-payment .summary-box .summary-row:last-child{border-bottom:none}.bt-payment .summary-box .summary-row .summary-label{display:flex;align-items:center;gap:6px;color:#555}.bt-payment .summary-box .summary-row .summary-label i.material-icons{font-size:14px}.bt-payment .summary-box .summary-row .summary-value{font-weight:600;color:#1a1a1a;display:flex;align-items:center;gap:6px}.bt-payment .summary-box .summary-row.discount{background-color:#f0fdf4}.bt-payment .summary-box .summary-row.discount .summary-label{color:#16a34a;font-weight:500}.bt-payment .summary-box .summary-row.discount .summary-label i.material-icons{color:#16a34a}.bt-payment .summary-box .summary-row.discount .discount-value{color:#16a34a;font-weight:700}.bt-payment .summary-box .summary-row.total{background-color:#f8f9fa;border-top:2px solid #009ee3}.bt-payment .summary-box .summary-row.total .summary-label{font-size:17px;font-weight:700;color:#1a1a1a}.bt-payment .summary-box .summary-row.total .total-value{font-size:20px;font-weight:800;color:#009ee3}.bt-payment .summary-box .copy-amount-btn{background:0 0;border:1px solid #009ee3;border-radius:6px;cursor:pointer;padding:2px 6px;color:#009ee3;display:flex;align-items:center;width:auto;min-width:unset;margin-top:0;transition:background-color .2s}.bt-payment .summary-box .copy-amount-btn i.material-icons{font-size:16px}.bt-payment .summary-box .copy-amount-btn:hover{background-color:#e8f4fb}.bt-payment .exact-amount-notice{display:flex;align-items:flex-start;gap:10px;background-color:#fffbeb;border:1px solid #fcd34d;border-radius:8px;padding:12px 14px;margin-bottom:20px}.bt-payment .exact-amount-notice .notice-icon{font-size:20px;color:#d97706;flex-shrink:0;margin-top:2px}.bt-payment .exact-amount-notice p{font-size:14px;color:#78350f;margin:0;line-height:1.5}.bt-payment .formRow{margin-top:10px;display:none}.bt-payment .formRow label{font-size:16px;color:#888}.bt-payment .formRow span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}.bt-payment .formRow span input[type=text]{background:0 0;border:none;color:#000;font-size:16px;height:23px;width:100%;text-transform:uppercase;vertical-align:top;padding:0;margin:0}.bt-payment .formRow span input[type=text]:focus{outline:0}.bt-payment .alert-text{font-size:16px;color:#009ee3;margin-top:7px;margin-bottom:0}.bt-payment button[type=submit]{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}.bt-payment button[type=submit]:disabled{background-color:#525252;cursor:not-allowed}.bt-payment .pay-message{margin-top:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px;border-radius:8px}.bt-payment .pay-message p{font-size:1.1rem;text-align:center;line-height:130%;margin-bottom:10px}.bt-payment .pay-message i.material-icons{font-size:2rem;margin-bottom:5px}.bt-payment .success{background-color:#dff2bf;color:#4f8a10}.bt-payment .error{color:#d8000c;background-color:#ffd2d2}.bt-payment .info{color:#00529b;background-color:#bde5f8}:focus{outline:0}"]
|
|
4099
4131
|
}] }
|
|
4100
4132
|
];
|
|
4101
4133
|
/** @nocollapse */
|
|
@@ -4110,6 +4142,7 @@
|
|
|
4110
4142
|
storeName: [{ type: core.Input }],
|
|
4111
4143
|
checkoutId: [{ type: core.Input }],
|
|
4112
4144
|
checkoutAdditionalData: [{ type: core.Input }],
|
|
4145
|
+
discountRate: [{ type: core.Input }],
|
|
4113
4146
|
statusPay: [{ type: core.Output }]
|
|
4114
4147
|
};
|
|
4115
4148
|
return BankTransferComponent;
|
|
@@ -4130,6 +4163,8 @@
|
|
|
4130
4163
|
/** @type {?} */
|
|
4131
4164
|
BankTransferComponent.prototype.checkoutAdditionalData;
|
|
4132
4165
|
/** @type {?} */
|
|
4166
|
+
BankTransferComponent.prototype.discountRate;
|
|
4167
|
+
/** @type {?} */
|
|
4133
4168
|
BankTransferComponent.prototype.statusPay;
|
|
4134
4169
|
/** @type {?} */
|
|
4135
4170
|
BankTransferComponent.prototype.paymentForm;
|
|
@@ -4137,6 +4172,10 @@
|
|
|
4137
4172
|
BankTransferComponent.prototype.isLoading;
|
|
4138
4173
|
/** @type {?} */
|
|
4139
4174
|
BankTransferComponent.prototype.errorMessage;
|
|
4175
|
+
/** @type {?} */
|
|
4176
|
+
BankTransferComponent.prototype.submittedSuccessfully;
|
|
4177
|
+
/** @type {?} */
|
|
4178
|
+
BankTransferComponent.prototype.amountCopied;
|
|
4140
4179
|
/**
|
|
4141
4180
|
* @type {?}
|
|
4142
4181
|
* @private
|