-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #8 from UdL-EPS-SoftArch/pets-pages
Pet pages
- Loading branch information
Showing
37 changed files
with
2,161 additions
and
6 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,4 @@ | ||
| .form-error { | ||
| color: red; | ||
| font-size: x-small; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,198 @@ | ||
| <form | ||
| id="cat-form" | ||
| (ngSubmit)="onSubmit()" | ||
| #form="ngForm" | ||
| [formGroup]="catForm" | ||
| > | ||
| <fieldset> | ||
| <div class="row"> | ||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="name">Name</label> | ||
| <input | ||
| id="name" | ||
| name="name" | ||
| formControlName="name" | ||
| type="text" | ||
| class="form-control" | ||
| [(ngModel)]="cat.name" | ||
| /> | ||
| <div class="form-error" *ngIf="name.errors?.['required']"> | ||
| Name is required | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="chip">Chip</label> | ||
| <input | ||
| id="chip" | ||
| name="chip" | ||
| formControlName="chip" | ||
| type="text" | ||
| class="form-control" | ||
| [(ngModel)]="cat.chip" | ||
| /> | ||
| <div class="form-error" *ngIf="chip.errors?.['required']"> | ||
| Chip is required | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="dateOfBirth">Date of birth</label> | ||
| <input | ||
| id="dateOfBirth" | ||
| name="dateOfBirth" | ||
| formControlName="dateOfBirth" | ||
| type="date" | ||
| class="form-control" | ||
| [(ngModel)]="cat.dateOfBirth" | ||
| /> | ||
| <div class="form-error" *ngIf="dateOfBirth.errors?.['required']"> | ||
| Date of birth is required | ||
| </div> | ||
| <div | ||
| class="form-error" | ||
| *ngIf="dateOfBirth.errors?.['invalidDate'] && !dateOfBirth.errors?.['required']" | ||
| > | ||
| Invalid date | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="colour">Colour</label> | ||
| <input | ||
| id="colour" | ||
| name="colour" | ||
| formControlName="colour" | ||
| type="color" | ||
| class="form-control" | ||
| [(ngModel)]="cat.colour" | ||
| /> | ||
| <div class="form-error" *ngIf="colour.errors?.['required']"> | ||
| Colour is required | ||
| </div> | ||
| <div | ||
| class="form-error" | ||
| *ngIf="colour.errors?.['invalidColour'] && !colour.errors?.['required']" | ||
| > | ||
| Invalid date | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="size">Size</label> | ||
| <select | ||
| id="size" | ||
| name="size" | ||
| formControlName="size" | ||
| class="form-control" | ||
| [(ngModel)]="cat.size" | ||
| > | ||
| <option value="1">Small</option> | ||
| <option value="2">Average</option> | ||
| <option value="3">Large</option> | ||
| <option value="4">Extra Large</option> | ||
| </select> | ||
| <div class="form-error" *ngIf="size.errors?.['required']"> | ||
| Size is required | ||
| </div> | ||
| <div | ||
| class="form-error" | ||
| *ngIf="size.errors?.['invalidNumber'] && !size.errors?.['required']" | ||
| > | ||
| Size is invalid | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="sex">Sex</label> | ||
| <select | ||
| id="sex" | ||
| name="sex" | ||
| formControlName="sex" | ||
| class="form-control" | ||
| [(ngModel)]="cat.sex" | ||
| > | ||
| <option value="male">Male</option> | ||
| <option value="female">Female</option> | ||
| </select> | ||
| <div class="form-error" *ngIf="sex.errors?.['required']"> | ||
| Sex is required | ||
| </div> | ||
| <div | ||
| class="form-error" | ||
| *ngIf="sex.errors?.['invalidSex'] && !sex.errors?.['required']" | ||
| > | ||
| Sex is invalid | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="name">Race</label> | ||
| <input | ||
| id="race" | ||
| name="race" | ||
| formControlName="race" | ||
| type="text" | ||
| class="form-control" | ||
| [(ngModel)]="cat.race" | ||
| /> | ||
| <div class="form-error" *ngIf="race.errors?.['required']"> | ||
| Race is required | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="dangerous">Dangerous</label> | ||
| <input | ||
| id="dangerous" | ||
| name="dangerous" | ||
| formControlName="dangerous" | ||
| type="checkbox" | ||
| clasS="ms-3" | ||
| [(ngModel)]="cat.dangerous" | ||
| /> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3 col-6"> | ||
| <label class="control-label required-label" for="meowingLevel">Meowing Level</label> | ||
| <select | ||
| id="meowingLevel" | ||
| name="meowingLevel" | ||
| formControlName="meowingLevel" | ||
| class="form-control" | ||
| [(ngModel)]="cat.meowingLevel" | ||
| > | ||
| <option value="1">No meowing</option> | ||
| <option value="2">Low meowing</option> | ||
| <option value="3">Average meowing</option> | ||
| <option value="4">Loud meowing</option> | ||
| </select> | ||
| <div class="form-error" *ngIf="meowingLevel.errors?.['required']"> | ||
| Meowing level is required | ||
| </div> | ||
| </div> | ||
|
|
||
| </div> | ||
|
|
||
| <!-- Save and back buttons --> | ||
| <div class="form-group fa-pull-right mt-3"> | ||
| <button | ||
| id="listBtn" | ||
| type="button" | ||
| [routerLink]="['/cats']" | ||
| class="btn btn-outline-primary pull-right" | ||
| > | ||
| Back | ||
| </button> | ||
| <button | ||
| id="submit" | ||
| type="submit" | ||
| [disabled]="!form.form.valid" | ||
| class="btn btn-success ms-3" | ||
| > | ||
| <i class="fa fa-plus-circle me-2"></i> | ||
| Create | ||
| </button> | ||
| </div> | ||
| </fieldset> | ||
| </form> |
Oops, something went wrong.