mokkenstorm.dev
fork of hey-api/openapi-ts because I need some additional things
1@let pet = petState.data();
2<div class="pet-store-header">
3 <button mat-raised-button color="primary" (click)="getRandomPet()">Get Random Pet</button>
4
5 <mat-card class="pet-card mat-elevation-z8">
6 @if (petState.isLoading()) {
7 <mat-spinner />
8 }
9
10 @if (pet) {
11 <mat-card-header>
12 <mat-card-title class="pet-card-title">{{ pet.name }}</mat-card-title>
13 <mat-card-subtitle class="pet-card-subtitle">{{ pet.category?.name }}</mat-card-subtitle>
14 </mat-card-header>
15 <!-- <img mat-card-image [src]="pet.photoUrls.at(0)" alt="{{ pet.name }}" class="pet-card-image" /> -->
16 <mat-card-content>
17 <p class="pet-status">
18 Status: <b>{{ pet.status }}</b>
19 </p>
20 </mat-card-content>
21 }
22 </mat-card>
23</div>
24
25@if (addPet.data()) {
26 <pre>
27 <code>{{addPet.data()|json}}</code>
28 </pre>
29}
30
31@if (updatePet.data()) {
32 <pre>
33 <code>{{updatePet.data()|json}}</code>
34 </pre>
35}
36
37<form #petForm="ngForm" (submit)="onSubmit(petForm)">
38 <mat-card class="pet-form-card mat-elevation-z4">
39 <mat-card-header>
40 <mat-card-title><span class="pet-form-title">Pet Form</span></mat-card-title>
41 </mat-card-header>
42 <mat-card-content class="pet-form-content">
43 <mat-form-field appearance="fill">
44 <mat-label>Name</mat-label>
45 <input matInput name="name" [(ngModel)]="nextPetState.name" required />
46 </mat-form-field>
47 </mat-card-content>
48 <mat-card-footer>
49 <mat-card-actions class="actions">
50 <button mat-raised-button color="primary" type="submit">Add Pet</button>
51 <button mat-stroked-button color="accent" (click)="handleUpdatePet($event)">
52 Update Pet
53 </button>
54 </mat-card-actions>
55 </mat-card-footer>
56 </mat-card>
57</form>