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

Change description overlay. Fix a bug in case of more than one sections has no indicators. Make numbers with fixed width

Browse Source
pull/1/head
Konstantinos Triantafyllou 3 years ago
parent 10c756c091
commit 9ee588df82
7 changed files with 102 additions and 113 deletions
Show Stats Download Patch File Download Diff File

26
src/app/monitor/monitor.component.html
Unescape Escape View File

@ -91,11 +91,8 @@
</div>
</div>
<div *ngIf="!privateStakeholder && stakeholder">
<div *ngIf="(activeSubCategory && (activeSubCategory.charts.length == 0 ||
(activeSubCategory.charts.length == 1 && countIndicatorsToShow(activeSubCategory.charts[0].indicators) == 0)))
&& ((activeSubCategory &&
activeSubCategory.description &&
activeSubCategory.description.length > 0) ||
<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">
@ -104,15 +101,12 @@
: (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 || (activeSubCategory.numbers.length == 1 && countIndicatorsToShow(activeSubCategory.numbers[0].indicators) == 0))
&&
(activeSubCategory.charts.length == 0 || (activeSubCategory.charts.length == 1 && countIndicatorsToShow(activeSubCategory.charts[0].indicators) == 0))
) || !activeTopic || !activeCategory || !activeSubCategory)" [ngIfElse]="content">
((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!
@ -126,9 +120,8 @@
<h5 *ngIf="countIndicatorsToShow(number.indicators)> 0 "
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"
<div *ngIf="isPublicOrIsMember(indicator.visibility)" class="uk-width-medium uk-margin-bottom">
<div class="uk-card uk-card-default uk-flex uk-flex-column uk-flex-center"
[class.uk-disabled]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()"
[class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
<div class="uk-card-body uk-text-center">
@ -202,7 +195,7 @@
</div>
<div *ngIf="indicator.description || indicator.additionalDescription"
class="uk-overlay uk-position-bottom">
<div class="uk-padding-small multi-line-ellipsis lines-3">
<div class="uk-padding multi-line-ellipsis lines-3">
<p class="uk-margin-remove">
<span *ngIf="indicator.description">
{{indicator.description}}
@ -231,8 +224,7 @@
</div>
<!--Feedback-->
<div class="uk-width-expand uk-text-right">
<span class="uk-text-muted">Send us your <a [href]="mailText" target="_self"
(click)="mailMe()">feedback</a>.</span>
<span class="uk-text-muted">Send us your <a [href]="feedback" target="_self">feedback</a>.</span>
</div>
</div>
</ng-template>

54
src/app/monitor/monitor.component.ts
Unescape Escape View File

@ -12,7 +12,7 @@ import {SEOService} from "../openaireLibrary/sharedComponents/SEO/SEO.service";
import {StakeholderService} from "../openaireLibrary/monitor/services/stakeholder.service";
import {
Category, Indicator,
IndicatorPath, IndicatorSize,
IndicatorPath, IndicatorSize, Section,
Stakeholder,
SubCategory,
Topic,
@ -77,6 +77,7 @@ export class MonitorComponent implements OnInit, OnDestroy {
privateStakeholder = false;
public keyword: FormControl;
public statsUpdateDate: Date;
constructor(
private route: ActivatedRoute,
private _router: Router,
@ -170,7 +171,7 @@ export class MonitorComponent implements OnInit, OnDestroy {
this.seoService.createLinkForCanonicalURL(url, false);
this._meta.updateTag({content: url}, "property='og:url'");
this.description = "Monitor Dashboard | " + this.stakeholder.name;
this.title = "Monitor Dashboard | " + this.stakeholder.name;
this.title = "Monitor Dashboard | " + this.stakeholder.name;
this._meta.updateTag({content: this.description}, "name='description'");
this._meta.updateTag({content: this.description}, "property='og:description'");
this._meta.updateTag({content: this.title}, "property='og:title'");
@ -184,7 +185,7 @@ export class MonitorComponent implements OnInit, OnDestroy {
this.subscriptions.push(this._piwikService.trackView(this.properties, this.title, this.piwikSiteId).subscribe());
}
}));
}
if (this.isPublicOrIsMember(stakeholder.visibility)) {
//this.getDivContents();
@ -198,7 +199,7 @@ export class MonitorComponent implements OnInit, OnDestroy {
subscription.unsubscribe();
}
}
}else{
} else {
this.navigateToError();
if (subscription) {
subscription.unsubscribe();
@ -410,7 +411,7 @@ export class MonitorComponent implements OnInit, OnDestroy {
private getfl0() {
if (this.queryParams["relfundinglevel0_id"] && this.filters.length > 0) {
let value = StringUtils.URIDecode(StringUtils.unquote(this.queryParams["relfundinglevel0_id"] ));
let value = StringUtils.URIDecode(StringUtils.unquote(this.queryParams["relfundinglevel0_id"]));
return value.split("::")[value.split("::").length - 1];
}
return null;
@ -418,7 +419,7 @@ export class MonitorComponent implements OnInit, OnDestroy {
private getCoFunded() {
if (this.queryParams["co-funded"] && this.filters.length > 0) {
return this.queryParams["co-funded"] && StringUtils.URIDecode(StringUtils.unquote(this.queryParams["co-funded"] )) == "co-funded-results";
return this.queryParams["co-funded"] && StringUtils.URIDecode(StringUtils.unquote(this.queryParams["co-funded"])) == "co-funded-results";
}
return false;
}
@ -534,41 +535,36 @@ export class MonitorComponent implements OnInit, OnDestroy {
return counter;
}
public countSectionsWithIndicatorsToShow(sections: Section[]):number {
let counter = 0;
sections.forEach(section => {
section.indicators.forEach(indicator => {
if (this.isPublicOrIsMember(indicator.visibility)) {
counter++;
}
});
});
return counter;
}
public countIndicatorsToShow(indicators: Indicator[]): number {
let counter = 0;
for (let i of indicators) {
if (this.isPublicOrIsMember(i.visibility)) {
indicators.forEach(indicator => {
if (this.isPublicOrIsMember(indicator.visibility)) {
counter++;
}
}
});
return counter;
}
/*
Feedback mail
*/
public get mailText() {
public get feedback() {
return "mailto:" + this.properties.feedbackmail + "?subject=%5BOpenAIRE%20Monitor%5D%20" + (this.stakeholder ? this.stakeholder.name : "") + "%20dashboard%20feedback"
}
mailMe() {
window.location.href = this.mailText;
}
public getNumberClassBySize(size: IndicatorSize) {
if(size === 'small') {
return 'uk-width-1-4@xl uk-width-1-3@l uk-width-1-2@m uk-width-1-1';
} else if(size === 'medium') {
return 'uk-width-1-3@l uk-width-1-2@m uk-width-1-1';
} else {
return 'uk-width-1-2@l uk-width-1-1@m uk-width-1-1';
}
}
public getChartClassBySize(size: IndicatorSize) {
if(size === 'small') {
if (size === 'small') {
return 'uk-width-1-3@xl uk-width-1-2@m uk-width-1-1';
} else if(size === 'medium') {
} else if (size === 'medium') {
return 'uk-width-1-2@l uk-width-1-1';
} else {
return 'uk-width-1-1';

2
src/app/openaireLibrary

@ -1 +1 @@
Subproject commit 64051887ce031b36d74349496912e5c337801c15
Subproject commit 5c7430ae7cde032c1b6b4d9bd990f761cd6b73e3

119
src/app/topic/indicators.component.html
Unescape Escape View File

@ -43,69 +43,76 @@
</div>
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
<div *ngIf="indicator" [id]="indicator._id"
[ngClass]="getNumberClassBySize(indicator.width)"
class="uk-width-medium"
[class.disable-sortable]="!canReorder"
[class.uk-sortable-nodrag]="!canReorder">
<div class="uk-card uk-card-default uk-card-body uk-position-relative" [class.uk-card-hover]="canReorder">
<ng-container
*ngTemplateOutlet="visibilityOptions; context:{indicator: indicator, sectionId: number._id}"></ng-container>
<div [attr.uk-tooltip]="exportLoading ? 'title:Edit is disabled, while exporting indicators; cls:uk-active' : 'cls: uk-invisible'"
class="uk-position-top-right uk-margin-small-right uk-margin-small-top clickable">
<i [class]="exportLoading ? 'uk-disabled ' : ' '" uk-icon="more-vertical" (click)="$event.stopPropagation();$event.preventDefault()"></i>
<div #element uk-dropdown="mode: click; pos: bottom-right; delay-hide: 0; flip: false">
<ul class="uk-nav uk-dropdown-nav">
<li *ngIf="!editing"><a
(click)="editNumberIndicatorOpen(number, indicator._id)">Edit</a></li>
<ng-template ngFor [ngForOf]="stakeholderUtils.visibility" let-v>
<li *ngIf="indicator.visibility != v.value"><a (click)="changeIndicatorStatus(number._id,
<div class="uk-card uk-card-default uk-flex uk-flex-column uk-flex-center uk-position-relative" [class.uk-card-hover]="canReorder">
<div class="uk-card-body">
<ng-container
*ngTemplateOutlet="visibilityOptions; context:{indicator: indicator, sectionId: number._id}"></ng-container>
<div
[attr.uk-tooltip]="exportLoading ? 'title:Edit is disabled, while exporting indicators; cls:uk-active' : 'cls: uk-invisible'"
class="uk-position-top-right uk-margin-small-right uk-margin-small-top clickable">
<i [class]="exportLoading ? 'uk-disabled ' : ' '" uk-icon="more-vertical"
(click)="$event.stopPropagation();$event.preventDefault()"></i>
<div #element uk-dropdown="mode: click; pos: bottom-right; delay-hide: 0; flip: false">
<ul class="uk-nav uk-dropdown-nav">
<li *ngIf="!editing"><a
(click)="editNumberIndicatorOpen(number, indicator._id)">Edit</a></li>
<ng-template ngFor [ngForOf]="stakeholderUtils.visibility" let-v>
<li *ngIf="indicator.visibility != v.value"><a (click)="changeIndicatorStatus(number._id,
indicator, v.value); hide(element)">
{{'Make ' + v.label.toLowerCase()}}</a>
{{'Make ' + v.label.toLowerCase()}}</a>
</li>
</ng-template>
<hr *ngIf="!indicator.defaultId" class="uk-nav-divider">
<li *ngIf="!indicator.defaultId && !editing"><a
(click)="deleteIndicatorOpen(number, indicator._id, 'number', 'delete');hide(element)">Delete</a>
<!-- <ng-container *ngIf="!stakeholder.defaultId">-->
<!-- <a (click)="deleteIndicatorOpen(number, indicator._id, 'number', 'delete');hide(element)">Delete from all profiles</a>-->
<!-- <a (click)="deleteIndicatorOpen(number, indicator._id, 'number', 'disconnect');hide(element)">Delete and disconnect from all profiles</a>-->
<!-- </ng-container>-->
</li>
</ng-template>
<hr *ngIf="!indicator.defaultId" class="uk-nav-divider">
<li *ngIf="!indicator.defaultId && !editing"><a
(click)="deleteIndicatorOpen(number, indicator._id, 'number', 'delete');hide(element)">Delete</a>
<!-- <ng-container *ngIf="!stakeholder.defaultId">-->
<!-- <a (click)="deleteIndicatorOpen(number, indicator._id, 'number', 'delete');hide(element)">Delete from all profiles</a>-->
<!-- <a (click)="deleteIndicatorOpen(number, indicator._id, 'number', 'disconnect');hide(element)">Delete and disconnect from all profiles</a>-->
<!-- </ng-container>-->
</li>
</ul>
</ul>
</div>
</div>
</div>
<div>
<div class="uk-text-center uk-text-bold">
{{indicator.name ? indicator.name : 'No title available'}}
<div>
<div class="uk-text-center uk-text-bold">
{{indicator.name ? indicator.name : 'No title available'}}
</div>
<h3 class="uk-margin-medium-top uk-text-center uk-text-bold">
<span *ngIf="numberResults.get(i + '-' + j)">{{numberResults.get(i + '-' + j) | number}}</span>
<span *ngIf="!numberResults.get(i + '-' + j)">--</span>
</h3>
<!--<ng-container *ngTemplateOutlet="description; context: {indicator:indicator}"></ng-container>-->
</div>
<h3 class="uk-margin-medium-top uk-text-center uk-text-bold">
<span *ngIf="numberResults.get(i + '-' + j)">{{numberResults.get(i + '-' + j) | number}}</span>
<span *ngIf="!numberResults.get(i + '-' + j)">--</span>
</h3>
<!--<ng-container *ngTemplateOutlet="description; context: {indicator:indicator}"></ng-container>-->
</div>
<div *ngIf="indicator.description || indicator.additionalDescription" class="uk-overlay uk-position-bottom">
<p class="uk-margin-remove">
<div *ngIf="indicator.description || indicator.additionalDescription"
class="uk-overlay uk-position-bottom">
<div class="uk-padding multi-line-ellipsis lines-3">
<p class="uk-margin-remove">
<span *ngIf="indicator.description">
{{indicator.description}}
</span>
<br>
<span *ngIf="indicator.additionalDescription">
<br>
<span *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</span>
</p>
</p>
</div>
</div>
</div>
</div>
</div>
</ng-template>
<div class="disable-sortable uk-sortable-nodrag uk-width-1-1">
<div class="uk-grid uk-grid-small" uk-grid>
<div class="uk-width-1-4@xl uk-width-1-3@l uk-width-1-2@m uk-width-1-1">
<div class="uk-width-medium">
<div class="uk-card uk-card-default uk-card-body clickable" (click)="editNumberIndicatorOpen(number)">
<h5 class="uk-text-bold">
<h6 class="uk-text-bold uk-text-center">
Create a new number Indicator
</h5>
</h6>
<div class="uk-flex uk-flex-center uk-text-secondary uk-margin-large-top">
<icon name="add" ratio="5"></icon>
<icon name="add" ratio="4"></icon>
</div>
</div>
</div>
@ -165,9 +172,11 @@
<div class="uk-card uk-card-default uk-card-body uk-position-relative" [class.uk-card-hover]="canReorder">
<ng-container
*ngTemplateOutlet="visibilityOptions; context:{indicator: indicator, sectionId: chart._id}"></ng-container>
<div [attr.uk-tooltip]="exportLoading ? 'title:Edit is disabled, while exporting indicators; cls:uk-active' : 'cls: uk-invisible'"
class="uk-position-top-right uk-margin-small-right uk-margin-small-top clickable">
<i [class]="exportLoading ? 'uk-disabled ' : ' '" uk-icon="more-vertical" (click)="$event.stopPropagation();$event.preventDefault()"></i>
<div
[attr.uk-tooltip]="exportLoading ? 'title:Edit is disabled, while exporting indicators; cls:uk-active' : 'cls: uk-invisible'"
class="uk-position-top-right uk-margin-small-right uk-margin-small-top clickable">
<i [class]="exportLoading ? 'uk-disabled ' : ' '" uk-icon="more-vertical"
(click)="$event.stopPropagation();$event.preventDefault()"></i>
<div #element uk-dropdown="mode: click; pos: bottom-right; delay-hide: 0; flip: false">
<ul class="uk-nav uk-dropdown-nav">
<li *ngIf="!editing"><a
@ -212,8 +221,9 @@
</div>
<!--<ng-container *ngTemplateOutlet="description; context: {indicator:indicator}"></ng-container>-->
</div>
<div *ngIf="indicator.description || indicator.additionalDescription" class="uk-overlay uk-position-bottom">
<div class="uk-padding-small multi-line-ellipsis lines-3">
<div *ngIf="indicator.description || indicator.additionalDescription"
class="uk-overlay uk-position-bottom">
<div class="uk-padding multi-line-ellipsis lines-3">
<p class="uk-margin-remove">
<span *ngIf="indicator.description">
{{indicator.description}}
@ -251,7 +261,6 @@
<ng-container *ngTemplateOutlet="new_section; context:{type: 'chart'}"></ng-container>
</div>
</div>
<modal-alert #editNumberModal
[large]="true"
(alertOutput)="saveIndicator()"
@ -275,10 +284,10 @@
placeholder="Select a status"
label="Visibility" [options]="stakeholderUtils.visibility" type="select">
</div>
<div dashboard-input class="uk-width-1-2@m" [formInput]="numberIndicatorFb.get('width')"
<!--<div dashboard-input class="uk-width-1-2@m" [formInput]="numberIndicatorFb.get('width')"
type="select" [options]="indicatorUtils.indicatorSizes"
placeholder="Select a size" label="Number Size">
</div>
</div>-->
<div *ngIf="numberIndicatorPaths" formArrayName="indicatorPaths">
<div *ngFor="let indicatorPath of numberIndicatorPaths.controls; let i=index"
[formGroup]="indicatorPath">
@ -293,7 +302,7 @@
</div>
<div *ngIf="showCheckForSchemaEnhancements" class=" uk-width-1-1 ">
<div class="uk-alert uk-alert-warning">
There are schema enchancements that can be applied in this query. <a
There are schema enhancements that can be applied in this query. <a
(click)="indicatorPath.get('url').setValue(indicatorUtils.applySchemaEnhancements(indicatorPath.get('url').value)); indicatorPath.get('url').markAsDirty()">Apply
now</a>
</div>
@ -555,8 +564,10 @@
Are you sure you want to proceed?
</modal-alert>-->
<ng-template #visibilityOptions let-indicator="indicator" let-sectionId="sectionId">
<span [attr.uk-tooltip]="exportLoading ? 'title:Edit is disabled, while exporting indicators; cls:uk-active' : 'cls: uk-invisible'"
class="uk-position-top-left uk-margin-small-left uk-margin-small-top visibility" [class]="exportLoading ? '' : ' clickable '">
<span
[attr.uk-tooltip]="exportLoading ? 'title:Edit is disabled, while exporting indicators; cls:uk-active' : 'cls: uk-invisible'"
class="uk-position-top-left uk-margin-small-left uk-margin-small-top visibility"
[class]="exportLoading ? '' : ' clickable '">
<span [class]="exportLoading ? 'uk-disabled ' : ' '" class="clickable color">
<icon [name]="stakeholderUtils.visibilityIcon.get(indicator.visibility)"></icon>
</span>

10
src/app/topic/indicators.component.ts
Unescape Escape View File

@ -436,16 +436,6 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
return this.chartIndicatorFb.get('indicatorPaths') as FormArray;
}
public getNumberClassBySize(size: IndicatorSize) {
if (size === 'small') {
return 'uk-width-1-4@xl uk-width-1-3@l uk-width-1-2@m uk-width-1-1';
} else if (size === 'medium') {
return 'uk-width-1-3@l uk-width-1-2@m uk-width-1-1';
} else {
return 'uk-width-1-2@l uk-width-1-1@m uk-width-1-1';
}
}
public getChartClassBySize(size: IndicatorSize) {
if (size === 'small') {
return 'uk-width-1-3@xl uk-width-1-2@m uk-width-1-1';

2
src/assets/common-assets

@ -1 +1 @@
Subproject commit 363790356aeb20339fab6d36516864ab44931dd7
Subproject commit 443ef4d544d370c698ed0856481b71e489a044d8

2
src/assets/dashboard-theme

@ -1 +1 @@
Subproject commit 72f3272e41d93e82042a293e8e85493fe8cfe6c2
Subproject commit 8f656664973f82d9f6f0228968a77643964da805
Write Preview
Loading…
Cancel
Save