src/app/dashboard/DashboardComponent.ts

   1 /*
   2  Copyright 2020 TATA ELXSI
   3
   4  Licensed under the Apache License, Version 2.0 (the 'License');
   5  you may not use this file except in compliance with the License.
   6  You may obtain a copy of the License at
   7
   8     http://www.apache.org/licenses/LICENSE-2.0
   9
  10  Unless required by applicable law or agreed to in writing, software
  11  distributed under the License is distributed on an "AS IS" BASIS,
  12  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  See the License for the specific language governing permissions and
  14  limitations under the License.
  15
  16  Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
  17  */
  18 /**
  19  * @file Dashboard Component
  20  */
  21 import { Component, Injector, OnInit } from '@angular/core';
  22 import { TranslateService } from '@ngx-translate/core';
  23 import { AuthenticationService } from 'AuthenticationService';
  24 import { Chart } from 'chart.js';
  25 import { ERRORDATA } from 'CommonModel';
  26 import { environment } from 'environment';
  27 import { NSDDetails } from 'NSDModel';
  28 import { NSInstanceDetails } from 'NSInstanceModel';
  29 import { ProjectData, ProjectDetails } from 'ProjectModel';
  30 import { ProjectService } from 'ProjectService';
  31 import { RestService } from 'RestService';
  32 import { Observable, Subscription } from 'rxjs';
  33 import { SDNControllerModel } from 'SDNControllerModel';
  34 import { SharedService } from 'SharedService';
  35 import { ProjectRoleMappings, UserDetail } from 'UserModel';
  36 import { VimAccountDetails } from 'VimAccountModel';
  37 import { VNFDDetails } from 'VNFDModel';
  38 import { VNFInstanceDetails } from 'VNFInstanceModel';
  39
  40 /**
  41  * Creating component
  42  * @Component takes DashboardComponent.html as template url
  43  */
  44 @Component({
  45     styleUrls: ['./DashboardComponent.scss'],
  46     templateUrl: './DashboardComponent.html'
  47 })
  48
  49 /**
  50  * This file created during the angular project creation
  51  */
  52
  53 /** Exporting a class @exports DashboardComponent */
  54 export class DashboardComponent implements OnInit {
  55     /** Invoke service injectors @public */
  56     public injector: Injector;
  57
  58     /** handle translate @public */
  59     public translateService: TranslateService;
  60
  61     /** Observable holds logined value  @public */
  62     public username$: Observable<string>;
  63
  64     /** Variables holds admin is logged or not @public */
  65     public isAdmin: boolean;
  66
  67     /** List of NS failed Instances @public */
  68     public nsFailedInstances: {}[] = [];
  69
  70     /** Setting up count for vnfdPackages @public */
  71     public vnfdPackageCount: number;
  72
  73     /** Setting up count for nsdPackage @public */
  74     public nsdPackageCount: number;
  75
  76     /** Setting up count for nsInstance @public */
  77     public nsInstanceCount: number;
  78
  79     /** Setting up count for vnfInstance @public */
  80     public vnfInstanceCount: number;
  81
  82     /** Setting up count for vimAccount @public */
  83     public vimAccountCount: number;
  84
  85     /** Setting up count for sdnController @public */
  86     public sdnControllerCount: number;
  87
  88     /** Variables holds current project details @public */
  89     public currentProjectDetails: {};
  90
  91     /** Array holds all the projects @public */
  92     public projectList: {}[] = [];
  93
  94     /** Array holds all the projects @public */
  95     public allProjectList: {}[] = [];
  96
  97     /** Variables holds the selected project @public */
  98     public selectedProject: Observable<string>;
  99
 100     /** Check the Instances loading results @public */
 101     public isCanvasLoadingResults: boolean = true;
 102
 103     /** Check the Projects loading results @public */
 104     public isProjectsLoadingResults: boolean = true;
 105
 106     /** Give the message for the loading @public */
 107     public message: string = 'PLEASEWAIT';
 108
 109     /** List of NS Success Instances @public */
 110     public nsRunningInstance: {}[] = [];
 111
 112     /** List of color for Instances @private */
 113     private backgroundColor: string[] = [];
 114
 115     /** Utilizes rest service for any CRUD operations @private */
 116     private restService: RestService;
 117
 118     /** Utilizes auth service for any auth operations @private */
 119     private authService: AuthenticationService;
 120
 121     /** Used to subscribe vnfdPackage @private */
 122     private vnfdPackageCountSub: Subscription;
 123
 124     /** Used to subscribe nsdPackage @private */
 125     private nsdPackageCountSub: Subscription;
 126
 127     /** Used to subscribe nsInstance @private */
 128     private nsInstanceCountSub: Subscription;
 129
 130     /** Used to subscribe vnfInstance @private */
 131     private vnfInstanceCountSub: Subscription;
 132
 133     /** Used to subscribe vimAccount @private */
 134     private vimAccountCountSub: Subscription;
 135
 136     /** Used to subscribe sdnController @private */
 137     private sdnControllerCountSub: Subscription;
 138
 139     /** No of Hours of NS Success Instances @private */
 140     private noOfHours: number[] = [];
 141
 142     /** collects charts objects @private */
 143     private charts: object = [];
 144
 145     /** Contains all methods related to projects @private */
 146     private projectService: ProjectService;
 147
 148     /** Contains all methods related to shared @private */
 149     private sharedService: SharedService;
 150
 151     /** Contains NS Instance Details */
 152     private nsInstancesDataArr: {}[];
 153
 154     /** Container created time array @private */
 155     private createdTimes: string[] = [];
 156
 157     /** Contains slice limit const @private */
 158     private sliceLimit: number = 10;
 159
 160     /** Contians hour converter @private */
 161     private hourConverter: number = 3600;
 162
 163     constructor(injector: Injector) {
 164         this.injector = injector;
 165         this.restService = this.injector.get(RestService);
 166         this.authService = this.injector.get(AuthenticationService);
 167         this.projectService = this.injector.get(ProjectService);
 168         this.sharedService = this.injector.get(SharedService);
 169         this.translateService = this.injector.get(TranslateService);
 170     }
 171
 172     /**
 173      * Lifecyle Hooks the trigger before component is instantiate
 174      */
 175     public ngOnInit(): void {
 176         this.username$ = this.authService.username;
 177         this.isAdmin = (localStorage.getItem('isAdmin') === 'true') ? true : false;
 178         this.selectedProject = this.authService.ProjectName;
 179         this.checkAdminPrivilege();
 180         this.getUserAccessedProjects();
 181         this.getAllProjects();
 182         this.getVnfdPackageCount();
 183         this.getNsdPackageCount();
 184         this.getNsInstanceCount();
 185         this.getVnfInstanceCount();
 186         this.getVimAccountCount();
 187         this.getSDNControllerCount();
 188     }
 189
 190     /** Get all the projects @public */
 191     public getUserAccessedProjects(): void {
 192         this.projectService.getUserProjects().subscribe((projects: UserDetail) => {
 193             const projectList: {}[] = projects.project_role_mappings;
 194             this.projectList = projectList.filter(
 195                 (thing: ProjectRoleMappings, i: number, arr: []) => arr
 196                     .findIndex((t: ProjectRoleMappings) => t.project_name === thing.project_name) === i
 197             );
 198         }, (error: Error) => {
 199             // TODO: Handle failure
 200         });
 201     }
 202
 203     /** Fetching all the Project in dashboard @public */
 204     public getAllProjects(): void {
 205         this.isProjectsLoadingResults = true;
 206         this.restService.getResource(environment.PROJECTS_URL).subscribe((projectsData: ProjectDetails[]) => {
 207             this.allProjectList = [];
 208             projectsData.forEach((projectData: ProjectDetails) => {
 209                 const projectDataObj: ProjectData = this.generateProjectData(projectData);
 210                 this.allProjectList.push(projectDataObj);
 211             });
 212             this.isProjectsLoadingResults = false;
 213         }, (error: ERRORDATA) => {
 214             this.restService.handleError(error, 'get');
 215             this.isProjectsLoadingResults = false;
 216         });
 217     }
 218
 219     /** Generate Projects object from loop and return for the datasource @public */
 220     public generateProjectData(projectData: ProjectDetails): ProjectData {
 221         return {
 222             projectName: projectData.name,
 223             modificationDate: this.sharedService.convertEpochTime(projectData._admin.modified),
 224             creationDate: this.sharedService.convertEpochTime(projectData._admin.created),
 225             id: projectData._id,
 226             project: projectData._id
 227         };
 228     }
 229
 230     /** Function to check admin privilege @public */
 231     public checkAdminPrivilege(): void {
 232         if (!this.isAdmin) {
 233             this.projectService.getCurrentProjectDetails().subscribe((projectDetails: {}) => {
 234                 this.currentProjectDetails = projectDetails;
 235             }, (error: Error) => {
 236                 // TODO: Handle failure
 237             });
 238         }
 239     }
 240
 241     /** Get VNFD Package details @public */
 242     public getVnfdPackageCount(): void {
 243         this.vnfdPackageCountSub = this.restService.getResource(environment.VNFPACKAGESCONTENT_URL)
 244             .subscribe((vnfdPackageData: VNFDDetails[]) => {
 245                 this.vnfdPackageCount = vnfdPackageData.length;
 246             }, (error: ERRORDATA) => {
 247                 this.restService.handleError(error, 'get');
 248             });
 249     }
 250
 251     /** Get NSD Package details @public */
 252     public getNsdPackageCount(): void {
 253         this.nsdPackageCountSub = this.restService.getResource(environment.NSDESCRIPTORSCONTENT_URL)
 254             .subscribe((nsdPackageData: NSDDetails[]) => {
 255                 this.nsdPackageCount = nsdPackageData.length;
 256             }, (error: ERRORDATA) => {
 257                 this.restService.handleError(error, 'get');
 258             });
 259     }
 260
 261     /** Get NS Instance details @public */
 262     public getNsInstanceCount(): void {
 263         this.isCanvasLoadingResults = true;
 264         this.nsInstanceCountSub = this.restService.getResource(environment.NSDINSTANCES_URL)
 265             .subscribe((nsInstancesData: NSInstanceDetails[]) => {
 266                 this.nsInstancesDataArr = nsInstancesData;
 267                 this.nsInstanceCount = nsInstancesData.length;
 268                 this.nsInstanceChart();
 269                 this.isCanvasLoadingResults = false;
 270             }, (error: ERRORDATA) => {
 271                 this.restService.handleError(error, 'get');
 272                 this.isCanvasLoadingResults = false;
 273             });
 274     }
 275
 276     /** Get NS Instance chart details @public */
 277     public nsInstanceChart(): void {
 278         this.nsInstancesDataArr.forEach((nsdInstanceData: NSDDetails) => {
 279             const operationalStatus: string = nsdInstanceData['operational-status'];
 280             const configStatus: string = nsdInstanceData['config-status'];
 281             if (operationalStatus === 'failed' || configStatus === 'failed') {
 282                 this.nsFailedInstances.push(nsdInstanceData);
 283             } else if (operationalStatus === 'running' && configStatus === 'configured') {
 284                 this.nsRunningInstance.push({ name: nsdInstanceData.name, id: nsdInstanceData.id });
 285                 this.backgroundColor.push(this.sharedService.generateColor());
 286                 this.createdTimes.push(((nsdInstanceData._admin.created).toString()).slice(0, this.sliceLimit));
 287             }
 288         });
 289         const now: Date = new Date();
 290         const currentTime: number = Number((now.getTime().toString().slice(0, this.sliceLimit)));
 291         this.createdTimes.forEach((createdTime: string) => {
 292             this.noOfHours.push((Math.round((currentTime - Number(createdTime)) / this.hourConverter)));
 293         });
 294         this.drawNsChart();
 295     }
 296
 297     /** Prepare and sketch NS instance chart */
 298     public drawNsChart(): void {
 299         this.charts = new Chart('canvas', {
 300             type: 'bar',
 301             data: {
 302                 labels: this.nsRunningInstance,
 303                 datasets: [{
 304                     data: this.noOfHours,
 305                     label: this.translateService.instant('NOOFHOURS'),
 306                     borderColor: this.backgroundColor,
 307                     fill: false,
 308                     backgroundColor: this.backgroundColor
 309                 }]
 310             },
 311             options: {
 312                 hover: {
 313                     onHover(evt: Event, item: {}): void {
 314                         const el: HTMLElement = document.getElementById('canvas');
 315                         el.style.cursor = item[0] ? 'pointer' : 'default';
 316                     }
 317                 },
 318                 onClick(evt: Event, item: {}): void {
 319                     if (item[0] !== undefined) {
 320                         const location: string = '/instances/ns/' + item[0]._chart.data.labels[item[0]._index].id;
 321                         window.open(location);
 322                     }
 323                 },
 324                 legend: { display: false },
 325                 scales: {
 326                     xAxes: [{
 327                         display: true,
 328                         ticks: {
 329                             // tslint:disable-next-line: no-any
 330                             callback: (label: any, index: number, labels: string): string => {
 331                                 const length: number = 20;
 332                                 const ending: string = '...';
 333                                 if (label.name.length > length) {
 334                                     return label.name.substring(0, length - ending.length) + ending;
 335                                 } else {
 336                                     return label.name;
 337                                 }
 338                             }
 339                         },
 340                         scaleLabel: {
 341                             display: true,
 342                             labelString: this.translateService.instant('INSTANCES')
 343                         }
 344                     }],
 345                     yAxes: [{
 346                         ticks: {
 347                             beginAtZero: true
 348                         },
 349                         display: true,
 350                         scaleLabel: {
 351                             display: true,
 352                             labelString: this.translateService.instant('NOOFHOURS')
 353                         }
 354                     }]
 355                 }
 356             }
 357         });
 358     }
 359
 360     /** Get VNFD instance details @public */
 361     public getVnfInstanceCount(): void {
 362         this.vnfInstanceCountSub = this.restService.getResource(environment.NSDINSTANCES_URL)
 363             .subscribe((vnfInstanceData: VNFInstanceDetails[]) => {
 364                 this.vnfInstanceCount = vnfInstanceData.length;
 365             }, (error: ERRORDATA) => {
 366                 this.restService.handleError(error, 'get');
 367             });
 368     }
 369
 370     /** Get VIM account details @public */
 371     public getVimAccountCount(): void {
 372         this.vimAccountCountSub = this.restService.getResource(environment.VIMACCOUNTS_URL)
 373             .subscribe((vimAccountData: VimAccountDetails[]) => {
 374                 this.vimAccountCount = vimAccountData.length;
 375             }, (error: ERRORDATA) => {
 376                 this.restService.handleError(error, 'get');
 377             });
 378     }
 379
 380     /** Get SDN Controller Count  @public */
 381     public getSDNControllerCount(): void {
 382         this.sdnControllerCountSub = this.restService.getResource(environment.SDNCONTROLLER_URL)
 383             .subscribe((sdnControllerData: SDNControllerModel[]) => {
 384                 this.sdnControllerCount = sdnControllerData.length;
 385             }, (error: ERRORDATA) => {
 386                 this.restService.handleError(error, 'get');
 387             });
 388     }
 389
 390     /**
 391      * Lifecyle Hooks the trigger before component is deleted
 392      */
 393     public ngOnDestroy(): void {
 394         this.vnfdPackageCountSub.unsubscribe();
 395         this.nsdPackageCountSub.unsubscribe();
 396         this.nsInstanceCountSub.unsubscribe();
 397         this.vnfInstanceCountSub.unsubscribe();
 398         this.vimAccountCountSub.unsubscribe();
 399         this.sdnControllerCountSub.unsubscribe();
 400     }
 401 }