src/app/vim-accounts/new-vimaccount/NewVimaccountComponent.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 Vim Account Component.
  20  */
  21 import { HttpHeaders } from '@angular/common/http';
  22 import { Component, ElementRef, Injector, OnInit, ViewChild } from '@angular/core';
  23 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
  24 import { Router } from '@angular/router';
  25 import { TranslateService } from '@ngx-translate/core';
  26 import { NotifierService } from 'angular-notifier';
  27 import { APIURLHEADER, ERRORDATA, TYPESECTION, VIM_TYPES } from 'CommonModel';
  28 import { environment } from 'environment';
  29 import * as jsyaml from 'js-yaml';
  30 import { RestService } from 'RestService';
  31 import { SharedService } from 'SharedService';
  32 import { isNullOrUndefined } from 'util';
  33 import { FEATURES, VIMLOCATION, VIMLOCATIONDATA } from 'VimAccountModel';
  34
  35 /**
  36  * Creating component
  37  * @Component takes NewVimaccountComponent.html as template url
  38  */
  39 @Component({
  40   selector: 'app-new-vimaccount',
  41   templateUrl: './NewVimaccountComponent.html',
  42   styleUrls: ['./NewVimaccountComponent.scss']
  43 })
  44 /** Exporting a class @exports NewVimaccountComponent */
  45 export class NewVimaccountComponent implements OnInit {
  46   /** To inject services @public */
  47   public injector: Injector;
  48
  49   /** FormGroup vim New Account added to the form @ html @public */
  50   public vimNewAccountForm: FormGroup;
  51
  52   /** Supported Vim type for the dropdown */
  53   public vimType: TYPESECTION[];
  54
  55   /** Supported Vim type for the dropdown */
  56   public selectedVimType: string;
  57
  58   /** Supported true and false value for the dropdown */
  59   public boolValue: {}[];
  60
  61   /** Form submission Add */
  62   public submitted: boolean = false;
  63
  64   /** Showing more details of collapase */
  65   public isCollapsed: boolean = false;
  66
  67   /** Vim location values @public */
  68   public getVIMLocation: VIMLOCATIONDATA[] = [];
  69
  70   /** Check the Projects loading results @public */
  71   public isLocationLoadingResults: boolean = false;
  72
  73   /** Give the message for the loading @public */
  74   public message: string = 'PLEASEWAIT';
  75
  76   /** set the longitude value of the selected place @public */
  77   public setLong: number;
  78
  79   /** set the latitude value of the selected place @public */
  80   public setLat: number;
  81
  82   /** Element ref for fileInput @public */
  83   @ViewChild('fileInput', { static: true }) public fileInput: ElementRef;
  84
  85   /** Element ref for fileInput @public */
  86   @ViewChild('fileInputLabel', { static: true }) public fileInputLabel: ElementRef;
  87
  88   /** Instance of the rest service @private */
  89   private restService: RestService;
  90
  91   /** Holds the instance of router class @private */
  92   private router: Router;
  93
  94   /** Controls the header form @private */
  95   private headers: HttpHeaders;
  96
  97   /** FormBuilder instance added to the formBuilder @private */
  98   private formBuilder: FormBuilder;
  99
 100   /** Notifier service to popup notification @private */
 101   private notifierService: NotifierService;
 102
 103   /** Contains tranlsate instance @private */
 104   private translateService: TranslateService;
 105
 106   /** Contains all methods related to shared @private */
 107   private sharedService: SharedService;
 108
 109   /** Contains configuration key variables @private */
 110   private configKeys: string[] = [];
 111
 112   constructor(injector: Injector) {
 113     this.injector = injector;
 114     this.restService = this.injector.get(RestService);
 115     this.formBuilder = this.injector.get(FormBuilder);
 116     this.router = this.injector.get(Router);
 117     this.notifierService = this.injector.get(NotifierService);
 118     this.translateService = this.injector.get(TranslateService);
 119     this.sharedService = this.injector.get(SharedService);
 120
 121     /** Initializing Form Action */
 122     this.vimNewAccountForm = this.formBuilder.group({
 123       name: [null, Validators.required],
 124       vim_type: [null, Validators.required],
 125       vim_tenant_name: [null, Validators.required],
 126       description: [null],
 127       vim_url: [null, [Validators.required, Validators.pattern(this.sharedService.REGX_URL_PATTERN)]],
 128       schema_type: [''],
 129       vim_user: [null, Validators.required],
 130       vim_password: [null, Validators.required],
 131       vimconfig: this.paramsBuilder()
 132     });
 133   }
 134
 135   /** Generate params for config @public */
 136   public paramsBuilder(): FormGroup {
 137     return this.formBuilder.group({
 138       use_existing_flavors: [null],
 139       location: [null],
 140       sdn_controller: [null],
 141       APIversion: [null],
 142       sdn_port_mapping: [null],
 143       project_domain_id: [null],
 144       vim_network_name: [null],
 145       project_domain_name: [null],
 146       config_vim_ype: [null],
 147       user_domain_id: [null],
 148       security_groups: [null],
 149       user_domain_name: [null],
 150       availabilityZone: [null],
 151       keypair: [null],
 152       region_name: [null],
 153       dataplane_physical_net: [null],
 154       insecure: [null],
 155       use_floating_ip: [null],
 156       microversion: [null],
 157       use_internal_endpoint: [null],
 158       additional_conf: [null],
 159       orgname: [null],
 160       vcenter_ip: [null],
 161       vcenter_port: [null],
 162       admin_username: [null],
 163       vcenter_user: [null],
 164       admin_password: [null],
 165       vcenter_password: [null],
 166       nsx_manager: [null],
 167       vrops_site: [null],
 168       nsx_user: [null],
 169       vrops_user: [null],
 170       nsx_password: [null],
 171       vrops_password: [null],
 172       vpc_cidr_block: [null],
 173       flavor_info: [null],
 174       subscription_id: [null],
 175       resource_group: [null],
 176       vnet_name: [null],
 177       flavors_pattern: [null]
 178     });
 179   }
 180
 181   /** convenience getter for easy access to form fields */
 182   get f(): FormGroup['controls'] { return this.vimNewAccountForm.controls; }
 183
 184   /**
 185    * Lifecyle Hooks the trigger before component is instantiate
 186    */
 187   public ngOnInit(): void {
 188     this.vimType = VIM_TYPES;
 189     this.boolValue = [
 190       { id: '', name: 'None' },
 191       { id: true, name: 'True' },
 192       { id: false, name: 'False' }
 193     ];
 194     this.headers = new HttpHeaders({
 195       Accept: 'application/json',
 196       'Content-Type': 'application/json',
 197       'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0'
 198     });
 199   }
 200
 201   /** On modal submit newVimAccountSubmit will called @public */
 202   public newVimAccountSubmit(): void {
 203     this.submitted = true;
 204     if (!this.vimNewAccountForm.invalid) {
 205       this.isLocationLoadingResults = true;
 206       this.configKeys.forEach((key: string) => {
 207         this.vimNewAccountForm.controls.vimconfig.get(key).setValue(JSON.parse(this.vimNewAccountForm.controls.vimconfig.get(key).value));
 208       });
 209       this.sharedService.cleanForm(this.vimNewAccountForm);
 210       Object.keys(this.vimNewAccountForm.value.vimconfig).forEach((key: string) => {
 211         if (this.vimNewAccountForm.value.vimconfig[key] === undefined || this.vimNewAccountForm.value.vimconfig[key] === null ||
 212           this.vimNewAccountForm.value.vimconfig[key] === '') {
 213           delete this.vimNewAccountForm.value.vimconfig[key];
 214         }
 215       });
 216       this.vimNewAccountForm.value.config = this.vimNewAccountForm.value.vimconfig;
 217       delete this.vimNewAccountForm.value.vimconfig;
 218       const apiURLHeader: APIURLHEADER = {
 219         url: environment.VIMACCOUNTS_URL,
 220         httpOptions: { headers: this.headers }
 221       };
 222       this.restService.postResource(apiURLHeader, this.vimNewAccountForm.value)
 223         .subscribe((result: {}) => {
 224           this.notifierService.notify('success', this.translateService.instant('PAGE.VIM.CREATEDSUCCESSFULLY'));
 225           this.isLocationLoadingResults = false;
 226           this.router.navigate(['vim/details']).catch(() => {
 227             // Error Cached;
 228           });
 229           // Post the New Vim data and reflect in the VIM Details Page.
 230         }, (error: ERRORDATA) => {
 231           this.configKeys.forEach((key: string) => {
 232             this.vimNewAccountForm.controls.vimconfig.get(key)
 233               .setValue(JSON.stringify(this.vimNewAccountForm.controls.vimconfig.get(key).value));
 234           });
 235           this.restService.handleError(error, 'post');
 236           this.isLocationLoadingResults = false;
 237         });
 238     }
 239   }
 240
 241   /** Routing to VIM Account Details Page @public */
 242   public onVimAccountBack(): void {
 243     this.router.navigate(['vim/details']).catch(() => {
 244       // Error Cached
 245     });
 246   }
 247
 248   /** Fetching the location with name,latitude,longitude @public */
 249   public fetchLocationLatLong(value: string): void {
 250     this.isLocationLoadingResults = true;
 251     const newVIMLocation: VIMLOCATIONDATA[] = [];
 252     const locationTrack: string = environment.MAPLATLONGAPI_URL;
 253     const locationAPIURL: string = locationTrack.replace('{value}', value);
 254     this.restService.getResource(locationAPIURL).subscribe((result: VIMLOCATION) => {
 255       result.features.forEach((getFeturesResult: FEATURES) => {
 256         if ('extent' in getFeturesResult.properties) {
 257           getFeturesResult.properties.extent.forEach((extentResult: number, index: number) => {
 258             if (index === 0) {
 259               this.setLong = extentResult;
 260             }
 261             if (index === 1) {
 262               this.setLat = extentResult;
 263             }
 264           });
 265         } else {
 266           getFeturesResult.geometry.coordinates.forEach((coordinateResult: number, index: number) => {
 267             if (index === 0) {
 268               this.setLong = coordinateResult;
 269             }
 270             if (index === 1) {
 271               this.setLat = coordinateResult;
 272             }
 273           });
 274         }
 275         newVIMLocation.push({
 276           label: getFeturesResult.properties.name + ',' + getFeturesResult.properties.state + ', ' + getFeturesResult.properties.country,
 277           value: getFeturesResult.properties.name + ',' + this.setLong + ',' + this.setLat
 278         });
 279       });
 280       this.getVIMLocation = newVIMLocation;
 281       this.isLocationLoadingResults = false;
 282     }, (error: ERRORDATA) => {
 283       this.restService.handleError(error, 'get');
 284       this.isLocationLoadingResults = false;
 285     });
 286   }
 287
 288   /** Drag and drop feature and fetchind the details of files  @private */
 289   public filesDropped(files: FileList): void {
 290     this.configKeys = [];
 291     if (files && files.length === 1) {
 292       this.sharedService.getFileString(files, 'yaml').then((fileContent: string): void => {
 293         const getJson: string = jsyaml.load(fileContent, { json: true });
 294         Object.keys(getJson).forEach((item: string) => {
 295           if (!isNullOrUndefined(this.vimNewAccountForm.controls.vimconfig.get(item))) {
 296             if (typeof getJson[item] === 'object') {
 297               // tslint:disable-next-line: no-backbone-get-set-outside-model
 298               this.vimNewAccountForm.controls.vimconfig.get(item).setValue(JSON.stringify(getJson[item]));
 299               this.configKeys.push(item);
 300             } else {
 301               // tslint:disable-next-line: no-backbone-get-set-outside-model
 302               this.vimNewAccountForm.controls.vimconfig.get(item).setValue(getJson[item]);
 303             }
 304           }
 305         });
 306       }).catch((err: string): void => {
 307         if (err === 'typeError') {
 308           this.notifierService.notify('error', this.translateService.instant('YAMLFILETYPEERRROR'));
 309         } else {
 310           this.notifierService.notify('error', this.translateService.instant('ERROR'));
 311         }
 312         this.fileInputLabel.nativeElement.innerText = this.translateService.instant('CHOOSEFILE');
 313         this.fileInput.nativeElement.value = null;
 314       });
 315     } else if (files && files.length > 1) {
 316       this.notifierService.notify('error', this.translateService.instant('DROPFILESVALIDATION'));
 317     }
 318     this.fileInputLabel.nativeElement.innerText = files[0].name;
 319     this.fileInput.nativeElement.value = null;
 320   }
 321 }