portal-FE-common/src/app/pages/users/users.component.ts

   1 /*-
   2  * ============LICENSE_START==========================================
   3  * ONAP Portal
   4  * ===================================================================
   5  * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
   6  * ===================================================================
   7  *
   8  * Unless otherwise specified, all software contained herein is licensed
   9  * under the Apache License, Version 2.0 (the "License");
  10  * you may not use this software except in compliance with the License.
  11  * You may obtain a copy of the License at
  12  *
  13  *             http://www.apache.org/licenses/LICENSE-2.0
  14  *
  15  * Unless required by applicable law or agreed to in writing, software
  16  * distributed under the License is distributed on an "AS IS" BASIS,
  17  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  18  * See the License for the specific language governing permissions and
  19  * limitations under the License.
  20  *
  21  * Unless otherwise specified, all documentation contained herein is licensed
  22  * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
  23  * you may not use this documentation except in compliance with the License.
  24  * You may obtain a copy of the License at
  25  *
  26  *             https://creativecommons.org/licenses/by/4.0/
  27  *
  28  * Unless required by applicable law or agreed to in writing, documentation
  29  * distributed under the License is distributed on an "AS IS" BASIS,
  30  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  31  * See the License for the specific language governing permissions and
  32  * limitations under the License.
  33  *
  34  * ============LICENSE_END============================================
  35  *
  36  *
  37  */
  38 import { Component, OnInit, ViewChild } from '@angular/core';
  39 import { MatTableDataSource, MatSort, MatPaginator } from '@angular/material';
  40 import { ApplicationsService, UsersService } from 'src/app/shared/services';
  41 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
  42 import { ConfirmationModalComponent } from 'src/app/modals/confirmation-modal/confirmation-modal.component';
  43 import { UserAdminApps } from 'src/app/shared/model';
  44 import { HttpErrorResponse } from '@angular/common/http';
  45 import { NewUserModalComponent } from './new-user-modal/new-user-modal.component';
  46 import { BulkUserComponent } from './bulk-user/bulk-user.component';
  47
  48 @Component({
  49   selector: 'app-users',
  50   templateUrl: './users.component.html',
  51   styleUrls: ['./users.component.scss']
  52 })
  53 export class UsersComponent implements OnInit {
  54   multiAppAdmin: boolean;
  55   adminApps: any;
  56   selectApp = 'select-application';
  57   selectedApp: any;
  58   appsIsDown: boolean;
  59   noUsersInApp: boolean;
  60   searchString: string;
  61   isAppSelectDisabled: boolean;
  62   accountUsers: any;
  63   noAppSelected: boolean;
  64   @ViewChild(MatSort) sort: MatSort;
  65   @ViewChild(MatPaginator) paginator: MatPaginator;
  66   displayedColumns: string[] = ['firstName', 'lastName', 'userId', 'roles'];
  67   adminsDataSource = new MatTableDataSource(this.accountUsers);
  68   adminsData: [];
  69   showSpinner: boolean;
  70   adminAppsIsNull: any;
  71
  72   constructor(private applicationsService: ApplicationsService, public ngbModal: NgbModal,
  73     private usersService: UsersService) { }
  74
  75   ngOnInit() {
  76     this.adminApps = [];
  77     this.accountUsers = [];
  78     this.getAdminApps();
  79   }
  80
  81   openAddNewUserModal() {
  82     const modalRef = this.ngbModal.open(NewUserModalComponent);
  83     modalRef.componentInstance.title = 'New User';
  84     modalRef.componentInstance.dialogState = 1;
  85     modalRef.componentInstance.disableBack = false;
  86     modalRef.componentInstance.passBackNewUserPopup.subscribe((_result: any) => {
  87       this.showSpinner = true;
  88       this.updateUsersList();
  89     }, (_reason: any) => {
  90       return;
  91     });
  92   }
  93
  94   openExistingUserModal(userData: any) {
  95     const modalRef = this.ngbModal.open(NewUserModalComponent);
  96     modalRef.componentInstance.userTitle = `${userData.firstName}, ${userData.lastName} ` + '(' + `${userData.orgUserId}` + ')';
  97     modalRef.componentInstance.dialogState = 2;
  98     modalRef.componentInstance.userModalData = userData;
  99     modalRef.componentInstance.disableBack = true;
 100     modalRef.componentInstance.passBackNewUserPopup.subscribe((_result: any) => {
 101       this.showSpinner = true;
 102       this.updateUsersList();
 103     }, (_reason: any) => {
 104       return;
 105     });
 106   }
 107
 108   openBulkUserUploadModal() {
 109     const modalRef = this.ngbModal.open(BulkUserComponent);
 110     modalRef.componentInstance.title = 'Bulk User Upload';
 111     modalRef.componentInstance.adminsAppsData = this.adminApps;
 112     modalRef.componentInstance.passBackBulkUserPopup.subscribe((_result: any) => {
 113       this.showSpinner = true;
 114       this.updateUsersList();
 115     }, (_reason: any) => {
 116       return;
 117     });
 118   }
 119
 120   applyDropdownFilter(_appValue: any) {
 121     if (_appValue !== 'select-application') {
 122       this.selectedApp = _appValue;
 123       this.selectApp = this.selectedApp.value;
 124       this.updateUsersList();
 125     } else {
 126       this.showSpinner = false;
 127       this.noAppSelected = true;
 128       this.accountUsers = [];
 129       this.adminsDataSource = new MatTableDataSource(this.accountUsers);
 130     }
 131   }
 132
 133   applyFilter(filterValue: string) {
 134     this.adminsDataSource.filter = filterValue.trim().toLowerCase();
 135   }
 136
 137   getAdminApps() {
 138     this.showSpinner = true;
 139     this.applicationsService.getAdminApps().subscribe((apps: Array<UserAdminApps>) => {
 140       this.showSpinner = false;
 141       if (!apps) {
 142         return null;
 143       }
 144
 145       if (apps.length >= 2) {
 146         this.multiAppAdmin = true;
 147       } else {
 148         this.adminApps = [];
 149       }
 150
 151       let sortedApps = apps.sort(this.getSortOrder("name"));
 152       let realAppIndex = 1;
 153       for (let i = 1; i <= sortedApps.length; i++) {
 154         this.adminApps.push({
 155           index: realAppIndex,
 156           id: sortedApps[i - 1].id,
 157           value: sortedApps[i - 1].name,
 158           title: sortedApps[i - 1].name
 159         });
 160         realAppIndex = realAppIndex + 1;
 161       }
 162       this.selectApp = this.adminApps[0];
 163       this.adminAppsIsNull = false;
 164       if (this.selectApp != 'select-application') {
 165         this.isAppSelectDisabled = false;
 166         this.noUsersInApp = false;
 167         this.noAppSelected = true;
 168       }
 169     }, (_err: HttpErrorResponse) => {
 170       this.showSpinner = false;
 171       if (_err.status === 403) {
 172         this.adminAppsIsNull = true;
 173       } else {
 174         const modalErrorRef = this.ngbModal.open(ConfirmationModalComponent);
 175         modalErrorRef.componentInstance.title = "Error";
 176         if (_err.status) {    //Conflict
 177           modalErrorRef.componentInstance.message = 'Error Status: ' + _err.status + ' There was a unknown problem adding the portal admin.' + 'Please try again later.';
 178         }
 179       }
 180     });
 181   }
 182
 183   updateUsersList() {
 184     this.appsIsDown = false;
 185     this.noUsersInApp = false;
 186     // $log.debug('UsersCtrl::updateUsersList: Starting updateUsersList');
 187     //reset search string
 188     this.searchString = '';
 189     //should i disable this too in case of moving between tabs?
 190     this.isAppSelectDisabled = true;
 191     //activate spinner
 192     this.showSpinner = true;
 193     this.accountUsers = [];
 194     this.adminsDataSource = new MatTableDataSource(this.accountUsers);
 195     if (this.selectApp != 'select-application' && this.selectedApp) { // 'Select Application'
 196       this.noAppSelected = false;
 197       this.usersService.getAccountUsers(this.selectedApp.id)
 198         .subscribe((accountUsers: []) => {
 199           this.isAppSelectDisabled = false;
 200           this.accountUsers = accountUsers;
 201           if (!accountUsers || accountUsers.length === 0) {
 202             this.noUsersInApp = true;
 203           }
 204           this.showSpinner = false;
 205           this.adminsDataSource = new MatTableDataSource(this.accountUsers);
 206           this.adminsDataSource.paginator = this.paginator;
 207           this.adminsDataSource.sort = this.sort;
 208         }, (_err: HttpErrorResponse) => {
 209           this.isAppSelectDisabled = false;
 210           const modalErrorRef = this.ngbModal.open(ConfirmationModalComponent);
 211           modalErrorRef.componentInstance.title = "Error";
 212           modalErrorRef.componentInstance.message = 'Error Status: ' + _err.status + ' There was a problem updating the users List.' + 'Please try again later.';
 213           this.appsIsDown = true;
 214           this.showSpinner = false;
 215         })
 216     } else {
 217       this.isAppSelectDisabled = false;
 218       this.showSpinner = false;
 219       this.noUsersInApp = false;
 220       this.noAppSelected = true;
 221     }
 222   };
 223
 224   getSortOrder = (prop) => {
 225     return function (a, b) {
 226       if (a[prop] > b[prop]) {
 227         return 1;
 228       } else if (a[prop] < b[prop]) {
 229         return -1;
 230       }
 231       return 0;
 232     }
 233   }
 234 }