Rampeur
292 lines
16 KiB
HTML
292 lines
16 KiB
HTML
<h2 mat-dialog-title class="bg-warn border-bottom border-light-subtle d-flex mb-3 pt-3 pb-2">
|
|
Ajouter un saut<span class="flex-spacer"></span>
|
|
<mat-icon fontIcon="close" class="pointer" (click)="closeDialog()"></mat-icon>
|
|
</h2>
|
|
<mat-dialog-content>
|
|
<div class="container">
|
|
<!--
|
|
<div class="row">
|
|
<div class="col-xs-12 border-bottom border-dark pb-2 mb-2">
|
|
<mat-form-field appearance="outline" class="mt-2 me-2" color="warn">
|
|
<mat-label>Numéro ou plage de saut à ajouter</mat-label>
|
|
<input matInput [(ngModel)]="params.numeros" required />
|
|
<mat-hint>645 / +5 / 650-660</mat-hint>
|
|
</mat-form-field>
|
|
<mat-form-field appearance="outline" class="mt-2 me-3" color="warn">
|
|
<mat-label>Choisissez une date</mat-label>
|
|
<input matInput [matDatepicker]="datepicker" [(ngModel)]="params.date" (dateChange)="onDateChange()" required />
|
|
<mat-hint>MM/DD/YYYY</mat-hint>
|
|
<mat-datepicker-toggle matIconSuffix [for]="datepicker"></mat-datepicker-toggle>
|
|
<mat-datepicker #datepicker>
|
|
<mat-datepicker-actions>
|
|
<button mat-button matDatepickerCancel>Annuler</button>
|
|
<button mat-raised-button color="warn" matDatepickerApply>Appliquer</button>
|
|
</mat-datepicker-actions>
|
|
</mat-datepicker>
|
|
</mat-form-field>
|
|
<mat-checkbox (change)="setLastJump($event.checked)" [checked]="useLast.all">
|
|
<mat-icon fontIcon="history" class="align-middle me-2"></mat-icon> <span class="d-inline-block align-middle">Utiliser les valeurs du dernier saut</span>
|
|
</mat-checkbox>
|
|
</div>
|
|
</div>
|
|
-->
|
|
<form class="row" [formGroup]="jumpForm" (ngSubmit)="submitForm()">
|
|
<div class="col-xs-12 border-bottom border-dark pb-2 mb-2">
|
|
<mat-form-field appearance="outline" class="mt-2 me-2" color="warn">
|
|
<mat-label>Numéro ou plage de saut à ajouter</mat-label>
|
|
<input matInput formControlName="numero" required />
|
|
<mat-hint>645 / +5 / 650-660</mat-hint>
|
|
</mat-form-field>
|
|
<mat-form-field appearance="outline" class="mt-2 me-3" color="warn">
|
|
<mat-label>Choisissez une date</mat-label>
|
|
<input matInput [matDatepicker]="datepicker" formControlName="date" (dateChange)="onDateChange()" required cdkFocusInitial />
|
|
<mat-hint>MM/DD/YYYY</mat-hint>
|
|
<mat-datepicker-toggle matIconSuffix [for]="datepicker"></mat-datepicker-toggle>
|
|
<mat-datepicker #datepicker>
|
|
<mat-datepicker-actions>
|
|
<button mat-button matDatepickerCancel>Annuler</button>
|
|
<button mat-raised-button color="warn" matDatepickerApply>Appliquer</button>
|
|
</mat-datepicker-actions>
|
|
</mat-datepicker>
|
|
</mat-form-field>
|
|
<mat-checkbox (change)="setLastJump($event.checked)" [checked]="useLast.all">
|
|
<mat-icon fontIcon="history" class="align-middle me-2"></mat-icon> <span class="d-inline-block align-middle">Utiliser les valeurs du dernier saut</span>
|
|
</mat-checkbox>
|
|
</div>
|
|
<div class="col-lg-6 col-md-12">
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
|
Dropzone
|
|
<mat-checkbox class="float-end" (change)="setLastDropzone($event.checked)" [checked]="useLast.dropzone">
|
|
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
|
</mat-checkbox>
|
|
</h4>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Lieu</mat-label>
|
|
<input matInput formControlName="lieu" [matAutocomplete]="autoDropzone">
|
|
<mat-autocomplete #autoDropzone="matAutocomplete" [displayWith]="displayLieuFn">
|
|
@for (option of filteredOptions.dropzones | async; track option) {
|
|
<mat-option [value]="option" (onSelectionChange)="onSelLieu(option)">{{option.lieu}} - {{option.oaci}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
@if (this.jumpForm.controls['lieu'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('lieu')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Oaci</mat-label>
|
|
<input matInput formControlName="oaci" [matAutocomplete]="autoOaci">
|
|
<mat-autocomplete #autoOaci="matAutocomplete" [displayWith]="displayOaciFn">
|
|
@for (option of filteredOptions.oaci | async; track option) {
|
|
<mat-option [value]="option" (onSelectionChange)="onSelOaci(option)">{{option.lieu}} - {{option.oaci}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
@if (this.jumpForm.controls['oaci'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('oaci')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
|
Aéronef
|
|
<mat-checkbox class="float-end" (change)="setLastAeronef($event.checked)" [checked]="useLast.aeronef">
|
|
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
|
</mat-checkbox>
|
|
</h4>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Aéronef</mat-label>
|
|
<input matInput formControlName="aeronef" [matAutocomplete]="autoAeronef">
|
|
<mat-autocomplete #autoAeronef="matAutocomplete" [displayWith]="displayAeronefFn">
|
|
@for (option of filteredOptions.aeronefs | async; track option) {
|
|
<mat-option [value]="option" (onSelectionChange)="onSelAeronef(option)">{{option.aeronef}} - {{option.imat}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
@if (this.jumpForm.controls['aeronef'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('aeronef')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Imatriculation</mat-label>
|
|
<input matInput formControlName="imat" [matAutocomplete]="autoImat">
|
|
<mat-autocomplete #autoImat="matAutocomplete" [displayWith]="displayImatFn">
|
|
@for (option of filteredOptions.imats | async; track option) {
|
|
<mat-option [value]="option" (onSelectionChange)="onSelImat(option)">{{option.aeronef}} - {{option.imat}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
@if (this.jumpForm.controls['imat'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('imat')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
|
Voile
|
|
<mat-checkbox class="float-end" (change)="setLastVoile($event.checked)" [checked]="useLast.voile">
|
|
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
|
</mat-checkbox>
|
|
</h4>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Modèle</mat-label>
|
|
<input matInput formControlName="voile" [matAutocomplete]="autoCanopy">
|
|
<mat-autocomplete #autoCanopy="matAutocomplete" [displayWith]="displayVoileFn">
|
|
@for (option of filteredOptions.canopies | async; track option) {
|
|
<mat-option [value]="option" (onSelectionChange)="onSelVoile(option)">{{option.voile}} - {{option.taille}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
@if (this.jumpForm.controls['voile'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('voile')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Taille en ft<sup>2</sup></mat-label>
|
|
<input matInput formControlName="taille" [matAutocomplete]="autoTaille">
|
|
<mat-autocomplete #autoTaille="matAutocomplete" [displayWith]="displayTailleFn">
|
|
@for (option of filteredOptions.tailles | async; track option) {
|
|
<mat-option [value]="option" (onSelectionChange)="onSelTaille(option)">{{option.voile}} - {{option.taille}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
<span matTextSuffix>ft<sup>2</sup></span>
|
|
@if (this.jumpForm.controls['taille'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('taille')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-lg-6 col-md-12">
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
|
Altitude
|
|
<mat-checkbox class="float-end" (change)="setLastAltitude($event.checked)" [checked]="useLast.altitude">
|
|
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
|
</mat-checkbox>
|
|
</h4>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Hauteur de largage</mat-label>
|
|
<input matInput formControlName="hauteur" type="number" min="0" step="1">
|
|
@if (this.jumpForm.controls['hauteur'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('hauteur')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Hauteur de déploiement</mat-label>
|
|
<input matInput formControlName="deploiement" type="number" min="0" step="1">
|
|
@if (this.jumpForm.controls['deploiement'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('deploiement')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
|
Discipline
|
|
<mat-checkbox class="float-end" (change)="setLastDiscipline($event.checked)" [checked]="useLast.discipline">
|
|
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
|
</mat-checkbox>
|
|
</h4>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Categorie</mat-label>
|
|
<input matInput formControlName="categorie" [matAutocomplete]="autoCategorie">
|
|
<mat-autocomplete #autoCategorie="matAutocomplete" [displayWith]="displayCategorieFn">
|
|
@for (option of filteredOptions.categories | async; track option) {
|
|
<mat-option [value]="option" (onSelectionChange)="onSelCategorie(option)">{{option.categorie}}{{option.categorie && option.module ? ' - ' : ''}}{{option.module}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
@if (this.jumpForm.controls['categorie'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('categorie')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Module</mat-label>
|
|
<input matInput formControlName="module" [matAutocomplete]="autoModule">
|
|
<mat-autocomplete #autoModule="matAutocomplete" [displayWith]="displayModuleFn">
|
|
@for (option of filteredOptions.modules | async; track option) {
|
|
<mat-option [value]="option" (onSelectionChange)="onSelModule(option)">{{option.categorie}}{{option.categorie && option.module ? ' - ' : ''}}{{option.module}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
@if (this.jumpForm.controls['module'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('module')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
|
Divers
|
|
<mat-checkbox class="float-end" (change)="setLastDivers($event.checked)" [checked]="useLast.divers">
|
|
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
|
</mat-checkbox>
|
|
</h4>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Accessoires</mat-label>
|
|
<input matInput formControlName="accessoires">
|
|
@if (this.jumpForm.controls['accessoires'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('accessoires')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Zone</mat-label>
|
|
<input matInput formControlName="zone">
|
|
@if (this.jumpForm.controls['zone'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('zone')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-lg-6 col-md-12">
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
|
Groupe
|
|
<mat-checkbox class="float-end" (change)="setLastGroupe($event.checked)" [checked]="useLast.groupe">
|
|
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
|
</mat-checkbox>
|
|
</h4>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Sautants</mat-label>
|
|
<input matInput placeholder="Ajouter un sautant" [formControl]="tagField" (keyup.enter)="addSautant()">
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Nombre de participants</mat-label>
|
|
<input matInput formControlName="participants" type="number" min="0" step="1">
|
|
@if (this.jumpForm.controls['participants'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('participants')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<div class="mb-2">
|
|
@for (sautant of jump.sautants; track sautant) {
|
|
<span class="badge rounded-pill bg-primary mb-2 me-1 pe-3 py-1 fw-normal text-dark">
|
|
<mat-icon class="align-middle pointer me-1" fontIcon="close" (click)="removeSautant(sautant)"></mat-icon>
|
|
{{ sautant }}
|
|
</span>
|
|
}
|
|
<span class="badge rounded-pill bg-accent mb-2 me-1 pe-3 py-1 fw-normal text-dark">
|
|
<mat-icon class="align-middle pointer me-1" fontIcon="person"></mat-icon>
|
|
{{ lastJump.author.username }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6 col-md-12">
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
|
Programme
|
|
<mat-checkbox class="float-end" (change)="setLastProgramme($event.checked)" [checked]="useLast.programme">
|
|
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
|
</mat-checkbox>
|
|
</h4>
|
|
<mat-form-field appearance="fill" class="me-2 w-100" color="warn">
|
|
<mat-label>Programme</mat-label>
|
|
<textarea matInput formControlName="programme"></textarea>
|
|
@if (this.jumpForm.controls['programme'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('programme')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<h4 class="border-bottom border-secondary mb-3 lh-lg">Vidéo</h4>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Dossier</mat-label>
|
|
<input matInput formControlName="dossier">
|
|
@if (this.jumpForm.controls['dossier'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('dossier')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="me-2" color="warn">
|
|
<mat-label>Video</mat-label>
|
|
<input matInput formControlName="video">
|
|
@if (this.jumpForm.controls['video'].status === 'INVALID') {
|
|
<mat-error>{{getErrorMessage('video')}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<span class="d-inline-block align-middle ms-1">{{ filepath }}{{ filename }}</span>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</mat-dialog-content>
|
|
<mat-dialog-actions>
|
|
<span class="flex-spacer"></span>
|
|
<button mat-button (click)="closeDialog()" class="me-1">Annuler</button>
|
|
<!--<button mat-button color="warn" [disabled]="!jumpForm.valid" [mat-dialog-close]="{jump: jump, params: params}" cdkFocusInitial>Enregistrer</button>-->
|
|
<button mat-button color="warn" [disabled]="!jumpForm.valid" (click)="submitForm()">Enregistrer</button>
|
|
</mat-dialog-actions>
|