Bug 1382 - VNF packages list doesn't show short names
[osm/NG-UI.git] / src / app / packages / vnf-packages / VNFPackagesComponent.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 VNF Package details Component.
20  */
21 import { HttpHeaders } from '@angular/common/http';
22 import { Component, ElementRef, Injector, OnInit, ViewChild } from '@angular/core';
23 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
24 import { TranslateService } from '@ngx-translate/core';
25 import { NotifierService } from 'angular-notifier';
26 import { APIURLHEADER, ERRORDATA } from 'CommonModel';
27 import { ComposePackages } from 'ComposePackages';
28 import { DataService } from 'DataService';
29 import { environment } from 'environment';
30 import { LocalDataSource } from 'ng2-smart-table';
31 import { RestService } from 'RestService';
32 import { Subscription } from 'rxjs';
33 import { SharedService } from 'SharedService';
34 import { VNFData, VNFDDetails } from 'VNFDModel';
35 import { VNFPackagesActionComponent } from 'VNFPackagesAction';
36
37 /**
38  * Creating component
39  * @Component takes VNFPackagesComponent.html as template url
40  */
41 @Component({
42     selector: 'app-vnf-packages',
43     templateUrl: './VNFPackagesComponent.html',
44     styleUrls: ['./VNFPackagesComponent.scss']
45 })
46 /** Exporting a class @exports VNFPackagesComponent */
47 export class VNFPackagesComponent implements OnInit {
48     /** To inject services @public */
49     public injector: Injector;
50
51     /** Data of smarttable populate through LocalDataSource @public */
52     public dataSource: LocalDataSource = new LocalDataSource();
53
54     /** handle translate @public */
55     public translateService: TranslateService;
56
57     /** Columns list of the smart table @public */
58     public columnLists: object = {};
59
60     /** Settings for smarttable to populate the table with columns @public */
61     public settings: object = {};
62
63     /** Check the loading results @public */
64     public isLoadingResults: boolean = true;
65
66     /** Give the message for the loading @public */
67     public message: string = 'PLEASEWAIT';
68
69     /** Class for empty and present data @public */
70     public checkDataClass: string;
71
72     /** Element ref for fileInput @public */
73     @ViewChild('fileInput', { static: true }) public fileInput: ElementRef;
74
75     /** Instance of the rest service @private */
76     private restService: RestService;
77
78     /** dataService to pass the data from one component to another @private */
79     private dataService: DataService;
80
81     /** Formation of appropriate Data for LocalDatasource @private */
82     private vnfData: VNFData[] = [];
83
84     /** Contains all methods related to shared @private */
85     private sharedService: SharedService;
86
87     /** variables contains file information */
88     private fileData: string | ArrayBuffer;
89
90     /** Controls the header form @private */
91     private headers: HttpHeaders;
92
93     /** Notifier service to popup notification @private */
94     private notifierService: NotifierService;
95
96     /** Instance of the modal service @private */
97     private modalService: NgbModal;
98
99     /** Instance of subscriptions @private */
100     private generateDataSub: Subscription;
101
102     constructor(injector: Injector) {
103         this.injector = injector;
104         this.restService = this.injector.get(RestService);
105         this.dataService = this.injector.get(DataService);
106         this.sharedService = this.injector.get(SharedService);
107         this.translateService = this.injector.get(TranslateService);
108         this.notifierService = this.injector.get(NotifierService);
109         this.modalService = this.injector.get(NgbModal);
110     }
111
112     /**
113      * Lifecyle Hooks the trigger before component is instantiate
114      */
115     public ngOnInit(): void {
116         this.generateColumns();
117         this.generateSettings();
118         this.generateData();
119         this.headers = new HttpHeaders({
120             'Content-Type': 'application/gzip',
121             Accept: 'application/json',
122             'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0'
123         });
124         this.generateDataSub = this.sharedService.dataEvent.subscribe(() => { this.generateData(); });
125     }
126
127     /** smart table Header Colums @public */
128     public generateColumns(): void {
129         this.columnLists = {
130             productName: { title: this.translateService.instant('PRODUCTNAME'), width: '15%', sortDirection: 'asc' },
131             identifier: { title: this.translateService.instant('IDENTIFIER'), width: '20%' },
132             type: {
133                 title: this.translateService.instant('TYPE'),
134                 filter: {
135                     type: 'list',
136                     config: {
137                         selectText: 'Select',
138                         list: [
139                             { value: 'vnfd', title: 'VNF' },
140                             { value: 'pnfd', title: 'PNF' },
141                             { value: 'hnfd', title: 'HNF' }
142                         ]
143                     }
144                 },
145                 width: '15%'
146             },
147             description: { title: this.translateService.instant('DESCRIPTION'), width: '25%' },
148             version: { title: this.translateService.instant('VERSION'), width: '10%' },
149             Actions: {
150                 name: 'Action', width: '15%', filter: false, sort: false, type: 'custom',
151                 title: this.translateService.instant('ACTIONS'),
152                 valuePrepareFunction: (cell: VNFData, row: VNFData): VNFData => row, renderComponent: VNFPackagesActionComponent
153             }
154         };
155     }
156
157     /** smart table Data Settings @public */
158     public generateSettings(): void {
159         this.settings = {
160             edit: {
161                 editButtonContent: '<i class="fa fa-edit" title="Edit"></i>',
162                 confirmSave: true
163             },
164             delete: {
165                 deleteButtonContent: '<i class="far fa-trash-alt" title="delete"></i>',
166                 confirmDelete: true
167             },
168             columns: this.columnLists,
169             actions: {
170                 add: false,
171                 edit: false,
172                 delete: false,
173                 position: 'right'
174             },
175             attr: this.sharedService.tableClassConfig(),
176             pager: this.sharedService.paginationPagerConfig(),
177             noDataMessage: this.translateService.instant('NODATAMSG')
178         };
179     }
180
181     /** smart table listing manipulation @public */
182     public onChange(perPageValue: number): void {
183         this.dataSource.setPaging(1, perPageValue, true);
184     }
185
186     /** OnUserRowSelect Function @public */
187     public onUserRowSelect(event: MessageEvent): void {
188         Object.assign(event.data, { page: 'vnf-package' });
189         this.dataService.changeMessage(event.data);
190     }
191
192     /** Drag and drop feature and fetchind the details of files  @public */
193     public filesDropped(files: FileList): void {
194         if (files && files.length === 1) {
195             this.isLoadingResults = true;
196             this.sharedService.getFileString(files, 'gz').then((fileContent: ArrayBuffer): void => {
197                 const apiURLHeader: APIURLHEADER = {
198                     url: environment.VNFPACKAGESCONTENT_URL,
199                     httpOptions: { headers: this.headers }
200                 };
201                 this.saveFileData(apiURLHeader, fileContent);
202             }).catch((err: string): void => {
203                 this.isLoadingResults = false;
204                 if (err === 'typeError') {
205                     this.notifierService.notify('error', this.translateService.instant('GZFILETYPEERRROR'));
206                 } else {
207                     this.notifierService.notify('error', this.translateService.instant('ERROR'));
208                 }
209             });
210         } else if (files && files.length > 1) {
211             this.notifierService.notify('error', this.translateService.instant('DROPFILESVALIDATION'));
212         }
213     }
214
215     /** Post the droped files and reload the page @public */
216     public saveFileData(urlHeader: APIURLHEADER, fileData: {}): void {
217         this.fileInput.nativeElement.value = null;
218         this.restService.postResource(urlHeader, fileData).subscribe((result: {}) => {
219             this.notifierService.notify('success', this.translateService.instant('PAGE.VNFPACKAGE.CREATEDSUCCESSFULLY'));
220             this.generateData();
221         }, (error: ERRORDATA) => {
222             this.restService.handleError(error, 'post');
223             this.isLoadingResults = false;
224         });
225     }
226
227     /** Generate nsData object from loop and return for the datasource @public */
228     public generatevnfdData(vnfdpackagedata: VNFDDetails): VNFData {
229         return {
230             productName: vnfdpackagedata['product-name'],
231             identifier: vnfdpackagedata._id,
232             type: vnfdpackagedata._admin.type,
233             description: vnfdpackagedata.description,
234             version: vnfdpackagedata.version
235         };
236     }
237     /** Handle compose new ns package method  @public */
238     public composeVNFPackage(): void {
239         this.modalService.open(ComposePackages, { backdrop: 'static' }).componentInstance.params = { page: 'vnf-package' };
240     }
241
242     /**
243      * Lifecyle hook which get trigger on component destruction
244      */
245     public ngOnDestroy(): void {
246         this.generateDataSub.unsubscribe();
247     }
248
249     /** Fetching the data from server to Load in the smarttable @protected */
250     protected generateData(): void {
251         this.isLoadingResults = true;
252         this.restService.getResource(environment.VNFPACKAGESCONTENT_URL).subscribe((vnfdPackageData: VNFDDetails[]) => {
253             this.vnfData = [];
254             vnfdPackageData.forEach((vnfdpackagedata: VNFDDetails) => {
255                 const vnfDataObj: VNFData = this.generatevnfdData(vnfdpackagedata);
256                 this.vnfData.push(vnfDataObj);
257             });
258             if (this.vnfData.length > 0) {
259                 this.checkDataClass = 'dataTables_present';
260             } else {
261                 this.checkDataClass = 'dataTables_empty';
262             }
263             this.dataSource.load(this.vnfData).then((data: boolean) => {
264                 this.isLoadingResults = false;
265             }).catch(() => {
266                 this.isLoadingResults = false;
267             });
268         }, (error: ERRORDATA) => {
269             this.restService.handleError(error, 'get');
270             this.isLoadingResults = false;
271         });
272     }
273 }