MaDgIK
/
connect
13
0
Fork 0
Code Issues Pull Requests Projects Releases 14 Wiki Activity

changed a few things in statistics component 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-connect-portal/trunk@51324 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
myrto.koukouli 2018-03-19 09:07:06 +00:00
parent 78704ca5fb
commit 8558a25b7b
3 changed files with 122 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -6,18 +6,26 @@
<div *ngIf="!statisticsSum || !statisticsSum.total_projects" class="uk-alert uk-alert-info" style="margin-top:40px; padding-left:40px;"> <div *ngIf="!statisticsSum || !statisticsSum.total_projects" class="uk-alert uk-alert-info" style="margin-top:40px; padding-left:40px;">
No statistics are available for {{ communityId.toUpperCase() }} No statistics are available for {{ communityId.toUpperCase() }}
</div> </div>
<div *ngIf="statisticsSum && statisticsDisplay && charts" class="uk-margin uk-margin-top"> <div *ngIf="statisticsSum && statisticsDisplay && chartsUrlMap" class="uk-margin uk-margin-top">
<div class="uk-grid"> <div class="uk-grid">
<ul class="uk-tab uk-tab-left uk-width-1-6 uk-margin-top" data-uk-tab="{connect:'#tabs'}"> <ul class="uk-tab uk-tab-left uk-width-1-6 uk-margin-top" data-uk-tab="{connect:'#tabs'}">
<li *ngFor="let entity of entitiesForCommunity" <li *ngFor="let entity of entitiesList"
(click)="onChangeEntity(entity)"> (click)="onChangeEntity(entity)">
<a href="#">{{ entity }}{{ entity == 'software' ? '' : 's' }}</a> <a href="#">{{ entity+(entity=='software'?'':'s') }}</a>
</li> </li>
</ul> </ul>
<ul id="tabs" class="uk-switcher uk-margin uk-width-5-6" style="min-height:450px; padding-left:40px;"> <ul id="tabs" class="uk-switcher uk-margin uk-width-5-6" style="min-height:450px; padding-left:40px;">
<li *ngFor="let entity of entitiesForCommunity"> <li *ngFor="let entity of entitiesList">
<div *ngIf="!(statisticsSum[entity + (entity == 'software' ? '' : 's')]['total'])"
class="uk-alert uk-alert-info">
No {{ entity }}{{ entity == 'software' ? '' : 's' }} available
</div>
<div *ngIf="statisticsDisplay.entities[entity] && statisticsSum[entity+(entity=='software'?'':'s')].total">
<div class="uk-text-uppercase uk-text-bold uk-heading-divider"> <div class="uk-text-uppercase uk-text-bold uk-heading-divider">
<h2>{{ getCamelCaseString(entity) }}{{ entity == 'software' ? '' : 's' }} statistics</h2> <h2>{{ getCamelCaseString(entity) }}{{ entity == 'software' ? '' : 's' }} statistics</h2>
<div *ngIf="statisticsSum[entity + (entity == 'software' ? '' : 's')].total" class="uk-text-small"> <div *ngIf="statisticsSum[entity + (entity == 'software' ? '' : 's')].total" class="uk-text-small">
@ -31,12 +39,18 @@
</span> </span>
</div> </div>
</div> </div>
<div *ngIf="charts.get(entity)"> <div>
<div *ngIf="charts.get(entity).get('timeline') && (displayedTimeline == (entity + 'Timeline'))"> <div *ngIf="statisticsDisplay.entities[entity].charts.map['timeline'] &&
statisticsDisplay.entities[entity].charts.map['timeline'].showInMonitor &&
chartsUrlMap[entity + 'Timeline'] &&
(displayedTimeline == (entity + 'Timeline'))">
<iframe [src]=displayedTimelineUrl width="1000" height="450"></iframe> <iframe [src]=displayedTimelineUrl width="1000" height="450"></iframe>
<hr> <hr>
</div> </div>
<div *ngIf="charts.get(entity).get('graph') && (displayedGraph == (entity + 'Graph'))"> <div *ngIf="statisticsDisplay.entities[entity].charts.map['graph'] &&
statisticsDisplay.entities[entity].charts.map['graph'].showInMonitor &&
chartsUrlMap[entity + 'Graph'] &&
(displayedGraph == (entity + 'Graph'))">
<iframe [src]=displayedGraphUrl width="1000" height="450"></iframe> <iframe [src]=displayedGraphUrl width="1000" height="450"></iframe>
<hr> <hr>
</div> </div>
@ -45,17 +59,26 @@
</div> </div>
<div> <div>
<ul class="uk-tab uk-margin-top" data-uk-tab="{connect: '#projectChartTabs'"> <ul class="uk-tab uk-margin-top" data-uk-tab="{connect: '#projectChartTabs'">
<li *ngIf="charts.get(entity).get('projectColumn')" <li *ngIf=" statisticsDisplay.entities[entity].charts.map['projectColumn'] &&
statisticsDisplay.entities[entity].charts.map['projectColumn'].showInMonitor &&
chartsUrlMap[entity + 'Projectcolumn'] &&
(displayedProjectChart == (entity + 'Projectcolumn'))"
(click)="changeDisplayedProjectChart(entity + 'Projectcolumn')"> (click)="changeDisplayedProjectChart(entity + 'Projectcolumn')">
<a href="#">Columns</a> <a href="#">Columns</a>
</li> </li>
<li *ngIf="charts.get(entity).get('projectPie')" <li *ngIf=" statisticsDisplay.entities[entity].charts.map['projectPie'] &&
statisticsDisplay.entities[entity].charts.map['projectPie'].showInMonitor &&
chartsUrlMap[entity + 'Projectpie'] &&
(displayedProjectChart == (entity + 'Projectpie'))"
(click)="changeDisplayedProjectChart(entity + 'Projectpie')"> (click)="changeDisplayedProjectChart(entity + 'Projectpie')">
<a href="#">Pie</a> <a href="#">Pie</a>
</li> </li>
<li *ngIf="charts.get(entity).get('projectTable')" <li *ngIf=" statisticsDisplay.entities[entity].charts.map['projectTable'] &&
statisticsDisplay.entities[entity].charts.map['projectTable'].showInMonitor &&
chartsUrlMap[entity + 'Projecttable'] &&
(displayedProjectChart == (entity + 'Projecttable'))"
(click)="changeDisplayedProjectChart(entity + 'Projecttable')"> (click)="changeDisplayedProjectChart(entity + 'Projecttable')">
<a href="#">Table</a> <a href="#">Table</a>
@ -63,25 +86,23 @@
</ul> </ul>
<ul id="projectChartTabs" class="uk-switcher uk-margin"> <ul id="projectChartTabs" class="uk-switcher uk-margin">
<li> <li>
<div *ngIf="charts.get(entity).get('projectColumn') && (displayedProjectChart == (entity + 'Projectcolumn'))"> <div *ngIf="displayedProjectChart == (entity + 'Projectcolumn')">
<iframe [src]=displayedProjectChartUrl width="1000" height="450"></iframe> <iframe [src]=displayedProjectChartUrl width="1000" height="450"></iframe>
</div> </div>
</li> </li>
<li> <li>
<div *ngIf="charts.get(entity).get('projectPie') && (displayedProjectChart == (entity + 'Projectpie'))"> <div *ngIf="displayedProjectChart == (entity + 'Projectpie')">
<iframe [src]=displayedProjectChartUrl width="1000" height="450"></iframe> <iframe [src]=displayedProjectChartUrl width="1000" height="450"></iframe>
</div> </div>
</li> </li>
<li> <li>
<div *ngIf="charts.get(entity).get('projectTable') && displayedProjectChart == (entity + 'Projecttable')"> <div *ngIf="displayedProjectChart == (entity + 'Projecttable')">
<iframe [src]=displayedProjectChartUrl width="1000" height="450"></iframe> <iframe [src]=displayedProjectChartUrl width="1000" height="450"></iframe>
</div> </div>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
<div *ngIf="!statisticsSum[entity + (entity == 'software' ? '' : 's')].total" class="uk-alert uk-alert-primary">
No {{ entity }}{{ entity == 'software' ? '' : 's' }} available
</div> </div>
</li> </li>
</ul> </ul>

