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:
41
src/app/ticket-list/ticket-list.component.css
Normal file
41
src/app/ticket-list/ticket-list.component.css
Normal file
@@ -0,0 +1,41 @@
|
||||
.ticket-container {
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
padding: 8px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.ticket-container::before,
|
||||
.ticket-container::after {
|
||||
content: '';
|
||||
position: sticky;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 20px;
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.ticket-container::before {
|
||||
top: 0;
|
||||
background: linear-gradient(to bottom, rgba(0,0,0,0.1), transparent);
|
||||
}
|
||||
|
||||
.ticket-container::after {
|
||||
bottom: 0;
|
||||
background: linear-gradient(to top, rgba(0,0,0,0.1), transparent);
|
||||
}
|
||||
|
||||
|
||||
.ticket-container::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.ticket-container::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.ticket-container::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0,0,0,0.2);
|
||||
border-radius: 4px;
|
||||
}
|
||||
9
src/app/ticket-list/ticket-list.component.html
Normal file
9
src/app/ticket-list/ticket-list.component.html
Normal file
@@ -0,0 +1,9 @@
|
||||
<div class="ticket-container">
|
||||
@for (ticket of tickets(); track $index) {
|
||||
<app-ticket-small [ticket]="ticket"></app-ticket-small>
|
||||
@if ($index + 1 != tickets().length) {
|
||||
<div class="h-2"></div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
|
||||
12
src/app/ticket-list/ticket-list.component.ts
Normal file
12
src/app/ticket-list/ticket-list.component.ts
Normal file
@@ -0,0 +1,12 @@
|
||||
import { Component, input } from '@angular/core';
|
||||
import { Eintrittskarte } from '@infinimotion/model-frontend';
|
||||
|
||||
@Component({
|
||||
selector: 'app-ticket-list',
|
||||
standalone: false,
|
||||
templateUrl: './ticket-list.component.html',
|
||||
styleUrl: './ticket-list.component.css',
|
||||
})
|
||||
export class TicketListComponent {
|
||||
tickets = input.required<Eintrittskarte[]>();
|
||||
}
|
||||
Reference in New Issue
Block a user