diff --git a/Front/skydivelogs-app/package-lock.json b/Front/skydivelogs-app/package-lock.json index e746899..ec43f72 100644 --- a/Front/skydivelogs-app/package-lock.json +++ b/Front/skydivelogs-app/package-lock.json @@ -21,6 +21,8 @@ "@angular/router": "^16.1.1", "@ngx-translate/core": "^14.0.0", "@ngx-translate/http-loader": "^7.0.0", + "chart.js": "^4.3.0", + "ng2-charts": "^4.1.1", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.13.1" @@ -2957,6 +2959,11 @@ "integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==", "dev": true }, + "node_modules/@kurkle/color": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.2.tgz", + "integrity": "sha512-fuscdXJ9G1qb7W8VdHi+IwRqij3lBkosAm4ydQtEmbY58OzHXqQhvlxqEkoz0yssNVn38bcpRWgA9PP+OGoisw==" + }, "node_modules/@leichtgewicht/ip-codec": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz", @@ -5098,6 +5105,17 @@ "integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==", "dev": true }, + "node_modules/chart.js": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.3.0.tgz", + "integrity": "sha512-ynG0E79xGfMaV2xAHdbhwiPLczxnNNnasrmPEXriXsPJGjmhOBYzFVEsB65w2qMDz+CaBJJuJD0inE/ab/h36g==", + "dependencies": { + "@kurkle/color": "^0.3.0" + }, + "engines": { + "pnpm": ">=7" + } + }, "node_modules/chokidar": { "version": "3.5.3", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", @@ -8286,6 +8304,11 @@ "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", "dev": true }, + "node_modules/lodash-es": { + "version": "4.17.21", + "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", + "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==" + }, "node_modules/lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", @@ -8954,6 +8977,22 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "dev": true }, + "node_modules/ng2-charts": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/ng2-charts/-/ng2-charts-4.1.1.tgz", + "integrity": "sha512-iHwXDbmX86lfeH8VRcsaW2tJATsuAZo4kvvC/Yk2l35zOHjevja1qBvO6BAibiDazi9r9aS6ZRJOqWPsz1pP2w==", + "dependencies": { + "lodash-es": "^4.17.15", + "tslib": "^2.3.0" + }, + "peerDependencies": { + "@angular/cdk": ">=14.0.0", + "@angular/common": ">=14.0.0", + "@angular/core": ">=14.0.0", + "chart.js": "^3.4.0 || ^4.0.0", + "rxjs": "^6.5.3 || ^7.4.0" + } + }, "node_modules/nice-napi": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz", diff --git a/Front/skydivelogs-app/package.json b/Front/skydivelogs-app/package.json index 3b59cd9..830a80d 100644 --- a/Front/skydivelogs-app/package.json +++ b/Front/skydivelogs-app/package.json @@ -24,6 +24,8 @@ "@angular/router": "^16.1.1", "@ngx-translate/core": "^14.0.0", "@ngx-translate/http-loader": "^7.0.0", + "chart.js": "^4.3.0", + "ng2-charts": "^4.1.1", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.13.1" @@ -41,4 +43,4 @@ "karma-jasmine-html-reporter": "~2.0.0", "typescript": "~4.9.4" } -} \ No newline at end of file +} diff --git a/Front/skydivelogs-app/src/app/app.component.html b/Front/skydivelogs-app/src/app/app.component.html index cd51c2e..afd0ca6 100644 --- a/Front/skydivelogs-app/src/app/app.component.html +++ b/Front/skydivelogs-app/src/app/app.component.html @@ -31,6 +31,10 @@ {{ 'App_Nav_NewJump' | translate }}
+ + list_alt + {{ 'App_Nav_TunnelFlights' | translate }} + add_circle {{ 'App_Nav_NewTunnelFlight' | translate }} diff --git a/Front/skydivelogs-app/src/app/app.module.ts b/Front/skydivelogs-app/src/app/app.module.ts index 7464fdc..4f8e332 100644 --- a/Front/skydivelogs-app/src/app/app.module.ts +++ b/Front/skydivelogs-app/src/app/app.module.ts @@ -28,6 +28,7 @@ import { UserProfileComponent } from "./user-profile/user-profile.component"; import { ListOfImagesComponent } from "./list-of-images/list-of-images.component"; import { JumpInfosComponent } from './jump-infos/jump-infos.component'; import { NewTunnelFlightComponent } from './new-tunnel-flight/new-tunnel-flight.component'; +import { ListOfTunnelFlightsComponent } from './list-of-tunnel-flights/list-of-tunnel-flights.component'; import { DateService } from "../services/date.service"; import { AircraftService } from "../services/aircraft.service"; @@ -67,6 +68,7 @@ import { MatRadioModule } from "@angular/material/radio"; import { MatSidenavModule } from '@angular/material/sidenav'; import { MatListModule } from '@angular/material/list'; import { MatToolbarModule } from '@angular/material/toolbar'; +import { NgChartsModule } from 'ng2-charts'; import { JwtAuthInterceptor } from "../interceptor/jwt-auth.interceptor"; import { ErrorInterceptor } from "../interceptor/error.interceptor"; @@ -118,6 +120,12 @@ const appRoutes: Routes = [ component: NewTunnelFlightComponent, canActivate: [AuthGuardService] }, + { + path: "tunnelFlights", + component: ListOfTunnelFlightsComponent, + canActivate: [AuthGuardService] + }, + { path: "login", component: LoginComponent }, ]; @@ -152,7 +160,8 @@ export function initConfig(configService: ConfigurationHelper) { UserProfileComponent, ListOfImagesComponent, JumpInfosComponent, - NewTunnelFlightComponent + NewTunnelFlightComponent, + ListOfTunnelFlightsComponent ], imports: [ RouterModule.forRoot( @@ -191,7 +200,8 @@ export function initConfig(configService: ConfigurationHelper) { MatRadioModule, MatSidenavModule, MatListModule, - MatToolbarModule + MatToolbarModule, + NgChartsModule ], exports: [HttpClientModule], providers: [ diff --git a/Front/skydivelogs-app/src/app/list-of-jumps/list-of-jumps.component.html b/Front/skydivelogs-app/src/app/list-of-jumps/list-of-jumps.component.html index f73c45a..692fad2 100644 --- a/Front/skydivelogs-app/src/app/list-of-jumps/list-of-jumps.component.html +++ b/Front/skydivelogs-app/src/app/list-of-jumps/list-of-jumps.component.html @@ -1,76 +1,82 @@
-
- -
+
+ +
- + -
- - - - - +
+
- info - sticky_note_2 - celebration -
+ + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - -
+ info + sticky_note_2 + celebration + {{ 'List_Jump_Header_Num' | translate }} - {{ paginator.length - ( (paginator.pageIndex * paginator.pageSize ) + i ) }} - {{ 'List_Jump_Header_Num' | translate }} + + {{ paginator.length - ( (paginator.pageIndex * paginator.pageSize ) + i ) }} + {{ 'List_Jump_Header_Date' | translate }} - - {{ 'List_Jump_Header_Date' | translate }} + + {{ 'List_Jump_Header_JumpType' | translate }} - - {{ 'List_Jump_Header_JumpType' | + translate }} + + {{ 'List_Jump_Header_Aircraft' | translate }} - - {{ 'List_Jump_Header_Aircraft' | + translate }} + + {{ 'List_Jump_Header_Dz' | translate }} - - {{ 'List_Jump_Header_Dz' | translate }} + + {{ 'List_Jump_Header_Id' | translate }}{{element.gear.name}}{{ 'List_Jump_Header_Id' | translate }}{{element.gear.name}} - delete - edit - + delete + edit +
-
+ + + +
- - + + \ No newline at end of file diff --git a/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.css b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.css new file mode 100644 index 0000000..e69de29 diff --git a/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.html b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.html new file mode 100644 index 0000000..6f902d9 --- /dev/null +++ b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.html @@ -0,0 +1,13 @@ +
+ + +
+ + +
+
\ No newline at end of file diff --git a/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.spec.ts b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.spec.ts new file mode 100644 index 0000000..c9a2786 --- /dev/null +++ b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ListOfTunnelFlightsComponent } from './list-of-tunnel-flights.component'; + +describe('ListOfTunnelFlightsComponent', () => { + let component: ListOfTunnelFlightsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [ListOfTunnelFlightsComponent] + }); + fixture = TestBed.createComponent(ListOfTunnelFlightsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.ts b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.ts new file mode 100644 index 0000000..4fdcd20 --- /dev/null +++ b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.ts @@ -0,0 +1,93 @@ +import { Component, OnInit } from '@angular/core'; +import { TranslateService } from '@ngx-translate/core'; +import { ChartConfiguration, ChartData } from 'chart.js'; + +import { TunnelService } from '../../services/tunnel.service'; +import { ServiceComm } from '../../services/service-comm.service'; +import { TunnelFlightService } from "../../services/tunnel-flight.service"; + +@Component({ + selector: 'app-list-of-tunnel-flights', + templateUrl: './list-of-tunnel-flights.component.html', + styleUrls: ['./list-of-tunnel-flights.component.css'] +}) +export class ListOfTunnelFlightsComponent implements OnInit { + public barChartLegend = true; + public barChartPlugins = []; + public barChartData: ChartData<'bar'>; + public barChartOptions: ChartConfiguration['options']; + public barChartType: string; + public isLoading: boolean = false; + + constructor(private serviceComm: ServiceComm, + private serviceTunnel: TunnelService, + private serviceTunnelFlight: TunnelFlightService, + private translateService: TranslateService) { } + + ngOnInit() { + this.serviceComm.forceTranslateTitle.subscribe((data) => { + if (data === true) { + this.updateTitle(); + } + }); + this.updateTitle(); + + this.isLoading = true; + this.getData(); + } + + private updateTitle() { + this.translateService.get("ListTunnelFlight_Title").subscribe( + data => { this.serviceComm.UpdatedComponentTitle(data); } + ); + } + + private getData(): void { + this.barChartType = "bar"; + this.barChartData = { + labels: ['2006', '2007', '2008', '2009', '2010', '2011', '2012'], + datasets: [ + { data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A' }, + { data: [28, 48, 40, 19, 86, 27, 90], label: 'Series B' } + ] + }; + + this.barChartOptions = { + responsive: false, + plugins: { + legend: { + display: true + }, + tooltip: { + callbacks: { + footer: this.footer, + } + } + }, + interaction: { + intersect: false, + mode: 'nearest', + axis: 'x' + }, + scales: { + x: { + stacked: true + }, + y: { + stacked: true + } + } + }; + + this.isLoading = false; + } + + private footer = (tooltipItems) => { + let sum = 0; + + tooltipItems.forEach(function (tooltipItem) { + sum += tooltipItem.parsed.y; + }); + return 'Sum: ' + sum; + }; +} diff --git a/Front/skydivelogs-app/src/app/new-tunnel-flight/new-tunnel-flight.component.ts b/Front/skydivelogs-app/src/app/new-tunnel-flight/new-tunnel-flight.component.ts index ec55e1c..45eb4dc 100644 --- a/Front/skydivelogs-app/src/app/new-tunnel-flight/new-tunnel-flight.component.ts +++ b/Front/skydivelogs-app/src/app/new-tunnel-flight/new-tunnel-flight.component.ts @@ -47,10 +47,10 @@ export class NewTunnelFlightComponent implements OnInit { private pendingAddRequest: boolean; constructor(private serviceComm: ServiceComm, - private serviceTunnel: TunnelService, - private serviceTunnelFlight: TunnelFlightService, - private translateService: TranslateService, - private statsService: StatsService) { } + private serviceTunnel: TunnelService, + private serviceTunnelFlight: TunnelFlightService, + private translateService: TranslateService, + private statsService: StatsService) { } ngOnInit() { this.serviceComm.forceTranslateTitle.subscribe((data) => { diff --git a/Front/skydivelogs-app/src/assets/i18n/en.json b/Front/skydivelogs-app/src/assets/i18n/en.json index 7e888ce..1845734 100644 --- a/Front/skydivelogs-app/src/assets/i18n/en.json +++ b/Front/skydivelogs-app/src/assets/i18n/en.json @@ -37,6 +37,7 @@ "ListGears_Title" : "List of gears", "ListAircrafts_Title" : "List of aircrafts", "NewTunnelFlight_Title" : "New tunnel flights", + "ListTunnelFlight_Title" : "List of hours of tunnel", "App_Footer" : "Web software to log your skydive jumps - v", "App_Nav_Summary" : "Summary", @@ -48,6 +49,7 @@ "App_Nav_Gears" : "List of gears", "App_Nav_Logout" : "Logout", "App_Nav_NewTunnelFlight" : "Add tunnel time", + "App_Nav_TunnelFlights": "The tunnel flights", "List_Aircrafts_Add" : "Add a aircraft", "List_Aircrafts_Header_Id" : "ID", @@ -116,5 +118,8 @@ "NewTunnelFlight_ChooseTunnel": "Choose the tunnel", "NewTunnelFlight_Minutes": "Minutes of the flight", "NewTunnelFlight_Comments": "Comments", - "NewTunnelFlight_Submit": "Submit" + "NewTunnelFlight_Submit": "Submit", + "NewTunnelFlight_Comments_Lbl": "Comments", + "NewTunnelFlight_Minutes_Lbl": "Time of flight (minutes)", + "NewTunnelFlight_Date_Lbl": "Date of flight" } \ No newline at end of file diff --git a/Front/skydivelogs-app/src/assets/i18n/fr.json b/Front/skydivelogs-app/src/assets/i18n/fr.json index 6f5381b..ab5d53d 100644 --- a/Front/skydivelogs-app/src/assets/i18n/fr.json +++ b/Front/skydivelogs-app/src/assets/i18n/fr.json @@ -37,6 +37,7 @@ "ListGears_Title" : "Liste des pièges", "ListAircrafts_Title" : "Liste des avions", "NewTunnelFlight_Title" : "Nouveaux créneaux de soufflerie", + "ListTunnelFlight_Title" : "Heures de tunnel", "App_Footer" : "Application pour enregistrer ses sauts de parachutisme - v", "App_Nav_Summary" : "Récapitulatif", @@ -48,6 +49,7 @@ "App_Nav_Gears" : "Pièges", "App_Nav_Logout" : "Se déconnecter", "App_Nav_NewTunnelFlight" : "Ajouter du temps en tunnel", + "App_Nav_TunnelFlights": "Les vols en soufflerie", "List_Aircrafts_Add" : "Ajouter un avion", "List_Aircrafts_Header_Id" : "ID", @@ -116,5 +118,8 @@ "NewTunnelFlight_ChooseTunnel": "Choisir le tunnel", "NewTunnelFlight_Minutes": "Temps de vol(minutes)", "NewTunnelFlight_Comments": "Commentaires", - "NewTunnelFlight_Submit": "Ajouter" + "NewTunnelFlight_Submit": "Ajouter", + "NewTunnelFlight_Comments_Lbl": "Commentaires", + "NewTunnelFlight_Minutes_Lbl": "Temps de vol(minutes)", + "NewTunnelFlight_Date_Lbl": "Date des vols" } \ No newline at end of file