From c34f226a823c58245a8a46a7b05928fb8ab08ecd Mon Sep 17 00:00:00 2001
From: "francois.grand" <francois.grand@irstea.fr>
Date: Mon, 12 Feb 2018 09:08:11 +0100
Subject: [PATCH] =?UTF-8?q?=20#64=20:=20ajout=20d'un=20composant=20LogEntr?=
=?UTF-8?q?yComponent=20pour=20g=C3=A9rer=20les=20entr=C3=A9es=20du=20jour?=
=?UTF-8?q?nal?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app/app.module.ts | 3 +-
.../log-entry/log-entry.component.html | 11 ++++
.../log-entry/log-entry.component.ts | 62 +++++++++++++++++++
src/app/components/log/log.component.html | 10 +--
src/app/components/log/log.component.ts | 23 ++-----
5 files changed, 85 insertions(+), 24 deletions(-)
create mode 100644 src/app/components/log-entry/log-entry.component.html
create mode 100644 src/app/components/log-entry/log-entry.component.ts
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 425e3c056..b73ea0bc2 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -41,6 +41,7 @@ import { CalculatorListComponent } from './components/calculator-list/calculator
import { ApplicationSetupComponent } from './components/app-setup/app-setup.component';
import { BaseParamInputComponent } from './components/base-param-input/base-param-input.component';
import { SingleResultComponent } from './components/single-result/single-result.component';
+import { LogEntryComponent } from './components/log-entry/log-entry.component';
const appRoutes: Routes = [
{ path: 'list', component: CalculatorListComponent },
@@ -73,7 +74,7 @@ const appRoutes: Routes = [
ParamFieldLineComponent, NgParamMinComponent, NgParamMaxComponent, NgParamStepComponent,
ParamValuesComponent, ValueListComponent,
SelectFieldLineComponent, CheckFieldLineComponent,
- LogComponent,
+ LogComponent, LogEntryComponent,
CalculatorListComponent,
ApplicationSetupComponent,
BaseParamInputComponent,
diff --git a/src/app/components/log-entry/log-entry.component.html b/src/app/components/log-entry/log-entry.component.html
new file mode 100644
index 000000000..b60382953
--- /dev/null
+++ b/src/app/components/log-entry/log-entry.component.html
@@ -0,0 +1,11 @@
+<div class="row entry">
+ <div class="col-1" style="text-align: center;">
+ <i *ngIf="levelInfo" class="fa fa-check" style="color:green"></i>
+ <i *ngIf="levelWarning" class="fa fa-exclamation" style="color:orange"></i>
+ <i *ngIf="levelError" class="fa fa-exclamation-triangle" style="color:red"></i>
+ </div>
+ <div class="col-11">
+ <!-- on utilise [innerHTML] pour que les codes HTML comme soient interprÊtÊs correctement -->
+ <span [innerHTML]="text"></span>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/components/log-entry/log-entry.component.ts b/src/app/components/log-entry/log-entry.component.ts
new file mode 100644
index 000000000..effa2e57a
--- /dev/null
+++ b/src/app/components/log-entry/log-entry.component.ts
@@ -0,0 +1,62 @@
+import { Component, Input, OnChanges } from "@angular/core";
+
+import { Message, MessageSeverity } from 'jalhyd';
+
+import { InternationalisationService } from "../../services/internationalisation/internationalisation.service";
+import { ApplicationSetupService } from '../../services/app-setup/app-setup.service';
+
+@Component({
+ selector: "log-entry",
+ templateUrl: "./log-entry.component.html",
+ styles: [`
+ .entry {
+ margin-left: 1em;
+ margin-right: 1em;
+ margin-top: 0.5em;
+ margin-bottom: 0.5em;
+ }
+ `]
+
+})
+export class LogEntryComponent implements OnChanges {
+ @Input("message")
+ private _message: Message;
+
+ /**
+ * message mis en forme
+ */
+ private _text: string;
+
+ constructor(
+ private intlService: InternationalisationService,
+ private appSetupService: ApplicationSetupService
+ ) { }
+
+ /**
+ * appelÊ quand les @Input changent
+ */
+ ngOnChanges() {
+ this.updateText();
+ }
+
+ private updateText() {
+ const nDigits = this.appSetupService.displayDigits;
+ this._text = this.intlService.localizeMessage(this._message, nDigits);
+ }
+
+ private get text(): string {
+ return this._text;
+ }
+
+ private get levelInfo(): boolean {
+ return this._message.getSeverity() == MessageSeverity.INFO;
+ }
+
+ private get levelWarning(): boolean {
+ return this._message.getSeverity() == MessageSeverity.WARNING;
+ }
+
+ private get levelError(): boolean {
+ return this._message.getSeverity() == MessageSeverity.ERROR;
+ }
+}
diff --git a/src/app/components/log/log.component.html b/src/app/components/log/log.component.html
index 90fd45727..37ecc7a8e 100644
--- a/src/app/components/log/log.component.html
+++ b/src/app/components/log/log.component.html
@@ -1,11 +1,13 @@
<div class="row" *ngIf="hasEntries">
<div class="col-12">
<div class="hyd_log">
+ <!-- titre -->
<div class="titre">{{uitextTitreJournal}}</div>
- <ul *ngFor="let r of _logEntries">
- <!-- on utilise [innerHTML] pour que les codes HTML comme soient interprÊtÊs correctement -->
- <li [innerHTML]="r"></li>
- </ul>
+
+ <!-- entrÊes du journal -->
+ <ng-template ngFor let-m [ngForOf]="messages">
+ <log-entry [message]=m></log-entry>
+ </ng-template>
</div>
</div>
</div>
\ No newline at end of file
diff --git a/src/app/components/log/log.component.ts b/src/app/components/log/log.component.ts
index 43fb04717..93d567509 100644
--- a/src/app/components/log/log.component.ts
+++ b/src/app/components/log/log.component.ts
@@ -1,11 +1,8 @@
import { Component } from "@angular/core";
-import { Message, cLog } from 'jalhyd';
+import { cLog, Message } from 'jalhyd';
-import { NgParameter } from "../../formulaire/ngparam";
import { InternationalisationService } from "../../services/internationalisation/internationalisation.service";
-import { ApplicationSetupService } from '../../services/app-setup/app-setup.service';
-
@Component({
selector: "log",
@@ -37,14 +34,8 @@ export class LogComponent {
*/
private _log: cLog;
- /**
- * entrÊes du journal mises en forme
- */
- private _logEntries: string[];
-
constructor(
private intlService: InternationalisationService,
- private appSetupService: ApplicationSetupService
) { }
private get uitextTitreJournal() {
@@ -52,20 +43,14 @@ export class LogComponent {
}
private get hasEntries(): boolean {
- return this._logEntries != undefined && this._logEntries.length != 0;
+ return this._log != undefined && this._log.messages.length != 0;
}
- private generateEntries() {
- this._logEntries = [];
- if (this._log != undefined) {
- const nDigits = this.appSetupService.displayDigits;
- for (let m of this._log.messages)
- this._logEntries.push(this.intlService.localizeMessage(m, nDigits));
- }
+ private get messages(): Message[] {
+ return this._log.messages;
}
public set log(log: cLog) {
this._log = log;
- this.generateEntries();
}
}
--
GitLab