From 14ce3870c3488f7e0a793147488e6c1f734ccebf Mon Sep 17 00:00:00 2001 From: Sylvain Jermini Date: Tue, 2 Jul 2019 16:22:42 +0200 Subject: [PATCH] #1 handle cancel of paypal token --- .../overview/overview.component.html | 9 +- .../overview/overview.component.ts | 112 ++++++++++-------- src/app/shared/reservation.service.ts | 6 +- 3 files changed, 74 insertions(+), 53 deletions(-) diff --git a/src/app/reservation/overview/overview.component.html b/src/app/reservation/overview/overview.component.html index 4acd72e0..0febf8cb 100644 --- a/src/app/reservation/overview/overview.component.html +++ b/src/app/reservation/overview/overview.component.html @@ -16,7 +16,7 @@

-
+
-
-

+
+

{{'reservation-page.credit-card'|translate}} @@ -110,7 +110,8 @@

- + +

diff --git a/src/app/reservation/overview/overview.component.ts b/src/app/reservation/overview/overview.component.ts index 4b8a267b..c644553b 100644 --- a/src/app/reservation/overview/overview.component.ts +++ b/src/app/reservation/overview/overview.component.ts @@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { ReservationService } from '../../shared/reservation.service'; import { FormBuilder, FormGroup } from '@angular/forms'; -import { Event, PaymentMethod, PaymentProxy } from 'src/app/model/event'; +import { Event, PaymentMethod, PaymentProxy, PaymentProxyWithParameters } from 'src/app/model/event'; import { EventService } from 'src/app/shared/event.service'; import { ReservationInfo } from 'src/app/model/reservation-info'; import { PaymentProvider, SimplePaymentProvider } from 'src/app/payment/payment-provider'; @@ -30,6 +30,8 @@ export class OverviewComponent implements OnInit { selectedPaymentProvider: PaymentProvider; + activePaymentMethods: {[key in PaymentMethod]?: PaymentProxyWithParameters}; + constructor( private route: ActivatedRoute, private router: Router, @@ -49,73 +51,81 @@ export class OverviewComponent implements OnInit { this.eventService.getEvent(this.eventShortName).subscribe(ev => { this.event = ev; + this.activePaymentMethods = this.event.activePaymentMethods; + this.i18nService.setPageTitle('reservation-page.header.title', ev.displayName); - this.reservationService.getReservationInfo(this.eventShortName, this.reservationId).subscribe(resInfo => { - this.reservationInfo = resInfo; + this.loadReservation(ev); - let paymentProxy : PaymentProxy = null; - let selectedPaymentMethod: PaymentMethod = null; + this.analytics.pageView(ev.analyticsConfiguration); + }); + }); + } - if (!resInfo.orderSummary.free && this.paymentMethodsCount(ev) === 1) { - selectedPaymentMethod = this.getSinglePaymentMethod(ev); - paymentProxy = ev.activePaymentMethods[selectedPaymentMethod].paymentProxy; - } - if (resInfo.orderSummary.free) { - selectedPaymentMethod = 'NONE'; - this.selectedPaymentProvider = new SimplePaymentProvider(); - } + loadReservation(ev: Event) { + this.reservationService.getReservationInfo(this.eventShortName, this.reservationId).subscribe(resInfo => { + this.reservationInfo = resInfo; - // - if (this.reservationInfo.tokenAcquired) { - paymentProxy = this.reservationInfo.paymentProxy; - selectedPaymentMethod = this.getPaymentMethodMatchingProxy(ev, paymentProxy); - - // we override and keep only the one selected - //TODO: kinda ugly, but it works - let paymentProxyAndParam = this.event.activePaymentMethods[selectedPaymentMethod]; - this.event.activePaymentMethods = {}; - this.event.activePaymentMethods[selectedPaymentMethod] = paymentProxyAndParam - // - } - // - - this.overviewForm = this.formBuilder.group({ - termAndConditionsAccepted: null, - privacyPolicyAccepted: null, - selectedPaymentMethod: selectedPaymentMethod, //<- note: not used by the backend - paymentMethod: paymentProxy, //<- name mismatch for legacy reasons - gatewayToken: null - }); - - // we synchronize the selectedPaymentMethod with the corresponding paymentMethod (which is a payment proxy) - this.overviewForm.get('selectedPaymentMethod').valueChanges.subscribe(v => { - this.overviewForm.get('paymentMethod').setValue(ev.activePaymentMethods[v as PaymentMethod].paymentProxy); - }); - }); + let paymentProxy : PaymentProxy = null; + let selectedPaymentMethod: PaymentMethod = null; - this.analytics.pageView(ev.analyticsConfiguration); + if (!resInfo.orderSummary.free && this.paymentMethodsCount() === 1) { + selectedPaymentMethod = this.getSinglePaymentMethod(); + paymentProxy = ev.activePaymentMethods[selectedPaymentMethod].paymentProxy; + } + + if (resInfo.orderSummary.free) { + selectedPaymentMethod = 'NONE'; + this.selectedPaymentProvider = new SimplePaymentProvider(); + } + + // + if (this.reservationInfo.tokenAcquired) { + paymentProxy = this.reservationInfo.paymentProxy; + selectedPaymentMethod = this.getPaymentMethodMatchingProxy(paymentProxy); + + // we override and keep only the one selected + let paymentProxyAndParam = this.event.activePaymentMethods[selectedPaymentMethod]; + this.activePaymentMethods = {}; + this.activePaymentMethods[selectedPaymentMethod] = paymentProxyAndParam + // + } else { + this.activePaymentMethods = this.event.activePaymentMethods; + } + // + + this.overviewForm = this.formBuilder.group({ + termAndConditionsAccepted: null, + privacyPolicyAccepted: null, + selectedPaymentMethod: selectedPaymentMethod, //<- note: not used by the backend + paymentMethod: paymentProxy, //<- name mismatch for legacy reasons + gatewayToken: null + }); + + // we synchronize the selectedPaymentMethod with the corresponding paymentMethod (which is a payment proxy) + this.overviewForm.get('selectedPaymentMethod').valueChanges.subscribe(v => { + this.overviewForm.get('paymentMethod').setValue(ev.activePaymentMethods[v as PaymentMethod].paymentProxy); }); }); } - paymentMethodsCount(event: Event) : number { - return Object.keys(event.activePaymentMethods).length; + paymentMethodsCount() : number { + return Object.keys(this.activePaymentMethods).length; } - getPaymentMethodMatchingProxy(event: Event, paymentProxy: PaymentProxy) : PaymentMethod | null { - let keys: PaymentMethod[] = Object.keys(event.activePaymentMethods) as PaymentMethod[]; + private getPaymentMethodMatchingProxy(paymentProxy: PaymentProxy) : PaymentMethod | null { + let keys: PaymentMethod[] = Object.keys(this.activePaymentMethods) as PaymentMethod[]; for(let idx in keys) { - if(event.activePaymentMethods[keys[idx]].paymentProxy === paymentProxy) { + if(this.activePaymentMethods[keys[idx]].paymentProxy === paymentProxy) { return keys[idx]; } } return null; } - getSinglePaymentMethod(event: Event) : PaymentMethod { - return (Object.keys(event.activePaymentMethods) as PaymentMethod[])[0]; + getSinglePaymentMethod() : PaymentMethod { + return (Object.keys(this.activePaymentMethods) as PaymentMethod[])[0]; } back() { @@ -178,4 +188,10 @@ export class OverviewComponent implements OnInit { registerCurrentPaymentProvider(paymentProvider: PaymentProvider) { this.selectedPaymentProvider = paymentProvider; } + + clearToken(): void { + this.reservationService.removePaymentToken(this.eventShortName, this.reservationId).subscribe(r => { + this.loadReservation(this.event); + }); + } } \ No newline at end of file diff --git a/src/app/shared/reservation.service.ts b/src/app/shared/reservation.service.ts index dad97b5b..48f804aa 100644 --- a/src/app/shared/reservation.service.ts +++ b/src/app/shared/reservation.service.ts @@ -54,5 +54,9 @@ export class ReservationService { getPaymentStatus(eventShortName: string, reservationId: string): Observable { return this.http.get(`/api/v2/public/event/${eventShortName}/reservation/${reservationId}/payment/CREDIT_CARD/status`); } - + + removePaymentToken(eventShortName: string, reservationId: string): Observable { + return this.http.delete(`/api/v2/public/event/${eventShortName}/reservation/${reservationId}/payment/token`) + } + } \ No newline at end of file