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

[Monitor Dashboard | Trunk]: Change functions for default profile 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor_dashboard@57960 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
Konstantinos Triantafyllou 2020-01-09 13:15:39 +00:00
parent f7da8c52ae
commit 946ca64bb7
7 changed files with 201 additions and 134 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/app.component.html
View File

@ -23,7 +23,7 @@
<dashboard-sidebar *ngIf="hasAdminMenu" [items]="adminMenuItems" <dashboard-sidebar *ngIf="hasAdminMenu" [items]="adminMenuItems"
></dashboard-sidebar> ></dashboard-sidebar>
<div *ngIf="hasSidebar" id="hide_controls"> <div *ngIf="hasSidebar" id="hide_controls">
<div id="toggle" (click)="toggleOpen($event)"> <div id="toggle" [class.sidebar_main_open]="open" (click)="toggleOpen($event)">
<i class="material-icons">play_circle_filled</i> <i class="material-icons">play_circle_filled</i>
<span *ngIf="open" class="uk-margin-small-left">Hide Controls</span> <span *ngIf="open" class="uk-margin-small-left">Hide Controls</span>
</div> </div>

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

@ -175,6 +175,7 @@ export class ManageStakeholdersComponent implements OnInit, OnDestroy {
this.stakeholders.filter(stakeholder => stakeholder.alias !== this.stakeholder.alias) this.stakeholders.filter(stakeholder => stakeholder.alias !== this.stakeholder.alias)
)] )]
), ),
isDefault: this.fb.control(isDefault),
isPublic: this.fb.control(this.stakeholder.isPublic), isPublic: this.fb.control(this.stakeholder.isPublic),
isActive: this.fb.control(this.stakeholder.isActive), isActive: this.fb.control(this.stakeholder.isActive),
type: this.fb.control(this.stakeholder.type, Validators.required), type: this.fb.control(this.stakeholder.type, Validators.required),
@ -207,15 +208,16 @@ export class ManageStakeholdersComponent implements OnInit, OnDestroy {
public saveStakeholder() { public saveStakeholder() {
if (this.index === -1) { if (this.index === -1) {
if (this.stakeholderFb.value.defaultId) { if (!this.stakeholderFb.value.isDefault) {
// TODO set defaultId from default profile let stakeholder = this.defaultStakeholders.find(value => value.type === this.stakeholderFb.value.type);
// this.stakeholderFb.setValue(this.stakeholderUtils. this.stakeholderFb.get('defaultId').setValue(stakeholder._id);
// createFunderFromDefaultProfile(this.stakeholderFb.value, this.stakeholderFb.setValue(this.stakeholderUtils.createFunderFromDefaultProfile(this.stakeholderFb.value,
// this.defaultStakeholders.find( value => value.type === this.stakeholderFb.value.type).topics)); stakeholder.topics));
this.stakeholderFb.setValue(this.stakeholderUtils.createFunderFromDefaultProfile(this.stakeholderFb.value, StakeholderCreator.createFunderDefaultProfile().topics)); /* this.stakeholderFb.setValue(this.stakeholderUtils.createFunderFromDefaultProfile(this.stakeholderFb.value,
}/* else { StakeholderCreator.createFunderDefaultProfile().topics));*/
} else {
this.stakeholderFb.setValue(StakeholderCreator.createFunderDefaultProfile()); this.stakeholderFb.setValue(StakeholderCreator.createFunderDefaultProfile());
}*/ }
this.stakeholderService.buildStakeholder(this.properties.monitorServiceAPIURL, this.stakeholderFb.value).subscribe(stakeholder => { this.stakeholderService.buildStakeholder(this.properties.monitorServiceAPIURL, this.stakeholderFb.value).subscribe(stakeholder => {
if (stakeholder.defaultId === null) { if (stakeholder.defaultId === null) {
this.defaultStakeholders.push(stakeholder); this.defaultStakeholders.push(stakeholder);

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

@ -51,7 +51,7 @@
</div> </div>
</div> </div>
<h4 class="uk-text-bold">Number Indicators</h4> <h4 class="uk-text-bold">Number Indicators</h4>
<div [class.max-width-large]="!grid" [id]="number._id" <section [class.max-width-large]="!grid" [id]="number._id"
class="uk-grid-match uk-grid-small" class="uk-grid-match uk-grid-small"
*ngFor="let number of displayNumbers; let i = index" *ngFor="let number of displayNumbers; let i = index"
uk-sortable="group: number" uk-grid> uk-sortable="group: number" uk-grid>
@ -63,19 +63,22 @@
[class.uk-width-1-3@m]="grid && indicator.width === 'small'" [class.uk-width-1-3@m]="grid && indicator.width === 'small'"
[class.uk-width-1-2@m]="grid && indicator.width === 'medium'" [class.uk-width-1-2@m]="grid && indicator.width === 'medium'"
[class.uk-width-1-1@m]="!grid || indicator.width === 'large'" [class.uk-width-1-1@m]="!grid || indicator.width === 'large'"
[class.disable-sortable]="!canReorder"
[class.uk-sortable-nodrag]="!canReorder"> [class.uk-sortable-nodrag]="!canReorder">
<div class="md-card" [class.md-card-hover]="canReorder"> <div class="md-card" [class.md-card-hover]="canReorder">
<div class="md-card-toolbar"> <div class="md-card-toolbar">
<div class="md-card-toolbar-actions" [class.uk-flex-middle]="!grid" [class.uk-flex]="!grid"> <div class="md-card-toolbar-actions" [class.uk-flex-middle]="!grid" [class.uk-flex]="!grid">
<span *ngIf="!grid" class="uk-margin-medium-right uk-flex uk-flex-middle"> <ng-template [ngIf]="!grid">
<div class="uk-margin-medium-right uk-flex uk-flex-middle">
<i class="material-icons md-24 uk-margin-small-right">{{indicatorUtils.isPublicIcon.get(indicator.isPublic)}}</i> <i class="material-icons md-24 uk-margin-small-right">{{indicatorUtils.isPublicIcon.get(indicator.isPublic)}}</i>
{{(indicator.isPublic) ? 'Public' : 'Private'}} {{(indicator.isPublic) ? 'Public' : 'Private'}}
</span> </div>
<span *ngIf="!grid" class="uk-margin-medium-right uk-flex uk-flex-middle"> <div class="uk-margin-medium-right uk-flex uk-flex-middle">
<i class="material-icons md-24 uk-margin-small-right" <i class="material-icons md-24 uk-margin-small-right"
[class.md-color-green-300]="indicator.isActive">{{indicatorUtils.isActiveIcon}}</i> [class.md-color-green-300]="indicator.isActive">{{indicatorUtils.isActiveIcon}}</i>
{{(indicator.isActive) ? 'Active' : 'Inactive'}} {{(indicator.isActive) ? 'Active' : 'Inactive'}}
</span> </div>
</ng-template>
<div class="md-card-dropdown uk-inline"> <div class="md-card-dropdown uk-inline">
<i class="md-icon material-icons">more_vert</i> <i class="md-icon material-icons">more_vert</i>
<div uk-dropdown="mode: click; pos: bottom-right" <div uk-dropdown="mode: click; pos: bottom-right"
@ -118,12 +121,18 @@
</div> </div>
</div> </div>
</ng-template> </ng-template>
</div> </section>
<h4 class="uk-text-bold">Chart Indicators</h4> <h4 class="uk-text-bold">Chart Indicators</h4>
<div>
<ng-template ngFor [ngForOf]="displayCharts" let-chart let-i="index"> <ng-template ngFor [ngForOf]="displayCharts" let-chart let-i="index">
<div [class.max-width-large]="!grid" [id]="'chart-' + chart._id" <section [class.max-width-large]="!grid" [id]="'chart-' + chart._id"
class="uk-grid-match uk-grid-small uk-grid" class="uk-grid-match uk-grid-small uk-grid"
uk-sortable="group: chart" uk-grid> uk-sortable="group: chart" uk-grid>
<div class="tools disable-sortable uk-sortable-nodrag">
<div class="md-btn-group">
<button class="md-btn md-btn-primary md-icon"><i class="material-icons">add</i></button>
</div>
</div>
<div class="uk-width-1-1 disable-sortable uk-sortable-nodrag"> <div class="uk-width-1-1 disable-sortable uk-sortable-nodrag">
<h4>{{chart.title}}</h4> <h4>{{chart.title}}</h4>
</div> </div>
@ -132,32 +141,33 @@
[class.uk-width-1-3@m]="grid && indicator.width === 'small'" [class.uk-width-1-3@m]="grid && indicator.width === 'small'"
[class.uk-width-1-2@m]="grid && indicator.width === 'medium'" [class.uk-width-1-2@m]="grid && indicator.width === 'medium'"
[class.uk-width-1-1@m]="!grid || indicator.width === 'large'" [class.uk-width-1-1@m]="!grid || indicator.width === 'large'"
[class.disable-sortable]="!canReorder"
[class.uk-sortable-nodrag]="!canReorder"> [class.uk-sortable-nodrag]="!canReorder">
<div class="md-card" [class.md-card-hover]="canReorder"> <div class="md-card" [class.md-card-hover]="canReorder">
<div class="md-card-toolbar"> <div class="md-card-toolbar">
<div class="md-card-toolbar-actions" [class.uk-flex-middle]="!grid" [class.uk-flex]="!grid"> <div class="md-card-toolbar-actions" [class.uk-flex-middle]="!grid" [class.uk-flex]="!grid">
<ng-template [ngIf]="!grid"> <ng-template [ngIf]="!grid">
<span *ngFor="let indicatorPath of indicator.indicatorPaths" <div *ngFor="let indicatorPath of indicator.indicatorPaths"
class="uk-margin-medium-right uk-text-capitalize uk-flex uk-flex-middle"> class="uk-margin-medium-right uk-text-capitalize uk-flex uk-flex-middle">
<i class="material-icons md-24 uk-margin-small-right"> <i class="material-icons md-24 uk-margin-small-right">
{{indicatorUtils.chartTypesIcons.get(indicatorPath.type)}} {{indicatorUtils.chartTypesIcons.get(indicatorPath.type)}}
</i> </i>
{{indicatorPath.type + ' Chart'}} {{indicatorPath.type + ' Chart'}}
</span> </div>
</ng-template> </ng-template>
<span *ngIf="!grid" class="uk-margin-medium-right uk-flex uk-flex-middle"> <div *ngIf="!grid" class="uk-margin-medium-right uk-flex uk-flex-middle">
<i class="material-icons md-24 uk-margin-small-right"> <i class="material-icons md-24 uk-margin-small-right">
{{indicatorUtils.isPublicIcon.get(indicator.isPublic)}} {{indicatorUtils.isPublicIcon.get(indicator.isPublic)}}
</i> </i>
{{(indicator.isPublic) ? 'Public' : 'Private'}} {{(indicator.isPublic) ? 'Public' : 'Private'}}
</span> </div>
<span *ngIf="!grid" class="uk-margin-medium-right uk-flex uk-flex-middle"> <div *ngIf="!grid" class="uk-margin-medium-right uk-flex uk-flex-middle">
<i class="material-icons md-24 uk-margin-small-right" <i class="material-icons md-24 uk-margin-small-right"
[class.md-color-green-300]="indicator.isActive"> [class.md-color-green-300]="indicator.isActive">
{{indicatorUtils.isActiveIcon}} {{indicatorUtils.isActiveIcon}}
</i> </i>
{{(indicator.isActive) ? 'Active' : 'Inactive'}} {{(indicator.isActive) ? 'Active' : 'Inactive'}}
</span> </div>
<div class="md-card-dropdown uk-inline"> <div class="md-card-dropdown uk-inline">
<i class="md-icon material-icons">more_vert</i> <i class="md-icon material-icons">more_vert</i>
<div uk-dropdown="mode: click; pos: bottom-right" <div uk-dropdown="mode: click; pos: bottom-right"
@ -237,9 +247,10 @@
</div> </div>
</div> </div>
</div> </div>
</div> </section>
</ng-template> </ng-template>
</div> </div>
</div>
</div> </div>
<modal-alert #editModal <modal-alert #editModal
[classBody]="'large-modal'" [classBody]="'large-modal'"

6
src/app/utils/entities/stakeholder.ts
View File

@ -364,16 +364,16 @@ export class Section {
_id: string; _id: string;
title: string; title: string;
defaultId: string; defaultId: string;
stakeholderId: string; stakeholderAlias: string;
type: IndicatorType; type: IndicatorType;
indicators: Indicator[]; indicators: Indicator[];
constructor(type: IndicatorType, title: string = null, defaultId: string = null, stakeholderId: string = null) { constructor(type: IndicatorType, title: string = null, defaultId: string = null, stakeholderAlias: string = null) {
this._id = null; this._id = null;
this.title = title; this.title = title;
this.type = type; this.type = type;
this.defaultId = defaultId; this.defaultId = defaultId;
this.stakeholderId = stakeholderId; this.stakeholderAlias = stakeholderAlias;
this.indicators = []; this.indicators = [];
} }
} }

15
src/app/utils/indicator-utils.ts
View File

@ -35,21 +35,29 @@ export class StakeholderUtils {
public createFunderFromDefaultProfile(funder: Stakeholder, defaultTopics: Topic[]): Stakeholder { public createFunderFromDefaultProfile(funder: Stakeholder, defaultTopics: Topic[]): Stakeholder {
funder.topics = defaultTopics; funder.topics = defaultTopics;
for (let topic of funder.topics) { for (let topic of funder.topics) {
console.log('id:' + topic._id);
topic.defaultId = topic._id;
topic._id = null; topic._id = null;
console.log('defaultId:' + topic.defaultId);
for (let category of topic.categories) { for (let category of topic.categories) {
category.defaultId = category._id;
category._id = null; category._id = null;
let subTokeep: SubCategory[] = []; let subTokeep: SubCategory[] = [];
for (let subCategory of category.subCategories) { for (let subCategory of category.subCategories) {
subCategory.defaultId = subCategory._id;
subCategory._id = null; subCategory._id = null;
if (subCategory.recommendedFor.length == 0 || subCategory.recommendedFor.indexOf(funder.index_id) != -1) { if (!subCategory.recommendedFor || subCategory.recommendedFor.length == 0 || subCategory.recommendedFor.indexOf(funder.index_id) != -1) {
subTokeep.push(subCategory); subTokeep.push(subCategory);
} }
for (let section of subCategory.charts) { for (let section of subCategory.charts) {
let chartsTokeep: Indicator[] = []; let chartsTokeep: Indicator[] = [];
section.defaultId = section._id;
section.stakeholderAlias = funder.alias;
section._id = null; section._id = null;
for (let indicator of section.indicators) { for (let indicator of section.indicators) {
indicator.defaultId = indicator._id;
indicator._id = null; indicator._id = null;
if (indicator.recommendedFor.length == 0 || indicator.recommendedFor.indexOf(funder.index_id) != -1) { if (!indicator.recommendedFor || indicator.recommendedFor.length == 0 || indicator.recommendedFor.indexOf(funder.index_id) != -1) {
chartsTokeep.push(indicator); chartsTokeep.push(indicator);
} }
for (let indicatorPath of indicator.indicatorPaths) { for (let indicatorPath of indicator.indicatorPaths) {
@ -69,8 +77,11 @@ export class StakeholderUtils {
section.indicators = chartsTokeep; section.indicators = chartsTokeep;
} }
for (let section of subCategory.numbers) { for (let section of subCategory.numbers) {
section.defaultId = section._id;
section.stakeholderAlias = funder.alias;
section._id = null; section._id = null;
for(let indicator of section.indicators) { for(let indicator of section.indicators) {
indicator.defaultId = indicator._id;
indicator._id = null; indicator._id = null;
for (let indicatorPath of indicator.indicatorPaths) { for (let indicatorPath of indicator.indicatorPaths) {
indicatorPath.url = indicatorPath.url.replace("_funder_id_", funder.index_id); indicatorPath.url = indicatorPath.url.replace("_funder_id_", funder.index_id);

4
src/assets/env-properties.json
View File

@ -37,9 +37,9 @@
"piwikBaseUrl" :"https://analytics.openaire.eu/piwik.php?idsite=", "piwikBaseUrl" :"https://analytics.openaire.eu/piwik.php?idsite=",
"piwikSiteId" : "80", "piwikSiteId" : "80",
"loginUrl" :"http://dl170.madgik.di.uoa.gr:8180/dnet-login/openid_connect_login", "loginUrl" :"http://rudie.di.uoa.gr:8080/dnet-openaire-users-1.0.0-SNAPSHOT/openid_connect_login",
"userInfoUrl" : "http://dl170.madgik.di.uoa.gr:8180/dnet-openaire-users-1.0.0-SNAPSHOT/api/users/getUserInfo?accessToken=", "userInfoUrl" : "http://rudie.di.uoa.gr:8080/dnet-openaire-users-1.0.0-SNAPSHOT/api/users/getUserInfo?accessToken=",
"logoutUrl" :"https://aai.openaire.eu/proxy/saml2/idp/SingleLogoutService.php?ReturnTo=", "logoutUrl" :"https://aai.openaire.eu/proxy/saml2/idp/SingleLogoutService.php?ReturnTo=",

47
src/assets/theme-assets/dashboard-custom.css
View File

@ -75,15 +75,22 @@ html .dashboard {
width: max-content; width: max-content;
} }
.dashboard #hide_controls #toggle:hover { .dashboard #hide_controls #toggle:hover, .dashboard #hide_controls #toggle:not(.sidebar_main_open) {
color: #0d47a1; color: #0d47a1;
} }
.dashboard #hide_controls:hover #toggle:hover .material-icons { .dashboard #hide_controls:hover #toggle:hover .material-icons,
.dashboard #hide_controls #toggle:not(.sidebar_main_open) .material-icons {
color: #0d47a1; color: #0d47a1;
border: #0d47a1 solid 1px; border: #0d47a1 solid 1px;
} }
.dashboard #hide_controls #toggle * {
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
}
.dashboard #hide_controls #toggle .material-icons { .dashboard #hide_controls #toggle .material-icons {
transform: rotateY(0deg); transform: rotateY(0deg);
transition: all 280ms cubic-bezier(0.4, 0, 0.2, 1); transition: all 280ms cubic-bezier(0.4, 0, 0.2, 1);
@ -294,6 +301,42 @@ body.dashboard {
cursor: move; cursor: move;
} }
.dashboard section {
padding-top: 10px;
padding-bottom: 10px;
padding-right: 10px;
border: rgba(0, 0, 0, 0) solid 1px;
position: relative;
}
.dashboard section .tools {
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -100%);
display: none;
}
.dashboard section:hover {
border: rgb(28, 169, 213) solid 1px;
}
.dashboard section:hover .tools {
display: block;
}
.dashboard section:hover .tools .md-btn-group .md-btn {
border-top-left-radius: 100%;
border-bottom-left-radius: 0;
min-width: 36px;
min-height: 36px;
}
.dashboard section:hover .tools .md-btn-group .md-btn:first-child {
border-top-left-radius: 100%;
border-bottom-left-radius: 0;
}
.dashboard .uk-sortable-drag .md-card.md-card-hover { .dashboard .uk-sortable-drag .md-card.md-card-hover {
-webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);