[Monitor_Dashboard | Trunk]: Add default badge. Fix a bug with indicators deafultId. Add option to create a blank profile.

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor_dashboard@58707 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
Konstantinos Triantafyllou 2020-05-15 12:26:59 +00:00
parent d4c6e9833c
commit 2eb711011e
9 changed files with 71 additions and 41 deletions

View File

@ -234,7 +234,7 @@
<div *ngIf="defaultStakeholdersOptions.length === 0" class="uk-text-danger">No default profiles has been found for this type.</div> <div *ngIf="defaultStakeholdersOptions.length === 0" class="uk-text-danger">No default profiles has been found for this type.</div>
<div *ngIf="defaultStakeholdersOptions.length > 0" <div *ngIf="defaultStakeholdersOptions.length > 0"
dashboard-input class="uk-form-row" [formInput]="stakeholderFb.get('defaultId')" dashboard-input class="uk-form-row" [formInput]="stakeholderFb.get('defaultId')"
label="Profile" [options]="defaultStakeholdersOptions" type="select"></div> label="Indicators" [options]="defaultStakeholdersOptions" type="select"></div>
</div> </div>
</div> </div>
</modal-alert> </modal-alert>

View File

@ -129,10 +129,13 @@ export class ManageStakeholdersComponent implements OnInit, OnDestroy {
} }
onTypeChange(value) { onTypeChange(value) {
this.defaultStakeholdersOptions = []; this.defaultStakeholdersOptions = [{
label: 'New blank profile',
value: '-1'
}];
this.defaultStakeholders.filter(stakeholder => stakeholder.type === value).forEach(stakeholder => { this.defaultStakeholders.filter(stakeholder => stakeholder.type === value).forEach(stakeholder => {
this.defaultStakeholdersOptions.push({ this.defaultStakeholdersOptions.push({
label: stakeholder.name, label: 'Use ' + stakeholder.name + ' profile',
value: stakeholder._id value: stakeholder._id
}) })
}); });
@ -238,7 +241,7 @@ export class ManageStakeholdersComponent implements OnInit, OnDestroy {
if (!this.stakeholderFb.value.isDefault) { if (!this.stakeholderFb.value.isDefault) {
let stakeholder = this.defaultStakeholders.find(value => value._id === this.stakeholderFb.value.defaultId); let stakeholder = this.defaultStakeholders.find(value => value._id === this.stakeholderFb.value.defaultId);
this.stakeholderFb.setValue(this.stakeholderUtils.createFunderFromDefaultProfile(this.stakeholderFb.value, this.stakeholderFb.setValue(this.stakeholderUtils.createFunderFromDefaultProfile(this.stakeholderFb.value,
stakeholder.topics)); (stakeholder?stakeholder.topics:[])));
} /*else { } /*else {
this.stakeholderFb.setValue(StakeholderCreator.createFunderDefaultProfile(this.stakeholderFb.value)); this.stakeholderFb.setValue(StakeholderCreator.createFunderDefaultProfile(this.stakeholderFb.value));
}*/ }*/

View File

@ -5,7 +5,7 @@
<nav class="uk-navbar"> <nav class="uk-navbar">
<div class="uk-navbar-left"> <div class="uk-navbar-left">
<img class="badge " <img class="badge"
src="assets/theme-assets/prototype_flag.svg" src="assets/theme-assets/prototype_flag.svg"
alt="BETA"> alt="BETA">
<a *ngIf="stakeholder" <a *ngIf="stakeholder"

View File

@ -1,9 +1,12 @@
<aside id="sidebar_main"> <aside id="sidebar_main">
<div *ngIf="stakeholder" class="sidebar_main_header uk-margin-remove-bottom"> <div *ngIf="stakeholder" class="sidebar_main_header uk-margin-remove-bottom uk-text-center">
<img class="badge" <img class="badge"
src="assets/theme-assets/prototype_flag.svg" src="assets/theme-assets/prototype_flag.svg"
alt="BETA"> alt="BETA">
<img class="logo" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl"> <div class="uk-position-relative uk-display-inline-block uk-margin-small-top">
<div *ngIf="!stakeholder.defaultId" class="uk-badge default">Default</div>
<img class="logo" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl">
</div>
</div> </div>
<div *ngIf="stakeholder" class="menu_section"> <div *ngIf="stakeholder" class="menu_section">
<ul> <ul>

View File

@ -364,7 +364,7 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
return this.statisticsService.getChartUrl(indicatorPath.source, this.indicatorUtils.getFullUrl(indicatorPath)); return this.statisticsService.getChartUrl(indicatorPath.source, this.indicatorUtils.getFullUrl(indicatorPath));
} }
public addIndicatorPath(value: string = '', parameters: FormArray = new FormArray([])) { public addIndicatorPath(value: string = '', parameters: FormArray = new FormArray([]), disableUrl: boolean = false) {
this.indicatorPaths.push(this.fb.group({ this.indicatorPaths.push(this.fb.group({
url: this.fb.control(value, [Validators.required, url: this.fb.control(value, [Validators.required,
Validators.pattern('https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.' + Validators.pattern('https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.' +
@ -373,22 +373,29 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
parameters: parameters parameters: parameters
} }
)); ));
let index = this.indicatorPaths.length - 1; if(disableUrl) {
this.urlSubscriptions.push(this.indicatorPaths.at(index).get('url').valueChanges.subscribe(value => { for(let index = 0; index < this.indicatorPaths.length; index++) {
if (this.indicatorPaths.at(index).get('url').valid) { this.indicatorPaths.at(index).get('url').disable();
let indicatorPath: IndicatorPath = this.indicatorUtils.generateIndicatorByChartUrl(this.statisticsService.getChartSource(value), value, 'bar', this.stakeholder); }
let parameters = this.getParametersAsFormArray(indicatorPath); } else {
(this.indicatorPaths.at(index) as FormGroup).setControl('parameters', parameters); for(let index = 0; index < this.indicatorPaths.length; index++) {
if (!this.indicator.indicatorPaths[index]) { this.urlSubscriptions.push(this.indicatorPaths.at(index).get('url').valueChanges.subscribe(value => {
this.indicator.indicatorPaths[index] = indicatorPath; if (this.indicatorPaths.at(index).get('url').valid) {
this.indicator.indicatorPaths[index].safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath); let indicatorPath: IndicatorPath = this.indicatorUtils.generateIndicatorByChartUrl(this.statisticsService.getChartSource(value), value, 'bar', this.stakeholder);
} else { let parameters = this.getParametersAsFormArray(indicatorPath);
indicatorPath.safeResourceUrl = this.indicator.indicatorPaths[index].safeResourceUrl; (this.indicatorPaths.at(index) as FormGroup).setControl('parameters', parameters);
this.indicator.indicatorPaths[index] = indicatorPath; if (!this.indicator.indicatorPaths[index]) {
} this.indicator.indicatorPaths[index] = indicatorPath;
} this.indicator.indicatorPaths[index].safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath);
}) } else {
); indicatorPath.safeResourceUrl = this.indicator.indicatorPaths[index].safeResourceUrl;
this.indicator.indicatorPaths[index] = indicatorPath;
}
}
})
);
}
}
} }
private getParametersAsFormArray(indicatorPath: IndicatorPath): FormArray { private getParametersAsFormArray(indicatorPath: IndicatorPath): FormArray {
@ -431,9 +438,11 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
isActive: this.fb.control(this.indicator.isActive), isActive: this.fb.control(this.indicator.isActive),
indicatorPaths: this.fb.array([]), indicatorPaths: this.fb.array([]),
width: this.fb.control(this.indicator.width), width: this.fb.control(this.indicator.width),
defaultId: this.fb.control(this.indicator.defaultId)
}); });
this.indicator.indicatorPaths.forEach(indicatorPath => { this.indicator.indicatorPaths.forEach(indicatorPath => {
this.addIndicatorPath(this.getUrlByStakeHolder(indicatorPath), this.getParametersAsFormArray(indicatorPath)); this.addIndicatorPath(this.getUrlByStakeHolder(indicatorPath),
this.getParametersAsFormArray(indicatorPath), this.indicator.defaultId !== null);
indicatorPath.safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath); indicatorPath.safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath);
}); });
} else { } else {
@ -446,6 +455,7 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
isActive: this.fb.control(false), isActive: this.fb.control(false),
indicatorPaths: this.fb.array([]), indicatorPaths: this.fb.array([]),
width: this.fb.control('small', Validators.required), width: this.fb.control('small', Validators.required),
defaultId: this.fb.control(null)
}); });
this.addIndicatorPath(); this.addIndicatorPath();
} }

