2 Copyright 2020 TATA ELXSI
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
8 http://www.apache.org/licenses/LICENSE-2.0
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.
16 Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
19 * @file NS Instance Component
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';
37 * @Component takes NSInstancesComponent.html as template url
40 templateUrl: './NSInstancesComponent.html',
41 styleUrls: ['./NSInstancesComponent.scss']
43 /** Exporting a class @exports NSInstancesComponent */
44 export class NSInstancesComponent implements OnInit {
45 /** Injector to invoke other services @public */
46 public injector: Injector;
48 /** NS Instance array @public */
49 public nsInstanceData: object[] = [];
51 /** Datasource instance @public */
52 public dataSource: LocalDataSource = new LocalDataSource();
54 /** SelectedRows array @public */
55 public selectedRows: object[] = [];
57 /** Selected list array @public */
58 public selectList: object[] = [];
60 /** Instance component are stored in settings @public */
61 public settings: {} = {};
63 /** Contains objects for menu settings @public */
64 public columnList: {} = {};
66 /** Check the loading results @public */
67 public isLoadingResults: boolean = true;
69 /** Give the message for the loading @public */
70 public message: string = 'PLEASEWAIT';
72 /** Class for empty and present data @public */
73 public checkDataClass: string;
75 /** operational State init data @public */
76 public operationalStateFirstStep: string = CONFIGCONSTANT.operationalStateFirstStep;
78 /** operational State running data @public */
79 public operationalStateSecondStep: string = CONFIGCONSTANT.operationalStateSecondStep;
81 /** operational State failed data @public */
82 public operationalStateThirdStep: string = CONFIGCONSTANT.operationalStateThirdStep;
84 /** operational State scaling data @public */
85 public operationalStateFourthStep: string = CONFIGCONSTANT.operationalStateFourthStep;
87 /** operational State healing data @public */
88 public operationalStateFifthStep: string = CONFIGCONSTANT.operationalStateFifthStep;
90 /** Config State init data @public */
91 public configStateFirstStep: string = CONFIGCONSTANT.configStateFirstStep;
93 /** Config State init data @public */
94 public configStateSecondStep: string = CONFIGCONSTANT.configStateSecondStep;
96 /** Config State init data @public */
97 public configStateThirdStep: string = CONFIGCONSTANT.configStateThirdStep;
99 /** Instance of the modal service @private */
100 private modalService: NgbModal;
102 /** dataService to pass the data from one component to another @private */
103 private dataService: DataService;
105 /** Utilizes rest service for any CRUD operations @private */
106 private restService: RestService;
108 /** Contains all methods related to shared @private */
109 private sharedService: SharedService;
111 /** Contains tranlsate instance @private */
112 private translateService: TranslateService;
114 /** Instance of subscriptions @private */
115 private generateDataSub: Subscription;
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);
127 * Lifecyle Hooks the trigger before component is instantiate
129 public ngOnInit(): void {
130 this.generateTableColumn();
131 this.generateTableSettings();
133 this.generateDataSub = this.sharedService.dataEvent.subscribe((): void => { this.generateData(); });
136 /** Generate smart table row title and filters @public */
137 public generateTableSettings(): void {
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')
147 /** Generate smart table row title and filters @public */
148 public generateTableColumn(): void {
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%' },
154 title: this.translateService.instant('DATE'), width: '15%', sortDirection: 'desc',
155 compareFunction: this.sharedService.compareFunction
158 title: this.translateService.instant('OPERATIONALSTATUS'), width: '10%', type: 'html',
162 selectText: 'Select',
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 }
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>
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>
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>
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>
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>
195 return `<span>${row.OperationalStatus}</span>`;
200 title: this.translateService.instant('CONFIGSTATUS'), width: '10%', type: 'html',
204 selectText: 'Select',
206 { value: this.configStateFirstStep, title: this.configStateFirstStep },
207 { value: this.configStateSecondStep, title: this.configStateSecondStep },
208 { value: this.configStateThirdStep, title: this.configStateThirdStep }
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>
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>
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>
226 return `<span>${row.ConfigStatus}</span>`;
230 DetailedStatus: { title: this.translateService.instant('DETAILEDSTATUS'), width: '15%' },
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
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']))
263 this.nsInstanceData.push(nsDataObj);
265 if (this.nsInstanceData.length > 0) {
266 this.checkDataClass = 'dataTables_present';
268 this.checkDataClass = 'dataTables_empty';
270 this.dataSource.load(this.nsInstanceData).then((data: {}): void => {
271 this.isLoadingResults = false;
272 }).catch((): void => {
273 // Catch Navigation Error
275 }, (error: ERRORDATA): void => {
276 this.restService.handleError(error, 'get');
277 this.isLoadingResults = false;
281 /** smart table listing manipulation @public */
282 public onChange(perPageValue: number): void {
283 this.dataSource.setPaging(1, perPageValue, true);
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);
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 => {
300 }).catch((): void => {
301 // Catch Navigation Error
306 * Lifecyle hook which get trigger on component destruction
308 public ngOnDestroy(): void {
309 this.generateDataSub.unsubscribe();