Add reservation and purchase functionality
Introduces ReservationSuccess, ReservationFailed, PurchaseSuccess, PurchaseFailed, TicketSmall, and TicketList components for handling and displaying reservation and purchase outcomes. Updates order flow logic in OrderComponent to support reservation and purchase states, disables/enables form inputs during submission, and integrates new UI feedback. Also adds angularx-qrcode dependency and updates @infinimotion/model-frontend version.
This commit is contained in:
@@ -0,0 +1,17 @@
|
||||
<div class="bg-green-200 rounded-md shadow-sm w-full h-fit p-6 py-8 items-center justify-center flex flex-col space-y-2">
|
||||
<h1 class="text-xl font-bold">Reservierung erfolgreich!</h1>
|
||||
<!-- <p class="text-center">Ihre Sitzplätze wurden reserviert. </p> -->
|
||||
|
||||
<p class="text-center">Ihre Sitzplätze wurden erfolgreich reserviert. Bitte nennen sie den folgenden Code an der Kasse, um Ihre Reservierung in eine Buchung umzuwandeln.</p>
|
||||
<div class="bg-white text-5xl font-mono rounded-md shadow-sm w-fit h-fit p-4 py-2 my-4">
|
||||
<strong>{{ order().code }}</strong>
|
||||
</div>
|
||||
|
||||
<button routerLink="/schedule" mat-button matButton="filled" class="success-button mt-4 w-80">Zurück zur Programmauswahl</button>
|
||||
<button [disabled]="true" mat-button matButton="outlined" color="accent" class="success-button w-80">Tickets jetzt online bezahlen</button>
|
||||
<div class="text-green-500 cursor-pointer w-fit mt-1" (click)="cancelReservation()">
|
||||
Reservierung stornieren
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
16
src/app/reservation-success/reservation-success.component.ts
Normal file
16
src/app/reservation-success/reservation-success.component.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
import { Bestellung } from '@infinimotion/model-frontend';
|
||||
import { Component, input } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-reservation-success',
|
||||
standalone: false,
|
||||
templateUrl: './reservation-success.component.html',
|
||||
styleUrl: './reservation-success.component.css',
|
||||
})
|
||||
export class ReservationSuccessComponent {
|
||||
order = input.required<Bestellung>();
|
||||
|
||||
cancelReservation() {
|
||||
// Logic to cancel the reservation
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user