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

fix/little-updates #1

Merged
sandre merged 16 commits from fix/little-updates into master 2026-01-12 14:25:51 +00:00
Conversation 0 Commits 16 Files Changed 25 +145 -92
2 changed files with 145 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 82d06117da - Show all commits

6
Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.css
View File

@@ -16,3 +16,9 @@
padding-top: 25px;
}
.chart-container {
position: relative;
margin: auto;
height: 80vh;
width: 80vw;
}

91
Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.html
View File

@@ -1,15 +1,34 @@
<div class="content">
<div>
<button mat-raised-button color="accent" [routerLink]="['/newTunnelFlight']" [routerLinkActive]="['active']"
skipLocationChange>{{ 'ListTunnelFlight_Add' | translate }}</button>
<button
mat-raised-button
color="accent"
[routerLink]="['/newTunnelFlight']"
[routerLinkActive]="['active']"
skipLocationChange
>
{{ "ListTunnelFlight_Add" | translate }}
</button>
</div>
<mat-progress-bar [mode]="'indeterminate'" *ngIf="isLoading"></mat-progress-bar>
<mat-progress-bar
[mode]="'indeterminate'"
*ngIf="isLoading"
></mat-progress-bar>
<mat-radio-group [(ngModel)]="selectedPeriod" (ngModelChange)="onPeriodChange()">
<mat-radio-button value="currentYear">{{ 'ListTunnelFlight_CurrentYear' | translate }}</mat-radio-button>
<mat-radio-button value="12Months">{{ 'ListTunnelFlight_12Months' | translate }}</mat-radio-button>
<mat-radio-button value="all">{{ 'ListTunnelFlight_AllFlights' | translate }}</mat-radio-button>
<mat-radio-group
[(ngModel)]="selectedPeriod"
(ngModelChange)="onPeriodChange()"
>
<mat-radio-button value="currentYear">{{
"ListTunnelFlight_CurrentYear" | translate
}}</mat-radio-button>
<mat-radio-button value="12Months">{{
"ListTunnelFlight_12Months" | translate
}}</mat-radio-button>
<mat-radio-button value="all">{{
"ListTunnelFlight_AllFlights" | translate
}}</mat-radio-button>
</mat-radio-group>
<mat-nav-list>
@@ -18,20 +37,28 @@
</mat-list-item>
</mat-nav-list>
<div style="display: inline-block; position: relative; width: 100%;">
<canvas baseChart
<div class="chart-container">
<canvas
baseChart
[data]="barChartData"
[options]="barChartOptions"
[plugins]="barChartPlugins"
[legend]="barChartLegend"
[type]="barChartType">
[type]="barChartType"
>
</canvas>
</div>
<div>
<button mat-raised-button color="accent" (click)="onLoadTable()" >{{ 'ListTunnelFlight_LoadTable' | translate }}</button>
<button mat-raised-button color="accent" (click)="onLoadTable()">
{{ "ListTunnelFlight_LoadTable" | translate }}
</button>
<table mat-table [dataSource]="dataSourceTable" *ngIf="dataSourceTable?.data.length">
<table
mat-table
[dataSource]="dataSourceTable"
*ngIf="dataSourceTable?.data.length"
>
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">
@@ -42,48 +69,68 @@
<ng-container matColumnDef="tunnel">
<th mat-header-cell *matHeaderCellDef>Tunnel</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.tunnel.name"></span>
<span
class="smallSpanWithBreakWord"
[innerHTML]="element.tunnel.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>
<span
class="smallSpanWithBreakWord"
[innerHTML]="element.jumpType.name"
></span>
</td>
</ng-container>
<ng-container matColumnDef="nbMinutes">
<th mat-header-cell *matHeaderCellDef>Minutes</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.nbMinutes"></span>
<span
class="smallSpanWithBreakWord"
[innerHTML]="element.nbMinutes"
></span>
</td>
</ng-container>
<ng-container matColumnDef="notes">
<th mat-header-cell *matHeaderCellDef>Notes</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.notes"></span>
<span
class="smallSpanWithBreakWord"
[innerHTML]="element.notes"
></span>
</td>
</ng-container>
<ng-container matColumnDef="flightDate">
<th mat-header-cell *matHeaderCellDef>Date</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.flightDate | date: 'yyyy-MM-dd'"></span>
<span
class="smallSpanWithBreakWord"
[innerHTML]="element.flightDate | date : 'yyyy-MM-dd'"
></span>
</td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef style="min-width: 80px;"></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>
<th mat-header-cell *matHeaderCellDef style="min-width: 80px"></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
>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</div>
</div>