Fix the page view
This commit is contained in:
Sébastien ANDRE
2023-06-19 20:37:49 +02:00
parent 7155ad1eae
commit d937938832
11 changed files with 132 additions and 40 deletions

View File

@@ -1,12 +1,48 @@
<div class="content">
<form class="formNewJumps" (ngSubmit)="onFormSubmit()" *ngIf="notLoadingToDisplay() else loading">
<form class="formNewJumps" (ngSubmit)="onFormSubmit()" *ngIf="notLoadingToDisplay() else loading">
<mat-form-field>
<mat-label>{{ 'NewTunnelFlight_ChooseTunnel' | translate }}</mat-label>
<input type="text" matInput [matAutocomplete]="autoDropZone" [(ngModel)]="selectedTunnel"
(ngModelChange)="onChangeTunnel($event)" name="selectedTunnel">
<mat-autocomplete #autoDropZone="matAutocomplete" [displayWith]="displayNameFn">
<mat-option *ngFor="let tunnel of listOfFilteredTunnel" [value]="tunnel">
{{tunnel.name}}
</mat-option>
</mat-autocomplete>
<button *ngIf="selectedTunnel" matSuffix mat-icon-button aria-label="Clear" (click)="resetTunnel()">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<br />
<button mat-raised-button color="accent" *ngIf="isValidatedForm()">{{ 'NewJump_Submit' | translate }}</button>
</form>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
<mat-form-field>
<input matInput [matDatepicker]="flightDateDp" [(ngModel)]="flightDate" name="flightDate" disabled>
<mat-datepicker-toggle matSuffix [for]="flightDateDp"></mat-datepicker-toggle>
<mat-datepicker #flightDateDp disabled="false"></mat-datepicker>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="{{ 'NewTunnelFlight_Minutes' | translate }}" [(ngModel)]="minutesOfFlight"
name="minutesOfFlight" type="number">
<button *ngIf="minutesOfFlight" matSuffix mat-icon-button aria-label="Clear" (click)="minutesOfFlight=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<textarea matInput placeholder="{{ 'NewTunnelFlight_Comments' | translate }}" [(ngModel)]="comments"
name="comments" type="text"></textarea>
<button *ngIf="comments" matSuffix mat-icon-button aria-label="Clear" (click)="comments=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<br />
<button mat-raised-button color="accent" *ngIf="isValidatedForm()">{{ 'NewTunnelFlight_Submit' | translate
}}</button>
</form>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>