import { Component, OnInit, ViewChild, ViewEncapsulation, Output, EventEmitter } from '@angular/core'; import { RestApiService } from '../api/rest-api.service'; import { ActivatedRoute } from '@angular/router'; import { Store } from '../store/store'; import { NgForm } from '@angular/forms'; import { forkJoin } from 'rxjs/observable/forkJoin'; import { pipe, groupBy, map, sort, descend, ascend, prop, find, propEq, findIndex } from 'ramda'; import { sortBy, forEach } from 'lodash'; import { ToastrService } from 'ngx-toastr'; export const groupingData = pipe( groupBy(prop('name')), map(sort(descend(prop('version')))) ); @Component({ selector: 'app-general', encapsulation: ViewEncapsulation.None, templateUrl: './general.component.html', styleUrls: ['./general.component.scss'] }) export class GeneralComponent implements OnInit { newVfcmt = { name: null, description: null, template: null, flowType: null, vfni: null, isCloneVFCMT: false, isUpdateFlowType: false }; isLatestVersion = true; vfniList = []; templates = []; serviceUUID: string; vfcmts = new Array(); versions = new Array(); result = new Array(); flowTypes = new Array(); selectedVfcmt; selectedVersion = null; importCompleted = false; disableName = false; disableDescription = false; disableFlowType = false; disableVnfiList = false; @Output() updateCdumpEv = new EventEmitter(); @ViewChild('generalForm') generalForm; // list = [ // { source: 'node1dsvsdsvd', target: 'node2' }, // { source: 'node3', target: 'node4' }, // { source: 'node5', target: 'nodedsvsds6' }, // { source: 'node7', target: 'node8' } // ]; list = []; constructor( private restApi: RestApiService, public store: Store, private toastr: ToastrService, private route: ActivatedRoute ) { console.log('route mcid: ', this.route.snapshot.params.mcid); if ( this.route.snapshot.params.mcid === 'import' || this.route.snapshot.params.mcid === 'new' ) { this.store.generalflow = this.route.snapshot.params.mcid; } else { this.store.generalflow = 'edit'; this.store.mcUuid = this.route.snapshot.params.mcid; } this.serviceUUID = this.route.snapshot.params.uuid; } onChangeTemplate(template) { console.log('flow template', template); } onChangeVfni(vfni) { console.log('vfni', vfni); } vfcmtChange(vfcmtName) { vfcmtName !== undefined ? (this.versions = this.result[vfcmtName]) : ((this.versions = []), this.restForm()); this.store.isEditMode = true; this.selectedVersion = null; } versionChange(version) { const versionIndex = findIndex(propEq('version', version))(this.versions); this.isLatestVersion = versionIndex === 0 ? true : false; const selectedVfcmtByVersion = find( propEq('version', version), this.result[this.selectedVfcmt] ); this.newVfcmt.template = selectedVfcmtByVersion.uuid; this.restApi.getVfcmtReferenceData(selectedVfcmtByVersion.uuid).subscribe( success => { this.store.loader = false; console.log('vfcmt ref data:', success); this.store.isEditMode = false; this.getServiceRef(success); }, error => { this.notifyError(error); }, () => { this.store.loader = false; } ); } private notifyError(error: any) { this.store.loader = false; console.log(error.notes); this.store.ErrorContent = Object.values(error.requestError); this.store.displayErrorDialog = true; } ngOnInit() { if (this.store.generalflow === 'edit') { this.store.loader = true; this.restApi .getCompositionMonitoringComponent(this.store.mcUuid) .subscribe( response => { this.newVfcmt = response.vfcmt; this.flowTypes.push(this.newVfcmt.flowType); this.newVfcmt.vfni = this.store.vfiName; this.vfniList.push({ resourceInstanceName: this.newVfcmt.vfni }); // this.store.cdump = response.cdump; this.updateCdumpEv.next(response.cdump); this.store.isEditMode = true; this.store.loader = false; }, error => { this.notifyError(error); } ); } else if (this.store.generalflow === 'import') { this.store.loader = true; this.store.isEditMode = true; this.restApi .getVfcmtsForMigration({ contextType: this.route.snapshot.params.contextType, uuid: this.route.snapshot.params.uuid, version: this.route.snapshot.params.version }) .subscribe( success => { this.store.loader = false; this.result = groupingData(success); this.vfcmts = sortBy(Object.keys(this.result), name => name); }, error => { this.notifyError(error); }, () => { this.store.loader = false; } ); } else if (this.route.snapshot.params.mcid === 'new') { // get template data for ddl const template$ = this.restApi.getTemplateResources(); // get service vfi list for ddl '08ff91f1-9b57-4918-998b-4d2c98832815' const vfniList$ = this.restApi.getServiceInstances(this.serviceUUID); this.store.loader = true; forkJoin(template$, vfniList$).subscribe( success => { console.log('all', success); this.templates = success[0]; this.vfniList = success[1].resources; }, error => { this.notifyError(error); }, () => { this.store.loader = false; } ); } } private restForm() { this.newVfcmt = { name: null, description: null, template: null, flowType: null, vfni: null, isCloneVFCMT: false, isUpdateFlowType: false }; const controls = this.generalForm.controls; forEach(controls, control => { control.markAsUntouched(); }); } private getServiceRef(data) { if (data.flowType !== undefined) { if (data.serviceUuid === this.serviceUUID) { this.newVfcmt.name = data.name; this.newVfcmt.description = data.description; this.disableName = true; this.disableDescription = true; this.setFlowType(data); // true this.setVfni(data); this.newVfcmt.isCloneVFCMT = false; } else { this.isCloneVfcmtToast(); this.setFlowType(data); // true this.setVfni(data); this.newVfcmt.isCloneVFCMT = true; } } else { if (data.serviceUuid === this.serviceUUID && this.isLatestVersion) { this.newVfcmt.name = data.name; this.newVfcmt.description = data.description; this.disableName = true; this.disableDescription = true; this.newVfcmt.isCloneVFCMT = false; this.setFlowType(data); // true this.setVfni(data); } else { this.isCloneVfcmtToast(); this.setFlowType(data); // true this.setVfni(data); this.newVfcmt.isCloneVFCMT = true; } } } private isCloneVfcmtToast() { this.toastr.warning( `

The monitoring configuration is copied.

The selected VFCMT is assigned to a different
service or has a newer version.
`, '', { enableHtml: true, // disableTimeOut: true timeOut: 10000 } ); } private setVfni(data: any) { if (data.serviceUuid !== this.serviceUUID) { this.getVfniList(); this.disableVnfiList = false; } else { this.disableVnfiList = true; this.vfniList.push({ resourceInstanceName: data.vfiName }); this.newVfcmt.vfni = data.vfiName; } } private setFlowType(data: any) { if (data.flowType === undefined) { this.newVfcmt.isUpdateFlowType = true; this.disableFlowType = false; this.getFlowTypeList(); } else { this.newVfcmt.isUpdateFlowType = false; this.disableFlowType = true; this.flowTypes.push(data.flowType); this.newVfcmt.flowType = data.flowType; } } private getFlowTypeList() { this.restApi.getFlowType().subscribe( success => { console.log('flow types', success.flowTypes); this.flowTypes = success.flowTypes; }, error => { this.notifyError(error); }, () => { this.store.loader = false; } ); } private getVfniList() { this.restApi.getServiceInstances(this.serviceUUID).subscribe( success => { console.log('vfni List', success); this.vfniList = success.resources; }, error => { this.notifyError(error); return null; }, () => { this.store.loader = false; } ); } }