Skip to content
Snippets Groups Projects
Commit bf528c48 authored by francois.grand's avatar francois.grand
Browse files

corrections MDBootstrap pour la conduite distributrice

parent 687917d8
No related branches found
No related tags found
No related merge requests found
<!--The content below is only a placeholder and can be replaced.-->
<header>
<!--Navbar-->
<mdb-navbar SideClass="navbar navbar-expand-lg navbar-dark indigo">
<mdb-navbar SideClass="navbar navbar-expand-sm navbar-dark indigo">
<!-- Navbar brand -->
<logo>
......@@ -76,4 +74,4 @@
<br>
<a href="http://www.irstea.fr/">Institut national de recherche en sciences et technologies pour l'environnement et l'agriculture</a>
</div> -->
</footer>
\ No newline at end of file
</footer>
<h1>{{uitextTitre}}</h1>
<div class="container-fluid">
<div class="row">
<div class="col">
<h1>{{uitextTitre}}</h1>
</div>
</div>
</div>
<hydrocalc type="ConduiteDistributrice"></hydrocalc>
\ No newline at end of file
<table>
<field-set [style.display]="getFieldsetStyleDisplay(fs.id)" *ngFor="let fs of fieldSets" [id]=fs.id [fieldSet]=fs (onRadio)=onRadioClick($event)
(onSelectChange)=onSelectChanged($event)></field-set>
</table>
<field-set *ngFor="let fs of fieldSets" [style.display]="getFieldsetStyleDisplay(fs.id)" [id]=fs.id [fieldSet]=fs (onRadio)=onRadioClick($event)
(onSelectChange)=onSelectChanged($event)></field-set>
<div style="text-align:center;">
<button type="button" class="button_compute" name="Calculer" (click)="doCompute()">{{uitextCalculer}}</button>
<div class="container-fluid">
<div class="row ">
<div class="col text-center">
<p></p>
</div>
</div>
<div class="row ">
<div class="col text-center">
<button type="button" class="button_compute" name="Calculer" (click)="doCompute()">{{uitextCalculer}}</button>
</div>
</div>
<div class="row ">
<div class="col text-center">
<p></p>
</div>
</div>
</div>
<calc-results [style.display]="getResultsStyleDisplay()"></calc-results>
<!--
<section-results [style.display]="getSectionResultsStyleDisplay()"></section-results>
<remous-results [style.display]="getRemousResultsStyleDisplay()"></remous-results>
\ No newline at end of file
<remous-results [style.display]="getRemousResultsStyleDisplay()"></remous-results>
-->
\ No newline at end of file
<chart *ngIf="showVarResults" style="float: left" [type]="graph_type" [data]="graph_data" [options]="graph_options">
</chart>
<div class="container-fluid">
<div class="row resultchart">
<div class="col-8 mx-auto">
<chart *ngIf="showVarResults" [type]="graph_type" [data]="graph_data" [options]="graph_options">
</chart>
</div>
</div>
</div>
<div style="text-align:center;">
<!-- table des résultats fixées -->
<table style="float: left">
<tr>
<th>{{uitextParamFixes}}</th>
<th>{{uitextValeurs}}</th>
</tr>
<tr *ngFor="let r of _fixedResults; let i=index" [class]="getFixedResultClass(i)">
<td class="result_label">{{r.label}}</td>
<td class="result_value">{{r.value}}</td>
</tr>
</table>
<!-- table des résultats variés -->
<table *ngIf="showVarResults" style="float: left">
<tr>
<th>{{_variableParamHeader}}</th>
<th>{{_variableResultHeader}}</th>
</tr>
<tr *ngFor="let r of _varResults; let i=index" [class]="getVarResultClass(i)">
<td class="result_label">{{r.param}}</td>
<td class="result_value">{{r.result}}</td>
</tr>
</table>
<div class="container-fluid">
<div class="row">
<!-- table des résultats fixés -->
<div class="col-4 mx-auto">
<div class="container">
<div class="row">
<div class="col-12">
<table class="table">
<tr>
<th>{{uitextParamFixes}}</th>
<th>{{uitextValeurs}}</th>
</tr>
<!-- <tr *ngFor="let r of _fixedResults; let i=index" [class]="getFixedResultClass(i)"> -->
<tr *ngFor="let r of _fixedResults; let i=index">
<td class="result_label {{getFixedResultClass(i)}}">{{r.label}}</td>
<td class="result_value {{getFixedResultClass(i)}}">{{r.value}}</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!-- table des résultats variés -->
<div class="col-5 mx-auto" *ngIf="showVarResults">
<div class="container">
<div class="row">
<div class="col-12">
<table class="table table-striped">
<tr>
<th>{{_variableParamHeader}}</th>
<th>{{_variableResultHeader}}</th>
</tr>
<tr *ngFor="let r of _varResults; let i=index">
<td class="result_label">{{r.param}}</td>
<td class="result_value">{{r.result}}</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
......@@ -9,20 +9,19 @@ import { InternationalisationService } from '../../services/internationalisation
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_1 {
background-color: #ffffff;
}
.result_id_2 {
font-weight: bold;
font-weight: bolder;
background-color: #00d0ff;
}
`
]
......@@ -63,7 +62,7 @@ export class CalculatorResultsComponent {
private graph_data = {};
private graph_options = {
responsive: true,
maintainAspectRatio: false,
maintainAspectRatio: true,
animation: {
duration: 0
},
......@@ -162,11 +161,7 @@ export class CalculatorResultsComponent {
private getFixedResultClass(i: number) {
if (this._isFixed && i == this._fixedResults.length - 1)
return "result_id_2"
return "result_id_" + String(i & 1);
}
private getVarResultClass(i: number) {
return "font-weight-bold";
return "result_id_" + String(i & 1);
}
}
<tr>
<!-- <tr>
<td colspan="5">
<div class="fieldset_title">{{_fieldSet.label}}</div>
</td>
......@@ -9,4 +9,27 @@
<select-field-line *ngIf="p.isSelect" [id]=p.id (onSelectChange)=onSelectChanged($event)></select-field-line>
<check-field-line *ngIf="p.isCheck" [id]=p.id></check-field-line>
</td>
</tr>
\ No newline at end of file
</tr> -->
<div class="container-fluid">
<div class="row">
<div class="col-12 fieldset_title">
{{_fieldSet.label}}
</div>
</div>
</div>
<!--
<tag *ngFor="let var of array" *ngIf="...utilisation de var..." >
</tag>
peut être transformé en
<ng-template ngFor let-var [ngForOf]="array">
<tag *ngIf="...utilisation de var..." >
</tag>
</ng-template>
-->
<ng-template ngFor let-p [ngForOf]="_fieldSet.fields">
<param-field-line *ngIf="p.isInput" [computeNodeType]=_fieldSet.computeNodeType [symbol]=p.symbol (onRadio)=onRadioClick($event)>
</param-field-line>
</ng-template>
\ No newline at end of file
<tr>
<td align="right" class="param_title">{{title}}</td>
<div class="container-fluid">
<div class="row">
<!-- titre -->
<div class="col-3 param_title">
{{title}}
</div>
<td>
<param-input [inputDisabled]="isInputDisabled" [computeNodeType]="nodeType" [symbol]="symbol"></param-input>
</td>
<td align="center" class="radio_param">
<input *ngIf="hasRadioFix()" type="radio" name="radio_param_{{symbol}}" value="fix" (click)="onRadioClick(symbol, 'fix')"
[checked]=radioFixCheck [disabled]=isDisabled id="radio_fix" />
<label *ngIf="hasRadioFix()" for="radio_fix">{{uitextParamFixe}}</label>
</td>
<!-- input de saisie de la valeur -->
<div class="col-3 col-sm-2">
<param-input [inputDisabled]="isInputDisabled" [computeNodeType]="nodeType" [symbol]="symbol"></param-input>
</div>
<td align="center" class="radio_param">
<input *ngIf="hasRadioVar()" type="radio" name="radio_param_{{symbol}}" value="var" (click)="onRadioClick(symbol,
<!-- radio "fixé" -->
<div class="col-sm-2 col-md-2 col-lg-1">
<input *ngIf="hasRadioFix()" type="radio" name="radio_param_{{symbol}}" value="fix" (click)="onRadioClick(symbol, 'fix')"
[checked]=radioFixCheck [disabled]=isDisabled id="radio_fix" />
<label *ngIf="hasRadioFix()" for="radio_fix">{{uitextParamFixe}}</label>
</div>
<!-- radio "varier" -->
<div class="col-sm-2 col-md-2 col-lg-1">
<input *ngIf="hasRadioVar()" type="radio" name="radio_param_{{symbol}}" value="var" (click)="onRadioClick(symbol,
'var')" [checked]=radioVarCheck [disabled]=isDisabled id="radio_var" />
<label *ngIf="hasRadioVar()" for="radio_var">{{uitextParamVarier}}</label>
</td>
<label *ngIf="hasRadioVar()" for="radio_var">{{uitextParamVarier}}</label>
</div>
<td align="center" class="radio_param">
<input *ngIf="hasRadioCal()" type="radio" name="radio_param_{{symbol}}" value="cal" (click)="onRadioClick(symbol,
'cal')" [checked]=radioCalCheck [disabled]=isDisabled id="radio_cal" />
<label *ngIf="hasRadioCal()" for="radio_cal">{{uitextParamCalculer}}</label>
</td>
</tr>
<!--
<tr [style.display]="isVarRadio">
<td></td>
<td></td>
<td>
De la valeur minimum
</td>
<td>
<input [(ngModel)]="_param.minValue">
</td>
</tr>
<tr [style.display]="isVarRadio">
<td></td>
<td></td>
<td>
à la valeur maximum
</td>
<td>
<input [(ngModel)]="_param.maxValue">
</td>
</tr>
<tr [style.display]="isVarRadio">
<td></td>
<td></td>
<td>
avec un pas de :
</td>
<td>
<input [(ngModel)]="_param.stepValue">
</td>
</tr>
-->
<!--
<tr [style.display]="isVarRadio">
<div align="center">
De la valeur minimum
<input [(ngModel)]="_param.minValue">
</div>
<div align="center">
&nbsp; à la valeur maximum
<input [(ngModel)]="_param.maxValue">
</div>
<div align="center">
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;avec un pas de :
<input [(ngModel)]="_param.stepValue">
<!-- radio "calculer" -->
<div class="col-sm-3 col-md-2 col-lg-2">
<input *ngIf="hasRadioCal()" type="radio" name="radio_param_{{symbol}}" value="cal" (click)="onRadioClick(symbol,
'cal')" [checked]=radioCalCheck [disabled]=isDisabled id="radio_cal" />
<label *ngIf="hasRadioCal()" for="radio_cal">{{uitextParamCalculer}}</label>
</div>
</div>
</tr>
-->
<tr [style.display]="isVarRadio">
<div align="center">
{{uitextValeurMini}}
<input [(ngModel)]="_param.minValue">
</div>
<div class="container-fluid" [style.display]="isVarRadio">
<div class="row">
<div class="col-sm-1 col-md-5"></div>
<div class="col-sm-4 col-md-3 col-lg-2">
{{uitextValeurMini}}
</div>
<div class="col-2">
<!-- <input [(ngModel)]="_param.minValue"> -->
<input type="text" class="input-alternate" name="inputmin" placeholder="min" [(ngModel)]="_param.minValue" />
</div>
</div>
<div align="center">
{{uitextValeurMaxi}}
<input [(ngModel)]="_param.maxValue">
<div class="row">
<div class="col-sm-1 col-md-5"></div>
<div class="col-sm-4 col-md-3 col-lg-2">
{{uitextValeurMaxi}}
</div>
<div class="col-2">
<!-- <input [(ngModel)]="_param.maxValue"> -->
<input type="text" class="input-alternate" name="inputmax" placeholder="max" [(ngModel)]="_param.maxValue" />
</div>
</div>
<div align="center">
{{uitextPasVariation}}
<input [(ngModel)]="_param.stepValue">
<div class="row">
<div class="col-sm-1 col-md-5"></div>
<div class="col-sm-4 col-md-3 col-lg-2">
{{uitextPasVariation}}
</div>
<div class="col-2">
<!-- <input [(ngModel)]="_param.stepValue"> -->
<input type="text" class="input-alternate" name="inputstep" placeholder="step" [(ngModel)]="_param.stepValue" />
</div>
</div>
</tr>
\ No newline at end of file
</div>
\ No newline at end of file
<p *ngIf="displayTitle">{{uitextParamInput}}</p>
<input [disabled]="_inputDisabled" placeholder="{{_paramDef.symbol}}" [ngModel]="_uiValue.uncheckedValueString" (ngModelChange)="setValue($event)"
/>
<br/> {{_message}}
<!--
<p *ngIf="displayTitle" i18n="@@titre_saisie_param">Saisie de paramètre</p>
<md-input-container>
<input mdInput placeholder="{{_paramDef.symbol}}" [ngModel]="_uiValue.uncheckedValueString" (ngModelChange)="setValue($event)"
/>
<md-hint>{{_message}}</md-hint>
</md-input-container>
-->
\ No newline at end of file
<div class="container">
<div class="row" *ngIf="displayTitle">
<div class="col-12">
{{uitextParamInput}}
</div>
</div>
<div class="row">
<div class="col-12">
<form>
<div class="md-form">
<!-- <input mdbActive type="text" class="form-control" id="form1" name="email" mdbInputValidate> -->
<input type="text" class="input-alternate" id="form1" name="form1" [disabled]="_inputDisabled" placeholder="{{_paramDef.symbol}}"
[ngModel]="_uiValue.uncheckedValueString" (ngModelChange)="setValue($event)" />
<label class="active" for="form1" *ngIf="displayTitle">{{uitextParamInput}}</label>
<small class="text-danger">{{_message}}</small>
</div>
</form>
</div>
</div>
<div class="row" *ngIf="displayTitle">
<div class="col-12">
{{_message}}
</div>
</div>
</div>
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment