<h1 mat-dialog-title [innerHTML]="uitextEditParamVariableValues"></h1> <div mat-dialog-content> <mat-form-field> <mat-select [placeholder]="uiTextModeSelection" [(value)]="selectedValueMode" (selectionChange)="onValueModeChange($event)" data-testid="variable-value-mode-select"> <mat-option *ngFor="let e of valueModes" [value]="e.value"> {{ e.label }} </mat-option> </mat-select> </mat-form-field> <div *ngIf="isMinMax" class="min-max-step-container"> <form> <mat-form-field> <input matInput class="form-control" type="number" inputmode="numeric" name="min-value" step="0.01" [placeholder]="uitextValeurMini" [(ngModel)]="param.minValue" #min="ngModel" name="min" [appJalhydModelValidationMin]="param" required pattern="^-?([0-9]*\.)?([0-9]+[Ee]-?)?[0-9]+$"> <mat-error *ngIf="min.errors"> <div *ngIf="min.errors.required || min.errors.pattern"> {{ uitextMustBeANumber }} </div> <div *ngIf="! min.errors.required && min.errors.jalhydModelMin"> {{ min.errors.jalhydModelMin.message }} </div> </mat-error> </mat-form-field> <mat-form-field> <input matInput class="form-control" type="number" inputmode="numeric" name="max-value" step="0.01" [placeholder]="uitextValeurMaxi" [(ngModel)]="param.maxValue" #max="ngModel" name="max" [appJalhydModelValidationMax]="param" required pattern="^-?([0-9]*\.)?([0-9]+[Ee]-?)?[0-9]+$"> <mat-error *ngIf="max.errors"> <div *ngIf="max.errors.required || max.errors.pattern"> {{ uitextMustBeANumber }} </div> <div *ngIf="! max.errors.required && max.errors.jalhydModelMax"> {{ max.errors.jalhydModelMax.message }} </div> </mat-error> </mat-form-field> <mat-form-field> <input matInput class="form-control" type="number" inputmode="numeric" name="step-value" step="0.01" [placeholder]="uitextPasVariation" [(ngModel)]="param.stepValue" #step="ngModel" name="step" [appJalhydModelValidationStep]="param" required pattern="^-?([0-9]*\.)?([0-9]+[Ee]-?)?[0-9]+$"> <mat-error *ngIf="step.errors"> <div *ngIf="step.errors.required || step.errors.pattern"> {{ uitextMustBeANumber }} </div> <div *ngIf="! step.errors.required && step.errors.jalhydModelStep"> {{ step.errors.jalhydModelStep.message }} </div> </mat-error> </mat-form-field> </form> </div> <div *ngIf="isListe"> <form [formGroup]="valuesListForm"> <mat-form-field> <textarea matInput matTextareaAutosize [placeholder]="uitextListeValeurs" formControlName="valuesList" [value]="valuesList"></textarea> <!-- (input)="valuesList = $event.target.value" --> <mat-error> <span *ngIf="valuesListForm.controls.valuesList.hasError('model')"> {{ valuesListForm.controls.valuesList.errors.model }} </span> <span *ngIf="! valuesListForm.controls.valuesList.hasError('model')"> {{ uitextMustBeListOfNumbers }} </span> </mat-error> </mat-form-field> <div class="decimal-separator-and-file-container" fxLayout="row wrap" fxLayoutAlign="space-between start"> <mat-form-field class="decimal-separator" fxFlex.gt-xs="1 0 auto" fxFlex.lt-sm="1 0 100%"> <mat-select [placeholder]="uitextDecimalSeparator" [(value)]="decimalSeparator" data-testid="decimal-separator-select"> <mat-option *ngFor="let e of decimalSeparators" [value]="e.value"> {{ e.label }} </mat-option> </mat-select> </mat-form-field> <div fxHide.xs fxFlex.gt-xs="0 0 16px"></div> <mat-form-field class="values-file file-input-field" fxFlex.gt-xs="1 0 auto" fxFlex.lt-sm="1 0 100%"> <ngx-mat-file-input #valuesFile [placeholder]="uitextImportFile" (change)="onFileSelected($event)" formControlName="file"> </ngx-mat-file-input> <button mat-icon-button matSuffix *ngIf="!valuesFile.empty" (click)="valuesFile.clear($event)"> <mat-icon>clear</mat-icon> </button> </mat-form-field> </div> </form> </div> </div> <div mat-dialog-actions> <div *ngIf="isMinMax"> <button mat-raised-button [mat-dialog-close]="true" cdkFocusInitial> {{ uitextClose }} </button> </div> <div *ngIf="isListe"> <button mat-raised-button color="primary" [mat-dialog-close]="true" cdkFocusInitial> {{ uitextCancel }} </button> <button mat-raised-button color="warn" (click)="onValidate()"> {{ uitextValidate }} </button> </div> </div>