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

Topics: Add reorder functionality. Change sticky header to sticky actions in general, monitor and manage stakeholders

This commit is contained in:
Konstantinos Triantafyllou 2022-07-14 14:38:20 +03:00
parent 14a4a6e393
commit 3ffed87ad4
15 changed files with 271 additions and 239 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/app-routing.module.ts
View File

@ -11,6 +11,11 @@ const routes: Routes = [
loadChildren: () => import('./reload/libReload.module').then(m => m.LibReloadModule),
data: {hasSidebar: false}
},
{
path: 'user-info',
loadChildren: () => import('./login/libUser.module').then(m => m.LibUserModule),
data: {hasSidebar: false}
},
{
path: 'error',
component: OpenaireErrorPageComponent,

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

@ -46,7 +46,6 @@ export class AppComponent implements OnInit, OnDestroy {
logoSmallUrl: null,
position: 'center',
badge: true,
stickyAnimation: true,
menuPosition: "center"
};
@ -305,29 +304,26 @@ export class AppComponent implements OnInit, OnDestroy {
, null, null, null, null), items: []
});
}
if (!this.hasAdminMenu && this.isFrontPage) {
this.menuHeader = {
route: "/" + this.stakeholder.alias,
url: null,
title: this.stakeholder.name,
route: null,
url: "https://" + (this.properties.environment == 'beta' ? 'beta.' : '') + 'monitor.openaire.eu',
title: "Monitor",
logoUrl: 'assets/common-assets/logo-services/monitor/small-inverted.svg',
logoSmallUrl: "assets/common-assets/logo-services/monitor/small-inverted.svg",
position: 'center',
badge: true,
stickyAnimation: true,
menuPosition: "center"
};
} else {
this.menuHeader = {
route: "/" + this.stakeholder.alias,
url: null,
title: this.stakeholder.name,
route: null,
url: "https://" + (this.properties.environment == 'beta' ? 'beta.' : '') + 'monitor.openaire.eu',
title: "Monitor",
logoUrl: 'assets/common-assets/logo-services/monitor/small.svg',
logoSmallUrl: "assets/common-assets/logo-services/monitor/small.svg",
position: 'center',
badge: false,
stickyAnimation: true,
badge: true,
menuPosition: "center"
};
}
@ -342,7 +338,6 @@ export class AppComponent implements OnInit, OnDestroy {
logoSmallUrl: "assets/common-assets/logo-services/monitor/small.svg",
position: 'left',
badge: true,
stickyAnimation: true,
menuPosition: "center"
};
this.menuItems.push({

15
src/app/general/general.component.html
View File

@ -1,6 +1,6 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event">
<div page-content>
<div header *ngIf="stakeholder">
<div class="uk-flex uk-flex-middle uk-margin-top uk-margin-bottom info" [class.uk-active]="stickyPageHeader">
<div class="uk-flex uk-flex-middle uk-margin-top uk-margin-bottom info">
<img [src]="stakeholder | logoUrl" class="uk-margin-right uk-blend-multiply">
<div>
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">Admin Dashboard - Manage Profile</div>
@ -8,9 +8,9 @@
</div>
</div>
</div>
<div inner>
<div *ngIf="stakeholder" class="uk-container">
<div class="uk-margin-top uk-flex uk-flex-center uk-flex-right@m">
<div actions>
<div class="uk-section-xsmall uk-container">
<div class="uk-flex uk-flex-center uk-flex-right@m">
<button class="uk-button uk-button-default uk-margin-right"
(click)="reset()" [class.uk-disabled]="loading || !editStakeholderComponent.dirty"
[disabled]="loading || !editStakeholderComponent.dirty">Reset
@ -19,6 +19,11 @@
(click)="save()" [disabled]="loading || editStakeholderComponent.disabled">Save
</button>
</div>
</div>
</div>
<div inner>
<div *ngIf="stakeholder" class="uk-container">
<div class="uk-position-relative" style="min-height: 60vh">
<div [class.uk-hidden]="loading" class="uk-section uk-section-small">
<edit-stakeholder #editStakeholderComponent [disableAlias]="true"></edit-stakeholder>

1
src/app/general/general.component.ts
View File

@ -20,7 +20,6 @@ export class GeneralComponent implements OnInit, OnDestroy {
public loading: boolean = false;
private subscriptions: any[] = [];
@ViewChild('editStakeholderComponent') editStakeholderComponent: EditStakeholderComponent;
public stickyPageHeader: boolean = false;
constructor(private stakeholderService: StakeholderService,
private title: Title) {

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

@ -1,6 +1,6 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event">
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-top info" [class.uk-active]="stickyPageHeader">
<div class="uk-flex uk-flex-middle uk-margin-top info">
<div>
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">
Admin Dashboard - Manage profiles
@ -14,11 +14,15 @@
<li [class.uk-active]="tab === 'profiles'"><a (click)="tab = 'profiles'">Profiles</a></li>
</ul>
</div>
<div inner>
<div class="uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-margin-top">
<div search-input [searchControl]="filters.get('keyword')" [expandable]="true" placeholder="Search Profiles" searchInputClass="outer"
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1 uk-flex uk-flex-right"></div>
<div actions>
<div class="uk-section-xsmall">
<div class="uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle">
<div search-input [searchControl]="filters.get('keyword')" [expandable]="true" placeholder="Search Profiles" searchInputClass="outer"
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1 uk-flex uk-flex-right"></div>
</div>
</div>
</div>
<div inner>
<div *ngIf="loading" class="uk-margin-medium-top uk-padding-large">
<loading></loading>
</div>

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

@ -33,7 +33,6 @@ export class ManageStakeholdersComponent implements OnInit, OnDestroy {
public stakeholder: Stakeholder;
public index: number;
public user = null;
public stickyPageHeader: boolean = false;
public tab: Tab = 'all';
public stakeholderEntities = StakeholderEntities;
/**

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

@ -39,27 +39,31 @@
</div>
</div>
</ng-template>
<div page-content (stickyEmitter)="stickyPageHeader = $event">
<div page-content>
<div *ngIf="activeTopic && activeTopic.categories.length > 0" header>
<div class="uk-flex uk-flex-middle uk-margin-top info" [class.uk-active]="stickyPageHeader">
<div class="uk-flex uk-flex-middle uk-margin-top info">
<img [src]="stakeholder | logoUrl" class="uk-margin-right uk-blend-multiply">
<div>
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">Dashboard</div>
<h1 class="uk-h4 uk-margin-remove">{{stakeholder.name}}</h1>
</div>
</div>
<div *ngIf="stakeholder && status === errorCodes.DONE && activeTopic" class="uk-margin-top">
<ul class="uk-tab">
<ng-template ngFor [ngForOf]="activeTopic.categories" let-category>
<li *ngIf="isPublicOrIsMember(category.visibility)"
[class.uk-active]="category.alias === activeCategory.alias">
<a [routerLink]="['/', stakeholder.alias, activeTopic.alias, category.alias]"
[queryParams]="queryParams">
<span class="title">{{category.name}}</span>
</a>
</li>
</ng-template>
</ul>
</div>
<div actions>
<div class="uk-margin-top">
<div *ngIf="stakeholder && status === errorCodes.DONE && activeTopic">
<ul class="uk-tab">
<ng-template ngFor [ngForOf]="activeTopic.categories" let-category>
<li *ngIf="isPublicOrIsMember(category.visibility)"
[class.uk-active]="category.alias === activeCategory.alias">
<a [routerLink]="['/', stakeholder.alias, activeTopic.alias, category.alias]"
[queryParams]="queryParams">
<span class="title">{{category.name}}</span>
</a>
</li>
</ng-template>
</ul>
</div>
</div>
</div>
<div inner>
@ -85,162 +89,164 @@
</div>
</div>
<div *ngIf="!privateStakeholder && stakeholder" class="uk-section">
<div *ngIf="(activeSubCategory && (activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
&& ((activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0) ||
(activeCategory && activeCategory.description && activeCategory.description.length > 0) ||
(activeTopic && activeTopic.description && activeTopic.description.length > 0))" class="uk-text-center">
<div class="uk-height-small uk-margin-large-top uk-margin-xlarge-right uk-margin-xlarge-left">
{{activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0 ? activeSubCategory.description
: (activeCategory && activeCategory.description && activeCategory.description.length > 0 ? activeCategory.description :
(activeTopic.description && activeTopic.description.length > 0 ? activeTopic.description : ""))}}
</div>
</div>
<ng-template [ngIf]="!loading && !privateStakeholder &&
(!activeSubCategory ||
((activeSubCategory.numbers.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.numbers) == 0) &&
(activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
|| !activeTopic || !activeCategory || !activeSubCategory)" [ngIfElse]="content">
<div class="message uk-text-center">
<h3>
No indicators available yet. Stay tuned!
</h3>
</div>
</ng-template>
<ng-template #content>
<ng-container *ngFor="let number of activeSubCategory.numbers; let i = index;">
<div *ngIf="countIndicatorsToShow(number.indicators) > 0" class="uk-grid uk-margin-large-bottom" uk-grid
uk-height-match="target: .uk-card">
<h5 *ngIf="number.title" class="uk-width-1-1 uk-margin-bottom">{{number.title}}</h5>
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
<div *ngIf="isPublicOrIsMember(indicator.visibility)" [ngClass]="getNumberClassBySize(indicator.width)"
class="uk-margin-bottom">
<div class="uk-card uk-card-default uk-flex uk-flex-column uk-flex-center"
[class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
<div class="uk-text-center">
<!--<div *ngIf="properties.environment === 'development'">
Filtered:{{indicator.indicatorPaths[0].filtersApplied}}out of{{countSelectedFilters()}}
</div>-->
<div class="number uk-text-bold uk-text-background">
<span *ngIf="numberResults.get(i + '-' + j)">{{numberResults.get(i + '-' + j) | number}}</span>
<span *ngIf="!numberResults.get(i + '-' + j)">--</span>
</div>
<!-- for printing only -->
<span *ngIf="numberResults.get(i + '-' + j)"
class="uk-text-bold uk-hidden">{{numberResults.get(i + '-' + j) | number}}</span>
<!-- ----------------- -->
<div class="uk-text-uppercase uk-text-small uk-margin-top">{{indicator.name}}</div>
</div>
<!-- <div *ngIf="indicator.description || indicator.additionalDescription"
class="uk-overlay uk-position-bottom">
<div class="uk-padding-small">
<div *ngIf="indicator.description">
{{indicator.description}}
</div>
<div *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</div>
</div>
</div> -->
</div>
</div>
</ng-template>
<div class="uk-padding uk-padding-remove-vertical">
<div *ngIf="(activeSubCategory && (activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
&& ((activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0) ||
(activeCategory && activeCategory.description && activeCategory.description.length > 0) ||
(activeTopic && activeTopic.description && activeTopic.description.length > 0))" class="uk-text-center">
<div class="uk-height-small uk-margin-large-top uk-margin-xlarge-right uk-margin-xlarge-left">
{{activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0 ? activeSubCategory.description
: (activeCategory && activeCategory.description && activeCategory.description.length > 0 ? activeCategory.description :
(activeTopic.description && activeTopic.description.length > 0 ? activeTopic.description : ""))}}
</div>
</ng-container>
<div [class.uk-margin-large-top]="countSectionsWithIndicatorsToShow(activeSubCategory.numbers) > 0">
<ng-container *ngFor="let chart of activeSubCategory.charts; let i = index;">
<div *ngIf="countIndicatorsToShow(chart.indicators) > 0"
class="uk-grid uk-grid-column-medium uk-margin-medium-bottom uk-flex uk-flex-middle" uk-grid
</div>
<ng-template [ngIf]="!loading && !privateStakeholder &&
(!activeSubCategory ||
((activeSubCategory.numbers.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.numbers) == 0) &&
(activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
|| !activeTopic || !activeCategory || !activeSubCategory)" [ngIfElse]="content">
<div class="message uk-text-center">
<h3>
No indicators available yet. Stay tuned!
</h3>
</div>
</ng-template>
<ng-template #content>
<ng-container *ngFor="let number of activeSubCategory.numbers; let i = index;">
<div *ngIf="countIndicatorsToShow(number.indicators) > 0" class="uk-grid uk-margin-large-bottom" uk-grid
uk-height-match="target: .uk-card">
<h5 *ngIf="chart.title" class="uk-width-1-1 uk-margin-bottom">{{chart.title}}</h5>
<ng-template ngFor [ngForOf]="chart.indicators" let-indicator let-j="index">
<div *ngIf="isPublicOrIsMember(indicator.visibility) && chartsActiveType.get(i + '-' + j)"
[ngClass]="getChartClassBySize(indicator.width)">
<div class="uk-card uk-card-default uk-position-relative"
[class.semiFiltered]="chartsActiveType.get(i + '-' + j).filtersApplied < countSelectedFilters()">
<div class="uk-card-body uk-text-center uk-margin-small-bottom">
<h4 class="uk-margin-bottom chartTitle uk-flex uk-flex-bottom ">
<div>{{indicator.name + " "}}</div>
</h4>
<div *ngIf="indicator.indicatorPaths.length > 1" class="uk-button-group">
<button *ngFor="let indicatorPath of indicator.indicatorPaths;"
class="uk-button"
(click)="setActiveChart(i, j, indicatorPath.type)"
[class.uk-button-secondary]="chartsActiveType.get(i + '-' + j).url === indicatorPath.url">
{{indicatorPath.type}}
</button>
</div>
<h5 *ngIf="number.title" class="uk-width-1-1 uk-margin-bottom">{{number.title}}</h5>
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
<div *ngIf="isPublicOrIsMember(indicator.visibility)" [ngClass]="getNumberClassBySize(indicator.width)"
class="uk-margin-bottom">
<div class="uk-card uk-card-default uk-flex uk-flex-column uk-flex-center"
[class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
<div class="uk-text-center">
<!--<div *ngIf="properties.environment === 'development'">
Filtered: {{chartsActiveType.get(i + '-' + j).filtersApplied}} out of
{{countSelectedFilters()}}</div>-->
<iframe
*ngIf=" !properties.disableFrameLoad && chartsActiveType.get(i + '-' + j).source !== 'image'"
[src]="chartsActiveType.get(i + '-' + j).safeResourceUrl"
class="uk-width-1-1 uk-blend-multiply" allowfullscreen="true" mozallowfullscreen="true"
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"></iframe>
<div *ngIf="properties.disableFrameLoad && chartsActiveType.get(i + '-' + j).source !== 'image'">
<img class="uk-width-1-1 uk-blend-multiply"
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"
src="assets/chart-placeholder.png">
Filtered:{{indicator.indicatorPaths[0].filtersApplied}}out of{{countSelectedFilters()}}
</div>-->
<div class="number uk-text-bold uk-text-background">
<span *ngIf="numberResults.get(i + '-' + j)">{{numberResults.get(i + '-' + j) | number}}</span>
<span *ngIf="!numberResults.get(i + '-' + j)">--</span>
</div>
<img *ngIf="chartsActiveType.get(i + '-' + j).source === 'image'"
[src]="chartsActiveType.get(i + '-' + j).safeResourceUrl"
class="uk-width-1-1 uk-blend-multiply"
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')">
<!-- for printing only -->
<span *ngIf="numberResults.get(i + '-' + j)"
class="uk-text-bold uk-hidden">{{numberResults.get(i + '-' + j) | number}}</span>
<!-- ----------------- -->
<div class="uk-text-uppercase uk-text-small uk-margin-top">{{indicator.name}}</div>
</div>
<div *ngIf="indicator.description || indicator.additionalDescription"
class="uk-position-bottom-left uk-margin-left uk-margin-small-bottom">
<a class="uk-display-inline-block uk-button uk-button-text"
(click)="toggleDescriptionOverlay($event, j)">
<span class="uk-flex uk-flex-middle">
<icon name="analytics" type="outlined" [flex]="true"></icon>
<span class="uk-margin-small-left">Description</span>
</span>
</a>
</div>
<div *ngIf="showDescriptionOverlay[j] && (indicator.description || indicator.additionalDescription)"
class="custom-description-overlay uk-card uk-card-default uk-flex uk-flex-middle uk-flex-center">
<div class="inner uk-padding-small" click-outside-or-esc
(clickOutside)="closeDescriptionOverlay($event, j)">
<div class="uk-flex uk-flex-right">
<button class="uk-close uk-icon" (click)="toggleDescriptionOverlay($event, j)">
<icon name="close" ratio="1"></icon>
</button>
<!-- <div *ngIf="indicator.description || indicator.additionalDescription"
class="uk-overlay uk-position-bottom">
<div class="uk-padding-small">
<div *ngIf="indicator.description">
{{indicator.description}}
</div>
<div class="uk-padding-small uk-padding-remove-horizontal">
<p *ngIf="indicator.description">
{{indicator.description}}
</p>
<p *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</p>
<div *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</div>
</div>
</div>
</div> -->
</div>
</div>
<div class="printGap uk-hidden"></div>
</ng-template>
</div>
</ng-container>
</div>
<div class="uk-margin-medium-top uk-text-small uk-flex hideInfo">
<!-- Last Stats Date-->
<div class="uk-width-2-3@m uk-width-1-2">
<icon name="graph" customClass="text-graph"></icon>
<span class="uk-margin-small-left uk-text-baseline uk-text-meta">Powered by </span>
<a href="https://graph.openaire.eu" class="text-graph">OpenAIRE Research Graph</a>
<span *ngIf="statsUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of statistics in OpenAIRE: {{statsUpdateDate | date: 'MMM dd, yyyy'}}
</span>
<div [class.uk-margin-large-top]="countSectionsWithIndicatorsToShow(activeSubCategory.numbers) > 0">
<ng-container *ngFor="let chart of activeSubCategory.charts; let i = index;">
<div *ngIf="countIndicatorsToShow(chart.indicators) > 0"
class="uk-grid uk-grid-column-medium uk-margin-medium-bottom uk-flex uk-flex-middle" uk-grid
uk-height-match="target: .uk-card">
<h5 *ngIf="chart.title" class="uk-width-1-1 uk-margin-bottom">{{chart.title}}</h5>
<ng-template ngFor [ngForOf]="chart.indicators" let-indicator let-j="index">
<div *ngIf="isPublicOrIsMember(indicator.visibility) && chartsActiveType.get(i + '-' + j)"
[ngClass]="getChartClassBySize(indicator.width)">
<div class="uk-card uk-card-default uk-position-relative"
[class.semiFiltered]="chartsActiveType.get(i + '-' + j).filtersApplied < countSelectedFilters()">
<div class="uk-card-body uk-text-center uk-margin-small-bottom">
<h4 class="uk-margin-bottom chartTitle uk-flex uk-flex-bottom ">
<div>{{indicator.name + " "}}</div>
</h4>
<div *ngIf="indicator.indicatorPaths.length > 1" class="uk-button-group">
<button *ngFor="let indicatorPath of indicator.indicatorPaths;"
class="uk-button"
(click)="setActiveChart(i, j, indicatorPath.type)"
[class.uk-button-secondary]="chartsActiveType.get(i + '-' + j).url === indicatorPath.url">
{{indicatorPath.type}}
</button>
</div>
<!--<div *ngIf="properties.environment === 'development'">
Filtered: {{chartsActiveType.get(i + '-' + j).filtersApplied}} out of
{{countSelectedFilters()}}</div>-->
<iframe
*ngIf=" !properties.disableFrameLoad && chartsActiveType.get(i + '-' + j).source !== 'image'"
[src]="chartsActiveType.get(i + '-' + j).safeResourceUrl"
class="uk-width-1-1 uk-blend-multiply" allowfullscreen="true" mozallowfullscreen="true"
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"></iframe>
<div *ngIf="properties.disableFrameLoad && chartsActiveType.get(i + '-' + j).source !== 'image'">
<img class="uk-width-1-1 uk-blend-multiply"
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"
src="assets/chart-placeholder.png">
</div>
<img *ngIf="chartsActiveType.get(i + '-' + j).source === 'image'"
[src]="chartsActiveType.get(i + '-' + j).safeResourceUrl"
class="uk-width-1-1 uk-blend-multiply"
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')">
</div>
<div *ngIf="indicator.description || indicator.additionalDescription"
class="uk-position-bottom-left uk-margin-left uk-margin-small-bottom">
<a class="uk-display-inline-block uk-button uk-button-text"
(click)="toggleDescriptionOverlay($event, j)">
<span class="uk-flex uk-flex-middle">
<icon name="analytics" type="outlined" [flex]="true"></icon>
<span class="uk-margin-small-left">Description</span>
</span>
</a>
</div>
<div *ngIf="showDescriptionOverlay[j] && (indicator.description || indicator.additionalDescription)"
class="custom-description-overlay uk-card uk-card-default uk-flex uk-flex-middle uk-flex-center">
<div class="inner uk-padding-small" click-outside-or-esc
(clickOutside)="closeDescriptionOverlay($event, j)">
<div class="uk-flex uk-flex-right">
<button class="uk-close uk-icon" (click)="toggleDescriptionOverlay($event, j)">
<icon name="close" ratio="1"></icon>
</button>
</div>
<div class="uk-padding-small uk-padding-remove-horizontal">
<p *ngIf="indicator.description">
{{indicator.description}}
</p>
<p *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</p>
</div>
</div>
</div>
</div>
</div>
<div class="printGap uk-hidden"></div>
</ng-template>
</div>
</ng-container>
</div>
<!--Feedback-->
<div class="uk-width-expand uk-text-right">
<span class="uk-text-meta">Send us your </span>
<a class="uk-link" [href]="feedback" target="_self">feedback</a>
<span class="uk-text-meta">.</span>
<div class="uk-margin-medium-top uk-text-small uk-flex hideInfo">
<!-- Last Stats Date-->
<div class="uk-width-2-3@m uk-width-1-2">
<icon name="graph" customClass="text-graph"></icon>
<span class="uk-margin-small-left uk-text-baseline uk-text-meta">Powered by </span>
<a href="https://graph.openaire.eu" class="text-graph">OpenAIRE Research Graph</a>
<span *ngIf="statsUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of statistics in OpenAIRE: {{statsUpdateDate | date: 'MMM dd, yyyy'}}
</span>
</div>
<!--Feedback-->
<div class="uk-width-expand uk-text-right">
<span class="uk-text-meta">Send us your </span>
<a class="uk-link" [href]="feedback" target="_self">feedback</a>
<span class="uk-text-meta">.</span>
</div>
</div>
</div>
</ng-template>
</ng-template>
</div>
</div>
</div>
</div>

2
src/app/openaireLibrary

@ -1 +1 @@
Subproject commit 770c3fb3eff99ddab059f0de657f576443b01a7d
Subproject commit 013ce7d5f45dd64e28e82585451b2741c41f9d2e

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

@ -42,7 +42,7 @@
<icon [flex]="true" [name]="stakeholderUtils.visibilityIcon.get(indicator.visibility)" ratio="0.6"></icon>
<icon [flex]="true" name="more_vert"></icon>
</a>
<div #element class="uk-dropdown" uk-dropdown="mode: click; pos: bottom-left; offset: 5; delay-hide: 0">
<div #element class="uk-dropdown" uk-dropdown="mode: click; pos: bottom-left; offset: 5; delay-hide: 0">
<ul class="uk-nav uk-dropdown-nav">
<ng-container *ngIf="isCurator">
<li><a (click)="editNumberIndicatorOpen(number, indicator._id); hide(element)">Edit</a></li>

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

@ -15,11 +15,11 @@
</ul>
</div>
<div class="menu_section uk-margin-large-top">
<ul class="uk-list uk-nav uk-nav-default" uk-nav>
<ul #topics class="uk-list uk-nav uk-nav-default" transition-group uk-nav>
<ng-template ngFor [ngForOf]="stakeholder.topics" let-topic let-i="index">
<li class="uk-visible-toggle" [class.uk-active]="topicIndex == i">
<li class="uk-visible-toggle" [class.uk-active]="topicIndex == i" transition-group-item>
<a [routerLink]="'/admin/'+stakeholder.alias + '/indicators/' + topic.alias"
[title]="topic.name">
[attr.uk-tooltip]="'title: ' + topic.name + '; delay: 500'">
<div class="uk-flex uk-flex-middle uk-flex-center">
<div *ngIf="topic.icon" class="uk-width-auto">
<icon class="menu-icon" [svg]="topic.icon" [flex]="true"></icon>
@ -38,13 +38,35 @@
<ul class="uk-nav uk-dropdown-nav">
<ng-container *ngIf="isCurator">
<li>
<a (click)="editTopicOpen(i); hide(element)">Edit</a>
<a (click)="editTopicOpen(i); hide(element)">
<div class="uk-flex uk-flex-middle">
<icon [flex]="true" name="edit" ratio="0.6"></icon>
<span class="uk-margin-small-left uk-width-expand">Edit</span>
</div>
</a>
</li>
<li class="uk-nav-divider"></li>
<li *ngIf="i > 0">
<a (click)="hide(element);moveTopic(i)">
<div class="uk-flex uk-flex-middle">
<icon [flex]="true" name="north" ratio="0.6"></icon>
<span class="uk-margin-small-left uk-width-expand">Move Up</span>
</div>
</a>
</li>
<li *ngIf="i < stakeholder.topics.length - 1">
<a (click)="hide(element);moveTopic(i, i + 1)">
<div class="uk-flex uk-flex-middle">
<icon [flex]="true" name="south" ratio="0.6"></icon>
<span class="uk-margin-small-left uk-width-expand">Move Down</span>
</div>
</a>
</li>
<li class="uk-nav-divider"></li>
</ng-container>
<ng-template ngFor [ngForOf]="stakeholderUtils.visibility" let-v>
<li [class.uk-active]="topic.visibility === v.value">
<a (click)="changeTopicStatus(i, v.value);">
<a (click)="changeTopicStatus(i, v.value)">
<div class="uk-flex uk-flex-middle">
<icon [flex]="true" [name]="v.icon" ratio="0.6"></icon>
<span class="uk-margin-small-left uk-width-expand">{{v.label}}</span>
@ -55,13 +77,18 @@
</ng-template>
<ng-container *ngIf="!topic.defaultId && isCurator">
<li class="uk-nav-divider">
<li>
<a (click)="deleteTopicOpen(i, 'delete'); hide(element)">Delete</a>
<!--<ng-container *ngIf="!stakeholder.defaultId">
<a (click)="deleteTopicOpen(i, 'delete'); hide(element)">Delete from all profiles</a>
<a (click)="deleteTopicOpen(i, 'disconnect'); hide(element)">Delete and disconnect from all profiles</a>
</ng-container>-->
</li>
<li>
<a (click)="deleteTopicOpen(i, 'delete'); hide(element)">
<div class="uk-flex uk-flex-middle">
<icon [flex]="true" name="delete" ratio="0.6"></icon>
<span class="uk-margin-small-left uk-width-expand">Delete</span>
</div>
</a>
<!--<ng-container *ngIf="!stakeholder.defaultId">
<a (click)="deleteTopicOpen(i, 'delete'); hide(element)">Delete from all profiles</a>
<a (click)="deleteTopicOpen(i, 'disconnect'); hide(element)">Delete and disconnect from all profiles</a>
</ng-container>-->
</li>
</ng-container>
</ul>
</div>

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

@ -16,6 +16,9 @@ import {Option} from "../openaireLibrary/sharedComponents/input/input.component"
import {properties} from "../../environments/environment";
import {Session, User} from "../openaireLibrary/login/utils/helper.class";
import {UserManagementService} from "../openaireLibrary/services/user-management.service";
import {TransitionGroupComponent} from "../openaireLibrary/utils/transition-group/transition-group.component";
import {error} from "protractor";
import {NotificationHandler} from "../openaireLibrary/utils/notification-handler";
declare var UIkit;
@ -59,6 +62,8 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
@ViewChild('deleteModal', {static: true}) deleteModal: AlertModal;
@ViewChild('editModal', {static: true}) editModal: AlertModal;
@ViewChild("topics") topics: TransitionGroupComponent;
public elementChildrenActionOnDelete: string;
public filters: FormGroup;
public all: Option = {
@ -209,6 +214,7 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
let callback = (topic: Topic): void => {
if (this.index === -1) {
this.stakeholder.topics.push(topic);
this.topics.init();
} else {
this.stakeholder.topics[this.index] = HelperFunctions.copy(topic);
}
@ -230,7 +236,6 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
this.changeStatus(this.stakeholder.topics[index], path, visibility);
}
public deleteTopicOpen(index = this.topicIndex, childrenAction: string = null) {
this.type = 'topic';
this.index = index;
@ -246,10 +251,26 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
let callback = (): void => {
this.topicIndex = Math.max(0, this.index - 1);
this.stakeholder.topics.splice(this.index, 1);
this.topics.init();
};
this.delete('Topic has been successfully be deleted', path, callback, (this.topicIndex === this.index));
}
public moveTopic(index: number, newIndex: number = index - 1) {
this.topics.init();
let path = [this.stakeholder._id];
let ids = this.stakeholder.topics.map(topic => topic._id);
HelperFunctions.swap(ids, index, newIndex);
this.stakeholderService.reorderElements(properties.monitorServiceAPIURL, path, ids).subscribe(() => {
HelperFunctions.swap(this.stakeholder.topics, index, newIndex);
if(this.topicIndex === index) {
this.topicIndex = newIndex;
}
}, error => {
NotificationHandler.rise(error.error.message)
});
}
public chooseCategory(index: number) {
this.categoryIndex = index;
this.subCategoryIndex = 0;
@ -480,22 +501,14 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
this.subscriptions.push(this.stakeholderService.saveElement(this.properties.monitorServiceAPIURL, saveElement, path).subscribe(saveElement => {
callback(saveElement);
this.stakeholderChanged();
UIkit.notification(message, {
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
NotificationHandler.rise(message);
if (redirect) {
this.router.navigate(['../' + saveElement.alias], {
relativeTo: this.route
});
}
}, error => {
UIkit.notification(error.error.message, {
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
NotificationHandler.rise(error.error.message, 'danger');
}));
}
@ -503,37 +516,21 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
this.subscriptions.push(this.stakeholderService.deleteElement(this.properties.monitorServiceAPIURL, path, this.elementChildrenActionOnDelete).subscribe(() => {
callback();
this.stakeholderChanged();
UIkit.notification(message, {
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
NotificationHandler.rise(message);
if (redirect) {
this.back();
}
}, error => {
UIkit.notification(error.error.message, {
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
NotificationHandler.rise(error.error.message, 'danger');
}));
}
private changeStatus(element: Topic | Category | SubCategory, path: string[], visibility: Visibility) {
this.subscriptions.push(this.stakeholderService.changeVisibility(this.properties.monitorServiceAPIURL, path, visibility).subscribe(visibility => {
element.visibility = visibility;
UIkit.notification(StringUtils.capitalize(this.type) + ' has been <b>successfully changed</b> to ' + element.visibility.toLowerCase(), {
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
NotificationHandler.rise(StringUtils.capitalize(this.type) + ' has been <b>successfully changed</b> to ' + element.visibility.toLowerCase());
}, error => {
UIkit.notification(error.error.message, {
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
NotificationHandler.rise(error.error.message, 'danger');
}));
}

3
src/app/topic/topic.module.ts
View File

@ -19,11 +19,12 @@ import {PageContentModule} from "../openaireLibrary/dashboard/sharedComponents/p
import {LoadingModule} from "../openaireLibrary/utils/loading/loading.module";
import {NotifyFormModule} from "../openaireLibrary/notifications/notify-form/notify-form.module";
import {LogoUrlPipeModule} from "../openaireLibrary/utils/pipes/logoUrlPipe.module";
import {TransitionGroupModule} from "../openaireLibrary/utils/transition-group/transition-group.module";
@NgModule({
imports: [
CommonModule, TopicRoutingModule, ClickModule, RouterModule, FormsModule, AlertModalModule,
ReactiveFormsModule, InputModule, IconsModule, PageContentModule, LoadingModule, NotifyFormModule, LogoUrlPipeModule
ReactiveFormsModule, InputModule, IconsModule, PageContentModule, LoadingModule, NotifyFormModule, LogoUrlPipeModule, TransitionGroupModule
],
declarations: [
TopicComponent, IndicatorsComponent

17
src/app/users/users.component.html
View File

@ -3,23 +3,18 @@
<loading></loading>
</div>
</div>
<ng-template #tabs>
<div class="uk-margin uk-margin-remove-bottom">
<ul class="uk-tab">
<li [class.uk-active]="tab === 'manager'"><a routerLink="../manager">Managers</a></li>
<li [class.uk-active]="tab === 'member'"><a routerLink="../member">Members</a></li>
</ul>
</div>
</ng-template>
<role-users *ngIf="!loading && stakeholder" [id]="stakeholder.alias" [type]="stakeholder.type" [name]="stakeholder.name" [link]="link" [role]="tab" [message]="messages.get(tab)"
[emailComposer]="emailComposer" [notificationFn]="notificationFn" (stickyEmitter)="stickyPageHeader = $event">
<div class="uk-flex uk-flex-middle uk-margin-top info" [class.uk-active]="stickyPageHeader">
[emailComposer]="emailComposer" [notificationFn]="notificationFn">
<div class="uk-flex uk-flex-middle uk-margin-top info">
<img [src]="stakeholder | logoUrl" class="uk-margin-right uk-blend-multiply">
<div>
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">Admin Dashboard - Manage {{users}}</div>
<h1 class="uk-h4 uk-margin-remove">{{stakeholder.name}}</h1>
</div>
</div>
<ng-container [ngTemplateOutlet]="tabs"></ng-container>
<ul class="uk-tab">
<li [class.uk-active]="tab === 'manager'"><a routerLink="../manager">Managers</a></li>
<li [class.uk-active]="tab === 'member'"><a routerLink="../member">Members</a></li>
</ul>
</role-users>

1
src/app/users/users.component.ts
View File

@ -46,7 +46,6 @@ export class UsersComponent implements OnInit {
notification.groups = [recipient];
return notification;
}
public stickyPageHeader: boolean = false;
constructor(private stakeholderService: StakeholderService,
private userManagementService: UserManagementService,

2
src/assets/dashboard-theme

@ -1 +1 @@
Subproject commit 141c71c3104bab1382e6008697043ea87e03ea44
Subproject commit 00fc1f9e2b9158a6be224061d742cf80a043fab8