Revision 57644
Added by Konstantinos Triantafyllou over 4 years ago
| 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 |
} |
Also available in: Unified diff
[Monitor Dashboard]: Add form builder for edit indicator