From 457685063fd4b960441e482cc8b88fa8c972a7d2 Mon Sep 17 00:00:00 2001 From: Nicholas Soteropoulos Date: Mon, 14 Sep 2020 17:19:10 -0400 Subject: Fix mod ui build issues Change-Id: I4d002645240852a3a5f1964d9ffa2cac11c45b47 Signed-off-by: Nicholas Soteropoulos Issue-ID: DCAEGEN2-2317 Signed-off-by: Nicholas Soteropoulos --- .../user-management/user-management.component.css | 54 ++++++++ .../user-management/user-management.component.html | 89 ++++++++++++ .../user-management.component.spec.ts | 63 +++++++++ .../user-management/user-management.component.ts | 149 +++++++++++++++++++++ 4 files changed, 355 insertions(+) create mode 100644 mod2/ui/src/app/user-management/user-management.component.css create mode 100644 mod2/ui/src/app/user-management/user-management.component.html create mode 100644 mod2/ui/src/app/user-management/user-management.component.spec.ts create mode 100644 mod2/ui/src/app/user-management/user-management.component.ts (limited to 'mod2/ui/src/app/user-management') diff --git a/mod2/ui/src/app/user-management/user-management.component.css b/mod2/ui/src/app/user-management/user-management.component.css new file mode 100644 index 0000000..495d0f8 --- /dev/null +++ b/mod2/ui/src/app/user-management/user-management.component.css @@ -0,0 +1,54 @@ +/* + * # ============LICENSE_START======================================================= + * # Copyright (c) 2020 AT&T Intellectual Property. All rights reserved. + * # ================================================================================ + * # Licensed under the Apache License, Version 2.0 (the "License"); + * # you may not use this file except in compliance with the License. + * # You may obtain a copy of the License at + * # + * # http://www.apache.org/licenses/LICENSE-2.0 + * # + * # Unless required by applicable law or agreed to in writing, software + * # distributed under the License is distributed on an "AS IS" BASIS, + * # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * # See the License for the specific language governing permissions and + * # limitations under the License. + * # ============LICENSE_END========================================================= + */ + +.pi-trash:hover { + color:red; +} +.pi-pencil:hover { + color:blue; +} + +label { + cursor: pointer; +} + +.input{ + padding-top: 10px; +} + +.inputLabel { + font-weight: 600; + margin-left: 20px; + width: 140px; +} + +.inputFieldSm { + width: 200px; + height: 35px; + padding-left: 6px; +} +.inputFieldMed { + width: 300px; + height: 35px; + padding-left: 6px; +} +.inputFieldLg { + width: 400px; + height: 35px; + padding-left: 6px; +} \ No newline at end of file diff --git a/mod2/ui/src/app/user-management/user-management.component.html b/mod2/ui/src/app/user-management/user-management.component.html new file mode 100644 index 0000000..6885fe1 --- /dev/null +++ b/mod2/ui/src/app/user-management/user-management.component.html @@ -0,0 +1,89 @@ + + +
+ + +
System User List and Management ( for admin only )
+
+ Want to register a new user? Click here! + + + + Username (ATT UID) + Full Name + Roles + + Actions + + + + + {{user.username}} + {{user.fullName}} + {{user.roles}} + + + + + + + + + + + + + Edit User Information + + +
+ +
+   + {{editUser.username}} +
+ +
+   + +
+ +
+   + + +
+ +
+
+   + + +
+
+ password should be at least 6 characters + +
+   + +
+
+ +
\ No newline at end of file diff --git a/mod2/ui/src/app/user-management/user-management.component.spec.ts b/mod2/ui/src/app/user-management/user-management.component.spec.ts new file mode 100644 index 0000000..2cb6a6e --- /dev/null +++ b/mod2/ui/src/app/user-management/user-management.component.spec.ts @@ -0,0 +1,63 @@ +/* + * # ============LICENSE_START======================================================= + * # Copyright (c) 2020 AT&T Intellectual Property. All rights reserved. + * # ================================================================================ + * # Licensed under the Apache License, Version 2.0 (the "License"); + * # you may not use this file except in compliance with the License. + * # You may obtain a copy of the License at + * # + * # http://www.apache.org/licenses/LICENSE-2.0 + * # + * # Unless required by applicable law or agreed to in writing, software + * # distributed under the License is distributed on an "AS IS" BASIS, + * # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * # See the License for the specific language governing permissions and + * # limitations under the License. + * # ============LICENSE_END========================================================= + */ + +import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; +import { RouterTestingModule } from '@angular/router/testing'; +import { JwtHelperService, JWT_OPTIONS } from '@auth0/angular-jwt'; +import { DialogModule } from 'primeng/dialog'; +import { MultiSelectModule } from 'primeng/multiselect'; +import { TableModule } from 'primeng/table'; + +import { UserManagementComponent } from './user-management.component'; + +describe('UserManagementComponent', () => { + let component: UserManagementComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [UserManagementComponent], + imports: [ + TableModule, + DialogModule, + MultiSelectModule, + FormsModule, + ReactiveFormsModule, + HttpClientTestingModule, + RouterTestingModule + ], + providers: [ + { provide: JWT_OPTIONS, useValue: JWT_OPTIONS }, + JwtHelperService + ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(UserManagementComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/mod2/ui/src/app/user-management/user-management.component.ts b/mod2/ui/src/app/user-management/user-management.component.ts new file mode 100644 index 0000000..b7ee6e7 --- /dev/null +++ b/mod2/ui/src/app/user-management/user-management.component.ts @@ -0,0 +1,149 @@ +/* + * # ============LICENSE_START======================================================= + * # Copyright (c) 2020 AT&T Intellectual Property. All rights reserved. + * # ================================================================================ + * # Licensed under the Apache License, Version 2.0 (the "License"); + * # you may not use this file except in compliance with the License. + * # You may obtain a copy of the License at + * # + * # http://www.apache.org/licenses/LICENSE-2.0 + * # + * # Unless required by applicable law or agreed to in writing, software + * # distributed under the License is distributed on an "AS IS" BASIS, + * # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * # See the License for the specific language governing permissions and + * # limitations under the License. + * # ============LICENSE_END========================================================= + */ + +import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { User } from '../models/User'; +import { UserService } from '../services/user.service'; +import { Router } from '@angular/router'; +import { FormGroup, FormBuilder, Validators } from '@angular/forms'; +import { SelectItem } from 'primeng/api'; +import { AuthService } from '../services/auth.service'; + +@Component({ + selector: 'app-user-management', + templateUrl: './user-management.component.html', + styleUrls: ['./user-management.component.css'] +}) +export class UserManagementComponent implements OnInit { + + users: User[] = []; + editUser: User = { + username:'', + fullName:'', + roles: [] + }; + editUserFlag: boolean = false; + editUserForm: FormGroup; + rolesFromBackend = []; + selectedRoles : Array= []; + + constructor(private userService: UserService, private router: Router, private fb: FormBuilder, private authService: AuthService) { } + + ngOnInit() { + this.userService.getUsers().subscribe((res: User[]) => { + this.users = res; + this.users.map(user=>{ + let tempRoles = []; + user.roles.map(role=>{ + tempRoles.push(role.name.substring(5)); + }); + user.roles = tempRoles; + }); + + }); + this.editUserForm = this.fb.group({ + username: '', + fullName: '', + password: [null, [ Validators.minLength(6)]], + roles: [this.selectedRoles, [Validators.required]] + }); + this.userService.getRoles().subscribe(res=>{ + Object.values(res).forEach(ele=>{ + this.rolesFromBackend.push({label:ele.substring(5), value:ele}); + }); + }); + } + + handleDelete(username) { + const result = window.confirm('Are you sure to delete this user?'); + if(result === true) { + this.userService.deleteUser(username).subscribe(res=>{ + alert(res.message); + this.userService.getUsers().subscribe( r => { + this.users = r; + this.users.map(user=>{ + let tempRoles = []; + user.roles.map(role=>{ + tempRoles.push(role.name.substring(5)); + }); + user.roles = tempRoles; + }); + }); + }); + } + } + + handleEdit(user) { + this.selectedRoles = []; + this.editUserFlag = true; + this.editUser = user; + this.editUserForm.get('username').setValue(user.username); + this.editUserForm.get('fullName').setValue(user.fullName); + user.roles.map(ele => { + let temp = "ROLE_" + ele; + this.selectedRoles.push(temp); + }) + + this.editUserForm.get('roles').setValue(this.selectedRoles); + + } + + closeEditDialog() { + this.editUserForm.reset(); + this.editUserFlag = false; + } + + generateNewPassword() { + this.editUserForm.value.password = ''; + const chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%&'; + var array = new Uint32Array(32); + window.crypto.getRandomValues(array); + for(let i=0;i<32;i++) { + const index = Math.floor(array[i] % chars.length); + this.editUserForm.value.password += chars.charAt(index); + } + this.editUserForm.patchValue({password: this.editUserForm.value.password}); + } + + submitEdit(user) { + this.editUserFlag = false; + console.log(this.editUserForm.value.fullName); + let tempUser = this.editUserForm.value as User; + console.log(tempUser); + this.userService.editUser(user.username, this.editUserForm.value as User).subscribe(res=>{ + alert("User information updated successfully."); + this.userService.getUsers().subscribe( r => { + this.users = r; + this.users.map(user=>{ + let tempRoles = []; + user.roles.map(role=>{ + tempRoles.push(role.name.substring(5)); + }); + user.roles = tempRoles; + }); + }, (err)=>{ + // alert(err.error.message); + alert("Sorry but your credentials are out of date. Please log in again to resolve this."); + this.authService.logout(); + }); + }, (err)=>{ + alert(err.error.message); + }); + } + +} -- cgit 1.2.3-korg