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     /** Config State init data @public */
  85     public configStateFirstStep: string = CONFIGCONSTANT.configStateFirstStep;
  86
  87     /** Config State init data @public */
  88     public configStateSecondStep: string = CONFIGCONSTANT.configStateSecondStep;
  89
  90     /** Config State init data @public */
  91     public configStateThirdStep: string = CONFIGCONSTANT.configStateThirdStep;
  92
  93     /** Instance of the modal service @private */
  94     private modalService: NgbModal;
  95
  96     /** dataService to pass the data from one component to another @private */
  97     private dataService: DataService;
  98
  99     /** Utilizes rest service for any CRUD operations @private */
 100     private restService: RestService;
 101
 102     /** Contains all methods related to shared @private */
 103     private sharedService: SharedService;
 104
 105     /** Contains tranlsate instance @private */
 106     private translateService: TranslateService;
 107
 108     /** Instance of subscriptions @private */
 109     private generateDataSub: Subscription;
 110
 111     constructor(injector: Injector) {
 112         this.injector = injector;
 113         this.restService = this.injector.get(RestService);
 114         this.dataService = this.injector.get(DataService);
 115         this.sharedService = this.injector.get(SharedService);
 116         this.translateService = this.injector.get(TranslateService);
 117         this.modalService = this.injector.get(NgbModal);
 118     }
 119
 120     /**
 121      * Lifecyle Hooks the trigger before component is instantiate
 122      */
 123     public ngOnInit(): void {
 124         this.generateTableColumn();
 125         this.generateTableSettings();
 126         this.generateData();
 127         this.generateDataSub = this.sharedService.dataEvent.subscribe((): void => { this.generateData(); });
 128     }
 129
 130     /** Generate smart table row title and filters @public  */
 131     public generateTableSettings(): void {
 132         this.settings = {
 133             columns: this.columnList,
 134             actions: { add: false, edit: false, delete: false, position: 'right' },
 135             attr: this.sharedService.tableClassConfig(),
 136             pager: this.sharedService.paginationPagerConfig(),
 137             noDataMessage: this.translateService.instant('NODATAMSG')
 138         };
 139     }
 140
 141     /** Generate smart table row title and filters @public  */
 142     public generateTableColumn(): void {
 143         this.columnList = {
 144             name: { title: this.translateService.instant('NAME'), width: '15%', sortDirection: 'asc' },
 145             identifier: { title: this.translateService.instant('IDENTIFIER'), width: '20%' },
 146             NsdName: { title: this.translateService.instant('NSDNAME'), width: '15%' },
 147             OperationalStatus: {
 148                 title: this.translateService.instant('OPERATIONALSTATUS'), width: '10%', type: 'html',
 149                 filter: {
 150                     type: 'list',
 151                     config: {
 152                         selectText: 'Select',
 153                         list: [
 154                             { value: this.operationalStateFirstStep, title: this.operationalStateFirstStep },
 155                             { value: this.operationalStateSecondStep, title: this.operationalStateSecondStep },
 156                             { value: this.operationalStateThirdStep, title: this.operationalStateThirdStep }
 157                         ]
 158                     }
 159                 },
 160                 valuePrepareFunction: (cell: NSDInstanceData, row: NSDInstanceData): string => {
 161                     if (row.OperationalStatus === this.operationalStateFirstStep) {
 162                         return `<span class="icon-label" title="${row.OperationalStatus}">
 163                         <i class="fas fa-clock text-warning"></i>
 164                         </span>`;
 165                     } else if (row.OperationalStatus === this.operationalStateSecondStep) {
 166                         return `<span class="icon-label" title="${row.OperationalStatus}">
 167                         <i class="fas fa-check-circle text-success"></i>
 168                         </span>`;
 169                     } else if (row.OperationalStatus === this.operationalStateThirdStep) {
 170                         return `<span class="icon-label" title="${row.OperationalStatus}">
 171                         <i class="fas fa-times-circle text-danger"></i>
 172                         </span>`;
 173                     } else {
 174                         return `<span>${row.OperationalStatus}</span>`;
 175                     }
 176                 }
 177             },
 178             ConfigStatus: {
 179                 title: this.translateService.instant('CONFIGSTATUS'), width: '10%', type: 'html',
 180                 filter: {
 181                     type: 'list',
 182                     config: {
 183                         selectText: 'Select',
 184                         list: [
 185                             { value: this.configStateFirstStep, title: this.configStateFirstStep },
 186                             { value: this.configStateSecondStep, title: this.configStateSecondStep },
 187                             { value: this.configStateThirdStep, title: this.configStateThirdStep }
 188                         ]
 189                     }
 190                 },
 191                 valuePrepareFunction: (cell: NSDInstanceData, row: NSDInstanceData): string => {
 192                     if (row.ConfigStatus === this.configStateFirstStep) {
 193                         return `<span class="icon-label" title="${row.ConfigStatus}">
 194                         <i class="fas fa-clock text-warning"></i>
 195                         </span>`;
 196                     } else if (row.ConfigStatus === this.configStateSecondStep) {
 197                         return `<span class="icon-label" title="${row.ConfigStatus}">
 198                         <i class="fas fa-check-circle text-success"></i>
 199                         </span>`;
 200                     } else if (row.ConfigStatus === this.configStateThirdStep) {
 201                         return `<span class="icon-label" title="${row.ConfigStatus}">
 202                         <i class="fas fa-times-circle text-danger"></i>
 203                         </span>`;
 204                     } else {
 205                         return `<span>${row.ConfigStatus}</span>`;
 206                     }
 207                 }
 208             },
 209             DetailedStatus: { title: this.translateService.instant('DETAILEDSTATUS'), width: '15%' },
 210             Actions: {
 211                 name: 'Action', width: '15%', filter: false, sort: false, type: 'custom',
 212                 title: this.translateService.instant('ACTIONS'),
 213                 valuePrepareFunction: (cell: NSDInstanceData, row: NSDInstanceData): NSDInstanceData => row,
 214                 renderComponent: NSInstancesActionComponent
 215             }
 216         };
 217     }
 218
 219     /** generateData initiate the ns-instance list @public */
 220     public generateData(): void {
 221         this.isLoadingResults = true;
 222         this.restService.getResource(environment.NSDINSTANCES_URL).subscribe((nsdInstancesData: NSInstanceDetails[]): void => {
 223             this.nsInstanceData = [];
 224             nsdInstancesData.forEach((nsdInstanceData: NSInstanceDetails): void => {
 225                 const nsDataObj: NSDInstanceData = {
 226                     name: nsdInstanceData.name,
 227                     identifier: nsdInstanceData.id,
 228                     NsdName: nsdInstanceData['nsd-name-ref'],
 229                     OperationalStatus: nsdInstanceData['operational-status'],
 230                     ConfigStatus: nsdInstanceData['config-status'],
 231                     DetailedStatus: nsdInstanceData['detailed-status'],
 232                     memberIndex: nsdInstanceData.nsd.df,
 233                     nsConfig: nsdInstanceData.nsd['ns-configuration']
 234                 };
 235                 this.nsInstanceData.push(nsDataObj);
 236             });
 237             if (this.nsInstanceData.length > 0) {
 238                 this.checkDataClass = 'dataTables_present';
 239             } else {
 240                 this.checkDataClass = 'dataTables_empty';
 241             }
 242             this.dataSource.load(this.nsInstanceData).then((data: {}): void => {
 243                 this.isLoadingResults = false;
 244             }).catch();
 245         }, (error: ERRORDATA): void => {
 246             this.restService.handleError(error, 'get');
 247             this.isLoadingResults = false;
 248         });
 249     }
 250
 251     /** smart table listing manipulation @public */
 252     public onChange(perPageValue: number): void {
 253         this.dataSource.setPaging(1, perPageValue, true);
 254     }
 255
 256     /** smart table listing manipulation @public */
 257     public onUserRowSelect(event: MessageEvent): void {
 258         Object.assign(event.data, { page: 'ns-instance' });
 259         this.dataService.changeMessage(event.data);
 260     }
 261
 262     /** Instantiate NS using modalservice @public */
 263     public instantiateNS(): void {
 264         const modalRef: NgbModalRef = this.modalService.open(InstantiateNsComponent, { backdrop: 'static' });
 265         modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
 266             if (result) {
 267                 this.generateData();
 268             }
 269         }).catch();
 270     }
 271
 272     /**
 273      * Lifecyle hook which get trigger on component destruction
 274      */
 275     public ngOnDestroy(): void {
 276         this.generateDataSub.unsubscribe();
 277     }
 278 }