Revision 57644
Added by Konstantinos Triantafyllou over 4 years ago
| modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/services/stakeholder.service.ts | ||
|---|---|---|
| 17 | 17 |
} |
| 18 | 18 |
|
| 19 | 19 |
getStakeholder(url: string, alias:string): Observable<Stakeholder> {
|
| 20 |
// return new BehaviorSubject<Stakeholder>(Stakeholder.createECStakeholder()).asObservable();
|
|
| 21 |
return this.http.get<Stakeholder>(url + '/stakeholder/' + encodeURIComponent(alias)).pipe(map(stakeholder => {
|
|
| 22 |
return this.formalizeStakeholder([stakeholder])[0]; |
|
| 23 |
})); |
|
| 20 |
return new BehaviorSubject<Stakeholder>(Stakeholder.createECStakeholder()).asObservable(); |
|
| 21 |
// return this.http.get<Stakeholder>(url + '/stakeholder/' + encodeURIComponent(alias)).pipe(map(stakeholder => {
|
|
| 22 |
// return this.formalizeStakeholder([stakeholder])[0];
|
|
| 23 |
// }));
|
|
| 24 | 24 |
} |
| 25 | 25 |
|
| 26 | 26 |
getAllStakeholders(url: string, type: string = null): Observable<Stakeholder[]> {
|
| modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/utils/indicator-utils.ts | ||
|---|---|---|
| 18 | 18 |
|
| 19 | 19 |
isActiveIcon: string = 'brightness_1'; |
| 20 | 20 |
|
| 21 |
ignoredParameters = ['funder_name']; |
|
| 22 |
|
|
| 21 | 23 |
public getFullUrl(indicatorPath: IndicatorPath): string {
|
| 22 | 24 |
let replacedUrl = indicatorPath.chartObject; |
| 23 | 25 |
if (indicatorPath.parameters) {
|
| modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/indicators.component.html | ||
|---|---|---|
| 149 | 149 |
</i> |
| 150 | 150 |
{{(indicator.isActive) ? 'Active' : 'Inactive'}}
|
| 151 | 151 |
</span> |
| 152 |
<i class="md-icon material-icons">more_vert</i> |
|
| 152 |
<i class="md-icon material-icons" (click)="editIndicatorOpen(i)">more_vert</i>
|
|
| 153 | 153 |
</div> |
| 154 | 154 |
<div class="md-card-toolbar-heading-text">{{indicator.name}}</div>
|
| 155 | 155 |
</div> |
| ... | ... | |
| 215 | 215 |
[okDisabled]="indicatorFb && indicatorFb.invalid"> |
| 216 | 216 |
<div *ngIf="indicatorFb" class="uk-form-stacked" [formGroup]="indicatorFb"> |
| 217 | 217 |
<label class="uk-form-label">Name</label> |
| 218 |
<div class="uk-form-controls" formArrayName="name">
|
|
| 218 |
<div class="uk-form-controls"> |
|
| 219 | 219 |
<input class="uk-input" |
| 220 | 220 |
[class.uk-form-danger]="indicatorFb.get('name').invalid && indicatorFb.get('name').dirty"
|
| 221 | 221 |
[formControl]="indicatorFb.get('name')">
|
| 222 | 222 |
</div> |
| 223 | 223 |
<label class="uk-form-label">Description</label> |
| 224 |
<div class="uk-form-controls" formArrayName="urls">
|
|
| 224 |
<div class="uk-form-controls"> |
|
| 225 | 225 |
<textarea class="uk-textarea" rows="3" |
| 226 | 226 |
[formControl]="indicatorFb.get('description')"></textarea>
|
| 227 | 227 |
</div> |
| ... | ... | |
| 234 | 234 |
</div> |
| 235 | 235 |
</div> |
| 236 | 236 |
</modal-alert> |
| 237 |
<!--<modal-alert #editIndicatorModal
|
|
| 237 |
<modal-alert #editIndicatorModal |
|
| 238 | 238 |
(alertOutput)="saveIndicator()" |
| 239 | 239 |
[okDisabled]="editIndicatorFb && (editIndicatorFb.invalid || !editIndicatorFb.dirty)"> |
| 240 | 240 |
<div *ngIf="editIndicatorFb" class="uk-form-stacked" [formGroup]="editIndicatorFb"> |
| 241 |
<div class="md-input-wrapper"> |
|
| 242 |
<label>Name</label> |
|
| 243 |
<input type="text" class="md-input" (focus)="focus($event)"> |
|
| 244 |
<span class="md-input-bar "></span> |
|
| 245 |
</div> |
|
| 241 | 246 |
<label class="uk-form-label">Name</label> |
| 242 |
<div class="uk-form-controls" formArrayName="name">
|
|
| 247 |
<div class="uk-form-controls"> |
|
| 243 | 248 |
<input class="uk-input" |
| 244 |
[class.uk-form-danger]="indicatorFb.get('name').status === 'INVALID' && indicatorFb.get('name').dirty"
|
|
| 245 |
[formControl]="indicatorFb.get('name')">
|
|
| 249 |
[class.uk-form-danger]="editIndicatorFb.get('name').status === 'INVALID' && editIndicatorFb.get('name').dirty"
|
|
| 250 |
[formControl]="editIndicatorFb.get('name')">
|
|
| 246 | 251 |
</div> |
| 247 |
<label class="uk-form-label">Description</label> |
|
| 248 |
<div class="uk-form-controls" formArrayName="urls">
|
|
| 252 |
<!--<label class="uk-form-label">Description</label>
|
|
| 253 |
<div class="uk-form-controls"> |
|
| 249 | 254 |
<textarea class="uk-textarea" rows="3" |
| 250 | 255 |
[formControl]="indicatorFb.get('description')"></textarea>
|
| 251 | 256 |
</div> |
| ... | ... | |
| 255 | 260 |
[class.uk-form-danger]="chartUrl.status === 'INVALID' && chartUrl.dirty" |
| 256 | 261 |
*ngFor="let chartUrl of urls.controls;" |
| 257 | 262 |
[formControl]="chartUrl"> |
| 258 |
</div> |
|
| 263 |
</div>-->
|
|
| 259 | 264 |
</div> |
| 260 |
</modal-alert>--> |
|
| 265 |
</modal-alert> |
|
| modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/indicators.component.ts | ||
|---|---|---|
| 1 |
import {Component, Input, OnChanges, OnInit, SimpleChanges, ViewChild} from "@angular/core";
|
|
| 1 |
import {ChangeDetectorRef, Component, Input, OnChanges, OnInit, SimpleChanges, ViewChild} from "@angular/core";
|
|
| 2 | 2 |
import {SideBarService} from "../library/sharedComponents/sidebar/sideBar.service";
|
| 3 |
import {Indicator, Stakeholder} from "../utils/entities/stakeholder";
|
|
| 3 |
import {Indicator, IndicatorPath, Stakeholder} from "../utils/entities/stakeholder";
|
|
| 4 | 4 |
import {IndicatorUtils} from "../utils/indicator-utils";
|
| 5 | 5 |
import {FormArray, FormBuilder, FormGroup, Validators} from "@angular/forms";
|
| 6 | 6 |
import {AlertModal} from "../openaireLibrary/utils/modal/alert";
|
| 7 | 7 |
import {StatisticsService} from "../utils/services/statistics.service";
|
| 8 | 8 |
import {HelperFunctions} from "../openaireLibrary/utils/HelperFunctions.class";
|
| 9 |
import {DomSanitizer} from "@angular/platform-browser";
|
|
| 9 | 10 |
|
| 10 | 11 |
@Component({
|
| 11 | 12 |
selector: 'indicators', |
| ... | ... | |
| 55 | 56 |
|
| 56 | 57 |
constructor(private sideBarService: SideBarService, |
| 57 | 58 |
private statisticsService: StatisticsService, |
| 58 |
private fb: FormBuilder) {
|
|
| 59 |
private fb: FormBuilder, |
|
| 60 |
private sanitizer: DomSanitizer) {
|
|
| 59 | 61 |
} |
| 60 | 62 |
|
| 61 | 63 |
ngOnInit(): void {
|
| ... | ... | |
| 64 | 66 |
ngOnChanges(changes: SimpleChanges): void {
|
| 65 | 67 |
if (this.canEdit) {
|
| 66 | 68 |
this.charts = this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].charts; |
| 67 |
console.log(this.charts); |
|
| 68 | 69 |
this.displayCharts = this.filterChartType(this.filterPrivacy( |
| 69 | 70 |
this.filterStatus(this.filterByKeyword(this.charts, this.keyword), this.status), |
| 70 | 71 |
this.privacy), |
| ... | ... | |
| 157 | 158 |
return this.indicatorFb.get('urls') as FormArray;
|
| 158 | 159 |
} |
| 159 | 160 |
|
| 161 |
private getUrlByStakeHolder(indicatorPath: IndicatorPath) {
|
|
| 162 |
return this.sanitizer.bypassSecurityTrustResourceUrl( |
|
| 163 |
this.statisticsService.getChartUrl(indicatorPath.source, this.indicatorUtils.getFullUrl(indicatorPath))); |
|
| 164 |
} |
|
| 165 |
|
|
| 160 | 166 |
public addUrl() {
|
| 161 | 167 |
this.urls.push(this.fb.control('', [Validators.required,
|
| 162 | 168 |
Validators.pattern('https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.' +
|
| ... | ... | |
| 196 | 202 |
this.indicatorUtils.generateIndicatorByChartUrl(this.statisticsService.getChartSource(url), url)); |
| 197 | 203 |
}); |
| 198 | 204 |
let index = this.charts.push(this.indicator); |
| 199 |
this.editIndicatorOpen(index -1); |
|
| 205 |
this.editIndicatorOpen(index - 1);
|
|
| 200 | 206 |
} |
| 201 | 207 |
|
| 202 | 208 |
public editIndicatorOpen(index: number) {
|
| 203 | 209 |
this.indicator = HelperFunctions.copy(this.charts[index]); |
| 204 |
let indicatorPaths = this.fb.array([]); |
|
| 205 | 210 |
this.indicator.indicatorPaths.forEach(indicatorPath => {
|
| 211 |
indicatorPath.safeResourceUrl = this.getUrlByStakeHolder(indicatorPath) |
|
| 212 |
console.log(indicatorPath.safeResourceUrl); |
|
| 213 |
}); |
|
| 214 |
let indicatorPaths = this.fb.array([]); |
|
| 215 |
this.indicator.indicatorPaths.forEach(indicatorPath => {
|
|
| 216 |
let parameters = this.fb.array([]); |
|
| 217 |
indicatorPath.parameters.forEach((value, key) => {
|
|
| 218 |
if (this.indicatorUtils.ignoredParameters.indexOf(key) === -1) {
|
|
| 219 |
// TODO add Validators Map |
|
| 220 |
parameters.push(this.fb.group({
|
|
| 221 |
key: this.fb.control(key), |
|
| 222 |
value: this.fb.control(value, Validators.required) |
|
| 223 |
})); |
|
| 224 |
} |
|
| 225 |
}); |
|
| 206 | 226 |
indicatorPaths.push(this.fb.group({
|
| 207 |
parameters: this.fb.array([])
|
|
| 227 |
parameters: parameters
|
|
| 208 | 228 |
})); |
| 209 | 229 |
}); |
| 210 | 230 |
this.editIndicatorFb = this.fb.group({
|
| ... | ... | |
| 216 | 236 |
width: this.fb.control(this.indicator.width, Validators.required), |
| 217 | 237 |
}); |
| 218 | 238 |
console.log(this.editIndicatorFb.value); |
| 219 |
/*this.editIndicatorModal.alertTitle = this.indicator.name;
|
|
| 239 |
this.editIndicatorModal.alertHeader = false;
|
|
| 220 | 240 |
this.editIndicatorModal.cancelButtonText = 'Cancel'; |
| 221 | 241 |
this.editIndicatorModal.okButtonText = 'Save Changes'; |
| 222 | 242 |
this.editIndicatorModal.okButtonLeft = false; |
| 223 | 243 |
this.editIndicatorModal.alertMessage = false; |
| 224 |
this.editIndicatorModal.open();*/
|
|
| 244 |
this.editIndicatorModal.open(); |
|
| 225 | 245 |
} |
| 226 | 246 |
|
| 227 | 247 |
saveIndicator() {
|
| 228 | 248 |
|
| 229 | 249 |
} |
| 250 |
|
|
| 251 |
focus(event: FocusEvent) {
|
|
| 252 |
event.srcElement.parentElement.className = event.srcElement.parentElement.className + ' md-input-focus'; |
|
| 253 |
} |
|
| 230 | 254 |
} |
| modules/uoa-monitor-portal/trunk/monitor_dashboard/src/index.html | ||
|---|---|---|
| 69 | 69 |
</script> |
| 70 | 70 |
<script src="assets/theme-assets/js/common.min.js"></script> |
| 71 | 71 |
<script src="assets/theme-assets/js/altair_admin_common.min.js"></script> |
| 72 |
<!-- <script src="assets/theme-assets/js/uikit_custom.min.js"></script>--> |
|
| 72 | 73 |
<script> |
| 73 | 74 |
if(isHighDensity) {
|
| 74 | 75 |
// enable hires images |
| ... | ... | |
| 78 | 79 |
// fastClick (touch devices) |
| 79 | 80 |
FastClick.attach(document.body); |
| 80 | 81 |
} |
| 82 |
$window.load(function() {
|
|
| 83 |
// ie fixes |
|
| 84 |
altair_helpers.ie_fix(); |
|
| 85 |
}); |
|
| 81 | 86 |
</script> |
| 82 | 87 |
<script type="text/javascript"> |
| 83 | 88 |
function loadAltmetrics(e, t, n) {
|
Also available in: Unified diff
[Monitor Dashboard]: Add form builder for edit indicator