Add PDF ticket generation and download feature

Introduces PDF ticket generation using html2canvas and jsPDF, including a new PdfTicketComponent for ticket rendering and a PdfService for PDF creation. Updates purchase success flow to allow users to download tickets as PDFs, adds progress feedback, and includes a test route and component for development. Also refactors order form with a fake fill helper and improves UI details.

src/app/order/order.component.html

@@ -158,7 +158,10 @@
             <!-- Card Name -->
             <mat-form-field class="w-full">
               <mat-label>Name des Besitzers</mat-label>
-              <input matInput formControlName="cardName" />
+              <input
+                matInput
+                formControlName="cardName"
+              />
               @if (fPayment['cardName'].hasError('minlength')) { <mat-error>Mindestens 3 Zeichen</mat-error> }
             </mat-form-field>
 
@@ -178,14 +181,19 @@
 
               <mat-form-field class="flex-1">
                 <mat-label>CVV</mat-label>
-                <input matInput type="password" maxlength="4" formControlName="cvv" />
+                <input
+                  matInput
+                  type="password"
+                  maxlength="4"
+                  formControlName="cvv"
+                />
                 @if (fPayment['cvv'].hasError('pattern')) { <mat-error>3–4 Ziffernt</mat-error> }
               </mat-form-field>
             </div>
 
             <!-- Info -->
             <div class="flex w-full space-x-2 mt-2 items-center">
-              <mat-icon class="material-symbols-outlined opacity-50" style="font-size: 32px; width: 32px; height: 32px">
+              <mat-icon class="material-symbols-outlined opacity-50" style="font-size: 32px; width: 32px; height: 32px" (click)="fakeFormFill()">
                 encrypted
               </mat-icon>
               <p class="text-sm opacity-75">

src/app/order/order.component.ts

@@ -412,4 +412,13 @@ export class OrderComponent {
     this.orderState.set({ status: 'idle' });
     this.cancelReservation();
   }
+
+  fakeFormFill() {
+    this.paymentForm.patchValue({
+      cardNumber: '4111 1111 1111 1111',
+      cardName: 'Max Mustermann',
+      expiry: '12/30',
+      cvv: '123'
+    });
+  }
 }