"Sort" sur les tableaux et listes déroulantes.

Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.ts

@@ -16,7 +16,7 @@ import { AircraftResp } from '../../models/aircraft';
   styleUrls: ['./list-of-aircrafts.component.css']
 })
 export class ListOfAircraftsComponent implements OnInit {
-  public displayedColumns: Array<string> = ['id', 'name', 'imageData'];
+  public displayedColumns: Array<string> = ['name', 'imageData'];
   public dataSourceTable: MatTableDataSource<AircraftResp>;
   public resultsLength = 0;
   public isUserAdmin: boolean;
@@ -43,7 +43,7 @@ export class ListOfAircraftsComponent implements OnInit {
   private getListOfAircrafts() {
     this.serviceApi.getListOfAircrafts().subscribe(data => {
       setTimeout(() => {
-        data.sort((a, b) => (b.name < a.name ? 1 : -1));
+        data.sort((a, b) => a.name.localeCompare(b.name));
         this.dataSourceTable = new MatTableDataSource<AircraftResp>(data);
         this.dataSourceTable.paginator = this.paginator;
         this.resultsLength = data.length;

Front/skydivelogs-app/src/app/list-of-dzs/list-of-dzs.component.ts

@@ -18,7 +18,6 @@ import { NewDropZoneComponent } from '../new-drop-zone/new-drop-zone.component';
 export class ListOfDzsComponent implements OnInit {
   public displayedColumns: Array<string> = [
     'isfavorite',
-    'id',
     'name',
     'address',
     'type',
@@ -49,7 +48,7 @@ export class ListOfDzsComponent implements OnInit {
   private getListOfDropZones() {
     this.serviceApi.getListOfDropZones().subscribe((data) => {
       setTimeout(() => {
-        data.sort((a, b) => (b.isFavorite ? 1 : 0) - (a.isFavorite ? 1 : 0));
+        data.sort((a, b) => (b.isFavorite ? 1 : 0) - (a.isFavorite ? 1 : 0) || a.name.localeCompare(b.name));
         this.dataSourceTable = new MatTableDataSource<DropZoneResp>(data);
         this.dataSourceTable.paginator = this.paginator;
         this.resultsLength = data.length;

Front/skydivelogs-app/src/app/list-of-gears/list-of-gears.component.ts

@@ -16,7 +16,6 @@ import { NewGearComponent } from "../new-gear/new-gear.component";
 })
 export class ListOfGearsComponent implements OnInit {
   public displayedColumns: Array<string> = [
-    "id",
     "name",
     "manufacturer",
     "maxSize",
@@ -47,6 +46,7 @@ export class ListOfGearsComponent implements OnInit {
     this.serviceApi.getListOfGears()
                    .subscribe(data => {
       setTimeout(() => {
+        data.sort((a, b) => b.id - a.id);
         this.dataSourceTable = new MatTableDataSource<GearResp>(data);
         this.dataSourceTable.paginator = this.paginator;
         this.resultsLength = data.length;

Front/skydivelogs-app/src/app/list-of-jump-types/list-of-jump-types.component.ts

@@ -16,7 +16,7 @@ import { NewJumpTypeComponent } from "../new-jump-type/new-jump-type.component";
   styleUrls: ["./list-of-jump-types.component.css"]
 })
 export class ListOfJumpTypesComponent implements OnInit {
-  public displayedColumns: Array<string> = ["id", "name"];
+  public displayedColumns: Array<string> = ["name"];
   public dataSourceTable: MatTableDataSource<JumpTypeResp>;
   public isUserAdmin: boolean;
   public resultsLength = 0;
@@ -43,7 +43,7 @@ export class ListOfJumpTypesComponent implements OnInit {
   getListOfJumpTypes() {
     this.serviceApi.getListOfJumpTypes().subscribe(data => {
       setTimeout(() => {
-        data.sort((a, b) => (b.name < a.name ? 1 : -1));
+        data.sort((a, b) => a.name.localeCompare(b.name));
         this.dataSourceTable = new MatTableDataSource<JumpTypeResp>(data);
         this.dataSourceTable.paginator = this.paginator;
         this.resultsLength = data.length;

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

@@ -26,3 +26,7 @@ table {
   align-items: initial;
   padding-top: 25px;
 }
+
+th.mat-header-cell {
+  text-align: center;
+}

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

@@ -5,7 +5,7 @@
   <div *ngIf="dataSourceTable != null else loading">
     <table mat-table [dataSource]="dataSourceTable">
       <ng-container matColumnDef="infos">
-        <th mat-header-cell *matHeaderCellDef></th>
+        <th mat-header-cell *matHeaderCellDef style="width: 60px;"></th>
         <td mat-cell *matCellDef="let element" style="text-align: left;">
           <mat-icon aria-hidden="false" aria-label="Special jump" [style.visibility]="element.isSpecial ? 'visible' : 'hidden'">celebration</mat-icon>
           <mat-icon aria-hidden="false" aria-label="Additional informations of the jump" style="cursor: pointer;"
@@ -14,7 +14,7 @@
       </ng-container>
 
       <ng-container matColumnDef="id">
-        <th mat-header-cell *matHeaderCellDef>ID</th>
+        <th mat-header-cell *matHeaderCellDef style="width: 60px;">Num</th>
         <td mat-cell *matCellDef="let element">{{element.id}}</td>
       </ng-container>
 
@@ -52,7 +52,7 @@
       </ng-container>
 
       <ng-container matColumnDef="actions">
-        <th mat-header-cell *matHeaderCellDef></th>
+        <th mat-header-cell *matHeaderCellDef style="width: 70px;"></th>
         <td mat-cell *matCellDef="let element" style="text-align: left;">
           <mat-icon aria-hidden="false" aria-label="Delete this jump" style="cursor: pointer;"
                     (click)='delete(element)'>delete</mat-icon>
@@ -65,7 +65,7 @@
       <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
     </table>
   </div>
-  <mat-paginator [length]="resultsLength" [pageSize]="10"></mat-paginator>
+  <mat-paginator [length]="resultsLength" [pageSize]="20"></mat-paginator>
 
   <ng-template #loading>
     <mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>

Front/skydivelogs-app/src/app/list-of-jumps/list-of-jumps.component.ts

@@ -49,7 +49,7 @@ export class ListOfJumpsComponent implements OnInit {
     this.listOfJumps = this.serviceApi.GetListOfJumps();
     this.listOfJumps.subscribe(data => {
       setTimeout(() => {
-        data.sort((a, b) => b.jumpDate.getTime() - a.jumpDate.getTime());
+        data.sort((a, b) => b.id - a.id);
         this.dataSourceTable = new MatTableDataSource<JumpResp>(data);
         this.dataSourceTable.paginator = this.paginator;
         this.resultsLength = data.length;

Front/skydivelogs-app/src/app/new-jump/new-jump.component.ts

@@ -98,6 +98,7 @@ export class NewJumpComponent implements OnInit {
 
   private getListOfJumpTypes() {
     this.serviceJumpType.getListOfJumpTypes().subscribe((data) => {
+      data.sort((a, b) => a.name.localeCompare(b.name));
       this.listOfJumpType = data;
       this.countDatasLoaded = 1;
 
@@ -109,6 +110,7 @@ export class NewJumpComponent implements OnInit {
 
   private getListOfAircrafts() {
     this.serviceAircraft.getListOfAircrafts(true).subscribe((data) => {
+      data.sort((a, b) => a.name.localeCompare(b.name));
       this.listOfAircraft = data;
       this.countDatasLoaded++;
     });
@@ -116,7 +118,7 @@ export class NewJumpComponent implements OnInit {
 
   private getListOfDropZones() {
     this.serviceDropzone.getListOfDropZones(true).subscribe((data) => {
-      data.sort((a, b) => (b.isFavorite ? 1 : 0) - (a.isFavorite ? 1 : 0));
+      data.sort((a, b) => (b.isFavorite ? 1 : 0) - (a.isFavorite ? 1 : 0) || a.name.localeCompare(b.name));
       this.listOfDropZone = data;
       this.listOfFilteredDropZone = data;
       this.countDatasLoaded++;
@@ -125,6 +127,7 @@ export class NewJumpComponent implements OnInit {
 
   private getListOfGears() {
     this.serviceGear.getListOfGears().subscribe((data) => {
+      data.sort((a, b) => b.id - a.id);
       this.listOfGear = data;
       this.countDatasLoaded++;
     });