diff options
Diffstat (limited to 'portal-FE-os/src/app/layout/components/search-users')
4 files changed, 311 insertions, 0 deletions
diff --git a/portal-FE-os/src/app/layout/components/search-users/search-users.component.html b/portal-FE-os/src/app/layout/components/search-users/search-users.component.html new file mode 100644 index 00000000..4c318f9f --- /dev/null +++ b/portal-FE-os/src/app/layout/components/search-users/search-users.component.html @@ -0,0 +1,73 @@ +<!-- + ============LICENSE_START========================================== + ONAP Portal + =================================================================== + Copyright (C) 2019 AT&T Intellectual Property. All rights reserved. + =================================================================== + + Unless otherwise specified, all software contained herein is licensed + under the Apache License, Version 2.0 (the "License"); + you may not use this software 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. + + Unless otherwise specified, all documentation contained herein is licensed + under the Creative Commons License, Attribution 4.0 Intl. (the "License"); + you may not use this documentation except in compliance with the License. + You may obtain a copy of the License at + + https://creativecommons.org/licenses/by/4.0/ + + Unless required by applicable law or agreed to in writing, documentation + 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============================================ + + + --> + +<form> + {{searchTitle}} + <div class="form-row"> + <div class="col-md-6 my-1"> + <label for="inputSearch" class="sr-only"></label> + <input id="inputSearch" pattern="[a-zA-Z0-9-'\s]{3,}" [(ngModel)]="searchString" (keyup)="passSystemUserInfo($event.srcElement.value)" maxlength="80" + required="true" name="searchString" #searchInput auto-focus tabindex="0" autocomplete="off" type="text" + class="form-control" value="searchString" placeholder="{{placeHolder}}"> + </div> + + <div class="col-auto my-1"> + <button id="button-search-users" *ngIf="!isSystemUser" [disabled]="!searchInput.validity.valid || isLoading " type="submit" + class="btn btn-primary mb-2" (click)="searchUsers()"> Search + </button> + </div> + </div> +</form> +<span class="ecomp-spinner" *ngIf="isLoading"></span> +<div class="search-user-container" *ngIf="showUserTable && !isSystemUser"> + <table mat-table [dataSource]="dataSourceMap"> + <!-- Search Result Column--> + <ng-container matColumnDef="firstName"> + <th id="rowheader-result" mat-header-cell *matHeaderCellDef> Showing {{searchUsersResults.length}} {{txtResults}} </th> + <td id="table-data-{{i}}" mat-cell *matCellDef="let element; let i = index;"> + {{element.firstName}} {{element.lastName}} <br> {{element.jobTitle}} + </td> + </ng-container> + <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr> + <tr mat-row (click)="setSelectedUser(row)" id="table-row-{{i}}" [ngClass]="{ 'selected': row === selectedUser }" + *matRowDef="let row; columns: displayedColumns; let i = index;"></tr> + </table> +</div> +<div class="search-user-container" *ngIf="noUserFlag"> + <p>{{message}} Or <a href="javascript:void(0);" (click)="addNewUser()"><b>Click Here</b></a> to add <b>New User!</b></p> +</div>
\ No newline at end of file diff --git a/portal-FE-os/src/app/layout/components/search-users/search-users.component.scss b/portal-FE-os/src/app/layout/components/search-users/search-users.component.scss new file mode 100644 index 00000000..95a2a5ec --- /dev/null +++ b/portal-FE-os/src/app/layout/components/search-users/search-users.component.scss @@ -0,0 +1,56 @@ +/*- + * ============LICENSE_START========================================== + * ONAP Portal + * =================================================================== + * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved. + * =================================================================== + * + * Unless otherwise specified, all software contained herein is licensed + * under the Apache License, Version 2.0 (the "License"); + * you may not use this software 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. + * + * Unless otherwise specified, all documentation contained herein is licensed + * under the Creative Commons License, Attribution 4.0 Intl. (the "License"); + * you may not use this documentation except in compliance with the License. + * You may obtain a copy of the License at + * + * https://creativecommons.org/licenses/by/4.0/ + * + * Unless required by applicable law or agreed to in writing, documentation + * 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 "../../../pages/pages.component"; + +.mat-row { + cursor: pointer; + background-color: #f2f2f2; +} +.selected { + background-color: #ffffff !important; +} + +.search-user-container { + overflow-y: auto; + height: 250px; +} + +.ecomp-spinner{ + opacity: 10; +} diff --git a/portal-FE-os/src/app/layout/components/search-users/search-users.component.spec.ts b/portal-FE-os/src/app/layout/components/search-users/search-users.component.spec.ts new file mode 100644 index 00000000..9db3e395 --- /dev/null +++ b/portal-FE-os/src/app/layout/components/search-users/search-users.component.spec.ts @@ -0,0 +1,67 @@ +/*- + * ============LICENSE_START========================================== + * ONAP Portal + * =================================================================== + * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved. + * =================================================================== + * + * Unless otherwise specified, all software contained herein is licensed + * under the Apache License, Version 2.0 (the "License"); + * you may not use this software 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. + * + * Unless otherwise specified, all documentation contained herein is licensed + * under the Creative Commons License, Attribution 4.0 Intl. (the "License"); + * you may not use this documentation except in compliance with the License. + * You may obtain a copy of the License at + * + * https://creativecommons.org/licenses/by/4.0/ + * + * Unless required by applicable law or agreed to in writing, documentation + * 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 { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SearchUsersComponent } from './search-users.component'; +import { NgMaterialModule } from 'src/app/ng-material-module'; +import { FormsModule } from '@angular/forms'; +import { HttpClientTestingModule } from '@angular/common/http/testing'; + +describe('SearchUsersComponent', () => { + let component: SearchUsersComponent; + let fixture: ComponentFixture<SearchUsersComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SearchUsersComponent ], + imports: [FormsModule,NgMaterialModule,HttpClientTestingModule] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SearchUsersComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/portal-FE-os/src/app/layout/components/search-users/search-users.component.ts b/portal-FE-os/src/app/layout/components/search-users/search-users.component.ts new file mode 100644 index 00000000..10e4e041 --- /dev/null +++ b/portal-FE-os/src/app/layout/components/search-users/search-users.component.ts @@ -0,0 +1,115 @@ +/*- + * ============LICENSE_START========================================== + * ONAP Portal + * =================================================================== + * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved. + * =================================================================== + * + * Unless otherwise specified, all software contained herein is licensed + * under the Apache License, Version 2.0 (the "License"); + * you may not use this software 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. + * + * Unless otherwise specified, all documentation contained herein is licensed + * under the Creative Commons License, Attribution 4.0 Intl. (the "License"); + * you may not use this documentation except in compliance with the License. + * You may obtain a copy of the License at + * + * https://creativecommons.org/licenses/by/4.0/ + * + * Unless required by applicable law or agreed to in writing, documentation + * 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, Input, ViewChild, Output, EventEmitter } from '@angular/core'; +import { UsersService } from 'src/app/shared/services'; +import { MatTableDataSource, MatPaginator, MatSort } from '@angular/material'; +import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; +import { ConfirmationModalComponent } from 'src/app/modals/confirmation-modal/confirmation-modal.component'; +import { PortalAdmin } from 'src/app/shared/model/PortalAdmin'; + +@Component({ + selector: 'app-search-users', + templateUrl: './search-users.component.html', + styleUrls: ['./search-users.component.scss'] +}) +export class SearchUsersComponent implements OnInit { + + constructor(private userService: UsersService, private ngModal: NgbModal) { } + @Input() searchTitle: string; + @Input() placeHolder: string; + @Input() isSystemUser: boolean; + @ViewChild(MatSort) sort: MatSort; + @ViewChild(MatPaginator) paginator: MatPaginator; + @Output() passBackSelectedUser: EventEmitter<any> = new EventEmitter(); + @Output() userNotFoundFlag = new EventEmitter<boolean>(); + searchString: string; + txtResults = 'result'; + searchUsersResults: any; + selected: any; + isLoading: boolean; + showUserTable: boolean; + selectedUser: any; + displayedColumns: string[] = ['firstName']; + dataSourceMap = new MatTableDataSource(this.searchUsersResults); + submitted = false; + message = " No users found with your query. Please change your search and try again."; + + ngOnInit() { + this.searchString = ''; + this.showUserTable = false; + this.isSystemUser = false; + } + + passSystemUserInfo(systemUser: string) { + if (this.isSystemUser) + this.passBackSelectedUser.emit(systemUser); + } + + noUserFlag: boolean = false; + searchUsers() { + if (!this.isSystemUser) { + this.isLoading = true; + this.showUserTable = false; + this.passBackSelectedUser.emit(this.selectedUser = ''); + this.userService.searchUsers(this.searchString).subscribe((_data: PortalAdmin) => { + this.searchUsersResults = _data; + if (this.searchUsersResults == null || this.searchUsersResults.length == 0) { + this.noUserFlag = true; + this.isLoading = false; + } else { + this.noUserFlag = false; + this.showUserTable = true; + this.isLoading = false; + this.dataSourceMap = new MatTableDataSource(this.searchUsersResults); + this.txtResults = (this.searchUsersResults && this.searchUsersResults.length > 1) ? 'results' : 'result'; + } + }); + } + } + + setSelectedUser(user: PortalAdmin) { + this.selectedUser = user; + this.passBackSelectedUser.emit(this.selectedUser); + } + + addNewUser() { + console.log("Emit the value to parent"); + this.userNotFoundFlag.emit(true); + } + +} |