120 lines
3.3 KiB
HTML
120 lines
3.3 KiB
HTML
<p>Create Hotel</p>
|
|
|
|
<form [formGroup]="hotelForm">
|
|
<div class="text-red-500 bg-white m-3" *ngIf="errorMessages['form']">
|
|
{{ errorMessages["form"] }}
|
|
</div>
|
|
|
|
<label for="name">Name</label>
|
|
<div class="text-red-500" *ngIf="errorMessages['name']">
|
|
{{ errorMessages["name"] }}
|
|
</div>
|
|
<input
|
|
type="text"
|
|
class="border-red-500"
|
|
[class.border-8]="
|
|
hotelForm.get('name')?.invalid && hotelForm.get('name')?.touched
|
|
"
|
|
id="name"
|
|
formControlName="name"
|
|
/>
|
|
<label for="description">Description</label>
|
|
<div class="text-red-500" *ngIf="errorMessages['description']">
|
|
{{ errorMessages["description"] }}
|
|
</div>
|
|
<input
|
|
type="text"
|
|
class="border-red-500"
|
|
[class.border-8]="
|
|
hotelForm.get('description')?.invalid &&
|
|
hotelForm.get('description')?.touched
|
|
"
|
|
id="description"
|
|
formControlName="description"
|
|
/>
|
|
<label for="imageUrl">Image</label>
|
|
<div class="text-red-500" *ngIf="errorMessages['imageUrl']">
|
|
{{ errorMessages["imageUrl"] }}
|
|
</div>
|
|
<input
|
|
type="url"
|
|
class="border-red-500"
|
|
[class.border-8]="
|
|
hotelForm.get('imageUel')?.invalid && hotelForm.get('imageUrl')?.touched
|
|
"
|
|
id="imageUrl"
|
|
formControlName="imageUrl"
|
|
/>
|
|
<label for="price">Price</label>
|
|
<div class="text-red-500" *ngIf="errorMessages['price']">
|
|
{{ errorMessages["price"] }}
|
|
</div>
|
|
<input
|
|
type="number"
|
|
class="border-red-500"
|
|
[class.border-8]="hotelForm.get('price')?.invalid"
|
|
id="price"
|
|
formControlName="price"
|
|
/>
|
|
<label for="rating">Rating</label>
|
|
<div class="text-red-500" *ngIf="errorMessages['rating']">
|
|
{{ errorMessages["rating"] }}
|
|
</div>
|
|
<input
|
|
type="rating"
|
|
class="border-red-500"
|
|
[class.border-8]="hotelForm.get('rating')?.invalid"
|
|
id="rating"
|
|
formControlName="rating"
|
|
/>
|
|
<button class="submit-button" (click)="addTag()">Add Tag</button>
|
|
@for (tag of getTags().controls; track tag) {
|
|
<input
|
|
type="tag"
|
|
class="border-red-500"
|
|
[class.border-8]="hotelForm.get('tag')?.invalid"
|
|
id="tag"
|
|
formControlName="tag"
|
|
/>
|
|
<button (click)="deleteTag(tag)" class="delete-button">delete</button>
|
|
}
|
|
|
|
<input type="radio" value="None" formControlName="contactType" />None
|
|
<input type="radio" value="Email" formControlName="contactType" />Email
|
|
<input type="radio" value="SMS" formControlName="contactType" />SMS
|
|
|
|
@if (hotelForm.get("contactType")?.value == "Email") {
|
|
<div class="mt-3">
|
|
<label for="email">Email</label>
|
|
<input type="email" formControlName="email" id="email" />
|
|
<label for="emailConfirmation">Email Confirmation</label>
|
|
<input
|
|
type="email"
|
|
formControlName="emailConfirmation"
|
|
id="emailConfirmation"
|
|
/>
|
|
</div>
|
|
}
|
|
@if (hotelForm.get("contactType")?.value == "SMS") {
|
|
<div class="mt-3">
|
|
<label for="phone">Phone Number</label>
|
|
<input type="tel" formControlName="phone" id="phone" />
|
|
<label for="phoneConfirmation">Phone Number Confirmation</label>
|
|
<input
|
|
type="tel"
|
|
formControlName="phoneConfirmation"
|
|
id="phoneConfirmation"
|
|
/>
|
|
</div>
|
|
}
|
|
|
|
<button
|
|
class="submit-button"
|
|
(click)="submit()"
|
|
[disabled]="!hotelForm.valid"
|
|
type="submit"
|
|
>
|
|
Submit
|
|
</button>
|
|
<a routerLink="/" class="delete-button">Cancel</a>
|
|
</form>
|