50
src/app/statistics/statistics.component.ts
View File

@ -36,13 +36,11 @@ export class StatisticsComponent {
public communityInfo = null; public communityInfo = null;
entitiesList: string[] = availableEntities; entitiesList: string[] = availableEntities;
entitiesForCommunity: string[] = [];
chartCatsList: string[] = availableCharts; chartCatsList: string[] = availableCharts;
allowedCharts: string[] = []; allowedCharts: string[] = [];
statisticsSum: StatisticsSummary; statisticsSum: StatisticsSummary;
statisticsDisplay: StatisticsDisplay; statisticsDisplay: StatisticsDisplay;
charts: Map<string,Map<string,any>> = new Map<string,Map<string,any>>();
chartsUrlMap: {}; chartsUrlMap: {};
public displayedTimeline: string; public displayedTimeline: string;
@ -135,37 +133,38 @@ export class StatisticsComponent {
console.log(error) console.log(error)
}, },
() => { () => {
this.createCharts(); this.createChartUrlMap();
this.initializeDisplayedCharts('showInMonitor');
} }
); );
} }
/* checks which charts exist and which the admin has chosen to display in connect monitor */ /* /!* checks which charts exist and which the admin has chosen to display in connect monitor *!/
private createCharts() { private createCharts() {
this.createChartUrlMap(); this.createChartUrlMap();
/* for each entity find the statistics display information /!* for each entity find the statistics display information
from apiUrl/statistics/communityId from apiUrl/statistics/communityId
*/ *!/
for ( let entity of this.entitiesList ) { for ( let entity of this.entitiesList ) {
let displayOptionsForEntity = this.statisticsDisplay.entities[entity]; let displayOptionsForEntity = this.statisticsDisplay.entities[entity];
/* if the community has produced such entities */ /!* if the community has produced such entities *!/
if (displayOptionsForEntity && this.statisticsSum[entity+(entity=='software'?'':'s')]['total'] ) { if (displayOptionsForEntity && this.statisticsSum[entity+(entity=='software'?'':'s')]['total'] ) {
/* create a map of charts to be displayed */ /!* create a map of charts to be displayed *!/
let chartsMap: Map<string,any> = new Map<string,any>(); let chartsMap: Map<string,any> = new Map<string,any>();
/* for each chart category find which charts exist /!* for each chart category find which charts exist
and which the admin has chosen to be displayed here and which the admin has chosen to be displayed here
*/ *!/
for (let chart of this.chartCatsList) { for (let chart of this.chartCatsList) {
/* current chart is */ /!* current chart is *!/
let displayOptionsForCharts = this.statisticsDisplay.entities[entity].charts.map[chart]; let displayOptionsForCharts = this.statisticsDisplay.entities[entity].charts.map[chart];
/* in the future we probably won't need to check if the url exists */ /!* in the future we probably won't need to check if the url exists *!/
/* currently the url titles are created using the entity name and the chart name in camelcase */ /!* currently the url titles are created using the entity name and the chart name in camelcase *!/
let urlString = this.chartsUrlMap[entity + this.getCamelCaseString(chart)]; let urlString = this.chartsUrlMap[entity + this.getCamelCaseString(chart)];
if (displayOptionsForCharts && displayOptionsForCharts.showInMonitor && urlString ) { if (displayOptionsForCharts && displayOptionsForCharts.showInMonitor && urlString ) {
@ -174,14 +173,35 @@ export class StatisticsComponent {
} }
} }
/* add the entity's charts to the charts map */ /!* add the entity's charts to the charts map *!/
this.charts.set(entity, chartsMap); this.charts.set(entity, chartsMap);
/* add the entity in the available entities for the current community */ /!* add the entity in the available entities for the current community *!/
this.entitiesForCommunity.push(entity); this.entitiesForCommunity.push(entity);
} }
} }
this.onChangeEntity(this.entitiesForCommunity[0]); this.onChangeEntity(this.entitiesForCommunity[0]);
}*/
initializeDisplayedCharts(mode: string) {
let firstEntity: string;
for (let entity of this.entitiesList) {
if (this.statisticsDisplay.entities[entity]) {
for (let chart of this.chartCatsList){
if (this.statisticsDisplay.entities[entity].charts.map[chart] &&
this.statisticsDisplay.entities[entity].charts.map[chart][mode] &&
this.chartsUrlMap[entity + this.getCamelCaseString(chart)]) {
this.allowedCharts.push(entity + this.getCamelCaseString(chart));
}
}
if (!firstEntity){
firstEntity = entity;
this.onChangeEntity(entity);
}
}
}
} }
createChartUrlMap() { createChartUrlMap() {

2
src/app/statistics/statisticsEntities.ts
View File

@ -16,7 +16,7 @@ export const availableNumbers = [
export const availableEntities = [ export const availableEntities = [
'publication', 'publication',
'datasets', 'dataset',
'software' 'software'
]; ];