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

fix/little-updates (#1)

Browse Source 
Reviewed-on: #1
Co-authored-by: sandre <perso@sebastienandre.com>
Co-committed-by: sandre <perso@sebastienandre.com>
This commit was merged in pull request #1.
This commit is contained in:
sandre
2026-01-12 14:25:49 +00:00
committed by sandre
parent 715832d43f
commit ce9d7d89ce
25 changed files with 3745 additions and 3230 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -9,8 +9,8 @@
<div>
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="infos">
<th mat-header-cell *matHeaderCellDef style="min-width: 80px;"></th>
<td mat-cell *matCellDef="let element" style="text-align: left;">
<th mat-header-cell *matHeaderCellDef style="min-width: 80px;text-wrap: nowrap;"></th>
<td mat-cell *matCellDef="let element" style="text-align: left;text-wrap: nowrap;">
<mat-icon aria-hidden="false" aria-label="Additional informations of the jump"
style="cursor: pointer;" (click)='openDialog(element, false)'>info</mat-icon>
<mat-icon aria-hidden="false" aria-label="Special jump"
@@ -36,9 +36,9 @@
</ng-container>
<ng-container matColumnDef="jumpType">
<th mat-header-cell *matHeaderCellDef style="min-width: 100px;">{{ 'List_Jump_Header_JumpType' |
<th mat-header-cell *matHeaderCellDef style="min-width: 100px;text-wrap: nowrap;">{{ 'List_Jump_Header_JumpType' |
translate }}</th>
<td mat-cell *matCellDef="let element">
<td mat-cell *matCellDef="let element" style="text-wrap: nowrap;">
<span class="smallSpanWithBreakWord" [innerHTML]="element.jumpType.name"></span>
</td>
</ng-container>
@@ -64,8 +64,8 @@
</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;">
<th mat-header-cell *matHeaderCellDef style="min-width: 80px;text-wrap: nowrap;"></th>
<td mat-cell *matCellDef="let element" style="text-align: left;text-wrap: nowrap;">
<mat-icon aria-hidden="false" aria-label="Delete this jump" style="cursor: pointer;"
(click)='delete(element)'>delete</mat-icon>
<mat-icon aria-hidden="false" aria-label="Update some informations of the jump"

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

@@ -1,18 +1,24 @@
.formListTunnelFlight {
display: flex;
flex-direction: column;
min-width: 150px;
max-width: 500px;
width: 100%;
}
.content {
min-height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
padding-top: 25px;
}
display: flex;
flex-direction: column;
min-width: 150px;
max-width: 500px;
width: 100%;
}
.content {
min-height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
padding-top: 25px;
}
.chart-container {
position: relative;
margin: auto;
height: 80vh;
width: 80vw;
}

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

@@ -1,89 +1,136 @@
<div class="content">
<div>
<button mat-raised-button color="accent" [routerLink]="['/newTunnelFlight']" [routerLinkActive]="['active']"
skipLocationChange>{{ 'ListTunnelFlight_Add' | translate }}</button>
</div>
<div>
<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>
<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>
<mat-list-item matListItemLine *ngFor="let stat of stats">
<label>{{stat.id}} : {{stat.values}}</label>
</mat-list-item>
</mat-nav-list>
<mat-nav-list>
<mat-list-item matListItemLine *ngFor="let stat of stats">
<label>{{ stat.id }} : {{ stat.values }}</label>
</mat-list-item>
</mat-nav-list>
<div style="display: inline-block; position: relative; width: 100%;">
<canvas baseChart
[data]="barChartData"
[options]="barChartOptions"
[plugins]="barChartPlugins"
[legend]="barChartLegend"
[type]="barChartType">
</canvas>
</div>
<div class="chart-container">
<canvas
baseChart
[data]="barChartData"
[options]="barChartOptions"
[plugins]="barChartPlugins"
[legend]="barChartLegend"
[type]="barChartType"
>
</canvas>
</div>
<div>
<button mat-raised-button color="accent" (click)="onLoadTable()" >{{ 'ListTunnelFlight_LoadTable' | translate }}</button>
<div>
<button mat-raised-button color="accent" (click)="onLoadTable()">
{{ "ListTunnelFlight_LoadTable" | translate }}
</button>
<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">
<span class="smallSpanWithBreakWord" [innerHTML]="element.id"></span>
</td>
</ng-container>
<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">
<span class="smallSpanWithBreakWord" [innerHTML]="element.id"></span>
</td>
</ng-container>
<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>
</td>
</ng-container>
<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>
</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="nbMinutes">
<th mat-header-cell *matHeaderCellDef>Minutes</th>
<td mat-cell *matCellDef="let element">
<span class="smallSpanWithBreakWord" [innerHTML]="element.nbMinutes"></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>
</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>
</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>
</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>
</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>
</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>
</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
>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
</div>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</div>
</div>

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

@@ -39,4 +39,11 @@
}
.contentFlex {
flex: 45%;
}
}
.chart-container {
position: relative;
margin: auto;
height: 80vh;
width: 80vw;
}

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

