diff --git a/src/app/ticket-small/ticket-small.component.html b/src/app/ticket-small/ticket-small.component.html
index 8d9d732..8ad4428 100644
--- a/src/app/ticket-small/ticket-small.component.html
+++ b/src/app/ticket-small/ticket-small.component.html
@@ -6,12 +6,7 @@
{{ ticket().seat.row.category.name }}
- @if (ticket().seat.row.category.name.length > 10) {
-
- }
- @else {
- •
- } Reihe
+ • Reihe
{{ convertIntoRowName(ticket().seat.row.position) }}
Platz
{{ ticket().seat.position }}
diff --git a/src/app/ticket-validation-result/ticket-validation-result.component.css b/src/app/ticket-validation-result/ticket-validation-result.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/ticket-validation-result/ticket-validation-result.component.html b/src/app/ticket-validation-result/ticket-validation-result.component.html
new file mode 100644
index 0000000..67e8981
--- /dev/null
+++ b/src/app/ticket-validation-result/ticket-validation-result.component.html
@@ -0,0 +1,118 @@
+@switch (result()) {
+
+ @case ('nothing') {
+
+ qr_code_scanner
+
Bitte Ticket scannen
oder Ticketcode eingeben
+
+ }
+
+ @case ('invalid') {
+
+
cancel
+
Ticket ungültig!
+
Unter der angegebenen Ticketnummer konnte keine gültige Eintrittskarte gefunden werden.
+
+ }
+
+ @case ('unpaid') {
+ @if (performance()) {
+
+
+ }
+
+
cancel
+
Ticket nicht bezahlt!
+
Die Bestellung wurde noch nicht bezahlt und der Sitzplatz befindet sich noch im Status 'reserviert'.
+ @if (ticket()) {
+
+ }
+ @if (order()) {
+
+ Ticket jetzt bezahlen
+
+ }
+
+ }
+
+ @case ('expired') {
+ @if (performance()) {
+
+
+ }
+
+
cancel
+
Vorstellung beendet!
+
Die Filmvorführung hat bereits stattgefunden.
+ @if (ticket()) {
+
+ }
+
+ }
+
+ @case ('valid') {
+ @if (performance()) {
+
+
+ }
+
+
check_circle
+
Ticket gültig!
+ @if (ticket()) {
+
+ }
+
+ }
+
+ @case ('early') {
+ @if (performance()) {
+
+
+ }
+
+
schedule
+
Noch kein Einlass!
+
Die Vorstellung beginnt in mehr als zwei Stunden.
+ @if (ticket()) {
+
+ }
+
+ }
+
+ @case ('cancelled') {
+ @if (performance()) {
+
+
+ }
+
+
cancel
+
Ticket storniert!
+ @if (order()) {
+
+ Die Bestellung wurde am {{ cancelledDate }} storniert.
+
+ }
+ @if (ticket()) {
+
+ }
+
+ }
+
+ @case ('error') {
+
+
error
+
Überprüfung fehlgeschlagen!
+
Bei der Validierung des Tickets ist ein Fehler aufgetreten. Bitte versuchen Sie es erneut.
+
+ }
+
+ @default {
+
+
+
+ }
+}
+
diff --git a/src/app/ticket-validation-result/ticket-validation-result.component.ts b/src/app/ticket-validation-result/ticket-validation-result.component.ts
new file mode 100644
index 0000000..cd4074e
--- /dev/null
+++ b/src/app/ticket-validation-result/ticket-validation-result.component.ts
@@ -0,0 +1,22 @@
+import { Component, input } from '@angular/core';
+import { Bestellung, Eintrittskarte, Vorstellung } from '@infinimotion/model-frontend';
+
+export type ValidationResult = 'nothing' | 'invalid' | 'unpaid' | 'expired' | 'valid' | 'early' | 'cancelled' | 'loading' | 'error';
+
+@Component({
+ selector: 'app-ticket-validation-result',
+ standalone: false,
+ templateUrl: './ticket-validation-result.component.html',
+ styleUrl: './ticket-validation-result.component.css',
+})
+export class TicketValidationResultComponent {
+ result = input.required
();
+ performance = input();
+ ticket = input();
+ order = input();
+
+ get cancelledDate(): string {
+ if (!this.order()?.cancelled) return '';
+ return new Date(this.order()?.cancelled!).toLocaleDateString();
+ }
+}
diff --git a/src/app/ticket-validation/ticket-validation.component.css b/src/app/ticket-validation/ticket-validation.component.css
new file mode 100644
index 0000000..dd13be1
--- /dev/null
+++ b/src/app/ticket-validation/ticket-validation.component.css
@@ -0,0 +1,7 @@
+.middle {
+ position: relative;
+ top: 45%;
+ -webkit-transform: translateY(-50%);
+ -ms-transform: translateY(-50%);
+ transform: translateY(-50%);
+}
diff --git a/src/app/ticket-validation/ticket-validation.component.html b/src/app/ticket-validation/ticket-validation.component.html
new file mode 100644
index 0000000..62d71dd
--- /dev/null
+++ b/src/app/ticket-validation/ticket-validation.component.html
@@ -0,0 +1,61 @@
+
+
+
diff --git a/src/app/ticket-validation/ticket-validation.component.ts b/src/app/ticket-validation/ticket-validation.component.ts
new file mode 100644
index 0000000..76016df
--- /dev/null
+++ b/src/app/ticket-validation/ticket-validation.component.ts
@@ -0,0 +1,147 @@
+import { Component, DestroyRef, inject, OnInit } from '@angular/core';
+import { FormControl, Validators } from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+import { HttpService } from '../http.service';
+import { LoadingService } from '../loading.service';
+import { catchError, map, Observable, of, take } from 'rxjs';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { ValidationResult } from '../ticket-validation-result/ticket-validation-result.component';
+import { Bestellung, Eintrittskarte, Vorstellung } from '@infinimotion/model-frontend';
+
+@Component({
+ selector: 'app-ticket-validation',
+ standalone: false,
+ templateUrl: './ticket-validation.component.html',
+ styleUrl: './ticket-validation.component.css',
+})
+export class TicketValidationComponent implements OnInit {
+ private httpService = inject(HttpService);
+ private route = inject(ActivatedRoute);
+ private destroyRef = inject(DestroyRef);
+ public loadingService = inject(LoadingService);
+
+ queryError?: string;
+
+ result: ValidationResult = 'nothing';
+ performance?: Vorstellung;
+ ticket?: Eintrittskarte;
+ order?: Bestellung;
+
+ public ticketPattern = {
+ 'X': { pattern: /[A-Za-z0-9]/ },
+ 'T': { pattern: /[Tt]/ },
+ };
+
+ formControl = new FormControl('', {
+ validators: [
+ Validators.required,
+ Validators.minLength(8),
+ Validators.maxLength(8)
+ ]
+ });
+
+ 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) {
+ setTimeout(() => {
+ this.formControl.clearValidators();
+ this.formControl.setErrors({ [error]: true });
+ this.formControl.markAsTouched();
+ });
+
+ this.formControl.valueChanges.pipe(
+ take(1),
+ takeUntilDestroyed(this.destroyRef)
+ ).subscribe(() => {
+ this.formControl.setValidators([
+ Validators.required,
+ Validators.minLength(8),
+ Validators.maxLength(8)
+ ]);
+ 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 !== 8) return;
+
+ this.result = 'loading';
+ this.loadingService.show();
+ const ticketFilter = [`eq;code;string;${code}`];
+
+ this.httpService.getTicketsByFilter(ticketFilter).pipe(
+ map(tickets => {
+ this.loadingService.hide();
+
+ if (tickets.length === 0) {
+ this.result = 'invalid';
+ this.formControl.setErrors({ invalid: true });
+ return
+ }
+ if (tickets.length > 1) {
+ throw new Error("Für den Code existieren mehere Tickets");
+ // this.formControl.setErrors({ severalTickets: true });
+ return;
+ }
+
+ this.ticket = tickets[0];
+ this.order = this.ticket.order;
+ this.performance = this.ticket.show;
+ const now = new Date;
+
+ if (this.ticket.order.cancelled) {
+ this.result = 'cancelled';
+ return;
+ }
+
+ const showStart = new Date(this.ticket.show.start)
+ const showEnd = new Date(showStart.getTime() + this.ticket.show.movie.duration * 60 * 1000);
+ if (showEnd < now) {
+ this.result = 'expired';
+ return;
+ }
+
+ if (this.ticket.order.booked === null) {
+ this.result = 'unpaid';
+ return;
+ }
+
+ const twoHoursInMs = 2 * 60 * 60 * 1000;
+ const twoHoursBeforeShow = new Date(showStart.getTime() - twoHoursInMs);
+ if (now < twoHoursBeforeShow) {
+ this.result = 'early';
+ return;
+ }
+
+ this.result = 'valid';
+ }),
+ catchError(err => {
+ this.result = 'error';
+ this.loadingService.hide();
+ this.loadingService.showError(err);
+ // this.formControl.setErrors({ serverError: true });
+ console.log(err);
+ return of(null);
+ }),
+ takeUntilDestroyed(this.destroyRef)
+ ).subscribe();
+ }
+}
diff --git a/src/index.html b/src/index.html
index 2df19e0..6f0646b 100644
--- a/src/index.html
+++ b/src/index.html
@@ -8,6 +8,7 @@
+