MaDgIK
/
monitor-dashboard
13
0
Fork 0
Code Issues Pull Requests Projects Releases 17 Wiki Activity

[Monitor Dashboard |Trunk] 

Admin and stakeholder page:
-update titles (use stakeholder.name)
-indicator description in the bottom


Admin: 
-rename stakeholder to profile
-update titles (use stakeholder.name)
-add name when there is no logo
-back button takes you to stakeholder page not /admin
-indicator description in the bottom
-Add sections for numbers is enabled only for administrators



git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor_dashboard@58990 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
Argiro Kokogiannaki 2020-06-25 08:10:42 +00:00
parent 286b82c01a
commit da5dbee3aa
10 changed files with 68 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/app.component.ts
View File

@ -136,7 +136,7 @@ export class AppComponent implements OnInit, OnDestroy {
}*/ }*/
if (Session.isPortalAdministrator(this.user) || Session.isMonitorCurator(this.user) || Session.isCommunityCurator(this.user)) { if (Session.isPortalAdministrator(this.user) || Session.isMonitorCurator(this.user) || Session.isCommunityCurator(this.user)) {
this.userMenuItems.push(new MenuItem("", "Manage Stakeholders", this.userMenuItems.push(new MenuItem("", "Manage profiles",
"", "/admin", true, [], [], {})) "", "/admin", true, [], [], {}))
} }
@ -145,7 +145,7 @@ export class AppComponent implements OnInit, OnDestroy {
} }
if (this.adminMenuItems.length == 0) { if (this.adminMenuItems.length == 0) {
//nstructor(id: string, name: string, route: string, items: Item[], icon, open: boolean) { //nstructor(id: string, name: string, route: string, items: Item[], icon, open: boolean) {
this.adminMenuItems.push(new MenuItem("stakeholders", "Manage Stakeholders", "", "/admin", false, [], [], {}, "<i class=\"material-icons md-24\">settings</i>")); this.adminMenuItems.push(new MenuItem("stakeholders", "Manage profiles", "", "/admin", false, [], [], {}, "<i class=\"material-icons md-24\">settings</i>"));
/*let adminOptions = new MenuItem("adminOptions", "Admin Options", "", "", false, [], [], {}) /*let adminOptions = new MenuItem("adminOptions", "Admin Options", "", "", false, [], [], {})
adminOptions.items.push(new MenuItem("pages", "Pages", "", "/pages", false, [], [], {})); adminOptions.items.push(new MenuItem("pages", "Pages", "", "/pages", false, [], [], {}));
adminOptions.items.push(new MenuItem("portals", "Portals", "", "/portals", false, [], [], {})); adminOptions.items.push(new MenuItem("portals", "Portals", "", "/portals", false, [], [], {}));

13
src/app/manageStakeholders/manageStakeholders.component.html
View File

@ -15,7 +15,7 @@
<div class="uk-width-expand@m uk-width-1-1 uk-flex uk-flex-middle uk-flex-right"> <div class="uk-width-expand@m uk-width-1-1 uk-flex uk-flex-middle uk-flex-right">
<div class="uk-inline uk-width-medium"> <div class="uk-inline uk-width-medium">
<span class="uk-position-center-right"><i class="material-icons">search</i></span> <span class="uk-position-center-right"><i class="material-icons">search</i></span>
<div dashboard-input [formInput]="filters.get('keyword')" label="Locate Stakeholder"></div> <div dashboard-input [formInput]="filters.get('keyword')" label="Locate profile"></div>
</div> </div>
<div [class.uk-active]="grid" class="uk-margin-small-left"> <div [class.uk-active]="grid" class="uk-margin-small-left">
<a [routerLink]="" class="uk-icon-button" (click)="changeGrid(true)"><i <a [routerLink]="" class="uk-icon-button" (click)="changeGrid(true)"><i
@ -96,13 +96,13 @@
[class.uk-flex]="!grid" [class.uk-flex]="!grid"
[class.uk-flex-center]="!grid"> [class.uk-flex-center]="!grid">
<i *ngIf="!grid" class="material-icons md-36">add</i> <i *ngIf="!grid" class="material-icons md-36">add</i>
<span>Create a Default Stakeholder</span> <span>Create a default profile</span>
</div> </div>
</div> </div>
<div *ngIf="grid" class="md-card-content"> <div *ngIf="grid" class="md-card-content">
<div uk-grid> <div uk-grid>
<div class="uk-width-1-1"> <div class="uk-width-1-1">
Create a new Stakeholder default profile. Create a new default profile.
</div> </div>
<div class="uk-width-1-1 uk-flex uk-flex-center"> <div class="uk-width-1-1 uk-flex uk-flex-center">
<i class="material-icons md-48">add</i> <i class="material-icons md-48">add</i>
@ -112,7 +112,7 @@
</div> </div>
</div> </div>
</div> </div>
<h4 class="uk-text-bold">Stakeholders</h4> <h4 class="uk-text-bold">Profiles</h4>
<div [class.uk-child-width-1-4@m]="grid" <div [class.uk-child-width-1-4@m]="grid"
[class.uk-child-width-1-3@s]="grid" [class.uk-child-width-1-3@s]="grid"
[class.uk-child-width-1-1]="!grid" [class.uk-child-width-1-1]="!grid"
@ -182,13 +182,14 @@
[class.uk-flex]="!grid" [class.uk-flex]="!grid"
[class.uk-flex-center]="!grid"> [class.uk-flex-center]="!grid">
<i *ngIf="!grid" class="material-icons md-36">add</i> <i *ngIf="!grid" class="material-icons md-36">add</i>
<span>Create a Stakeholder</span> <span>Create a profile</span>
</div> </div>
</div> </div>
<div *ngIf="grid" class="md-card-content"> <div *ngIf="grid" class="md-card-content">
<div uk-grid> <div uk-grid>
<div class="uk-width-1-1"> <div class="uk-width-1-1">
Create a new Stakeholder by selecting a default profile. Create a new profile by selecting the type (Funder, Organization, Research Initiative or Project) and
select indicators based on a default or a blank profile.
</div> </div>
<div class="uk-width-1-1 uk-flex uk-flex-center"> <div class="uk-width-1-1 uk-flex uk-flex-center">
<i class="material-icons md-48">add</i> <i class="material-icons md-48">add</i>

2
src/app/manageStakeholders/manageStakeholders.component.ts
View File

@ -67,7 +67,7 @@ export class ManageStakeholdersComponent implements OnInit, OnDestroy {
this.propertiesService.loadEnvironment() this.propertiesService.loadEnvironment()
.then(properties => { .then(properties => {
this.properties = properties; this.properties = properties;
this.title.setTitle('Manage Stakeholders'); this.title.setTitle('Manage profiles');
this.userManagementService.getUserInfo().subscribe(user => { this.userManagementService.getUserInfo().subscribe(user => {
this.user = user; this.user = user;
}); });

5
src/app/monitor/monitor.component.html
View File

@ -110,7 +110,7 @@
(activeCategory && activeCategory.description && activeCategory.description.length > 0) || (activeCategory && activeCategory.description && activeCategory.description.length > 0) ||
(activeTopic && activeTopic.description && activeTopic.description.length > 0))" (activeTopic && activeTopic.description && activeTopic.description.length > 0))"
class="uk-text-center"> class="uk-text-center">
<div class="uk-h5 uk-height-medium"> <div class="uk-h5 uk-height-small uk-margin-large-top">
{{activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0 ? activeSubCategory.description {{activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0 ? activeSubCategory.description
: (activeCategory && activeCategory.description && activeCategory.description.length > 0 ? activeCategory.description : : (activeCategory && activeCategory.description && activeCategory.description.length > 0 ? activeCategory.description :
(activeTopic.description && activeTopic.description.length > 0 ? activeTopic.description : ""))}} (activeTopic.description && activeTopic.description.length > 0 ? activeTopic.description : ""))}}
@ -174,7 +174,7 @@
<h4 class="uk-margin-bottom chartTitle uk-flex uk-flex-bottom "> <h4 class="uk-margin-bottom chartTitle uk-flex uk-flex-bottom ">
<div>{{indicator.name + " "}}</div> <div>{{indicator.name + " "}}</div>
</h4> </h4>
<div class="md-card" [attr.uk-tooltip]="indicator.description"> <div class="md-card" ><!--[attr.uk-tooltip]="indicator.description">-->
<div class="md-card-content uk-text-center"> <div class="md-card-content uk-text-center">
<div *ngIf="indicator.indicatorPaths.length > 1" class="uk-button-group"> <div *ngIf="indicator.indicatorPaths.length > 1" class="uk-button-group">
<button *ngFor="let indicatorPath of indicator.indicatorPaths;" <button *ngFor="let indicatorPath of indicator.indicatorPaths;"
@ -192,6 +192,7 @@
<img *ngIf="chartsActiveType.get(i + '-' + j).source === 'image'" <img *ngIf="chartsActiveType.get(i + '-' + j).source === 'image'"
[src]="chartsActiveType.get(i + '-' + j).safeResourceUrl" [src]="chartsActiveType.get(i + '-' + j).safeResourceUrl"
class="uk-width-1-1 uk-height-medium"> class="uk-width-1-1 uk-height-medium">
<div class="uk-text-small uk-text-muted">{{indicator.description}}</div>
</div> </div>
</div> </div>
</div> </div>

16
src/app/monitor/monitor.component.ts
View File

@ -1,4 +1,4 @@
import {ChangeDetectorRef, Component, OnDestroy, OnInit} from '@angular/core'; import {ChangeDetectorRef, Component, OnDestroy, OnInit, ViewRef} from '@angular/core';
import {ActivatedRoute, Params, Router} from '@angular/router'; import {ActivatedRoute, Params, Router} from '@angular/router';
import {DomSanitizer, Meta, Title} from '@angular/platform-browser'; import {DomSanitizer, Meta, Title} from '@angular/platform-browser';
import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties'; import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties';
@ -118,8 +118,8 @@ export class MonitorComponent implements OnInit, OnDestroy, IDeactivateComponent
if(stakeholder.isActive && (stakeholder.isPublic || this.isAdmin())) { if(stakeholder.isActive && (stakeholder.isPublic || this.isAdmin())) {
this.seoService.createLinkForCanonicalURL(url, false); this.seoService.createLinkForCanonicalURL(url, false);
this._meta.updateTag({content: url}, "property='og:url'"); this._meta.updateTag({content: url}, "property='og:url'");
var description = "Monitor Dashboard | " + this.stakeholder.index_name; var description = "Monitor Dashboard | " + this.stakeholder.name;
var title = "Monitor Dashboard | " + this.stakeholder.index_shortName; var title = "Monitor Dashboard | " + this.stakeholder.name;
this._meta.updateTag({content: description}, "name='description'"); this._meta.updateTag({content: description}, "name='description'");
this._meta.updateTag({content: description}, "property='og:description'"); this._meta.updateTag({content: description}, "property='og:description'");
this._meta.updateTag({content: title}, "property='og:title'"); this._meta.updateTag({content: title}, "property='og:title'");
@ -135,7 +135,9 @@ export class MonitorComponent implements OnInit, OnDestroy, IDeactivateComponent
} else { } else {
this.privateStakeholder = true; this.privateStakeholder = true;
// this.navigateToError(); // this.navigateToError();
subscription.unsubscribe(); if(subscription) {
subscription.unsubscribe();
}
} }
} }
}); });
@ -332,7 +334,9 @@ export class MonitorComponent implements OnInit, OnDestroy, IDeactivateComponent
} }
}); });
}); });
this.cdr.detectChanges(); if (this.cdr && !(this.cdr as ViewRef).destroyed) {
this.cdr.detectChanges();
}
} }
public getUrlByStakeHolder(indicatorPath: IndicatorPath) { public getUrlByStakeHolder(indicatorPath: IndicatorPath) {
@ -374,7 +378,7 @@ export class MonitorComponent implements OnInit, OnDestroy, IDeactivateComponent
// //
// } // }
if (this.user) { if (this.user) {
this.userMenuItems.push(new MenuItem("", "Manage Stakeholders", "", "/admin", false, [], [], {})); this.userMenuItems.push(new MenuItem("", "Manage profiles", "", "/admin", false, [], [], {}));
} }
if (this.user) { if (this.user) {
this.userMenuItems.push(new MenuItem("", "User information", "", "/user-info", false, [], [], {})); this.userMenuItems.push(new MenuItem("", "User information", "", "/user-info", false, [], [], {}));

4
src/app/stakeholder/stakeholder.component.html
View File

@ -6,12 +6,14 @@
<div class="uk-position-relative uk-display-inline-block uk-margin-small-top"> <div class="uk-position-relative uk-display-inline-block uk-margin-small-top">
<div *ngIf="!stakeholder.defaultId" class="uk-badge default">Default</div> <div *ngIf="!stakeholder.defaultId" class="uk-badge default">Default</div>
<img class="logo" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl"> <img class="logo" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl">
<div class="uk-margin-top" *ngIf="!stakeholder.logoUrl" >{{stakeholder.name}}</div>
</div> </div>
</div> </div>
<div *ngIf="stakeholder" class="menu_section"> <div *ngIf="stakeholder" class="menu_section">
<ul> <ul>
<li class="uk-margin-bottom md-bg-blue-900 uk-padding-small"> <li class="uk-margin-bottom md-bg-blue-900 uk-padding-small">
<a [routerLink]="'../'" class="md-color-white"> <a (click)="backClicked()" class="md-color-white">
<span class="menu_icon"><i class="material-icons md-color-white">arrow_back</i></span> <span class="menu_icon"><i class="material-icons md-color-white">arrow_back</i></span>
<div class="menu_title uk-width-expand uk-text-uppercase"> <div class="menu_title uk-width-expand uk-text-uppercase">
Back Back

34
src/app/stakeholder/stakeholder.component.ts
View File

@ -1,4 +1,5 @@
import {Component, OnDestroy, OnInit, ViewChild} from '@angular/core'; import {Component, OnDestroy, OnInit, ViewChild} from '@angular/core';
import {Location} from '@angular/common';
import {ActivatedRoute, Router} from '@angular/router'; import {ActivatedRoute, Router} from '@angular/router';
import {DomSanitizer, Title} from '@angular/platform-browser'; import {DomSanitizer, Title} from '@angular/platform-browser';
import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties'; import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties';
@ -43,7 +44,7 @@ export class StakeholderComponent implements OnInit, OnDestroy, IDeactivateCompo
private title: Title, private title: Title,
private layoutService: LayoutService, private layoutService: LayoutService,
private fb: FormBuilder, private fb: FormBuilder,
private stakeholderService: StakeholderService, private sanitizer: DomSanitizer) { private stakeholderService: StakeholderService, private sanitizer: DomSanitizer, private _location: Location) {
this.errorCodes = new ErrorCodes(); this.errorCodes = new ErrorCodes();
this.errorMessages = new ErrorMessagesComponent(); this.errorMessages = new ErrorMessagesComponent();
} }
@ -56,7 +57,7 @@ export class StakeholderComponent implements OnInit, OnDestroy, IDeactivateCompo
if (stakeholder) { if (stakeholder) {
this.stakeholder = HelperFunctions.copy(stakeholder); this.stakeholder = HelperFunctions.copy(stakeholder);
this.form = null; this.form = null;
this.title.setTitle(stakeholder.index_name); this.title.setTitle(stakeholder.name);
} }
})); }));
}); });
@ -64,7 +65,34 @@ export class StakeholderComponent implements OnInit, OnDestroy, IDeactivateCompo
public ngOnDestroy() { public ngOnDestroy() {
} }
backClicked() {
let prevRoute = localStorage.getItem('previousRoute');
// var referrer = "";
// if (typeof document !== 'undefined') {
// //console.log("document.referrer:" + document.referrer);
// referrer = document.referrer;
//
// }
// if((referrer == null || referrer.length == 0)&&typeof localStorage !== 'undefined'){
//
// referrer =localStorage.getItem('previousRoute');
// }
// prevRoute = referrer;
//
// if(prevRoute == "/"+this.stakeholder.alias ||prevRoute == "/admin"){
// this.router.navigate([prevRoute])
// }else{
prevRoute = "/"+this.stakeholder.alias;
// }
this.subscriptions.forEach(value => {
if (value instanceof Subscriber) {
value.unsubscribe();
}
});
this.router.navigate([prevRoute])
// this._location.back();
}
canExit():boolean { canExit():boolean {
this.subscriptions.forEach(value => { this.subscriptions.forEach(value => {
if (value instanceof Subscriber) { if (value instanceof Subscriber) {

17
src/app/topic/indicators.component.html
View File

@ -65,11 +65,11 @@
<h4 class="uk-text-bold">Number Indicators</h4> <h4 class="uk-text-bold">Number Indicators</h4>
<div *ngIf="numberSections"> <div *ngIf="numberSections">
<ng-template ngFor [ngForOf]="displayNumbers" let-number let-i="index"> <ng-template ngFor [ngForOf]="displayNumbers" let-number let-i="index">
<div [class.list-view]="!grid" [id]="'number-' + number._id" <div [class.list-view]="!grid" [id]="'number-' + number._id" [class.section]="isAdministrator"
class="uk-grid-match section uk-grid-small uk-grid uk-margin-top" class="uk-grid-match uk-grid-small uk-grid uk-margin-top"
uk-sortable="group: number" uk-grid> uk-sortable="group: number" uk-grid>
<div *ngIf="grid" class="tools disable-sortable uk-sortable-nodrag"> <div *ngIf="grid" class="tools disable-sortable uk-sortable-nodrag">
<div class="md-btn-group"> <div *ngIf="isAdministrator" class="md-btn-group">
<button [disabled]="editing" class="md-btn md-btn-mini" (click)="createSection(i, 'number')" <button [disabled]="editing" class="md-btn md-btn-mini" (click)="createSection(i, 'number')"
title="Create a new section"><i title="Create a new section"><i
class="material-icons">add</i></button> class="material-icons">add</i></button>
@ -203,7 +203,7 @@
</div> </div>
</div> </div>
</ng-template> </ng-template>
<div *ngIf="grid" class="new-section uk-margin-top"> <div *ngIf="grid && isAdministrator" class="new-section uk-margin-top">
<div class="tools uk-flex uk-flex-middle"> <div class="tools uk-flex uk-flex-middle">
<button class="md-btn uk-margin-small-right" (click)="createSection(-1, 'number')"> <button class="md-btn uk-margin-small-right" (click)="createSection(-1, 'number')">
<i class="material-icons md-24 md-color-white">add</i> <i class="material-icons md-24 md-color-white">add</i>
@ -320,9 +320,7 @@
</div> </div>
<div *ngIf="grid" class="md-card-content"> <div *ngIf="grid" class="md-card-content">
<div class="uk-flex uk-flex-center" uk-grid> <div class="uk-flex uk-flex-center" uk-grid>
<div class="uk-width-1-1">
{{indicator.description ? indicator.description : ''}}
</div>
<div class="uk-width-1-3 uk-text-center" <div class="uk-width-1-3 uk-text-center"
[ngClass]="'uk-child-width-1-' + indicator.indicatorPaths.length" uk-grid> [ngClass]="'uk-child-width-1-' + indicator.indicatorPaths.length" uk-grid>
<div *ngFor="let indicatorPath of indicator.indicatorPaths"> <div *ngFor="let indicatorPath of indicator.indicatorPaths">
@ -353,6 +351,9 @@
<div *ngIf="indicator.indicatorPaths[0] && indicator.indicatorPaths[0].source === 'image'"> <div *ngIf="indicator.indicatorPaths[0] && indicator.indicatorPaths[0].source === 'image'">
<img class="uk-width-1-1 uk-height-medium" [src]="indicator.indicatorPaths[0].url"> <img class="uk-width-1-1 uk-height-medium" [src]="indicator.indicatorPaths[0].url">
</div> </div>
<div class="uk-width-1-1 uk-text-muted uk-text-small">
{{indicator.description ? indicator.description : ''}}
</div>
</div> </div>
</div> </div>
</div> </div>
@ -590,7 +591,7 @@
<!--</modal-alert>--> <!--</modal-alert>-->
<modal-alert #deleteSectionModal (alertOutput)="deleteSection()"> <modal-alert #deleteSectionModal (alertOutput)="deleteSection()">
You are about to delete this section and its indicators permanently. You are about to delete this section and its indicators permanently.
<div *ngIf="sectionChildrenActionOnDelete == 'delete'" class="uk-text-bold"> <div *ngIf="sectionChildrenActionOnDelete == 'delete' && !stakeholder.defaultId" class="uk-text-bold">
Sections of all profiles based on this default section and their contents, will be deleted as well. Sections of all profiles based on this default section and their contents, will be deleted as well.
</div> </div>
<!-- <span *ngIf="sectionChildrenActionOnDelete == 'disconnect'" class="uk-text-bold">--> <!-- <span *ngIf="sectionChildrenActionOnDelete == 'disconnect'" class="uk-text-bold">-->

1
src/app/topic/topic.component.html
View File

@ -6,6 +6,7 @@
<div class="uk-position-relative uk-display-inline-block uk-margin-small-top"> <div class="uk-position-relative uk-display-inline-block uk-margin-small-top">
<div *ngIf="!stakeholder.defaultId" class="uk-badge default">Default</div> <div *ngIf="!stakeholder.defaultId" class="uk-badge default">Default</div>
<img class="logo" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl"> <img class="logo" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl">
<div class="uk-margin-top" *ngIf="!stakeholder.logoUrl" >{{stakeholder.name}}</div>
</div> </div>
</div> </div>
<div *ngIf="stakeholder && stakeholder.topics[topicIndex]" class="menu_section"> <div *ngIf="stakeholder && stakeholder.topics[topicIndex]" class="menu_section">

2
src/app/topic/topic.component.ts
View File

@ -77,7 +77,7 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
if (this.topicIndex === -1) { if (this.topicIndex === -1) {
this.navigateToError(); this.navigateToError();
} else { } else {
this.title.setTitle(stakeholder.index_shortName + ' | ' + this.stakeholder.topics[this.topicIndex].name); this.title.setTitle(stakeholder.name + ' | ' + this.stakeholder.topics[this.topicIndex].name);
this.toggle = true; this.toggle = true;
} }
} }