import { Component, Input, OnInit } from '@angular/core'; import { AbstractControl, FormArray, FormBuilder, FormControl, FormGroup } from '@angular/forms'; import { MatSnackBar } from '@angular/material'; import { TranslateService } from '@ngx-translate/core'; import { takeUntil } from 'rxjs/operators'; import { BaseComponent } from '../../../core/common/base/base.component'; import { Principal } from '../../../models/login/Principal'; import { UserErrorModel } from '../../../models/users/UserErrorModel'; import { UserListingModel } from '../../../models/users/UserListingModel'; import { UserReferenceService } from '../../../services/user-reference/user-reference-data.service'; import { SnackBarNotificationComponent } from '../../../shared/components/notificaiton/snack-bar-notification.component'; import { Utilities } from '../../../utilities/utilities'; import { Validation, ValidationContext } from '../../../utilities/validators/ValidationContext'; @Component({ selector: 'app-user-role-editor-component', templateUrl: './user-role-editor.component.html', styleUrls: ['./user-role-editor.component.scss'], providers: [Utilities] }) export class UserRoleEditorComponent extends BaseComponent implements OnInit { @Input() public item: UserListingModel; public formGroup: FormGroup = null; public nowEditing = false; public errorModel: UserErrorModel; constructor( public language: TranslateService, public userService: UserReferenceService, public formBuilder: FormBuilder, public snackBar: MatSnackBar, public utilities: Utilities ) { super(); } ngOnInit() { if (this.errorModel == null) { this.errorModel = new UserErrorModel(); } if (this.formGroup == null) { this.formGroup = this.buildForm(); } } buildForm(): FormGroup { const context: ValidationContext = this.createValidationContext(); return this.formBuilder.group({ appRoles: new FormControl({ value: this.item.appRoles, disabled: true }, context.getValidation('appRoles').validators) }); } createValidationContext(): ValidationContext { const validationContext: ValidationContext = new ValidationContext(); const validationArray: Validation[] = new Array(); validationArray.push({ key: 'appRoles' }); validationContext.validation = validationArray; return validationContext; } formSubmit(): void { this.clearErrorModel(); const modifiedItem = new UserListingModel().fromJSONObject(this.item); modifiedItem.appRoles = this.getFormControl('appRoles').value; if (!this.isFormValid()) { return; } this.userService.updateRoles(modifiedItem) .pipe(takeUntil(this._destroyed)) .subscribe( (res) => this.onCallbackSuccess(), (error) => this.onCallbackError(error) ); } editItem(): void { this.formGroup.enable(); this.nowEditing = true; } isFormValid(): boolean { this.touchAllFormFields(this.formGroup); this.validateAllFormFields(this.formGroup); return this.formGroup.valid; } getFormData(): any { return this.formGroup.value; } getFormControl(controlName: string): AbstractControl { return this.formGroup.get(controlName); } validateAllFormFields(formControl: AbstractControl) { if (formControl instanceof FormControl) { formControl.updateValueAndValidity({ emitEvent: false }); } else if (formControl instanceof FormGroup) { Object.keys(formControl.controls).forEach(item => { const control = formControl.get(item); this.validateAllFormFields(control); }); } else if (formControl instanceof FormArray) { formControl.controls.forEach(item => { this.validateAllFormFields(item); }); } } touchAllFormFields(formControl: AbstractControl) { if (formControl instanceof FormControl) { formControl.markAsTouched(); } else if (formControl instanceof FormGroup) { Object.keys(formControl.controls).forEach(item => { const control = formControl.get(item); this.touchAllFormFields(control); }); } else if (formControl instanceof FormArray) { formControl.controls.forEach(item => { this.touchAllFormFields(item); }); } } setErrorModel(errorModel: UserErrorModel) { Object.keys(errorModel).forEach(item => { (this.errorModel)[item] = (errorModel)[item]; }); } clearErrorModel() { Object.keys(this.errorModel).forEach(item => { (this.errorModel)[item] = ''; }); } onCallbackSuccess() { this.nowEditing = false; this.formGroup.disable(); this.snackBar.openFromComponent(SnackBarNotificationComponent, { data: { message: 'GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE', language: this.language }, duration: 3000, }); } onCallbackError(error: any) { this.setErrorModel(error.error); this.validateAllFormFields(this.formGroup); this.snackBar.openFromComponent(SnackBarNotificationComponent, { data: { message: 'GENERAL.SNACK-BAR.UNSUCCESSFUL-UPDATE', language: this.language }, duration: 3000, }); } getPrincipalAppRoleValues(): Number[] { let keys: string[] = Object.keys(Principal.AppRole); keys = keys.slice(0, keys.length / 2); const values: Number[] = keys.map(Number); return values; } getPrincipalAppRoleWithLanguage(role: Principal.AppRole): string { let result = ''; this.language.get(this.utilities.convertFromPrincipalAppRole(role)) .pipe(takeUntil(this._destroyed)) .subscribe((value: string) => { result = value; }); return result; } }