Revision 57777
Added by Konstantinos Triantafyllou over 4 years ago
home.component.ts | ||
---|---|---|
10 | 10 |
import {StakeholderCreator} from "../utils/entities/stakeholderCreator"; |
11 | 11 |
|
12 | 12 |
@Component({ |
13 |
selector: 'home', |
|
14 |
templateUrl: "./home.component.html" |
|
13 |
selector: 'home',
|
|
14 |
templateUrl: "./home.component.html"
|
|
15 | 15 |
}) |
16 | 16 |
export class HomeComponent implements OnInit, OnDestroy { |
17 | 17 |
|
18 |
public properties: EnvProperties; |
|
19 |
public loading: boolean = true; |
|
20 |
public stakeholderUtils: StakeholderUtils = new StakeholderUtils(); |
|
21 |
public defaultStakeholders: Stakeholder[]; |
|
22 |
public stakeholders: Stakeholder[]; |
|
23 |
public stakeholder: Stakeholder; |
|
24 |
public stakeholderFb: FormGroup; |
|
25 |
public index: number; |
|
18 |
public properties: EnvProperties;
|
|
19 |
public loading: boolean = true;
|
|
20 |
public stakeholderUtils: StakeholderUtils = new StakeholderUtils();
|
|
21 |
public defaultStakeholders: Stakeholder[];
|
|
22 |
public stakeholders: Stakeholder[];
|
|
23 |
public stakeholder: Stakeholder;
|
|
24 |
public stakeholderFb: FormGroup;
|
|
25 |
public index: number;
|
|
26 | 26 |
|
27 |
/** |
|
28 |
* Filtered Stakeholders |
|
29 |
*/ |
|
30 |
public displayDefaultStakeholders: Stakeholder[]; |
|
31 |
public displayStakeholders: Stakeholder[]; |
|
27 |
/**
|
|
28 |
* Filtered Stakeholders
|
|
29 |
*/
|
|
30 |
public displayDefaultStakeholders: Stakeholder[];
|
|
31 |
public displayStakeholders: Stakeholder[];
|
|
32 | 32 |
|
33 |
/** |
|
34 |
* Top filters |
|
35 |
*/ |
|
36 |
public filters: FormGroup; |
|
37 |
public all: Option = { |
|
38 |
value: 'all', |
|
39 |
label: 'All' |
|
40 |
}; |
|
33 |
/**
|
|
34 |
* Top filters
|
|
35 |
*/
|
|
36 |
public filters: FormGroup;
|
|
37 |
public all: Option = {
|
|
38 |
value: 'all',
|
|
39 |
label: 'All'
|
|
40 |
};
|
|
41 | 41 |
|
42 |
/** |
|
43 |
* Grid or List View |
|
44 |
*/ |
|
45 |
public grid: boolean = true; |
|
46 |
private subscriptions: any[] = []; |
|
42 |
/**
|
|
43 |
* Grid or List View
|
|
44 |
*/
|
|
45 |
public grid: boolean = true;
|
|
46 |
private subscriptions: any[] = [];
|
|
47 | 47 |
|
48 |
@ViewChild('editStakeholderModal') editStakeholderModal: AlertModal; |
|
49 |
@ViewChild('deleteStakeholderModal') deleteStakeholderModal: AlertModal; |
|
48 |
@ViewChild('editStakeholderModal') editStakeholderModal: AlertModal;
|
|
49 |
@ViewChild('deleteStakeholderModal') deleteStakeholderModal: AlertModal;
|
|
50 | 50 |
|
51 |
constructor(private stakeholderService: StakeholderService, |
|
52 |
private propertiesService: EnvironmentSpecificService, |
|
53 |
private fb: FormBuilder) { |
|
54 |
} |
|
51 |
constructor(private stakeholderService: StakeholderService,
|
|
52 |
private propertiesService: EnvironmentSpecificService,
|
|
53 |
private fb: FormBuilder) {
|
|
54 |
}
|
|
55 | 55 |
|
56 |
ngOnInit(): void { |
|
57 |
this.buildFilters(); |
|
58 |
this.propertiesService.loadEnvironment() |
|
59 |
.then(properties => { |
|
60 |
this.properties = properties; |
|
61 |
let data = zip( |
|
62 |
this.stakeholderService.getDefaultStakeholders(this.properties.monitorServiceAPIURL), |
|
63 |
this.stakeholderService.getStakeholders(this.properties.monitorServiceAPIURL) |
|
64 |
); |
|
65 |
data.subscribe(res => { |
|
66 |
this.defaultStakeholders = res[0]; |
|
67 |
this.stakeholders = res[1]; |
|
68 |
this.displayDefaultStakeholders = res[0]; |
|
69 |
this.displayStakeholders = res[1]; |
|
70 |
this.loading = false; |
|
56 |
ngOnInit(): void { |
|
57 |
this.buildFilters(); |
|
58 |
this.propertiesService.loadEnvironment() |
|
59 |
.then(properties => { |
|
60 |
this.properties = properties; |
|
61 |
let data = zip( |
|
62 |
this.stakeholderService.getDefaultStakeholders(this.properties.monitorServiceAPIURL), |
|
63 |
this.stakeholderService.getStakeholders(this.properties.monitorServiceAPIURL) |
|
64 |
); |
|
65 |
data.subscribe(res => { |
|
66 |
this.defaultStakeholders = res[0]; |
|
67 |
this.stakeholders = res[1]; |
|
68 |
this.displayDefaultStakeholders = res[0]; |
|
69 |
this.displayStakeholders = res[1]; |
|
70 |
this.loading = false; |
|
71 |
}); |
|
72 |
}); |
|
73 |
} |
|
74 |
|
|
75 |
ngOnDestroy(): void { |
|
76 |
this.subscriptions.forEach(value => { |
|
77 |
if (value instanceof Subscriber) { |
|
78 |
value.unsubscribe(); |
|
79 |
} |
|
71 | 80 |
}); |
72 |
}); |
|
73 |
} |
|
81 |
} |
|
74 | 82 |
|
75 |
ngOnDestroy(): void { |
|
76 |
this.subscriptions.forEach(value => { |
|
77 |
if (value instanceof Subscriber) { |
|
78 |
value.unsubscribe(); |
|
79 |
} |
|
80 |
}); |
|
81 |
} |
|
83 |
public changeGrid(value) { |
|
84 |
this.grid = value; |
|
85 |
} |
|
82 | 86 |
|
83 |
public changeGrid(value) { |
|
84 |
this.grid = value; |
|
85 |
} |
|
87 |
private buildFilters() { |
|
88 |
this.filters = this.fb.group({ |
|
89 |
privacy: this.fb.control('all'), |
|
90 |
status: this.fb.control('all'), |
|
91 |
keyword: this.fb.control('') |
|
92 |
}); |
|
93 |
this.subscriptions.push(this.filters.get('privacy').valueChanges.subscribe(value => { |
|
94 |
this.onPrivacyChange(value); |
|
95 |
})); |
|
96 |
this.subscriptions.push(this.filters.get('status').valueChanges.subscribe(value => { |
|
97 |
this.onStatusChange(value); |
|
98 |
})); |
|
99 |
this.subscriptions.push(this.filters.get('keyword').valueChanges.subscribe(value => { |
|
100 |
this.onKeywordChange(value); |
|
101 |
})); |
|
102 |
} |
|
86 | 103 |
|
87 |
private buildFilters() { |
|
88 |
this.filters = this.fb.group({ |
|
89 |
privacy: this.fb.control('all'), |
|
90 |
status: this.fb.control('all'), |
|
91 |
keyword: this.fb.control('') |
|
92 |
}); |
|
93 |
this.subscriptions.push(this.filters.get('privacy').valueChanges.subscribe(value => { |
|
94 |
this.onPrivacyChange(value); |
|
95 |
})); |
|
96 |
this.subscriptions.push(this.filters.get('status').valueChanges.subscribe(value => { |
|
97 |
this.onStatusChange(value); |
|
98 |
})); |
|
99 |
this.subscriptions.push(this.filters.get('keyword').valueChanges.subscribe(value => { |
|
100 |
this.onKeywordChange(value); |
|
101 |
})); |
|
102 |
} |
|
104 |
onPrivacyChange(value) { |
|
105 |
this.displayDefaultStakeholders = this.filterPrivacy(this.defaultStakeholders, value); |
|
106 |
this.displayStakeholders = this.filterPrivacy(this.stakeholders, value); |
|
107 |
} |
|
103 | 108 |
|
104 |
onPrivacyChange(value) {
|
|
105 |
this.displayDefaultStakeholders = this.filterPrivacy(this.defaultStakeholders, value);
|
|
106 |
this.displayStakeholders = this.filterPrivacy(this.stakeholders, value);
|
|
107 |
} |
|
109 |
onStatusChange(value) {
|
|
110 |
this.displayDefaultStakeholders = this.filterStatus(this.defaultStakeholders, value);
|
|
111 |
this.displayStakeholders = this.filterStatus(this.stakeholders, value);
|
|
112 |
}
|
|
108 | 113 |
|
109 |
onStatusChange(value) {
|
|
110 |
this.displayDefaultStakeholders = this.filterStatus(this.defaultStakeholders, value);
|
|
111 |
this.displayStakeholders = this.filterStatus(this.stakeholders, value);
|
|
112 |
} |
|
114 |
onKeywordChange(value) {
|
|
115 |
this.displayDefaultStakeholders = this.filterByKeyword(this.defaultStakeholders, value);
|
|
116 |
this.displayStakeholders = this.filterByKeyword(this.stakeholders, value);
|
|
117 |
}
|
|
113 | 118 |
|
114 |
onKeywordChange(value) { |
|
115 |
this.displayDefaultStakeholders = this.filterByKeyword(this.defaultStakeholders, value); |
|
116 |
this.displayStakeholders = this.filterByKeyword(this.stakeholders, value); |
|
117 |
} |
|
118 | 119 |
|
119 |
|
|
120 |
private filterPrivacy(stakeholders: Stakeholder[], value): Stakeholder[] {
|
|
121 |
if (value === 'all') {
|
|
122 |
return stakeholders;
|
|
123 |
} else {
|
|
124 |
return stakeholders.filter(stakeholder => stakeholder.isPublic === value);
|
|
120 |
private filterPrivacy(stakeholders: Stakeholder[], value): Stakeholder[] { |
|
121 |
if (value === 'all') {
|
|
122 |
return stakeholders;
|
|
123 |
} else {
|
|
124 |
return stakeholders.filter(stakeholder => stakeholder.isPublic === value);
|
|
125 |
}
|
|
125 | 126 |
} |
126 |
} |
|
127 | 127 |
|
128 |
private filterStatus(stakeholders: Stakeholder[], value): Stakeholder[] { |
|
129 |
if (value === 'all') { |
|
130 |
return stakeholders; |
|
131 |
} else { |
|
132 |
return stakeholders.filter(stakeholder => stakeholder.isActive === value); |
|
128 |
private filterStatus(stakeholders: Stakeholder[], value): Stakeholder[] { |
|
129 |
if (value === 'all') { |
|
130 |
return stakeholders; |
|
131 |
} else { |
|
132 |
return stakeholders.filter(stakeholder => stakeholder.isActive === value); |
|
133 |
} |
|
133 | 134 |
} |
134 |
} |
|
135 | 135 |
|
136 |
private filterByKeyword(stakeholders: Stakeholder[], value): Stakeholder[] { |
|
137 |
if (value === null || value === '') { |
|
138 |
return stakeholders; |
|
139 |
} else { |
|
140 |
return stakeholders.filter(stakeholder => ( |
|
141 |
stakeholder.index_id && stakeholder.index_id.toLowerCase().includes(value.toLowerCase())) || |
|
142 |
stakeholder.index_shortName && stakeholder.index_shortName.toLowerCase().includes(value.toLowerCase()) || |
|
143 |
stakeholder.index_name && stakeholder.index_name.toLowerCase().includes(value.toLowerCase()) |
|
144 |
); |
|
136 |
private filterByKeyword(stakeholders: Stakeholder[], value): Stakeholder[] { |
|
137 |
if (value === null || value === '') { |
|
138 |
return stakeholders; |
|
139 |
} else { |
|
140 |
return stakeholders.filter(stakeholder => ( |
|
141 |
stakeholder.index_id && stakeholder.index_id.toLowerCase().includes(value.toLowerCase())) || |
|
142 |
stakeholder.index_shortName && stakeholder.index_shortName.toLowerCase().includes(value.toLowerCase()) || |
|
143 |
stakeholder.index_name && stakeholder.index_name.toLowerCase().includes(value.toLowerCase()) |
|
144 |
); |
|
145 |
} |
|
145 | 146 |
} |
146 |
} |
|
147 | 147 |
|
148 |
public editStakeholder(stakeholder: Stakeholder = null, isDefault: boolean = false) { |
|
149 |
if (isDefault) { |
|
150 |
this.index = (stakeholder) ? this.defaultStakeholders.findIndex(value => value._id === stakeholder._id) : -1; |
|
151 |
} else { |
|
152 |
this.index = (stakeholder) ? this.stakeholders.findIndex(value => value._id === stakeholder._id) : -1; |
|
153 |
} |
|
154 |
if (!stakeholder) { |
|
155 |
this.stakeholder = new Stakeholder(null, null, null, |
|
156 |
null, null, isDefault, null, false, false, null); |
|
157 |
} else { |
|
158 |
this.stakeholder = stakeholder; |
|
159 |
} |
|
160 |
this.stakeholderFb = this.fb.group({ |
|
161 |
_id: this.fb.control(this.stakeholder ._id), |
|
162 |
index_name: this.fb.control(this.stakeholder .index_name, Validators.required), |
|
163 |
index_id: this.fb.control(this.stakeholder .index_id, Validators.required), |
|
164 |
index_shortName: this.fb.control(this.stakeholder .index_shortName, Validators.required), |
|
165 |
isDefaultProfile: this.fb.control(this.stakeholder .isDefaultProfile), |
|
166 |
alias: this.fb.control(this.stakeholder .alias, Validators.required), |
|
167 |
isPublic: this.fb.control(this.stakeholder .isPublic), |
|
168 |
isActive: this.fb.control(this.stakeholder .isActive), |
|
169 |
type: this.fb.control(this.stakeholder .type, Validators.required), |
|
170 |
topics: this.fb.control(this.stakeholder .topics) |
|
171 |
}); |
|
172 |
if (this.index !== -1 && this.stakeholderFb.value.type) { |
|
173 |
this.stakeholderFb.get('type').disable(); |
|
174 |
} |
|
175 |
this.editStakeholderModal.cancelButtonText = 'Cancel'; |
|
176 |
this.editStakeholderModal.okButtonText = 'Save Changes'; |
|
177 |
this.editStakeholderModal.okButtonLeft = false; |
|
178 |
this.editStakeholderModal.alertMessage = false; |
|
179 |
this.editStakeholderModal.open(); |
|
180 |
} |
|
181 |
|
|
182 |
public saveStakeholder() { |
|
183 |
if (this.index === -1) { |
|
184 |
// this.stakeholderFb.setValue(this.stakeholderUtils. |
|
185 |
// createFunderFromDefaultProfile(this.stakeholderFb.value, |
|
186 |
// this.defaultStakeholders.find( value => value.type === this.stakeholderFb.value.type).topics)); |
|
187 |
this.stakeholderFb.setValue(this.stakeholderUtils. |
|
188 |
createFunderFromDefaultProfile(this.stakeholderFb.value, StakeholderCreator.createFunderDefaultProfile().topics)); |
|
189 |
this.stakeholderService.buildStakeholder(this.properties.monitorServiceAPIURL, this.stakeholderFb.value).subscribe(stakeholder => { |
|
190 |
if (stakeholder.isDefaultProfile) { |
|
191 |
this.defaultStakeholders.push(stakeholder); |
|
148 |
public editStakeholder(stakeholder: Stakeholder = null, isDefault: boolean = false) { |
|
149 |
if (isDefault) { |
|
150 |
this.index = (stakeholder) ? this.defaultStakeholders.findIndex(value => value._id === stakeholder._id) : -1; |
|
192 | 151 |
} else { |
193 |
this.stakeholders.push(stakeholder);
|
|
152 |
this.index = (stakeholder) ? this.stakeholders.findIndex(value => value._id === stakeholder._id) : -1;
|
|
194 | 153 |
} |
195 |
}); |
|
196 |
} else { |
|
197 |
this.stakeholderFb.get('type').enable(); |
|
198 |
this.stakeholderService.saveElement(this.properties.monitorServiceAPIURL, this.stakeholderFb.value).subscribe(stakeholder => { |
|
199 |
if (stakeholder.isDefaultProfile) { |
|
200 |
this.defaultStakeholders[this.index] = stakeholder; |
|
154 |
if (!stakeholder) { |
|
155 |
this.stakeholder = new Stakeholder(null, null, null, |
|
156 |
null, null, isDefault, null, false, false, null); |
|
201 | 157 |
} else { |
202 |
this.stakeholders[this.index] = stakeholder;
|
|
158 |
this.stakeholder = stakeholder;
|
|
203 | 159 |
} |
204 |
}); |
|
160 |
this.stakeholderFb = this.fb.group({ |
|
161 |
_id: this.fb.control(this.stakeholder._id), |
|
162 |
index_name: this.fb.control(this.stakeholder.index_name, Validators.required), |
|
163 |
index_id: this.fb.control(this.stakeholder.index_id, Validators.required), |
|
164 |
index_shortName: this.fb.control(this.stakeholder.index_shortName, Validators.required), |
|
165 |
isDefaultProfile: this.fb.control(this.stakeholder.isDefaultProfile), |
|
166 |
alias: this.fb.control(this.stakeholder.alias, Validators.required), |
|
167 |
isPublic: this.fb.control(this.stakeholder.isPublic), |
|
168 |
isActive: this.fb.control(this.stakeholder.isActive), |
|
169 |
type: this.fb.control(this.stakeholder.type, Validators.required), |
|
170 |
topics: this.fb.control(this.stakeholder.topics), |
|
171 |
managers: this.fb.control(this.stakeholder.managers), |
|
172 |
logoUrl: this.fb.control(this.stakeholder.logoUrl) |
|
173 |
}); |
|
174 |
if (this.index !== -1) { |
|
175 |
if (this.stakeholderFb.value.type) { |
|
176 |
setTimeout(() => { |
|
177 |
this.stakeholderFb.get('type').disable(); |
|
178 |
}, 0); |
|
179 |
} else { |
|
180 |
setTimeout(() => { |
|
181 |
this.stakeholderFb.get('type').enable(); |
|
182 |
}, 0); |
|
183 |
} |
|
184 |
this.editStakeholderModal.okButtonText = 'Save Changes'; |
|
185 |
} else { |
|
186 |
setTimeout(() => { |
|
187 |
this.stakeholderFb.get('type').enable(); |
|
188 |
}, 0); |
|
189 |
this.editStakeholderModal.okButtonText = 'Create'; |
|
190 |
} |
|
191 |
this.editStakeholderModal.cancelButtonText = 'Cancel'; |
|
192 |
this.editStakeholderModal.okButtonLeft = false; |
|
193 |
this.editStakeholderModal.alertMessage = false; |
|
194 |
this.editStakeholderModal.open(); |
|
205 | 195 |
} |
206 |
} |
|
207 | 196 |
|
208 |
public deleteStakeholderOpen(stakeholder: Stakeholder, isDefault = false) { |
|
209 |
if (isDefault) { |
|
210 |
this.index = (stakeholder) ? this.defaultStakeholders.findIndex(value => value._id === stakeholder._id) : -1; |
|
211 |
} else { |
|
212 |
this.index = (stakeholder) ? this.stakeholders.findIndex(value => value._id === stakeholder._id) : -1; |
|
197 |
public saveStakeholder() { |
|
198 |
if (this.index === -1) { |
|
199 |
if(!this.stakeholderFb.value.isDefaultProfile) { |
|
200 |
// this.stakeholderFb.setValue(this.stakeholderUtils. |
|
201 |
// createFunderFromDefaultProfile(this.stakeholderFb.value, |
|
202 |
// this.defaultStakeholders.find( value => value.type === this.stakeholderFb.value.type).topics)); |
|
203 |
this.stakeholderFb.setValue(this.stakeholderUtils.createFunderFromDefaultProfile(this.stakeholderFb.value, StakeholderCreator.createFunderDefaultProfile().topics)); |
|
204 |
}/* else { |
|
205 |
this.stakeholderFb.setValue(StakeholderCreator.createFunderDefaultProfile()); |
|
206 |
}*/ |
|
207 |
this.stakeholderService.buildStakeholder(this.properties.monitorServiceAPIURL, this.stakeholderFb.value).subscribe(stakeholder => { |
|
208 |
if (stakeholder.isDefaultProfile) { |
|
209 |
this.defaultStakeholders.push(stakeholder); |
|
210 |
} else { |
|
211 |
this.stakeholders.push(stakeholder); |
|
212 |
} |
|
213 |
}); |
|
214 |
} else { |
|
215 |
this.stakeholderFb.get('type').enable(); |
|
216 |
this.stakeholderService.saveElement(this.properties.monitorServiceAPIURL, this.stakeholderFb.value).subscribe(stakeholder => { |
|
217 |
if (stakeholder.isDefaultProfile) { |
|
218 |
this.defaultStakeholders[this.index] = stakeholder; |
|
219 |
} else { |
|
220 |
this.stakeholders[this.index] = stakeholder; |
|
221 |
} |
|
222 |
}); |
|
223 |
} |
|
213 | 224 |
} |
214 |
} |
|
215 | 225 |
|
216 |
public deleteStakeholder() { |
|
226 |
public deleteStakeholderOpen(stakeholder: Stakeholder) { |
|
227 |
this.stakeholder = stakeholder; |
|
228 |
this.deleteStakeholderModal.alertTitle = 'Delete ' + this.stakeholder.index_name; |
|
229 |
this.deleteStakeholderModal.cancelButtonText = 'No'; |
|
230 |
this.deleteStakeholderModal.okButtonText = 'Yes'; |
|
231 |
this.deleteStakeholderModal.message = 'This stakeholder will permanently be deleted. Are you sure you want to proceed?'; |
|
232 |
this.deleteStakeholderModal.open(); |
|
233 |
} |
|
217 | 234 |
|
218 |
} |
|
235 |
public deleteStakeholder() { |
|
236 |
if (this.stakeholder.isDefaultProfile) { |
|
237 |
this.index = (this.stakeholder) ? this.defaultStakeholders.findIndex(value => value._id === this.stakeholder._id) : -1; |
|
238 |
} else { |
|
239 |
this.index = (this.stakeholder) ? this.stakeholders.findIndex(value => value._id === this.stakeholder._id) : -1; |
|
240 |
} |
|
241 |
this.stakeholderService.deleteElement(this.properties.monitorServiceAPIURL, [this.stakeholder._id]).subscribe(() => { |
|
242 |
if (this.stakeholder.isDefaultProfile) { |
|
243 |
this.defaultStakeholders.splice(this.index, 1); |
|
244 |
} else { |
|
245 |
this.stakeholders.splice(this.index, 1); |
|
246 |
} |
|
247 |
}); |
|
248 |
} |
|
219 | 249 |
} |
Also available in: Unified diff
[Monitor Dashboard]: Add default stakeholder profile. Fix a bug with disable input. Delete stakeholder