sandre/SkydiveLogs
0
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Changement général pour avoir une bonne

Browse Source 
hauteur et largeur sur toutes les pages
This commit is contained in:
Sébastien André
2020-04-29 16:47:24 +02:00
parent e60ad1d3fa
commit 5f89b51db1
33 changed files with 629 additions and 521 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
Front/skydivelogs-app/src/app/app.component.css
View File

@@ -1,6 +1,5 @@
.hamburger__icon {
position: relative;
/* z-index: 101; */
height: 1rem;
margin-right: 1rem;
cursor: pointer;
@@ -18,9 +17,7 @@
.navigation {
position: absolute;
width: 200px;
/* height: 650px;
overflow: hidden; */
height: 100%;
/* height: 100%; */
z-index: 101;
background-color: grey;
padding: 5px;

7
Front/skydivelogs-app/src/app/default/default.component.css
View File

@@ -0,0 +1,7 @@
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

22
Front/skydivelogs-app/src/app/default/default.component.html
View File

@@ -1,10 +1,12 @@
<p>
<a routerLink="/summary" routerLinkActive="active" skipLocationChange>
<img src="../../assets/img/summary.png" alt="Summary of jumps">
</a>
</p>
<p>
<a routerLink="/newjump" routerLinkActive="active" skipLocationChange>
<img src="../../assets/img/addJump.png" alt="Add new jumps">
</a>
</p>
<div class="content">
<p>
<a routerLink="/summary" routerLinkActive="active" skipLocationChange>
<img src="../../assets/img/summary.png" alt="Summary of jumps">
</a>
</p>
<p>
<a routerLink="/newjump" routerLinkActive="active" skipLocationChange>
<img src="../../assets/img/addJump.png" alt="Add new jumps">
</a>
</p>
</div>

8
Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.css
View File

@@ -11,3 +11,11 @@ table {
min-width: 200px;
word-wrap: break-word;
}
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

2
Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.html
View File

@@ -1,4 +1,4 @@
<div *ngIf="dataSourceTable != null else loading" class="table-container">
<div *ngIf="dataSourceTable != null else loading">
<button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a aircraft</button>
<table mat-table [dataSource]="dataSourceTable">

8
Front/skydivelogs-app/src/app/list-of-dzs/list-of-dzs.component.css
View File

@@ -11,3 +11,11 @@ table {
min-width: 200px;
word-wrap: break-word;
}
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

108
Front/skydivelogs-app/src/app/list-of-dzs/list-of-dzs.component.html
View File

@@ -1,60 +1,62 @@
<div *ngIf="dataSourceTable != null else loading" class="table-container">
<button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a drop zone</button>
<div class="content">
<div *ngIf="dataSourceTable != null else loading">
<button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a drop zone</button>
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="isfavorite">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element" style="text-align: center;">
<mat-icon aria-hidden="false" aria-label="Favorit" *ngIf="element.isFavorite === true"
(click)="removeToFavorite(element)">favorite</mat-icon>
<mat-icon aria-hidden="false" aria-label="Not favorite" *ngIf="element.isFavorite === false"
(click)="setToFavorite(element)">favorite_border</mat-icon>
</td>
</ng-container>
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="isfavorite">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element" style="text-align: center;">
<mat-icon aria-hidden="false" aria-label="Favorit" *ngIf="element.isFavorite === true"
(click)="removeToFavorite(element)">favorite</mat-icon>
<mat-icon aria-hidden="false" aria-label="Not favorite" *ngIf="element.isFavorite === false"
(click)="setToFavorite(element)">favorite_border</mat-icon>
</td>
</ng-container>
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.name"></span>
<a href='http://{{element.website}}'>ici</a>
</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.name"></span>
<a href='http://{{element.website}}'>ici</a>
</td>
</ng-container>
<ng-container matColumnDef="latitude">
<th mat-header-cell *matHeaderCellDef>Latitude</th>
<td mat-cell *matCellDef="let element">{{element.latitude}}</td>
</ng-container>
<ng-container matColumnDef="longitude">
<th mat-header-cell *matHeaderCellDef>Longitude</th>
<td mat-cell *matCellDef="let element">{{element.longitude}}</td>
</ng-container>
<ng-container matColumnDef="latitude">
<th mat-header-cell *matHeaderCellDef>Latitude</th>
<td mat-cell *matCellDef="let element">{{element.latitude}}</td>
</ng-container>
<ng-container matColumnDef="longitude">
<th mat-header-cell *matHeaderCellDef>Longitude</th>
<td mat-cell *matCellDef="let element">{{element.longitude}}</td>
</ng-container>
<ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef>Address</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.address"></span>
</td>
</ng-container>
<ng-container matColumnDef="email">
<th mat-header-cell *matHeaderCellDef>E-mail</th>
<td mat-cell *matCellDef="let element">{{element.email}}</td>
</ng-container>
<ng-container matColumnDef="type">
<th mat-header-cell *matHeaderCellDef>Type</th>
<td mat-cell *matCellDef="let element">{{element.type}}</td>
</ng-container>
<ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef>Address</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.address"></span>
</td>
</ng-container>
<ng-container matColumnDef="email">
<th mat-header-cell *matHeaderCellDef>E-mail</th>
<td mat-cell *matCellDef="let element">{{element.email}}</td>
</ng-container>
<ng-container matColumnDef="type">
<th mat-header-cell *matHeaderCellDef>Type</th>
<td mat-cell *matCellDef="let element">{{element.type}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<mat-paginator [length]="resultsLength" [pageSize]="20"></mat-paginator>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<mat-paginator [length]="resultsLength" [pageSize]="20"></mat-paginator>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>

8
Front/skydivelogs-app/src/app/list-of-gears/list-of-gears.component.css
View File

@@ -11,3 +11,11 @@ table {
min-width: 200px;
word-wrap: break-word;
}
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

80
Front/skydivelogs-app/src/app/list-of-gears/list-of-gears.component.html
View File

@@ -1,48 +1,50 @@
<div *ngIf="dataSourceTable != null else loading" class="table-container">
<button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a gear</button>
<div class="content">
<div *ngIf="dataSourceTable != null else loading">
<button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a gear</button>
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let element">{{element.name}} <a href='http://{{element.website}}'>ici</a></td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let element">{{element.name}} <a href='http://{{element.website}}'>ici</a></td>
</ng-container>
<ng-container matColumnDef="manufacturer">
<th mat-header-cell *matHeaderCellDef>Manufacturer</th>
<td mat-cell *matCellDef="let element">{{element.manufacturer}}</td>
</ng-container>
<ng-container matColumnDef="manufacturer">
<th mat-header-cell *matHeaderCellDef>Manufacturer</th>
<td mat-cell *matCellDef="let element">{{element.manufacturer}}</td>
</ng-container>
<ng-container matColumnDef="maxSize">
<th mat-header-cell *matHeaderCellDef>Canopy size</th>
<td mat-cell *matCellDef="let element">{{element.maxSize}} - {{element.minSize}}</td>
</ng-container>
<ng-container matColumnDef="maxSize">
<th mat-header-cell *matHeaderCellDef>Canopy size</th>
<td mat-cell *matCellDef="let element">{{element.maxSize}} - {{element.minSize}}</td>
</ng-container>
<ng-container matColumnDef="aad">
<th mat-header-cell *matHeaderCellDef>AAD system</th>
<td mat-cell *matCellDef="let element">{{element.aad}}</td>
</ng-container>
<ng-container matColumnDef="aad">
<th mat-header-cell *matHeaderCellDef>AAD system</th>
<td mat-cell *matCellDef="let element">{{element.aad}}</td>
</ng-container>
<ng-container matColumnDef="mainCanopy">
<th mat-header-cell *matHeaderCellDef>Main canopy</th>
<td mat-cell *matCellDef="let element">{{element.mainCanopy}}</td>
</ng-container>
<ng-container matColumnDef="mainCanopy">
<th mat-header-cell *matHeaderCellDef>Main canopy</th>
<td mat-cell *matCellDef="let element">{{element.mainCanopy}}</td>
</ng-container>
<ng-container matColumnDef="reserveCanopy">
<th mat-header-cell *matHeaderCellDef>Reserve canopy</th>
<td mat-cell *matCellDef="let element">{{element.reserveCanopy}}</td>
</ng-container>
<ng-container matColumnDef="reserveCanopy">
<th mat-header-cell *matHeaderCellDef>Reserve canopy</th>
<td mat-cell *matCellDef="let element">{{element.reserveCanopy}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<mat-paginator [length]="resultsLength" [pageSize]="10"></mat-paginator>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<mat-paginator [length]="resultsLength" [pageSize]="10"></mat-paginator>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>

8
Front/skydivelogs-app/src/app/list-of-jump-types/list-of-jump-types.component.css
View File

@@ -11,3 +11,11 @@ table {
min-width: 200px;
word-wrap: break-word;
}
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

2
Front/skydivelogs-app/src/app/list-of-jump-types/list-of-jump-types.component.html
View File

@@ -1,4 +1,4 @@
<div *ngIf="dataSourceTable != null else loading" class="table-container">
<div *ngIf="dataSourceTable != null else loading">
<button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a jump type</button>
<table mat-table [dataSource]="dataSourceTable">

8
Front/skydivelogs-app/src/app/list-of-jumps/list-of-jumps.component.css
View File

@@ -17,3 +17,11 @@ table {
min-width: 50px;
word-wrap: break-word;
}
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

86
Front/skydivelogs-app/src/app/list-of-jumps/list-of-jumps.component.html
View File

@@ -1,49 +1,51 @@
<div *ngIf="dataSourceTable != null else loading" class="table-container">
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<div class="content">
<div *ngIf="dataSourceTable != null else loading">
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<ng-container matColumnDef="jumpDate">
<th mat-header-cell *matHeaderCellDef>Date</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.jumpDate | date: 'yyyy-MM-dd'"></span>
</td>
</ng-container>
<ng-container matColumnDef="jumpDate">
<th mat-header-cell *matHeaderCellDef>Date</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.jumpDate | date: 'yyyy-MM-dd'"></span>
</td>
</ng-container>
<ng-container matColumnDef="jumpType">
<th mat-header-cell *matHeaderCellDef>Jump Type</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.jumpType.name"></span>
</td>
</ng-container>
<ng-container matColumnDef="jumpType">
<th mat-header-cell *matHeaderCellDef>Jump Type</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.jumpType.name"></span>
</td>
</ng-container>
<ng-container matColumnDef="aircraft">
<th mat-header-cell *matHeaderCellDef>Aircraft</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.aircraft.name"></span>
</td>
</ng-container>
<ng-container matColumnDef="aircraft">
<th mat-header-cell *matHeaderCellDef>Aircraft</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.aircraft.name"></span>
</td>
</ng-container>
<ng-container matColumnDef="dropZone">
<th mat-header-cell *matHeaderCellDef>Drop Zone</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.dropZone.name"></span>
</td>
</ng-container>
<ng-container matColumnDef="dropZone">
<th mat-header-cell *matHeaderCellDef>Drop Zone</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.dropZone.name"></span>
</td>
</ng-container>
<ng-container matColumnDef="gear">
<th mat-header-cell *matHeaderCellDef>Gear</th>
<td mat-cell *matCellDef="let element">{{element.gear.name}}</td>
</ng-container>
<ng-container matColumnDef="gear">
<th mat-header-cell *matHeaderCellDef>Gear</th>
<td mat-cell *matCellDef="let element">{{element.gear.name}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<mat-paginator [length]="resultsLength" [pageSize]="10"></mat-paginator>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<mat-paginator [length]="resultsLength" [pageSize]="10"></mat-paginator>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>

4
Front/skydivelogs-app/src/app/login/login.component.css
View File

@@ -1,5 +1,5 @@
.main-div {
height: 100vh;
.content {
height: 90vh;
display: flex;
justify-content: center;
align-items: center;

2
Front/skydivelogs-app/src/app/login/login.component.html
View File

@@ -1,4 +1,4 @@
<div class="main-div">
<div class="content">
<mat-card style="max-width: 500px;" flex="50">
<mat-card-header style="padding:10px; background-color: rgba(0,0,0,.03);">
<mat-card-title>Login to the Skydive log</mat-card-title>

8
Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.css
View File

@@ -1 +1,7 @@
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

20
Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.html
View File

@@ -1,10 +1,12 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p>
<mat-form-field>
<mat-label>Aircraft name</mat-label>
<input matInput type="text" formControlName="aircraftName">
</mat-form-field>
</p>
<div class="content">
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p>
<mat-form-field>
<mat-label>Aircraft name</mat-label>
<input matInput type="text" formControlName="aircraftName">
</mat-form-field>
</p>
<button type="submit" mat-raised-button color="accent">Add</button>
</form>
<button type="submit" mat-raised-button color="accent">Add</button>
</form>
</div>

8
Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.css
View File

@@ -1 +1,7 @@
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

80
Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.html
View File

@@ -1,40 +1,42 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p>
<mat-form-field>
<mat-label>Dropzone name</mat-label>
<input matInput type="text" formControlName="dzName" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>GPS</mat-label>
<input matInput type="text" formControlName="gps" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Address of the DZ</mat-label>
<textarea matInput formControlName="address"></textarea>
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Web site</mat-label>
<input matInput type="text" formControlName="website" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Mail of contact</mat-label>
<input matInput type="text" formControlName="contactMail" />
</mat-form-field>
</p>
<p>
<mat-checkbox formControlName="isDz">Is a dropzone</mat-checkbox>
</p>
<p>
<mat-checkbox formControlName="isTunnel">Is a tunnel</mat-checkbox>
</p>
<div class="content">
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p>
<mat-form-field>
<mat-label>Dropzone name</mat-label>
<input matInput type="text" formControlName="dzName" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>GPS</mat-label>
<input matInput type="text" formControlName="gps" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Address of the DZ</mat-label>
<textarea matInput formControlName="address"></textarea>
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Web site</mat-label>
<input matInput type="text" formControlName="website" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Mail of contact</mat-label>
<input matInput type="text" formControlName="contactMail" />
</mat-form-field>
</p>
<p>
<mat-checkbox formControlName="isDz">Is a dropzone</mat-checkbox>
</p>
<p>
<mat-checkbox formControlName="isTunnel">Is a tunnel</mat-checkbox>
</p>
<button type="submit" mat-raised-button color="accent">Add</button>
</form>
<button type="submit" mat-raised-button color="accent">Add</button>
</form>
</div>

8
Front/skydivelogs-app/src/app/new-gear/new-gear.component.css
View File

@@ -1 +1,7 @@
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

92
Front/skydivelogs-app/src/app/new-gear/new-gear.component.html
View File

@@ -1,46 +1,48 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p>
<mat-form-field>
<mat-label>Name of gear</mat-label>
<input matInput type="text" formControlName="name">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Manufacturer</mat-label>
<input matInput type="text" formControlName="manufacturer">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Min size of canopy</mat-label>
<input matInput type="text" formControlName="minSize">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Max size of canopy</mat-label>
<input matInput type="text" formControlName="maxSize">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>AAD system</mat-label>
<input matInput type="text" formControlName="aad">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Main Canopy</mat-label>
<input matInput type="text" formControlName="mainCanopy">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Reserve canopy</mat-label>
<input matInput type="text" formControlName="reserveCanopy">
</mat-form-field>
</p>
<div class="content">
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p>
<mat-form-field>
<mat-label>Name of gear</mat-label>
<input matInput type="text" formControlName="name">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Manufacturer</mat-label>
<input matInput type="text" formControlName="manufacturer">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Min size of canopy</mat-label>
<input matInput type="text" formControlName="minSize">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Max size of canopy</mat-label>
<input matInput type="text" formControlName="maxSize">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>AAD system</mat-label>
<input matInput type="text" formControlName="aad">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Main Canopy</mat-label>
<input matInput type="text" formControlName="mainCanopy">
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Reserve canopy</mat-label>
<input matInput type="text" formControlName="reserveCanopy">
</mat-form-field>
</p>
<button mat-raised-button color="accent" type="submit">Add</button>
</form>
<button mat-raised-button color="accent" type="submit">Add</button>
</form>
</div>

8
Front/skydivelogs-app/src/app/new-jump-type/new-jump-type.component.css
View File

@@ -1 +1,7 @@
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

20
Front/skydivelogs-app/src/app/new-jump-type/new-jump-type.component.html
View File

@@ -1,10 +1,12 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p>
<mat-form-field>
<mat-label>Jump type name</mat-label>
<input matInput type="text" formControlName="jumptypeName">
</mat-form-field>
</p>
<div class="content">
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p>
<mat-form-field>
<mat-label>Jump type name</mat-label>
<input matInput type="text" formControlName="jumptypeName">
</mat-form-field>
</p>
<button type="submit" mat-raised-button color="accent">Add</button>
</form>
<button type="submit" mat-raised-button color="accent">Add</button>
</form>
</div>

8
Front/skydivelogs-app/src/app/new-jump/new-jump.component.css
View File

@@ -12,3 +12,11 @@
.formNewJumps>* {
width: 100%;
}
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

190
Front/skydivelogs-app/src/app/new-jump/new-jump.component.html
View File

@@ -1,103 +1,107 @@
<form class="formNewJumps" (ngSubmit)="onFormSubmit()" *ngIf="allDatasLoaded() else loading">
<mat-form-field>
<mat-label>Choose the jump type</mat-label>
<input type="text" matInput [matAutocomplete]="autoJumpType" [(ngModel)]="selectedJumpType" name="selectedJumpType">
<mat-autocomplete #autoJumpType="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let jumpType of listOfJumpType" [value]="jumpType">
{{jumpType.name}}
</mat-option>
</mat-autocomplete>
<button mat-button *ngIf="selectedJumpType" matSuffix mat-icon-button aria-label="Clear"
(click)="selectedJumpType=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<div class="content">
<form class="formNewJumps" (ngSubmit)="onFormSubmit()" *ngIf="allDatasLoaded() else loading">
<mat-form-field>
<mat-label>Choose the jump type</mat-label>
<input type="text" matInput [matAutocomplete]="autoJumpType" [(ngModel)]="selectedJumpType"
name="selectedJumpType">
<mat-autocomplete #autoJumpType="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let jumpType of listOfJumpType" [value]="jumpType">
{{jumpType.name}}
</mat-option>
</mat-autocomplete>
<button mat-button *ngIf="selectedJumpType" matSuffix mat-icon-button aria-label="Clear"
(click)="selectedJumpType=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<mat-label>Choose the aircraft</mat-label>
<input type="text" matInput [matAutocomplete]="autoAircraft" [(ngModel)]="selectedAircraft" name="selectedAircraft">
<mat-autocomplete #autoAircraft="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let aircraft of listOfAircraft" [value]="aircraft">
{{aircraft.name}}
</mat-option>
</mat-autocomplete>
<button mat-button *ngIf="selectedAircraft" matSuffix mat-icon-button aria-label="Clear"
(click)="selectedAircraft=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<mat-label>Choose the aircraft</mat-label>
<input type="text" matInput [matAutocomplete]="autoAircraft" [(ngModel)]="selectedAircraft"
name="selectedAircraft">
<mat-autocomplete #autoAircraft="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let aircraft of listOfAircraft" [value]="aircraft">
{{aircraft.name}}
</mat-option>
</mat-autocomplete>
<button mat-button *ngIf="selectedAircraft" matSuffix mat-icon-button aria-label="Clear"
(click)="selectedAircraft=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<mat-label>Choose the DZ</mat-label>
<input type="text" matInput [matAutocomplete]="autoDropZone" [(ngModel)]="selectedDz"
(ngModelChange)="onChangeDz($event)" name="selectedDz">
<mat-autocomplete #autoDropZone="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let dropZone of listOfFilteredDropZone" [value]="dropZone">
{{dropZone.name}}
<img src="../../assets/img/favorite.png" alt="favorite DZ" *ngIf="dropZone.isFavorite === true"
style="width: 16px;">
</mat-option>
</mat-autocomplete>
<button mat-button *ngIf="selectedDz" matSuffix mat-icon-button aria-label="Clear" (click)="selectedDz=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<mat-label>Choose the DZ</mat-label>
<input type="text" matInput [matAutocomplete]="autoDropZone" [(ngModel)]="selectedDz"
(ngModelChange)="onChangeDz($event)" name="selectedDz">
<mat-autocomplete #autoDropZone="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let dropZone of listOfFilteredDropZone" [value]="dropZone">
{{dropZone.name}}
<img src="../../assets/img/favorite.png" alt="favorite DZ" *ngIf="dropZone.isFavorite === true"
style="width: 16px;">
</mat-option>
</mat-autocomplete>
<button mat-button *ngIf="selectedDz" matSuffix mat-icon-button aria-label="Clear" (click)="selectedDz=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<mat-label>Choose the used gear</mat-label>
<input type="text" matInput [matAutocomplete]="autoGear" [(ngModel)]="selectedGear" name="selectedGear">
<mat-autocomplete #autoGear="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let gear of listOfGear" [value]="gear">
{{gear.name}}
</mat-option>
</mat-autocomplete>
<button mat-button *ngIf="selectedGear" matSuffix mat-icon-button aria-label="Clear"
(click)="selectedGear=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<mat-label>Choose the used gear</mat-label>
<input type="text" matInput [matAutocomplete]="autoGear" [(ngModel)]="selectedGear" name="selectedGear">
<mat-autocomplete #autoGear="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let gear of listOfGear" [value]="gear">
{{gear.name}}
</mat-option>
</mat-autocomplete>
<button mat-button *ngIf="selectedGear" matSuffix mat-icon-button aria-label="Clear"
(click)="selectedGear=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-checkbox [(ngModel)]="withCutaway" name="withCutaway">With a cutaway ?</mat-checkbox>
<mat-checkbox [(ngModel)]="withCutaway" name="withCutaway">With a cutaway ?</mat-checkbox>
<mat-form-field>
<input matInput [matDatepicker]="beginDateDp" [(ngModel)]="beginDate" name="beginDate" disabled>
<mat-datepicker-toggle matSuffix [for]="beginDateDp"></mat-datepicker-toggle>
<mat-datepicker #beginDateDp disabled="false"></mat-datepicker>
</mat-form-field>
<mat-form-field>
<input matInput [matDatepicker]="beginDateDp" [(ngModel)]="beginDate" name="beginDate" disabled>
<mat-datepicker-toggle matSuffix [for]="beginDateDp"></mat-datepicker-toggle>
<mat-datepicker #beginDateDp disabled="false"></mat-datepicker>
</mat-form-field>
<mat-form-field>
<input matInput [matDatepicker]="endDateDp" [(ngModel)]="endDate" name="endDate" disabled>
<mat-datepicker-toggle matSuffix [for]="endDateDp"></mat-datepicker-toggle>
<mat-datepicker #endDateDp disabled="false"></mat-datepicker>
</mat-form-field>
<mat-form-field>
<input matInput [matDatepicker]="endDateDp" [(ngModel)]="endDate" name="endDate" disabled>
<mat-datepicker-toggle matSuffix [for]="endDateDp"></mat-datepicker-toggle>
<mat-datepicker #endDateDp disabled="false"></mat-datepicker>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Exit altitude" [(ngModel)]="exitAltitude" name="exitAltitude" type="number">
<button mat-button *ngIf="exitAltitude" matSuffix mat-icon-button aria-label="Clear"
(click)="exitAltitude=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Deploy altitude" [(ngModel)]="deployAltitude" name="deployAltitude" type="number">
<button mat-button *ngIf="deployAltitude" matSuffix mat-icon-button aria-label="Clear"
(click)="deployAltitude=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Exit altitude" [(ngModel)]="exitAltitude" name="exitAltitude" type="number">
<button mat-button *ngIf="exitAltitude" matSuffix mat-icon-button aria-label="Clear"
(click)="exitAltitude=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Deploy altitude" [(ngModel)]="deployAltitude" name="deployAltitude" type="number">
<button mat-button *ngIf="deployAltitude" matSuffix mat-icon-button aria-label="Clear"
(click)="deployAltitude=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Count of jumps" [(ngModel)]="countOfJumps" name="countOfJumps" type="number">
<button mat-button *ngIf="countOfJumps" matSuffix mat-icon-button aria-label="Clear"
(click)="countOfJumps=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Count of jumps" [(ngModel)]="countOfJumps" name="countOfJumps" type="number">
<button mat-button *ngIf="countOfJumps" matSuffix mat-icon-button aria-label="Clear"
(click)="countOfJumps=undefined">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<br />
<button mat-button *ngIf="isValidatedForm()">Submit</button>
</form>
<br />
<button mat-button *ngIf="isValidatedForm()">Submit</button>
</form>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>

8
Front/skydivelogs-app/src/app/summary/summary.component.css
View File

@@ -13,3 +13,11 @@
.labelTab.selected {
background-color: gray !important;
}
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

236
Front/skydivelogs-app/src/app/summary/summary.component.html
View File

@@ -1,118 +1,120 @@
<div>
<label style="float: left; width: 130px;">Total jumps</label>
<span>: {{ totalJumps }}</span>
<div class="content">
<div>
<label style="float: left; width: 130px;">Total jumps</label>
<span>: {{ totalJumps }}</span>
</div>
<div>
<label style="clear: both; float: left; width: 130px;">Total cutaways</label>
<span>: {{ totalCutaways }}</span>
</div>
<div>
<label style="clear: both; float: left; width: 130px;">Last jump</label>
<span>: {{ lastJump }}</span>
</div>
<mat-tab-group mat-align-tabs="left" animationDuration="0ms">
<mat-tab label="Jumps in the last month">
<table mat-table [dataSource]="dsJumpForLastMonthByDz">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<table mat-table [dataSource]="dsJumpForLastMonthByJumpType">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="Jumps in the last year">
<table mat-table [dataSource]="dsJumpForLastYearByDz">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<table mat-table [dataSource]="dsJumpForLastYearByJumpType">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By DZ">
<table mat-table [dataSource]="dsNbJumpByDz">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By aircraft">
<table mat-table [dataSource]="dsNbJumpByAircraft">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By gear">
<table mat-table [dataSource]="dsNbJumpByGear">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By jump type">
<table mat-table [dataSource]="dsNbJumpByType">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By year">
<table mat-table [dataSource]="dsNbJumpByYear">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
</mat-tab-group>
</div>
<div>
<label style="clear: both; float: left; width: 130px;">Total cutaways</label>
<span>: {{ totalCutaways }}</span>
</div>
<div>
<label style="clear: both; float: left; width: 130px;">Last jump</label>
<span>: {{ lastJump }}</span>
</div>
<mat-tab-group mat-align-tabs="left" animationDuration="0ms">
<mat-tab label="Jumps in the last month">
<table mat-table [dataSource]="dsJumpForLastMonthByDz">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<table mat-table [dataSource]="dsJumpForLastMonthByJumpType">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="Jumps in the last year">
<table mat-table [dataSource]="dsJumpForLastYearByDz">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<table mat-table [dataSource]="dsJumpForLastYearByJumpType">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By DZ">
<table mat-table [dataSource]="dsNbJumpByDz">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By aircraft">
<table mat-table [dataSource]="dsNbJumpByAircraft">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By gear">
<table mat-table [dataSource]="dsNbJumpByGear">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By jump type">
<table mat-table [dataSource]="dsNbJumpByType">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
<mat-tab label="By year">
<table mat-table [dataSource]="dsNbJumpByYear">
<ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container>
<ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
</mat-tab-group>

7
Front/skydivelogs-app/src/app/user-profile/user-profile.component.css
View File

@@ -0,0 +1,7 @@
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

80
Front/skydivelogs-app/src/app/user-profile/user-profile.component.html
View File

@@ -1,41 +1,43 @@
<form [formGroup]="userForm" (ngSubmit)="onSubmit(userForm.value)">
<p>
<mat-form-field>
<mat-label>Login</mat-label>
<input matInput type="text" formControlName="login" readonly />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Firstname</mat-label>
<input matInput type="text" formControlName="firstName" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Lastname</mat-label>
<input matInput type="text" formControlName="lastName" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>E-mail</mat-label>
<input matInput type="text" formControlName="email" />
</mat-form-field>
</p>
<div class="content">
<form [formGroup]="userForm" (ngSubmit)="onSubmit(userForm.value)">
<p>
<mat-form-field>
<mat-label>Login</mat-label>
<input matInput type="text" formControlName="login" readonly />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Firstname</mat-label>
<input matInput type="text" formControlName="firstName" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Lastname</mat-label>
<input matInput type="text" formControlName="lastName" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>E-mail</mat-label>
<input matInput type="text" formControlName="email" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Current password</mat-label>
<input matInput type="text" formControlName="currentPassword" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>New password</mat-label>
<input matInput type="text" formControlName="newPassword" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Current password</mat-label>
<input matInput type="text" formControlName="currentPassword" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>New password</mat-label>
<input matInput type="text" formControlName="newPassword" />
</mat-form-field>
</p>
<button type="submit" mat-raised-button color="accent">Update my profile</button>
</form>
<button type="submit" mat-raised-button color="accent">Update my profile</button>
</form>
</div>