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 VNF Package details Component.
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';
39 * @Component takes VNFPackagesComponent.html as template url
42 selector: 'app-vnf-packages',
43 templateUrl: './VNFPackagesComponent.html',
44 styleUrls: ['./VNFPackagesComponent.scss']
46 /** Exporting a class @exports VNFPackagesComponent */
47 export class VNFPackagesComponent implements OnInit {
48 /** To inject services @public */
49 public injector: Injector;
51 /** Data of smarttable populate through LocalDataSource @public */
52 public dataSource: LocalDataSource = new LocalDataSource();
54 /** handle translate @public */
55 public translateService: TranslateService;
57 /** Columns list of the smart table @public */
58 public columnLists: object = {};
60 /** Settings for smarttable to populate the table with columns @public */
61 public settings: object = {};
63 /** Check the loading results @public */
64 public isLoadingResults: boolean = true;
66 /** Give the message for the loading @public */
67 public message: string = 'PLEASEWAIT';
69 /** Class for empty and present data @public */
70 public checkDataClass: string;
72 /** Element ref for fileInput @public */
73 @ViewChild('fileInput', { static: true }) public fileInput: ElementRef;
75 /** Instance of the rest service @private */
76 private restService: RestService;
78 /** dataService to pass the data from one component to another @private */
79 private dataService: DataService;
81 /** Formation of appropriate Data for LocalDatasource @private */
82 private vnfData: VNFData[] = [];
84 /** Contains all methods related to shared @private */
85 private sharedService: SharedService;
87 /** variables contains file information */
88 private fileData: string | ArrayBuffer;
90 /** Controls the header form @private */
91 private headers: HttpHeaders;
93 /** Notifier service to popup notification @private */
94 private notifierService: NotifierService;
96 /** Instance of the modal service @private */
97 private modalService: NgbModal;
99 /** Instance of subscriptions @private */
100 private generateDataSub: Subscription;
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);
113 * Lifecyle Hooks the trigger before component is instantiate
115 public ngOnInit(): void {
116 this.generateColumns();
117 this.generateSettings();
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'
124 this.generateDataSub = this.sharedService.dataEvent.subscribe(() => { this.generateData(); });
127 /** smart table Header Colums @public */
128 public generateColumns(): void {
130 productName: { title: this.translateService.instant('PRODUCTNAME'), width: '15%', sortDirection: 'asc' },
131 identifier: { title: this.translateService.instant('IDENTIFIER'), width: '20%' },
133 title: this.translateService.instant('TYPE'),
137 selectText: 'Select',
139 { value: 'vnfd', title: 'VNF' },
140 { value: 'pnfd', title: 'PNF' },
141 { value: 'hnfd', title: 'HNF' }
147 description: { title: this.translateService.instant('DESCRIPTION'), width: '25%' },
148 version: { title: this.translateService.instant('VERSION'), width: '10%' },
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
157 /** smart table Data Settings @public */
158 public generateSettings(): void {
161 editButtonContent: '<i class="fa fa-edit" title="Edit"></i>',
165 deleteButtonContent: '<i class="far fa-trash-alt" title="delete"></i>',
168 columns: this.columnLists,
175 attr: this.sharedService.tableClassConfig(),
176 pager: this.sharedService.paginationPagerConfig(),
177 noDataMessage: this.translateService.instant('NODATAMSG')
181 /** smart table listing manipulation @public */
182 public onChange(perPageValue: number): void {
183 this.dataSource.setPaging(1, perPageValue, true);
186 /** OnUserRowSelect Function @public */
187 public onUserRowSelect(event: MessageEvent): void {
188 Object.assign(event.data, { page: 'vnf-package' });
189 this.dataService.changeMessage(event.data);
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 }
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'));
207 this.notifierService.notify('error', this.translateService.instant('ERROR'));
210 } else if (files && files.length > 1) {
211 this.notifierService.notify('error', this.translateService.instant('DROPFILESVALIDATION'));
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'));
221 }, (error: ERRORDATA) => {
222 this.restService.handleError(error, 'post');
223 this.isLoadingResults = false;
227 /** Generate nsData object from loop and return for the datasource @public */
228 public generatevnfdData(vnfdpackagedata: VNFDDetails): VNFData {
230 productName: vnfdpackagedata['product-name'],
231 identifier: vnfdpackagedata._id,
232 type: vnfdpackagedata._admin.type,
233 description: vnfdpackagedata.description,
234 version: vnfdpackagedata.version
237 /** Handle compose new ns package method @public */
238 public composeVNFPackage(): void {
239 this.modalService.open(ComposePackages, { backdrop: 'static' }).componentInstance.params = { page: 'vnf-package' };
243 * Lifecyle hook which get trigger on component destruction
245 public ngOnDestroy(): void {
246 this.generateDataSub.unsubscribe();
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[]) => {
254 vnfdPackageData.forEach((vnfdpackagedata: VNFDDetails) => {
255 const vnfDataObj: VNFData = this.generatevnfdData(vnfdpackagedata);
256 this.vnfData.push(vnfDataObj);
258 if (this.vnfData.length > 0) {
259 this.checkDataClass = 'dataTables_present';
261 this.checkDataClass = 'dataTables_empty';
263 this.dataSource.load(this.vnfData).then((data: boolean) => {
264 this.isLoadingResults = false;
266 this.isLoadingResults = false;
268 }, (error: ERRORDATA) => {
269 this.restService.handleError(error, 'get');
270 this.isLoadingResults = false;