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 Netslice-Template.
21 import { HttpHeaders } from '@angular/common/http';
22 import { Component, ElementRef, Injector, ViewChild } from '@angular/core';
23 import { TranslateService } from '@ngx-translate/core';
24 import { NotifierService } from 'angular-notifier';
25 import { APIURLHEADER, ERRORDATA } from 'CommonModel';
26 import { DataService } from 'DataService';
27 import { environment } from 'environment';
28 import { NetslicePackagesActionComponent } from 'NetslicePackagesAction';
29 import { NetworkSliceData, NetworkSliceModel } from 'NetworkSliceModel';
30 import { LocalDataSource } from 'ng2-smart-table';
31 import { RestService } from 'RestService';
32 import { Subscription } from 'rxjs';
33 import { SharedService } from 'SharedService';
37 * @Component takes NetsliceTemplateComponent.html as template url
40 selector: 'app-netslice-template',
41 templateUrl: './NetsliceTemplateComponent.html',
42 styleUrls: ['./NetsliceTemplateComponent.scss']
44 /** Exporting a class @exports NetsliceTemplateComponent */
45 export class NetsliceTemplateComponent {
46 /** To inject services @public */
47 public injector: Injector;
49 /** Values for map config @public */
50 public selectedRows: object[] = [];
52 /** To consume REST API calls @public */
53 public dataSource: LocalDataSource = new LocalDataSource();
55 /** handle translate @public */
56 public translateService: TranslateService;
58 /** Columns list of the smart table @public */
59 public columnLists: object = {};
61 /** Settings for smarttable to populate the table with columns @public */
62 public settings: object = {};
64 /** Values for map config @public */
65 public selectList: object[] = [];
67 /** Check the loading results @public */
68 public isLoadingResults: boolean = true;
70 /** Give the message for the loading @public */
71 public message: string = 'PLEASEWAIT';
73 /** Class for empty and present data @public */
74 public checkDataClass: string;
76 /** Element ref for fileInput @public */
77 @ViewChild('fileInput', { static: true }) public fileInput: ElementRef;
79 /** To consume REST API calls @private */
80 private dataService: DataService;
82 /** To consume REST API calls @private */
83 private restService: RestService;
85 /** Formation of appropriate Data for LocalDatasource @private */
86 private networkSliceData: NetworkSliceData[] = [];
88 /** variables holds file information @private */
89 private fileData: string | ArrayBuffer;
91 /** Controls the header form @private */
92 private headers: HttpHeaders;
94 /** Notifier service to popup notification @private */
95 private notifierService: NotifierService;
97 /** Contains all methods related to shared @private */
98 private sharedService: SharedService;
100 /** Instance of subscriptions @private */
101 private generateDataSub: Subscription;
103 constructor(injector: Injector) {
104 this.injector = injector;
105 this.restService = this.injector.get(RestService);
106 this.dataService = this.injector.get(DataService);
107 this.translateService = this.injector.get(TranslateService);
108 this.notifierService = this.injector.get(NotifierService);
109 this.sharedService = this.injector.get(SharedService);
112 /** Lifecyle Hooks the trigger before component is instantiate @public */
113 public ngOnInit(): void {
114 this.generateColumns();
115 this.generateSettings();
117 this.headers = new HttpHeaders({
118 'Content-Type': 'application/x-yaml',
119 Accept: 'application/json',
120 'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0'
122 this.generateDataSub = this.sharedService.dataEvent.subscribe(() => { this.generateData(); });
125 /** smart table Header Colums @public */
126 public generateColumns(): void {
128 name: { title: this.translateService.instant('NAME'), width: '20%', sortDirection: 'asc' },
129 identifier: { title: this.translateService.instant('IDENTIFIER'), width: '50%' },
130 usageState: { title: this.translateService.instant('USAGESTATE'), width: '20%' },
132 name: 'Actions', width: '10%', filter: false, sort: false, type: 'custom',
133 title: this.translateService.instant('ACTIONS'),
134 valuePrepareFunction: (cell: NetworkSliceData, row: NetworkSliceData): NetworkSliceData => row,
135 renderComponent: NetslicePackagesActionComponent
140 /** smart table Data Settings @public */
141 public generateSettings(): void {
144 editButtonContent: '<i class="fa fa-edit" title="Edit"></i>',
148 deleteButtonContent: '<i class="far fa-trash-alt" title="delete"></i>',
151 columns: this.columnLists,
158 attr: this.sharedService.tableClassConfig(),
159 pager: this.sharedService.paginationPagerConfig(),
160 noDataMessage: this.translateService.instant('NODATAMSG')
164 /** smart table listing manipulation @private */
165 public onChange(perPageValue: number): void {
166 this.dataSource.setPaging(1, perPageValue, true);
169 /** smart table listing manipulation @private */
170 public onUserRowSelect(event: MessageEvent): void {
171 Object.assign(event.data, { page: 'network-slice' });
172 this.dataService.changeMessage(event.data);
175 /** Drag and drop feature and fetchind the details of files @private */
176 public filesDropped(files: FileList): void {
177 if (files && files.length === 1) {
178 this.isLoadingResults = true;
179 this.sharedService.getFileString(files, 'yaml').then((fileContent: String | ArrayBuffer): void => {
180 const apiURLHeader: APIURLHEADER = {
181 url: environment.NETWORKSLICETEMPLATECONTENT_URL,
182 httpOptions: { headers: this.headers }
184 this.saveFileData(apiURLHeader, fileContent);
185 }).catch((err: string): void => {
186 this.isLoadingResults = false;
187 if (err === 'typeError') {
188 this.notifierService.notify('error', this.translateService.instant('YAMLFILETYPEERRROR'));
190 this.notifierService.notify('error', this.translateService.instant('ERROR'));
193 } else if (files && files.length > 1) {
194 this.notifierService.notify('error', this.translateService.instant('DROPFILESVALIDATION'));
198 /** Post the droped files and reload the page @public */
199 public saveFileData(urlHeader: APIURLHEADER, fileData: {}): void {
200 this.fileInput.nativeElement.value = null;
201 this.restService.postResource(urlHeader, fileData).subscribe((result: {}) => {
202 this.notifierService.notify('success', this.translateService.instant('PAGE.NETSLICE.TEMPLATECREATEDSUCCESSFULLY'));
204 }, (error: ERRORDATA) => {
205 this.restService.handleError(error, 'post');
206 this.isLoadingResults = false;
210 /** Generate nsData object from loop and return for the datasource @public */
211 public generateNetworkSliceData(networkSlicePackageData: NetworkSliceModel): NetworkSliceData {
213 name: networkSlicePackageData.name,
214 identifier: networkSlicePackageData._id,
215 usageState: networkSlicePackageData._admin.usageState
220 * Lifecyle hook which get trigger on component destruction
222 public ngOnDestroy(): void {
223 this.generateDataSub.unsubscribe();
226 /** Fetching the data from server to Load in the smarttable @protected */
227 protected generateData(): void {
228 this.isLoadingResults = true;
229 this.restService.getResource(environment.NETWORKSLICETEMPLATECONTENT_URL).subscribe((networkSliceList: NetworkSliceModel[]) => {
230 this.networkSliceData = [];
231 networkSliceList.forEach((networkSlicePackageData: NetworkSliceModel) => {
232 const networkSliceDataObj: NetworkSliceData = this.generateNetworkSliceData(networkSlicePackageData);
233 this.networkSliceData.push(networkSliceDataObj);
235 if (this.networkSliceData.length > 0) {
236 this.checkDataClass = 'dataTables_present';
238 this.checkDataClass = 'dataTables_empty';
240 this.dataSource.load(this.networkSliceData).then((data: boolean) => {
241 this.isLoadingResults = false;
243 this.isLoadingResults = false;
245 }, (error: ERRORDATA) => {
246 this.restService.handleError(error, 'get');
247 this.isLoadingResults = false;