Code development platform for open source projects from the European Union institutions

Skip to content
Snippets Groups Projects
Commit 74219b31 authored by Sebastian-Ion TINCU's avatar Sebastian-Ion TINCU
Browse files

Pull request #150: Bugfix/EDELIVERY-11674 alerts ui improvements 

Merge in EDELIVERY/smp from bugfix/EDELIVERY-11674-alerts-ui-improvements to development

* commit 'ff7459ae':
  EDELIVERY-11674 - Alerts UI Improvements
  EDELIVERY-11674 - Alerts UI Improvements
  EDELIVERY-11674 - Alerts UI Improvements
parents 165d2cf3 ff7459ae
No related branches found
No related tags found
No related merge requests found
Pipeline #210020 failed
Hide whitespace changes
Inline Side-by-side
Showing
with 90 additions and 70 deletions
smp-angular/src/app/app.module.ts
+ 2
− 0
View file @ 74219b31
......@@ -28,6 +28,7 @@ import {CredentialDialogComponent} from "./common/dialogs/credential-dialog/cred
import {DataPanelComponent} from "./common/panels/data-panel/data-panel.component";
import {DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE, MatNativeDateModule} from "@angular/material/core";
import {DatePipe} from './custom-date/date.pipe';
import {DatePipe as AngularDatePipe} from '@angular/common';
import {DefaultPasswordDialogComponent} from './security/default-password-dialog/default-password-dialog.component';
import {DialogComponent} from './common/dialogs/dialog/dialog.component';
import {DomainPanelComponent} from "./system-settings/admin-domain/domain-panel/domain-panel.component";
......@@ -350,6 +351,7 @@ import {MatButtonToggleModule} from "@angular/material/button-toggle";
AuthorizedGuard,
CertificateService,
DatePipe,
AngularDatePipe,
DnsToolsService,
DomainService,
DownloadService,
......
smp-angular/src/app/common/dialogs/object-properties-dialog/object-properties-dialog.component.html
+ 1
− 1
View file @ 74219b31
......@@ -5,7 +5,7 @@
<!-- Name Column -->
<ng-container matColumnDef="key">
<th mat-header-cell *matHeaderCellDef>{{ "object.properties.dialog.header.key" | translate }}</th>
<td mat-cell *matCellDef="let element">{{element[0] | titlecase }}</td>
<td mat-cell *matCellDef="let element">{{element[0] | translate | titlecase }}</td>
</ng-container>
<!-- Weight Column -->
......
smp-angular/src/app/common/dialogs/object-properties-dialog/object-properties-dialog.component.ts
+ 16
− 14
View file @ 74219b31
import {Component, Inject} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material/dialog';
import {TranslateService} from "@ngx-translate/core";
import {DatePipe} from "@angular/common";
import {GlobalLookups} from "../../global-lookups";
@Component({
selector: 'object-properties-dialog',
......@@ -9,24 +12,23 @@ import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material/dialog';
export class ObjectPropertiesDialogComponent {
title: string = "Object properties";
object:Object
displayedColumns: string[] = ['key', 'value'];
dataSource : object[];
dataSource: object[];
constructor(public dialogRef: MatDialogRef<ObjectPropertiesDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any) {
this.title = data.title;
this.object = {...data.object.row.alertDetails,
statusDescription: data.object.row.alertStatusDesc};
this.dataSource = Object.keys(this.object)
.map((key) => [ this.toTitleCase(key), this.object[key] ])
.sort();
@Inject(MAT_DIALOG_DATA) public data: any,
private translateService: TranslateService,
private datePipe: DatePipe,
private lookups: GlobalLookups) {
this.translateService.get(data.i18n).subscribe(title => this.title = title);
this.dataSource = data.object.map(row => [row.i18n, this.parseValue(row)]);
}
private toTitleCase(input: string): string {
return input
.replace(/([A-Z]+)/g, " $1") // camelCase -> Title Case (part #1)
.replace(/([A-Z][a-z])/g, " $1") // camelCase -> Title Case (part #2)
.replaceAll('_', '');
private parseValue(row) {
if (row.type === "dateTime") {
let dateTimeFormat = this.lookups.getDateTimeFormat();
return this.datePipe.transform(row.value, dateTimeFormat);
}
return row.value;
}
}
smp-angular/src/app/common/panels/alert-panel/alert-controller.ts
+ 28
− 9
View file @ 74219b31
......@@ -6,7 +6,8 @@ import {ObjectPropertiesDialogComponent} from "../../dialogs/object-properties-d
export class AlertController implements SearchTableController {
constructor(protected lookups: GlobalLookups, public dialog: MatDialog) {
constructor(protected lookups: GlobalLookups,
public dialog: MatDialog) {
}
validateDeleteOperation(rows: SearchTableEntity[]) {
......@@ -32,19 +33,37 @@ export class AlertController implements SearchTableController {
public showDetails(row: any): MatDialogRef<any> {
return this.dialog.open(ObjectPropertiesDialogComponent, {
data: {
title: "Alert details",
object: row,
i18n: "alert.panel.dialog.title.alert.details",
object: [{
i18n: "alert.panel.label.column.alert.date",
value: row.row?.reportingTime,
type: "dateTime"
}, {
i18n: "alert.panel.label.column.alert.level",
value: row.row?.alertLevel
}, {
i18n: "alert.panel.label.column.for.user",
value: row.row?.username
}, {
i18n: "alert.panel.label.column.credential.type",
value: row.row?.alertDetails['CREDENTIAL_TYPE']
}, {
i18n: "alert.panel.label.column.alert.type",
value: row.row?.alertType,
}, {
i18n: "alert.panel.label.column.alert.status",
value: row.row?.alertStatus,
}, {
i18n: "alert.panel.label.column.status.description",
value: row.row?.alertStatusDesc,
}]
}
});
}
public edit(row: any): MatDialogRef<any> {
return this.dialog.open(ObjectPropertiesDialogComponent, {
data: {
title: "Update Alert",
object: row,
}
});
// not actually editing the row
return this.showDetails(row);
}
public delete(row: any) {
......
smp-angular/src/app/common/panels/alert-panel/alert-panel.component.ts
+ 19
− 30
View file @ 74219b31
......@@ -17,9 +17,8 @@ import {HttpClient} from '@angular/common/http';
import {GlobalLookups} from "../../global-lookups";
import {SearchTableComponent} from "../../search-table/search-table.component";
import {SecurityService} from "../../../security/security.service";
import {
ObjectPropertiesDialogComponent
} from "../../dialogs/object-properties-dialog/object-properties-dialog.component";
import {TranslateService} from "@ngx-translate/core";
import {lastValueFrom} from "rxjs";
/**
* This is a generic alert panel component for previewing alert list
......@@ -49,7 +48,8 @@ export class AlertPanelComponent implements OnInit, AfterViewInit, AfterViewChec
protected http: HttpClient,
protected alertService: AlertMessageService,
public dialog: MatDialog,
private changeDetector: ChangeDetectorRef) {
private changeDetector: ChangeDetectorRef,
private translateService: TranslateService) {
}
ngOnInit() {
......@@ -60,57 +60,57 @@ export class AlertPanelComponent implements OnInit, AfterViewInit, AfterViewChec
this.changeDetector.detectChanges();
}
initColumns() {
async initColumns() {
this.columnPicker.allColumns = [
{
name: 'Alert date',
title: "Alert date",
name: await lastValueFrom(this.translateService.get("alert.panel.label.column.alert.date")),
title: await lastValueFrom(this.translateService.get("alert.panel.label.column.title.alert.date")),
prop: 'reportingTime',
showInitially: true,
maxWidth: 250,
cellTemplate: this.dateTimeColumn,
},
{
name: 'Alert level',
title: "Alert level.",
name: await lastValueFrom(this.translateService.get("alert.panel.label.column.alert.level")),
title: await lastValueFrom(this.translateService.get("alert.panel.label.column.title.alert.level")),
prop: 'alertLevel',
showInitially: true,
maxWidth: 100,
},
{
name: 'For User',
title: "For User",
name: await lastValueFrom(this.translateService.get("alert.panel.label.column.for.user")),
title: await lastValueFrom(this.translateService.get("alert.panel.label.column.title.for.user")),
prop: 'username',
cellTemplate: this.forUser,
maxWidth: 200,
showInitially: true,
},
{
name: 'Credential type',
title: "Credential type.",
name: await lastValueFrom(this.translateService.get("alert.panel.label.column.credential.type")),
title: await lastValueFrom(this.translateService.get("alert.panel.label.column.title.credential.type")),
prop: 'alertDetails',
maxWidth: 200,
cellTemplate: this.credentialType,
showInitially: true,
},
{
name: 'Alert type',
title: "Alert type.",
name: await lastValueFrom(this.translateService.get("alert.panel.label.column.alert.type")),
title: await lastValueFrom(this.translateService.get("alert.panel.label.column.title.alert.type")),
prop: 'alertType',
cellTemplate: this.truncateText,
showInitially: true,
},
{
name: 'Alert status',
title: "Alert status.",
name: await lastValueFrom(this.translateService.get("alert.panel.label.column.alert.status")),
title: await lastValueFrom(this.translateService.get("alert.panel.label.column.title.alert.status")),
prop: 'alertStatus',
showInitially: true,
maxWidth: 100,
},
{
name: 'Status desc.',
title: "Status desc.",
name: await lastValueFrom(this.translateService.get("alert.panel.label.column.status.description")),
title: await lastValueFrom(this.translateService.get("alert.panel.label.column.title.status.description")),
prop: 'alertStatusDesc',
cellTemplate: this.truncateText,
showInitially: true,
......@@ -125,17 +125,6 @@ export class AlertPanelComponent implements OnInit, AfterViewInit, AfterViewChec
this.initColumns();
}
details(row: any) {
this.dialog.open(ObjectPropertiesDialogComponent, {
data: {
title: "Alert details",
object: row.alertDetails,
}
});
}
// for dirty guard...
isDirty(): boolean {
return this.searchTable.isDirty();
......
smp-angular/src/app/common/panels/review-tasks-panel/review-tasks-controller.ts
+ 1
− 6
View file @ 74219b31
......@@ -34,12 +34,7 @@ export class ReviewTasksController implements SearchTableController {
}
public showDetails(row: any): MatDialogRef<any> {
return this.dialog.open(ObjectPropertiesDialogComponent, {
data: {
title: "Review tasks details",
object: row,
}
});
return null;
}
public edit(row: any): MatDialogRef<any> {
......
smp-angular/src/app/common/panels/review-tasks-panel/review-tasks-panel.component.ts
+ 3
− 9
View file @ 74219b31
......@@ -77,8 +77,8 @@ export class ReviewTasksPanelComponent implements OnInit, AfterViewInit, AfterVi
async initColumns() {
this.columnPicker.allColumns = [
{
name: 'Review date',
title: "Review date",
name: await lastValueFrom(this.translateService.get("review.edit.panel.label.column.review.date")),
title: await lastValueFrom(this.translateService.get("review.edit.panel.label.column.title.review.date")),
prop: 'lastUpdatedOn',
showInitially: true,
maxWidth: 200,
......@@ -124,9 +124,6 @@ export class ReviewTasksPanelComponent implements OnInit, AfterViewInit, AfterVi
resizable: 'true',
showInitially: true,
},
];
this.columnPicker.selectedColumns = this.columnPicker.allColumns.filter(col => col.showInitially);
this.searchTable.tableColumnInit();
......@@ -136,7 +133,6 @@ export class ReviewTasksPanelComponent implements OnInit, AfterViewInit, AfterVi
this.initColumns();
}
details(row: any) {
}
......@@ -152,10 +148,9 @@ export class ReviewTasksPanelComponent implements OnInit, AfterViewInit, AfterVi
async onRowDoubleClicked(row: ReviewDocumentVersionRo) {
// set selected resource
this.editResourceService.selectedReviewDocument = row;
let node: NavigationNode = await this.createNewReviewDocumentNavigationNode();
let node = await this.createNewReviewDocumentNavigationNode();
this.navigationService.selected.children = [node]
this.navigationService.select(node);
}
public async createNewReviewDocumentNavigationNode() {
......@@ -171,4 +166,3 @@ export class ReviewTasksPanelComponent implements OnInit, AfterViewInit, AfterVi
}
}
}
smp-angular/src/assets/i18n/en.json
+ 20
− 1
View file @ 74219b31
......@@ -94,8 +94,24 @@
"session.expiration.dialog.title": "Extend session",
"session.expiration.dialog.label.session.about.to.expire": "Your session is about to expire in <b>{{timeLeft}}</b> seconds!<br />Would you like to logout now or extend it<br /> for another <b>{{timeoutMinutes}}</b> minute(s) and <b>{{timeoutSeconds}}</b> second(s)?",
"session.alert.message.logout.expired": "Your session has expired, and you have been logged out.",
"alert.panel.title": "Alerts",
"alert.panel.dialog.title.alert.details": "Alert details",
"alert.panel.label.column.alert.date": "Alert date",
"alert.panel.label.column.alert.level": "Alert level",
"alert.panel.label.column.alert.status": "Alert status",
"alert.panel.label.column.alert.type": "Alert type",
"alert.panel.label.column.credential.type": "Credential type",
"alert.panel.label.column.for.user": "For User",
"alert.panel.label.column.status.description": "Status desc.",
"alert.panel.label.column.title.alert.date": "Alert date",
"alert.panel.label.column.title.alert.level": "Alert level.",
"alert.panel.label.column.title.alert.status": "Alert status.",
"alert.panel.label.column.title.alert.type": "Alert type.",
"alert.panel.label.column.title.credential.type": "Credential type.",
"alert.panel.label.column.title.for.user": "For User",
"alert.panel.label.column.title.status.description": "Status desc.",
"alert.panel.user.title": "{{value}} (Email: '{{mailTo}}')",
"alert.panel.title": "Alerts",
"certificate.panel.title": "Selected certificate data",
"certificate.panel.label.alias": "Alias",
"certificate.panel.label.crl": "Certificate revocation list URL",
......@@ -440,6 +456,7 @@
"reference.document.dialog.label.select.page": "Page",
"reference.document.dialog.button.reset": "Reset",
"review.edit.dialog.title": "Review tasks details",
"review.edit.panel.label.review": "Review",
"review.edit.panel.label.column.date": "Review date",
"review.edit.panel.label.column.version": "Version",
......@@ -448,6 +465,8 @@
"review.edit.panel.label.column.resource.value": "Res. value",
"review.edit.panel.label.column.subresource.scheme": "Subr. scheme",
"review.edit.panel.label.column.subresource.value": "Subr. value",
"review.edit.panel.label.column.review.date": "Review date",
"review.edit.panel.label.column.title.review.date": "Review date",
"subresource.document.wizard.button.cancel": "Cancel",
"subresource.document.wizard.button.ok": "OK",
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

For further information about the platform and support, please see https://code.europa.eu/info/about