[Library | Trunk]: Add Notifications on Users page actions. Change loading full background to white

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@59975 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou 2020-11-26 16:13:52 +00:00
parent 8d4198caca
commit 06bec851f5
3 changed files with 33 additions and 17 deletions

View File

@ -1,11 +1,5 @@
<div page-content> <div page-content>
<div header> <div header>
<div *ngIf="error" class="uk-alert uk-alert-danger uk-flex uk-flex-top">
<span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>
<div>
{{error}}
</div>
</div>
<ng-content></ng-content> <ng-content></ng-content>
<div class="uk-grid uk-flex uk-flex-middle" uk-grid> <div class="uk-grid uk-flex uk-flex-middle" uk-grid>
<div class="uk-width-expand uk-flex uk-flex-left@m uk-flex-center"> <div class="uk-width-expand uk-flex uk-flex-left@m uk-flex-center">

View File

@ -10,6 +10,7 @@ import {UserManagementService} from "../../../services/user-management.service";
import {Router} from "@angular/router"; import {Router} from "@angular/router";
import {LoginErrorCodes} from "../../../login/utils/guardHelper.class"; import {LoginErrorCodes} from "../../../login/utils/guardHelper.class";
import {Composer} from "../../../utils/email/composer"; import {Composer} from "../../../utils/email/composer";
import {StringUtils} from "../../../utils/string-utils.class";
declare var UIkit; declare var UIkit;
@ -39,7 +40,6 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
public subs: any[] = []; public subs: any[] = [];
public loadActive: boolean = true; public loadActive: boolean = true;
public loadPending: boolean = true; public loadPending: boolean = true;
public error: string;
public selectedUser: string = null; public selectedUser: string = null;
public invited: FormControl; public invited: FormControl;
public properties: EnvProperties = properties; public properties: EnvProperties = properties;
@ -97,7 +97,6 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
this.active = []; this.active = [];
if(error.status === 404) { if(error.status === 404) {
this.exists = false; this.exists = false;
} else {
} }
this.loadActive = false; this.loadActive = false;
})); }));
@ -106,8 +105,7 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
this.loadPending = false; this.loadPending = false;
}, error => { }, error => {
this.active = []; this.active = [];
this.error = error.error.response; this.loadPending = false;
this.loadActive = false;
})); }));
} }
@ -150,10 +148,18 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
this.userRegistryService.remove(this.type, this.id, this.selectedUser, this.role).subscribe(() => { this.userRegistryService.remove(this.type, this.id, this.selectedUser, this.role).subscribe(() => {
this.active = this.active.filter(user => user.email != this.selectedUser); this.active = this.active.filter(user => user.email != this.selectedUser);
this.userManagementService.updateUserInfo(); this.userManagementService.updateUserInfo();
UIkit.notification(this.selectedUser + ' is no longer ' + this.role + ' of ' + this.name + ' Dashboard', {
status: 'success',
timeout: 3000,
pos: 'top-left'
});
this.loadActive = false; this.loadActive = false;
this.error = null;
}, error => { }, error => {
this.error = error.error.response; UIkit.notification('An error has occurred. Please try again later', {
status: 'danger',
timeout: 3000,
pos: 'top-left'
});
this.loadActive = false; this.loadActive = false;
}); });
} }
@ -162,10 +168,18 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
this.loadPending = true; this.loadPending = true;
this.userRegistryService.cancelInvitation(this.type, this.id, this.selectedUser, this.role).subscribe(() => { this.userRegistryService.cancelInvitation(this.type, this.id, this.selectedUser, this.role).subscribe(() => {
this.pending = this.pending.filter(user => user != this.selectedUser); this.pending = this.pending.filter(user => user != this.selectedUser);
this.error = null; UIkit.notification(StringUtils.capitalize(this.role) + ' invitation to ' + this.selectedUser + ' has been canceled', {
status: 'success',
timeout: 3000,
pos: 'top-left'
});
this.loadPending = false; this.loadPending = false;
}, error => { }, error => {
this.error = error.error.response; UIkit.notification('An error has occurred. Please try again later', {
status: 'danger',
timeout: 3000,
pos: 'top-left'
});
this.loadPending = false; this.loadPending = false;
}); });
} }
@ -178,13 +192,21 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
email: Composer.composeEmailForMonitorDashboard(this.name, this.invited.value, this.role) email: Composer.composeEmailForMonitorDashboard(this.name, this.invited.value, this.role)
} }
this.userRegistryService.invite(this.type, this.id, details, this.role).subscribe(() => { this.userRegistryService.invite(this.type, this.id, details, this.role).subscribe(() => {
this.error = null;
if (!this.pending.includes(this.invited.value)) { if (!this.pending.includes(this.invited.value)) {
this.pending.push(this.invited.value); this.pending.push(this.invited.value);
} }
UIkit.notification(StringUtils.capitalize(this.role) + ' invitation to ' + this.selectedUser + ' has been sent', {
status: 'success',
timeout: 3000,
pos: 'top-left'
});
this.loadPending = false; this.loadPending = false;
}, error => { }, error => {
this.error = error.error.response; UIkit.notification('An error has occurred. Please try again later', {
status: 'danger',
timeout: 3000,
pos: 'top-left'
});
this.loadActive = false; this.loadActive = false;
}) })
} }

View File

@ -4,7 +4,7 @@ import {Component, Input} from "@angular/core";
selector: 'loading', selector: 'loading',
template: ` template: `
<ng-template [ngIf]="full" [ngIfElse]="loading"> <ng-template [ngIf]="full" [ngIfElse]="loading">
<div class="uk-position-relative" style="height: 100vh; width: 99vw; z-index: 1000; background-color: var(--background-color)"> <div class="uk-position-relative" style="height: 100vh; width: 99vw; z-index: 1000; background-color: white">
<div class="uk-position-center"> <div class="uk-position-center">
<ng-container [ngTemplateOutlet]="loading"></ng-container> <ng-container [ngTemplateOutlet]="loading"></ng-container>
</div> </div>