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