Revision 59619
Added by Konstantinos Triantafyllou over 3 years ago
| manageStakeholders.component.ts | ||
|---|---|---|
| 5 | 5 |
import {Stakeholder} from "../openaireLibrary/monitor/entities/stakeholder";
|
| 6 | 6 |
import {Subscriber, zip} from "rxjs";
|
| 7 | 7 |
import {StakeholderUtils} from "../utils/indicator-utils";
|
| 8 |
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
|
|
| 8 |
import {FormBuilder, FormGroup} from "@angular/forms";
|
|
| 9 | 9 |
import {AlertModal} from "../openaireLibrary/utils/modal/alert";
|
| 10 | 10 |
import {Option} from "../openaireLibrary/dashboard/sharedComponents/input/input.component";
|
| 11 | 11 |
import {Title} from "@angular/platform-browser";
|
| 12 | 12 |
import {UserManagementService} from "../openaireLibrary/services/user-management.service";
|
| 13 | 13 |
import {Session} from "../openaireLibrary/login/utils/helper.class";
|
| 14 |
import {UtilitiesService} from "../openaireLibrary/services/utilities.service";
|
|
| 14 |
import {EditStakeholderComponent} from "../manageStakeholder/edit-stakeholder/edit-stakeholder.component";
|
|
| 15 | 15 |
|
| 16 | 16 |
declare var UIkit; |
| 17 | 17 |
|
| ... | ... | |
| 27 | 27 |
public defaultStakeholders: Stakeholder[]; |
| 28 | 28 |
public stakeholders: Stakeholder[]; |
| 29 | 29 |
public stakeholder: Stakeholder; |
| 30 |
public stakeholderFb: FormGroup; |
|
| 31 | 30 |
public index: number; |
| 32 | 31 |
public user = null; |
| 33 | 32 |
/** |
| ... | ... | |
| 35 | 34 |
*/ |
| 36 | 35 |
public displayDefaultStakeholders: Stakeholder[]; |
| 37 | 36 |
public displayStakeholders: Stakeholder[]; |
| 38 |
|
|
| 39 |
public defaultStakeholdersOptions: Option[] = []; |
|
| 40 |
|
|
| 41 | 37 |
/** |
| 42 | 38 |
* Top filters |
| 43 | 39 |
*/ |
| ... | ... | |
| 47 | 43 |
label: 'All' |
| 48 | 44 |
}; |
| 49 | 45 |
|
| 46 |
public callback: Function; |
|
| 47 |
|
|
| 50 | 48 |
/** |
| 51 | 49 |
* Grid or List View |
| 52 | 50 |
*/ |
| 53 | 51 |
public grid: boolean = true; |
| 54 | 52 |
private subscriptions: any[] = []; |
| 55 |
|
|
| 56 |
/** |
|
| 57 |
* Photo upload |
|
| 58 |
* */ |
|
| 59 |
public file: File; |
|
| 60 |
public photo: string | ArrayBuffer; |
|
| 61 |
public uploadError: string; |
|
| 62 |
public deleteCurrentPhoto: boolean = false; |
|
| 63 |
private maxsize: number = 200 * 1024; |
|
| 64 |
|
|
| 65 | 53 |
@ViewChild('editStakeholderModal') editStakeholderModal: AlertModal;
|
| 66 | 54 |
@ViewChild('deleteStakeholderModal') deleteStakeholderModal: AlertModal;
|
| 55 |
@ViewChild('editStakeholderComponent') editStakeholderComponent: EditStakeholderComponent;
|
|
| 67 | 56 |
|
| 68 | 57 |
constructor(private stakeholderService: StakeholderService, |
| 69 |
private utilsService: UtilitiesService, |
|
| 70 | 58 |
private userManagementService: UserManagementService, |
| 71 | 59 |
private propertiesService: EnvironmentSpecificService, |
| 72 | 60 |
private title: Title, |
| ... | ... | |
| 95 | 83 |
}); |
| 96 | 84 |
}); |
| 97 | 85 |
this.subscriptions.push(UIkit.util.on(document, 'hidden', '#edit_modal', (): void => {
|
| 98 |
this.removePhoto(); |
|
| 86 |
this.editStakeholderComponent.removePhoto();
|
|
| 99 | 87 |
})); |
| 100 | 88 |
} |
| 101 | 89 |
|
| ... | ... | |
| 149 | 137 |
this.displayStakeholders = this.filterByKeyword(this.stakeholders, value); |
| 150 | 138 |
} |
| 151 | 139 |
|
| 152 |
onTypeChange(value) {
|
|
| 153 |
this.defaultStakeholdersOptions = [{
|
|
| 154 |
label: 'New blank profile', |
|
| 155 |
value: '-1' |
|
| 156 |
}]; |
|
| 157 |
this.defaultStakeholders.filter(stakeholder => stakeholder.type === value).forEach(stakeholder => {
|
|
| 158 |
this.defaultStakeholdersOptions.push({
|
|
| 159 |
label: 'Use ' + stakeholder.name + ' profile', |
|
| 160 |
value: stakeholder._id |
|
| 161 |
}) |
|
| 162 |
}); |
|
| 163 |
} |
|
| 164 | 140 |
|
| 165 |
|
|
| 166 | 141 |
private filterPrivacy(stakeholders: Stakeholder[], value): Stakeholder[] {
|
| 167 | 142 |
if (value === 'all') {
|
| 168 | 143 |
return stakeholders; |
| ... | ... | |
| 199 | 174 |
} |
| 200 | 175 |
if (!stakeholder) {
|
| 201 | 176 |
this.stakeholder = new Stakeholder(null, null, null, |
| 202 |
null, null, null, false, false, null);
|
|
| 177 |
null, null, null, null, null);
|
|
| 203 | 178 |
} else {
|
| 204 | 179 |
this.stakeholder = stakeholder; |
| 205 | 180 |
} |
| 206 |
this.stakeholderFb = this.fb.group({
|
|
| 207 |
_id: this.fb.control(this.stakeholder._id), |
|
| 208 |
defaultId: this.fb.control(this.stakeholder.defaultId), |
|
| 209 |
name: this.fb.control(this.stakeholder.name, Validators.required), |
|
| 210 |
description: this.fb.control(this.stakeholder.description), |
|
| 211 |
index_name: this.fb.control(this.stakeholder.index_name, Validators.required), |
|
| 212 |
index_id: this.fb.control(this.stakeholder.index_id, Validators.required), |
|
| 213 |
index_shortName: this.fb.control(this.stakeholder.index_shortName, Validators.required), |
|
| 214 |
creationDate: this.fb.control(this.stakeholder.creationDate), |
|
| 215 |
alias: this.fb.control(this.stakeholder.alias, |
|
| 216 |
[ |
|
| 217 |
Validators.required, |
|
| 218 |
this.stakeholderUtils.aliasValidator( |
|
| 219 |
(isDefault) ? |
|
| 220 |
this.defaultStakeholders.filter(stakeholder => stakeholder.alias !== this.stakeholder.alias) : |
|
| 221 |
this.stakeholders.filter(stakeholder => stakeholder.alias !== this.stakeholder.alias) |
|
| 222 |
)] |
|
| 223 |
), |
|
| 224 |
isDefault: this.fb.control(isDefault), |
|
| 225 |
isPublic: this.fb.control(this.stakeholder.isPublic), |
|
| 226 |
isActive: this.fb.control(this.stakeholder.isActive), |
|
| 227 |
type: this.fb.control(this.stakeholder.type, Validators.required), |
|
| 228 |
topics: this.fb.control(this.stakeholder.topics), |
|
| 229 |
managers: this.fb.control(this.stakeholder.managers), |
|
| 230 |
isUpload: this.fb.control(this.stakeholder.isUpload), |
|
| 231 |
logoUrl: this.fb.control(this.stakeholder.logoUrl), |
|
| 232 |
}); |
|
| 233 |
this.initPhoto(); |
|
| 234 |
this.subscriptions.push(this.stakeholderFb.get('type').valueChanges.subscribe(value => {
|
|
| 235 |
this.onTypeChange(value); |
|
| 236 |
})); |
|
| 237 |
this.subscriptions.push(this.stakeholderFb.get('logoUrl').valueChanges.subscribe(value => {
|
|
| 238 |
if(value) {
|
|
| 239 |
this.photo = value; |
|
| 240 |
} else {
|
|
| 241 |
this.photo = 'assets/common-assets/curator-default.png'; |
|
| 242 |
} |
|
| 243 |
})); |
|
| 244 |
if (!isDefault) {
|
|
| 245 |
this.stakeholderFb.setControl('defaultId', this.fb.control(this.stakeholder.defaultId, Validators.required));
|
|
| 246 |
} |
|
| 181 |
this.editStakeholderComponent.init(this.stakeholder, this.stakeholders, this.defaultStakeholders, isDefault, this.index === -1); |
|
| 247 | 182 |
if (this.index !== -1) {
|
| 248 |
if (this.stakeholderFb.value.type) {
|
|
| 249 |
setTimeout(() => {
|
|
| 250 |
this.stakeholderFb.get('type').disable();
|
|
| 251 |
}, 0); |
|
| 252 |
} else {
|
|
| 253 |
setTimeout(() => {
|
|
| 254 |
this.stakeholderFb.get('type').enable();
|
|
| 255 |
}, 0); |
|
| 256 |
} |
|
| 257 |
this.editStakeholderModal.okButtonText = 'Save Changes'; |
|
| 258 |
} else {
|
|
| 259 |
setTimeout(() => {
|
|
| 260 |
this.stakeholderFb.get('type').enable();
|
|
| 261 |
}, 0); |
|
| 262 |
this.editStakeholderModal.okButtonText = 'Create'; |
|
| 263 |
} |
|
| 264 |
this.uploadError = null; |
|
| 265 |
this.deleteCurrentPhoto = false; |
|
| 266 |
this.editStakeholderModal.cancelButtonText = 'Cancel'; |
|
| 267 |
this.editStakeholderModal.okButtonLeft = false; |
|
| 268 |
this.editStakeholderModal.alertMessage = false; |
|
| 269 |
this.editStakeholderModal.open(); |
|
| 270 |
} |
|
| 271 |
|
|
| 272 |
public save() {
|
|
| 273 |
if (this.file) {
|
|
| 274 |
this.utilsService.uploadPhoto(this.properties.utilsService + "/upload/stakeholder/" + encodeURIComponent(this.stakeholder.alias), this.file).subscribe(res => {
|
|
| 275 |
this.deletePhoto(); |
|
| 276 |
this.removePhoto(); |
|
| 277 |
this.stakeholderFb.get('logoUrl').setValue(res.filename);
|
|
| 278 |
this.saveStakeholder(); |
|
| 279 |
}, error => {
|
|
| 280 |
this.uploadError = "An error has been occurred during upload your image. Try again later"; |
|
| 281 |
this.saveStakeholder(); |
|
| 282 |
}); |
|
| 283 |
} else if (this.deleteCurrentPhoto) {
|
|
| 284 |
this.deletePhoto(); |
|
| 285 |
this.saveStakeholder(); |
|
| 286 |
} else {
|
|
| 287 |
this.saveStakeholder(); |
|
| 288 |
} |
|
| 289 |
} |
|
| 290 |
|
|
| 291 |
public saveStakeholder() {
|
|
| 292 |
if (this.index === -1) {
|
|
| 293 |
if (!this.stakeholderFb.value.isDefault) {
|
|
| 294 |
let stakeholder = this.defaultStakeholders.find(value => value._id === this.stakeholderFb.value.defaultId); |
|
| 295 |
this.stakeholderFb.setValue(this.stakeholderUtils.createFunderFromDefaultProfile(this.stakeholderFb.value, |
|
| 296 |
(stakeholder ? stakeholder.topics : []))); |
|
| 297 |
} |
|
| 298 |
this.removePhoto(); |
|
| 299 |
this.stakeholderService.buildStakeholder(this.properties.monitorServiceAPIURL, |
|
| 300 |
this.stakeholderFb.value).subscribe(stakeholder => {
|
|
| 183 |
this.callback = (stakeholder: Stakeholder) => {
|
|
| 301 | 184 |
if (stakeholder.defaultId === null) {
|
| 302 | 185 |
this.defaultStakeholders.push(stakeholder); |
| 303 | 186 |
} else {
|
| 304 | 187 |
this.stakeholders.push(stakeholder); |
| 305 | 188 |
} |
| 306 |
}); |
|
| 189 |
}; |
|
| 190 |
this.editStakeholderModal.okButtonText = 'Save Changes'; |
|
| 307 | 191 |
} else {
|
| 308 |
this.stakeholderFb.get('type').enable();
|
|
| 309 |
this.stakeholderService.saveElement(this.properties.monitorServiceAPIURL, this.stakeholderFb.value).subscribe(stakeholder => {
|
|
| 192 |
this.callback = (stakeholder: Stakeholder) => {
|
|
| 310 | 193 |
if (stakeholder.defaultId == null) {
|
| 311 | 194 |
this.defaultStakeholders[this.index] = stakeholder; |
| 312 | 195 |
} else {
|
| 313 | 196 |
this.stakeholders[this.index] = stakeholder; |
| 314 | 197 |
} |
| 315 |
}); |
|
| 198 |
}; |
|
| 199 |
this.editStakeholderModal.okButtonText = 'Create'; |
|
| 316 | 200 |
} |
| 201 |
this.editStakeholderModal.cancelButtonText = 'Cancel'; |
|
| 202 |
this.editStakeholderModal.okButtonLeft = false; |
|
| 203 |
this.editStakeholderModal.alertMessage = false; |
|
| 204 |
this.editStakeholderModal.open(); |
|
| 317 | 205 |
} |
| 318 | 206 |
|
| 319 | 207 |
public deleteStakeholderOpen(stakeholder: Stakeholder) {
|
| ... | ... | |
| 361 | 249 |
public isAdministrator(): boolean {
|
| 362 | 250 |
return Session.isPortalAdministrator(this.user); |
| 363 | 251 |
} |
| 364 |
|
|
| 365 |
public deletePhoto() {
|
|
| 366 |
if (this.stakeholder.logoUrl) {
|
|
| 367 |
this.utilsService.deletePhoto(this.properties.utilsService + '/delete/stakeholder/' + this.stakeholder.logoUrl).subscribe(); |
|
| 368 |
} |
|
| 369 |
} |
|
| 370 |
|
|
| 371 |
fileChangeEvent(event) {
|
|
| 372 |
if (event.target.files && event.target.files[0]) {
|
|
| 373 |
this.file = event.target.files[0]; |
|
| 374 |
if (this.file.type !== 'image/png' && this.file.type !== 'image/jpeg') {
|
|
| 375 |
this.uploadError = 'You must choose a file with type: image/png or image/jpeg!'; |
|
| 376 |
this.stakeholderFb.get('isUpload').setValue(false);
|
|
| 377 |
this.removePhoto(); |
|
| 378 |
} else if (this.file.size > this.maxsize) {
|
|
| 379 |
this.uploadError = 'File exceeds size\'s limit! Maximum resolution is 256x256 pixels.'; |
|
| 380 |
this.stakeholderFb.get('isUpload').setValue(false);
|
|
| 381 |
this.removePhoto() |
|
| 382 |
} else {
|
|
| 383 |
this.uploadError = null; |
|
| 384 |
const reader = new FileReader(); |
|
| 385 |
reader.readAsDataURL(this.file); |
|
| 386 |
reader.onload = () => {
|
|
| 387 |
this.photo = reader.result; |
|
| 388 |
this.stakeholderFb.get('isUpload').setValue(true);
|
|
| 389 |
}; |
|
| 390 |
} |
|
| 391 |
} |
|
| 392 |
} |
|
| 393 |
|
|
| 394 |
initPhoto() {
|
|
| 395 |
if (this.stakeholderFb.get('logoUrl').value) {
|
|
| 396 |
if (!this.stakeholderFb.value.isUpload) {
|
|
| 397 |
this.photo = this.stakeholderFb.get('logoUrl').value;
|
|
| 398 |
} else {
|
|
| 399 |
this.photo = this.properties.utilsService + "/download/" + this.stakeholderFb.get('logoUrl').value;
|
|
| 400 |
} |
|
| 401 |
} else {
|
|
| 402 |
this.photo = 'assets/common-assets/curator-default.png'; |
|
| 403 |
} |
|
| 404 |
} |
|
| 405 |
|
|
| 406 |
removePhoto() {
|
|
| 407 |
if (typeof document != 'undefined') {
|
|
| 408 |
(<HTMLInputElement>document.getElementById("photo")).value = "";
|
|
| 409 |
} |
|
| 410 |
this.initPhoto(); |
|
| 411 |
this.file = null; |
|
| 412 |
} |
|
| 413 |
|
|
| 414 |
remove() {
|
|
| 415 |
this.stakeholderFb.get('isUpload').setValue(false);
|
|
| 416 |
if (this.file) {
|
|
| 417 |
this.removePhoto(); |
|
| 418 |
} |
|
| 419 |
if (this.stakeholder.isUpload) {
|
|
| 420 |
this.stakeholderFb.get('logoUrl').setValue(null);
|
|
| 421 |
this.deleteCurrentPhoto = true; |
|
| 422 |
} |
|
| 423 |
} |
|
| 424 | 252 |
} |
Also available in: Unified diff
[Monitor Dashboard | Trunk]: Organize new dashboard theme to files