196. Modifying UI by role - Part 2 (#29)
This commit is contained in:
Art
@ -19,14 +19,15 @@
|
||||
Users
|
||||
</a>
|
||||
|
||||
<!-- Possible attacks-->
|
||||
<!-- document.getElementsByClassName('nav-item nav-link ml-3')[0].click()-->
|
||||
<!-- document.getElementsByName('reset-password-email')[0].value='d.art.shishkin@gmail.com'-->
|
||||
<!-- document.getElementsByName('reset-password-email')[0].closest('form').querySelector('button[type="submit"]').disabled=false -->
|
||||
<!-- document.getElementsByClassName('nav-item nav-link ml-3')[0].hidden=false-->
|
||||
<!-- document.getElementById('reset-password').hidden=false-->
|
||||
<!-- Possible attacks-->
|
||||
<!-- document.getElementsByClassName('nav-item nav-link ml-3')[0].click()-->
|
||||
<!-- document.getElementsByName('reset-password-email')[0].value='d.art.shishkin@gmail.com'-->
|
||||
<!-- document.getElementsByName('reset-password-email')[0].closest('form').querySelector('button[type="submit"]').disabled=false -->
|
||||
<!-- document.getElementsByClassName('nav-item nav-link ml-3')[0].hidden=false-->
|
||||
<!-- document.getElementById('reset-password').hidden=false-->
|
||||
|
||||
<a *ngIf="isAdmin" class="nav-item nav-link ml-3" (click)="changeTitle('Settings')" data-bs-toggle="tab" href="#reset-password">
|
||||
<a *ngIf="isAdmin" class="nav-item nav-link ml-3" (click)="changeTitle('Settings')" data-bs-toggle="tab"
|
||||
href="#reset-password">
|
||||
<i class="fa fa-cogs"></i>
|
||||
Settings
|
||||
</a>
|
||||
@ -52,7 +53,8 @@
|
||||
ngModel (ngModelChange)="searchUsers(searchTerm.value)">
|
||||
</form>
|
||||
|
||||
<button *ngIf="isManager" type="button" class="btn btn-info" data-bs-toggle="modal" data-bs-target="#addUserModal">
|
||||
<button *ngIf="isManager" type="button" class="btn btn-info" data-bs-toggle="modal"
|
||||
data-bs-target="#addUserModal">
|
||||
<i class="fa fa-plus"></i>New User
|
||||
</button>
|
||||
</div>
|
||||
@ -94,7 +96,8 @@
|
||||
<td class="">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-outline-info" (click)="onEditUser(appUser)"><i class="fas fa-edit"></i></button>
|
||||
<button *ngIf="isAdmin" class="btn btn-outline-danger" (click)="onDeleteUser(appUser)"><i class="fas fa-trash"></i>
|
||||
<button *ngIf="isAdmin" class="btn btn-outline-danger" (click)="onDeleteUser(appUser)"><i
|
||||
class="fas fa-trash"></i>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
@ -400,7 +403,8 @@
|
||||
<label for="email">Email</label>
|
||||
<input type="email" name="email" required ngModel class="form-control">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
|
||||
<div *ngIf="isAdmin" class="form-group">
|
||||
<label for="authority">Role</label>
|
||||
<select name="role" required ngModel="ROLE_USER" class="form-control">
|
||||
<option value="ROLE_USER">USER</option>
|
||||
@ -410,6 +414,11 @@
|
||||
<option value="ROLE_SUPER_ADMIN">SUPER ADMIN</option>
|
||||
</select>
|
||||
</div>
|
||||
<div *ngIf="!isAdmin" class="form-group">
|
||||
<label for="authority">Role</label>
|
||||
<input type="text" name="role" required ngModel="USER" readonly class="form-control">
|
||||
</div>
|
||||
|
||||
<div class="input-group mb-2">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">Profile Picture </span>
|
||||
@ -458,7 +467,9 @@
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title text-center">Edit {{editUser.firstName}} {{editUser.lastName}}</h5>
|
||||
<h5 class="modal-title text-center">Edit {{editUser.firstName}} {{editUser.lastName}}
|
||||
<small [hidden]="isManager"> (read only)</small>
|
||||
</h5>
|
||||
<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
@ -468,23 +479,28 @@
|
||||
<form #editUserForm="ngForm">
|
||||
<div class="form-group">
|
||||
<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"
|
||||
[disabled]="!isManager">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="lastName">Last Name</label>
|
||||
<input type="text" name="lastName" required [(ngModel)]="editUser.lastName" class="form-control">
|
||||
<input type="text" name="lastName" required [(ngModel)]="editUser.lastName" class="form-control"
|
||||
[disabled]="!isManager">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="username">Username</label>
|
||||
<input type="text" name="username" required [(ngModel)]="editUser.username" class="form-control">
|
||||
<input type="text" name="username" required [(ngModel)]="editUser.username" class="form-control"
|
||||
[disabled]="!isManager">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="email">Email</label>
|
||||
<input type="email" name="email" required [(ngModel)]="editUser.email" class="form-control">
|
||||
<input type="email" name="email" required [(ngModel)]="editUser.email" class="form-control"
|
||||
[disabled]="!isManager">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="authority">Role</label>
|
||||
<select name="role" required [(ngModel)]="editUser.role" class="form-control">
|
||||
<label for="authority">Role<small [hidden]="isAdmin"> (read only)</small></label>
|
||||
<select name="role" required [(ngModel)]="editUser.role" class="form-control"
|
||||
[disabled]="!isAdmin">
|
||||
<option value="ROLE_USER">USER</option>
|
||||
<option value="ROLE_HR">HR</option>
|
||||
<option value="ROLE_MANAGER">MANAGER</option>
|
||||
@ -499,7 +515,7 @@
|
||||
<div class="custom-file">
|
||||
<input type="file" accept="image/*" name="profileImage"
|
||||
(change)="onProfileImageChange($any($event).target.files)"
|
||||
class="custom-file-input">
|
||||
class="custom-file-input" [disabled]="!isManager">
|
||||
<label class="custom-file-label">
|
||||
<span [hidden]="!profileImageFileName">{{profileImageFileName}}</span>
|
||||
<span [hidden]="profileImageFileName">Choose File</span>
|
||||
@ -509,14 +525,16 @@
|
||||
<fieldset class="form-group">
|
||||
<div class="form-check">
|
||||
<label class="form-check-label">
|
||||
<input type="checkbox" name="active" [(ngModel)]="editUser.active" class="form-check-input">
|
||||
Active
|
||||
<input type="checkbox" name="active" [(ngModel)]="editUser.active" class="form-check-input"
|
||||
[disabled]="!isManager">
|
||||
Active<small [hidden]="isManager"> (read only)</small>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check disabled">
|
||||
<label class="form-check-label">
|
||||
<input type="checkbox" name="notLocked" [(ngModel)]="editUser.notLocked" class="form-check-input">
|
||||
Unlocked
|
||||
<input type="checkbox" name="notLocked" [(ngModel)]="editUser.notLocked" class="form-check-input"
|
||||
[disabled]="!isManager">
|
||||
Unlocked<small [hidden]="isManager"> (read only)</small>
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
@ -526,9 +544,9 @@
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" id="closeEditUserButton">Close
|
||||
</button>
|
||||
<button type="button" class="btn btn-primary" (click)="onUpdateUser()" [disabled]="editUserForm.invalid">
|
||||
Save
|
||||
changes
|
||||
<button *ngIf="isManager" type="button" class="btn btn-primary" (click)="onUpdateUser()"
|
||||
[disabled]="editUserForm.invalid">
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -539,7 +557,7 @@
|
||||
<form enctype="multipart/form-data" style="display:none;">
|
||||
<input type="file"
|
||||
(change)="onProfileImageChange($any($event).target.files); onUpdateProfileImage()"
|
||||
name="profile-image-input" id="profile-image-input" placeholder="file" accept="image/*" />
|
||||
name="profile-image-input" id="profile-image-input" placeholder="file" accept="image/*"/>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user