From 0029c7fd2904778ceeed4fee753526f5f13e2156 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Thu, 14 Feb 2019 15:22:43 +0100
Subject: [PATCH 01/13] =?UTF-8?q?Fix=20#119=20les=20graphiques=20et=20tabl?=
=?UTF-8?q?eaux=20de=20r=C3=A9sultats=20vari=C3=A9s=20peuvent=20=C3=AAtre?=
=?UTF-8?q?=20affich=C3=A9s=20en=20plein=20=C3=A9cran?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app/app.component.ts | 13 +++++-
.../var-results.component.html | 38 ++++++++++++-----
.../var-results.component.scss | 24 ++++++++++-
.../fixedvar-results/var-results.component.ts | 17 ++++++++
.../remous-results.component.html | 30 +++++++++-----
.../remous-results.component.scss | 25 +++++++++++
.../remous-results.component.ts | 40 +++++++++---------
.../results-graph.component.html | 22 ++++++++--
.../results-graph.component.scss | 26 ++++++++++++
.../results-graph/results-graph.component.ts | 22 +++++++++-
.../section-results.component.html | 38 +++++++++++------
.../section-results.component.scss | 26 ++++++++++++
.../section-results.component.ts | 41 ++++++++++---------
src/assets/icons/file-excel-box.svg | 1 +
src/assets/icons/file-excel.svg | 1 +
15 files changed, 283 insertions(+), 81 deletions(-)
create mode 100644 src/app/components/remous-results/remous-results.component.scss
create mode 100644 src/app/components/results-graph/results-graph.component.scss
create mode 100644 src/app/components/section-results/section-results.component.scss
create mode 100644 src/assets/icons/file-excel-box.svg
create mode 100644 src/assets/icons/file-excel.svg
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 542a55cdb..3ab0def90 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,5 +1,7 @@
import { Component, ApplicationRef, OnInit, OnDestroy, HostListener, ViewChild, ComponentRef } from "@angular/core";
import { Router, Event, NavigationEnd, ActivationEnd } from "@angular/router";
+import { MatSidenav, MatToolbar, MatDialog, MatIconRegistry } from "@angular/material";
+import { DomSanitizer } from "@angular/platform-browser";
import { Observer, jalhydDateRev, CalculatorType } from "jalhyd";
@@ -14,7 +16,6 @@ import { HttpService } from "./services/http/http.service";
import { ApplicationSetupService } from "./services/app-setup/app-setup.service";
import { nghydDateRev } from "../date_revision";
-import { MatSidenav, MatToolbar, MatDialog } from "@angular/material";
import { DialogConfirmEmptySessionComponent } from "./components/dialog-confirm-empty-session/dialog-confirm-empty-session.component";
import { DialogLoadSessionComponent } from "./components/dialog-load-session/dialog-load-session.component";
import { DialogSaveSessionComponent } from "./components/dialog-save-session/dialog-save-session.component";
@@ -69,7 +70,9 @@ export class AppComponent implements OnInit, OnDestroy, Observer {
private httpService: HttpService,
private confirmEmptySessionDialog: MatDialog,
private saveSessionDialog: MatDialog,
- private loadSessionDialog: MatDialog
+ private loadSessionDialog: MatDialog,
+ private matIconRegistry: MatIconRegistry,
+ private domSanitizer: DomSanitizer
) {
ServiceFactory.instance.httpService = httpService;
ServiceFactory.instance.applicationSetupService = appSetupService;
@@ -93,6 +96,12 @@ export class AppComponent implements OnInit, OnDestroy, Observer {
}
}
});
+
+ // icônes personnalisées
+ this.matIconRegistry.addSvgIcon(
+ "file_excel",
+ this.domSanitizer.bypassSecurityTrustResourceUrl("../../assets/icons/file-excel.svg")
+ );
}
ngOnInit() {
diff --git a/src/app/components/fixedvar-results/var-results.component.html b/src/app/components/fixedvar-results/var-results.component.html
index f89799dfd..a7978e934 100644
--- a/src/app/components/fixedvar-results/var-results.component.html
+++ b/src/app/components/fixedvar-results/var-results.component.html
@@ -1,15 +1,31 @@
-<div class="var-results-container">
- <!-- scrollable -->
- <div class="var-results-inner-container">
+<div class="var-results-container" #variableResults fxLayout="row wrap" fxLayoutAlign="center center">
+ <div fxFlex="1 1 100%">
+ <div class="var-results-buttons">
+ <button mat-icon-button (click)="setFullscreen(variableResults)">
+ <mat-icon color="primary" svgIcon="file_excel"></mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(variableResults)">
+ <mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="isFullscreen" (click)="exitFullscreen()">
+ <mat-icon color="primary" class="scaled12">fullscreen_exit</mat-icon>
+ </button>
+ </div>
- <table mat-table [dataSource]="dataSet">
- <ng-container *ngFor="let h of headers; let i = index" [matColumnDef]="h">
- <th mat-header-cell *matHeaderCellDef>{{ h }}</th>
- <td mat-cell *matCellDef="let element">{{ element[i] }}</td>
- </ng-container>
+ <div class="var-results-scrollable-container">
+ <!-- scrollable -->
+ <div class="var-results-inner-container">
- <tr mat-header-row *matHeaderRowDef="headers"></tr>
- <tr mat-row *matRowDef="let row; columns: headers;"></tr>
- </table>
+ <table mat-table [dataSource]="dataSet">
+ <ng-container *ngFor="let h of headers; let i = index" [matColumnDef]="h">
+ <th mat-header-cell *matHeaderCellDef>{{ h }}</th>
+ <td mat-cell *matCellDef="let element">{{ element[i] }}</td>
+ </ng-container>
+
+ <tr mat-header-row *matHeaderRowDef="headers"></tr>
+ <tr mat-row *matRowDef="let row; columns: headers;"></tr>
+ </table>
+ </div>
+ </div>
</div>
</div>
diff --git a/src/app/components/fixedvar-results/var-results.component.scss b/src/app/components/fixedvar-results/var-results.component.scss
index d8b8f970e..9e8da72dd 100644
--- a/src/app/components/fixedvar-results/var-results.component.scss
+++ b/src/app/components/fixedvar-results/var-results.component.scss
@@ -3,8 +3,30 @@
}
.var-results-container {
- overflow-x: scroll;
margin-top: 2em;
+ background-color: white;
+}
+
+.var-results-buttons {
+ padding-right: 4px;
+ padding-top: 4px;
+ text-align: right;
+ background-color: white;
+
+ button {
+ margin-left: 3px;
+ width: auto;
+
+ mat-icon {
+ &.scaled12 {
+ transform: scale(1.2)
+ }
+ }
+ }
+}
+
+.var-results-scrollable-container {
+ overflow-x: scroll;
border: solid #ccc 1px;
}
diff --git a/src/app/components/fixedvar-results/var-results.component.ts b/src/app/components/fixedvar-results/var-results.component.ts
index 7b8ca69eb..1e47b9898 100644
--- a/src/app/components/fixedvar-results/var-results.component.ts
+++ b/src/app/components/fixedvar-results/var-results.component.ts
@@ -24,6 +24,11 @@ export class VarResultsComponent {
/** entêtes des colonnes (param à varier, à calculer + extraResults) */
private _headers: string[];
+ /** tracks the fullscreen state */
+ public get isFullscreen() {
+ return (document["fullscreenElement"] !== null);
+ }
+
@ViewChild(MatTable) table: MatTable<any>;
constructor(
@@ -94,4 +99,16 @@ export class VarResultsComponent {
}
return data;
}
+
+ public setFullscreen(element) {
+ element.requestFullscreen();
+ }
+
+ public exitFullscreen() {
+ document.exitFullscreen();
+ }
+
+ public exportAsImage() {
+ console.log(">> EXPORT AS IMAGE !");
+ }
}
diff --git a/src/app/components/remous-results/remous-results.component.html b/src/app/components/remous-results/remous-results.component.html
index 24c15f01e..3d83d7680 100644
--- a/src/app/components/remous-results/remous-results.component.html
+++ b/src/app/components/remous-results/remous-results.component.html
@@ -1,16 +1,26 @@
-<div class="container" *ngIf="hasResults">
- <div>
+<div class="remous-results-container" #remousResults *ngIf="hasResults" fxLayout="row wrap" fxLayoutAlign="center center">
+ <div fxFlex="1 1 100%">
+ <div class="remous-results-buttons">
+ <button mat-icon-button (click)="exportAsImage()">
+ <mat-icon color="primary" class="scaled09">image</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(remousResults)">
+ <mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="isFullscreen" (click)="exitFullscreen()">
+ <mat-icon color="primary" class="scaled12">fullscreen_exit</mat-icon>
+ </button>
+ </div>
+
<chart [type]="graph1_type" [data]="graph1_data" [options]="graph1_options"></chart>
- </div>
- <div>
<chart *ngIf="extraGraph" [type]="graph2_type" [data]="graph2_data" [options]="graph2_options"></chart>
</div>
+</div>
- <!-- journal -->
- <log></log>
+<!-- journal -->
+<log></log>
- <div *ngIf="hasData">
- <!-- résultats numériques -->
- <var-results></var-results>
- </div>
+<div *ngIf="hasData">
+ <!-- résultats numériques -->
+ <var-results></var-results>
</div>
diff --git a/src/app/components/remous-results/remous-results.component.scss b/src/app/components/remous-results/remous-results.component.scss
new file mode 100644
index 000000000..c1effd28e
--- /dev/null
+++ b/src/app/components/remous-results/remous-results.component.scss
@@ -0,0 +1,25 @@
+.remous-results-container{
+ display: block;
+ background-color: white;
+}
+
+.remous-results-buttons {
+ padding-right: 10px;
+ padding-top: 4px;
+ text-align: right;
+ background-color: white;
+
+ button {
+ margin-left: 3px;
+ width: auto;
+
+ mat-icon {
+ &.scaled12 {
+ transform: scale(1.2);
+ }
+ &.scaled09 {
+ transform: scale(0.9);
+ }
+ }
+ }
+}
diff --git a/src/app/components/remous-results/remous-results.component.ts b/src/app/components/remous-results/remous-results.component.ts
index a64d46ce4..c4d5159cd 100644
--- a/src/app/components/remous-results/remous-results.component.ts
+++ b/src/app/components/remous-results/remous-results.component.ts
@@ -193,25 +193,8 @@ class GraphData {
@Component({
selector: "remous-results",
templateUrl: "./remous-results.component.html",
- styles: [`
- .result_label {
- text-align: right;
- padding-top:10px;
- padding-bottom:10px;
- padding-right:10px;
- }
- .result_value {
- text-align: center;
- padding-left:30px;
- padding-right:30px;
- }
- .result_id_0 {
- background-color: #f0f0f0;
- }
- .result_id_2 {
- font-weight: bold;
- }
- `
+ styleUrls: [
+ "./remous-results.component.scss"
]
})
export class RemousResultsComponent implements DoCheck {
@@ -253,6 +236,11 @@ export class RemousResultsComponent implements DoCheck {
@ViewChild(LogComponent)
private logComponent: LogComponent;
+ /** tracks the fullscreen state */
+ public get isFullscreen() {
+ return (document["fullscreenElement"] !== null);
+ }
+
constructor(
private intlService: I18nService,
private appSetup: ApplicationSetupService
@@ -629,7 +617,19 @@ export class RemousResultsComponent implements DoCheck {
return this._remousResults !== undefined && this._remousResults.hasResults;
}
- private get hasData(): boolean {
+ public get hasData(): boolean {
return this._remousResults && this._remousResults.result && this._remousResults.result.ok;
}
+
+ public setFullscreen(element) {
+ element.requestFullscreen();
+ }
+
+ public exitFullscreen() {
+ document.exitFullscreen();
+ }
+
+ public exportAsImage() {
+ console.log(">> EXPORT AS IMAGE !");
+ }
}
diff --git a/src/app/components/results-graph/results-graph.component.html b/src/app/components/results-graph/results-graph.component.html
index 9f0dc91e2..d3df25d79 100644
--- a/src/app/components/results-graph/results-graph.component.html
+++ b/src/app/components/results-graph/results-graph.component.html
@@ -1,4 +1,20 @@
-<chart [type]="graph_type" [data]="graph_data" [options]="graph_options">
-</chart>
+<div class="graph-results-container" #graphResults fxLayout="row wrap" fxLayoutAlign="center center">
+ <div fxFlex="1 1 100%">
+ <div class="graph-results-buttons">
+ <button mat-icon-button (click)="exportAsImage()">
+ <mat-icon color="primary" class="scaled09">image</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(graphResults)">
+ <mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="isFullscreen" (click)="exitFullscreen()">
+ <mat-icon color="primary" class="scaled12">fullscreen_exit</mat-icon>
+ </button>
+ </div>
-<graph-type></graph-type>
+ <chart [type]="graph_type" [data]="graph_data" [options]="graph_options">
+ </chart>
+
+ <graph-type></graph-type>
+ </div>
+</div>
diff --git a/src/app/components/results-graph/results-graph.component.scss b/src/app/components/results-graph/results-graph.component.scss
new file mode 100644
index 000000000..7ff45199c
--- /dev/null
+++ b/src/app/components/results-graph/results-graph.component.scss
@@ -0,0 +1,26 @@
+.graph-results-container{
+ display: block;
+ background-color: white;
+}
+
+.graph-results-buttons {
+ padding-right: 10px;
+ padding-top: 4px;
+ margin-bottom: -30px;
+ text-align: right;
+ background-color: white;
+
+ button {
+ margin-left: 3px;
+ width: auto;
+
+ mat-icon {
+ &.scaled12 {
+ transform: scale(1.2);
+ }
+ &.scaled09 {
+ transform: scale(0.9);
+ }
+ }
+ }
+}
diff --git a/src/app/components/results-graph/results-graph.component.ts b/src/app/components/results-graph/results-graph.component.ts
index 35dbf11cd..17d42459b 100644
--- a/src/app/components/results-graph/results-graph.component.ts
+++ b/src/app/components/results-graph/results-graph.component.ts
@@ -8,7 +8,10 @@ import { ApplicationSetupService } from "../../services/app-setup/app-setup.serv
@Component({
selector: "results-graph",
- templateUrl: "./results-graph.component.html"
+ templateUrl: "./results-graph.component.html",
+ styleUrls: [
+ "./results-graph.component.scss"
+ ]
})
export class ResultsGraphComponent implements AfterContentInit, Observer {
private _results: VarResults;
@@ -36,6 +39,11 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
}
};
+ /** tracks the fullscreen state */
+ public get isFullscreen() {
+ return (document["fullscreenElement"] !== null);
+ }
+
public constructor(
private appSetup: ApplicationSetupService
) {
@@ -196,6 +204,18 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
};
}
+ public setFullscreen(element) {
+ element.requestFullscreen();
+ }
+
+ public exitFullscreen() {
+ document.exitFullscreen();
+ }
+
+ public exportAsImage() {
+ console.log(">> EXPORT AS IMAGE !");
+ }
+
// interface Observer
update(sender: any, data: any) {
diff --git a/src/app/components/section-results/section-results.component.html b/src/app/components/section-results/section-results.component.html
index e9a103d4e..caabdb1dc 100644
--- a/src/app/components/section-results/section-results.component.html
+++ b/src/app/components/section-results/section-results.component.html
@@ -1,18 +1,30 @@
-<div class="container-fluid" *ngIf="hasResults">
- <!-- graphique -->
- <div class="row">
- <div class="col" style="text-align: center">
- <section-canvas></section-canvas>
+<div class="section-results-container" #sectionResults *ngIf="hasResults" fxLayout="row wrap" fxLayoutAlign="center center">
+ <div fxFlex="1 1 100%">
+ <div class="section-results-buttons">
+ <button mat-icon-button (click)="exportAsImage()">
+ <mat-icon color="primary" class="scaled09">image</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(sectionResults)">
+ <mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="isFullscreen" (click)="exitFullscreen()">
+ <mat-icon color="primary" class="scaled12">fullscreen_exit</mat-icon>
+ </button>
</div>
- </div>
- <!-- tableau de valeurs -->
- <div class="row">
- <div class="col mx-auto">
- <table style="width: 100%" cellpadding="15">
- <tr vertical-result-element [result-element]=resultElement>
- </tr>
- </table>
+ <!-- graphique -->
+ <div class="row">
+ <div class="col" style="text-align: center">
+ <section-canvas></section-canvas>
+ </div>
</div>
</div>
</div>
+
+<!-- tableau de valeurs -->
+<div class="col mx-auto">
+ <table style="width: 100%" cellpadding="15">
+ <tr vertical-result-element [result-element]=resultElement>
+ </tr>
+ </table>
+</div>
diff --git a/src/app/components/section-results/section-results.component.scss b/src/app/components/section-results/section-results.component.scss
new file mode 100644
index 000000000..c32756ece
--- /dev/null
+++ b/src/app/components/section-results/section-results.component.scss
@@ -0,0 +1,26 @@
+.section-results-container{
+ display: block;
+ background-color: white;
+}
+
+.section-results-buttons {
+ padding-right: 10px;
+ padding-top: 4px;
+ margin-bottom: -30px;
+ text-align: right;
+ background-color: white;
+
+ button {
+ margin-left: 3px;
+ width: auto;
+
+ mat-icon {
+ &.scaled12 {
+ transform: scale(1.2);
+ }
+ &.scaled09 {
+ transform: scale(0.9);
+ }
+ }
+ }
+}
diff --git a/src/app/components/section-results/section-results.component.ts b/src/app/components/section-results/section-results.component.ts
index 83ad69517..deb532b12 100644
--- a/src/app/components/section-results/section-results.component.ts
+++ b/src/app/components/section-results/section-results.component.ts
@@ -11,25 +11,9 @@ import { I18nService } from "../../services/internationalisation/internationalis
@Component({
selector: "section-results",
templateUrl: "./section-results.component.html",
- styles: [`
- .result_label {
- text-align: right;
- padding-top:10px;
- padding-bottom:10px;
- padding-right:10px;
- }
- .result_value {
- text-align: center;
- padding-left:30px;
- padding-right:30px;
- }
- .result_id_0 {
- background-color: #f0f0f0;
- }
- .result_id_2 {
- font-weight: bold;
- }
- `]
+ styleUrls: [
+ "./section-results.component.scss"
+ ]
})
export class SectionResultsComponent implements DoCheck {
@@ -54,7 +38,7 @@ export class SectionResultsComponent implements DoCheck {
return this._results && this._results.hasResults;
}
- private get resultElement() {
+ public get resultElement() {
return this._resultElement;
}
@@ -82,6 +66,11 @@ export class SectionResultsComponent implements DoCheck {
@ViewChild(SectionCanvasComponent)
private _sectionCanvas: SectionCanvasComponent;
+ /** tracks the fullscreen state */
+ public get isFullscreen() {
+ return (document["fullscreenElement"] !== null);
+ }
+
public updateView() {
if (this._sectionCanvas) {
this._sectionCanvas.reset();
@@ -137,4 +126,16 @@ export class SectionResultsComponent implements DoCheck {
// tslint:disable-next-line:no-bitwise
return "result_id_" + String(i & 1);
}
+
+ public setFullscreen(element) {
+ element.requestFullscreen();
+ }
+
+ public exitFullscreen() {
+ document.exitFullscreen();
+ }
+
+ public exportAsImage() {
+ console.log(">> EXPORT AS IMAGE !");
+ }
}
diff --git a/src/assets/icons/file-excel-box.svg b/src/assets/icons/file-excel-box.svg
new file mode 100644
index 000000000..f0be5069b
--- /dev/null
+++ b/src/assets/icons/file-excel-box.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path d="M16.2,17H14.2L12,13.2L9.8,17H7.8L11,12L7.8,7H9.8L12,10.8L14.2,7H16.2L13,12M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/file-excel.svg b/src/assets/icons/file-excel.svg
new file mode 100644
index 000000000..77acecd83
--- /dev/null
+++ b/src/assets/icons/file-excel.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path d="M6,2H14L20,8V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V4A2,2 0 0,1 6,2M13,3.5V9H18.5L13,3.5M17,11H13V13H14L12,14.67L10,13H11V11H7V13H8L11,15.5L8,18H7V20H11V18H10L12,16.33L14,18H13V20H17V18H16L13,15.5L16,13H17V11Z" /></svg>
\ No newline at end of file
--
GitLab
From 9832c7a6fec124cf6cb88476e72003b04b1dbca6 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Thu, 14 Feb 2019 16:21:29 +0100
Subject: [PATCH 02/13] =?UTF-8?q?Fix=20#53=20export=20Excel=20des=20r?=
=?UTF-8?q?=C3=A9sultats=20fixes=20et=20variables=20avec=20XLSX?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
package-lock.json | 169 +++++++++++++++---
package.json | 3 +-
.../fixed-results.component.html | 33 ++--
.../fixed-results.component.scss | 23 ++-
.../fixed-results.component.ts | 17 +-
.../var-results.component.html | 6 +-
.../var-results.component.scss | 3 +
.../fixedvar-results/var-results.component.ts | 16 +-
.../remous-results.component.html | 2 +-
.../remous-results.component.scss | 3 -
.../results-graph.component.html | 2 +-
.../results-graph.component.scss | 3 -
.../section-results.component.html | 2 +-
.../section-results.component.scss | 3 -
14 files changed, 223 insertions(+), 62 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index 9f12af07c..5a2713b26 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "nghyd",
- "version": "1.1.0",
+ "version": "1.2.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@@ -1634,6 +1634,15 @@
"acorn": "^5.0.0"
}
},
+ "adler-32": {
+ "version": "1.2.0",
+ "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.2.0.tgz",
+ "integrity": "sha1-aj5r8KY5ALoVZSgIyxXGgT0aXyU=",
+ "requires": {
+ "exit-on-epipe": "~1.0.1",
+ "printj": "~1.1.0"
+ }
+ },
"adm-zip": {
"version": "0.4.13",
"resolved": "https://registry.npmjs.org/adm-zip/-/adm-zip-0.4.13.tgz",
@@ -1693,6 +1702,7 @@
"resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
"integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
"dev": true,
+ "optional": true,
"requires": {
"kind-of": "^3.0.2",
"longest": "^1.0.1",
@@ -1704,6 +1714,7 @@
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
"dev": true,
+ "optional": true,
"requires": {
"is-buffer": "^1.1.5"
}
@@ -1840,6 +1851,7 @@
"resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz",
"integrity": "sha512-5hYdAkZlcG8tOLujVDTgCT+uPX0VnpAH28gWsLfzpXYm7wP6mp5Q/gYyR7YQ0cKVJcXJnl3j2kpBan13PtQf6w==",
"dev": true,
+ "optional": true,
"requires": {
"delegates": "^1.0.0",
"readable-stream": "^2.0.6"
@@ -2757,6 +2769,17 @@
"lazy-cache": "^1.0.3"
}
},
+ "cfb": {
+ "version": "1.1.0",
+ "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.1.0.tgz",
+ "integrity": "sha512-ZqfxNGWTMKhd0a/n6YKJLq8hWbd5kR3cA4kXwUj9vVEdHlwJ09werR8gN15Z7Y1FTXqdD6dE3GGCxv4uc28raA==",
+ "requires": {
+ "adler-32": "~1.2.0",
+ "commander": "^2.16.0",
+ "crc-32": "~1.2.0",
+ "printj": "~1.1.2"
+ }
+ },
"chalk": {
"version": "2.4.2",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
@@ -3035,6 +3058,22 @@
}
}
},
+ "codepage": {
+ "version": "1.14.0",
+ "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.14.0.tgz",
+ "integrity": "sha1-jL4lSBMjVZ19MHVxsP/5HnodL5k=",
+ "requires": {
+ "commander": "~2.14.1",
+ "exit-on-epipe": "~1.0.1"
+ },
+ "dependencies": {
+ "commander": {
+ "version": "2.14.1",
+ "resolved": "https://registry.npmjs.org/commander/-/commander-2.14.1.tgz",
+ "integrity": "sha512-+YR16o3rK53SmWHU3rEM3tPAh2rwb1yPcQX5irVn7mb0gXbwuCCrnkbV5+PBfETdfg1vui07nM6PCG1zndcjQw=="
+ }
+ }
+ },
"collection-visit": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz",
@@ -3088,8 +3127,7 @@
"commander": {
"version": "2.17.1",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.17.1.tgz",
- "integrity": "sha512-wPMUt6FnH2yzG95SA6mzjQOEKUU3aLaDEmzs1ti+1E9h+CsrZghRlqEM/EJ4KscsQVG8uNN4uVreUeT8+drlgg==",
- "dev": true
+ "integrity": "sha512-wPMUt6FnH2yzG95SA6mzjQOEKUU3aLaDEmzs1ti+1E9h+CsrZghRlqEM/EJ4KscsQVG8uNN4uVreUeT8+drlgg=="
},
"commondir": {
"version": "1.0.1",
@@ -3217,7 +3255,8 @@
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
"integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
- "dev": true
+ "dev": true,
+ "optional": true
},
"constants-browserify": {
"version": "1.0.0",
@@ -3339,6 +3378,15 @@
}
}
},
+ "crc-32": {
+ "version": "1.2.0",
+ "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.0.tgz",
+ "integrity": "sha512-1uBwHxF+Y/4yF5G48fwnKq6QsIXheor3ZLPT80yGBV1oEUwpPojlEhQbWKVw1VwcTQyMGHK1/XMmTjmlsmTTGA==",
+ "requires": {
+ "exit-on-epipe": "~1.0.1",
+ "printj": "~1.1.0"
+ }
+ },
"create-ecdh": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.3.tgz",
@@ -3653,7 +3701,8 @@
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
"integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o=",
- "dev": true
+ "dev": true,
+ "optional": true
},
"depd": {
"version": "1.1.2",
@@ -4215,6 +4264,11 @@
"integrity": "sha1-BjJjj42HfMghB9MKD/8aF8uhzQw=",
"dev": true
},
+ "exit-on-epipe": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/exit-on-epipe/-/exit-on-epipe-1.0.1.tgz",
+ "integrity": "sha512-h2z5mrROTxce56S+pnvAV890uu7ls7f1kEvVGJbw1OlFH3/mlJ5bkXu0KRyW94v37zzHPiUd55iLn3DA7TjWpw=="
+ },
"expand-braces": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
@@ -4760,6 +4814,11 @@
"integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ=",
"dev": true
},
+ "frac": {
+ "version": "1.1.2",
+ "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz",
+ "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA=="
+ },
"fragment-cache": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
@@ -4858,7 +4917,8 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"aproba": {
"version": "1.2.0",
@@ -4879,12 +4939,14 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
@@ -4899,17 +4961,20 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"core-util-is": {
"version": "1.0.2",
@@ -5026,7 +5091,8 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"ini": {
"version": "1.3.5",
@@ -5038,6 +5104,7 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@@ -5052,6 +5119,7 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
@@ -5059,12 +5127,14 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"minipass": {
"version": "2.3.5",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
@@ -5083,6 +5153,7 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"minimist": "0.0.8"
}
@@ -5163,7 +5234,8 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"object-assign": {
"version": "4.1.1",
@@ -5175,6 +5247,7 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"wrappy": "1"
}
@@ -5260,7 +5333,8 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"safer-buffer": {
"version": "2.1.2",
@@ -5296,6 +5370,7 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@@ -5315,6 +5390,7 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
+ "optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@@ -5358,12 +5434,14 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
},
"yallist": {
"version": "3.0.3",
"bundled": true,
- "dev": true
+ "dev": true,
+ "optional": true
}
}
},
@@ -5372,6 +5450,7 @@
"resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
"integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE=",
"dev": true,
+ "optional": true,
"requires": {
"graceful-fs": "^4.1.2",
"inherits": "~2.0.0",
@@ -5384,6 +5463,7 @@
"resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
"integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
"dev": true,
+ "optional": true,
"requires": {
"aproba": "^1.0.3",
"console-control-strings": "^1.0.0",
@@ -5421,7 +5501,8 @@
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
"integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
- "dev": true
+ "dev": true,
+ "optional": true
},
"get-stream": {
"version": "3.0.0",
@@ -5666,7 +5747,8 @@
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
"integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk=",
- "dev": true
+ "dev": true,
+ "optional": true
},
"has-value": {
"version": "1.0.0",
@@ -6513,7 +6595,8 @@
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
"integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
- "dev": true
+ "dev": true,
+ "optional": true
},
"is-windows": {
"version": "1.0.2",
@@ -7681,6 +7764,7 @@
"resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
"integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
"dev": true,
+ "optional": true,
"requires": {
"graceful-fs": "^4.1.2",
"parse-json": "^2.2.0",
@@ -7693,7 +7777,8 @@
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
- "dev": true
+ "dev": true,
+ "optional": true
}
}
},
@@ -7802,7 +7887,8 @@
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz",
"integrity": "sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc=",
- "dev": true
+ "dev": true,
+ "optional": true
},
"loose-envify": {
"version": "1.4.0",
@@ -7986,7 +8072,8 @@
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
"integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
- "dev": true
+ "dev": true,
+ "optional": true
},
"map-stream": {
"version": "0.1.0",
@@ -8704,6 +8791,7 @@
"resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
"integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
"dev": true,
+ "optional": true,
"requires": {
"are-we-there-yet": "~1.1.2",
"console-control-strings": "~1.1.0",
@@ -9600,6 +9688,11 @@
"integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=",
"dev": true
},
+ "printj": {
+ "version": "1.1.2",
+ "resolved": "https://registry.npmjs.org/printj/-/printj-1.1.2.tgz",
+ "integrity": "sha512-zA2SmoLaxZyArQTOPj5LXecR+RagfPSU5Kw1qP+jkWeNlrq+eJZyY2oS68SU1Z/7/myXM4lo9716laOFAVStCQ=="
+ },
"prismjs": {
"version": "1.15.0",
"resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.15.0.tgz",
@@ -9975,6 +10068,7 @@
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
"integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
"dev": true,
+ "optional": true,
"requires": {
"load-json-file": "^1.0.0",
"normalize-package-data": "^2.3.2",
@@ -9986,6 +10080,7 @@
"resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
"integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
"dev": true,
+ "optional": true,
"requires": {
"graceful-fs": "^4.1.2",
"pify": "^2.0.0",
@@ -9996,7 +10091,8 @@
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
- "dev": true
+ "dev": true,
+ "optional": true
}
}
},
@@ -10005,6 +10101,7 @@
"resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
"integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
"dev": true,
+ "optional": true,
"requires": {
"find-up": "^1.0.0",
"read-pkg": "^1.0.0"
@@ -10015,6 +10112,7 @@
"resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
"integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
"dev": true,
+ "optional": true,
"requires": {
"path-exists": "^2.0.0",
"pinkie-promise": "^2.0.0"
@@ -10025,6 +10123,7 @@
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
"integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
"dev": true,
+ "optional": true,
"requires": {
"pinkie-promise": "^2.0.0"
}
@@ -11177,6 +11276,14 @@
"integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
"dev": true
},
+ "ssf": {
+ "version": "0.10.2",
+ "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.10.2.tgz",
+ "integrity": "sha512-rDhAPm9WyIsY8eZEKyE8Qsotb3j/wBdvMWBUsOhJdfhKGLfQidRjiBUV0y/MkyCLiXQ38FG6LWW/VYUtqlIDZQ==",
+ "requires": {
+ "frac": "~1.1.2"
+ }
+ },
"sshpk": {
"version": "1.16.1",
"resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.16.1.tgz",
@@ -11360,6 +11467,7 @@
"resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
"integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
"dev": true,
+ "optional": true,
"requires": {
"is-utf8": "^0.2.0"
}
@@ -12801,6 +12909,7 @@
"resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz",
"integrity": "sha512-QGkOQc8XL6Bt5PwnsExKBPuMKBxnGxWWW3fU55Xt4feHozMUhdUMaBCk290qpm/wG5u/RSKzwdAC4i51YigihA==",
"dev": true,
+ "optional": true,
"requires": {
"string-width": "^1.0.2 || 2"
}
@@ -12863,6 +12972,20 @@
"ultron": "~1.1.0"
}
},
+ "xlsx": {
+ "version": "0.14.1",
+ "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.14.1.tgz",
+ "integrity": "sha512-7hjB5YuyJo1fuuzXQjwuxD8LSUzE4Rxu5ToC3fB5JSunZxGjLcgKg69bEFG9GYoxeVDx5GL0k1dUodlvaQNRQw==",
+ "requires": {
+ "adler-32": "~1.2.0",
+ "cfb": "^1.1.0",
+ "codepage": "~1.14.0",
+ "commander": "~2.17.1",
+ "crc-32": "~1.2.0",
+ "exit-on-epipe": "~1.0.1",
+ "ssf": "~0.10.2"
+ }
+ },
"xml2js": {
"version": "0.4.19",
"resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.4.19.tgz",
diff --git a/package.json b/package.json
index 77d7b5888..f4f5b3b6b 100644
--- a/package.json
+++ b/package.json
@@ -45,6 +45,7 @@
"rxjs": "^6.3.3",
"rxjs-compat": "^6.3.3",
"tslib": "^1.9.0",
+ "xlsx": "^0.14.1",
"zone.js": "^0.8.28"
},
"devDependencies": {
@@ -52,7 +53,7 @@
"@angular/cli": "^7.2.2",
"@angular/compiler-cli": "^7.2.1",
"@angular/language-service": "^7.2.1",
- "@compodoc/compodoc": "^1.1.7",
+ "@compodoc/compodoc": "^1.1.8",
"@types/file-saver": "^2.0.0",
"@types/jasmine": "^3.3.7",
"@types/jasminewd2": "^2.0.6",
diff --git a/src/app/components/fixedvar-results/fixed-results.component.html b/src/app/components/fixedvar-results/fixed-results.component.html
index b35f932d4..1c2c8f0b4 100644
--- a/src/app/components/fixedvar-results/fixed-results.component.html
+++ b/src/app/components/fixedvar-results/fixed-results.component.html
@@ -1,17 +1,26 @@
<div class="fixed-results-container" *ngIf="hasFixedParameters">
+
+ <div class="fixed-results-buttons">
+ <button mat-icon-button (click)="exportAsSpreadsheet()">
+ <mat-icon color="primary" svgIcon="file_excel" class="scaled09"></mat-icon>
+ </button>
+ </div>
+
<!-- table des résultats fixés -->
- <table mat-table [dataSource]="dataSet">
+ <div class="fixed-results-inner-container" #tableContainer>
+ <table mat-table [dataSource]="dataSet">
- <ng-container matColumnDef="parametre">
- <th mat-header-cell *matHeaderCellDef>{{ uitextParamFixes }}</th>
- <td mat-cell *matCellDef="let element" [ngClass]="{'highlightedResult': element.isCalcResult}">{{ element.label }}</td>
- </ng-container>
- <ng-container matColumnDef="valeur">
- <th mat-header-cell *matHeaderCellDef>{{ uitextValeurs }}</th>
- <td mat-cell *matCellDef="let element" [ngClass]="{'highlightedResult': element.isCalcResult}">{{ element.value }}</td>
- </ng-container>
+ <ng-container matColumnDef="parametre">
+ <th mat-header-cell *matHeaderCellDef>{{ uitextParamFixes }}</th>
+ <td mat-cell *matCellDef="let element" [ngClass]="{'highlightedResult': element.isCalcResult}">{{ element.label }}</td>
+ </ng-container>
+ <ng-container matColumnDef="valeur">
+ <th mat-header-cell *matHeaderCellDef>{{ uitextValeurs }}</th>
+ <td mat-cell *matCellDef="let element" [ngClass]="{'highlightedResult': element.isCalcResult}">{{ element.value }}</td>
+ </ng-container>
- <tr mat-header-row *matHeaderRowDef="tableColumns"></tr>
- <tr mat-row *matRowDef="let row; columns: tableColumns;"></tr>
- </table>
+ <tr mat-header-row *matHeaderRowDef="tableColumns"></tr>
+ <tr mat-row *matRowDef="let row; columns: tableColumns;"></tr>
+ </table>
+ </div>
</div>
diff --git a/src/app/components/fixedvar-results/fixed-results.component.scss b/src/app/components/fixedvar-results/fixed-results.component.scss
index 6884f3f37..7285b9c23 100644
--- a/src/app/components/fixedvar-results/fixed-results.component.scss
+++ b/src/app/components/fixedvar-results/fixed-results.component.scss
@@ -3,11 +3,32 @@
}
.fixed-results-container {
- margin-top: 1em;
+ // margin-top: 1em;
+}
+
+.fixed-results-inner-container {
border: solid #ccc 1px;
border-radius: 2px;
}
+.fixed-results-buttons {
+ padding-right: 4px;
+ padding-top: 4px;
+ text-align: right;
+ background-color: white;
+
+ button {
+ margin-left: 3px;
+ width: auto;
+
+ mat-icon {
+ &.scaled09 {
+ transform: scale(0.9);
+ }
+ }
+ }
+}
+
table.mat-table {
.mat-header-row {
diff --git a/src/app/components/fixedvar-results/fixed-results.component.ts b/src/app/components/fixedvar-results/fixed-results.component.ts
index 4e97712b9..a5ec36ac6 100644
--- a/src/app/components/fixedvar-results/fixed-results.component.ts
+++ b/src/app/components/fixedvar-results/fixed-results.component.ts
@@ -1,11 +1,11 @@
-import { Component, ViewChild } from "@angular/core";
+import { Component, ViewChild, ElementRef } from "@angular/core";
import { FixedResults } from "../../results/fixed-results";
import { NgParameter } from "../../formulaire/ngparam";
import { CalculatorResults } from "../../results/calculator-results";
import { I18nService } from "../../services/internationalisation/internationalisation.service";
import { ApplicationSetupService } from "../../services/app-setup/app-setup.service";
-import { MatTable } from "@angular/material";
+import * as XLSX from "xlsx";
@Component({
selector: "fixed-results",
@@ -18,13 +18,13 @@ export class FixedResultsComponent {
/** résultats non mis en forme */
private _fixedResults: FixedResults;
- @ViewChild(MatTable) table: MatTable<any>;
+ @ViewChild("tableContainer") table: ElementRef;
public tableColumns = [ "parametre", "valeur" ];
constructor(
private intlService: I18nService,
- private appSetupService: ApplicationSetupService,
+ private appSetupService: ApplicationSetupService
) { }
public set results(r: FixedResults) {
@@ -102,4 +102,13 @@ export class FixedResultsComponent {
}
return data;
}
+
+ public exportAsSpreadsheet() {
+ // automagic <table> extraction
+ const ws: XLSX.WorkSheet = XLSX.utils.table_to_sheet(this.table.nativeElement);
+ const wb: XLSX.WorkBook = XLSX.utils.book_new();
+ XLSX.utils.book_append_sheet(wb, ws, "default");
+ // save and download
+ XLSX.writeFile(wb, "FixedResults.xlsx");
+ }
}
diff --git a/src/app/components/fixedvar-results/var-results.component.html b/src/app/components/fixedvar-results/var-results.component.html
index a7978e934..086a68e38 100644
--- a/src/app/components/fixedvar-results/var-results.component.html
+++ b/src/app/components/fixedvar-results/var-results.component.html
@@ -1,8 +1,8 @@
<div class="var-results-container" #variableResults fxLayout="row wrap" fxLayoutAlign="center center">
<div fxFlex="1 1 100%">
<div class="var-results-buttons">
- <button mat-icon-button (click)="setFullscreen(variableResults)">
- <mat-icon color="primary" svgIcon="file_excel"></mat-icon>
+ <button mat-icon-button (click)="exportAsSpreadsheet()">
+ <mat-icon color="primary" svgIcon="file_excel" class="scaled09"></mat-icon>
</button>
<button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(variableResults)">
<mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
@@ -14,7 +14,7 @@
<div class="var-results-scrollable-container">
<!-- scrollable -->
- <div class="var-results-inner-container">
+ <div class="var-results-inner-container" #tableContainer>
<table mat-table [dataSource]="dataSet">
<ng-container *ngFor="let h of headers; let i = index" [matColumnDef]="h">
diff --git a/src/app/components/fixedvar-results/var-results.component.scss b/src/app/components/fixedvar-results/var-results.component.scss
index 9e8da72dd..1f2d10e09 100644
--- a/src/app/components/fixedvar-results/var-results.component.scss
+++ b/src/app/components/fixedvar-results/var-results.component.scss
@@ -21,6 +21,9 @@
&.scaled12 {
transform: scale(1.2)
}
+ &.scaled09 {
+ transform: scale(0.9);
+ }
}
}
}
diff --git a/src/app/components/fixedvar-results/var-results.component.ts b/src/app/components/fixedvar-results/var-results.component.ts
index 1e47b9898..37657da07 100644
--- a/src/app/components/fixedvar-results/var-results.component.ts
+++ b/src/app/components/fixedvar-results/var-results.component.ts
@@ -1,10 +1,9 @@
-import { Component, ViewChild } from "@angular/core";
-import { MatTable } from "@angular/material";
+import { Component, ViewChild, ElementRef } from "@angular/core";
import { VarResults } from "../../results/var-results";
import { ApplicationSetupService } from "../../services/app-setup/app-setup.service";
import { ResultElement } from "jalhyd";
import { I18nService } from "../../services/internationalisation/internationalisation.service";
-import { nbind } from 'q';
+import * as XLSX from "xlsx";
@Component({
selector: "var-results",
@@ -29,7 +28,7 @@ export class VarResultsComponent {
return (document["fullscreenElement"] !== null);
}
- @ViewChild(MatTable) table: MatTable<any>;
+ @ViewChild("tableContainer") table: ElementRef;
constructor(
private appSetupService: ApplicationSetupService,
@@ -108,7 +107,12 @@ export class VarResultsComponent {
document.exitFullscreen();
}
- public exportAsImage() {
- console.log(">> EXPORT AS IMAGE !");
+ public exportAsSpreadsheet() {
+ // automagic <table> extraction
+ const ws: XLSX.WorkSheet = XLSX.utils.table_to_sheet(this.table.nativeElement);
+ const wb: XLSX.WorkBook = XLSX.utils.book_new();
+ XLSX.utils.book_append_sheet(wb, ws, "default");
+ // save and download
+ XLSX.writeFile(wb, "VariableResults.xlsx");
}
}
diff --git a/src/app/components/remous-results/remous-results.component.html b/src/app/components/remous-results/remous-results.component.html
index 3d83d7680..d53f1576e 100644
--- a/src/app/components/remous-results/remous-results.component.html
+++ b/src/app/components/remous-results/remous-results.component.html
@@ -2,7 +2,7 @@
<div fxFlex="1 1 100%">
<div class="remous-results-buttons">
<button mat-icon-button (click)="exportAsImage()">
- <mat-icon color="primary" class="scaled09">image</mat-icon>
+ <mat-icon color="primary">image</mat-icon>
</button>
<button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(remousResults)">
<mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
diff --git a/src/app/components/remous-results/remous-results.component.scss b/src/app/components/remous-results/remous-results.component.scss
index c1effd28e..b4b6a4f9f 100644
--- a/src/app/components/remous-results/remous-results.component.scss
+++ b/src/app/components/remous-results/remous-results.component.scss
@@ -17,9 +17,6 @@
&.scaled12 {
transform: scale(1.2);
}
- &.scaled09 {
- transform: scale(0.9);
- }
}
}
}
diff --git a/src/app/components/results-graph/results-graph.component.html b/src/app/components/results-graph/results-graph.component.html
index d3df25d79..5487f9a32 100644
--- a/src/app/components/results-graph/results-graph.component.html
+++ b/src/app/components/results-graph/results-graph.component.html
@@ -2,7 +2,7 @@
<div fxFlex="1 1 100%">
<div class="graph-results-buttons">
<button mat-icon-button (click)="exportAsImage()">
- <mat-icon color="primary" class="scaled09">image</mat-icon>
+ <mat-icon color="primary">image</mat-icon>
</button>
<button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(graphResults)">
<mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
diff --git a/src/app/components/results-graph/results-graph.component.scss b/src/app/components/results-graph/results-graph.component.scss
index 7ff45199c..7a13a42ec 100644
--- a/src/app/components/results-graph/results-graph.component.scss
+++ b/src/app/components/results-graph/results-graph.component.scss
@@ -18,9 +18,6 @@
&.scaled12 {
transform: scale(1.2);
}
- &.scaled09 {
- transform: scale(0.9);
- }
}
}
}
diff --git a/src/app/components/section-results/section-results.component.html b/src/app/components/section-results/section-results.component.html
index caabdb1dc..3f58c670f 100644
--- a/src/app/components/section-results/section-results.component.html
+++ b/src/app/components/section-results/section-results.component.html
@@ -2,7 +2,7 @@
<div fxFlex="1 1 100%">
<div class="section-results-buttons">
<button mat-icon-button (click)="exportAsImage()">
- <mat-icon color="primary" class="scaled09">image</mat-icon>
+ <mat-icon color="primary">image</mat-icon>
</button>
<button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(sectionResults)">
<mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
diff --git a/src/app/components/section-results/section-results.component.scss b/src/app/components/section-results/section-results.component.scss
index c32756ece..4b8f1982b 100644
--- a/src/app/components/section-results/section-results.component.scss
+++ b/src/app/components/section-results/section-results.component.scss
@@ -18,9 +18,6 @@
&.scaled12 {
transform: scale(1.2);
}
- &.scaled09 {
- transform: scale(0.9);
- }
}
}
}
--
GitLab
From d3d4c51cf44899f4669f9a1eeef77cea3cee3e27 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Thu, 14 Feb 2019 17:02:40 +0100
Subject: [PATCH 03/13] =?UTF-8?q?M=C3=A0J=20#119=20graphique=20en=20plein?=
=?UTF-8?q?=20=C3=A9cran=20sans=20le=20s=C3=A9lecteur=20de=20type?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app/components/results-graph/results-graph.component.html | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/app/components/results-graph/results-graph.component.html b/src/app/components/results-graph/results-graph.component.html
index 5487f9a32..ac1335866 100644
--- a/src/app/components/results-graph/results-graph.component.html
+++ b/src/app/components/results-graph/results-graph.component.html
@@ -14,7 +14,7 @@
<chart [type]="graph_type" [data]="graph_data" [options]="graph_options">
</chart>
-
- <graph-type></graph-type>
</div>
</div>
+
+<graph-type></graph-type>
--
GitLab
From 9937ef8a673a86232dab4e32f8fde172c4b68282 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Thu, 14 Feb 2019 17:42:27 +0100
Subject: [PATCH 04/13] =?UTF-8?q?R=C3=A9sultats=20variables:=20scroll=20ve?=
=?UTF-8?q?rtical=20en=20plein=20=C3=A9cran?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../fixedvar-results/fixed-results.component.scss | 11 ++++++-----
.../fixedvar-results/var-results.component.html | 2 +-
.../fixedvar-results/var-results.component.scss | 4 ++++
3 files changed, 11 insertions(+), 6 deletions(-)
diff --git a/src/app/components/fixedvar-results/fixed-results.component.scss b/src/app/components/fixedvar-results/fixed-results.component.scss
index 7285b9c23..5a8e48d7a 100644
--- a/src/app/components/fixedvar-results/fixed-results.component.scss
+++ b/src/app/components/fixedvar-results/fixed-results.component.scss
@@ -2,10 +2,6 @@
display: block;
}
-.fixed-results-container {
- // margin-top: 1em;
-}
-
.fixed-results-inner-container {
border: solid #ccc 1px;
border-radius: 2px;
@@ -36,7 +32,7 @@ table.mat-table {
}
.mat-row {
- height: 32px;
+ height: auto;
&:nth-child(odd) {
background-color: #f4f4f4;
@@ -47,6 +43,11 @@ table.mat-table {
font-size: 1em;
color: black;
}
+
+ ::ng-deep .mat-cell {
+ padding-top: 8px;
+ padding-bottom: 8px;
+ }
}
.highlightedResult {
diff --git a/src/app/components/fixedvar-results/var-results.component.html b/src/app/components/fixedvar-results/var-results.component.html
index 086a68e38..d56635342 100644
--- a/src/app/components/fixedvar-results/var-results.component.html
+++ b/src/app/components/fixedvar-results/var-results.component.html
@@ -12,7 +12,7 @@
</button>
</div>
- <div class="var-results-scrollable-container">
+ <div class="var-results-scrollable-container" [ngClass]="{'full-height': isFullscreen}">
<!-- scrollable -->
<div class="var-results-inner-container" #tableContainer>
diff --git a/src/app/components/fixedvar-results/var-results.component.scss b/src/app/components/fixedvar-results/var-results.component.scss
index 1f2d10e09..aa3f8ec31 100644
--- a/src/app/components/fixedvar-results/var-results.component.scss
+++ b/src/app/components/fixedvar-results/var-results.component.scss
@@ -31,6 +31,10 @@
.var-results-scrollable-container {
overflow-x: scroll;
border: solid #ccc 1px;
+
+ &.full-height {
+ height: calc(100vh - 40px); // rend le mode plein-écran scrollable verticalement, sinon ça dépasse
+ }
}
table.mat-table {
--
GitLab
From 3c58d99cb089ff1040b139b38778a075210a8d72 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Thu, 14 Feb 2019 18:01:41 +0100
Subject: [PATCH 05/13] =?UTF-8?q?Export=20PNG=20(transparent)=20du=20graph?=
=?UTF-8?q?ique=20de=20r=C3=A9sultats=20variables=20#55?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../results-graph/results-graph.component.html | 2 +-
.../results-graph/results-graph.component.ts | 11 ++++++++---
2 files changed, 9 insertions(+), 4 deletions(-)
diff --git a/src/app/components/results-graph/results-graph.component.html b/src/app/components/results-graph/results-graph.component.html
index ac1335866..c9c9eaa21 100644
--- a/src/app/components/results-graph/results-graph.component.html
+++ b/src/app/components/results-graph/results-graph.component.html
@@ -12,7 +12,7 @@
</button>
</div>
- <chart [type]="graph_type" [data]="graph_data" [options]="graph_options">
+ <chart [type]="graph_type" [data]="graph_data" [options]="graph_options" #graphChart>
</chart>
</div>
</div>
diff --git a/src/app/components/results-graph/results-graph.component.ts b/src/app/components/results-graph/results-graph.component.ts
index 17d42459b..4937f1071 100644
--- a/src/app/components/results-graph/results-graph.component.ts
+++ b/src/app/components/results-graph/results-graph.component.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, AfterContentInit } from "@angular/core";
+import { Component, ViewChild, AfterContentInit, ElementRef } from "@angular/core";
import { Observer } from "jalhyd";
@@ -45,7 +45,8 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
}
public constructor(
- private appSetup: ApplicationSetupService
+ private appSetup: ApplicationSetupService,
+ private currentElement: ElementRef
) {
// limit display precision according to app preferences
const nDigits = this.appSetup.displayDigits;
@@ -213,7 +214,11 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
}
public exportAsImage() {
- console.log(">> EXPORT AS IMAGE !");
+ console.log(">> EXPORT AS IMAGE !", this.currentElement.constructor.name, this.currentElement);
+ const canvas: HTMLCanvasElement = this.currentElement.nativeElement.querySelector("canvas");
+ canvas.toBlob((blob) => {
+ saveAs(blob, "chart.png");
+ }); // defaults to image/png
}
// interface Observer
--
GitLab
From 5de2edaf810281d543396e210b7b75515548d28d Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Fri, 15 Feb 2019 09:25:32 +0100
Subject: [PATCH 06/13] =?UTF-8?q?Correction=20bug=20:=20traduction=20du=20?=
=?UTF-8?q?type=20de=20module=20dans=20le=20s=C3=A9lecteur=20dropdown?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app/app.component.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/app/app.component.html b/src/app/app.component.html
index fbcfa67db..134007e73 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -22,7 +22,7 @@
<span class="calc-name">
{{ currentCalc.title }}
</span>
- <span class="calc-type" [innerHTML]="'( ' + currentCalc ? currentCalc.type : '' + ' )'"></span>
+ <span class="calc-type" [innerHTML]="'(' + getCalculatorLabel(currentCalc.type) + ')'"></span>
</button>
<mat-menu #menu="matMenu" colo="accent">
--
GitLab
From d7c6714d11c54a27e2fc783d8fdd1fb9b402d708 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Fri, 15 Feb 2019 09:30:06 +0100
Subject: [PATCH 07/13] =?UTF-8?q?Export=20en=20PNG=20des=20graphiques=20de?=
=?UTF-8?q?=20courbes=20de=20remous=20et=20sections=20param=C3=A9tr=C3=A9e?=
=?UTF-8?q?s?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../fixedvar-results/var-results.component.html | 2 +-
.../remous-results/remous-results.component.ts | 10 +++++++---
.../results-graph/results-graph.component.ts | 1 -
.../section-results/section-results.component.ts | 12 +++++++++---
4 files changed, 17 insertions(+), 8 deletions(-)
diff --git a/src/app/components/fixedvar-results/var-results.component.html b/src/app/components/fixedvar-results/var-results.component.html
index d56635342..30d0afac8 100644
--- a/src/app/components/fixedvar-results/var-results.component.html
+++ b/src/app/components/fixedvar-results/var-results.component.html
@@ -1,4 +1,4 @@
-<div class="var-results-container" #variableResults fxLayout="row wrap" fxLayoutAlign="center center">
+<div class="var-results-container" #variableResults *ngIf="hasResults" fxLayout="row wrap" fxLayoutAlign="center center">
<div fxFlex="1 1 100%">
<div class="var-results-buttons">
<button mat-icon-button (click)="exportAsSpreadsheet()">
diff --git a/src/app/components/remous-results/remous-results.component.ts b/src/app/components/remous-results/remous-results.component.ts
index c4d5159cd..0f04afd20 100644
--- a/src/app/components/remous-results/remous-results.component.ts
+++ b/src/app/components/remous-results/remous-results.component.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, DoCheck } from "@angular/core";
+import { Component, ViewChild, DoCheck, ElementRef } from "@angular/core";
import { ArrayReverseIterator, ResultElement, INumberIterator } from "jalhyd";
@@ -243,7 +243,8 @@ export class RemousResultsComponent implements DoCheck {
constructor(
private intlService: I18nService,
- private appSetup: ApplicationSetupService
+ private appSetup: ApplicationSetupService,
+ private currentElement: ElementRef
) { }
private get uitextLigneFluviale() {
@@ -630,6 +631,9 @@ export class RemousResultsComponent implements DoCheck {
}
public exportAsImage() {
- console.log(">> EXPORT AS IMAGE !");
+ const canvas: HTMLCanvasElement = this.currentElement.nativeElement.querySelector("canvas");
+ canvas.toBlob((blob) => {
+ saveAs(blob, "chart.png");
+ }); // defaults to image/png
}
}
diff --git a/src/app/components/results-graph/results-graph.component.ts b/src/app/components/results-graph/results-graph.component.ts
index 4937f1071..2f1f19fec 100644
--- a/src/app/components/results-graph/results-graph.component.ts
+++ b/src/app/components/results-graph/results-graph.component.ts
@@ -214,7 +214,6 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
}
public exportAsImage() {
- console.log(">> EXPORT AS IMAGE !", this.currentElement.constructor.name, this.currentElement);
const canvas: HTMLCanvasElement = this.currentElement.nativeElement.querySelector("canvas");
canvas.toBlob((blob) => {
saveAs(blob, "chart.png");
diff --git a/src/app/components/section-results/section-results.component.ts b/src/app/components/section-results/section-results.component.ts
index deb532b12..79e3c5cc7 100644
--- a/src/app/components/section-results/section-results.component.ts
+++ b/src/app/components/section-results/section-results.component.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, DoCheck } from "@angular/core";
+import { Component, ViewChild, DoCheck, ElementRef } from "@angular/core";
import { ResultElement } from "jalhyd";
@@ -17,7 +17,10 @@ import { I18nService } from "../../services/internationalisation/internationalis
})
export class SectionResultsComponent implements DoCheck {
- constructor(private appSetupService: ApplicationSetupService, private intlService: I18nService) { }
+ constructor(
+ private appSetupService: ApplicationSetupService,
+ private currentElement: ElementRef
+ ) { }
public set results(rs: CalculatorResults[]) {
this._resultElement = undefined;
@@ -136,6 +139,9 @@ export class SectionResultsComponent implements DoCheck {
}
public exportAsImage() {
- console.log(">> EXPORT AS IMAGE !");
+ const canvas: HTMLCanvasElement = this.currentElement.nativeElement.querySelector("canvas");
+ canvas.toBlob((blob) => {
+ saveAs(blob, "chart.png");
+ }); // defaults to image/png
}
}
--
GitLab
From 7e55a5778198d025e712b17f7c77fe5ea5726266 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Fri, 15 Feb 2019 10:11:45 +0100
Subject: [PATCH 08/13] Courbe de remous
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
export et plein écran pour le graphique secondaire
légendes sous les graphiques et non à droite
label des abscisses à la place du titre du graphe mal utilisé
---
src/app/components/log/log.component.scss | 2 +-
.../remous-results.component.html | 22 ++++-
.../remous-results.component.scss | 5 ++
.../remous-results.component.ts | 80 +++++++++++--------
.../results-graph.component.html | 2 +-
.../results-graph/results-graph.component.ts | 9 +--
.../section-results.component.html | 2 +-
.../section-results.component.ts | 10 +--
8 files changed, 83 insertions(+), 49 deletions(-)
diff --git a/src/app/components/log/log.component.scss b/src/app/components/log/log.component.scss
index 7dee1f923..4c37d752b 100644
--- a/src/app/components/log/log.component.scss
+++ b/src/app/components/log/log.component.scss
@@ -3,7 +3,7 @@
}
.hyd_log {
- margin-top: 1em;
+ margin-top: 2.5em;
border: solid #ccc 1px;
border-radius: 2px;
padding: 1em;
diff --git a/src/app/components/remous-results/remous-results.component.html b/src/app/components/remous-results/remous-results.component.html
index d53f1576e..690b85563 100644
--- a/src/app/components/remous-results/remous-results.component.html
+++ b/src/app/components/remous-results/remous-results.component.html
@@ -1,7 +1,7 @@
<div class="remous-results-container" #remousResults *ngIf="hasResults" fxLayout="row wrap" fxLayoutAlign="center center">
<div fxFlex="1 1 100%">
<div class="remous-results-buttons">
- <button mat-icon-button (click)="exportAsImage()">
+ <button mat-icon-button (click)="exportAsImage(remousResults)">
<mat-icon color="primary">image</mat-icon>
</button>
<button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(remousResults)">
@@ -13,10 +13,28 @@
</div>
<chart [type]="graph1_type" [data]="graph1_data" [options]="graph1_options"></chart>
- <chart *ngIf="extraGraph" [type]="graph2_type" [data]="graph2_data" [options]="graph2_options"></chart>
</div>
</div>
+<div class="remous-results-extragraph-container" #remousResultsExtra *ngIf="extraGraph" fxLayout="row wrap" fxLayoutAlign="center center">
+ <div fxFlex="1 1 100%">
+ <div class="remous-results-buttons">
+ <button mat-icon-button (click)="exportAsImage(remousResultsExtra)">
+ <mat-icon color="primary">image</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(remousResultsExtra)">
+ <mat-icon color="primary" class="scaled12">fullscreen</mat-icon>
+ </button>
+ <button mat-icon-button *ngIf="isFullscreen" (click)="exitFullscreen()">
+ <mat-icon color="primary" class="scaled12">fullscreen_exit</mat-icon>
+ </button>
+ </div>
+
+ <chart [type]="graph2_type" [data]="graph2_data" [options]="graph2_options"></chart>
+ </div>
+</div>
+
+
<!-- journal -->
<log></log>
diff --git a/src/app/components/remous-results/remous-results.component.scss b/src/app/components/remous-results/remous-results.component.scss
index b4b6a4f9f..4161aad0a 100644
--- a/src/app/components/remous-results/remous-results.component.scss
+++ b/src/app/components/remous-results/remous-results.component.scss
@@ -3,6 +3,11 @@
background-color: white;
}
+.remous-results-extragraph-container{
+ display: block;
+ background-color: white;
+}
+
.remous-results-buttons {
padding-right: 10px;
padding-top: 4px;
diff --git a/src/app/components/remous-results/remous-results.component.ts b/src/app/components/remous-results/remous-results.component.ts
index 0f04afd20..3ec1202e7 100644
--- a/src/app/components/remous-results/remous-results.component.ts
+++ b/src/app/components/remous-results/remous-results.component.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, DoCheck, ElementRef } from "@angular/core";
+import { Component, ViewChild, DoCheck } from "@angular/core";
import { ArrayReverseIterator, ResultElement, INumberIterator } from "jalhyd";
@@ -243,8 +243,7 @@ export class RemousResultsComponent implements DoCheck {
constructor(
private intlService: I18nService,
- private appSetup: ApplicationSetupService,
- private currentElement: ElementRef
+ private appSetup: ApplicationSetupService
) { }
private get uitextLigneFluviale() {
@@ -279,7 +278,7 @@ export class RemousResultsComponent implements DoCheck {
return this.intlService.localizeText("INFO_REMOUSRESULTS_TIRANTCRITIQUE");
}
- private get extraGraph(): boolean {
+ public get extraGraph(): boolean {
return this._remousResults === undefined ? false : this._remousResults.extraGraph;
}
@@ -288,6 +287,23 @@ export class RemousResultsComponent implements DoCheck {
this.intlService.getExtraResLabel(this._remousResults.extraParamSymbol);
}
+ private headers(): string[] {
+ return this._tableHeaders;
+ }
+
+ private getResultClass(i: number) {
+ // tslint:disable-next-line:no-bitwise
+ return "result_id_" + String(i & 1);
+ }
+
+ public get hasResults(): boolean {
+ return this._remousResults !== undefined && this._remousResults.hasResults;
+ }
+
+ public get hasData(): boolean {
+ return this._remousResults && this._remousResults.result && this._remousResults.result.ok;
+ }
+
public set results(rs: CalculatorResults[]) {
this._remousResults = undefined;
if (rs !== undefined) {
@@ -554,11 +570,6 @@ export class RemousResultsComponent implements DoCheck {
},
legend: {
display: true,
- position: "right"
- },
- title: {
- display: true,
- text: this.uitextAbscisse,
position: "bottom"
},
scales: {
@@ -571,6 +582,10 @@ export class RemousResultsComponent implements DoCheck {
callback: function(value, index, values) {
return Number(value).toFixed(nDigits);
}
+ },
+ scaleLabel: {
+ display: true,
+ labelString: this.uitextAbscisse
}
}]
},
@@ -594,34 +609,33 @@ export class RemousResultsComponent implements DoCheck {
},
legend: {
display: true,
- position: "right"
- },
- title: {
- display: true,
- text: this.uitextAbscisse,
position: "bottom"
+ },
+ scales: {
+ xAxes: [{
+ scaleLabel: {
+ display: true,
+ labelString: this.uitextAbscisse
+ },
+ ticks: {
+ precision: nDigits,
+ callback: function(value, index, values) {
+ return Number(value).toFixed(nDigits);
+ }
+ },
+ }]
+ },
+ tooltips: {
+ callbacks: {
+ label: function(tooltipItem, data) {
+ return Number(tooltipItem.yLabel).toFixed(nDigits);
+ }
+ }
}
};
}
}
- private headers(): string[] {
- return this._tableHeaders;
- }
-
- private getResultClass(i: number) {
- // tslint:disable-next-line:no-bitwise
- return "result_id_" + String(i & 1);
- }
-
- public get hasResults(): boolean {
- return this._remousResults !== undefined && this._remousResults.hasResults;
- }
-
- public get hasData(): boolean {
- return this._remousResults && this._remousResults.result && this._remousResults.result.ok;
- }
-
public setFullscreen(element) {
element.requestFullscreen();
}
@@ -630,8 +644,8 @@ export class RemousResultsComponent implements DoCheck {
document.exitFullscreen();
}
- public exportAsImage() {
- const canvas: HTMLCanvasElement = this.currentElement.nativeElement.querySelector("canvas");
+ public exportAsImage(element: HTMLDivElement) {
+ const canvas: HTMLCanvasElement = element.querySelector("canvas");
canvas.toBlob((blob) => {
saveAs(blob, "chart.png");
}); // defaults to image/png
diff --git a/src/app/components/results-graph/results-graph.component.html b/src/app/components/results-graph/results-graph.component.html
index c9c9eaa21..61ff43cc4 100644
--- a/src/app/components/results-graph/results-graph.component.html
+++ b/src/app/components/results-graph/results-graph.component.html
@@ -1,7 +1,7 @@
<div class="graph-results-container" #graphResults fxLayout="row wrap" fxLayoutAlign="center center">
<div fxFlex="1 1 100%">
<div class="graph-results-buttons">
- <button mat-icon-button (click)="exportAsImage()">
+ <button mat-icon-button (click)="exportAsImage(graphResults)">
<mat-icon color="primary">image</mat-icon>
</button>
<button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(graphResults)">
diff --git a/src/app/components/results-graph/results-graph.component.ts b/src/app/components/results-graph/results-graph.component.ts
index 2f1f19fec..0e0fbc265 100644
--- a/src/app/components/results-graph/results-graph.component.ts
+++ b/src/app/components/results-graph/results-graph.component.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, AfterContentInit, ElementRef } from "@angular/core";
+import { Component, ViewChild, AfterContentInit } from "@angular/core";
import { Observer } from "jalhyd";
@@ -45,8 +45,7 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
}
public constructor(
- private appSetup: ApplicationSetupService,
- private currentElement: ElementRef
+ private appSetup: ApplicationSetupService
) {
// limit display precision according to app preferences
const nDigits = this.appSetup.displayDigits;
@@ -213,8 +212,8 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
document.exitFullscreen();
}
- public exportAsImage() {
- const canvas: HTMLCanvasElement = this.currentElement.nativeElement.querySelector("canvas");
+ public exportAsImage(element: HTMLDivElement) {
+ const canvas: HTMLCanvasElement = element.querySelector("canvas");
canvas.toBlob((blob) => {
saveAs(blob, "chart.png");
}); // defaults to image/png
diff --git a/src/app/components/section-results/section-results.component.html b/src/app/components/section-results/section-results.component.html
index 3f58c670f..0e0bdc211 100644
--- a/src/app/components/section-results/section-results.component.html
+++ b/src/app/components/section-results/section-results.component.html
@@ -1,7 +1,7 @@
<div class="section-results-container" #sectionResults *ngIf="hasResults" fxLayout="row wrap" fxLayoutAlign="center center">
<div fxFlex="1 1 100%">
<div class="section-results-buttons">
- <button mat-icon-button (click)="exportAsImage()">
+ <button mat-icon-button (click)="exportAsImage(sectionResults)">
<mat-icon color="primary">image</mat-icon>
</button>
<button mat-icon-button *ngIf="! isFullscreen" (click)="setFullscreen(sectionResults)">
diff --git a/src/app/components/section-results/section-results.component.ts b/src/app/components/section-results/section-results.component.ts
index 79e3c5cc7..47859d7db 100644
--- a/src/app/components/section-results/section-results.component.ts
+++ b/src/app/components/section-results/section-results.component.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, DoCheck, ElementRef } from "@angular/core";
+import { Component, ViewChild, DoCheck } from "@angular/core";
import { ResultElement } from "jalhyd";
@@ -6,7 +6,6 @@ import { SectionCanvasComponent } from "../section-canvas/section-canvas.compone
import { SectionResults } from "../../results/section-results";
import { ApplicationSetupService } from "../../services/app-setup/app-setup.service";
import { CalculatorResults } from "../../results/calculator-results";
-import { I18nService } from "../../services/internationalisation/internationalisation.service";
@Component({
selector: "section-results",
@@ -18,8 +17,7 @@ import { I18nService } from "../../services/internationalisation/internationalis
export class SectionResultsComponent implements DoCheck {
constructor(
- private appSetupService: ApplicationSetupService,
- private currentElement: ElementRef
+ private appSetupService: ApplicationSetupService
) { }
public set results(rs: CalculatorResults[]) {
@@ -138,8 +136,8 @@ export class SectionResultsComponent implements DoCheck {
document.exitFullscreen();
}
- public exportAsImage() {
- const canvas: HTMLCanvasElement = this.currentElement.nativeElement.querySelector("canvas");
+ public exportAsImage(element: HTMLDivElement) {
+ const canvas: HTMLCanvasElement = element.querySelector("canvas");
canvas.toBlob((blob) => {
saveAs(blob, "chart.png");
}); // defaults to image/png
--
GitLab
From 89e85396b7555836de75d09264cb91193ce7e494 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Fri, 15 Feb 2019 11:06:01 +0100
Subject: [PATCH 09/13] =?UTF-8?q?Graphique=20de=20courbe=20de=20remous:=20?=
=?UTF-8?q?adaptation=20de=20la=20taille=20=C3=A0=20l'=C3=A9cran?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../remous-results/remous-results.component.html | 4 +++-
.../remous-results/remous-results.component.scss | 12 ++++++++++++
.../remous-results/remous-results.component.ts | 2 +-
3 files changed, 16 insertions(+), 2 deletions(-)
diff --git a/src/app/components/remous-results/remous-results.component.html b/src/app/components/remous-results/remous-results.component.html
index 690b85563..7ad3a222a 100644
--- a/src/app/components/remous-results/remous-results.component.html
+++ b/src/app/components/remous-results/remous-results.component.html
@@ -12,7 +12,9 @@
</button>
</div>
- <chart [type]="graph1_type" [data]="graph1_data" [options]="graph1_options"></chart>
+ <chart id="main-chart" ngClass.lt-sm="height300" ngClass.sm="height400" ngClass.md="height400" ngClass.gt-md="height600"
+ [type]="graph1_type" [data]="graph1_data" [options]="graph1_options">
+ </chart>
</div>
</div>
diff --git a/src/app/components/remous-results/remous-results.component.scss b/src/app/components/remous-results/remous-results.component.scss
index 4161aad0a..a99663765 100644
--- a/src/app/components/remous-results/remous-results.component.scss
+++ b/src/app/components/remous-results/remous-results.component.scss
@@ -3,6 +3,18 @@
background-color: white;
}
+#main-chart {
+ &.height600 {
+ height:600px;
+ }
+ &.height400 {
+ height: 400px;
+ }
+ &.height300 {
+ height: 300px;
+ }
+}
+
.remous-results-extragraph-container{
display: block;
background-color: white;
diff --git a/src/app/components/remous-results/remous-results.component.ts b/src/app/components/remous-results/remous-results.component.ts
index 3ec1202e7..a92b9a7b1 100644
--- a/src/app/components/remous-results/remous-results.component.ts
+++ b/src/app/components/remous-results/remous-results.component.ts
@@ -564,7 +564,7 @@ export class RemousResultsComponent implements DoCheck {
const nDigits = this.appSetup.displayDigits;
this.graph1_options = {
responsive: true,
- maintainAspectRatio: true,
+ maintainAspectRatio: false,
animation: {
duration: 0
},
--
GitLab
From 5a7f2d1e97c3a019c4d534ccd7ebf995398d1a76 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Fri, 15 Feb 2019 11:53:12 +0100
Subject: [PATCH 10/13] =?UTF-8?q?package.json=20:=20m=C3=A0j=20version=20v?=
=?UTF-8?q?ers=204.0.0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
package.json | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/package.json b/package.json
index f4f5b3b6b..bb1875351 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "nghyd",
- "version": "1.2.0",
+ "version": "4.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
--
GitLab
From 8bab5feb2d0eb85d73b570130f05df719bcf21a4 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Mon, 18 Feb 2019 11:26:14 +0100
Subject: [PATCH 11/13] =?UTF-8?q?Fix=20#121=20:=20r=C3=A9sultats=20de=20ca?=
=?UTF-8?q?lcul=20r=C3=A9tablis=20sous=20la=20section=20param=C3=A9tr?=
=?UTF-8?q?=C3=A9e?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../calculator-results.component.html | 4 ++--
.../fixedvar-results/fixed-results.component.ts | 14 ++++++++------
.../section-results/section-results.component.html | 14 ++------------
.../section-results/section-results.component.scss | 5 +++++
.../section-results/section-results.component.ts | 9 ++++-----
.../definition/concrete/form-section-parametree.ts | 6 +-----
.../definition/form-compute-section-parametree.ts | 11 +++++++++--
src/app/results/section-results.ts | 3 +--
8 files changed, 32 insertions(+), 34 deletions(-)
diff --git a/src/app/components/calculator-results/calculator-results.component.html b/src/app/components/calculator-results/calculator-results.component.html
index 1cf1ee86e..03c60dfa0 100644
--- a/src/app/components/calculator-results/calculator-results.component.html
+++ b/src/app/components/calculator-results/calculator-results.component.html
@@ -1,5 +1,5 @@
-<div class="container-fluid">
- <fixedvar-results></fixedvar-results>
+<div>
<section-results></section-results>
<remous-results></remous-results>
+ <fixedvar-results></fixedvar-results>
</div>
diff --git a/src/app/components/fixedvar-results/fixed-results.component.ts b/src/app/components/fixedvar-results/fixed-results.component.ts
index a5ec36ac6..cf23921d8 100644
--- a/src/app/components/fixedvar-results/fixed-results.component.ts
+++ b/src/app/components/fixedvar-results/fixed-results.component.ts
@@ -80,12 +80,14 @@ export class FixedResultsComponent {
&& res.resultElement
&& res.extraResults
) {
- // 2.1. main result
- data.push({
- label: this._fixedResults.calculatedParameterHeader,
- value: this.intlService.formatResult(res.name, res.resultElement.vCalc),
- isCalcResult: true // for CSS
- });
+ // 2.1. main result (sometimes empty, for ex. in "Section paramétrée")
+ if (res.name && res.resultElement.vCalc) {
+ data.push({
+ label: this._fixedResults.calculatedParameterHeader,
+ value: this.intlService.formatResult(res.name, res.resultElement.vCalc),
+ isCalcResult: true // for CSS
+ });
+ }
// 2.2. extra results
const extraResults = res.resultElement.extraResults;
diff --git a/src/app/components/section-results/section-results.component.html b/src/app/components/section-results/section-results.component.html
index 0e0bdc211..2415b2655 100644
--- a/src/app/components/section-results/section-results.component.html
+++ b/src/app/components/section-results/section-results.component.html
@@ -13,18 +13,8 @@
</div>
<!-- graphique -->
- <div class="row">
- <div class="col" style="text-align: center">
- <section-canvas></section-canvas>
- </div>
+ <div class="canvas-container">
+ <section-canvas></section-canvas>
</div>
</div>
</div>
-
-<!-- tableau de valeurs -->
-<div class="col mx-auto">
- <table style="width: 100%" cellpadding="15">
- <tr vertical-result-element [result-element]=resultElement>
- </tr>
- </table>
-</div>
diff --git a/src/app/components/section-results/section-results.component.scss b/src/app/components/section-results/section-results.component.scss
index 4b8f1982b..15dd10202 100644
--- a/src/app/components/section-results/section-results.component.scss
+++ b/src/app/components/section-results/section-results.component.scss
@@ -21,3 +21,8 @@
}
}
}
+
+.canvas-container {
+ // border: dashed red 2px;
+ text-align: center;
+}
diff --git a/src/app/components/section-results/section-results.component.ts b/src/app/components/section-results/section-results.component.ts
index 47859d7db..34248eae2 100644
--- a/src/app/components/section-results/section-results.component.ts
+++ b/src/app/components/section-results/section-results.component.ts
@@ -6,6 +6,7 @@ import { SectionCanvasComponent } from "../section-canvas/section-canvas.compone
import { SectionResults } from "../../results/section-results";
import { ApplicationSetupService } from "../../services/app-setup/app-setup.service";
import { CalculatorResults } from "../../results/calculator-results";
+import { FixedResults } from "../../results/fixed-results";
@Component({
selector: "section-results",
@@ -22,19 +23,18 @@ export class SectionResultsComponent implements DoCheck {
public set results(rs: CalculatorResults[]) {
this._resultElement = undefined;
-
this._results = undefined;
if (rs) {
for (const r of rs) {
if (r instanceof SectionResults) {
this._results = r;
- break;
}
}
}
this.updateView();
}
+ /** détermine s'il y a des résultats de section "fixes" (pas de paramètre varié, graphique de la section) */
public get hasResults(): boolean {
return this._results && this._results.hasResults;
}
@@ -52,9 +52,8 @@ export class SectionResultsComponent implements DoCheck {
"Yc": { r: 255, g: 128, b: 0 },
"Yco": { r: 255, g: 0, b: 255 },
};
- /**
- * résultats non mis en forme
- */
+
+ /** résultats non mis en forme */
private _results: SectionResults;
/**
diff --git a/src/app/formulaire/definition/concrete/form-section-parametree.ts b/src/app/formulaire/definition/concrete/form-section-parametree.ts
index e5d22bcf9..651ec0453 100644
--- a/src/app/formulaire/definition/concrete/form-section-parametree.ts
+++ b/src/app/formulaire/definition/concrete/form-section-parametree.ts
@@ -1,16 +1,12 @@
-import { CalculatorType, acSection, ParamsEquation, ComputeNodeType, IObservable } from "jalhyd";
+import { IObservable } from "jalhyd";
import { FormResultSection } from "../form-result-section";
import { FormDefSection } from "../form-def-section";
-import { NgParameter } from "../../ngparam";
-import { InputField } from "../../input-field";
import { FormComputeSectionParametree } from "../form-compute-section-parametree";
import { FormulaireDefinition } from "../form-definition";
-import { I18nService } from "../../../services/internationalisation/internationalisation.service";
import { CalculatorResults } from "../../../results/calculator-results";
import { FormDefFixedVar } from "../form-def-fixedvar";
import { FieldSet } from "../../fieldset";
-import { SelectField } from "../../select-field";
export class FormulaireSectionParametree extends FormulaireDefinition {
private _formFixedVar: FormDefFixedVar;
diff --git a/src/app/formulaire/definition/form-compute-section-parametree.ts b/src/app/formulaire/definition/form-compute-section-parametree.ts
index 5466762f0..ab2c327b5 100644
--- a/src/app/formulaire/definition/form-compute-section-parametree.ts
+++ b/src/app/formulaire/definition/form-compute-section-parametree.ts
@@ -1,4 +1,4 @@
-import { SectionParametree, acSection } from "jalhyd";
+import { SectionParametree, acSection, Result } from "jalhyd";
import { FormCompute } from "./form-compute";
import { NgParameter } from "../ngparam";
@@ -80,9 +80,16 @@ export class FormComputeSectionParametree extends FormCompute {
this._sectionResults.section = sect;
const computePrec: number = this._formBase.getParameterValue("Pr"); // précision de calcul
- this._sectionResults.result = sectNub.CalcSerie(computePrec,
+ const tmpResult: Result = sectNub.CalcSerie(computePrec,
undefined, // valeur initiale, non utilisée dans ce cas
undefined // variable à calculer, non utilisée
);
+
+ // résultats de section (avec le graphique de section)
+ this._sectionResults.result = tmpResult;
+
+ // résultats complémentaires des paramètres fixés
+ this._formSectionResult.addSectionFixedParameters(false);
+ this._formSectionResult.fixedResults.result = tmpResult;
}
}
diff --git a/src/app/results/section-results.ts b/src/app/results/section-results.ts
index ee05b2943..c2ab16e7f 100644
--- a/src/app/results/section-results.ts
+++ b/src/app/results/section-results.ts
@@ -1,7 +1,6 @@
-import { acSection, Result, ResultElement } from "jalhyd";
+import { acSection, Result } from "jalhyd";
import { CalculatorResults } from "./calculator-results";
-import { NgParameter } from "../formulaire/ngparam";
export class SectionResults extends CalculatorResults {
private _result: Result;
--
GitLab
From 413983710354af364cb727585854c8c9ef4ba0ae Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Mon, 18 Feb 2019 12:14:19 +0100
Subject: [PATCH 12/13] =?UTF-8?q?Fix=20#127=20:=20le=20*ngIf=20cassait=20l?=
=?UTF-8?q?a=20disponibilit=C3=A9=20du=20ViewChild?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../components/remous-results/remous-results.component.html | 2 +-
src/app/components/remous-results/remous-results.component.ts | 4 ----
2 files changed, 1 insertion(+), 5 deletions(-)
diff --git a/src/app/components/remous-results/remous-results.component.html b/src/app/components/remous-results/remous-results.component.html
index 7ad3a222a..4efd8c40d 100644
--- a/src/app/components/remous-results/remous-results.component.html
+++ b/src/app/components/remous-results/remous-results.component.html
@@ -40,7 +40,7 @@
<!-- journal -->
<log></log>
-<div *ngIf="hasData">
+<div [hidden]="! hasData"><!-- *ngIf breaks @ViewChild availability-->
<!-- résultats numériques -->
<var-results></var-results>
</div>
diff --git a/src/app/components/remous-results/remous-results.component.ts b/src/app/components/remous-results/remous-results.component.ts
index a92b9a7b1..d62a814e0 100644
--- a/src/app/components/remous-results/remous-results.component.ts
+++ b/src/app/components/remous-results/remous-results.component.ts
@@ -258,10 +258,6 @@ export class RemousResultsComponent implements DoCheck {
return this.intlService.localizeText("INFO_REMOUSRESULTS_ABSCISSE");
}
- private get uitextTirant() {
- return this.intlService.localizeText("INFO_REMOUSRESULTS_TIRANT");
- }
-
private get uitextFond() {
return this.intlService.localizeText("INFO_REMOUSRESULTS_FOND");
}
--
GitLab
From 0b3bfc2459b4e8d9eef9afbd46b9e773c6f689b4 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Mon, 18 Feb 2019 14:12:45 +0100
Subject: [PATCH 13/13] =?UTF-8?q?Fix=20#128=20scroll=20en=20haut=20de=20pa?=
=?UTF-8?q?ge=20/=20vers=20les=20r=C3=A9sultats?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app/app.component.ts | 1 +
.../components/generic-calculator/calculator.component.html | 3 ++-
.../components/generic-calculator/calculator.component.scss | 6 ++++++
.../components/generic-calculator/calculator.component.ts | 2 +-
4 files changed, 10 insertions(+), 2 deletions(-)
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 3ab0def90..acecbe6d6 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -84,6 +84,7 @@ export class AppComponent implements OnInit, OnDestroy, Observer {
// close side navigation when clicking a calculator tab
if (event instanceof NavigationEnd) {
this.sidenav.close();
+ window.scrollTo(0, 0);
}
// [de]activate calc tabs depending on loaded route
if (event instanceof ActivationEnd) {
diff --git a/src/app/components/generic-calculator/calculator.component.html b/src/app/components/generic-calculator/calculator.component.html
index 97446a3a9..7874908f3 100644
--- a/src/app/components/generic-calculator/calculator.component.html
+++ b/src/app/components/generic-calculator/calculator.component.html
@@ -24,7 +24,7 @@
<mat-card-content>
<!-- nom du module de calcul -->
- <calc-name [title]="uitextCalculatorName"></calc-name>
+ <calc-name id="calculator-name" [title]="uitextCalculatorName"></calc-name>
<div id="calc-cards-container" class="container" fxLayout="row wrap" fxLayoutAlign="space-around start">
<!-- chapitres -->
@@ -46,6 +46,7 @@
<!-- résultats -->
<mat-card id="calc-card-results" fxFlex.gt-xs="1 0 400px" fxFlex.lt-sm="1 0 300px">
+ <div id="fake-results-anchor"></div>
<mat-card-header>
<mat-card-title>
<h1 [innerHTML]="uitextResultsTitle"></h1>
diff --git a/src/app/components/generic-calculator/calculator.component.scss b/src/app/components/generic-calculator/calculator.component.scss
index b9275137b..2346a4874 100644
--- a/src/app/components/generic-calculator/calculator.component.scss
+++ b/src/app/components/generic-calculator/calculator.component.scss
@@ -14,6 +14,12 @@
margin-right: -1em;
}
+// dirty fix for scrollIntoView() positioning
+#fake-results-anchor {
+ float: left; // to avoid following elements being affected by negative margin
+ margin-top: -54px;
+}
+
mat-card {
margin-bottom: 2em;
diff --git a/src/app/components/generic-calculator/calculator.component.ts b/src/app/components/generic-calculator/calculator.component.ts
index ffc2cf9d8..3496192aa 100644
--- a/src/app/components/generic-calculator/calculator.component.ts
+++ b/src/app/components/generic-calculator/calculator.component.ts
@@ -241,7 +241,7 @@ export class GenericCalculatorComponent extends BaseComponent implements OnInit,
}
private scrollToResults() {
- const element = document.getElementById("resultsComp");
+ const element = document.getElementById("fake-results-anchor");
if (element) {
element.scrollIntoView();
}
--
GitLab