View File

@ -1,9 +1,12 @@
<aside id="sidebar_main"> <aside id="sidebar_main">
<div *ngIf="stakeholder" class="sidebar_main_header uk-margin-remove-bottom"> <div *ngIf="stakeholder" class="sidebar_main_header uk-margin-remove-bottom uk-text-center">
<img class="badge" <img class="badge"
src="assets/theme-assets/prototype_flag.svg" src="assets/theme-assets/prototype_flag.svg"
alt="BETA"> alt="BETA">
<img class="logo" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl"> <div class="uk-position-relative uk-display-inline-block uk-margin-small-top">
<div *ngIf="!stakeholder.defaultId" class="uk-badge default">Default</div>
<img class="logo" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl">
</div>
</div> </div>
<div *ngIf="stakeholder && stakeholder.topics[topicIndex]" class="menu_section"> <div *ngIf="stakeholder && stakeholder.topics[topicIndex]" class="menu_section">
<ul> <ul>
@ -24,7 +27,7 @@
{{stakeholder.topics[topicIndex].isActive ? 'Inactive' : 'Active'}}</a> {{stakeholder.topics[topicIndex].isActive ? 'Inactive' : 'Active'}}</a>
</li> </li>
<li><a (click)="toggleTopicAccess(); hide(element)"> <li><a (click)="toggleTopicAccess(); hide(element)">
{{stakeholder.topics[topicIndex].isPublic?'Private':'Public'}}</a> {{stakeholder.topics[topicIndex].isPublic ? 'Private' : 'Public'}}</a>
</li> </li>
<hr class="uk-nav-divider"> <hr class="uk-nav-divider">
<li><a (click)="deleteTopicOpen(); hide(element)">Delete</a></li> <li><a (click)="deleteTopicOpen(); hide(element)">Delete</a></li>
@ -55,7 +58,7 @@
{{category.isActive ? 'Inactive' : 'Active'}}</a> {{category.isActive ? 'Inactive' : 'Active'}}</a>
</li> </li>
<li><a (click)="toggleCategoryAccess(i); hide(element)"> <li><a (click)="toggleCategoryAccess(i); hide(element)">
{{category.isPublic?'Private':'Public'}}</a> {{category.isPublic ? 'Private' : 'Public'}}</a>
</li> </li>
<hr class="uk-nav-divider"> <hr class="uk-nav-divider">
<li><a (click)="deleteCategoryOpen(i); hide(element)">Delete</a></li> <li><a (click)="deleteCategoryOpen(i); hide(element)">Delete</a></li>
@ -84,7 +87,7 @@
{{subcategory.isActive ? 'Inactive' : 'Active'}}</a> {{subcategory.isActive ? 'Inactive' : 'Active'}}</a>
</li> </li>
<li><a (click)="toggleSubcategoryAccess(j); hide(element)"> <li><a (click)="toggleSubcategoryAccess(j); hide(element)">
{{subcategory.isPublic?'Private':'Public'}}</a> {{subcategory.isPublic ? 'Private' : 'Public'}}</a>
</li> </li>
<hr class="uk-nav-divider"> <hr class="uk-nav-divider">
<li><a (click)="deleteSubcategoryOpen(j); hide(element)">Delete</a></li> <li><a (click)="deleteSubcategoryOpen(j); hide(element)">Delete</a></li>