@@ -1,52 +1,61 @@
<div class="content">
<div class="paragraph">
<label class="left160">{{ 'Summary_TotalJumps' | translate }}</label>
<label class="left160">{{ "Summary_TotalJumps" | translate }}</label>
<span>: {{ totalJumps }}</span>
</div>
<div class="paragraph">
<label class="left160">{{ 'Summary_TotalCutaways' | translate }}</label>
<label class="left160">{{ "Summary_TotalCutaways" | translate }}</label>
<span>: {{ totalCutaways }}</span>
</div>
<div class="paragraph">
<label class="left160">{{ 'Summary_LastJump' | translate }}</label>
<label class="left160">{{ "Summary_LastJump" | translate }}</label>
<span>: {{ lastJump }}</span>
</div>
<div class="paragraph" style="margin-top: 20px;">
<label class="left160">{{ 'Summary_Refresh' | translate }}</label>
<mat-icon aria-hidden="false" aria-label="Force the refresh of the stats" style="cursor: pointer;"
(click)='refreshStats()'>cached</mat-icon>
<div class="paragraph" style="margin-top: 20px">
<label class="left160">{{ "Summary_Refresh" | translate }}</label>
<mat-icon
aria-hidden="false"
aria-label="Force the refresh of the stats"
style="cursor: pointer"
(click)="refreshStats()"
>cached</mat-icon
>
</div>
<mat-tab-group mat-align-tabs="left" animationDuration="0ms"
(selectedIndex)="0" (selectedTabChange)="onTabChanged($event);">
<mat-tab-group
mat-align-tabs="left"
animationDuration="0ms"
(selectedIndex)="(0)"
(selectedTabChange)="onTabChanged($event)"
>
<mat-tab label="{{ 'Summary_LastMonth_Title' | translate }}">
<ng-template matTabContent>
<div class="containerFlex">
<fieldset class="contentFlex">
<legend>{{ 'Summary_LastMonth_ByDz' | translate }}</legend>
<legend>{{ "Summary_LastMonth_ByDz" | translate }}</legend>
<table mat-table [dataSource]="dsJumpForLastMonthByDz">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</fieldset>
<fieldset class="contentFlex">
<legend>{{ 'Summary_LastMonth_ByJumpType' | translate }}</legend>
<legend>{{ "Summary_LastMonth_ByJumpType" | translate }}</legend>
<table mat-table [dataSource]="dsJumpForLastMonthByJumpType">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</fieldset>
</div>
@@ -57,27 +66,27 @@
<ng-template matTabContent>
<div class="containerFlex">
<fieldset class="contentFlex">
<legend>{{ 'Summary_LastYear_ByDz' | translate }}</legend>
<legend>{{ "Summary_LastYear_ByDz" | translate }}</legend>
<table mat-table [dataSource]="dsJumpForLastYearByDz">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</fieldset>
<fieldset class="contentFlex">
<legend>{{ 'Summary_LastYear_ByJumpType' | translate }}</legend>
<legend>{{ "Summary_LastYear_ByJumpType" | translate }}</legend>
<table mat-table [dataSource]="dsJumpForLastYearByJumpType">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</fieldset>
</div>
@@ -88,12 +97,12 @@
<ng-template matTabContent>
<table mat-table [dataSource]="dsNbJumpByDz">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</ng-template>
</mat-tab>
@@ -102,12 +111,12 @@
<ng-template matTabContent>
<table mat-table [dataSource]="dsNbJumpByAircraft">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</ng-template>
</mat-tab>
@@ -116,12 +125,12 @@
<ng-template matTabContent>
<table mat-table [dataSource]="dsNbJumpByGear">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</ng-template>
</mat-tab>
@@ -130,12 +139,12 @@
<ng-template matTabContent>
<table mat-table [dataSource]="dsNbJumpByType">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</ng-template>
</mat-tab>
@@ -144,14 +153,30 @@
<ng-template matTabContent>
<table mat-table [dataSource]="dsNbJumpByYear">
<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 matColumnDef="nb">
<td mat-cell *matCellDef="let element">{{element.nb}}</td>
<td mat-cell *matCellDef="let element">{{ element.nb }}</td>
</ng-container>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
</table>
</ng-template>
</mat-tab>
<mat-tab label="{{ 'Summary_ByYearByJumpType_Title' | translate }}">
<ng-template matTabContent>
<div class="chart-container">
<canvas
baseChart
[data]="barChartData"
[options]="barChartOptions"
[plugins]="barChartPlugins"
[legend]="barChartLegend"
[type]="barChartType"
>
</canvas>
</div>
</ng-template>
</mat-tab>
</mat-tab-group>
</div>

