fix user edit not populating fields
This commit is contained in:
parent
dd8b49ba0e
commit
ee8f72d3ef
@ -1,7 +1,7 @@
|
||||
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
||||
import { Component, EventEmitter, Input, OnChanges, OnDestroy, Output } from '@angular/core';
|
||||
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
|
||||
import { AdminDialogService } from '../../../services/admin-dialog.service';
|
||||
import { IconButtonTypes, LoadingService, Toaster } from '@iqser/common-ui';
|
||||
import { AutoUnsubscribe, IconButtonTypes, LoadingService, Toaster } from '@iqser/common-ui';
|
||||
import { rolesTranslations } from '../../../../../translations/roles-translations';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { User } from '@red/domain';
|
||||
@ -13,7 +13,7 @@ import { HttpStatusCode } from '@angular/common/http';
|
||||
templateUrl: './user-details.component.html',
|
||||
styleUrls: ['./user-details.component.scss'],
|
||||
})
|
||||
export class UserDetailsComponent {
|
||||
export class UserDetailsComponent extends AutoUnsubscribe implements OnChanges, OnDestroy {
|
||||
readonly iconButtonTypes = IconButtonTypes;
|
||||
|
||||
@Input() user: User;
|
||||
@ -22,8 +22,8 @@ export class UserDetailsComponent {
|
||||
|
||||
readonly ROLES = ['RED_USER', 'RED_MANAGER', 'RED_USER_ADMIN', 'RED_ADMIN'];
|
||||
readonly translations = rolesTranslations;
|
||||
form: FormGroup;
|
||||
private readonly _ROLE_REQUIREMENTS = { RED_MANAGER: 'RED_USER', RED_ADMIN: 'RED_USER_ADMIN' };
|
||||
readonly form: FormGroup = this._getForm();
|
||||
|
||||
constructor(
|
||||
private readonly _formBuilder: FormBuilder,
|
||||
@ -32,7 +32,7 @@ export class UserDetailsComponent {
|
||||
private readonly _loadingService: LoadingService,
|
||||
readonly userService: UserService,
|
||||
) {
|
||||
this._setRolesRequirements();
|
||||
super();
|
||||
}
|
||||
|
||||
get changed(): boolean {
|
||||
@ -67,36 +67,6 @@ export class UserDetailsComponent {
|
||||
}, []);
|
||||
}
|
||||
|
||||
shouldBeDisabled(role: string): boolean {
|
||||
if (!this.user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const isCurrentAdminUser = this.user.isAdmin && this.user.id === this.userService.currentUser.id;
|
||||
return (
|
||||
(role === 'RED_ADMIN' && isCurrentAdminUser) ||
|
||||
Object.keys(this._ROLE_REQUIREMENTS).reduce(
|
||||
(value, key) => value || (role === this._ROLE_REQUIREMENTS[key] && this.user.roles.includes(key)),
|
||||
false,
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
private _getForm(): FormGroup {
|
||||
return this._formBuilder.group({
|
||||
firstName: [this.user?.firstName, Validators.required],
|
||||
lastName: [this.user?.lastName, Validators.required],
|
||||
email: [
|
||||
{
|
||||
value: this.user?.email,
|
||||
disabled: !!this.user,
|
||||
},
|
||||
[Validators.required, Validators.email],
|
||||
],
|
||||
...this._rolesControls,
|
||||
});
|
||||
}
|
||||
|
||||
private get _rolesControls(): any {
|
||||
return this.ROLES.reduce(
|
||||
(prev, role) => ({
|
||||
@ -112,6 +82,26 @@ export class UserDetailsComponent {
|
||||
);
|
||||
}
|
||||
|
||||
ngOnChanges() {
|
||||
this.form = this._getForm();
|
||||
this._setRolesRequirements();
|
||||
}
|
||||
|
||||
shouldBeDisabled(role: string): boolean {
|
||||
if (!this.user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const isCurrentAdminUser = this.user.isAdmin && this.user.id === this.userService.currentUser.id;
|
||||
return (
|
||||
(role === 'RED_ADMIN' && isCurrentAdminUser) ||
|
||||
Object.keys(this._ROLE_REQUIREMENTS).reduce(
|
||||
(value, key) => value || (role === this._ROLE_REQUIREMENTS[key] && this.user.roles.includes(key)),
|
||||
false,
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
async save() {
|
||||
this._loadingService.start();
|
||||
const userData = { ...this.form.getRawValue(), roles: this.activeRoles };
|
||||
@ -143,9 +133,24 @@ export class UserDetailsComponent {
|
||||
});
|
||||
}
|
||||
|
||||
private _getForm(): FormGroup {
|
||||
return this._formBuilder.group({
|
||||
firstName: [this.user?.firstName, Validators.required],
|
||||
lastName: [this.user?.lastName, Validators.required],
|
||||
email: [
|
||||
{
|
||||
value: this.user?.email,
|
||||
disabled: !!this.user,
|
||||
},
|
||||
[Validators.required, Validators.email],
|
||||
],
|
||||
...this._rolesControls,
|
||||
});
|
||||
}
|
||||
|
||||
private _setRolesRequirements() {
|
||||
for (const key of Object.keys(this._ROLE_REQUIREMENTS)) {
|
||||
this.form.controls[key].valueChanges.subscribe(checked => {
|
||||
this.addSubscription = this.form.controls[key].valueChanges.subscribe(checked => {
|
||||
if (checked) {
|
||||
this.form.patchValue({ [this._ROLE_REQUIREMENTS[key]]: true });
|
||||
this.form.controls[this._ROLE_REQUIREMENTS[key]].disable();
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user