CSR-1391 switch payment functionality

This commit is contained in:
Matt Caimi 2023-10-27 10:45:21 -04:00
parent 30243856b8
commit 1061ba8c34

View file

@ -20,6 +20,39 @@
scrolling="no">
</iframe>
</div>
<div>Switch payment to:</div>
<div>
<button
v-if="paymentType !== 'cc'"
ref="switchToCCButton"
type="button"
@mousedown="switchPIAMethod('cc')"
aria-label="Switch to Credit Card">
Switch to Credit Card
</button>
</div>
<div v-if="paymentType !== 'cc'">or</div>
<div>
<button
v-if="paymentType !== 'pp'"
ref="switchToPPButton"
type="button"
@mousedown="switchPIAMethod('pp')"
aria-label="Switch to PayPal">
Switch to PayPal
</button>
</div>
<div v-if="paymentType === 'cc'">or</div>
<div>
<button
v-if="paymentType !== 'ap'"
ref="switchToAPButton"
type="button"
@mousedown="switchPIAMethod('ap')"
aria-label="Switch to Afterpay">
Switch to Afterpay
</button>
</div>
<navbar
cmsWidgetName="FunnelFooterWidget"
isForwardActionDisabled="true"
@ -32,7 +65,7 @@
</Form>
<form
ref="myForm"
ref="hopForm"
id="card-data"
:target="paypalPayment ? '_top' : 'card-frame'"
method="POST"
@ -403,6 +436,28 @@ export default {
window.location = applicationConfig.PIA_CANCEL_URL;
//this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);
},
switchPIAMethod(payMethod) {
this.paymentType = payMethod;
this.submitHopForm();
},
submitHopForm() {
this.$nextTick(() => {
this.$refs.hopForm.submit();
const iframe = this.$refs.paymentFrame;
if (iframe) {
iframe.onload = () => {
if (iframe.contentWindow) {
if (this.paymentType == "cc") {
iframe.contentWindow.postMessage("CreditCardChosen", "*");
} else if (this.paymentType == "ap") {
iframe.contentWindow.postMessage("afterpay", "*");
}
}
};
}
});
},
async fetchSignatureInfo(signatureInfo) {
if (this.isPaypal()) {
this.$refs.loadingModal.showModal();
@ -412,20 +467,7 @@ export default {
this.authSignature = signatureInfo.signature;
this.authSignatureStart = signatureInfo.startDate;
this.$nextTick(() => {
this.$refs.myForm.submit();
if (this.paymentType == "ap") {
const iframe = this.$refs.paymentFrame;
if (iframe) {
iframe.onload = () => {
if (iframe.contentWindow) {
iframe.contentWindow.postMessage("afterpay", "*");
}
};
}
}
});
this.submitHopForm();
},
},
components: {