View File

@ -14,8 +14,13 @@ export class StakeholderUtils {
defaultProfiles = {"funder":{ defaultProfiles = {"funder":{
index_id:"ec__________::EC", index_id:"ec__________::EC",
index_name: "European Commission", index_shortName:"EC"}}; index_name: "European Commission", index_shortName:"EC"}};
types: Option[] = [ types: Option[] = [
{value: 'funder', label: 'Funder'} {value: 'funder', label: 'Funder'},
{value: 'ri', label: 'Reasearch Initiative'},
{value: 'project', label: 'Project'},
{value: 'organization', label: 'Organization'}
]; ];
isPublic: Option[] = [ isPublic: Option[] = [
@ -224,7 +229,7 @@ export class IndicatorUtils {
generateIndicatorByForm(form: any, indicatorPaths: IndicatorPath[]): Indicator { generateIndicatorByForm(form: any, indicatorPaths: IndicatorPath[]): Indicator {
let indicator: Indicator = new Indicator(form.name, form.description, 'chart', let indicator: Indicator = new Indicator(form.name, form.description, 'chart',
form.width, form.isActive, form.isPublic, indicatorPaths); form.width, form.isActive, form.isPublic, indicatorPaths, form.defaultId);
indicator._id = form.id; indicator._id = form.id;
form.indicatorPaths.forEach((indicatorPath, index) => { form.indicatorPaths.forEach((indicatorPath, index) => {
indicatorPath.parameters.forEach(parameter => { indicatorPath.parameters.forEach(parameter => {

View File

@ -69,8 +69,8 @@
pointer-events: none; pointer-events: none;
border-color: transparent; border-color: transparent;
border-bottom-color: #ECECEC; border-bottom-color: #ECECEC;
border-width: 15px; border-width: 13px;
margin-left: -15px; transform: translateX(-50%);
} }

View File

@ -47,9 +47,6 @@ html .dashboard {
.dashboard #sidebar_main .sidebar_main_header .logo { .dashboard #sidebar_main .sidebar_main_header .logo {
height: calc(var(--header-height) - 20px); height: calc(var(--header-height) - 20px);
margin-left: 25px;
margin-top: 10px;
margin-bottom: 10px;
} }
.dashboard #sidebar_main .menu_section { .dashboard #sidebar_main .menu_section {
@ -496,3 +493,12 @@ body.dashboard {
right: 0; right: 0;
} }
.dashboard .default.uk-badge {
padding: 1px 15px;
height: auto;
position: absolute;
left: -5px;
top: 0;
background-color: var(--primary-color);
}