src/app/instances/ns-instances/NSInstancesComponent.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 Instance Component
  20  */
  21 import { Component, Injector, OnInit } from '@angular/core';
  22 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
  23 import { TranslateService } from '@ngx-translate/core';
  24 import { CONFIGCONSTANT, ERRORDATA, MODALCLOSERESPONSEDATA } from 'CommonModel';
  25 import { DataService } from 'DataService';
  26 import { environment } from 'environment';
  27 import { InstantiateNsComponent } from 'InstantiateNs';
  28 import { LocalDataSource } from 'ng2-smart-table';
  29 import { NSDInstanceData, NSInstanceDetails } from 'NSInstanceModel';
  30 import { NSInstancesActionComponent } from 'NSInstancesActionComponent';
  31 import { RestService } from 'RestService';
  32 import { Subscription } from 'rxjs';
  33 import { SharedService } from 'SharedService';
  34
  35 /**
  36  * Creating component
  37  * @Component takes NSInstancesComponent.html as template url
  38  */
  39 @Component({
  40     templateUrl: './NSInstancesComponent.html',
  41     styleUrls: ['./NSInstancesComponent.scss']
  42 })
  43 /** Exporting a class @exports NSInstancesComponent */
  44 export class NSInstancesComponent implements OnInit {
  45     /** Injector to invoke other services @public */
  46     public injector: Injector;
  47
  48     /** NS Instance array @public */
  49     public nsInstanceData: object[] = [];
  50
  51     /** Datasource instance @public */
  52     public dataSource: LocalDataSource = new LocalDataSource();
  53
  54     /** SelectedRows array @public */
  55     public selectedRows: object[] = [];
  56
  57     /** Selected list array @public */
  58     public selectList: object[] = [];
  59
  60     /** Instance component are stored in settings @public */
  61     public settings: {} = {};
  62
  63     /** Contains objects for menu settings @public */
  64     public columnList: {} = {};
  65
  66     /** Check the loading results @public */
  67     public isLoadingResults: boolean = true;
  68
  69     /** Give the message for the loading @public */
  70     public message: string = 'PLEASEWAIT';
  71
  72     /** Class for empty and present data @public */
  73     public checkDataClass: string;
  74
  75     /** operational State init data @public */
  76     public operationalStateFirstStep: string = CONFIGCONSTANT.operationalStateFirstStep;
  77
  78     /** operational State running data @public */
  79     public operationalStateSecondStep: string = CONFIGCONSTANT.operationalStateSecondStep;
  80
  81     /** operational State failed data @public */
  82     public operationalStateThirdStep: string = CONFIGCONSTANT.operationalStateThirdStep;
  83
  84     /** operational State scaling data @public */
  85     public operationalStateFourthStep: string = CONFIGCONSTANT.operationalStateFourthStep;
  86
  87     /** operational State healing data @public */
  88     public operationalStateFifthStep: string = CONFIGCONSTANT.operationalStateFifthStep;
  89
  90     /** Config State init data @public */
  91     public configStateFirstStep: string = CONFIGCONSTANT.configStateFirstStep;
  92
  93     /** Config State init data @public */
  94     public configStateSecondStep: string = CONFIGCONSTANT.configStateSecondStep;
  95
  96     /** Config State init data @public */
  97     public configStateThirdStep: string = CONFIGCONSTANT.configStateThirdStep;
  98
  99     /** Instance of the modal service @private */
 100     private modalService: NgbModal;
 101
 102     /** dataService to pass the data from one component to another @private */
 103     private dataService: DataService;
 104
 105     /** Utilizes rest service for any CRUD operations @private */
 106     private restService: RestService;
 107
 108     /** Contains all methods related to shared @private */
 109     private sharedService: SharedService;
 110
 111     /** Contains tranlsate instance @private */
 112     private translateService: TranslateService;
 113
 114     /** Instance of subscriptions @private */
 115     private generateDataSub: Subscription;
 116
 117     constructor(injector: Injector) {
 118         this.injector = injector;
 119         this.restService = this.injector.get(RestService);
 120         this.dataService = this.injector.get(DataService);
 121         this.sharedService = this.injector.get(SharedService);
 122         this.translateService = this.injector.get(TranslateService);
 123         this.modalService = this.injector.get(NgbModal);
 124     }
 125
 126     /**
 127      * Lifecyle Hooks the trigger before component is instantiate
 128      */
 129     public ngOnInit(): void {
 130         this.generateTableColumn();
 131         this.generateTableSettings();
 132         this.generateData();
 133         this.generateDataSub = this.sharedService.dataEvent.subscribe((): void => { this.generateData(); });
 134     }
 135
 136     /** Generate smart table row title and filters @public  */
 137     public generateTableSettings(): void {
 138         this.settings = {
 139             columns: this.columnList,
 140             actions: { add: false, edit: false, delete: false, position: 'right' },
 141             attr: this.sharedService.tableClassConfig(),
 142             pager: this.sharedService.paginationPagerConfig(),
 143             noDataMessage: this.translateService.instant('NODATAMSG')
 144         };
 145     }
 146
 147     /** Generate smart table row title and filters @public  */
 148     public generateTableColumn(): void {
 149         this.columnList = {
 150             name: { title: this.translateService.instant('NAME'), width: '15%' },
 151             identifier: { title: this.translateService.instant('IDENTIFIER'), width: '20%' },
 152             NsdName: { title: this.translateService.instant('NSDNAME'), width: '15%' },
 153             'create-time': {
 154                 title: this.translateService.instant('DATE'), width: '15%', sortDirection: 'desc',
 155                 compareFunction: this.sharedService.compareFunction
 156             },
 157             OperationalStatus: {
 158                 title: this.translateService.instant('OPERATIONALSTATUS'), width: '10%', type: 'html',
 159                 filter: {
 160                     type: 'list',
 161                     config: {
 162                         selectText: 'Select',
 163                         list: [
 164                             { value: this.operationalStateFirstStep, title: this.operationalStateFirstStep },
 165                             { value: this.operationalStateSecondStep, title: this.operationalStateSecondStep },
 166                             { value: this.operationalStateThirdStep, title: this.operationalStateThirdStep },
 167                             { value: this.operationalStateFourthStep, title: this.operationalStateFourthStep },
 168                             { value: this.operationalStateFifthStep, title: this.operationalStateFifthStep }
 169                         ]
 170                     }
 171                 },
 172                 valuePrepareFunction: (cell: NSDInstanceData, row: NSDInstanceData): string => {
 173                     if (row.OperationalStatus === this.operationalStateFirstStep) {
 174                         return `<span class="icon-label" title="${row.OperationalStatus}">
 175                          <i class="fas fa-clock text-warning"></i>
 176                          </span>`;
 177                     } else if (row.OperationalStatus === this.operationalStateSecondStep) {
 178                         return `<span class="icon-label" title="${row.OperationalStatus}">
 179                          <i class="fas fa-check-circle text-success"></i>
 180                          </span>`;
 181                     } else if (row.OperationalStatus === this.operationalStateThirdStep) {
 182                         return `<span class="icon-label" title="${row.OperationalStatus}">
 183                          <i class="fas fa-times-circle text-danger"></i>
 184                          </span>`;
 185                     } else if (row.OperationalStatus === this.operationalStateFourthStep) {
 186                         return `<span class="icon-label" title="${row.OperationalStatus}">
 187                          <i class="fas fa-compress-alt text-success"></i>
 188                          </span>`;
 189                     }
 190                     else if (row.OperationalStatus === this.operationalStateFifthStep) {
 191                         return `<span class="icon-label" title="${row.OperationalStatus}">
 192                          <i class="fas fa-briefcase-medical text-success"></i>
 193                          </span>`;
 194                     } else {
 195                         return `<span>${row.OperationalStatus}</span>`;
 196                     }
 197                 }
 198             },
 199             ConfigStatus: {
 200                 title: this.translateService.instant('CONFIGSTATUS'), width: '10%', type: 'html',
 201                 filter: {
 202                     type: 'list',
 203                     config: {
 204                         selectText: 'Select',
 205                         list: [
 206                             { value: this.configStateFirstStep, title: this.configStateFirstStep },
 207                             { value: this.configStateSecondStep, title: this.configStateSecondStep },
 208                             { value: this.configStateThirdStep, title: this.configStateThirdStep }
 209                         ]
 210                     }
 211                 },
 212                 valuePrepareFunction: (cell: NSDInstanceData, row: NSDInstanceData): string => {
 213                     if (row.ConfigStatus === this.configStateFirstStep) {
 214                         return `<span class="icon-label" title="${row.ConfigStatus}">
 215                          <i class="fas fa-clock text-warning"></i>
 216                          </span>`;
 217                     } else if (row.ConfigStatus === this.configStateSecondStep) {
 218                         return `<span class="icon-label" title="${row.ConfigStatus}">
 219                          <i class="fas fa-check-circle text-success"></i>
 220                          </span>`;
 221                     } else if (row.ConfigStatus === this.configStateThirdStep) {
 222                         return `<span class="icon-label" title="${row.ConfigStatus}">
 223                          <i class="fas fa-times-circle text-danger"></i>
 224                          </span>`;
 225                     } else {
 226                         return `<span>${row.ConfigStatus}</span>`;
 227                     }
 228                 }
 229             },
 230             DetailedStatus: { title: this.translateService.instant('DETAILEDSTATUS'), width: '15%' },
 231             Actions: {
 232                 name: 'Action', width: '15%', filter: false, sort: false, type: 'custom',
 233                 title: this.translateService.instant('ACTIONS'),
 234                 valuePrepareFunction: (cell: NSDInstanceData, row: NSDInstanceData): NSDInstanceData => row,
 235                 renderComponent: NSInstancesActionComponent
 236             }
 237         };
 238     }
 239
 240     /** generateData initiate the ns-instance list @public */
 241     public generateData(): void {
 242         this.isLoadingResults = true;
 243         this.restService.getResource(environment.NSDINSTANCES_URL).subscribe((nsdInstancesData: NSInstanceDetails[]): void => {
 244             this.nsInstanceData = [];
 245             nsdInstancesData.forEach((nsdInstanceData: NSInstanceDetails): void => {
 246                 const nsDataObj: NSDInstanceData = {
 247                     name: nsdInstanceData.name,
 248                     identifier: nsdInstanceData.id,
 249                     NsdName: nsdInstanceData['nsd-name-ref'],
 250                     OperationalStatus: nsdInstanceData['operational-status'],
 251                     ConfigStatus: nsdInstanceData['config-status'],
 252                     DetailedStatus: nsdInstanceData['detailed-status'],
 253                     memberIndex: nsdInstanceData.nsd.df,
 254                     nsConfig: nsdInstanceData.nsd['ns-configuration'],
 255                     adminDetails: nsdInstanceData._admin,
 256                     vnfID: nsdInstanceData['vnfd-id'],
 257                     nsd: nsdInstanceData.nsd,
 258                     'nsd-id': nsdInstanceData['nsd-id'],
 259                     vcaStatus: nsdInstanceData.vcaStatus,
 260                     constituent: nsdInstanceData['constituent-vnfr-ref'],
 261                     'create-time': this.sharedService.convertEpochTime(Number(nsdInstanceData['create-time']))
 262                 };
 263                 this.nsInstanceData.push(nsDataObj);
 264             });
 265             if (this.nsInstanceData.length > 0) {
 266                 this.checkDataClass = 'dataTables_present';
 267             } else {
 268                 this.checkDataClass = 'dataTables_empty';
 269             }
 270             this.dataSource.load(this.nsInstanceData).then((data: {}): void => {
 271                 this.isLoadingResults = false;
 272             }).catch((): void => {
 273                 // Catch Navigation Error
 274             });
 275         }, (error: ERRORDATA): void => {
 276             this.restService.handleError(error, 'get');
 277             this.isLoadingResults = false;
 278         });
 279     }
 280
 281     /** smart table listing manipulation @public */
 282     public onChange(perPageValue: number): void {
 283         this.dataSource.setPaging(1, perPageValue, true);
 284     }
 285
 286     /** smart table listing manipulation @public */
 287     public onUserRowSelect(event: MessageEvent): void {
 288         Object.assign(event.data, { page: 'ns-instance' });
 289         this.dataService.changeMessage(event.data);
 290     }
 291
 292     /** Instantiate NS using modalservice @public */
 293     public instantiateNS(): void {
 294         // eslint-disable-next-line security/detect-non-literal-fs-filename
 295         const modalRef: NgbModalRef = this.modalService.open(InstantiateNsComponent, { backdrop: 'static' });
 296         modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
 297             if (result) {
 298                 this.generateData();
 299             }
 300         }).catch((): void => {
 301             // Catch Navigation Error
 302         });
 303     }
 304
 305     /**
 306      * Lifecyle hook which get trigger on component destruction
 307      */
 308     public ngOnDestroy(): void {
 309         this.generateDataSub.unsubscribe();
 310     }
 311 }