---|qcm| Mise à jour V17 et QCM
This commit is contained in:
Rampeur
@@ -1,4 +0,0 @@
|
||||
export * from './jump-add.dialog';
|
||||
export * from './jump-delete.dialog';
|
||||
export * from './jump-edit.dialog';
|
||||
export * from './jump-view.dialog';
|
||||
@@ -1,349 +0,0 @@
|
||||
<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 />
|
||||
<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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['lieu'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['oaci'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['aeronef'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['imat'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['voile'].status === 'INVALID'">{{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" type="number" min="0" step="1">
|
||||
<span matTextSuffix>ft<sup>2</sup></span>
|
||||
<mat-error *ngIf="this.jumpForm.controls['taille'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['hauteur'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['deploiement'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['categorie'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['module'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['accessoires'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['zone'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['participants'].status === 'INVALID'">{{getErrorMessage('participants')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<div class="mb-2">
|
||||
<span *ngFor="let sautant of jump.sautants" 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>
|
||||
ju_solide
|
||||
</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>
|
||||
<mat-error *ngIf="this.jumpForm.controls['programme'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['dossier'].status === 'INVALID'">{{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">
|
||||
<mat-error *ngIf="this.jumpForm.controls['video'].status === 'INVALID'">{{getErrorMessage('video')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<span class="d-inline-block align-middle ms-1">{{ filepath }}{{ filename }}</span>
|
||||
</div>
|
||||
</form>
|
||||
<div class="row" [hidden]="true">
|
||||
<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)" [(ngModel)]="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 [(ngModel)]="jump.lieu">
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2" color="warn">
|
||||
<mat-label>Oaci</mat-label>
|
||||
<input matInput [(ngModel)]="jump.oaci">
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
||||
Aéronef
|
||||
<mat-checkbox class="float-end" (change)="setLastAeronef($event.checked)" [(ngModel)]="useLast.aeronef">
|
||||
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
||||
</mat-checkbox>
|
||||
</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Aéronef</mat-label>
|
||||
<input matInput [(ngModel)]="jump.aeronef">
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Imatriculation</mat-label>
|
||||
<input matInput [(ngModel)]="jump.imat">
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
||||
Voile
|
||||
<mat-checkbox class="float-end" (change)="setLastVoile($event.checked)" [(ngModel)]="useLast.voile">
|
||||
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
||||
</mat-checkbox>
|
||||
</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Modèle</mat-label>
|
||||
<input matInput [(ngModel)]="jump.voile">
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Taille</mat-label>
|
||||
<input matInput [(ngModel)]="jump.taille" type="number" min="0" step="1">
|
||||
</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)" [(ngModel)]="useLast.altitude">
|
||||
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
||||
</mat-checkbox>
|
||||
</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Hauteur</mat-label>
|
||||
<input matInput [(ngModel)]="jump.hauteur" type="number" min="0" step="1">
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Hauteur de déploiement</mat-label>
|
||||
<input matInput [(ngModel)]="jump.deploiement" type="number" min="0" step="1">
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
||||
Discipline
|
||||
<mat-checkbox class="float-end" (change)="setLastDiscipline($event.checked)" [(ngModel)]="useLast.discipline">
|
||||
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
||||
</mat-checkbox>
|
||||
</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Categorie</mat-label>
|
||||
<input matInput [(ngModel)]="jump.categorie">
|
||||
<mat-hint>FF / Solo / VR / Wingsuit</mat-hint>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Module</mat-label>
|
||||
<input matInput [(ngModel)]="jump.module">
|
||||
<mat-hint>Chutas / Track / Trace</mat-hint>
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-secondary mb-3 lh-lg">
|
||||
Divers
|
||||
<mat-checkbox class="float-end" (change)="setLastDivers($event.checked)" [(ngModel)]="useLast.divers">
|
||||
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
||||
</mat-checkbox>
|
||||
</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Accessoires</mat-label>
|
||||
<input matInput [(ngModel)]="jump.accessoires">
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Zone</mat-label>
|
||||
<input matInput [(ngModel)]="jump.zone">
|
||||
</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)" [(ngModel)]="useLast.groupe">
|
||||
<mat-icon fontIcon="history" class="align-middle"></mat-icon>
|
||||
</mat-checkbox>
|
||||
</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Sautants</mat-label>
|
||||
<input matInput type="text" placehomder="Ajouter un sautant" [formControl]="tagField" (keyup.enter)="addSautant()">
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Nombre de participants</mat-label>
|
||||
<input matInput [(ngModel)]="jump.participants" type="number" min="0" step="1" [value]="jump.sautants.length+1">
|
||||
</mat-form-field>
|
||||
<div class="mb-2">
|
||||
<span *ngFor="let sautant of jump.sautants" 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>
|
||||
ju_solide
|
||||
</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" [(ngModel)]="params.video">
|
||||
<mat-icon fontIcon="videocam" class="align-middle"></mat-icon>
|
||||
</mat-checkbox>
|
||||
</h4>
|
||||
<mat-form-field appearance="fill" class="me-2 w-100">
|
||||
<mat-label>Programme</mat-label>
|
||||
<textarea matInput [(ngModel)]="jump.programme"></textarea>
|
||||
</mat-form-field>
|
||||
<span class="d-inline-block align-middle ms-1">{{ filepath }}{{ this.jumpForm.controls['date'].value | date: 'yyyy-MM-dd' }}_S00{{ nextJump }}.mp4</span>
|
||||
<span class="d-inline-block align-middle ms-1">{{ jump.dossier }}{{ jump.video }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</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()" cdkFocusInitial>Enregistrer</button>
|
||||
</mat-dialog-actions>
|
||||
@@ -1,486 +0,0 @@
|
||||
import { Component, Inject, OnDestroy } from '@angular/core';
|
||||
import { DatePipe, NgFor, NgIf } from '@angular/common';
|
||||
import { FormBuilder, FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatCheckboxModule } from '@angular/material/checkbox';
|
||||
import { MatDatepickerModule } from '@angular/material/datepicker';
|
||||
import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatOptionModule } from '@angular/material/core';
|
||||
import { MatSelectModule } from '@angular/material/select';
|
||||
import { Subscription } from 'rxjs';
|
||||
|
||||
import { Jump, JumpAddParams } from 'src/app/core/models';
|
||||
|
||||
@Component({
|
||||
selector: 'huapp-jump-add-dialog',
|
||||
templateUrl: 'jump-add.dialog.html',
|
||||
standalone: true,
|
||||
imports: [
|
||||
DatePipe, NgFor, NgIf, FormsModule, ReactiveFormsModule,
|
||||
MatButtonModule, MatCheckboxModule, MatDatepickerModule,
|
||||
MatDialogModule, MatFormFieldModule, MatIconModule,
|
||||
MatInputModule, MatSelectModule, MatOptionModule
|
||||
]
|
||||
})
|
||||
export class JumpAddDialogComponent implements OnDestroy {
|
||||
private _formChanges: Array<Subscription> = [];
|
||||
public tagField = new FormControl<string>('', { nonNullable: true});
|
||||
public jumpForm: FormGroup;
|
||||
public jump: Jump;
|
||||
public lastJump: Jump;
|
||||
public nextJump: number;
|
||||
public params: JumpAddParams;
|
||||
public filename: string;
|
||||
public filepath: string;
|
||||
public useLast: {
|
||||
all: boolean;
|
||||
aeronef: boolean;
|
||||
altitude: boolean;
|
||||
discipline: boolean;
|
||||
divers: boolean;
|
||||
dropzone: boolean;
|
||||
groupe: boolean;
|
||||
programme: boolean;
|
||||
voile: boolean;
|
||||
} = {
|
||||
all: false,
|
||||
aeronef: false,
|
||||
altitude: false,
|
||||
discipline: false,
|
||||
divers: false,
|
||||
dropzone: false,
|
||||
groupe: false,
|
||||
programme: false,
|
||||
voile: false
|
||||
};
|
||||
|
||||
constructor(
|
||||
public dialogRef: MatDialogRef<JumpAddDialogComponent>,
|
||||
private fb: FormBuilder,
|
||||
@Inject(MAT_DIALOG_DATA) public data: {jump: Jump, lastJump: Jump}
|
||||
) {
|
||||
this.jump = data.jump;
|
||||
this.lastJump = data.lastJump;
|
||||
this.nextJump = (this.lastJump.numero + 1);
|
||||
this.params = {
|
||||
numeros: this.nextJump.toString(),
|
||||
date: '',
|
||||
video: true
|
||||
};
|
||||
this.jump.numero = this.nextJump;
|
||||
let controlsConfig = {
|
||||
date: ['', Validators.required],
|
||||
numero: [this.nextJump, Validators.required],
|
||||
lieu: ['', Validators.required],
|
||||
oaci: '',
|
||||
aeronef: ['', Validators.required],
|
||||
imat: '',
|
||||
hauteur: ['', Validators.required],
|
||||
deploiement: '',
|
||||
voile: '',
|
||||
taille: ['', Validators.required],
|
||||
categorie: '',
|
||||
module: '',
|
||||
participants: [1, Validators.required],
|
||||
sautants: [[]],
|
||||
programme: '',
|
||||
accessoires: '',
|
||||
zone: '',
|
||||
dossier: '',
|
||||
video: ''
|
||||
};
|
||||
this.jumpForm = this.fb.group(controlsConfig);
|
||||
this.filename = this._computeFilename();
|
||||
this.filepath = this._computeFilepath();
|
||||
this._formChanges.push(
|
||||
this.jumpForm.controls['module'].valueChanges.subscribe(() => {
|
||||
this.filepath = this._computeFilepath();
|
||||
}),
|
||||
this.jumpForm.controls['numero'].valueChanges.subscribe(() => {
|
||||
this.filename = this._computeFilename();
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this._formChanges.forEach((sub: Subscription) => {
|
||||
sub.unsubscribe();
|
||||
});
|
||||
}
|
||||
|
||||
public onDateChange(): void {
|
||||
this.filename = this._computeFilename();
|
||||
}
|
||||
|
||||
private _computeFilename(numero?: string): string {
|
||||
let file: string = '';
|
||||
let timestamp: number = Date.parse(this.jumpForm.controls['date'].value);
|
||||
if (isNaN(timestamp) == false) {
|
||||
let date: Date = new Date(timestamp);
|
||||
file += `${(date.getFullYear() + '').padStart(2, '0')}-${((date.getMonth() + 1) + '').padStart(2, '0')}-${(date.getDate() + '').padStart(2, '0')}_`;
|
||||
}
|
||||
if (numero !== undefined) {
|
||||
numero = (numero + '').padStart(5, '0');
|
||||
} else {
|
||||
numero = (this.jumpForm.controls['numero'].value + '').padStart(5, '0');
|
||||
}
|
||||
file += `S${numero}.mp4`;
|
||||
this.jumpForm.controls['video'].setValue(file);
|
||||
|
||||
return file;
|
||||
}
|
||||
|
||||
private _computeFilepath(): string {
|
||||
let path: string = '/Volumes/Storage/Skydive/Videos/';
|
||||
if (this.jumpForm.controls['module'].value != '') {
|
||||
path += `${this.jumpForm.controls['module'].value}/`;
|
||||
}
|
||||
this.jumpForm.controls['dossier'].setValue(path);
|
||||
|
||||
return path;
|
||||
}
|
||||
|
||||
private _isLastForAllSections() {
|
||||
return (
|
||||
this.useLast.aeronef
|
||||
&& this.useLast.altitude
|
||||
&& this.useLast.discipline
|
||||
&& this.useLast.divers
|
||||
&& this.useLast.dropzone
|
||||
&& this.useLast.groupe
|
||||
&& this.useLast.programme
|
||||
&& this.useLast.voile
|
||||
);
|
||||
}
|
||||
|
||||
private _setAllLast(checked: boolean) {
|
||||
this.useLast.all = checked;
|
||||
this.useLast.aeronef = checked;
|
||||
this.useLast.altitude = checked;
|
||||
this.useLast.discipline = checked;
|
||||
this.useLast.divers = checked;
|
||||
this.useLast.dropzone = checked;
|
||||
this.useLast.groupe = checked;
|
||||
this.useLast.programme = checked;
|
||||
this.useLast.voile = checked;
|
||||
}
|
||||
|
||||
addSautant(): void {
|
||||
this.useLast.groupe = false;
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
const tag = this.tagField.value;
|
||||
if (tag != null && tag.trim() !== '' && this.jump.sautants.indexOf(tag) < 0) {
|
||||
this.jump.sautants.push(tag);
|
||||
}
|
||||
this.tagField.reset('');
|
||||
const participants = (this.jump.sautants.length + 1);
|
||||
this.jumpForm.controls['participants'].setValue(participants);
|
||||
}
|
||||
|
||||
closeDialog(): void {
|
||||
this._setAllLast(false);
|
||||
//this.jump = <Jump>{};
|
||||
//this.jump.numero = this.nextJump;
|
||||
this.dialogRef.close();
|
||||
}
|
||||
|
||||
getErrorMessage(name: string): string {
|
||||
if (this.jumpForm.controls[name].errors !== null) {
|
||||
return 'Ce champ est requis.';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
removeSautant(index: string): void {
|
||||
this.useLast.groupe = false;
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
this.jump.sautants = this.jump.sautants.filter((sautant) => sautant !== index);
|
||||
const participants = (this.jump.sautants.length + 1);
|
||||
this.jumpForm.controls['participants'].setValue(participants);
|
||||
}
|
||||
|
||||
setLastJump(checked: boolean) {
|
||||
if (checked) {
|
||||
this._setAllLast(true);
|
||||
this.jumpForm.controls['lieu'].setValue(this.lastJump.lieu);
|
||||
this.jumpForm.controls['oaci'].setValue(this.lastJump.oaci);
|
||||
this.jumpForm.controls['aeronef'].setValue(this.lastJump.aeronef);
|
||||
this.jumpForm.controls['imat'].setValue(this.lastJump.imat);
|
||||
this.jumpForm.controls['hauteur'].setValue(this.lastJump.hauteur);
|
||||
this.jumpForm.controls['deploiement'].setValue(this.lastJump.deploiement);
|
||||
this.jumpForm.controls['voile'].setValue(this.lastJump.voile);
|
||||
this.jumpForm.controls['taille'].setValue(this.lastJump.taille);
|
||||
this.jumpForm.controls['categorie'].setValue(this.lastJump.categorie);
|
||||
this.jumpForm.controls['module'].setValue(this.lastJump.module);
|
||||
this.jumpForm.controls['participants'].setValue(this.lastJump.participants);
|
||||
//this.jumpForm.controls['sautants'].setValue(this.lastJump.sautants);
|
||||
this.jumpForm.controls['programme'].setValue(this.lastJump.programme);
|
||||
this.jumpForm.controls['accessoires'].setValue(this.lastJump.accessoires);
|
||||
this.jumpForm.controls['zone'].setValue(this.lastJump.zone);
|
||||
this.jump.sautants = this.lastJump.sautants;
|
||||
/*
|
||||
Object.assign(
|
||||
this.jump,
|
||||
{
|
||||
date: this.lastJump.date,
|
||||
numero: this.lastJump.numero,
|
||||
lieu: this.lastJump.lieu,
|
||||
oaci: this.lastJump.oaci,
|
||||
aeronef: this.lastJump.aeronef,
|
||||
imat: this.lastJump.imat,
|
||||
hauteur: this.lastJump.hauteur,
|
||||
deploiement: this.lastJump.deploiement,
|
||||
voile: this.lastJump.voile,
|
||||
taille: this.lastJump.taille,
|
||||
categorie: this.lastJump.categorie,
|
||||
module: this.lastJump.module,
|
||||
participants: this.lastJump.participants,
|
||||
sautants: this.lastJump.sautants,
|
||||
programme: this.lastJump.programme,
|
||||
accessoires: this.lastJump.accessoires,
|
||||
zone: this.lastJump.zone,
|
||||
}
|
||||
);
|
||||
*/
|
||||
this.jump.date = '';
|
||||
} else {
|
||||
this._setAllLast(false);
|
||||
this.jumpForm.controls['lieu'].setValue('');
|
||||
this.jumpForm.controls['oaci'].setValue('');
|
||||
this.jumpForm.controls['aeronef'].setValue('');
|
||||
this.jumpForm.controls['imat'].setValue('');
|
||||
this.jumpForm.controls['hauteur'].setValue('');
|
||||
this.jumpForm.controls['deploiement'].setValue('');
|
||||
this.jumpForm.controls['voile'].setValue('');
|
||||
this.jumpForm.controls['taille'].setValue('');
|
||||
this.jumpForm.controls['categorie'].setValue('');
|
||||
this.jumpForm.controls['module'].setValue('');
|
||||
this.jumpForm.controls['participants'].setValue(1);
|
||||
//this.jumpForm.controls['sautants'].setValue('');
|
||||
this.jumpForm.controls['programme'].setValue('');
|
||||
this.jumpForm.controls['accessoires'].setValue('');
|
||||
this.jumpForm.controls['zone'].setValue('');
|
||||
this.jump.sautants = [];
|
||||
}
|
||||
this.jump.numero = this.nextJump;
|
||||
};
|
||||
|
||||
setLastAeronef(checked: boolean = false) {
|
||||
if (checked) {
|
||||
this.useLast.aeronef = true;
|
||||
this.jumpForm.controls['aeronef'].setValue(this.lastJump.aeronef);
|
||||
this.jumpForm.controls['imat'].setValue(this.lastJump.imat);
|
||||
} else {
|
||||
this.useLast.aeronef = false;
|
||||
this.jumpForm.controls['aeronef'].setValue('');
|
||||
this.jumpForm.controls['imat'].setValue('');
|
||||
}
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
}
|
||||
|
||||
setLastAltitude(checked: boolean = false) {
|
||||
if (checked) {
|
||||
this.useLast.altitude = true;
|
||||
this.jumpForm.controls['hauteur'].setValue(this.lastJump.hauteur);
|
||||
this.jumpForm.controls['deploiement'].setValue(this.lastJump.deploiement);
|
||||
} else {
|
||||
this.useLast.altitude = false;
|
||||
this.jumpForm.controls['hauteur'].setValue('');
|
||||
this.jumpForm.controls['deploiement'].setValue('');
|
||||
}
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
}
|
||||
|
||||
setLastDiscipline(checked: boolean = false) {
|
||||
if (checked) {
|
||||
this.useLast.discipline = true;
|
||||
this.jumpForm.controls['categorie'].setValue(this.lastJump.categorie);
|
||||
this.jumpForm.controls['module'].setValue(this.lastJump.module);
|
||||
} else {
|
||||
this.useLast.discipline = false;
|
||||
this.jumpForm.controls['categorie'].setValue('');
|
||||
this.jumpForm.controls['module'].setValue('');
|
||||
}
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
}
|
||||
|
||||
setLastDivers(checked: boolean = false) {
|
||||
if (checked) {
|
||||
this.useLast.divers = true;
|
||||
this.jumpForm.controls['accessoires'].setValue(this.lastJump.accessoires);
|
||||
this.jumpForm.controls['zone'].setValue(this.lastJump.zone);
|
||||
} else {
|
||||
this.useLast.divers = false;
|
||||
this.jumpForm.controls['accessoires'].setValue('');
|
||||
this.jumpForm.controls['zone'].setValue('');
|
||||
}
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
}
|
||||
|
||||
setLastDropzone(checked: boolean = false) {
|
||||
if (checked) {
|
||||
this.useLast.dropzone = true;
|
||||
this.jumpForm.controls['lieu'].setValue(this.lastJump.lieu);
|
||||
this.jumpForm.controls['oaci'].setValue(this.lastJump.oaci);
|
||||
} else {
|
||||
this.useLast.dropzone = false;
|
||||
this.jumpForm.controls['lieu'].setValue('');
|
||||
this.jumpForm.controls['oaci'].setValue('');
|
||||
}
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
}
|
||||
|
||||
setLastGroupe(checked: boolean = false) {
|
||||
if (checked) {
|
||||
this.useLast.groupe = true;
|
||||
this.jumpForm.controls['participants'].setValue(this.lastJump.participants);
|
||||
//this.jumpForm.controls['sautants'].setValue(this.lastJump.sautants);
|
||||
this.jump.sautants = this.lastJump.sautants;
|
||||
} else {
|
||||
this.useLast.groupe = false;
|
||||
this.jumpForm.controls['participants'].setValue(1);
|
||||
//this.jumpForm.controls['sautants'].setValue('');
|
||||
this.jump.sautants = [];
|
||||
}
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
}
|
||||
|
||||
setLastProgramme(checked: boolean = false) {
|
||||
if (checked) {
|
||||
this.useLast.programme = true;
|
||||
this.jumpForm.controls['programme'].setValue(this.lastJump.participants);
|
||||
} else {
|
||||
this.useLast.programme = false;
|
||||
this.jumpForm.controls['programme'].setValue('');
|
||||
}
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
}
|
||||
|
||||
setLastVoile(checked: boolean = false) {
|
||||
if (checked) {
|
||||
this.useLast.voile = true;
|
||||
this.jumpForm.controls['voile'].setValue(this.lastJump.voile);
|
||||
this.jumpForm.controls['taille'].setValue(this.lastJump.taille);
|
||||
} else {
|
||||
this.useLast.voile = false;
|
||||
this.jumpForm.controls['voile'].setValue('');
|
||||
this.jumpForm.controls['taille'].setValue('');
|
||||
}
|
||||
this.useLast.all = this._isLastForAllSections();
|
||||
}
|
||||
|
||||
submitForm(): void {
|
||||
/*
|
||||
* Création d'un tableau de saut contenant de 1 à n saut en fonction
|
||||
* de la valeur du champ numero du formulaire jumpForm
|
||||
*/
|
||||
let jumps: Array<Jump> = [];
|
||||
let jump: Jump = {} as Jump;
|
||||
let numeros: Array<number> = [];
|
||||
let date: Date;
|
||||
/* Controle de la validité du champ date et conversion au format ISO */
|
||||
let timestamp: number = Date.parse(this.jumpForm.controls['date'].value);
|
||||
if (isNaN(timestamp) == false) {
|
||||
date = new Date(timestamp);
|
||||
} else {
|
||||
date = new Date();
|
||||
}
|
||||
|
||||
if (isNaN(+this.jumpForm.controls['numero'].value)) {
|
||||
/*
|
||||
* 'numero' n'est pas un entier , il s'agit donc d'une plage, d'une quantité ou de plusieurs valeur
|
||||
* decomposer la valeur 'numero' et ajouter chaque sauts au tableau retourné par la fenêtre dialog
|
||||
*/
|
||||
let jumpNum: number = this.lastJump.numero;
|
||||
const elements: string[] = this.jumpForm.controls['numero'].value.split(';');
|
||||
elements.forEach((element: string) => {
|
||||
if (element == '') {
|
||||
jumpNum ++;
|
||||
element = jumpNum.toString();
|
||||
}
|
||||
const values: string[] = element.split('-');
|
||||
if (values.length == 2) {
|
||||
const start: number = parseInt(values[0]);
|
||||
const stop: number = parseInt(values[1]);
|
||||
const diff: number = (stop - start);
|
||||
/* Ajout de saut par plage */
|
||||
for (let index = 0; index <= diff; index++) {
|
||||
jumpNum = (start + index);
|
||||
numeros.push(jumpNum);
|
||||
}
|
||||
} else {
|
||||
const quantity: string[] = values[0].split('+');
|
||||
if (quantity.length == 2) {
|
||||
/* Ajout de sauts par quantité */
|
||||
const start: number = jumpNum;
|
||||
for (let index = 1; index <= parseInt(quantity[1]); index++) {
|
||||
jumpNum ++;
|
||||
numeros.push(jumpNum);
|
||||
}
|
||||
} else {
|
||||
/* Ajout de sauts par numero */
|
||||
jumpNum = parseInt(quantity[0]);
|
||||
numeros.push(jumpNum);
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
/* 'numero' est un entier */
|
||||
numeros.push(this.jumpForm.controls['numero'].value);
|
||||
}
|
||||
|
||||
/* Valeurs communes aux 1 à n saut(s) à ajouter */
|
||||
jump.date = date.toISOString();
|
||||
jump.lieu = this.jumpForm.controls['lieu'].value;
|
||||
jump.oaci = this.jumpForm.controls['oaci'].value;
|
||||
jump.aeronef = this.jumpForm.controls['aeronef'].value;
|
||||
jump.imat = this.jumpForm.controls['imat'].value;
|
||||
jump.hauteur = this.jumpForm.controls['hauteur'].value;
|
||||
jump.deploiement = this.jumpForm.controls['deploiement'].value;
|
||||
jump.voile = this.jumpForm.controls['voile'].value;
|
||||
jump.taille = this.jumpForm.controls['taille'].value;
|
||||
jump.categorie = this.jumpForm.controls['categorie'].value;
|
||||
jump.module = this.jumpForm.controls['module'].value;
|
||||
jump.participants = this.jumpForm.controls['participants'].value;
|
||||
jump.sautants = this.jump.sautants;
|
||||
//jump.sautants = this.jumpForm.controls['sautants'].value;
|
||||
jump.programme = this.jumpForm.controls['programme'].value;
|
||||
jump.accessoires = this.jumpForm.controls['accessoires'].value;
|
||||
jump.zone = this.jumpForm.controls['zone'].value;
|
||||
//jump.dossier = this.jumpForm.controls['dossier'].value;
|
||||
//jump.video = this.jumpForm.controls['video'].value;
|
||||
|
||||
//console.log(numeros);
|
||||
/* Ajout du saut au tableau à retourner */
|
||||
numeros.forEach((numero: number) => {
|
||||
let item: Jump = {} as Jump;
|
||||
Object.assign(item, jump);
|
||||
item.numero = numero;
|
||||
item.dossier = this._computeFilepath();
|
||||
item.video = this._computeFilename(numero.toString());
|
||||
jumps.push(item);
|
||||
//console.log(item);
|
||||
});
|
||||
//console.log(jumps);
|
||||
/* Reset all 'last jump values' booleans */
|
||||
this._setAllLast(false);
|
||||
/* close the dialog with result */
|
||||
this.dialogRef.close(jumps);
|
||||
|
||||
/*
|
||||
// Reset all 'last jump values' booleans
|
||||
this._setAllLast(false);
|
||||
// update the model
|
||||
this.updateJump(this.jumpForm.value);
|
||||
// close the dialog with result
|
||||
this.dialogRef.close(this.jump);
|
||||
*/
|
||||
}
|
||||
|
||||
updateJump(values: NonNullable<unknown>): void {
|
||||
Object.assign(this.jump, values);
|
||||
}
|
||||
}
|
||||
@@ -1,64 +0,0 @@
|
||||
<h2 mat-dialog-title class="bg-accent border-bottom border-light-subtle d-flex mb-3 pt-3 pb-2">
|
||||
Supprimer le saut n°{{jump.numero}}<span class="flex-spacer"></span>
|
||||
<mat-icon fontIcon="close" class="pointer" (click)="closeDialog()"></mat-icon>
|
||||
</h2>
|
||||
<mat-dialog-content>
|
||||
<div class="container">
|
||||
<div class="mt-2 mb-4 text-center text-danger border-warning alert alert-danger">
|
||||
<p class="fs-6 m-0">
|
||||
Veuillez confirmer la suppression de ce saut.<br />
|
||||
<span class="fw-semibold">Attention</span>, cette <span class="fw-semibold">action</span> est <span class="fw-semibold">irréversible</span>.
|
||||
</p>
|
||||
</div>
|
||||
<h3 class="border-bottom border-light-subtle pb-2 mb-3">Données du saut :</h3>
|
||||
<div class="row mb-3">
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<dl class="dl-horizontal">
|
||||
<dt class="text-accent fw-normal">numero:</dt>
|
||||
<dd>{{jump.numero}}</dd>
|
||||
<dt class="text-accent fw-normal">lieu:</dt>
|
||||
<dd>{{jump.lieu}}</dd>
|
||||
<dt class="text-accent fw-normal">aeronef:</dt>
|
||||
<dd>{{jump.aeronef}}</dd>
|
||||
<dt class="text-accent fw-normal">voile:</dt>
|
||||
<dd>{{jump.voile}}</dd>
|
||||
<dt class="text-accent fw-normal">hauteur:</dt>
|
||||
<dd>{{jump.hauteur}} m</dd>
|
||||
<dt class="text-accent fw-normal">categorie:</dt>
|
||||
<dd>{{jump.categorie}}</dd>
|
||||
<dt class="text-accent fw-normal">accessoires:</dt>
|
||||
<dd>{{jump.accessoires}}</dd>
|
||||
<dt class="text-accent fw-normal">dossier:</dt>
|
||||
<dd>{{jump.dossier}}</dd>
|
||||
<dt class="text-accent fw-normal">programme:</dt>
|
||||
<dd>{{jump.programme}}</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<dl class="dl-horizontal">
|
||||
<dt class="text-accent fw-normal">date:</dt>
|
||||
<dd>{{jump.date | date: 'mediumDate'}}</dd>
|
||||
<dt class="text-accent fw-normal">oaci:</dt>
|
||||
<dd>{{jump.oaci}}</dd>
|
||||
<dt class="text-accent fw-normal">imat:</dt>
|
||||
<dd>{{jump.imat}}</dd>
|
||||
<dt class="text-accent fw-normal">taille:</dt>
|
||||
<dd>{{jump.taille}} ft<sup>2</sup></dd>
|
||||
<dt class="text-accent fw-normal">participants:</dt>
|
||||
<dd>{{jump.participants}}</dd>
|
||||
<dt class="text-accent fw-normal">module:</dt>
|
||||
<dd>{{jump.module}}</dd>
|
||||
<dt class="text-accent fw-normal">zone:</dt>
|
||||
<dd>{{jump.zone}}</dd>
|
||||
<dt class="text-accent fw-normal">video:</dt>
|
||||
<dd>{{jump.video}}</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</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="accent" [mat-dialog-close]="jump" cdkFocusInitial>Supprimer</button>
|
||||
</mat-dialog-actions>
|
||||
@@ -1,27 +0,0 @@
|
||||
import { Component, Inject } from '@angular/core';
|
||||
import { DatePipe } from '@angular/common';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
|
||||
import { Jump } from 'src/app/core/models';
|
||||
|
||||
@Component({
|
||||
selector: 'huapp-jump-delete-dialog',
|
||||
templateUrl: 'jump-delete.dialog.html',
|
||||
standalone: true,
|
||||
imports: [
|
||||
DatePipe,
|
||||
MatDialogModule, MatButtonModule, MatIconModule
|
||||
]
|
||||
})
|
||||
export class JumpDeleteDialogComponent {
|
||||
constructor(
|
||||
public dialogRef: MatDialogRef<JumpDeleteDialogComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public jump: Jump
|
||||
) { }
|
||||
|
||||
closeDialog(): void {
|
||||
this.dialogRef.close();
|
||||
}
|
||||
}
|
||||
@@ -1,145 +0,0 @@
|
||||
<h2 mat-dialog-title class="bg-primary border-bottom border-light-subtle d-flex mb-3 pt-3 pb-2">
|
||||
Modifier un saut<span class="flex-spacer"></span>
|
||||
<mat-icon fontIcon="close" class="pointer" (click)="closeDialog()"></mat-icon>
|
||||
</h2>
|
||||
<mat-dialog-content>
|
||||
<div class="container">
|
||||
<form class="row" [formGroup]="jumpForm" (ngSubmit)="submitForm()">
|
||||
<div class="col-xs-12">
|
||||
<mat-form-field appearance="outline" class="mt-2 me-2" color="primary">
|
||||
<mat-label>Numéro du saut</mat-label>
|
||||
<input matInput formControlName="numero">
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline" class="mt-2 me-3" color="primary">
|
||||
<mat-label>Choisissez une date</mat-label>
|
||||
<input matInput [matDatepicker]="datepicker" formControlName="date" />
|
||||
<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="primary" matDatepickerApply>Appliquer</button>
|
||||
</mat-datepicker-actions>
|
||||
</mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Dropzone</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Lieu</mat-label>
|
||||
<input matInput formControlName="lieu">
|
||||
<mat-error *ngIf="this.jumpForm.controls['lieu'].status === 'INVALID'">{{getErrorMessage('lieu')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Oaci</mat-label>
|
||||
<input matInput formControlName="oaci">
|
||||
<mat-error *ngIf="this.jumpForm.controls['oaci'].status === 'INVALID'">{{getErrorMessage('oaci')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Aéronef</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Aéronef</mat-label>
|
||||
<input matInput formControlName="aeronef">
|
||||
<mat-error *ngIf="this.jumpForm.controls['aeronef'].status === 'INVALID'">{{getErrorMessage('aeronef')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Imatriculation</mat-label>
|
||||
<input matInput formControlName="imat">
|
||||
<mat-error *ngIf="this.jumpForm.controls['imat'].status === 'INVALID'">{{getErrorMessage('imat')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Voile</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Modèle</mat-label>
|
||||
<input matInput formControlName="voile">
|
||||
<mat-error *ngIf="this.jumpForm.controls['voile'].status === 'INVALID'">{{getErrorMessage('voile')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Taille en ft<sup>2</sup></mat-label>
|
||||
<input matInput formControlName="taille" type="number" min="0" step="1">
|
||||
<span matTextSuffix>ft<sup>2</sup></span>
|
||||
<mat-error *ngIf="this.jumpForm.controls['taille'].status === 'INVALID'">{{getErrorMessage('taille')}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Altitude</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Hauteur de largage</mat-label>
|
||||
<input matInput formControlName="hauteur" type="number" min="0" step="1">
|
||||
<mat-error *ngIf="this.jumpForm.controls['hauteur'].status === 'INVALID'">{{getErrorMessage('hauteur')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Hauteur de déploiement</mat-label>
|
||||
<input matInput formControlName="deploiement" type="number" min="0" step="1">
|
||||
<mat-error *ngIf="this.jumpForm.controls['deploiement'].status === 'INVALID'">{{getErrorMessage('deploiement')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Discipline</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Categorie</mat-label>
|
||||
<input matInput formControlName="categorie">
|
||||
<mat-error *ngIf="this.jumpForm.controls['categorie'].status === 'INVALID'">{{getErrorMessage('categorie')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Module</mat-label>
|
||||
<input matInput formControlName="module">
|
||||
<mat-error *ngIf="this.jumpForm.controls['module'].status === 'INVALID'">{{getErrorMessage('module')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Divers</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Accessoires</mat-label>
|
||||
<input matInput formControlName="accessoires">
|
||||
<mat-error *ngIf="this.jumpForm.controls['accessoires'].status === 'INVALID'">{{getErrorMessage('accessoires')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Zone</mat-label>
|
||||
<input matInput formControlName="zone">
|
||||
<mat-error *ngIf="this.jumpForm.controls['zone'].status === 'INVALID'">{{getErrorMessage('zone')}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Groupe</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<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">
|
||||
<mat-label>Nombre de participants</mat-label>
|
||||
<input matInput formControlName="participants" type="number" min="0" step="1">
|
||||
<mat-error *ngIf="this.jumpForm.controls['participants'].status === 'INVALID'">{{getErrorMessage('participants')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<div class="mb-2">
|
||||
<span *ngFor="let sautant of jump.sautants" 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>
|
||||
ju_solide
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Programme</h4>
|
||||
<mat-form-field appearance="fill" class="me-2 w-100">
|
||||
<mat-label>Programme</mat-label>
|
||||
<textarea matInput formControlName="programme"></textarea>
|
||||
<mat-error *ngIf="this.jumpForm.controls['programme'].status === 'INVALID'">{{getErrorMessage('programme')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<h4 class="border-bottom border-primary pb-1 mb-3">Vidéo</h4>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Dossier</mat-label>
|
||||
<input matInput formControlName="dossier">
|
||||
<mat-error *ngIf="this.jumpForm.controls['dossier'].status === 'INVALID'">{{getErrorMessage('dossier')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="me-2">
|
||||
<mat-label>Video</mat-label>
|
||||
<input matInput formControlName="video">
|
||||
<mat-error *ngIf="this.jumpForm.controls['video'].status === 'INVALID'">{{getErrorMessage('video')}}</mat-error>
|
||||
</mat-form-field>
|
||||
</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="primary" [disabled]="!jumpForm.valid" (click)="submitForm()" cdkFocusInitial>Enregistrer</button>
|
||||
</mat-dialog-actions>
|
||||
@@ -1,98 +0,0 @@
|
||||
import { Component, Inject } from '@angular/core';
|
||||
import { NgFor, NgIf } from '@angular/common';
|
||||
import { FormBuilder, FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatCheckboxModule } from '@angular/material/checkbox';
|
||||
import { MatDatepickerModule } from '@angular/material/datepicker';
|
||||
import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatOptionModule } from '@angular/material/core';
|
||||
import { MatSelectModule } from '@angular/material/select';
|
||||
|
||||
import { Jump, JumpForm } from 'src/app/core/models';
|
||||
|
||||
@Component({
|
||||
selector: 'huapp-jump-edit-dialog',
|
||||
templateUrl: 'jump-edit.dialog.html',
|
||||
standalone: true,
|
||||
imports: [
|
||||
NgFor, NgIf, FormsModule, ReactiveFormsModule,
|
||||
MatButtonModule, MatCheckboxModule, MatDatepickerModule,
|
||||
MatDialogModule, MatFormFieldModule, MatIconModule,
|
||||
MatInputModule, MatSelectModule, MatOptionModule
|
||||
]
|
||||
})
|
||||
export class JumpEditDialogComponent {
|
||||
public tagField = new FormControl<string>('', { nonNullable: true});
|
||||
public jumpForm: FormGroup;
|
||||
|
||||
constructor(
|
||||
public dialogRef: MatDialogRef<JumpEditDialogComponent>,
|
||||
private fb: FormBuilder,
|
||||
@Inject(MAT_DIALOG_DATA) public jump: Jump
|
||||
) {
|
||||
let controlsConfig = {
|
||||
slug: [this.jump.slug, Validators.required],
|
||||
date: [this.jump.date, Validators.required],
|
||||
numero: [this.jump.numero, Validators.required],
|
||||
lieu: [this.jump.lieu, Validators.required],
|
||||
oaci: this.jump.oaci,
|
||||
aeronef: [this.jump.aeronef, Validators.required],
|
||||
imat: this.jump.imat,
|
||||
hauteur: [this.jump.hauteur, Validators.required],
|
||||
deploiement: this.jump.deploiement,
|
||||
voile: this.jump.voile,
|
||||
taille: [this.jump.taille, Validators.required],
|
||||
categorie: this.jump.categorie,
|
||||
module: this.jump.module,
|
||||
participants: [this.jump.participants, Validators.required],
|
||||
programme: this.jump.programme,
|
||||
accessoires: this.jump.accessoires,
|
||||
zone: this.jump.zone,
|
||||
dossier: this.jump.dossier,
|
||||
video: this.jump.video
|
||||
};
|
||||
this.jumpForm = this.fb.group(controlsConfig);
|
||||
}
|
||||
|
||||
addSautant(): void {
|
||||
const tag = this.tagField.value;
|
||||
if (tag != null && tag.trim() !== '' && this.jump.sautants.indexOf(tag) < 0) {
|
||||
this.jump.sautants.push(tag);
|
||||
}
|
||||
const participants = (this.jump.sautants.length + 1);
|
||||
this.jumpForm.controls['participants'].setValue(participants);
|
||||
this.tagField.reset('');
|
||||
}
|
||||
|
||||
closeDialog(): void {
|
||||
// close the dialog without result
|
||||
this.dialogRef.close();
|
||||
}
|
||||
|
||||
getErrorMessage(name: string): string {
|
||||
if (this.jumpForm.controls[name].errors !== null) {
|
||||
return `Ce champ est requis.`;
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
removeSautant(index: string): void {
|
||||
this.jump.sautants = this.jump.sautants.filter((sautant) => sautant !== index);
|
||||
const participants = (this.jump.sautants.length + 1);
|
||||
this.jumpForm.controls['participants'].setValue(participants);
|
||||
}
|
||||
|
||||
submitForm(): void {
|
||||
// update the model
|
||||
this.updateJump(this.jumpForm.value);
|
||||
// close the dialog with result
|
||||
this.dialogRef.close(this.jump);
|
||||
}
|
||||
|
||||
updateJump(values: NonNullable<unknown>): void {
|
||||
Object.assign(this.jump, values);
|
||||
}
|
||||
}
|
||||
@@ -1,67 +0,0 @@
|
||||
<h2 mat-dialog-title class="bg-cyan border-bottom border-light-subtle d-flex mb-3 pt-3 pb-2">
|
||||
Saut n°{{jump.numero}}<span class="flex-spacer"></span>
|
||||
<mat-icon fontIcon="close" class="pointer" (click)="closeDialog()"></mat-icon>
|
||||
</h2>
|
||||
<mat-dialog-content>
|
||||
<div class="container">
|
||||
<h5 class="border-bottom text-light-info border-light-subtle pb-2 mb-3">Le {{ jump.date | date: 'dd/MM/yyyy' }} à {{ jump.lieu }} :</h5>
|
||||
<div class="row mb-3">
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<dl class="dl-horizontal">
|
||||
<dt class="text-cyan fw-normal">Lieu:</dt>
|
||||
<dd>{{jump.lieu}}</dd>
|
||||
<dt class="text-cyan fw-normal">Oaci:</dt>
|
||||
<dd>{{jump.oaci}}</dd>
|
||||
<dt class="text-cyan fw-normal">Aeronef:</dt>
|
||||
<dd>{{jump.aeronef}}</dd>
|
||||
<dt class="text-cyan fw-normal">Imat:</dt>
|
||||
<dd>{{jump.imat}}</dd>
|
||||
<dt class="text-cyan fw-normal">Voile:</dt>
|
||||
<dd>{{jump.voile}}</dd>
|
||||
<dt class="text-cyan fw-normal">Taille:</dt>
|
||||
<dd>{{jump.taille}} ft<sup>2</sup></dd>
|
||||
<dt class="text-cyan fw-normal">Participants:</dt>
|
||||
<dd>{{jump.participants}}</dd>
|
||||
<dt class="text-cyan fw-normal">Sautants:</dt>
|
||||
<dd>
|
||||
<span *ngFor="let sautant of jump.sautants" class="badge rounded-pill bg-primary mb-2 me-1 pe-3 py-1 fw-normal text-dark">
|
||||
<mat-icon class="align-middle me-1" fontIcon="person"></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 me-1" fontIcon="person"></mat-icon>
|
||||
ju_solide
|
||||
</span>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<dl class="dl-horizontal">
|
||||
<dt class="text-cyan fw-normal">Hauteur:</dt>
|
||||
<dd>{{jump.hauteur}} m</dd>
|
||||
<dt class="text-cyan fw-normal">Deploiement:</dt>
|
||||
<dd>{{jump.deploiement}} m</dd>
|
||||
<dt class="text-cyan fw-normal">Categorie:</dt>
|
||||
<dd>{{jump.categorie}}</dd>
|
||||
<dt class="text-cyan fw-normal">Module:</dt>
|
||||
<dd>{{jump.module}}</dd>
|
||||
<dt class="text-cyan fw-normal">Accessoires:</dt>
|
||||
<dd>{{jump.accessoires}}</dd>
|
||||
<dt class="text-cyan fw-normal">Zone:</dt>
|
||||
<dd>{{jump.zone}}</dd>
|
||||
<dt class="text-cyan fw-normal">Dossier media:</dt>
|
||||
<dd>{{jump.dossier}}</dd>
|
||||
<dt class="text-cyan fw-normal">Video:</dt>
|
||||
<dd>{{jump.video}}</dd>
|
||||
<dt class="text-cyan fw-normal">Programme:</dt>
|
||||
<dd>{{jump.programme}}</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
</div>
|
||||
</mat-dialog-content>
|
||||
<mat-dialog-actions>
|
||||
<span class="flex-spacer"></span>
|
||||
<button mat-button (click)="closeDialog()" class="me-1">Fermer</button>
|
||||
</mat-dialog-actions>
|
||||
@@ -1,30 +0,0 @@
|
||||
import { Component, Inject } from '@angular/core';
|
||||
import { DatePipe, NgFor } from '@angular/common';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
|
||||
import { MatDividerModule } from '@angular/material/divider';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
|
||||
import { Jump } from 'src/app/core/models';
|
||||
|
||||
@Component({
|
||||
selector: 'huapp-jump-view-dialog',
|
||||
templateUrl: 'jump-view.dialog.html',
|
||||
standalone: true,
|
||||
imports: [
|
||||
DatePipe, NgFor,
|
||||
MatButtonModule, MatDialogModule, MatDividerModule, MatIconModule
|
||||
]
|
||||
})
|
||||
export class JumpViewDialogComponent {
|
||||
|
||||
constructor(
|
||||
public dialogRef: MatDialogRef<JumpViewDialogComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public jump: Jump
|
||||
) { }
|
||||
|
||||
closeDialog(): void {
|
||||
// close the dialog without result
|
||||
this.dialogRef.close();
|
||||
}
|
||||
}
|
||||
@@ -1,24 +0,0 @@
|
||||
import { Injectable, } from '@angular/core';
|
||||
import { ActivatedRouteSnapshot, Resolve, Router, RouterStateSnapshot } from '@angular/router';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
import { Jump } from 'src/app/core/models';
|
||||
import { JumpsService } from 'src/app/core/services';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
|
||||
@Injectable()
|
||||
export class JumpResolver implements Resolve<Jump> {
|
||||
constructor(
|
||||
private _jumpsService: JumpsService,
|
||||
private router: Router
|
||||
) { }
|
||||
|
||||
resolve(
|
||||
route: ActivatedRouteSnapshot,
|
||||
state: RouterStateSnapshot
|
||||
): Observable<any> {
|
||||
|
||||
return this._jumpsService.get(route.params['slug'])
|
||||
.pipe(catchError(() => this.router.navigateByUrl('/')));
|
||||
}
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { JumpComponent } from './jump.component';
|
||||
import { JumpResolver } from './jump-resolver.service';
|
||||
import { AuthGuard } from 'src/app/core/services';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: ':slug',
|
||||
component: JumpComponent,
|
||||
canActivate: [AuthGuard],
|
||||
resolve: {
|
||||
jump: JumpResolver
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule]
|
||||
})
|
||||
export class JumpRoutingModule { }
|
||||
@@ -1,73 +1,132 @@
|
||||
<div class="content">
|
||||
<h1 class="my-0">Saut n°{{ jump.numero }} <small class="text-muted">le {{ jump.date | date: 'dd/MM/yyyy' }} à {{ jump.lieu }}</small></h1>
|
||||
<hr />
|
||||
<section class="row mb-3">
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<dl class="dl-horizontal">
|
||||
<dt class="text-accent fw-normal">Lieu:</dt>
|
||||
<dd>{{jump.lieu}}</dd>
|
||||
<dt class="text-accent fw-normal">Oaci:</dt>
|
||||
<dd>{{jump.oaci}}</dd>
|
||||
<dt class="text-accent fw-normal">Aeronef:</dt>
|
||||
<dd>{{jump.aeronef}}</dd>
|
||||
<dt class="text-accent fw-normal">Imat:</dt>
|
||||
<dd>{{jump.imat}}</dd>
|
||||
<dt class="text-accent fw-normal">Voile:</dt>
|
||||
<dd>{{jump.voile}}</dd>
|
||||
<dt class="text-accent fw-normal">Taille:</dt>
|
||||
<dd>{{jump.taille}} ft<sup>2</sup></dd>
|
||||
<dt class="text-accent fw-normal">Programme:</dt>
|
||||
<dd>{{jump.programme}}</dd>
|
||||
<dt class="text-accent fw-normal">Participants:</dt>
|
||||
<dd>{{jump.participants}}</dd>
|
||||
</dl>
|
||||
<div @flyInOut>
|
||||
<div class="content">
|
||||
<div class="d-flex">
|
||||
<div class="flex-fill">
|
||||
<h1 class="mb-1">{{title}}</h1>
|
||||
<span [hidden]="!lastJump.numero" class="me-2 fs-6">
|
||||
Dernier saut enregistré : <span class="fs-5 mx-1 text-primary">{{ lastJump.numero }}<sup>ème</sup></span> à <span class="fs-5 mx-1 text-primary">{{ lastJump.lieu }}</span> le <span class="fs-5 mx-1 text-primary">{{ lastJump.date | date: 'dd/MM/yyyy' }}</span>
|
||||
</span>
|
||||
</div>
|
||||
<span class="flex-spacer"></span>
|
||||
<div class="align-self-center me-2">
|
||||
<button mat-icon-button [matMenuTriggerFor]="menuAeronef" aria-label="Menu Aeronef">
|
||||
<mat-icon fontIcon="more_vert"></mat-icon>
|
||||
</button>
|
||||
<mat-menu #menuAeronef="matMenu">
|
||||
@for (menuitem of menuItems.getMenuPanel(); track menuitem) {
|
||||
<button mat-menu-item>
|
||||
<mat-icon [fontIcon]="menuitem.icon"></mat-icon>
|
||||
<span>{{ menuitem.name }}</span>
|
||||
</button>
|
||||
}
|
||||
</mat-menu>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12">
|
||||
<dl class="dl-horizontal">
|
||||
<dt class="text-accent fw-normal">Hauteur:</dt>
|
||||
<dd>{{jump.hauteur}} m</dd>
|
||||
<dt class="text-accent fw-normal">Deploiement:</dt>
|
||||
<dd>{{jump.deploiement}} m</dd>
|
||||
<dt class="text-accent fw-normal">Categorie:</dt>
|
||||
<dd>{{jump.categorie}}</dd>
|
||||
<dt class="text-accent fw-normal">Module:</dt>
|
||||
<dd>{{jump.module}}</dd>
|
||||
<dt class="text-accent fw-normal">Accessoires:</dt>
|
||||
<dd>{{jump.accessoires}}</dd>
|
||||
<dt class="text-accent fw-normal">Zone:</dt>
|
||||
<dd>{{jump.zone}}</dd>
|
||||
<dt class="text-accent fw-normal">Emplacement des media:</dt>
|
||||
<dd>{{jump.dossier}}</dd>
|
||||
<dt class="text-accent fw-normal">Video:</dt>
|
||||
<dd>{{jump.video}}</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="col-xs-12 mb-2">
|
||||
<span *ngFor="let sautant of jump.sautants" class="badge rounded-pill bg-primary mb-2 me-1 pe-3 py-1 fw-normal text-dark">
|
||||
<mat-icon class="align-middle me-1" fontIcon="person"></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 me-1" fontIcon="person"></mat-icon>
|
||||
ju_solide
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
<section class="border-top pt-4 d-flex">
|
||||
<!--
|
||||
<huapp-jump-meta [jump]="jump" class="me-2"></huapp-jump-meta>
|
||||
<span class="flex-spacer"></span>
|
||||
-->
|
||||
<span class="flex-spacer"></span>
|
||||
<span [hidden]="!canModify">
|
||||
<button mat-button color="primary" (click)="openEditDialog(jump)" class="me-1">
|
||||
<mat-icon aria-label="Modifier" fontIcon="edit"></mat-icon>
|
||||
Modifier
|
||||
</button>
|
||||
<button mat-button color="danger" (click)="openDeleteDialog(jump)">
|
||||
<mat-icon aria-label="Supprimer" fontIcon="delete"></mat-icon>
|
||||
Supprimer
|
||||
</button>
|
||||
</span>
|
||||
</section>
|
||||
</div>
|
||||
<mat-divider class="my-3"></mat-divider>
|
||||
<mat-card>
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{ subtitle }}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content class="mt-2">
|
||||
@if(displayCharts) {
|
||||
<div class="row">
|
||||
<div class="col-xxl-6 col-xs-12">
|
||||
<app-linearea-chart [headers]="seriesHeader" [names]="seriesName" [values]="seriesRow" [colors]="seriesColor"></app-linearea-chart>
|
||||
</div>
|
||||
<div class="col-xxl-6 col-xs-12">
|
||||
<app-bars-chart [headers]="seriesHeader" [names]="seriesName" [values]="seriesRow" [colors]="seriesColor" [legend]="true"></app-bars-chart>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<mat-divider class="mt-3 mb-0"></mat-divider>
|
||||
<table class="table table-striped table-dark table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th *ngFor='let name of seriesHeader; let i=index' class="text-end"> {{ name }} </th>
|
||||
<th class="text-end">Total</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor='let values of seriesRow; let i=index'>
|
||||
<th class="{{seriesColorClass[i]}} text-end"> ● {{ seriesName[i] }} </th>
|
||||
<td *ngFor='let value of values; let i=index' class="font-monospace text-end">
|
||||
<span *ngIf="value; else elseBlock" class="pr-1">{{ value }}</span>
|
||||
<ng-template #elseBlock><span class="text-empty pr-1">{{ value }}</span></ng-template>
|
||||
</td>
|
||||
<th class="{{seriesColorClass[i]}} font-monospace text-end">{{ seriesRowTotal[i] }}</th>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th class="text-end">Total</th>
|
||||
<th *ngFor='let value of seriesColTotal; let i=index' class="font-monospace text-end">
|
||||
<span *ngIf="value; else elseBlock" class="pr-1">{{ value }}</span>
|
||||
<ng-template #elseBlock><span class="text-empty pr-1">{{ value }}</span></ng-template>
|
||||
</th>
|
||||
<th class="font-monospace text-end">{{ grandTotal }}</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="text-end">Moyenne</th>
|
||||
<th *ngFor='let value of seriesRowAvg; let i=index' class="font-monospace text-end">
|
||||
<span *ngIf="value; else elseBlock" class="pr-1">{{ value | number : '1.0-1' }}</span>
|
||||
<ng-template #elseBlock><span class="text-empty pr-1">{{ value | number : '1.0-1' }}</span></ng-template>
|
||||
</th>
|
||||
<th class="font-monospace text-end">{{ grandAvg | number : '1.0-1' }}</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="text-end">Moyenne <small>3 dernières années</small></th>
|
||||
<th *ngFor='let value of seriesRowAvgLastYears; let i=index' class="font-monospace text-end">
|
||||
<span *ngIf="value; else elseBlock" class="pr-1">{{ value | number : '1.0-1' }}</span>
|
||||
<ng-template #elseBlock><span class="text-empty pr-1">{{ value | number : '1.0-1' }}</span></ng-template>
|
||||
</th>
|
||||
<th class="font-monospace text-end">{{ grandAvgLastYears | number : '1.0-1' }}</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
<mat-card class="mt-3">
|
||||
<mat-card-header>
|
||||
<mat-card-title>Types de sauts</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content class="mt-2">
|
||||
@if(displayCharts) {
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<app-line-chart [headers]="seriesTypesHeader" [names]="seriesTypesName" [values]="seriesTypesRowCumulated" [colors]="seriesTypesColor" [legend]="true"></app-line-chart>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider class="mt-2 mb-3"></mat-divider>
|
||||
<div class="row">
|
||||
@for (item of getCategories(); track $index) {
|
||||
<div class="col-lg-2 col-sm-4 col-xs-6">
|
||||
<app-circle-chart [headers]="seriesHeader" [names]="seriesName" [values]="[item.count, (lastJump.numero-item.count)]" [color]="$index" [label]="item.categorie"></app-circle-chart>
|
||||
</div>
|
||||
}
|
||||
@for (item of getModules(); track $index) {
|
||||
<div class="col-lg-2 col-sm-4 col-xs-6">
|
||||
<app-circle-chart [headers]="seriesHeader" [names]="seriesName" [values]="[item.count, (lastJump.numero-item.count)]" [color]="getModuleColor($index)" [label]="item.module"></app-circle-chart>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<mat-divider class="my-3"></mat-divider>
|
||||
<!--
|
||||
<div class="row">
|
||||
<div class="col-xxl-6 col-xs-12">
|
||||
<app-line-chart [headers]="seriesTypesHeader" [names]="seriesTypesName" [values]="seriesTypesRow" [colors]="seriesTypesColor" [legend]="true"></app-line-chart>
|
||||
</div>
|
||||
<div class="col-xxl-6 col-xs-12">
|
||||
<app-line-chart [headers]="seriesTypesHeader" [names]="seriesTypesName" [values]="seriesTypesRowCumulated" [colors]="seriesTypesColor" [legend]="true"></app-line-chart>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
}
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -8,8 +8,8 @@ describe('JumpComponent', () => {
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [JumpComponent]
|
||||
});
|
||||
imports: [JumpComponent]
|
||||
});
|
||||
fixture = TestBed.createComponent(JumpComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
|
||||
@@ -1,139 +1,248 @@
|
||||
import { Component, OnInit, OnDestroy } from '@angular/core';
|
||||
import { trigger, state, style, animate, transition } from '@angular/animations';
|
||||
import { Component, DestroyRef, inject, OnInit, OnDestroy } from '@angular/core';
|
||||
import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { ActivatedRoute, Router, RouterModule } from '@angular/router';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatNativeDateModule } from '@angular/material/core';
|
||||
import { MatDialog, MatDialogModule } from '@angular/material/dialog';
|
||||
import { MatCardModule } from '@angular/material/card';
|
||||
import { MatDividerModule } from '@angular/material/divider';
|
||||
import { MatExpansionModule } from '@angular/material/expansion';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatSnackBar, MatSnackBarHorizontalPosition, MatSnackBarModule, MatSnackBarVerticalPosition } from '@angular/material/snack-bar';
|
||||
import { Observable, Subscription } from 'rxjs';
|
||||
import { take } from 'rxjs/operators';
|
||||
import { MatMenuModule } from '@angular/material/menu';
|
||||
|
||||
import { Errors, Jump, User } from 'src/app/core/models';
|
||||
import { JumpsService, UserService } from 'src/app/core/services';
|
||||
import { JumpDeleteDialogComponent, JumpEditDialogComponent } from 'src/app/components/jump/dialogs'
|
||||
import { Observable, Subscription } from 'rxjs';
|
||||
|
||||
import { MenuItems } from 'src/app/components/shared';
|
||||
import { BarsChartComponent, CircleChartComponent, LineChartComponent, LineAreaChartComponent } from 'src/app/components/shared/helpers-chart';
|
||||
import { UtilitiesService } from 'src/app/core/services';
|
||||
import { Jump, JumpByCategorie, JumpByDate, JumpByDateByModule, JumpByModule, JumpsPageData, JumpYears } from 'src/app/core/models';
|
||||
|
||||
@Component({
|
||||
selector: 'app-jump',
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule, RouterModule,
|
||||
MatButtonModule, MatDialogModule, MatIconModule, MatNativeDateModule, MatSnackBarModule,
|
||||
JumpDeleteDialogComponent, JumpEditDialogComponent
|
||||
CommonModule,
|
||||
MatButtonModule, MatCardModule, MatDividerModule,
|
||||
MatExpansionModule, MatIconModule, MatMenuModule,
|
||||
BarsChartComponent, CircleChartComponent, LineChartComponent, LineAreaChartComponent
|
||||
],
|
||||
selector: 'huapp-jump',
|
||||
templateUrl: './jump.component.html',
|
||||
styleUrls: ['./jump.component.scss']
|
||||
styleUrl: './jump.component.scss',
|
||||
animations: [
|
||||
trigger('flyInOut', [
|
||||
state('in', style({ transform: 'translateX(0)' })),
|
||||
transition('void => *', [
|
||||
style({ transform: 'translateX(-100%)' }),
|
||||
animate(200)
|
||||
]),
|
||||
transition('* => void', [
|
||||
style({ transform: 'translateX(100%)' }),
|
||||
animate(200)
|
||||
])
|
||||
])
|
||||
]
|
||||
})
|
||||
export class JumpComponent implements OnInit, OnDestroy {
|
||||
private _currentUser: Subscription = new Subscription();
|
||||
private _data: Subscription = new Subscription();
|
||||
public errors!: Errors;
|
||||
public jump: Jump = {} as Jump;
|
||||
public currentUser: User = {} as User;
|
||||
public canModify = false;
|
||||
private _jumpsByCategorie: Array<JumpByCategorie> = [];
|
||||
private _jumpsByModule: Array<JumpByModule> = [];
|
||||
private _jumpsByDate: Array<JumpByDate> = [];
|
||||
public lastJump: Jump = {} as Jump;
|
||||
public title: string = 'Sauts';
|
||||
public subtitle: string = 'Nombre total de sauts par mois';
|
||||
public displayCharts = false;
|
||||
public destroyRef = inject(DestroyRef);
|
||||
public min = 0;
|
||||
public max = 0;
|
||||
public grandAvg = 0;
|
||||
public grandAvgLastYears = 0;
|
||||
public grandTotal = 0;
|
||||
public seriesHeader: string[] = [];
|
||||
public seriesName: string[] = [];
|
||||
public seriesRow: Array<Array<number>> = [];
|
||||
public seriesColor: {
|
||||
backgroundColor: string[],
|
||||
borderColor: string[]
|
||||
} = {
|
||||
backgroundColor: this._utilitiesService.getSeriesColors(0.8, 'all'),
|
||||
borderColor: this._utilitiesService.getSeriesColors(1, 'all')
|
||||
};
|
||||
public seriesTypesHeader: string[] = [];
|
||||
public seriesTypesName: string[] = [];
|
||||
public seriesTypesRow: Array<Array<number>> = [];
|
||||
public seriesTypesRowCumulated: Array<Array<number>> = [];
|
||||
public seriesTypesColor: {
|
||||
backgroundColor: string[],
|
||||
borderColor: string[]
|
||||
} = {
|
||||
backgroundColor: this._utilitiesService.getSeriesColors(0.8, 'pastels'),
|
||||
borderColor: this._utilitiesService.getSeriesColors(1, 'pastels')
|
||||
};
|
||||
public seriesColorClass: string[] = this._utilitiesService.getChartColors();
|
||||
public seriesRowTotal: number[] = [];
|
||||
public seriesRowAvg: number[] = [];
|
||||
public seriesRowAvgLastYears: number[] = [];
|
||||
public seriesColTotal: number[] = [];
|
||||
public seriesColTotalClosed: number[] = [];
|
||||
public seriesColTotalLastYears: number[] = [];
|
||||
|
||||
constructor(
|
||||
private route: ActivatedRoute,
|
||||
private router: Router,
|
||||
private dialog: MatDialog,
|
||||
private _jumpsService: JumpsService,
|
||||
private _userService: UserService,
|
||||
private _snackBar: MatSnackBar
|
||||
private _utilitiesService: UtilitiesService,
|
||||
public menuItems: MenuItems
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
// Retreive the prefetched jump
|
||||
const data$: Observable<any> = this.route.data;
|
||||
this._data = data$.subscribe((data: { jump: Jump }) => {
|
||||
this.jump = data.jump;
|
||||
});
|
||||
// Load the current user's data
|
||||
const currentUser$: Observable<User> = this._userService.currentUser;
|
||||
this._currentUser = currentUser$.subscribe((userData: User) => {
|
||||
this.currentUser = userData;
|
||||
this.canModify = this.currentUser.username === this.jump.author.username;
|
||||
const data$: Observable<{ jumpsPageData: JumpsPageData }> = this.route.data as Observable<{ jumpsPageData: JumpsPageData }>;
|
||||
this._data = data$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((data: { jumpsPageData: JumpsPageData }) => {
|
||||
const pageData: JumpsPageData = data.jumpsPageData;
|
||||
this.lastJump = pageData.lastjump;
|
||||
const currentYear: number = new Date().getFullYear();
|
||||
const types: Array<string> = ['FF', 'Solo', 'VR', 'Wingsuit'];
|
||||
const verticals: Array<string> = ['Chutas', 'Head Up', 'Head Down'];
|
||||
const others: Array<string> = ['Track', 'Trace'];
|
||||
const modules: Array<string> = [...verticals, ...others];
|
||||
this.min = pageData.jumpsByYears[0].year;
|
||||
this.max = pageData.jumpsByYears[(pageData.jumpsByYears.length-1)].year;
|
||||
|
||||
this.seriesHeader = this._utilitiesService.getMonthsList();
|
||||
const values: Array<number> = this.seriesHeader.map(() => 0);
|
||||
this.seriesColTotal = [...values];
|
||||
this.seriesColTotalClosed = [...values];
|
||||
this.seriesColTotalLastYears = [...values];
|
||||
this.seriesName = pageData.jumpsByYears.map((row: JumpYears) => {
|
||||
this.seriesRow.push([...values]);
|
||||
return row.year.toString();
|
||||
});
|
||||
|
||||
this._jumpsByDate = pageData.jumpsByDate.map((row: JumpByDate) => {
|
||||
this.seriesRow[(row.year-this.min)][(row.month-1)] = row.count;
|
||||
this.seriesColTotal[(row.month-1)] += row.count;
|
||||
if (row.year < currentYear) {
|
||||
this.seriesColTotalClosed[(row.month-1)] += row.count;
|
||||
}
|
||||
if (row.year >= (currentYear-3) && row.year < currentYear) {
|
||||
this.seriesColTotalLastYears[(row.month-1)] += row.count;
|
||||
}
|
||||
return row;
|
||||
});
|
||||
this.seriesRow.forEach((row: number[]) => {
|
||||
const total = row.reduce((partialSum, a) => partialSum + a, 0);
|
||||
this.seriesRowTotal.push(total);
|
||||
});
|
||||
this.seriesColTotalClosed.forEach((row: number) => {
|
||||
const value: number = (row/(this.seriesName.length-2)); // -2 pour ne pas compter la première année
|
||||
this.seriesRowAvg.push(parseInt(value.toFixed(0)));
|
||||
});
|
||||
this.seriesColTotalLastYears.forEach((row: number) => {
|
||||
const value: number = (row/3); // Les 3 dernières années
|
||||
this.seriesRowAvgLastYears.push(parseInt(value.toFixed(0)));
|
||||
});
|
||||
this.grandAvg = this.seriesRowAvg.reduce((partialSum, accumulated) => partialSum + accumulated, 0);
|
||||
this.grandAvgLastYears = this.seriesRowAvgLastYears.reduce((partialSum, accumulated) => partialSum + accumulated, 0);
|
||||
this.grandTotal = this.seriesColTotal.reduce((partialSum, accumulated) => partialSum + accumulated, 0);
|
||||
|
||||
pageData.jumpsByCategory.forEach((row: JumpByCategorie) => {
|
||||
if (types.indexOf(row.categorie) !== -1) {
|
||||
this._jumpsByCategorie.push(row);
|
||||
}
|
||||
});
|
||||
|
||||
//const focus: Array<string> = ['FF', 'Solo']; // ['FF']
|
||||
let verticalCount:number = 0;
|
||||
let otherCount:number = 0;
|
||||
pageData.jumpsByModule.forEach((row: JumpByModule) => {
|
||||
//if (focus.indexOf(row.categorie) !== -1 && modules.indexOf(row.module) !== -1) {
|
||||
if (modules.indexOf(row.module) !== -1) {
|
||||
if (verticals.indexOf(row.module) !== -1) {
|
||||
verticalCount += row.count;
|
||||
} else {
|
||||
otherCount += row.count;
|
||||
}
|
||||
}
|
||||
});
|
||||
if (verticalCount > 0) {
|
||||
const row:JumpByModule = {
|
||||
categorie: 'FF',
|
||||
module: 'Vertical',
|
||||
count: verticalCount
|
||||
}
|
||||
this._jumpsByModule.push(row);
|
||||
}
|
||||
if (otherCount > 0) {
|
||||
const row:JumpByModule = {
|
||||
categorie: 'FF',
|
||||
module: 'Track/Trace',
|
||||
count: otherCount
|
||||
}
|
||||
this._jumpsByModule.push(row);
|
||||
}
|
||||
|
||||
for (let year = 0; year < pageData.jumpsByYears.length; year++) {
|
||||
for (let index = 0; index < 12; index++) {
|
||||
const month: string = ((index+1) < 10) ? `0${(index+1)}` : `${(index+1)}`;
|
||||
this.seriesTypesHeader.push(`${month}-${pageData.jumpsByYears[year].year}`);
|
||||
}
|
||||
}
|
||||
const emptyValues: Array<number> = this.seriesTypesHeader.map(() => 0);
|
||||
this.seriesTypesName = types;
|
||||
this.seriesTypesName.forEach(() => {
|
||||
this.seriesTypesRow.push([...emptyValues]);
|
||||
});
|
||||
pageData.jumpsByDateByModule.forEach((row: JumpByDateByModule) => {
|
||||
const indexOf: number = this.seriesTypesName.indexOf(row.categorie);
|
||||
if (indexOf !== -1) {
|
||||
this.seriesTypesRow[indexOf][(((row.year-this.min)*12)+row.month-1)] += row.count;
|
||||
}
|
||||
});
|
||||
this.seriesTypesRowCumulated = this.seriesTypesRow.map((row: Array<number>) => {
|
||||
let accumulated: number = 0;
|
||||
return row.map((value: number) => {
|
||||
accumulated += value;
|
||||
return accumulated;
|
||||
});
|
||||
});
|
||||
this.seriesTypesHeader = this.seriesTypesHeader.slice((pageData.jumpsByDateByModule[0].month+1), -(pageData.jumpsByDateByModule[(pageData.jumpsByDateByModule.length-1)].month));
|
||||
this.seriesTypesRow = this.seriesTypesRow.map((row: Array<number>) => {
|
||||
return row.slice((pageData.jumpsByDateByModule[0].month+1), -(pageData.jumpsByDateByModule[(pageData.jumpsByDateByModule.length-1)].month));
|
||||
});
|
||||
this.seriesTypesRowCumulated = this.seriesTypesRowCumulated.map((row: Array<number>) => {
|
||||
return row.slice((pageData.jumpsByDateByModule[0].month+1), -(pageData.jumpsByDateByModule[(pageData.jumpsByDateByModule.length-1)].month));
|
||||
});
|
||||
/*
|
||||
console.log('this.min', this.min);
|
||||
console.log('this.max', this.max);
|
||||
console.log('this.lastJump', this.lastJump);
|
||||
console.log('this.seriesHeader', this.seriesHeader);
|
||||
console.log('this.seriesName', this.seriesName);
|
||||
console.log('this.seriesRow', this.seriesRow);
|
||||
console.log('this.seriesRowTotal', this.seriesRowTotal);
|
||||
console.log('this.seriesRowAvg', this.seriesRowAvg);
|
||||
console.log('this.seriesRowAvgLastYears', this.seriesRowAvgLastYears);
|
||||
console.log('this._jumpsByCategorie', this._jumpsByCategorie);
|
||||
console.log('this._jumpsByModule', this._jumpsByModule);
|
||||
console.log('this.seriesTypesHeader', this.seriesTypesHeader);
|
||||
console.log('this.seriesTypesName', this.seriesTypesName);
|
||||
console.log('this.seriesTypesRow', this.seriesTypesRow);
|
||||
console.log('this.seriesTypesRowCumulated', this.seriesTypesRowCumulated);
|
||||
*/
|
||||
this.displayCharts = true;
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this._data.unsubscribe();
|
||||
this._currentUser.unsubscribe();
|
||||
}
|
||||
|
||||
openDeleteDialog(jump: Jump): void {
|
||||
const dialogRef = this.dialog.open(JumpDeleteDialogComponent, {
|
||||
width: '60vw',
|
||||
data: jump
|
||||
});
|
||||
dialogRef.afterClosed().pipe(take(1))
|
||||
.subscribe(result => {
|
||||
if (result != undefined) {
|
||||
this._onDelete(result.slug);
|
||||
}
|
||||
});
|
||||
public getCategories(): Array<JumpByCategorie> {
|
||||
return this._jumpsByCategorie;
|
||||
}
|
||||
|
||||
openEditDialog(jump: Jump): void {
|
||||
const dialogRef = this.dialog.open(JumpEditDialogComponent, {
|
||||
width: '70vw',
|
||||
data: jump
|
||||
});
|
||||
dialogRef.afterClosed().pipe(take(1))
|
||||
.subscribe(result => {
|
||||
if (result != undefined) {
|
||||
this._onEdit(result);
|
||||
}
|
||||
});
|
||||
public getModules(): Array<JumpByModule> {
|
||||
return this._jumpsByModule;
|
||||
}
|
||||
|
||||
private _onDelete(slug: string): void {
|
||||
try {
|
||||
this._jumpsService.destroy(slug)
|
||||
.pipe(take(1))
|
||||
.subscribe({
|
||||
next: () => {
|
||||
this.router.navigateByUrl('/logbook');
|
||||
},
|
||||
error: (err) => {
|
||||
this.errors = err;
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
public getModuleColor(index: number): number {
|
||||
return (this._jumpsByCategorie.length + index);
|
||||
}
|
||||
|
||||
private _onEdit(jump: Jump): void {
|
||||
try {
|
||||
let previousValues: Jump = {} as Jump;
|
||||
Object.assign(previousValues, this.jump);
|
||||
this._jumpsService.update(jump)
|
||||
.pipe(take(1))
|
||||
.subscribe({
|
||||
next: (jump) => {
|
||||
this._resetErrors();
|
||||
this._openSnackBar(`Le saut n°${jump.numero} a été mis à jour !`, 'Annuler');
|
||||
this.jump = jump;
|
||||
},
|
||||
error: (err) => {
|
||||
this.errors = err;
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
private _openSnackBar(content: string, title: string) {
|
||||
this._snackBar.open(content, title, {
|
||||
horizontalPosition: <MatSnackBarHorizontalPosition>'end',
|
||||
verticalPosition: <MatSnackBarVerticalPosition>'bottom',
|
||||
duration: 4000,
|
||||
});
|
||||
}
|
||||
|
||||
private _resetErrors(): void {
|
||||
this.errors = { errors: {} };
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1,19 +0,0 @@
|
||||
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
|
||||
import { JumpComponent } from './jump.component';
|
||||
import { JumpResolver } from './jump-resolver.service';
|
||||
|
||||
import { JumpRoutingModule } from './jump-routing.module';
|
||||
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
JumpRoutingModule,
|
||||
JumpComponent
|
||||
],
|
||||
providers: [
|
||||
JumpResolver
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
||||
})
|
||||
export class JumpModule { }
|
||||
Reference in New Issue
Block a user