src/app/instances/ns-history-operations/HistoryOperationsComponent.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 NS History Of Operations Component
  20  */
  21 import { Component, Injector, OnInit } from '@angular/core';
  22 import { ActivatedRoute } from '@angular/router';
  23 import { Router } from '@angular/router';
  24 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
  25 import { TranslateService } from '@ngx-translate/core';
  26 import { CONFIGCONSTANT, ERRORDATA } from 'CommonModel';
  27 import { DataService } from 'DataService';
  28 import { environment } from 'environment';
  29 import * as HttpStatus from 'http-status-codes';
  30 import { LocalDataSource } from 'ng2-smart-table';
  31 import { NSDInstanceData } from 'NSInstanceModel';
  32 import { RestService } from 'RestService';
  33 import { Subscription } from 'rxjs';
  34 import { SharedService, isNullOrUndefined } from 'SharedService';
  35 import { ShowInfoComponent } from 'ShowInfoComponent';
  36
  37 /**
  38  * Creating component
  39  * @Component takes HistoryOperationsComponent.html as template url
  40  */
  41 @Component({
  42   templateUrl: './HistoryOperationsComponent.html',
  43   styleUrls: ['./HistoryOperationsComponent.scss']
  44 })
  45 /** Exporting a class @exports HistoryOperationsComponent */
  46 export class HistoryOperationsComponent implements OnInit {
  47   /** Injector to invoke other services @public */
  48   public injector: Injector;
  49
  50   /** NS Instance array @public */
  51   public nsAndnstInstanceData: object[] = [];
  52
  53   /** Datasource instance @public */
  54   public dataSource: LocalDataSource = new LocalDataSource();
  55
  56   /** Instance component are stored in settings @public */
  57   public settings: {} = {};
  58
  59   /** Contains objects for smart table title and filter settings @public */
  60   public columnList: {} = {};
  61
  62   /** Variable handles the page name @public */
  63   public page: string;
  64
  65   /** Variable handles the title name @public */
  66   public titleName: string;
  67
  68   /** Check the loading results @public */
  69   public isLoadingResults: boolean = true;
  70
  71   /** Give the message for the loading @public */
  72   public message: string = 'PLEASEWAIT';
  73
  74   /** Class for empty and present data @public */
  75   public checkDataClass: string;
  76
  77   /** History State init data @public */
  78   public historyStateFirstStep: string = CONFIGCONSTANT.historyStateFirstStep;
  79
  80   /** History State running data @public */
  81   public historyStateSecondStep: string = CONFIGCONSTANT.historyStateSecondStep;
  82
  83   /** History State failed data @public */
  84   public historyStateThirdStep: string = CONFIGCONSTANT.historyStateThirdStep;
  85
  86   /** dataService to pass the data from one component to another @private */
  87   private dataService: DataService;
  88
  89   /** Utilizes rest service for any CRUD operations @private */
  90   private restService: RestService;
  91
  92   /** Contains all methods related to shared @private */
  93   private sharedService: SharedService;
  94
  95   /** Holds teh instance of AuthService class of type AuthService @private */
  96   private activatedRoute: ActivatedRoute;
  97
  98   /** Instance of the modal service @private */
  99   private modalService: NgbModal;
 100
 101   /** variables contains paramsID @private */
 102   private paramsID: string;
 103
 104   /** variables contains paramsID @private */
 105   private paramsType: string;
 106
 107   /** variables conatins URL of the History operations @public */
 108   private historyURL: string;
 109
 110   /** Contains tranlsate instance @private */
 111   private translateService: TranslateService;
 112
 113   /** Instance of subscriptions @private */
 114   private generateDataSub: Subscription;
 115
 116   /** Service holds the router information @private */
 117   private router: Router;
 118
 119   constructor(injector: Injector) {
 120     this.injector = injector;
 121     this.restService = this.injector.get(RestService);
 122     this.dataService = this.injector.get(DataService);
 123     this.sharedService = this.injector.get(SharedService);
 124     this.activatedRoute = this.injector.get(ActivatedRoute);
 125     this.modalService = this.injector.get(NgbModal);
 126     this.translateService = this.injector.get(TranslateService);
 127     this.router = this.injector.get(Router);
 128   }
 129
 130   /** Lifecyle Hooks the trigger before component is instantiate @public */
 131   public ngOnInit(): void {
 132     this.paramsID = this.activatedRoute.snapshot.paramMap.get('id');
 133     this.paramsType = this.activatedRoute.snapshot.paramMap.get('type');
 134     if (this.paramsType === 'ns') {
 135       this.historyURL = environment.NSHISTORYOPERATIONS_URL + '/?nsInstanceId=' + this.paramsID;
 136       this.page = 'ns-history-operation';
 137       this.titleName = 'INSTANCEDETAILS';
 138     } else if (this.paramsType === 'netslice') {
 139       this.historyURL = environment.NSTHISTORYOPERATIONS_URL + '/?netsliceInstanceId=' + this.paramsID;
 140       this.page = 'nst-history-operation';
 141       this.titleName = 'INSTANCEDETAILS';
 142     }
 143     this.generateTableColumn();
 144     this.generateTableSettings();
 145     this.generateData();
 146     this.generateDataSub = this.sharedService.dataEvent.subscribe(() => { this.generateData(); });
 147   }
 148
 149   /** Generate smart table row title and filters @public  */
 150   public generateTableSettings(): void {
 151     this.settings = {
 152       columns: this.columnList,
 153       actions: {
 154         add: false, edit: false, delete: false, position: 'right',
 155         custom: [{
 156           name: 'showInformation', title: '<i class="fas fa-info" title=" ' + this.translateService.instant('INFO') + ' "></i>'}]
 157       },
 158       attr: this.sharedService.tableClassConfig(),
 159       pager: this.sharedService.paginationPagerConfig(),
 160       noDataMessage: this.translateService.instant('NODATAMSG')
 161     };
 162   }
 163
 164   /** Generate smart table row title and filters @public  */
 165   public generateTableColumn(): void {
 166     this.columnList = {
 167       id: { title: this.translateService.instant('ID'), width: '30%' },
 168       type: { title: this.translateService.instant('TYPE'), width: '20%' },
 169       state: {
 170         type: 'html', title: this.translateService.instant('OPERATIONSTATE'), width: '15%',
 171         filter: {
 172           type: 'list',
 173           config: {
 174             selectText: 'Select',
 175             list: [
 176               { value: this.historyStateFirstStep, title: this.historyStateFirstStep },
 177               { value: this.historyStateSecondStep, title: this.historyStateSecondStep },
 178               { value: this.historyStateThirdStep, title: this.historyStateThirdStep }
 179             ]
 180           }
 181         },
 182         valuePrepareFunction: (cell: NSDInstanceData, row: NSDInstanceData): string => {
 183           if (row.state === this.historyStateFirstStep) {
 184             return `<span class="icon-label" title="${row.state}">
 185                         <i class="fas fa-clock text-warning"></i>
 186                         </span>`;
 187           } else if (row.state === this.historyStateSecondStep) {
 188             return `<span class="icon-label" title="${row.state}">
 189                         <i class="fas fa-check-circle text-success"></i>
 190                         </span>`;
 191           } else if (row.state === this.historyStateThirdStep) {
 192             return `<span class="icon-label" title="${row.state}">
 193                         <i class="fas fa-times-circle text-danger"></i>
 194                         </span>`;
 195           } else {
 196             return `<span>${row.state}</span>`;
 197           }
 198         }
 199       },
 200       startTime: { title: this.translateService.instant('STARTTIME'), width: '15%' },
 201       statusEnteredTime: { title: this.translateService.instant('STATUSENTEREDTIME'), width: '15%' }
 202     };
 203   }
 204
 205   /** smart table listing manipulation @public */
 206   public onUserRowSelect(event: MessageEvent): void {
 207     this.dataService.changeMessage(event.data);
 208   }
 209   /** smart table listing manipulation @public */
 210   public onChange(perPageValue: number): void {
 211     this.dataSource.setPaging(1, perPageValue, true);
 212   }
 213   /** show information methods modal with ns history info */
 214   public showInformation(event: MessageEvent): void {
 215     // eslint-disable-next-line security/detect-non-literal-fs-filename
 216     this.modalService.open(ShowInfoComponent, { backdrop: 'static' }).componentInstance.params = {
 217       id: event.data.id,
 218       page: this.page,
 219       titleName: this.titleName
 220     };
 221   }
 222
 223   /**
 224    * Lifecyle hook which get trigger on component destruction
 225    */
 226   public ngOnDestroy(): void {
 227     this.generateDataSub.unsubscribe();
 228   }
 229
 230   /** generateData initiate the ns-instance list @private */
 231   private generateData(): void {
 232     this.isLoadingResults = true;
 233     this.restService.getResource(this.historyURL).subscribe((nsdInstancesData: {}[]): void => {
 234       this.nsAndnstInstanceData = [];
 235       nsdInstancesData.forEach((nsdAndnstInstanceData: NSDInstanceData): void => {
 236         let scaleType: string = '';
 237         if (!isNullOrUndefined(nsdAndnstInstanceData.operationParams.scaleVnfData)) {
 238           scaleType = ' (' + nsdAndnstInstanceData.operationParams.scaleVnfData.scaleVnfType + ')';
 239         }
 240         const nsAndnstDataObj: {} = {
 241           id: nsdAndnstInstanceData.id,
 242           type: nsdAndnstInstanceData.lcmOperationType + scaleType,
 243           state: nsdAndnstInstanceData.operationState,
 244           startTime: this.sharedService.convertEpochTime(nsdAndnstInstanceData.startTime),
 245           statusEnteredTime: this.sharedService.convertEpochTime(nsdAndnstInstanceData.statusEnteredTime)
 246         };
 247         this.nsAndnstInstanceData.push(nsAndnstDataObj);
 248       });
 249
 250       if (this.nsAndnstInstanceData.length > 0) {
 251         this.checkDataClass = 'dataTables_present';
 252       } else {
 253         this.checkDataClass = 'dataTables_empty';
 254       }
 255       this.dataSource.load(this.nsAndnstInstanceData).then((data: {}): void => {
 256         //empty block
 257       }).catch((): void => {
 258         // Catch Navigation Error
 259     });
 260       this.isLoadingResults = false;
 261     }, (error: ERRORDATA): void => {
 262       this.isLoadingResults = false;
 263       if (error.error.status === HttpStatus.NOT_FOUND || error.error.status === HttpStatus.UNAUTHORIZED) {
 264         this.router.navigateByUrl('404', { skipLocationChange: true }).catch((): void => {
 265           // Catch Navigation Error
 266       });
 267       } else {
 268         this.restService.handleError(error, 'get');
 269       }
 270     });
 271   }
 272 }