275
Front/skydivelogs-app/src/app/summary/summary.component.ts
View File

@@ -1,21 +1,26 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatTableDataSource } from '@angular/material/table';
import { MatTabChangeEvent, MatTabGroup } from '@angular/material/tabs';
import { TranslateService } from '@ngx-translate/core';
import { DatePipe } from '@angular/common';
import { Component, OnInit, ViewChild } from "@angular/core";
import { MatTableDataSource } from "@angular/material/table";
import { MatTabChangeEvent, MatTabGroup } from "@angular/material/tabs";
import { TranslateService } from "@ngx-translate/core";
import { DatePipe } from "@angular/common";
import { ChartConfiguration, ChartData, ChartType, Colors } from "chart.js";
import { ServiceComm } from '../../services/service-comm.service';
import { StatsService } from '../../services/stats.service';
import { StatsByDzResp, StatsByAircraftResp, StatsByGearResp,
StatsByJumpTypeResp, StatsByYearResp } from '../../models/stats';
import { ServiceComm } from "../../services/service-comm.service";
import { StatsService } from "../../services/stats.service";
import {
StatsByDzResp,
StatsByAircraftResp,
StatsByGearResp,
StatsByJumpTypeResp,
StatsByYearResp,
} from "../../models/stats";
@Component({
selector: 'app-summary',
templateUrl: './summary.component.html',
styleUrls: ['./summary.component.css'],
standalone: false
selector: "app-summary",
templateUrl: "./summary.component.html",
styleUrls: ["./summary.component.css"],
standalone: false,
})
export class SummaryComponent implements OnInit {
public dsNbJumpByDz: MatTableDataSource<StatsByDzResp>;
public dsNbJumpByAircraft: MatTableDataSource<StatsByAircraftResp>;
@@ -26,43 +31,61 @@ export class SummaryComponent implements OnInit {
public dsJumpForLastYearByJumpType: MatTableDataSource<StatsByJumpTypeResp>;
public dsJumpForLastMonthByDz: MatTableDataSource<StatsByDzResp>;
public dsJumpForLastMonthByJumpType: MatTableDataSource<StatsByJumpTypeResp>;
public displayedColumns: Array<string> = ["label", "nb"];
public displayedColumnsByYearByJumpType: Array<string> = [
"label",
"label2",
"nb",
];
public displayedColumns: Array<string> = ['label', 'nb'];
public barChartLegend = true;
public barChartPlugins = [];
public barChartData: ChartData<"line">;
public barChartOptions: ChartConfiguration["options"];
public barChartType: ChartType;
private jumpTypeToColor: Map<string, string>;
public totalJumps: number;
public totalCutaways: number;
public lastJump: string;
@ViewChild(MatTabGroup) tabGroup: MatTabGroup;
constructor(private serviceApi: StatsService,
private serviceComm: ServiceComm,
private translateService: TranslateService) { }
constructor(
private serviceApi: StatsService,
private serviceComm: ServiceComm,
private translateService: TranslateService
) {}
ngOnInit() {
this.serviceComm.forceTranslateTitle.subscribe((data)=> {
if (data === true){
this.serviceComm.forceTranslateTitle.subscribe((data) => {
if (data === true) {
this.updateTitle();
}
});
this.updateTitle();
this.serviceApi.getSimpleSummary()
.subscribe(data => {
this.totalJumps = data.totalJumps;
this.totalCutaways = data.totalCutaways;
this.serviceApi.getSimpleSummary().subscribe((data) => {
this.totalJumps = data.totalJumps;
this.totalCutaways = data.totalCutaways;
const datepipe: DatePipe = new DatePipe('en-US')
let formattedDate = datepipe.transform(data.lastJump.jumpDate, 'EEEE dd MMMM YYYY')
this.lastJump = formattedDate + ' (' + data.lastJump.dropZone.name + ')';
});
const datepipe: DatePipe = new DatePipe("en-US");
let formattedDate = datepipe.transform(
data.lastJump.jumpDate,
"EEEE dd MMMM YYYY"
);
this.lastJump = formattedDate + " (" + data.lastJump.dropZone.name + ")";
});
this.serviceApi.getStatsOfLastMonth()
.subscribe(data => {
data.byDz.sort((a, b) => b.nb - a.nb );
this.dsJumpForLastMonthByDz = new MatTableDataSource(data.byDz);
data.byJumpType.sort((a, b) => b.nb - a.nb );
this.dsJumpForLastMonthByJumpType = new MatTableDataSource(data.byJumpType);
});
this.serviceApi.getStatsOfLastMonth().subscribe((data) => {
data.byDz.sort((a, b) => b.nb - a.nb);
this.dsJumpForLastMonthByDz = new MatTableDataSource(data.byDz);
data.byJumpType.sort((a, b) => b.nb - a.nb);
this.dsJumpForLastMonthByJumpType = new MatTableDataSource(
data.byJumpType
);
});
this.chartConfig();
}
public refreshStats() {
@@ -73,64 +96,160 @@ export class SummaryComponent implements OnInit {
public onTabChanged(event: MatTabChangeEvent) {
switch (event.index) {
case 0:
this.serviceApi.getStatsOfLastMonth()
.subscribe(data => {
data.byDz.sort((a, b) => b.nb - a.nb );
this.dsJumpForLastMonthByDz = new MatTableDataSource(data.byDz);
data.byJumpType.sort((a, b) => b.nb - a.nb );
this.dsJumpForLastMonthByJumpType = new MatTableDataSource(data.byJumpType);
});
this.serviceApi.getStatsOfLastMonth().subscribe((data) => {
data.byDz.sort((a, b) => b.nb - a.nb);
this.dsJumpForLastMonthByDz = new MatTableDataSource(data.byDz);
data.byJumpType.sort((a, b) => b.nb - a.nb);
this.dsJumpForLastMonthByJumpType = new MatTableDataSource(
data.byJumpType
);
});
break;
case 1:
this.serviceApi.getStatsOfLastYear()
.subscribe(data => {
data.byDz.sort((a, b) => b.nb - a.nb );
this.dsJumpForLastYearByDz = new MatTableDataSource(data.byDz);
data.byJumpType.sort((a, b) => b.nb - a.nb );
this.dsJumpForLastYearByJumpType = new MatTableDataSource(data.byJumpType);
});
this.serviceApi.getStatsOfLastYear().subscribe((data) => {
data.byDz.sort((a, b) => b.nb - a.nb);
this.dsJumpForLastYearByDz = new MatTableDataSource(data.byDz);
data.byJumpType.sort((a, b) => b.nb - a.nb);
this.dsJumpForLastYearByJumpType = new MatTableDataSource(
data.byJumpType
);
});
break;
case 2:
this.serviceApi.getStatsByDz()
.subscribe(data => {
data.sort((a, b) => b.nb - a.nb);
this.dsNbJumpByDz = new MatTableDataSource(data);
});
this.serviceApi.getStatsByDz().subscribe((data) => {
data.sort((a, b) => b.nb - a.nb);
this.dsNbJumpByDz = new MatTableDataSource(data);
});
break;
case 3:
this.serviceApi.getStatsByAircraft()
.subscribe(data => {
data.sort((a, b) => b.nb - a.nb);
this.dsNbJumpByAircraft = new MatTableDataSource(data);
});
this.serviceApi.getStatsByAircraft().subscribe((data) => {
data.sort((a, b) => b.nb - a.nb);
this.dsNbJumpByAircraft = new MatTableDataSource(data);
});
break;
case 4:
this.serviceApi.getStatsByGear()
.subscribe(data => {
data.sort((a, b) => b.nb - a.nb);
this.dsNbJumpByGear = new MatTableDataSource(data);
});
this.serviceApi.getStatsByGear().subscribe((data) => {
data.sort((a, b) => b.nb - a.nb);
this.dsNbJumpByGear = new MatTableDataSource(data);
});
break;
case 5:
this.serviceApi.getStatsByJumpType()
.subscribe(data => {
data.sort((a, b) => b.nb - a.nb);
this.dsNbJumpByType = new MatTableDataSource(data);
});
this.serviceApi.getStatsByJumpType().subscribe((data) => {
data.sort((a, b) => b.nb - a.nb);
this.dsNbJumpByType = new MatTableDataSource(data);
});
break;
case 6:
this.serviceApi.getStatsByYear()
.subscribe(data => {
data.sort((a, b) => b.label.localeCompare(a.label));
this.dsNbJumpByYear = new MatTableDataSource(data);
});
this.serviceApi.getStatsByYear().subscribe((data) => {
data.sort((a, b) => b.label.localeCompare(a.label));
this.dsNbJumpByYear = new MatTableDataSource(data);
});
break;
case 7:
this.serviceApi.getStatsByYearByJumpType().subscribe((data) => {
data.sort((a, b) => a.label.localeCompare(b.label));
let firstYear: number = Number(data[0].label);
const now = new Date();
const currentYear = now.getFullYear();
const nbYears = currentYear - firstYear;
let listOfYears = new Array(nbYears)
.fill(null)
.map(() => firstYear++);
// Prepare the list of jump type with am empty array
let tmpResults = new Map<string, number[]>();
const listOfJumpType = [...new Set(data.map((obj) => obj.label2))];
listOfJumpType.forEach((type) => {
tmpResults.set(type, new Array(nbYears).fill(NaN));
});
for (let i = 0; i < listOfYears.length; i++) {
const year = listOfYears[i].toString();
let filteredStats = data.filter((d) => d.label == year);
if (filteredStats.length > 0) {
filteredStats.forEach((fs) => {
tmpResults.get(fs.label2)[i] = fs.nb;
});
}
}
const results = [];
tmpResults.forEach((value, key) => {
const color = this.jumpTypeToColor.get(key);
let tmp = {
label: key,
data: value,
backgroundColor: color,
borderColor: color,
pointBackgroundColor: color,
fill: false,
pointRadius: 6,
};
results.push(tmp);
});
this.barChartData = {
labels: listOfYears,
datasets: results,
};
});
break;
}
}
private updateTitle() {
this.translateService.get("Summary_Title").subscribe(
data => { this.serviceComm.updatedComponentTitle(data); }
);
this.translateService.get("Summary_Title").subscribe((data) => {
this.serviceComm.updatedComponentTitle(data);
});
}
private chartConfig() {
this.barChartType = "line";
this.barChartOptions = {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
display: true,
},
colors: {
forceOverride: true,
},
},
interaction: {
intersect: false,
mode: "nearest",
axis: "x",
},
scales: {
x: {
stacked: false,
},
y: {
stacked: false,
beginAtZero: true,
},
},
};
this.jumpTypeToColor = new Map<string, string>([
["PAC", "#FFD700"],
["Solo", "#FFA500"],
["RW 3", "#40E0D0"],
["RW 4", "#008080"],
["RW 8", "#7FFFD4"],
["RW X", "#114556"],
["FreeFly", "#FFC0CB"],
["FreeStyle", "#FF91A4"],
["Track/Trace", "#87CEEB"],
["Canopy", "#228B22"],
["Landing accuracy", "#FF6347"],
["Wingsuit 1", "#E6E6FA"],
["Wingsuit 2", "#E0B0FF"],
["Wingsuit 3", "#9400D3"],
]);
}
}