diff --git a/src/app/pay-for-order/pay-for-order.component.ts b/src/app/pay-for-order/pay-for-order.component.ts
new file mode 100644
index 0000000..c12b83b
--- /dev/null
+++ b/src/app/pay-for-order/pay-for-order.component.ts
@@ -0,0 +1,112 @@
+import { Component, DestroyRef, inject, OnInit } from '@angular/core';
+import { FormControl, Validators } from '@angular/forms';
+import { LoadingService } from '../loading.service';
+import { HttpService } from '../http.service';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { catchError, map, of, take } from 'rxjs';
+import { ActivatedRoute, Router } from '@angular/router';
+
+@Component({
+ selector: 'app-pay-for-order',
+ standalone: false,
+ templateUrl: './pay-for-order.component.html',
+ styleUrl: './pay-for-order.component.css',
+})
+export class PayForOrderComponent implements OnInit {
+ private httpService = inject(HttpService);
+ private router = inject(Router);
+ private route = inject(ActivatedRoute);
+ private destroyRef = inject(DestroyRef);
+ public loadingService = inject(LoadingService);
+
+ queryError?: string;
+
+ formControl = new FormControl('', {
+ validators: [
+ Validators.required,
+ Validators.minLength(6),
+ Validators.maxLength(6)
+ ]
+ });
+
+ ngOnInit() {
+ const error = this.route.snapshot.queryParamMap.get('error');
+ const code = this.route.snapshot.queryParamMap.get('code');
+
+ if (code) {
+ this.formControl.setValue(code);
+ }
+
+ if (error) {
+ // Warte einen Tick, damit Angular das FormControl initialisiert hat
+ setTimeout(() => {
+ this.formControl.clearValidators();
+ this.formControl.setErrors({ [error]: true });
+ this.formControl.markAsTouched();
+ });
+
+ // Bei erster Änderung: Validatoren wieder aktivieren
+ this.formControl.valueChanges.pipe(
+ take(1),
+ takeUntilDestroyed(this.destroyRef)
+ ).subscribe(() => {
+ this.formControl.setValidators([
+ Validators.required,
+ Validators.minLength(6),
+ Validators.maxLength(6)
+ ]);
+ this.formControl.updateValueAndValidity();
+ });
+ }
+ }
+
+ onInput(event: Event) {
+ this.queryError = undefined;
+ const input = event.target as HTMLInputElement;
+ const filtered = input.value.toUpperCase().replace(/[^A-Z0-9]/g, '');
+ this.formControl.setValue(filtered, { emitEvent: false });
+ }
+
+ DoSubmit() {
+ this.formControl.markAsTouched();
+ if (this.formControl.invalid) return;
+
+ const code = this.formControl.value?.trim();
+ if (!code || code.length !== 6) return;
+
+ this.loadingService.show();
+ const orderFilter = [`eq;code;string;${code}`];
+
+ this.httpService.getOrdersByFilter(orderFilter).pipe(
+ map(orders => {
+ this.loadingService.hide();
+ if (orders.length === 0) {
+ this.formControl.setErrors({ invalid: true });
+ return
+ }
+
+ if (orders.length > 1) {
+ this.formControl.setErrors({ severalOrders: true });
+ return;
+ }
+ const order = orders[0];
+ if (order.booked) {
+ this.formControl.setErrors({ alreadyBooked: true });
+ return;
+ }
+ if (order.cancelled) {
+ this.formControl.setErrors({ cancelled: true });
+ return;
+ }
+ this.router.navigate(['/checkout/order', order.code]);
+ }),
+ catchError(err => {
+ this.loadingService.hide();
+ this.loadingService.showError(err);
+ this.formControl.setErrors({ serverError: true });
+ return of(null);
+ }),
+ takeUntilDestroyed(this.destroyRef)
+ ).subscribe();
+ }
+}
diff --git a/src/app/theater-overlay/theater-overlay.component.ts b/src/app/theater-overlay/theater-overlay.component.ts
index 270f272..4545191 100644
--- a/src/app/theater-overlay/theater-overlay.component.ts
+++ b/src/app/theater-overlay/theater-overlay.component.ts
@@ -242,7 +242,7 @@ export class TheaterOverlayComponent implements OnInit, OnDestroy {
if (!tickets.length) {
return from(this.router.navigate(
['/checkout/order'],
- { queryParams: { error: 'invalid' } }
+ { queryParams: { error: 'invalid', code: orderCode } }
));
}
@@ -251,7 +251,7 @@ export class TheaterOverlayComponent implements OnInit, OnDestroy {
if (this.order.booked || this.order.cancelled) {
return from(this.router.navigate(
['/checkout/order'],
- { queryParams: { error: 'completed' } }
+ { queryParams: { error: 'completed', code: orderCode } }
));
}
@@ -264,14 +264,16 @@ export class TheaterOverlayComponent implements OnInit, OnDestroy {
return this.loadPerformanceAndSeats();
}),
catchError(err => {
- this.loading.hide();
console.error('Fehler beim Laden der Bestellung', err);
return from(this.router.navigate(
['/checkout/order'],
- { queryParams: { error: 'invalid' } }
+ { queryParams: { error: 'invalid', code: orderCode } }
));
}),
+ finalize(() => {
+ this.loading.hide();
+ }),
takeUntilDestroyed(this.destroyRef)
).subscribe();
}