From 38100baee567d91bfb2a075dd569c5193c6ab0aa Mon Sep 17 00:00:00 2001
From: "francois.grand" <francois.grand@irstea.fr>
Date: Mon, 12 Mar 2018 17:25:02 +0100
Subject: [PATCH] =?UTF-8?q?=20#27=20:=20remplacement=20des=20=C3=A9v=C3=A9?=
=?UTF-8?q?nements=20Angular=20=C3=A9mis=20par=20les=20select=20par=20des?=
=?UTF-8?q?=20notifications=20observ=C3=A9=20->=20observateur=20-=20Formul?=
=?UTF-8?q?aireNode=20impl=C3=A9mente=20IObservable=20(m=C3=A9nage=20dans?=
=?UTF-8?q?=20les=20classes=20d=C3=A9riv=C3=A9es)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../field-set/field-set.component.html | 2 +-
.../field-set/field-set.component.ts | 13 ----
.../fieldset-container.component.html | 3 +-
.../fieldset-container.component.ts | 13 ----
.../calculator.component.html | 5 +-
.../calculator.component.ts | 8 ---
.../ngparam-input/ngparam-input.component.ts | 1 -
.../select-field-line.component.html | 2 +-
.../concrete/form-parallel-structures.ts | 67 +++++++++++++++++++
src/app/formulaire/definition/form-compute.ts | 11 +--
.../definition/form-def-fixedvar.ts | 3 +-
.../formulaire/definition/form-def-section.ts | 6 +-
.../formulaire/definition/form-definition.ts | 48 +++++--------
src/app/formulaire/fieldset-container.ts | 6 ++
src/app/formulaire/formulaire-node.ts | 32 ++++++++-
src/app/formulaire/ngparam.ts | 32 +--------
src/app/formulaire/select-field.ts | 33 ++-------
17 files changed, 141 insertions(+), 144 deletions(-)
diff --git a/src/app/components/field-set/field-set.component.html b/src/app/components/field-set/field-set.component.html
index 361f044f6..cd33a4983 100644
--- a/src/app/components/field-set/field-set.component.html
+++ b/src/app/components/field-set/field-set.component.html
@@ -18,7 +18,7 @@
<param-field-line *ngIf="isInputField(p)" [param]=p (onRadio)=onRadioClick($event) (onValid)=onParamLineValid()>
</param-field-line>
- <select-field-line *ngIf="isSelectField(p)" [param]=p (selectChange)=onSelectChanged($event)>
+ <select-field-line *ngIf="isSelectField(p)" [param]=p>
</select-field-line>
<check-field-line *ngIf="isCheckField(p)" [param]=p></check-field-line>
diff --git a/src/app/components/field-set/field-set.component.ts b/src/app/components/field-set/field-set.component.ts
index 0594d7767..462644627 100644
--- a/src/app/components/field-set/field-set.component.ts
+++ b/src/app/components/field-set/field-set.component.ts
@@ -136,13 +136,6 @@ export class FieldSetComponent implements DoCheck {
@Output()
private onRadio = new EventEmitter<any>();
- /**
- * réception d'un événement d'un select
- */
- private onSelectChanged(val: SelectEntry) {
- this.selectChange.emit(val); // on transmet au parent
- }
-
public get isValid() {
return this._isValid;
}
@@ -184,10 +177,4 @@ export class FieldSetComponent implements DoCheck {
private onParamLineValid(event: boolean) {
this.updateValidity();
}
-
- /**
- * événément de changement d'état d'un select
- */
- @Output()
- private selectChange = new EventEmitter<SelectEntry>();
}
diff --git a/src/app/components/fieldset-container/fieldset-container.component.html b/src/app/components/fieldset-container/fieldset-container.component.html
index ad3546595..154696041 100644
--- a/src/app/components/fieldset-container/fieldset-container.component.html
+++ b/src/app/components/fieldset-container/fieldset-container.component.html
@@ -6,7 +6,6 @@
<!-- bouton d'ajout d'un ouvrage -->
<button type="button" class="btn btn-grey waves-light" mdbRippleRadius (click)="addStructure()">Ajouter un ouvrage</button>
</div>
- <field-set *ngFor="let fs of fieldsets" [fieldSet]=fs (selectChange)=onSelectChanged($event) (onRadio)=onRadioClick($event)
- (onValid)=onFieldsetValid()>
+ <field-set *ngFor="let fs of fieldsets" [fieldSet]=fs (onRadio)=onRadioClick($event) (onValid)=onFieldsetValid()>
</field-set>
</div>
\ No newline at end of file
diff --git a/src/app/components/fieldset-container/fieldset-container.component.ts b/src/app/components/fieldset-container/fieldset-container.component.ts
index e2da23746..26ac2f5f1 100644
--- a/src/app/components/fieldset-container/fieldset-container.component.ts
+++ b/src/app/components/fieldset-container/fieldset-container.component.ts
@@ -13,12 +13,6 @@ export class FieldsetContainerComponent implements DoCheck {
@Input("container")
private _container: FieldsetContainer;
- /**
- * événément de changement d'état d'un select
- */
- @Output()
- private selectChange = new EventEmitter<SelectEntry>();
-
/**
* liste des composants FieldSet enfants
*/
@@ -44,13 +38,6 @@ export class FieldsetContainerComponent implements DoCheck {
this._container.addFromTemplate(this._container.templates[0].id);
}
- /**
- * réception d'un événement d'un select
- */
- private onSelectChanged(val: SelectEntry) {
- this.selectChange.emit(val); // on transmet au parent
- }
-
/*
* gestion des événements clic sur les radios :
* réception d'un message du composant enfant (field-set)
diff --git a/src/app/components/generic-calculator/calculator.component.html b/src/app/components/generic-calculator/calculator.component.html
index 5d8e83658..47e2a2e53 100644
--- a/src/app/components/generic-calculator/calculator.component.html
+++ b/src/app/components/generic-calculator/calculator.component.html
@@ -24,10 +24,9 @@
<!-- chapitres -->
<ng-template ngFor let-fe [ngForOf]="formElements">
<field-set *ngIf="isFieldset(fe)" [style.display]="getFieldsetStyleDisplay(fe.id)" [fieldSet]=fe (onRadio)=onRadioClick($event)
- (selectChange)=onSelectChanged($event) (validChange)=OnFieldsetValid()></field-set>
+ (validChange)=OnFieldsetValid()></field-set>
- <fieldset-container *ngIf="isFieldsetContainer(fe)" [container]=fe (selectChange)=onSelectChanged($event) (onRadio)=onRadioClick($event)
- (validChange)=onFieldsetContainerValid()></fieldset-container>
+ <fieldset-container *ngIf="isFieldsetContainer(fe)" [container]=fe (onRadio)=onRadioClick($event) (validChange)=onFieldsetContainerValid()></fieldset-container>
</ng-template>
</div>
diff --git a/src/app/components/generic-calculator/calculator.component.ts b/src/app/components/generic-calculator/calculator.component.ts
index f69d1cb95..752e911dd 100644
--- a/src/app/components/generic-calculator/calculator.component.ts
+++ b/src/app/components/generic-calculator/calculator.component.ts
@@ -256,14 +256,6 @@ export class GenericCalculatorComponent extends BaseComponent implements OnInit,
}
}
- /**
- * réception d'un événement d'un select
- */
- private onSelectChanged(val: SelectEntry) {
- this._formulaire.resetResults();
- this._formulaire.applyDependencies();
- }
-
/**
* appelé après le 1er affichage du composant
*/
diff --git a/src/app/components/ngparam-input/ngparam-input.component.ts b/src/app/components/ngparam-input/ngparam-input.component.ts
index 803076aeb..b7c3bcbf0 100644
--- a/src/app/components/ngparam-input/ngparam-input.component.ts
+++ b/src/app/components/ngparam-input/ngparam-input.component.ts
@@ -8,7 +8,6 @@ import { NumericalString, Message } from "jalhyd";
import { InternationalisationService } from "../../services/internationalisation/internationalisation.service";
import { NgParameter } from "../../formulaire/ngparam";
import { GenericInputComponent } from "../generic-input/generic-input.component";
-import { Observer, IObservable } from "../../services/observer";
@Component({
selector: "ngparam-input",
diff --git a/src/app/components/select-field-line/select-field-line.component.html b/src/app/components/select-field-line/select-field-line.component.html
index f1facb0c0..f3e7ae806 100644
--- a/src/app/components/select-field-line/select-field-line.component.html
+++ b/src/app/components/select-field-line/select-field-line.component.html
@@ -13,4 +13,4 @@
<a class="dropdown-item" *ngFor="let e of entries" [value]=e>{{entryLabel(e)}}</a>
</div>
</div>
-</div>
+</div>
\ No newline at end of file
diff --git a/src/app/formulaire/definition/concrete/form-parallel-structures.ts b/src/app/formulaire/definition/concrete/form-parallel-structures.ts
index ae1d2e96b..c195885cd 100644
--- a/src/app/formulaire/definition/concrete/form-parallel-structures.ts
+++ b/src/app/formulaire/definition/concrete/form-parallel-structures.ts
@@ -7,6 +7,9 @@ import { FormDefParamToCalculate } from "../form-def-paramcalc";
import { FormDefFixedVar } from "../form-def-fixedvar";
import { FormComputeParallelStructures } from "../form-compute-parallel-structures";
import { FormResultFixedVar } from "../form-result-fixedvar";
+import { FieldsetContainer } from "../../fieldset-container";
+import { FieldSet } from "../../fieldset";
+import { SelectField } from "../../select-field";
export class FormulaireParallelStructure extends FormulaireDefinition {
private _formFixedVar: FormDefFixedVar;
@@ -34,6 +37,37 @@ export class FormulaireParallelStructure extends FormulaireDefinition {
}
protected completeParse() {
+ // récupération des valeurs par défaut pour les affecter au template
+
+ // for (const n of this.allFormElements)
+ // if (n instanceof FieldsetContainer) {
+ // var fsc: FieldsetContainer = n;
+ // break;
+ // }
+
+ // if (fsc == undefined)
+ // console.log("warning : pas de valeurs par défaut trouvées pour les ouvrages en parallèle")
+ // else {
+ // const st = CreateStructure(StructureType.Cem88d);
+ // for (const i in st.prms.map) {
+ // const param = st.prms.map[i];
+
+ // let found = false;
+ // for (const tmpl of fsc.templates) {
+ // for (const n of tmpl.allFormElements)
+ // if (n.id === param.symbol) {
+ // // if (n.id === param.symbol) {
+ // const ng = n as NgParameter;
+ // ng.setValue(param.v);
+ // found = true;
+ // break;
+ // }
+ // if (found) break;
+ // }
+ // }
+ // }
+
+ this.subscribeFieldsetContainer();
}
/**
@@ -58,4 +92,37 @@ export class FormulaireParallelStructure extends FormulaireDefinition {
public get results(): CalculatorResults[] {
return this._formResult.results;
}
+
+ /**
+ * abonnement en tant qu'observateur du FieldsetContainer
+ */
+ private subscribeFieldsetContainer() {
+ const n = this.getFormulaireNodeById("struct_container");
+ if (n == undefined || !(n instanceof FieldsetContainer))
+ throw new Error("l'élément 'struct_container' n'est pas du type FieldsetContainer");
+ const fsc: FieldsetContainer = n as FieldsetContainer;
+ fsc.addObserver(this);
+ }
+
+ /**
+ * abonnement en tant qu'observateur du SelectField des FieldSet contenus dans le FieldsetContainer
+ */
+ private subscribeStructureSelectFields(fs: FieldSet) {
+ for (const n of fs.allFormElements)
+ if (n instanceof SelectField)
+ n.addObserver(this);
+ }
+
+ public update(sender: any, data: any) {
+ if (sender instanceof FieldsetContainer)
+ switch (data["action"]) {
+ case "newFieldset":
+ this.reset();
+ this.subscribeStructureSelectFields(data["fieldset"]);
+ }
+ else if (sender instanceof SelectField) {
+ // la valeur d'un des select (type d'ouvrage, loi de débit) a changé
+ this.reset();
+ }
+ }
}
diff --git a/src/app/formulaire/definition/form-compute.ts b/src/app/formulaire/definition/form-compute.ts
index 33b9eb2db..ae5ca83e5 100644
--- a/src/app/formulaire/definition/form-compute.ts
+++ b/src/app/formulaire/definition/form-compute.ts
@@ -1,16 +1,9 @@
-import { IObservable, Observable, Observer } from "../../services/observer";
import { FormResult } from "./form-result";
import { ParamsEquation, ComputeNode } from "jalhyd";
import { FormulaireDefinition } from "./form-definition";
export abstract class FormCompute {
- /**
- * implémentation par délégation de IObservable
- */
- private _observable: Observable;
-
constructor(protected _formBase: FormulaireDefinition, protected _formResult: FormResult) {
- this._observable = new Observable;
}
protected abstract getNubAndParameters(): [ComputeNode, ParamsEquation];
@@ -28,6 +21,6 @@ export abstract class FormCompute {
this._formBase.notifyObservers({
"action": "resultsUpdated",
- });
+ }, this._formBase);
}
-}
\ No newline at end of file
+}
diff --git a/src/app/formulaire/definition/form-def-fixedvar.ts b/src/app/formulaire/definition/form-def-fixedvar.ts
index 0db6220e3..75e0c71aa 100644
--- a/src/app/formulaire/definition/form-def-fixedvar.ts
+++ b/src/app/formulaire/definition/form-def-fixedvar.ts
@@ -81,8 +81,7 @@ export class FormDefFixedVar {
newCal.radioState = ParamRadioConfig.CAL;
}
- this._formBase.resetResults();
- this._formBase.applyDependencies();
+ this._formBase.reset();
}
/**
diff --git a/src/app/formulaire/definition/form-def-section.ts b/src/app/formulaire/definition/form-def-section.ts
index 558d4f458..556e58edd 100644
--- a/src/app/formulaire/definition/form-def-section.ts
+++ b/src/app/formulaire/definition/form-def-section.ts
@@ -33,7 +33,11 @@ export class FormDefSection implements Observer {
}
private updateSectionNodeType() {
- this._sectionNodeType = this.getNodeTypeFromSelectField();
+ const nt = this.getNodeTypeFromSelectField();
+ if (this._sectionNodeType !== nt) {
+ this._sectionNodeType = nt;
+ this._formBase.reset();
+ }
}
public getSectionVariatedParameter(): NgParameter {
diff --git a/src/app/formulaire/definition/form-definition.ts b/src/app/formulaire/definition/form-definition.ts
index 70e107df1..e838c009d 100644
--- a/src/app/formulaire/definition/form-definition.ts
+++ b/src/app/formulaire/definition/form-definition.ts
@@ -2,7 +2,6 @@ import { CalculatorType, ComputeNodeType } from "jalhyd";
import { FormulaireElement } from "../formulaire-element";
import { NgParameter, ParamRadioConfig } from "../ngparam";
import { Field } from "../field";
-import { IObservable, Observer, Observable } from "../../services/observer";
import { StringMap } from "../../stringmap";
import { FormulaireNode } from "../formulaire-node";
import { ApplicationSetupService } from "../../services/app-setup/app-setup.service";
@@ -18,12 +17,7 @@ import { CalculatorResults } from "../../results/calculator-results";
/**
* classe de base pour tous les formulaires
*/
-export abstract class FormulaireDefinition extends FormulaireNode { //implements IFormulaireDefinition {
- /**
- * implémentation par délégation de IObservable
- */
- private _observable: Observable;
-
+export abstract class FormulaireDefinition extends FormulaireNode {
/**
* type de calculette
*/
@@ -40,7 +34,6 @@ export abstract class FormulaireDefinition extends FormulaireNode { //implements
) {
super();
this._calcType = calcType;
- this._observable = new Observable();
}
public get calculatorType(): CalculatorType {
@@ -211,6 +204,15 @@ export abstract class FormulaireDefinition extends FormulaireNode { //implements
throw new Error(`Formulaire.getNodeParameterValue() : pas de paramètre ${symbol} trouvé`);
}
+ /**
+ * réinitialisation du formulaire suite à un changement d'une valeur, d'une option, ... :
+ * effacement des résultats, application des dépendances, ...
+ */
+ public reset() {
+ this.resetResults();
+ this.applyDependencies();
+ }
+
/**
* retourne la valeur actuellement sélectionnée d'un SelectField
* @param selectFieldId id du SelectField
@@ -241,7 +243,7 @@ export abstract class FormulaireDefinition extends FormulaireNode { //implements
fe.applyDependencies(this);
}
- public abstract resetResults();
+ protected abstract resetResults();
public abstract doCompute();
public abstract get hasResults(): boolean;
public abstract get results(): CalculatorResults[];
@@ -306,26 +308,12 @@ export abstract class FormulaireDefinition extends FormulaireNode { //implements
throw new Error("FormulaireDefinition.clone() non implémenté");
}
- // interface IObservable
-
- /**
- * ajoute un observateur à la liste
- */
- public addObserver(o: Observer) {
- this._observable.addObserver(o);
- }
-
- /**
- * supprime un observateur de la liste
- */
- public removeObserver(o: Observer) {
- this._observable.removeObserver(o);
- }
+ // interface Observer
- /**
- * notifie un événement aux observateurs
- */
- public notifyObservers(data: any) {
- this._observable.notifyObservers(data, this);
- }
+ // update(sender: IObservable, data: any) {
+ // switch (data["action"]) {
+ // case "resetForm": // événement demandant une réinitialisation du formulaire (changement d'un SelectField, ...)
+ // this.onReset();
+ // }
+ // }
}
diff --git a/src/app/formulaire/fieldset-container.ts b/src/app/formulaire/fieldset-container.ts
index d33157cc8..5999f7c65 100644
--- a/src/app/formulaire/fieldset-container.ts
+++ b/src/app/formulaire/fieldset-container.ts
@@ -68,6 +68,12 @@ export class FieldsetContainer extends FormulaireElement {
this.fieldsets.push(inst);
inst.applyDependencies(this.parentForm);
this.updateLocalisation()
+
+ // notification de création d'un FieldSet
+ this.notifyObservers({
+ "action": "newFieldset",
+ "fieldset": inst
+ }, this);
}
public get fieldsets(): FieldSet[] {
diff --git a/src/app/formulaire/formulaire-node.ts b/src/app/formulaire/formulaire-node.ts
index e569c7e30..285e8917d 100644
--- a/src/app/formulaire/formulaire-node.ts
+++ b/src/app/formulaire/formulaire-node.ts
@@ -2,11 +2,12 @@ import { JalhydObject } from "jalhyd"
import { FormulaireDefinition } from "./definition/form-definition";
import { DeepFormulaireNodeIterator } from "./form-iterator/deep-node-iterator";
+import { IObservable, Observer, Observable } from "../services/observer";
/**
* représentation sous forme d'arbre du formulaire et de ses éléments
*/
-export abstract class FormulaireNode {
+export abstract class FormulaireNode implements IObservable {
/**
* identifiant dans le fichier de conf
*/
@@ -32,10 +33,16 @@ export abstract class FormulaireNode {
*/
private _fromTemplate: FormulaireNode;
+ /**
+ * implémentation par délégation de IObservable
+ */
+ private _observable: Observable;
+
constructor(isTmpl: boolean = false) {
this._kids = [];
this._uid = JalhydObject.nextUID;
this._isTemplate = isTmpl;
+ this._observable = new Observable()
}
get id(): string {
@@ -177,4 +184,27 @@ export abstract class FormulaireNode {
public abstract parseConfig(json: {}, data?: {});
public abstract parseDependencies(json: {}, parentForm: FormulaireDefinition);
+
+ // interface IObservable
+
+ /**
+ * ajoute un observateur à la liste
+ */
+ public addObserver(o: Observer) {
+ this._observable.addObserver(o);
+ }
+
+ /**
+ * supprime un observateur de la liste
+ */
+ public removeObserver(o: Observer) {
+ this._observable.removeObserver(o);
+ }
+
+ /**
+ * notifie un événement aux observateurs
+ */
+ notifyObservers(data: any, sender?: any) {
+ this._observable.notifyObservers(data, sender);
+ }
}
diff --git a/src/app/formulaire/ngparam.ts b/src/app/formulaire/ngparam.ts
index f054d4ffa..6cd0bd3a1 100644
--- a/src/app/formulaire/ngparam.ts
+++ b/src/app/formulaire/ngparam.ts
@@ -4,7 +4,6 @@ import { InputField } from "./input-field";
import { Dependency } from "./dependency/dependency";
import { DependencyConditionType } from "./dependency/dependency-condition";
import { ValueDependencyCondition } from "./dependency/value-dependency-condition";
-import { Observable, IObservable, Observer } from "../services/observer";
import { FormulaireDefinition } from "./definition/form-definition";
import { ApplicationSetupService } from "../services/app-setup/app-setup.service";
@@ -44,7 +43,7 @@ export enum ParamValueMode {
/**
* classe englobante de ParamDefinition (champs supplémentaires pour l'affichage, radio boutons, ...)
*/
-export class NgParameter extends InputField { // implements IObservable {
+export class NgParameter extends InputField {
public unit: string;
public radioConfig: ParamRadioConfig;
public radioState: ParamRadioConfig;
@@ -75,14 +74,8 @@ export class NgParameter extends InputField { // implements IObservable {
*/
private _valueList: number[];
- /**
- * implémentation par délégation de IObservable
- */
- private _observable: Observable;
-
constructor(private _paramDef: ParamDefinition, isTmpl = false) {
super(isTmpl);
- this._observable = new Observable();
}
get symbol(): string {
@@ -326,27 +319,4 @@ export class NgParameter extends InputField { // implements IObservable {
protected clone(): NgParameter {
return new NgParameter(this._paramDef.clone());
}
-
- // // interface IObservable
-
- // /**
- // * ajoute un observateur à la liste
- // */
- // public addObserver(o: Observer) {
- // this._observable.addObserver(o);
- // }
-
- // /**
- // * supprime un observateur de la liste
- // */
- // public removeObserver(o: Observer) {
- // this._observable.removeObserver(o);
- // }
-
- // /**
- // * notifie un événement aux observateurs
- // */
- // public notifyObservers(data: any) {
- // this._observable.notifyObservers(data, this);
- // }
}
diff --git a/src/app/formulaire/select-field.ts b/src/app/formulaire/select-field.ts
index ab25d5ef9..65bfbfc94 100644
--- a/src/app/formulaire/select-field.ts
+++ b/src/app/formulaire/select-field.ts
@@ -6,17 +6,14 @@ import { ValueDependencyCondition } from "./dependency/value-dependency-conditio
import { StringMap } from "../stringmap";
import { IObservable, Observable, Observer } from "../services/observer";
-export class SelectField extends Field implements IObservable {
+export class SelectField extends Field {
private _entries: SelectEntry[];
private _selectedEntry: SelectEntry;
- private _observable: Observable;
-
constructor(isTmpl = false) {
super(isTmpl);
this._entries = [];
- this._observable = new Observable();
}
public get entries() {
@@ -36,7 +33,10 @@ export class SelectField extends Field implements IObservable {
public setValue(v: SelectEntry) {
if (this._selectedEntry !== v) {
this._selectedEntry = v;
- this.notifyObservers({ "action": "select", "value": v });
+ this.notifyObservers({
+ "action": "select",
+ "value": v
+ }, this);
}
}
@@ -93,27 +93,4 @@ export class SelectField extends Field implements IObservable {
this.addEntry(e);
}
}
-
- // interface IObservable
-
- /**
- * ajoute un observateur à la liste
- */
- public addObserver(o: Observer) {
- this._observable.addObserver(o);
- }
-
- /**
- * supprime un observateur de la liste
- */
- public removeObserver(o: Observer) {
- this._observable.removeObserver(o);
- }
-
- /**
- * notifie un événement aux observateurs
- */
- public notifyObservers(data: any) {
- this._observable.notifyObservers(data, this);
- }
}
--
GitLab