Amazon payment fixes (#9562)

* Added custom amazon event, removed redundency, fixed variable names

* Fixed more variables and group plan data
This commit is contained in:
Keith Holliday
2017-11-21 14:02:40 -06:00
committed by GitHub
parent 3ffea4332e
commit 9eaa531f66
7 changed files with 91 additions and 138 deletions

View File

@@ -2,8 +2,8 @@
b-modal#amazon-payment(title="Amazon", :hide-footer="true", size='md')
h2.text-center Continue with Amazon
#AmazonPayButton
#AmazonPayWallet(v-if="amazonLoggedIn", style="width: 400px; height: 228px;")
#AmazonPayRecurring(v-if="amazonLoggedIn && amazonPayments.type === 'subscription'",
#AmazonPayWallet(v-if="amazonPayments.loggedIn", style="width: 400px; height: 228px;")
#AmazonPayRecurring(v-if="amazonPayments.loggedIn && amazonPayments.type === 'subscription'",
style="width: 400px; height: 140px;")
.modal-footer
.text-center
@@ -30,40 +30,35 @@ import { mapState } from 'client/libs/store';
const AMAZON_PAYMENTS = process.env.AMAZON_PAYMENTS; // eslint-disable-line
export default {
props: ['amazonPaymentsProp'],
data () {
return {
amazonPayments: {
modal: null,
type: null,
gift: null,
loggedIn: false,
paymentSelected: false,
billingAgreementId: '',
recurringConsent: false,
orderReferenceId: null,
subscription: null,
coupon: null,
},
OffAmazonPayments: {},
isAmazonSetup: false,
amazonButtonEnabled: false,
amazonPaymentsbillingAgreementId: '',
amazonPaymentspaymentSelected: false,
amazonPaymentsrecurringConsent: 'false',
amazonLoggedIn: false,
};
},
computed: {
...mapState({user: 'user.data'}),
...mapState(['isAmazonReady']),
// @TODO: Eh, idk if we should move data props here or move these props to data. But we shouldn't have both
amazonPayments () {
let amazonPayments = {
type: 'single',
loggedIn: this.amazonLoggedIn,
};
amazonPayments = Object.assign({}, amazonPayments, this.amazonPaymentsProp);
return amazonPayments;
},
amazonPaymentsCanCheckout () {
if (this.amazonPayments.type === 'single') {
return this.amazonPaymentspaymentSelected === true;
return this.amazonPayments.paymentSelected === true;
} else if (this.amazonPayments.type === 'subscription') {
return this.amazonPaymentspaymentSelected === true &&
// Mah.. one is a boolean the other a string...
this.amazonPaymentsrecurringConsent === 'true';
} else {
return false;
return this.amazonPayments.paymentSelected && this.amazonPayments.recurringConsent;
}
return false;
},
},
mounted () {
@@ -72,6 +67,21 @@ export default {
this.$store.watch(state => state.isAmazonReady, (isAmazonReady) => {
if (isAmazonReady) return this.setupAmazon();
});
this.$root.$on('habitica::pay-with-amazon', (amazonPaymentsData) => {
if (!amazonPaymentsData) return;
let amazonPayments = {
type: 'single',
loggedIn: false,
};
this.amazonPayments = Object.assign({}, amazonPayments, amazonPaymentsData);
this.$root.$emit('bv::show::modal', 'amazon-payment');
});
},
destroyed () {
this.$root.$off('habitica::pay-with-amazon');
},
methods: {
setupAmazon () {
@@ -90,25 +100,21 @@ export default {
color: 'Gold',
size: 'small',
agreementType: 'BillingAgreement',
onSignIn: async (contract) => {
this.amazonPaymentsbillingAgreementId = contract.getAmazonBillingAgreementId();
this.amazonLoggedIn = true;
this.amazonPayments.billingAgreementId = contract.getAmazonBillingAgreementId();
this.$set(this.amazonPayments, 'loggedIn', true);
if (this.amazonPayments.type === 'subscription') {
this.amazonPaymentsinitWidgets();
this.amazonInitWidgets();
} else {
let url = '/amazon/createOrderReferenceId';
let response = await axios.post(url, {
billingAgreementId: this.amazonPaymentsbillingAgreementId,
billingAgreementId: this.amazonPayments.billingAgreementId,
});
if (response.status <= 400) {
this.amazonPayments.orderReferenceId = response.data.data.orderReferenceId;
// @TODO: Clarify the deifference of these functions by renaming
this.amazonPaymentsinitWidgets();
this.amazonInitWidgets();
return;
}
@@ -116,7 +122,6 @@ export default {
alert(response.message);
}
},
authorization: () => {
window.amazon.Login.authorize({
scope: 'payments:widget',
@@ -131,7 +136,6 @@ export default {
});
});
},
onError: this.amazonOnError,
});
},
@@ -141,38 +145,29 @@ export default {
design: {
designMode: 'responsive',
},
onPaymentSelect: () => {
this.amazonPaymentspaymentSelected = true;
},
onPaymentSelect: this.amazonOnPaymentSelect,
onError: this.amazonOnError,
};
// @TODO: Check if this is duplicated below
if (this.amazonPayments.type === 'subscription') {
walletParams.agreementType = 'BillingAgreement';
walletParams.billingAgreementId = this.amazonPaymentsbillingAgreementId;
walletParams.billingAgreementId = this.amazonPayments.billingAgreementId;
walletParams.onReady = (billingAgreement) => {
this.amazonPaymentsbillingAgreementId = billingAgreement.getAmazonBillingAgreementId();
this.amazonPayments.billingAgreementId = billingAgreement.getAmazonBillingAgreementId();
new this.OffAmazonPayments.Widgets.Consent({
sellerId: AMAZON_PAYMENTS.SELLER_ID,
amazonBillingAgreementId: this.amazonPaymentsbillingAgreementId,
amazonBillingAgreementId: this.amazonPayments.billingAgreementId,
design: {
designMode: 'responsive',
},
onReady: (consent) => {
let getConsent = consent.getConsentStatus;
this.amazonPaymentsrecurringConsent = getConsent ? getConsent() : false;
this.$set(this.amazonPayments, 'recurringConsent', getConsent ? Boolean(getConsent()) : false);
},
onConsent: (consent) => {
this.amazonPaymentsrecurringConsent = consent.getConsentStatus();
this.$set(this.amazonPayments, 'recurringConsent', Boolean(consent.getConsentStatus()));
},
onError: this.amazonOnError,
}).bind('AmazonPayRecurring');
};
@@ -191,7 +186,7 @@ export default {
let url = '/amazon/checkout';
let response = await axios.post(url, {
orderReferenceId: this.amazonPayments.orderReferenceId,
gift: this.amazonPaymentsgift,
gift: this.amazonPayments.gift,
});
if (response.status < 400) {
@@ -211,7 +206,7 @@ export default {
}
let response = await axios.post(url, {
billingAgreementId: this.amazonPaymentsbillingAgreementId,
billingAgreementId: this.amazonPayments.billingAgreementId,
subscription: this.amazonPayments.subscription,
coupon: this.amazonPayments.coupon,
groupId: this.amazonPayments.groupId,
@@ -243,67 +238,26 @@ export default {
this.reset();
}
},
amazonPaymentsinitWidgets () {
let walletParams = {
sellerId: AMAZON_PAYMENTS.SELLER_ID,
design: {
designMode: 'responsive',
},
onPaymentSelect: () => {
this.amazonPayments.paymentSelected = true;
},
onError: this.amazonOnError,
};
if (this.amazonPayments.type === 'subscription') {
walletParams.agreementType = 'BillingAgreement';
walletParams.billingAgreementId = this.amazonPayments.billingAgreementId;
walletParams.onReady = (billingAgreement) => {
this.amazonPayments.billingAgreementId = billingAgreement.getAmazonBillingAgreementId();
new this.OffAmazonPayments.Widgets.Consent({
sellerId: AMAZON_PAYMENTS.SELLER_ID,
amazonBillingAgreementId: this.amazonPayments.billingAgreementId,
design: {
designMode: 'responsive',
},
onReady: (consent) => {
let getConsent = consent.getConsentStatus;
this.amazonPayments.recurringConsent = getConsent ? getConsent() : false;
},
onConsent: (consent) => {
this.amazonPayments.recurringConsent = consent.getConsentStatus();
},
onError: this.amazonOnError,
}).bind('AmazonPayRecurring');
};
} else {
walletParams.amazonOrderReferenceId = this.amazonPayments.orderReferenceId;
}
new this.OffAmazonPayments.Widgets.Wallet(walletParams).bind('AmazonPayWallet');
amazonOnPaymentSelect () {
this.$set(this.amazonPayments, 'paymentSelected', true);
},
amazonOnError (error) {
alert(error.getErrorMessage());
this.reset();
},
reset () {
this.amazonPaymentsmodal = null;
// @TODO: Ensure we are using all of these
// some vars are set in the payments mixin. We should try to edit in one place
this.amazonPayments.modal = null;
this.amazonPayments.type = null;
this.amazonLoggedIn = false;
this.amazonPaymentsgift = null;
this.amazonPaymentsbillingAgreementId = null;
this.amazonPayments.loggedIn = false;
this.amazonPayments.gift = null;
this.amazonPayments.billingAgreementId = null;
this.amazonPayments.orderReferenceId = null;
this.amazonPaymentspaymentSelected = false;
this.amazonPaymentsrecurringConsent = false;
this.amazonPaymentssubscription = null;
this.amazonPaymentscoupon = null;
this.amazonPayments.paymentSelected = false;
this.amazonPayments.recurringConsent = false;
this.amazonPayments.subscription = null;
this.amazonPayments.coupon = null;
},
},
};