172. Edit user back end call (#23)

This commit is contained in:
Art
2021-09-21 20:52:24 +03:00
parent 72a3336e14
commit 49e705ff31
3 changed files with 30 additions and 14 deletions

View File

@ -264,33 +264,33 @@
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title text-center">Edit User</h5> <h5 class="modal-title text-center">Edit {{editUser.firstName}} {{editUser.lastName}}</h5>
<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div> <div>
<form #editUserForm="ngForm" (ngSubmit)="onAddNewUser(editUserForm)"> <form #editUserForm="ngForm">
<div class="form-group"> <div class="form-group">
<label for="firstName">First Name</label> <label for="firstName">First Name</label>
<input type="text" name="firstName" required ngModel="{{editUser.firstName}}" class="form-control"> <input type="text" name="firstName" required [(ngModel)]="editUser.firstName" class="form-control">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="lastName">Last Name</label> <label for="lastName">Last Name</label>
<input type="text" name="lastName" required ngModel class="form-control"> <input type="text" name="lastName" required [(ngModel)]="editUser.lastName" class="form-control">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="username">Username</label> <label for="username">Username</label>
<input type="text" name="username" required ngModel class="form-control"> <input type="text" name="username" required [(ngModel)]="editUser.username" class="form-control">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="email">Email</label> <label for="email">Email</label>
<input type="email" name="email" required ngModel class="form-control"> <input type="email" name="email" required [(ngModel)]="editUser.email" class="form-control">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="authority">Role</label> <label for="authority">Role</label>
<select name="role" required ngModel="ROLE_USER" class="form-control"> <select name="role" required [(ngModel)]="editUser.role" class="form-control">
<option value="ROLE_USER">USER</option> <option value="ROLE_USER">USER</option>
<option value="ROLE_HR">HR</option> <option value="ROLE_HR">HR</option>
<option value="ROLE_MANAGER">MANAGER</option> <option value="ROLE_MANAGER">MANAGER</option>
@ -315,24 +315,23 @@
<fieldset class="form-group"> <fieldset class="form-group">
<div class="form-check"> <div class="form-check">
<label class="form-check-label"> <label class="form-check-label">
<input type="checkbox" name="active" ngModel class="form-check-input"> <input type="checkbox" name="active" [(ngModel)]="editUser.active" class="form-check-input">
Active Active
</label> </label>
</div> </div>
<div class="form-check disabled"> <div class="form-check disabled">
<label class="form-check-label"> <label class="form-check-label">
<input type="checkbox" name="notLocked" ngModel class="form-check-input"> <input type="checkbox" name="notLocked" [(ngModel)]="editUser.notLocked" class="form-check-input">
Unlocked Unlocked
</label> </label>
</div> </div>
</fieldset> </fieldset>
<button type="submit" style="display: none;" id="new-user-save"></button>
</form> </form>
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" id="new-user-close">Close</button> <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" id="closeEditUserButton">Close</button>
<button type="button" class="btn btn-primary" (click)="saveNewUser()" [disabled]="newUserForm.invalid">Save <button type="button" class="btn btn-primary" (click)="onUpdateUser()" [disabled]="editUserForm.invalid">Save
changes changes
</button> </button>
</div> </div>

View File

@ -136,4 +136,21 @@ export class UserComponent implements OnInit, OnDestroy {
this.currentUsername = user.username; this.currentUsername = user.username;
this.clickButton('openUserEdit'); this.clickButton('openUserEdit');
} }
public onUpdateUser(): void {
const formData = this.userService.createUserFormData(this.currentUsername, this.editUser, this.profileImage);
let subscription = this.userService.updateUser(formData)
.subscribe(
(user: User) => {
this.clickButton('closeEditUserButton');
this.getUsers(false);
this.invalidateVariables();
this.notificationService.notify(NotificationType.SUCCESS, `User ${user.username} updated successfully`);
},
(errorResponse: HttpErrorResponse) => {
this.sendErrorNotification(errorResponse.error.message);
}
);
this.subscriptions.push(subscription);
}
} }

View File

@ -26,10 +26,10 @@ export class UserService {
.post<User>(`${this.host}/user/add`, formData); .post<User>(`${this.host}/user/add`, formData);
} }
public updateUser(formData: FormData): Observable<User | HttpErrorResponse> { public updateUser(formData: FormData): Observable<User> {
let currentUsername = formData.get(`currentUsername`); let currentUsername = formData.get(`currentUsername`);
return this.httpClient return this.httpClient
.put<User | HttpErrorResponse>(`${this.host}/user/${currentUsername}`, formData); .put<User>(`${this.host}/user/${currentUsername}`, formData);
} }
public resetPassword(email: string): Observable<CustomHttpResponse> { public resetPassword(email: string): Observable<CustomHttpResponse> {