From 67c9631e6915fb4f7214389c530d6567b7d8b3ad Mon Sep 17 00:00:00 2001
From: paf <paf@titelfrei.de>
Date: Mon, 4 Jan 2021 11:43:55 +0100
Subject: [PATCH] nicer fileValididationReport-Display
---
src/app/shared/alert/alert.component.ts | 16 ++++++++++++++++
src/app/shared/alert/alert.module.ts | 11 +++++++++++
.../workspace-admin/files/files.component.css | 2 +-
.../workspace-admin/files/files.component.html | 2 +-
src/app/workspace-admin/workspace.module.ts | 4 +++-
5 files changed, 32 insertions(+), 3 deletions(-)
create mode 100644 src/app/shared/alert/alert.component.ts
create mode 100644 src/app/shared/alert/alert.module.ts
diff --git a/src/app/shared/alert/alert.component.ts b/src/app/shared/alert/alert.component.ts
new file mode 100644
index 00000000..c4600567
--- /dev/null
+++ b/src/app/shared/alert/alert.component.ts
@@ -0,0 +1,16 @@
+import { Component, Input, ViewEncapsulation } from '@angular/core';
+
+@Component({
+ selector: 'alert',
+ template: '<span [innerHTML]="transform(text)"></span>',
+ styles: ['.highlight {color: #003333}'],
+ encapsulation: ViewEncapsulation.None
+})
+export class AlertComponent {
+ @Input() text: string;
+
+ transform = (text: string): string => text.replace(
+ /\u0060([^\u0060]+)\u0060/g,
+ (match, match2) => `<span style='color:green' class='highlight'>${match2}</span>`
+ );
+}
diff --git a/src/app/shared/alert/alert.module.ts b/src/app/shared/alert/alert.module.ts
new file mode 100644
index 00000000..6c18d2f2
--- /dev/null
+++ b/src/app/shared/alert/alert.module.ts
@@ -0,0 +1,11 @@
+import { NgModule } from '@angular/core';
+import { AlertComponent } from './alert.component';
+
+@NgModule({
+ imports: [],
+ exports: [
+ AlertComponent
+ ],
+ declarations: [AlertComponent]
+})
+export class AlertModule { }
diff --git a/src/app/workspace-admin/files/files.component.css b/src/app/workspace-admin/files/files.component.css
index 4f8eb512..541eef91 100644
--- a/src/app/workspace-admin/files/files.component.css
+++ b/src/app/workspace-admin/files/files.component.css
@@ -36,7 +36,7 @@
.report-error,
.checkerror {
- color: brown;
+ color: #821324;
}
.report-warning,
diff --git a/src/app/workspace-admin/files/files.component.html b/src/app/workspace-admin/files/files.component.html
index 060a242c..7a1746ed 100644
--- a/src/app/workspace-admin/files/files.component.html
+++ b/src/app/workspace-admin/files/files.component.html
@@ -38,7 +38,7 @@
<div *ngFor="let message of element.report[level]">
<div class="vertical-align-middle">
<mat-icon class="report-{{level}}">{{level}}</mat-icon>
- <span>{{message}}</span>
+ <alert text="{{message}}"></alert>
</div>
</div>
</ng-container>
diff --git a/src/app/workspace-admin/workspace.module.ts b/src/app/workspace-admin/workspace.module.ts
index 8f5ed6a8..591c3ac1 100644
--- a/src/app/workspace-admin/workspace.module.ts
+++ b/src/app/workspace-admin/workspace.module.ts
@@ -29,6 +29,7 @@ import { FilesComponent } from './files/files.component';
import { ResultsComponent } from './results/results.component';
import { SyscheckComponent } from './syscheck/syscheck.component';
import { IqbFilesModule } from './files/iqb-files';
+import { AlertModule } from '../shared/alert/alert.module';
@NgModule({
imports: [
@@ -55,7 +56,8 @@ import { IqbFilesModule } from './files/iqb-files';
IqbComponentsModule,
MatCardModule,
FlexLayoutModule,
- IqbFilesModule
+ IqbFilesModule,
+ AlertModule
],
exports: [
WorkspaceComponent
--
GitLab