Internationnalisation de la page de

récap.

Front/skydivelogs-app/src/app/summary/summary.component.css

@@ -23,10 +23,10 @@
   padding-top: 25px;
 }
 
-.left130 {
+.left160 {
   clear: both;
   float: left;
-  width: 130px;
+  width: 160px;
 }
 
 .paragraph {

Front/skydivelogs-app/src/app/summary/summary.component.html

@@ -1,32 +1,32 @@
 <div class="content">
   <div class="paragraph">
-    <label class="left130">Total jumps</label>
+    <label class="left160">{{ 'Summary_TotalJumps' | translate }}</label>
     <span>: {{ totalJumps }}</span>
   </div>
 
   <div class="paragraph">
-    <label class="left130">Total cutaways</label>
+    <label class="left160">{{ 'Summary_TotalCutaways' | translate }}</label>
     <span>: {{ totalCutaways }}</span>
   </div>
 
   <div class="paragraph">
-    <label class="left130">Last jump</label>
+    <label class="left160">{{ 'Summary_LastJump' | translate }}</label>
     <span>: {{ lastJump }}</span>
   </div>
 
   <div class="paragraph" style="margin-top: 20px;">
-    <label class="left130">Refresh</label>
+    <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 label="Jumps in the last month">
+    <mat-tab label="{{ 'Summary_LastMonth_Title' | translate }}">
       <ng-template matTabContent>
         <div class="containerFlex">
           <fieldset class="contentFlex">
-            <legend>By DZ</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>
@@ -38,7 +38,7 @@
             </table>
           </fieldset>
           <fieldset class="contentFlex">
-            <legend>By jump type</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>
@@ -53,11 +53,11 @@
       </ng-template>
     </mat-tab>
 
-    <mat-tab label="Jumps in the last year">
+    <mat-tab label="{{ 'Summary_LastYear_Title' | translate }}">
       <ng-template matTabContent>
         <div class="containerFlex">
           <fieldset class="contentFlex">
-            <legend>By DZ</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>
@@ -69,7 +69,7 @@
             </table>
           </fieldset>
           <fieldset class="contentFlex">
-            <legend>By jump type</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>
@@ -84,7 +84,7 @@
       </ng-template>
     </mat-tab>
 
-    <mat-tab label="By DZ">
+    <mat-tab label="{{ 'Summary_ByDz_Title' | translate }}">
       <ng-template matTabContent>
         <table mat-table [dataSource]="dsNbJumpByDz">
           <ng-container matColumnDef="label">
@@ -98,7 +98,7 @@
       </ng-template>
     </mat-tab>
 
-    <mat-tab label="By aircraft">
+    <mat-tab label="{{ 'Summary_ByAircraft_Title' | translate }}">
       <ng-template matTabContent>
         <table mat-table [dataSource]="dsNbJumpByAircraft">
           <ng-container matColumnDef="label">
@@ -112,7 +112,7 @@
       </ng-template>
     </mat-tab>
 
-    <mat-tab label="By gear">
+    <mat-tab label="{{ 'Summary_ByGear_Title' | translate }}">
       <ng-template matTabContent>
         <table mat-table [dataSource]="dsNbJumpByGear">
           <ng-container matColumnDef="label">
@@ -126,7 +126,7 @@
       </ng-template>
     </mat-tab>
 
-    <mat-tab label="By jump type">
+    <mat-tab label="{{ 'Summary_ByJumpType_Title' | translate }}">
       <ng-template matTabContent>
         <table mat-table [dataSource]="dsNbJumpByType">
           <ng-container matColumnDef="label">
@@ -140,7 +140,7 @@
       </ng-template>
     </mat-tab>
 
-    <mat-tab label="By year">
+    <mat-tab label="{{ 'Summary_ByYear_Title' | translate }}">
       <ng-template matTabContent>
         <table mat-table [dataSource]="dsNbJumpByYear">
           <ng-container matColumnDef="label">

Front/skydivelogs-app/src/app/summary/summary.component.ts

@@ -2,6 +2,7 @@ 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 { ServiceComm } from '../../services/service-comm.service';
 import { StatsService } from '../../services/stats.service';
@@ -48,7 +49,10 @@ export class SummaryComponent implements OnInit {
                     .subscribe(data => {
                       this.totalJumps = data.totalJumps;
                       this.totalCutaways = data.totalCutaways;
-                      this.lastJump = data.lastJump.jumpDate + ' (' + 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()

Front/skydivelogs-app/src/assets/i18n/en.json

@@ -79,5 +79,21 @@
     "List_Dz_Header_Address" : "Address",
     "List_Dz_Header_Type" : "Type",
     "List_Dz_Filter" : "Filter",
-    "List_Dz_Filter_PlaceHolder" : "Filter on the name or address of center"
+    "List_Dz_Filter_PlaceHolder" : "Filter on the name or address of center",
+
+    "Summary_TotalJumps" : "Total jumps",
+    "Summary_TotalCutaways" : "Total cutaways",
+    "Summary_LastJump" : "Last jump",
+    "Summary_Refresh" : "Refresh",
+    "Summary_LastMonth_Title" : "Jumps in the last month",
+    "Summary_LastMonth_ByDz" : "By DZ",
+    "Summary_LastMonth_ByJumpType" : "By jump type",
+    "Summary_LastYear_Title" : "Jumps in the last year",
+    "Summary_LastYear_ByDz" : "By DZ",
+    "Summary_LastYear_ByJumpType" : "By jump type",
+    "Summary_ByDz_Title" : "By DZ",
+    "Summary_ByAircraft_Title" : "By aircraft",
+    "Summary_ByGear_Title" : "By gear",
+    "Summary_ByJumpType_Title" : "By jump type",
+    "Summary_ByYear_Title" : "By year"
 }

Front/skydivelogs-app/src/assets/i18n/fr.json

@@ -79,5 +79,21 @@
     "List_Dz_Header_Address" : "Adresse",
     "List_Dz_Header_Type" : "Type",
     "List_Dz_Filter" : "Filtrer",
-    "List_Dz_Filter_PlaceHolder" : "Filtrer sur le nom ou l'adresse du centre"
+    "List_Dz_Filter_PlaceHolder" : "Filtrer sur le nom ou l'adresse du centre",
+
+    "Summary_TotalJumps" : "Nombre de sauts",
+    "Summary_TotalCutaways" : "Nombre de libération",
+    "Summary_LastJump" : "Le dernier saut",
+    "Summary_Refresh" : "Refresh",
+    "Summary_LastMonth_Title" : "Les sauts du dernier mois",
+    "Summary_LastMonth_ByDz" : "Par centre",
+    "Summary_LastMonth_ByJumpType" : "Par type de saut",
+    "Summary_LastYear_Title" : "Les sauts de la dernière année",
+    "Summary_LastYear_ByDz" : "Par centre",
+    "Summary_LastYear_ByJumpType" : "Par type de saut",
+    "Summary_ByDz_Title" : "Par centre",
+    "Summary_ByAircraft_Title" : "Par avion",
+    "Summary_ByGear_Title" : "Par piège",
+    "Summary_ByJumpType_Title" : "Par type de saut",
+    "Summary_ByYear_Title" : "Par an"
 }