From fb3afbdc7666a8ad743174177a7c1c5c8cb939a4 Mon Sep 17 00:00:00 2001 From: Kyle Spearrin Date: Wed, 20 Feb 2019 20:16:06 -0500 Subject: [PATCH] credit payment method --- jslib | 2 +- .../settings/adjust-payment.component.html | 2 +- .../create-organization.component.html | 2 +- src/app/settings/payment.component.html | 32 ++++++++++++------- src/app/settings/payment.component.ts | 30 +++++++++-------- src/app/settings/user-billing.component.html | 3 +- src/locales/en/messages.json | 6 ++++ 7 files changed, 48 insertions(+), 29 deletions(-) diff --git a/jslib b/jslib index 36e65f08ca..2b931963cd 160000 --- a/jslib +++ b/jslib @@ -1 +1 @@ -Subproject commit 36e65f08cad6cebdb5b90c88a68360296e8ff2ec +Subproject commit 2b931963cd8dbebdcbdd6a418ac3ef72adb73539 diff --git a/src/app/settings/adjust-payment.component.html b/src/app/settings/adjust-payment.component.html index 2bfc140994..4fcf514473 100644 --- a/src/app/settings/adjust-payment.component.html +++ b/src/app/settings/adjust-payment.component.html @@ -1,7 +1,7 @@

{{(currentType != null ? 'changePaymentMethod' : 'addPaymentMethod') | i18n}}

- +
{{'paymentChargedWithTrial' | i18n : (interval | i18n) }}

{{'paymentInformation' | i18n}}

- +
+ +
+
+ {{'paypalClickSubmit' | i18n}} +
+ + + + {{'makeSureEnoughCredit' | i18n}} + + diff --git a/src/app/settings/payment.component.ts b/src/app/settings/payment.component.ts index 53b0946722..fcac370938 100644 --- a/src/app/settings/payment.component.ts +++ b/src/app/settings/payment.component.ts @@ -35,9 +35,10 @@ const StripeElementClasses = { }) export class PaymentComponent implements OnInit { @Input() showOptions = true; - @Input() method: 'card' | 'paypal' | 'bank' = 'card'; + @Input() method = PaymentMethodType.Card; @Input() hideBank = false; @Input() hidePaypal = false; + @Input() hideCredit = false; bank: any = { routing_number: null, @@ -48,6 +49,8 @@ export class PaymentComponent implements OnInit { country: 'US', }; + paymentMethodType = PaymentMethodType; + private btScript: HTMLScriptElement; private btInstance: any = null; private stripeScript: HTMLScriptElement; @@ -74,8 +77,9 @@ export class PaymentComponent implements OnInit { ngOnInit() { if (!this.showOptions) { - this.hidePaypal = this.method !== 'paypal'; - this.hideBank = this.method !== 'bank'; + this.hidePaypal = this.method !== PaymentMethodType.PayPal; + this.hideBank = this.method !== PaymentMethodType.BankAccount; + this.hideCredit = this.method !== PaymentMethodType.Credit; } window.document.head.appendChild(this.stripeScript); if (!this.hidePaypal) { @@ -93,7 +97,7 @@ export class PaymentComponent implements OnInit { } catch { } } }); - }, 200); + }, 500); if (!this.hidePaypal) { window.document.head.removeChild(this.btScript); window.setTimeout(() => { @@ -110,14 +114,14 @@ export class PaymentComponent implements OnInit { window.document.head.removeChild(btStylesheet); } catch { } } - }, 200); + }, 500); } } changeMethod() { this.btInstance = null; - if (this.method === 'paypal') { + if (this.method === PaymentMethodType.PayPal) { window.setTimeout(() => { (window as any).braintree.dropin.create({ authorization: this.platformUtilsService.isDev() ? @@ -149,20 +153,18 @@ export class PaymentComponent implements OnInit { createPaymentToken(): Promise<[string, PaymentMethodType]> { return new Promise((resolve, reject) => { - if (this.method === 'paypal') { + if (this.method === PaymentMethodType.PayPal) { this.btInstance.requestPaymentMethod().then((payload: any) => { - resolve([payload.nonce, PaymentMethodType.PayPal]); + resolve([payload.nonce, this.method]); }).catch((err: any) => { reject(err.message); }); - } else if (this.method === 'card' || this.method === 'bank') { - let type = PaymentMethodType.Card; + } else if (this.method === PaymentMethodType.Card || this.method === PaymentMethodType.BankAccount) { let sourceObj: any = null; let createObj: any = null; - if (this.method === 'card') { + if (this.method === PaymentMethodType.Card) { sourceObj = this.stripeCardNumberElement; } else { - type = PaymentMethodType.BankAccount; sourceObj = 'bank_account'; createObj = this.bank; } @@ -170,7 +172,7 @@ export class PaymentComponent implements OnInit { if (result.error) { reject(result.error.message); } else if (result.token && result.token.id != null) { - resolve([result.token.id, type]); + resolve([result.token.id, this.method]); } else { reject(); } @@ -181,7 +183,7 @@ export class PaymentComponent implements OnInit { private setStripeElement() { window.setTimeout(() => { - if (this.method === 'card') { + if (this.method === PaymentMethodType.Card) { if (this.stripeCardNumberElement == null) { this.stripeCardNumberElement = this.stripeElements.create('cardNumber', { style: StripeElementStyle, diff --git a/src/app/settings/user-billing.component.html b/src/app/settings/user-billing.component.html index 4f1d4d20a2..635d4e9ad3 100644 --- a/src/app/settings/user-billing.component.html +++ b/src/app/settings/user-billing.component.html @@ -9,7 +9,8 @@

{{(isCreditBalance ? 'accountCredit' : 'accountBalance') | i18n}}

-

{{creditOrBalance | currency:'$'}}

+

{{creditOrBalance | currency:'$'}}

+

{{'creditAppliedDesc' | i18n}}

diff --git a/src/locales/en/messages.json b/src/locales/en/messages.json index 5b2f2e4c3c..c68673a09b 100644 --- a/src/locales/en/messages.json +++ b/src/locales/en/messages.json @@ -1506,6 +1506,12 @@ "message": "Amount", "description": "Dollar amount, or quantity." }, + "makeSureEnoughCredit": { + "message": "Please make sure that your account has enough credit available for this purchase. If your account does not have enough credit available, your default payment method on file will be used for the difference. You can add credit to your account from the Billing page." + }, + "creditAppliedDesc": { + "message": "Your account's credit can be used to make purchases. Any available credit will be automatically applied towards invoices generated for this account." + }, "goPremium": { "message": "Go Premium", "description": "Another way of saying \"Get a premium membership\""