diff --git a/src/app/calculators/generic/calculator.component.html b/src/app/calculators/generic/calculator.component.html index af45d57dd7bc01137e748203d971b9c0a6622f48..14de350e57b7e5a46d36cab709786321d16028c6 100644 --- a/src/app/calculators/generic/calculator.component.html +++ b/src/app/calculators/generic/calculator.component.html @@ -27,7 +27,7 @@ <p></p> </div> </div> -<calc-results></calc-results> +<calc-results id="resultsComp" (contentCompleted)="onResultsCompleted()"></calc-results> <div mdbModal #confirmModal="mdb-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" [config]="{backdrop: false, ignoreBackdropClick: true}"> <div class="modal-dialog" role="document"> diff --git a/src/app/calculators/generic/calculator.component.ts b/src/app/calculators/generic/calculator.component.ts index d76f34c7bafd4fe04c767466464ef9c0de461951..dccea1d0da48ce1c19bd79992b060a79360a3f15 100644 --- a/src/app/calculators/generic/calculator.component.ts +++ b/src/app/calculators/generic/calculator.component.ts @@ -36,6 +36,11 @@ export class GenericCalculatorComponent implements OnInit, DoCheck, OnDestroy, O private _subscription: Subscription; // pour souscrire aux changements d'URL envoyés par le routeur + /** + * true si on a cliqué sur le bouton de lancement de calcul + */ + private _computeClicked: boolean; + constructor(private intlService: InternationalisationService, private formulaireService: FormulaireService, private route: ActivatedRoute) { @@ -162,6 +167,20 @@ export class GenericCalculatorComponent implements OnInit, DoCheck, OnDestroy, O private doCompute() { this._formulaire.doCompute(); this.resultsComponent.updateView(); + this._computeClicked = true; + } + + private onResultsCompleted() { + if (this._computeClicked) { + this._computeClicked = false; + this.scrollToResults(); + } + } + + private scrollToResults() { + const element = document.getElementById("resultsComp"); + if (element) + element.scrollIntoView(); } private getFieldsetStyleDisplay(id: string) { diff --git a/src/app/components/calculator-results/calculator-results.component.html b/src/app/components/calculator-results/calculator-results.component.html index 7130025667f54cefd59b2b154ee4698f35d0a2a4..10445cc1a6bff4ddd433b48c76455389353d00c6 100644 --- a/src/app/components/calculator-results/calculator-results.component.html +++ b/src/app/components/calculator-results/calculator-results.component.html @@ -4,4 +4,4 @@ <section-results [style.display]="getSectionResultsStyleDisplay()"></section-results> <remous-results [style.display]="getRemousResultsStyleDisplay()"></remous-results> </div> -</div> \ No newline at end of file +</div> diff --git a/src/app/components/calculator-results/calculator-results.component.ts b/src/app/components/calculator-results/calculator-results.component.ts index 45ae5825ccc6512c83224e3cdb84b4058c77e6b6..cba24f51fcaf4bdf8b251bbd29bf8fbdb3f91ea3 100644 --- a/src/app/components/calculator-results/calculator-results.component.ts +++ b/src/app/components/calculator-results/calculator-results.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild } from "@angular/core"; +import { Component, ViewChild, Output, EventEmitter, AfterViewChecked } from "@angular/core"; import { FixedVarResultsComponent } from "../../components/fixedvar-results/fixedvar-results.component"; import { SectionResultsComponent } from "../../components/section-results/section-results.component"; @@ -9,7 +9,7 @@ import { FormulaireDefinition } from "../../formulaire/formulaire-definition"; selector: "calc-results", templateUrl: "./calculator-results.component.html", }) -export class CalculatorResultsComponent { +export class CalculatorResultsComponent implements AfterViewChecked { private _formulaire: FormulaireDefinition; /** @@ -30,6 +30,12 @@ export class CalculatorResultsComponent { @ViewChild(RemousResultsComponent) private remousResultsComponent: RemousResultsComponent; + /** + * événement émis à la fin du dessin de la vue + */ + @Output() + private contentCompleted = new EventEmitter(); + public set formulaire(f: FormulaireDefinition) { this._formulaire = f; if (this._formulaire == undefined) { @@ -50,6 +56,10 @@ export class CalculatorResultsComponent { this.remousResultsComponent.updateView(); } + public ngAfterViewChecked() { + this.contentCompleted.emit(); + } + private getFixedVarResultsStyleDisplay() { return this._formulaire != undefined && this._formulaire.hasFixVarResults() ? "block" : "none"; }