Compare commits
27 Commits
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "monitor-dashboard",
|
"name": "monitor-dashboard",
|
||||||
"version": "1.0.2",
|
"version": "1.1.1",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"ng": "ng",
|
"ng": "ng",
|
||||||
"start": "ng serve --port 4600 --disable-host-check --host 0.0.0.0",
|
"start": "ng serve --port 4600 --disable-host-check --host 0.0.0.0",
|
||||||
|
|
|
@ -81,7 +81,7 @@ export function app() {
|
||||||
}));
|
}));
|
||||||
if (userinfoRes.status === 200) {
|
if (userinfoRes.status === 200) {
|
||||||
let user = new User(userinfoRes.data);
|
let user = new User(userinfoRes.data);
|
||||||
let stakeholderRes = (await axios.get<Stakeholder>(properties.monitorServiceAPIURL + '/stakeholder/' + encodeURIComponent(req.params.alias), {
|
let stakeholderRes = (await axios.get<Stakeholder>(properties.monitorServiceAPIURL + 'stakeholder/' + encodeURIComponent(req.params.alias), {
|
||||||
withCredentials: true,
|
withCredentials: true,
|
||||||
headers: headers
|
headers: headers
|
||||||
}).catch(error => {
|
}).catch(error => {
|
||||||
|
|
|
@ -4,6 +4,9 @@
|
||||||
<div *ngIf="!loading" [class.monitor]="isFrontPage">
|
<div *ngIf="!loading" [class.monitor]="isFrontPage">
|
||||||
<div id="modal-container"></div>
|
<div id="modal-container"></div>
|
||||||
<ng-container *ngIf="!isHidden">
|
<ng-container *ngIf="!isHidden">
|
||||||
|
<div *ngIf="divContents && divContents['banner']" class="uk-tile uk-tile-default uk-padding uk-border-bottom">
|
||||||
|
<helper [texts]="divContents['banner']"></helper>
|
||||||
|
</div>
|
||||||
<navbar *ngIf="hasHeader" portal="monitor_dashboard" [header]="menuHeader" [userMenuItems]=userMenuItems
|
<navbar *ngIf="hasHeader" portal="monitor_dashboard" [header]="menuHeader" [userMenuItems]=userMenuItems
|
||||||
[menuItems]="menuItems" [user]="user"
|
[menuItems]="menuItems" [user]="user"
|
||||||
[notificationConfiguration]="isMobile && user && notificationGroupsInitialized?notificationConfiguration:null"></navbar>
|
[notificationConfiguration]="isMobile && user && notificationGroupsInitialized?notificationConfiguration:null"></navbar>
|
||||||
|
|
|
@ -27,6 +27,7 @@ import {
|
||||||
import {SidebarBaseComponent} from "./openaireLibrary/dashboard/sharedComponents/sidebar/sidebar-base.component";
|
import {SidebarBaseComponent} from "./openaireLibrary/dashboard/sharedComponents/sidebar/sidebar-base.component";
|
||||||
import {Breadcrumb} from './openaireLibrary/utils/breadcrumbs/breadcrumbs.component';
|
import {Breadcrumb} from './openaireLibrary/utils/breadcrumbs/breadcrumbs.component';
|
||||||
import {OpenaireEntities} from './openaireLibrary/utils/properties/searchFields';
|
import {OpenaireEntities} from './openaireLibrary/utils/properties/searchFields';
|
||||||
|
import {HelperService} from "./openaireLibrary/utils/helper/helper.service";
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -73,6 +74,7 @@ export class AppComponent extends SidebarBaseComponent implements OnInit {
|
||||||
paramsSubscription: Subscription;
|
paramsSubscription: Subscription;
|
||||||
openaireEntities = OpenaireEntities;
|
openaireEntities = OpenaireEntities;
|
||||||
activeType: StakeholderType;
|
activeType: StakeholderType;
|
||||||
|
divContents: any;
|
||||||
|
|
||||||
constructor(protected _route: ActivatedRoute,
|
constructor(protected _route: ActivatedRoute,
|
||||||
protected _router: Router,
|
protected _router: Router,
|
||||||
|
@ -82,16 +84,18 @@ export class AppComponent extends SidebarBaseComponent implements OnInit {
|
||||||
private smoothScroll: SmoothScroll,
|
private smoothScroll: SmoothScroll,
|
||||||
private stakeholderService: StakeholderService,
|
private stakeholderService: StakeholderService,
|
||||||
private configurationService: ConfigurationService,
|
private configurationService: ConfigurationService,
|
||||||
|
private helper: HelperService,
|
||||||
private resourcesService: ResourcesService) {
|
private resourcesService: ResourcesService) {
|
||||||
super();
|
super();
|
||||||
this.initRouterParams(_route, event => {
|
this.initRouterParams(_route, event => {
|
||||||
this.isBrowse = event.url.includes('browse');
|
this.isBrowse = event.url.includes('browse');
|
||||||
this.isSearch = event.url.includes('search');
|
this.isSearch = event.url.includes('search/find');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
super.ngOnInit();
|
super.ngOnInit();
|
||||||
|
this.getDivContents();
|
||||||
if (typeof document !== 'undefined' && window) {
|
if (typeof document !== 'undefined' && window) {
|
||||||
this.innerWidth = window.innerWidth;
|
this.innerWidth = window.innerWidth;
|
||||||
}
|
}
|
||||||
|
@ -220,7 +224,7 @@ export class AppComponent extends SidebarBaseComponent implements OnInit {
|
||||||
this.notificationConfiguration.availableGroups.push({value: Role.typeMember(type.value), label: type.label + ' Members'});
|
this.notificationConfiguration.availableGroups.push({value: Role.typeMember(type.value), label: type.label + ' Members'});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.subscriptions.push(this.stakeholderService.getMyStakeholders(this.properties.monitorServiceAPIURL).subscribe(manageStakeholder => {
|
this.subscriptions.push(this.stakeholderService.getMyStakeholders().subscribe(manageStakeholder => {
|
||||||
let stakeholders = manageStakeholder.standalone;
|
let stakeholders = manageStakeholder.standalone;
|
||||||
stakeholders.concat(manageStakeholder.umbrella);
|
stakeholders.concat(manageStakeholder.umbrella);
|
||||||
stakeholders.concat(manageStakeholder.dependent);
|
stakeholders.concat(manageStakeholder.dependent);
|
||||||
|
@ -267,6 +271,12 @@ export class AppComponent extends SidebarBaseComponent implements OnInit {
|
||||||
this.smoothScroll.clearSubscriptions();
|
this.smoothScroll.clearSubscriptions();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private getDivContents() {
|
||||||
|
this.subscriptions.push(this.helper.getDivHelpContents(this.properties, 'monitor', '/').subscribe(contents => {
|
||||||
|
this.divContents = contents;
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
private navigateToError() {
|
private navigateToError() {
|
||||||
this._router.navigate([this.properties.errorLink], {queryParams: {'page': this.properties.baseLink + this._router.url}});
|
this._router.navigate([this.properties.errorLink], {queryParams: {'page': this.properties.baseLink + this._router.url}});
|
||||||
}
|
}
|
||||||
|
@ -299,7 +309,7 @@ export class AppComponent extends SidebarBaseComponent implements OnInit {
|
||||||
if(this.isChild) {
|
if(this.isChild) {
|
||||||
return this.stakeholder.parent.alias + '/browse/' + this.stakeholder.type + '/';
|
return this.stakeholder.parent.alias + '/browse/' + this.stakeholder.type + '/';
|
||||||
} else {
|
} else {
|
||||||
return '';
|
return '/';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -433,6 +443,7 @@ export class AppComponent extends SidebarBaseComponent implements OnInit {
|
||||||
this.resourcesService.setResources(this.menuItems, '', this.monitorLink);
|
this.resourcesService.setResources(this.menuItems, '', this.monitorLink);
|
||||||
this.menuItems.push(new MenuItem("support", "Support", this.monitorLink + '/support/', "", false, [], null, {}, null, null, null, null, "_self"));
|
this.menuItems.push(new MenuItem("support", "Support", this.monitorLink + '/support/', "", false, [], null, {}, null, null, null, null, "_self"));
|
||||||
this.menuItems.push(new MenuItem("about", "About", this.monitorLink + '/about/', "", false, [], null, {}, null, null, null, null, "_self"));
|
this.menuItems.push(new MenuItem("about", "About", this.monitorLink + '/about/', "", false, [], null, {}, null, null, null, null, "_self"));
|
||||||
|
this.menuItems.push(new MenuItem("subscriptions", "Subscriptions", this.monitorLink + "/subscriptions", "", false, [], null, {}, null, null, null, null, "_self"));
|
||||||
if (this.hasAdminMenu) {
|
if (this.hasAdminMenu) {
|
||||||
this.adminMenuItems = [];
|
this.adminMenuItems = [];
|
||||||
this.backItem = null;
|
this.backItem = null;
|
||||||
|
|
|
@ -34,6 +34,7 @@ import {CustomRouteReuseStrategy} from "./openaireLibrary/shared/custom-route-re
|
||||||
import {RouteReuseStrategy} from "@angular/router";
|
import {RouteReuseStrategy} from "@angular/router";
|
||||||
import {LogoUrlPipeModule} from './openaireLibrary/utils/pipes/logoUrlPipe.module';
|
import {LogoUrlPipeModule} from './openaireLibrary/utils/pipes/logoUrlPipe.module';
|
||||||
import {BreadcrumbsModule} from './openaireLibrary/utils/breadcrumbs/breadcrumbs.module';
|
import {BreadcrumbsModule} from './openaireLibrary/utils/breadcrumbs/breadcrumbs.module';
|
||||||
|
import {HelperModule} from "./openaireLibrary/utils/helper/helper.module";
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
|
|
||||||
|
@ -51,7 +52,7 @@ import {BreadcrumbsModule} from './openaireLibrary/utils/breadcrumbs/breadcrumbs
|
||||||
AppRoutingModule,
|
AppRoutingModule,
|
||||||
SideBarModule, Schema2jsonldModule, RoleVerificationModule, LoadingModule, NotificationsSidebarModule, IconsModule, CacheIndicatorsModule,
|
SideBarModule, Schema2jsonldModule, RoleVerificationModule, LoadingModule, NotificationsSidebarModule, IconsModule, CacheIndicatorsModule,
|
||||||
LogoUrlPipeModule,
|
LogoUrlPipeModule,
|
||||||
BreadcrumbsModule
|
BreadcrumbsModule, HelperModule
|
||||||
],
|
],
|
||||||
declarations: [AppComponent, OpenaireErrorPageComponent],
|
declarations: [AppComponent, OpenaireErrorPageComponent],
|
||||||
exports: [AppComponent],
|
exports: [AppComponent],
|
||||||
|
|
|
@ -23,7 +23,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="uk-flex uk-flex-middle uk-flex-between uk-margin-large-top">
|
<div class="uk-grid uk-flex-middle uk-flex-between@m uk-flex-center uk-margin-large-top" [id]="id" uk-grid>
|
||||||
<div class="uk-flex uk-flex-middle">
|
<div class="uk-flex uk-flex-middle">
|
||||||
<div *ngIf="sortOptions?.length > 0" class="uk-width-small uk-margin-medium-right">
|
<div *ngIf="sortOptions?.length > 0" class="uk-width-small uk-margin-medium-right">
|
||||||
<div input
|
<div input
|
||||||
|
@ -46,7 +46,7 @@
|
||||||
</paging-no-load>
|
</paging-no-load>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="uk-margin-large-top" id="target">
|
<div class="uk-margin-large-top">
|
||||||
<div *ngIf="!filteredStakeholders || filteredStakeholders?.length == 0" class="uk-flex uk-flex-center">
|
<div *ngIf="!filteredStakeholders || filteredStakeholders?.length == 0" class="uk-flex uk-flex-center">
|
||||||
<div class="uk-alert uk-alert-primary uk-text-center uk-width-2-3@m uk-width-1-1">
|
<div class="uk-alert uk-alert-primary uk-text-center uk-width-2-3@m uk-width-1-1">
|
||||||
No {{entities.stakeholders}} available
|
No {{entities.stakeholders}} available
|
||||||
|
@ -106,7 +106,7 @@
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<div class="uk-text-truncate uk-text-capitalize uk-text-italic uk-text-small uk-text-bold" [title]="item.name">
|
<div class="uk-width-large uk-text-truncate uk-text-capitalize uk-text-italic uk-text-small uk-text-bold" [title]="item.name">
|
||||||
{{item.name}}
|
{{item.name}}
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
|
|
|
@ -26,12 +26,12 @@ import {PiwikService} from "../openaireLibrary/utils/piwik/piwik.service";
|
||||||
</div>
|
</div>
|
||||||
<h3>For {{openaireEntities.RESULTS | lowercase}}</h3>
|
<h3>For {{openaireEntities.RESULTS | lowercase}}</h3>
|
||||||
<div class="uk-margin-bottom">
|
<div class="uk-margin-bottom">
|
||||||
For {{openaireEntities.RESULTS | lowercase}} ({{openaireEntities.PUBLICATIONS | lowercase}}, {{openaireEntities.DATASETS | lowercase}}, {{openaireEntities.SOFTWARE | lowercase}} and {{openaireEntities.OTHER | lowercase}}) you can use the Selective Access APIs by adding the funder parameter.
|
For {{openaireEntities.RESULTS | lowercase}} ({{openaireEntities.PUBLICATIONS | lowercase}}, {{openaireEntities.DATASETS | lowercase}}, {{openaireEntities.SOFTWARE | lowercase}} and {{openaireEntities.OTHER | lowercase}}) you can use the Graph API by adding the funder parameter.
|
||||||
</div>
|
</div>
|
||||||
<a class="uk-display-inline-block uk-button uk-button-text"
|
<a class="uk-display-inline-block uk-button uk-button-text"
|
||||||
href="https://graph.openaire.eu/develop/api.html" target="_blank">
|
href="https://graph.openaire.eu/docs/apis/search-api/research-products" target="_blank">
|
||||||
<span class="uk-flex uk-flex-middle">
|
<span class="uk-flex uk-flex-middle">
|
||||||
<span>Selective Access APIs</span>
|
<span>Graph API</span>
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -44,17 +44,17 @@ import {PiwikService} from "../openaireLibrary/utils/piwik/piwik.service";
|
||||||
</div>
|
</div>
|
||||||
<h3>For {{openaireEntities.PROJECTS | lowercase}}</h3>
|
<h3>For {{openaireEntities.PROJECTS | lowercase}}</h3>
|
||||||
<div class="uk-margin-bottom">
|
<div class="uk-margin-bottom">
|
||||||
For {{openaireEntities.PROJECTS | lowercase}} you can use the Selective Access APIs and the Bulk Access APIs.
|
For {{openaireEntities.PROJECTS | lowercase}} you can use the Graph API and the Bulk Access APIs.
|
||||||
</div>
|
</div>
|
||||||
<div class="uk-flex uk-flex-column uk-flex-center uk-flex-middle">
|
<div class="uk-flex uk-flex-column uk-flex-center uk-flex-middle">
|
||||||
<a class="uk-display-inline-block uk-button uk-button-text uk-margin-bottom"
|
<a class="uk-display-inline-block uk-button uk-button-text uk-margin-bottom"
|
||||||
href="https://graph.openaire.eu/develop/api.html" target="_blank">
|
href="https://graph.openaire.eu/docs/apis/search-api/projects" target="_blank">
|
||||||
<span class="uk-flex uk-flex-middle">
|
<span class="uk-flex uk-flex-middle">
|
||||||
<span>Selective Access APIs</span>
|
<span>Graph API</span>
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
<a class="uk-display-inline-block uk-button uk-button-text"
|
<a class="uk-display-inline-block uk-button uk-button-text"
|
||||||
href="https://graph.openaire.eu/develop/bulk-projects.html" target="_blank">
|
href="https://graph.openaire.eu/docs/apis/dspace-eprints-api" target="_blank">
|
||||||
<span class="uk-flex uk-flex-middle">
|
<span class="uk-flex uk-flex-middle">
|
||||||
<span>Bulk Access APIs</span>
|
<span>Bulk Access APIs</span>
|
||||||
</span>
|
</span>
|
||||||
|
@ -110,9 +110,9 @@ import {PiwikService} from "../openaireLibrary/utils/piwik/piwik.service";
|
||||||
<li>
|
<li>
|
||||||
<span>For the </span><span class="uk-text-bolder">Bulk Access</span><br>
|
<span>For the </span><span class="uk-text-bolder">Bulk Access</span><br>
|
||||||
<span class="uk-text-bold uk-text-nowrap">DSpace endpoint:</span>
|
<span class="uk-text-bold uk-text-nowrap">DSpace endpoint:</span>
|
||||||
<span class="uk-text-break uk-margin-small-left">https://api.openaire.eu/projects/dspace/{{stakeholder.index_shortName}}/ALL/ ALL</span><br>
|
<span class="uk-text-break uk-margin-small-left">https://api.openaire.eu/projects/dspace/{{stakeholder.index_shortName}}/ALL/ALL</span><br>
|
||||||
<span class="uk-text-bold uk-text-nowrap">ePrints endpoint:</span>
|
<span class="uk-text-bold uk-text-nowrap">ePrints endpoint:</span>
|
||||||
<span class="uk-text-break uk-margin-small-left">https://api.openaire.eu/projects/eprints/{{stakeholder.index_shortName}}/ALL/ ALL</span>
|
<span class="uk-text-break uk-margin-small-left">https://api.openaire.eu/projects/eprints/{{stakeholder.index_shortName}}/ALL/ALL</span>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,316 +1,344 @@
|
||||||
<ng-template #selected_filters_pills>
|
<ng-template #selected_filters_pills>
|
||||||
<div class="uk-slider filters-slider" uk-slider="finite: true">
|
<div class="uk-slider filters-slider" uk-slider="finite: true">
|
||||||
<div [class.uk-invisible]="list.children.length === 0" class="uk-position-relative">
|
<div [class.uk-invisible]="list.children.length === 0" class="uk-position-relative">
|
||||||
<div class="uk-slider-container" style="height: 40px">
|
<div class="uk-slider-container" style="height: 40px">
|
||||||
<ul #list class="uk-slider-items uk-grid uk-grid-small uk-margin-small-right uk-flex-nowrap">
|
<ul #list class="uk-slider-items uk-grid uk-grid-small uk-margin-small-right uk-flex-nowrap">
|
||||||
<li *ngIf="periodFilter.selectedFromAndToValues.length > 0">
|
<li *ngIf="periodFilter.selectedFromAndToValues.length > 0">
|
||||||
<span class="uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle">
|
<span class="uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle">
|
||||||
<span
|
<span
|
||||||
class="uk-margin-small-right uk-width-expand uk-text-truncate">{{periodFilter.selectedFromAndToValues}}</span>
|
class="uk-margin-small-right uk-width-expand uk-text-truncate">{{ periodFilter.selectedFromAndToValues }}</span>
|
||||||
<button [class.uk-disabled]="loading" (click)="clearPeriodFilter()" class="uk-close uk-icon"
|
<button [class.uk-disabled]="loading" (click)="clearPeriodFilter()" class="uk-close uk-icon"
|
||||||
[disabled]="loading">
|
[disabled]="loading">
|
||||||
<icon name="close" flex="true" ratio="0.7"></icon>
|
<icon name="close" flex="true" ratio="0.7"></icon>
|
||||||
</button>
|
</button>
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
<ng-container *ngFor="let filter of filters">
|
<ng-container *ngFor="let filter of filters">
|
||||||
<ng-container *ngIf="filter.countSelectedValues > 0">
|
<ng-container *ngIf="filter.countSelectedValues > 0">
|
||||||
<ng-container *ngFor="let value of filter.values; let i = index;">
|
<ng-container *ngFor="let value of filter.values; let i = index;">
|
||||||
<ng-container *ngIf="value.selected">
|
<ng-container *ngIf="value.selected">
|
||||||
<li>
|
<li>
|
||||||
<span class="uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle">
|
<span class="uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle">
|
||||||
<span class="uk-margin-small-right uk-width-expand uk-text-truncate">{{value.name}}</span>
|
<span class="uk-margin-small-right uk-width-expand uk-text-truncate">{{ value.name }}</span>
|
||||||
<button [class.uk-disabled]="loading" (click)="clearFilterValue(filter, value)"
|
<button [class.uk-disabled]="loading" (click)="clearFilterValue(filter, value)"
|
||||||
class="uk-close uk-icon" [disabled]="loading">
|
class="uk-close uk-icon" [disabled]="loading">
|
||||||
<icon name="close" flex="true" ratio="0.7"></icon>
|
<icon name="close" flex="true" ratio="0.7"></icon>
|
||||||
</button>
|
</button>
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<slider-arrow type="previous"></slider-arrow>
|
<slider-arrow type="previous"></slider-arrow>
|
||||||
<slider-arrow type="next"></slider-arrow>
|
<slider-arrow type="next"></slider-arrow>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<div page-content [border]="isMobile">
|
<div page-content [border]="isMobile">
|
||||||
<div header>
|
<div header>
|
||||||
<div *ngIf="stakeholder" class="uk-hidden">
|
<div *ngIf="stakeholder" class="uk-hidden">
|
||||||
<h1 class="uk-h6 uk-margin-remove">{{stakeholder.name}}</h1>
|
<h1 class="uk-h6 uk-margin-remove">{{ stakeholder.name }}</h1>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div actions>
|
||||||
<div actions>
|
<sidebar-mobile-toggle *ngIf="isMobile"
|
||||||
<sidebar-mobile-toggle *ngIf="isMobile" [class.uk-margin-bottom]="!activeCategory || countSubCategoriesToShow(activeCategory) <= 1" class="uk-margin-top uk-display-block"></sidebar-mobile-toggle>
|
[class.uk-margin-bottom]="!activeCategory || countSubCategoriesToShow(activeCategory) <= 1"
|
||||||
<div *ngIf="activeCategory && countSubCategoriesToShow(activeCategory) > 1"
|
class="uk-margin-top uk-display-block"></sidebar-mobile-toggle>
|
||||||
[class.uk-margin-bottom]="isMobile" class="uk-margin-medium-top">
|
<div *ngIf="activeCategory && countSubCategoriesToShow(activeCategory) > 1"
|
||||||
<slider-tabs *ngIf="stakeholder && !loading && activeTopic" [border]="!isMobile"
|
[class.uk-margin-bottom]="isMobile" class="uk-margin-medium-top">
|
||||||
[tabsClass]="isMobile?'uk-subnav uk-subnav-pill-alt uk-text-small':'uk-tab'" [type]="'dynamic'">
|
<slider-tabs *ngIf="stakeholder && !loading && activeTopic" [border]="!isMobile"
|
||||||
<ng-template ngFor [ngForOf]="activeCategory.subCategories" let-subCategory>
|
[tabsClass]="isMobile?'uk-subnav uk-subnav-pill-alt uk-text-small':'uk-tab'"
|
||||||
<slider-tab *ngIf="hasPermission(subCategory.visibility)" [tabTitle]="subCategory.name"
|
[type]="'dynamic'">
|
||||||
[queryParams]="queryParams" customClass="uk-text-uppercase"
|
<ng-template ngFor [ngForOf]="activeCategory.subCategories" let-subCategory>
|
||||||
[routerLink]="['/', stakeholder.alias, activeTopic.alias, activeCategory.alias, subCategory.alias]"
|
<slider-tab *ngIf="hasPermission(subCategory.visibility)" [tabTitle]="subCategory.name"
|
||||||
[active]="subCategory.alias === activeSubCategory.alias"></slider-tab>
|
[queryParams]="queryParams" customClass="uk-text-uppercase"
|
||||||
</ng-template>
|
[routerLink]="[aliasPrefix, stakeholder.alias, activeTopic.alias, activeCategory.alias, subCategory.alias]"
|
||||||
</slider-tabs>
|
[active]="subCategory.alias === activeSubCategory.alias"></slider-tab>
|
||||||
|
</ng-template>
|
||||||
|
</slider-tabs>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div inner>
|
||||||
<div inner>
|
<div *ngIf="privateStakeholder" class="message">
|
||||||
<div *ngIf="privateStakeholder" class="message">
|
<div class="uk-text-center">
|
||||||
<div class="uk-text-center">
|
<h3 class="uk-flex uk-flex-middle">
|
||||||
<h3 class="uk-flex uk-flex-middle">
|
<icon name="incognito" ratio="2" visuallyHidden="private"></icon>
|
||||||
<icon name="incognito" ratio="2" visuallyHidden="private"></icon>
|
<span class="uk-margin-left">Private data</span>
|
||||||
<span class="uk-margin-left">Private data</span>
|
</h3>
|
||||||
</h3>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div *ngIf="!privateStakeholder && stakeholder" class="uk-section">
|
||||||
<div *ngIf="!privateStakeholder && stakeholder" class="uk-section">
|
<div *ngIf="activeSubCategory?.description" class="uk-margin-medium-bottom">
|
||||||
<div *ngIf="activeSubCategory?.description" class="uk-margin-medium-bottom">
|
{{ activeSubCategory.description }}
|
||||||
{{activeSubCategory.description}}
|
</div>
|
||||||
</div>
|
<div *ngIf="(activeSubCategory && (activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
|
||||||
<div *ngIf="(activeSubCategory && (activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
|
|
||||||
&& ((activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0) ||
|
&& ((activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0) ||
|
||||||
(activeCategory && activeCategory.description && activeCategory.description.length > 0) ||
|
(activeCategory && activeCategory.description && activeCategory.description.length > 0) ||
|
||||||
(activeTopic && activeTopic.description && activeTopic.description.length > 0))" class="uk-text-center">
|
(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">
|
<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 :
|
activeSubCategory && activeSubCategory.description && activeSubCategory.description.length > 0 ? activeSubCategory.description
|
||||||
(activeTopic.description && activeTopic.description.length > 0 ? activeTopic.description : ""))}}
|
: (activeCategory && activeCategory.description && activeCategory.description.length > 0 ? activeCategory.description :
|
||||||
</div>
|
(activeTopic.description && activeTopic.description.length > 0 ? activeTopic.description : ""))
|
||||||
</div>
|
}}
|
||||||
<ng-template [ngIf]="!loading && !privateStakeholder &&
|
</div>
|
||||||
|
</div>
|
||||||
|
<ng-template [ngIf]="!loading && !privateStakeholder &&
|
||||||
(!activeSubCategory ||
|
(!activeSubCategory ||
|
||||||
((activeSubCategory.numbers.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.numbers) == 0) &&
|
((activeSubCategory.numbers.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.numbers) == 0) &&
|
||||||
(activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
|
(activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
|
||||||
|| !activeTopic || !activeCategory || !activeSubCategory)" [ngIfElse]="content">
|
|| !activeTopic || !activeCategory || !activeSubCategory)" [ngIfElse]="content">
|
||||||
<div class="message uk-text-center">
|
<div class="message uk-text-center">
|
||||||
<h3>
|
<h3>
|
||||||
Nothing to see here!
|
Nothing to see here!
|
||||||
</h3>
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<ng-template #content>
|
<ng-template #content>
|
||||||
<div *ngIf="countSectionsWithIndicatorsToShow(activeSubCategory.numbers) > 0" class="uk-margin-medium-bottom">
|
<div *ngIf="countSectionsWithIndicatorsToShow(activeSubCategory.numbers) > 0"
|
||||||
<ng-container *ngFor="let number of activeSubCategory.numbers; let i = index;">
|
class="uk-margin-medium-bottom">
|
||||||
<ng-container *ngIf="!isMobile && countIndicatorsToShow(number.indicators) > 0">
|
<ng-container *ngFor="let number of activeSubCategory.numbers; let i = index;">
|
||||||
<div class="uk-grid uk-grid-small uk-grid-match uk-margin-medium-bottom" uk-grid
|
<ng-container *ngIf="!isMobile && countIndicatorsToShow(number.indicators) > 0">
|
||||||
uk-height-match="target: .uk-card">
|
<div class="uk-grid uk-grid-small uk-grid-match uk-margin-medium-bottom" uk-grid
|
||||||
<h5 *ngIf="number.title" class="uk-width-1-1 uk-margin-bottom">{{number.title}}</h5>
|
uk-height-match="target: .uk-card">
|
||||||
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
|
<h5 *ngIf="number.title" class="uk-width-1-1 uk-margin-bottom">{{ number.title }}</h5>
|
||||||
<div *ngIf="hasPermission(indicator.visibility)" [ngClass]="getNumberClassBySize(indicator.width)">
|
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
|
||||||
<div class="uk-card uk-card-default uk-padding-small number-card uk-position-relative"
|
<div *ngIf="hasPermission(indicator.visibility)"
|
||||||
[class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
|
[ngClass]="getNumberClassBySize(indicator.width)">
|
||||||
<div *ngIf="!indicator.overlay">
|
<div class="uk-card uk-card-default uk-padding-small number-card uk-position-relative"
|
||||||
<div class="uk-text-small uk-text-truncate uk-margin-xsmall-bottom uk-margin-right">{{indicator.name}}</div>
|
[class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
|
||||||
<div class="number uk-text-small uk-text-bold">
|
<div *ngIf="!indicator.overlay">
|
||||||
|
<div class="uk-text-small uk-text-truncate uk-margin-xsmall-bottom uk-margin-right">{{ indicator.name }}</div>
|
||||||
|
<div class="number uk-text-small uk-text-bold">
|
||||||
<span *ngIf="numberResults.get(i + '-' + j + '-' + 0)"
|
<span *ngIf="numberResults.get(i + '-' + j + '-' + 0)"
|
||||||
[innerHTML]="(indicator.indicatorPaths[0].format == 'NUMBER'?(numberResults.get(i + '-' + j + '-' + 0) | numberRound: 2:1:stakeholder.locale):(numberResults.get(i + '-' + j + '-' + 0) | numberPercentage: stakeholder.locale))"></span>
|
[innerHTML]="(indicator.indicatorPaths[0].format == 'NUMBER'?(numberResults.get(i + '-' + j + '-' + 0) | numberRound: 2:1:stakeholder.locale):(numberResults.get(i + '-' + j + '-' + 0) | numberPercentage: stakeholder.locale))"></span>
|
||||||
<span *ngIf="!numberResults.get(i + '-' + j + '-' + 0)">--</span>
|
<span *ngIf="!numberResults.get(i + '-' + j + '-' + 0)">--</span>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="indicator.description || indicator.additionalDescription"
|
<div *ngIf="indicator.description || indicator.additionalDescription"
|
||||||
class="uk-position-top-right uk-text-center uk-margin-small-top uk-margin-small-right uk-visible@m">
|
class="uk-position-top-right uk-text-center uk-margin-small-top uk-margin-small-right uk-visible@m">
|
||||||
<a class="uk-display-inline-block uk-button uk-button-link" uk-tooltip="Note"
|
<a class="uk-display-inline-block uk-button uk-button-link"
|
||||||
(click)="changeOverlay($event, indicator, 'description')">
|
uk-tooltip="Note"
|
||||||
|
(click)="changeOverlay($event, indicator, 'description')">
|
||||||
<span class="uk-flex uk-flex-middle">
|
<span class="uk-flex uk-flex-middle">
|
||||||
<icon name="analytics" type="outlined" [flex]="true"></icon>
|
<icon name="analytics" type="outlined" [flex]="true"></icon>
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
*ngIf="indicator.overlay && (indicator.description || indicator.additionalDescription)"
|
*ngIf="indicator.overlay && (indicator.description || indicator.additionalDescription)"
|
||||||
click-outside-or-esc class="uk-overflow-auto"
|
click-outside-or-esc class="uk-overflow-auto"
|
||||||
(clickOutside)="closeOverlay($event, indicator)">
|
(clickOutside)="closeOverlay($event, indicator)">
|
||||||
<div class="uk-position-top-right uk-text-center uk-margin-small-top uk-margin-small-right">
|
<div class="uk-position-top-right uk-text-center uk-margin-small-top uk-margin-small-right">
|
||||||
<a class="uk-display-inline-block uk-button uk-button-link"
|
<a class="uk-display-inline-block uk-button uk-button-link"
|
||||||
(click)="changeOverlay($event, indicator, false)">
|
(click)="changeOverlay($event, indicator, false)">
|
||||||
<span class="uk-flex uk-flex-middle">
|
<span class="uk-flex uk-flex-middle">
|
||||||
<icon name="close" type="outlined" [flex]="true"></icon>
|
<icon name="close" type="outlined" [flex]="true"></icon>
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="uk-margin-small-top uk-margin-right">
|
<div class="uk-margin-small-top uk-margin-right">
|
||||||
<p *ngIf="indicator.description">
|
<p *ngIf="indicator.description">
|
||||||
{{indicator.description}}
|
{{ indicator.description }}
|
||||||
</p>
|
</p>
|
||||||
<p *ngIf="indicator.additionalDescription">
|
<p *ngIf="indicator.additionalDescription">
|
||||||
{{indicator.additionalDescription}}
|
{{ indicator.additionalDescription }}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</div>
|
</div>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="isMobile && countIndicatorsToShow(number.indicators) > 0">
|
<ng-container *ngIf="isMobile && countIndicatorsToShow(number.indicators) > 0">
|
||||||
<h6 *ngIf="number.title" class="uk-width-1-1 uk-margin-bottom">{{number.title}}</h6>
|
<h6 *ngIf="number.title" class="uk-width-1-1 uk-margin-bottom">{{ number.title }}</h6>
|
||||||
<div class="uk-card uk-card-default uk-padding-small number-card">
|
<div class="uk-card uk-card-default uk-padding-small number-card">
|
||||||
<div class="uk-grid uk-grid-small uk-child-width-1-1" uk-grid>
|
<div class="uk-grid uk-grid-small uk-child-width-1-1" uk-grid>
|
||||||
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
|
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
|
||||||
<div *ngIf="hasPermission(indicator.visibility)" [ngClass]="getNumberClassBySize(indicator.width)">
|
<div *ngIf="hasPermission(indicator.visibility)"
|
||||||
<div [class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
|
[ngClass]="getNumberClassBySize(indicator.width)">
|
||||||
<div *ngIf="!indicator.overlay">
|
<div [class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
|
||||||
<div
|
<div *ngIf="!indicator.overlay">
|
||||||
class="uk-text-xsmall uk-text-truncate uk-margin-xsmall-bottom uk-margin-right">{{indicator.name}}</div>
|
<div
|
||||||
<div class="number uk-text-small uk-text-bold">
|
class="uk-text-xsmall uk-text-truncate uk-margin-xsmall-bottom uk-margin-right">{{ indicator.name }}
|
||||||
|
</div>
|
||||||
|
<div class="number uk-text-small uk-text-bold">
|
||||||
<span *ngIf="numberResults.get(i + '-' + j + '-' + 0)"
|
<span *ngIf="numberResults.get(i + '-' + j + '-' + 0)"
|
||||||
[innerHTML]="(indicator.indicatorPaths[0].format == 'NUMBER'?(numberResults.get(i + '-' + j + '-' + 0) | numberRound: 2:1:stakeholder.locale):(numberResults.get(i + '-' + j + '-' + 0) | numberPercentage: stakeholder.locale))"></span>
|
[innerHTML]="(indicator.indicatorPaths[0].format == 'NUMBER'?(numberResults.get(i + '-' + j + '-' + 0) | numberRound: 2:1:stakeholder.locale):(numberResults.get(i + '-' + j + '-' + 0) | numberPercentage: stakeholder.locale))"></span>
|
||||||
<span *ngIf="!numberResults.get(i + '-' + j + '-' + 0)">--</span>
|
<span *ngIf="!numberResults.get(i + '-' + j + '-' + 0)">--</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<ng-container *ngFor="let chart of activeSubCategory.charts; let i = index;">
|
||||||
</ng-container>
|
<div *ngIf="countIndicatorsToShow(chart.indicators) > 0"
|
||||||
</ng-container>
|
class="uk-grid uk-grid-small uk-grid-match uk-margin-medium-bottom uk-flex uk-flex-middle"
|
||||||
</div>
|
uk-grid
|
||||||
<ng-container *ngFor="let chart of activeSubCategory.charts; let i = index;">
|
uk-height-match="target: .uk-card">
|
||||||
<div *ngIf="countIndicatorsToShow(chart.indicators) > 0"
|
<h5 *ngIf="chart.title && !isMobile"
|
||||||
class="uk-grid uk-grid-small uk-grid-match uk-margin-medium-bottom uk-flex uk-flex-middle" uk-grid
|
class="uk-width-1-1 uk-margin-bottom">{{ chart.title }}</h5>
|
||||||
uk-height-match="target: .uk-card">
|
<h6 *ngIf="chart.title && isMobile" class="uk-width-1-1">{{ chart.title }}</h6>
|
||||||
<h5 *ngIf="chart.title && !isMobile" class="uk-width-1-1 uk-margin-bottom">{{chart.title}}</h5>
|
<ng-container *ngFor="let indicator of chart.indicators; let j=index">
|
||||||
<h6 *ngIf="chart.title && isMobile" class="uk-width-1-1">{{chart.title}}</h6>
|
<div *ngIf="hasPermission(indicator.visibility)"
|
||||||
<ng-template ngFor [ngForOf]="chart.indicators" let-indicator let-j="index">
|
[ngClass]="getChartClassBySize(indicator.width)">
|
||||||
<div *ngIf="hasPermission(indicator.visibility)"
|
<div class="uk-card uk-card-default uk-position-relative"
|
||||||
[ngClass]="getChartClassBySize(indicator.width)">
|
[class.semiFiltered]="getActiveIndicatorPath(indicator).filtersApplied < countSelectedFilters()">
|
||||||
<div class="uk-card uk-card-default uk-position-relative"
|
<div class="uk-card-body uk-margin-small-bottom">
|
||||||
[class.semiFiltered]="getActiveIndicatorPath(indicator).filtersApplied < countSelectedFilters()">
|
<!-- Main content-->
|
||||||
<div class="uk-card-body uk-margin-small-bottom">
|
<div>
|
||||||
<h6 class="uk-margin-bottom chartTitle uk-flex uk-flex-bottom">
|
<h6 class="uk-margin-bottom chartTitle uk-flex uk-flex-bottom">
|
||||||
{{indicator.name + " "}}
|
{{ indicator.name + " " }}
|
||||||
</h6>
|
</h6>
|
||||||
<iframe [class.uk-blend-multiply]="!isFullscreen"
|
<iframe [class.uk-blend-multiply]="!isFullscreen"
|
||||||
*ngIf=" !properties.disableFrameLoad && getActiveIndicatorPath(indicator).source !== 'image'"
|
*ngIf=" !properties.disableFrameLoad && getActiveIndicatorPath(indicator).source !== 'image'"
|
||||||
[src]="getActiveIndicatorPath(indicator).safeResourceUrl"
|
[src]="getActiveIndicatorPath(indicator).safeResourceUrl"
|
||||||
class="uk-width-1-1" allowfullscreen="true" mozallowfullscreen="true"
|
class="uk-width-1-1" allowfullscreen="true"
|
||||||
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"></iframe>
|
mozallowfullscreen="true"
|
||||||
<div *ngIf="properties.disableFrameLoad && getActiveIndicatorPath(indicator).source !== 'image'">
|
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"></iframe>
|
||||||
<img class="uk-width-1-1 uk-blend-multiply"
|
<div *ngIf="properties.disableFrameLoad && getActiveIndicatorPath(indicator)?.source !=='image'">
|
||||||
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"
|
<img class="uk-width-1-1 uk-blend-multiply"
|
||||||
src="assets/chart-placeholder.png">
|
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"
|
||||||
|
src="assets/chart-placeholder.png">
|
||||||
|
</div>
|
||||||
|
<img *ngIf="getActiveIndicatorPath(indicator).source === 'image'"
|
||||||
|
[src]="getActiveIndicatorPath(indicator).url"
|
||||||
|
class="uk-width-1-1 uk-blend-multiply"
|
||||||
|
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')">
|
||||||
|
</div>
|
||||||
|
<!-- Tabs -->
|
||||||
|
<slider-tabs [type]="'dynamic'" [flexPosition]="'right'"
|
||||||
|
(activeEmitter)="indicator.activePath = $event"
|
||||||
|
tabsClass="uk-subnav uk-subnav-pill uk-subnav-small"
|
||||||
|
containerClass="uk-margin-top uk-margin-bottom" [border]="false">
|
||||||
|
<slider-tab
|
||||||
|
*ngFor="let indicatorPath of indicator.indicatorPaths; let i=index"
|
||||||
|
[tabTitle]="indicatorPath.parameters.tab ? indicatorPath.parameters.tab : indicatorPath.parameters.title"
|
||||||
|
[invisible]="indicator.indicatorPaths.length < 2"
|
||||||
|
[tabId]="i" [active]="getActivePathIndex(indicator) == i">
|
||||||
|
</slider-tab>
|
||||||
|
</slider-tabs>
|
||||||
|
<div class="uk-position-bottom-left uk-margin-left uk-margin-small-bottom uk-visible@m">
|
||||||
|
<a *ngIf="indicator.description || indicator.additionalDescription"
|
||||||
|
class="uk-display-inline-block uk-button uk-button-link"
|
||||||
|
(click)="changeOverlay($event, indicator, 'description')">
|
||||||
|
<span class="uk-flex uk-flex-middle">
|
||||||
|
<icon name="analytics" type="outlined" [flex]="true"></icon>
|
||||||
|
<span class="uk-margin-xsmall-left">Note</span>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div *ngIf="indicator.overlay"
|
||||||
|
class="indicator-overlay uk-card uk-card-default uk-flex uk-flex-middle uk-flex-center">
|
||||||
|
<div *ngIf="indicator.overlay == 'description'" class="inner"
|
||||||
|
click-outside-or-esc
|
||||||
|
(clickOutside)="closeOverlay($event, indicator)">
|
||||||
|
<div class="uk-padding-small">
|
||||||
|
<div class="uk-flex uk-flex-right">
|
||||||
|
<button class="uk-close uk-icon"
|
||||||
|
(click)="changeOverlay($event, indicator, false)">
|
||||||
|
<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>
|
||||||
|
</div>
|
||||||
|
<div class="printGap uk-hidden"></div>
|
||||||
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
<img *ngIf="getActiveIndicatorPath(indicator).source === 'image'"
|
</ng-container>
|
||||||
[src]="getActiveIndicatorPath(indicator).safeResourceUrl"
|
|
||||||
class="uk-width-1-1 uk-blend-multiply"
|
|
||||||
[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')">
|
|
||||||
<slider-tabs *ngIf="indicator.indicatorPaths.length > 1" [type]="'dynamic'" [flexPosition]="'right'" (activeEmitter)="indicator.activePath = $event"
|
|
||||||
tabsClass="uk-subnav uk-subnav-pill uk-subnav-small" containerClass="uk-margin-top uk-margin-bottom" [border]="false">
|
|
||||||
<slider-tab *ngFor="let indicatorPath of indicator.indicatorPaths; let i=index"
|
|
||||||
[tabTitle]="indicatorPath.parameters.tab ? indicatorPath.parameters.tab : indicatorPath.parameters.title"
|
|
||||||
[tabId]="i" [active]="(!indicator.activePath && i == 0) || indicator.activePath == i">
|
|
||||||
</slider-tab>
|
|
||||||
</slider-tabs>
|
|
||||||
</div>
|
|
||||||
<div class="uk-position-bottom-left uk-margin-left uk-margin-small-bottom uk-visible@m">
|
|
||||||
<a *ngIf="indicator.description || indicator.additionalDescription"
|
|
||||||
class="uk-display-inline-block uk-button uk-button-text"
|
|
||||||
(click)="changeOverlay($event, indicator, 'description')">
|
|
||||||
<span class="uk-flex uk-flex-middle">
|
|
||||||
<icon name="analytics" type="outlined" [flex]="true"></icon>
|
|
||||||
<span class="uk-margin-small-left">Note</span>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div *ngIf="indicator.overlay" class="indicator-overlay uk-card uk-card-default uk-flex uk-flex-middle uk-flex-center">
|
|
||||||
<div *ngIf="indicator.overlay == 'description'" class="inner" click-outside-or-esc
|
|
||||||
(clickOutside)="closeOverlay($event, indicator)">
|
|
||||||
<div class="uk-padding-small">
|
|
||||||
<div class="uk-flex uk-flex-right">
|
|
||||||
<button class="uk-close uk-icon" (click)="changeOverlay($event, indicator, false)">
|
|
||||||
<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>
|
|
||||||
<div class="printGap uk-hidden"></div>
|
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</div>
|
</div>
|
||||||
</ng-container>
|
|
||||||
</ng-template>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div sticky_footer class="uk-visible@m">
|
||||||
<div sticky_footer class="uk-visible@m">
|
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
||||||
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
</div>
|
||||||
</div>
|
<ng-template #graph_and_feedback_template>
|
||||||
<ng-template #graph_and_feedback_template>
|
<div *ngIf="!view"
|
||||||
<div *ngIf="!view" class="uk-margin-small-top uk-margin-small-bottom uk-grid uk-grid-small uk-text-small hideInfo"
|
class="uk-margin-small-top uk-margin-small-bottom uk-grid uk-grid-small uk-text-small hideInfo"
|
||||||
uk-grid>
|
uk-grid>
|
||||||
<!-- Last Stats Date-->
|
<!-- Last Stats Date-->
|
||||||
<div class="uk-width-expand@m uk-width-1-1">
|
<div class="uk-width-expand@m uk-width-1-1">
|
||||||
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m">
|
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m">
|
||||||
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 16px;">
|
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph"
|
||||||
</a>
|
style="height: 16px;">
|
||||||
<span *ngIf="statsUpdateDate" class="uk-text-baseline uk-text-meta">
|
</a>
|
||||||
|
<span *ngIf="statsUpdateDate" class="uk-text-baseline uk-text-meta">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right">-</span>
|
<span class="uk-margin-xsmall-left uk-margin-xsmall-right">-</span>
|
||||||
<span>Last update of statistics in OpenAIRE: {{statsUpdateDate | date: 'MMM dd, yyyy'}}</span>
|
<span>Last update of statistics in OpenAIRE: {{ statsUpdateDate | date: 'MMM dd, yyyy' }}</span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<!--Feedback-->
|
<!--Feedback-->
|
||||||
<div class="uk-width-auto@m uk-width-1-1">
|
<div class="uk-width-auto@m uk-width-1-1">
|
||||||
<span class="uk-text-meta">Send us your </span>
|
<span class="uk-text-meta">Send us your </span>
|
||||||
<a class="uk-link" [href]="feedback" target="_self">feedback</a>
|
<a class="uk-link" [href]="feedback" target="_self">feedback</a>
|
||||||
<span class="uk-text-meta">.</span>
|
<span class="uk-text-meta">.</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</div>
|
</div>
|
||||||
<a *ngIf="stakeholder && !privateStakeholder " href="#style_switcher" uk-toggle="" id="filters_switcher_toggle"
|
<a *ngIf="stakeholder && !privateStakeholder " href="#style_switcher" uk-toggle="" id="filters_switcher_toggle"
|
||||||
class="uk-offcanvas-switcher uk-flex uk-flex-center uk-flex-middle uk-link-reset">
|
class="uk-offcanvas-switcher uk-flex uk-flex-center uk-flex-middle uk-link-reset">
|
||||||
<icon name="filters" ratio="1.5" visuallyHidden="Filters" gradient="filters_icon"></icon>
|
<icon name="filters" ratio="1.5" visuallyHidden="Filters" gradient="filters_icon"></icon>
|
||||||
<span [class.uk-hidden]="countSelectedFilters() === 0"
|
<span [class.uk-hidden]="countSelectedFilters() === 0"
|
||||||
class="uk-offcanvas-count uk-flex uk-flex-middle uk-flex-center">
|
class="uk-offcanvas-count uk-flex uk-flex-middle uk-flex-center">
|
||||||
{{countSelectedFilters()}}
|
{{ countSelectedFilters() }}
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
<div *ngIf="stakeholder && !privateStakeholder" id="style_switcher" class="uk-offcanvas"
|
<div *ngIf="stakeholder && !privateStakeholder" id="style_switcher" class="uk-offcanvas"
|
||||||
uk-offcanvas="flip:true; overlay: true">
|
uk-offcanvas="flip:true; overlay: true">
|
||||||
<div class="uk-offcanvas-bar">
|
<div class="uk-offcanvas-bar">
|
||||||
<div class="uk-float-right">
|
<div class="uk-float-right">
|
||||||
<button class="uk-offcanvas-close uk-close uk-icon" type="button">
|
<button class="uk-offcanvas-close uk-close uk-icon" type="button">
|
||||||
<icon name="close" ratio="1.5" visuallyHidden="close"></icon>
|
<icon name="close" ratio="1.5" visuallyHidden="close"></icon>
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div class="uk-flex uk-flex-middle uk-margin-bottom">
|
||||||
|
<h4 class="uk-margin-remove-bottom">Filters</h4>
|
||||||
|
<a *ngIf="countSelectedFilters() > 1" class="uk-text-small uk-margin-left" (click)="clearAll()"> Clear
|
||||||
|
All </a>
|
||||||
|
</div>
|
||||||
|
<ng-container *ngTemplateOutlet="selected_filters_pills"></ng-container>
|
||||||
|
<div *ngIf="!user" class="uk-margin-top"><a class="uk-link" (click)="logIn()"> Sign in</a> to apply filters.
|
||||||
|
</div>
|
||||||
|
<ul *ngIf="user" class="uk-list uk-list-xlarge uk-list-divider uk-margin-top">
|
||||||
|
<li>
|
||||||
|
<range-filter #rangeFilter [filter]="periodFilter" [yearMin]="minYear" [yearMax]="maxYear"
|
||||||
|
[mandatoryRange]="true" (onFilterChange)="filter()"></range-filter>
|
||||||
|
</li>
|
||||||
|
<ng-container *ngFor="let filter of filters ">
|
||||||
|
<li *ngIf="filter.values.length >0">
|
||||||
|
<search-filter [filter]="filter" [showResultCount]=false
|
||||||
|
(onFilterChange)="filterChanged($event)"></search-filter>
|
||||||
|
</li>
|
||||||
|
</ng-container>
|
||||||
|
</ul>
|
||||||
|
<i *ngIf="user || countSelectedFilters() > 0 " class="uk-margin-medium-top uk-text-small uk-display-block">
|
||||||
|
<sup>*</sup> If your filter selection cannot be applied to a chart, that chart will appear grayed-out.
|
||||||
|
</i>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
|
||||||
<div class="uk-flex uk-flex-middle uk-margin-bottom">
|
|
||||||
<h4 class="uk-margin-remove-bottom">Filters</h4>
|
|
||||||
<a *ngIf="countSelectedFilters() > 1" class="uk-text-small uk-margin-left" (click)="clearAll()"> Clear All </a>
|
|
||||||
</div>
|
|
||||||
<ng-container *ngTemplateOutlet="selected_filters_pills"></ng-container>
|
|
||||||
<div *ngIf="!user" class="uk-margin-top"><a class="uk-link" (click)="logIn()"> Sign in</a> to apply filters.</div>
|
|
||||||
<ul *ngIf="user" class="uk-list uk-list-xlarge uk-list-divider uk-margin-top">
|
|
||||||
<li>
|
|
||||||
<range-filter #rangeFilter [filter]="periodFilter"[yearMin]="minYear" [yearMax]="maxYear"
|
|
||||||
[mandatoryRange]="true" (onFilterChange)="filter()"></range-filter>
|
|
||||||
</li>
|
|
||||||
<ng-container *ngFor="let filter of filters ">
|
|
||||||
<li *ngIf="filter.values.length >0">
|
|
||||||
<search-filter [filter]="filter" [showResultCount]=false
|
|
||||||
(onFilterChange)="filterChanged($event)"></search-filter>
|
|
||||||
</li>
|
|
||||||
</ng-container>
|
|
||||||
</ul>
|
|
||||||
<i *ngIf="user || countSelectedFilters() > 0 " class="uk-margin-medium-top uk-text-small uk-display-block">
|
|
||||||
<sup>*</sup> If your filter selection cannot be applied to a chart, that chart will appear grayed-out.
|
|
||||||
</i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- <div *ngIf="stakeholder && !loading && activeTopic" id="print_toggle"
|
<!-- <div *ngIf="stakeholder && !loading && activeTopic" id="print_toggle"
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
Subproject commit 4396999ce03bb96543f258f64e64459546b86e19
|
Subproject commit 2b8725e1fbe954bbde4f75baee710f4cc7029255
|
|
@ -8,7 +8,7 @@
|
||||||
<ul class="uk-tab uk-margin-remove-bottom uk-margin-medium-top">
|
<ul class="uk-tab uk-margin-remove-bottom uk-margin-medium-top">
|
||||||
<li [class.uk-active]="tab === 'manager'"><a routerLink="../manager">Managers</a></li>
|
<li [class.uk-active]="tab === 'manager'"><a routerLink="../manager">Managers</a></li>
|
||||||
<li [class.uk-active]="tab === 'member'"><a routerLink="../member">Members</a></li>
|
<li [class.uk-active]="tab === 'member'"><a routerLink="../member">Members</a></li>
|
||||||
<li *ngIf="properties.environment != 'production'" ><a routerLink="../links">Links</a></li>
|
<li *ngIf="stakeholder.type == 'organization' && properties.environment != 'production'" ><a routerLink="../links">Links</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</role-users>
|
</role-users>
|
||||||
|
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
Subproject commit 5026b8b38fcae493ec7bcdc272bf167798c18fa3
|
Subproject commit a4d8923b82a59ac1cc41e9c0574f1d64a61c0c1b
|
|
@ -1 +1 @@
|
||||||
Subproject commit 6524ee362c8fc8fa6e482144920e305198e54fc8
|
Subproject commit 55765bf0829910661a55337e0e7ca7b1262b7298
|
|
@ -3,6 +3,7 @@ import {common, commonBeta} from "../app/openaireLibrary/utils/properties/enviro
|
||||||
|
|
||||||
let props: EnvProperties = {
|
let props: EnvProperties = {
|
||||||
dashboard: 'monitor',
|
dashboard: 'monitor',
|
||||||
|
adminToolsPortalType: "monitor",
|
||||||
isDashboard: true,
|
isDashboard: true,
|
||||||
enablePiwikTrack: true,
|
enablePiwikTrack: true,
|
||||||
monitorStatsFrameUrl:"https://beta.services.openaire.eu/stats-tool/",
|
monitorStatsFrameUrl:"https://beta.services.openaire.eu/stats-tool/",
|
||||||
|
|
|
@ -3,6 +3,7 @@ import {common, commonProd} from "../app/openaireLibrary/utils/properties/enviro
|
||||||
|
|
||||||
let props: EnvProperties = {
|
let props: EnvProperties = {
|
||||||
dashboard: 'monitor',
|
dashboard: 'monitor',
|
||||||
|
adminToolsPortalType: "monitor",
|
||||||
isDashboard: true,
|
isDashboard: true,
|
||||||
enablePiwikTrack: true,
|
enablePiwikTrack: true,
|
||||||
monitorStatsFrameUrl: "https://services.openaire.eu/stats-tool/",
|
monitorStatsFrameUrl: "https://services.openaire.eu/stats-tool/",
|
||||||
|
|
Loading…
Reference in New Issue