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

Changement de style de la page des

Browse Source 
stats résumées
This commit is contained in:
Sébastien André
2020-04-05 13:32:52 +02:00
parent 8dcc2bd0b4
commit 9455b543c1
3 changed files with 99 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,22 +1,3 @@
<!-- <div class="col-md-4 offset-md-4 mt-5">
<div class="card">
<h4 class="card-header">Login to the Skydive log</h4>
<div class="card-body">
<mat-tab-group mat-align-tabs="center" animationDuration="0ms">
<mat-tab label="Login with a user">
<app-login-user></app-login-user>
</mat-tab>
<mat-tab label="Create and login a user">
<app-create-user></app-create-user>
</mat-tab>
</mat-tab-group>
</div>
</div>
</div> -->
<mat-card style="max-width: 500px;"> <mat-card style="max-width: 500px;">
<mat-card-header> <mat-card-header>
<mat-card-title>Login to the Skydive log</mat-card-title> <mat-card-title>Login to the Skydive log</mat-card-title>

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

@@ -13,149 +13,106 @@
<span>: {{ lastJump }}</span> <span>: {{ lastJump }}</span>
</div> </div>
<div style="clear: both; display: flex; flex-direction: row; flex-wrap: wrap; margin-top: 15px;"> <mat-tab-group mat-align-tabs="left" animationDuration="0ms">
<label (click)="showStats(1)" [ngClass]="statsToShow(1) ? 'labelTab selected': 'labelTab'">Jumps in the last <mat-tab label="Jumps in the last month">
month</label> <table mat-table [dataSource]="dsJumpForLastMonthByDz">
<label (click)="showStats(2)" [ngClass]="statsToShow(2) ? 'labelTab selected': 'labelTab'">Jumps in the last <ng-container matColumnDef="label">
year</label> <td mat-cell *matCellDef="let element">{{element.label}}</td>
<label (click)="showStats(3)" [ngClass]="statsToShow(3) ? 'labelTab selected': 'labelTab'">By DZ</label> </ng-container>
<label (click)="showStats(4)" [ngClass]="statsToShow(4) ? 'labelTab selected': 'labelTab'">By aircraft</label> <ng-container matColumnDef="nb">
<label (click)="showStats(5)" [ngClass]="statsToShow(5) ? 'labelTab selected': 'labelTab'">By gear</label> <td mat-cell *matCellDef="let element">{{element.nb}}</td>
<label (click)="showStats(6)" [ngClass]="statsToShow(6) ? 'labelTab selected': 'labelTab'">By jump type</label> </ng-container>
<label (click)="showStats(7)" [ngClass]="statsToShow(7) ? 'labelTab selected': 'labelTab'">By year</label> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</div> </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>
<div *ngIf="statsToShow(1)"> <mat-tab label="Jumps in the last year">
<table mat-table [dataSource]="dsJumpForLastMonthByDz" <table mat-table [dataSource]="dsJumpForLastYearByDz">
*ngIf="dsJumpForLastMonthByDz != null else loadingDsJumpForLastMonthByDz"> <ng-container matColumnDef="label">
<ng-container matColumnDef="label"> <td mat-cell *matCellDef="let element">{{element.label}}</td>
<td mat-cell *matCellDef="let element">{{element.label}}</td> </ng-container>
</ng-container> <ng-container matColumnDef="nb">
<ng-container matColumnDef="nb"> <td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{element.nb}}</td> </ng-container>
</ng-container> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> </table>
</table> <table mat-table [dataSource]="dsJumpForLastYearByJumpType">
<ng-template #loadingDsJumpForLastMonthByDz> <ng-container matColumnDef="label">
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner> <td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-template> </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>
<table mat-table [dataSource]="dsJumpForLastMonthByJumpType" <mat-tab label="By DZ">
*ngIf="dsJumpForLastMonthByJumpType != null else loadingDsJumpForLastMonthByJumpType"> <table mat-table [dataSource]="dsNbJumpByDz">
<ng-container matColumnDef="label"> <ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td> <td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="nb"> <ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td> <td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container> </ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table> </table>
<ng-template #loadingDsJumpForLastMonthByJumpType> </mat-tab>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<div *ngIf="statsToShow(2)"> <mat-tab label="By aircraft">
<table mat-table [dataSource]="dsJumpForLastYearByDz" <table mat-table [dataSource]="dsNbJumpByAircraft">
*ngIf="dsJumpForLastYearByDz != null else loadingDsJumpForLastYearByDz"> <ng-container matColumnDef="label">
<ng-container matColumnDef="label"> <td mat-cell *matCellDef="let element">{{element.label}}</td>
<td mat-cell *matCellDef="let element">{{element.label}}</td> </ng-container>
</ng-container> <ng-container matColumnDef="nb">
<ng-container matColumnDef="nb"> <td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{element.nb}}</td> </ng-container>
</ng-container> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> </table>
</table> </mat-tab>
<ng-template #loadingDsJumpForLastYearByDz>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
<table mat-table [dataSource]="dsJumpForLastYearByJumpType" <mat-tab label="By gear">
*ngIf="dsJumpForLastYearByJumpType != null else loadingDsJumpForLastYearByJumpType"> <table mat-table [dataSource]="dsNbJumpByGear">
<ng-container matColumnDef="label"> <ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td> <td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="nb"> <ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td> <td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container> </ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table> </table>
<ng-template #loadingDsJumpForLastYearByJumpType> </mat-tab>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<div *ngIf="statsToShow(3)"> <mat-tab label="By jump type">
<table mat-table [dataSource]="dsNbJumpByDz" *ngIf="dsNbJumpByDz != null else loadingDsNbJumpByDz"> <table mat-table [dataSource]="dsNbJumpByType">
<ng-container matColumnDef="label"> <ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td> <td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="nb"> <ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td> <td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container> </ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table> </table>
<ng-template #loadingDsNbJumpByDz> </mat-tab>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<div *ngIf="statsToShow(4)"> <mat-tab label="By year">
<table mat-table [dataSource]="dsNbJumpByAircraft" *ngIf="dsNbJumpByAircraft != null else loadingDsNbJumpByAircraft"> <table mat-table [dataSource]="dsNbJumpByYear">
<ng-container matColumnDef="label"> <ng-container matColumnDef="label">
<td mat-cell *matCellDef="let element">{{element.label}}</td> <td mat-cell *matCellDef="let element">{{element.label}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="nb"> <ng-container matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td> <td mat-cell *matCellDef="let element">{{element.nb}}</td>
</ng-container> </ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table> </table>
<ng-template #loadingDsNbJumpByAircraft> </mat-tab>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner> </mat-tab-group>
</ng-template>
</div>
<div *ngIf="statsToShow(5)">
<table mat-table [dataSource]="dsNbJumpByGear" *ngIf="dsNbJumpByGear != null else loadingDsNbJumpByGear">
<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>
<ng-template #loadingDsNbJumpByGear>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<div *ngIf="statsToShow(6)">
<table mat-table [dataSource]="dsNbJumpByType" *ngIf="dsNbJumpByType != null else loadingDsNbJumpByType">
<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>
<ng-template #loadingDsNbJumpByType>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<div *ngIf="statsToShow(7)">
<table mat-table [dataSource]="dsNbJumpByYear" *ngIf="dsNbJumpByYear != null else loadingDsNbJumpByYear">
<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>
<ng-template #loadingDsNbJumpByYear>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>

4
Front/skydivelogs-app/src/assets/css/styles.css
View File

@@ -1,4 +1,4 @@
@import 'bootstrap-4.3.1.min.css'; /* @import 'bootstrap-4.3.1.min.css'; */
html, html,
body { body {
@@ -6,7 +6,7 @@ body {
} }
body { body {
/* font-family: Roboto, "Helvetica Neue", sans-serif; */ font-family: Roboto, "Helvetica Neue", sans-serif;
margin: 10px; margin: 10px;
color: #424242; color: #424242;
min-height: 665px; min-height: 665px;