diff options
Diffstat (limited to 'src/app/vnfs')
11 files changed, 993 insertions, 206 deletions
diff --git a/src/app/vnfs/build-artifacts/build-artifacts.component.ts b/src/app/vnfs/build-artifacts/build-artifacts.component.ts index ca45e61..095c239 100644 --- a/src/app/vnfs/build-artifacts/build-artifacts.component.ts +++ b/src/app/vnfs/build-artifacts/build-artifacts.component.ts @@ -28,6 +28,7 @@ import * as _ from 'underscore'; import { NotificationsService } from 'angular2-notifications'; import { appConstants } from '../../../constants/app-constants'; +export const ACTIONS_REQUIRED_DROPDOWN = ['Configure', 'ConfigModify', 'ConfigScaleOut']; @Component({ selector: 'app-build-design', templateUrl: './build-artifacts.component.html', styleUrls: ['./build-artifacts.component.css'] }) export class BuildDesignComponent implements OnInit { @@ -69,17 +70,33 @@ export class BuildDesignComponent implements OnInit { } } - public getRefData(referenceList) { + public getRefData( referenceList, reqObj?) { + console.log( "getRefData: start: referenceList.action:["+ + referenceList.action+"]"); this.refList = referenceList; - if (referenceList.action !== appConstants.Actions.blank && referenceList.scope['vnf-type'] !== '' && referenceList['device-protocol'] !== appConstants.DeviceProtocols.blank) { - if (referenceList.action === appConstants.Actions.configScaleOut) { - if (referenceList.hasOwnProperty('template-id') && referenceList['template-id'] !== undefined && referenceList['template-id'] != '') - this.refDataRequiredFiels = true; + if( referenceList.action !== '' && + referenceList.scope['vnf-type'] !== '' && + referenceList['device-protocol'] !== '' ) + { + if( ACTIONS_REQUIRED_DROPDOWN.indexOf(referenceList.action) > -1) + { + if( referenceList.action == 'ConfigScaleOut') + { + if( reqObj != undefined && reqObj.hasOwnProperty('reqField') && + reqObj.reqField != '' + ) + this.refDataRequiredFiels = true; + else + this.refDataRequiredFiels = false; } - else this.refDataRequiredFiels = true; + else + this.refDataRequiredFiels = true; + } + else + this.refDataRequiredFiels = true; } else { - this.refDataRequiredFiels = false; + this.refDataRequiredFiels = false; } } diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html index bfe281b..799627b 100644 --- a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html +++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html @@ -18,7 +18,6 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. -ECOMP is a trademark and service mark of AT&T Intellectual Property. ============LICENSE_END============================================ --> @@ -40,14 +39,17 @@ ECOMP is a trademark and service mark of AT&T Intellectual Property. <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> <label>Vnf Type</label><input class="form-control" type="text" disabled value="{{vnfType}}" /> </div> - <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> + <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="vnfcType"> <label>Vnfc Type</label><input class="form-control" type="text" disabled value="{{vnfcType}}" /> </div> + <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="!vnfcType"> + + </div> <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> <label>Protocol</label><input class="form-control" type="text" disabled value="{{protocol}}" /> </div> <div *ngIf="(action === 'ConfigScaleOut')" class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> - <label>Template Identifier</label><input class="form-control" type="text" disabled value="{{identifier}}" /> + <label>Template Identifier</label><input class="form-control" type="text" disabled value="{{template_id}}" /> </div> </div> </div> @@ -215,4 +217,4 @@ ECOMP is a trademark and service mark of AT&T Intellectual Property. </form> </div> -</div>
\ No newline at end of file +</div> diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts index 19a5f6d..28c2a19 100644 --- a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts +++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts @@ -106,7 +106,7 @@ export class ParameterComponent implements OnInit { public appDataObject: any; public downloadDataObject: any; public artifact_fileName = ""; - identifier: any; + template_id: any; private selectedActionReference: any; constructor(private httpService: HttpUtilService, @@ -165,7 +165,7 @@ export class ParameterComponent implements OnInit { }; } - this.identifier = this.mappingEditorService.identifier; + this.template_id = this.mappingEditorService.identifier; } ngAfterViewInit() { diff --git a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.html b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.html index ebcb9c0..6065e6d 100644 --- a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.html +++ b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.html @@ -29,7 +29,7 @@ limitations under the License. <div class="row" style="padding: 15px 25px"> <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> <label>Action*</label> - <select class="form-control" required id="cmbAction" [(ngModel)]="referenceDataObject.action" (ngModelChange)="updateSessionValues($event,'action');actionChange($event,content,userForm);" #action="ngModel" name="action"> + <select class="form-control" required id="cmbAction" [(ngModel)]="referenceDataObject.action" (ngModelChange)="updateSessionValues($event,'action');actionChange($event,userForm);handleVMBlockDisplay()" #action="ngModel" name="action"> <option [value]="actionType" [ngClass]="{'selectedAction':selectedActions.indexOf(actionType)>-1}" [selected]="referenceDataObject.action===actionType" @@ -43,9 +43,19 @@ limitations under the License. <input type="text" readonly class="form-control" id="txtVnfType" required [(ngModel)]="referenceDataObject['scope']['vnf-type']" (ngModelChange)="updateSessionValues($event,'vnfType')" #vnftype="ngModel" name="vnftype"> <span class="error-message" [hidden]="vnfParams?.vnfType || vnftype.valid || (vnftype.pristine && !userForm.submitted)">Required Field</span> </div> - <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> + + <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="((displayVnfc=='true') || isVnfcType) && (referenceDataObject['action']=='Configure' || referenceDataObject['action']=='ConfigModify')"> <label>VNFC Type</label> - <input type="text" class="form-control" readonly id="txtVnfcType" [(ngModel)]="referenceDataObject.scope['vnfc-type']" (blur)="setVnfcType($event.target.value)" (ngModelChange)="updateSessionValues($event,'vnfcType')" #vnfcType="ngModel" name="vnfcType"> + <input *ngIf="isVnfcType" type="text" class="form-control" readonly id="txtVnfcType" [(ngModel)]="referenceDataObject.scope['vnfc-type']" (blur)="setVnfcType($event.target.value)" (ngModelChange)="updateSessionValues($event,'vnfcType')" #vnfcType="ngModel" + name="vnfcType"> + <select *ngIf="isVnfcTypeList" class="form-control" id="vnfcType" (ngModelChange)="vnfcChanged($event,content,userForm)" [ngModel]="vnfcIdentifier" #deviceProtocol="ngModel" name="templateIdentifier"> + <option [value]="val" *ngFor="let val of referenceDataObject.scope['vnfc-type-list']">{{val}} + </option> + </select> + <a *ngIf="isVnfcTypeList" style=" color: blue;" href="javascript:void(0)" (click)="vnfcModal.open()">Add New VNFC Type</a> + </div> + + <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="displayVnfc!='true' || (referenceDataObject['action']!='Configure' && referenceDataObject['action']!='ConfigModify')"> </div> <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> <label>Device Protocol*</label> @@ -58,11 +68,11 @@ limitations under the License. </div> <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="isConfigScaleOut"> <label>Template Identifier</label> - <select class="form-control" required id="tempIdentifier" (ngModelChange)="dataModified();idChange($event,content,userForm)" [(ngModel)]="templateIdentifier" #deviceProtocol="ngModel" name="templateIdentifier"> + <select class="form-control" required id="tempIdentifier" (ngModelChange)="dataModified();idChange($event,userForm)" [(ngModel)]="templateIdentifier" #deviceProtocol="ngModel" name="templateIdentifier"> <option [value]="val" *ngFor="let val of referenceDataObject['template-id-list']">{{val}} </option> </select> - <span class="error-message" [hidden]="deviceProtocol.valid || (deviceProtocol.pristine && !userForm.submitted)">Required Field</span> + <!-- <span class="error-message" [hidden]="deviceProtocol.valid || (deviceProtocol.pristine && !userForm.submitted)">Required Field</span> --> </div> <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="referenceDataObject['action']== 'ConfigScaleOut'" style="margin-top: 30px"> @@ -141,7 +151,7 @@ limitations under the License. <div class="row" *ngIf="(( referenceDataObject.action =='ConfigScaleOut' ||referenceDataObject.action =='Configure'|| referenceDataObject.action =='' || referenceDataObject.action ==undefined ) && isCollapsedContent) "> <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12"> <label style="font-size:12px;">VNFC Type</label> - <input type="text" class="form-control" id="txtVnfcTypeInColl" [(ngModel)]="Sample['vnfc-type']" #vnfcType="ngModel" name="samplevnfcType"> + <input type="text" class="form-control" id="txtVnfcTypeInColl" [(ngModel)]="Sample['vnfc-type']" (blur)="checkVnfcTypeEqual(vnfcType.value)" #vnfcType="ngModel" name="samplevnfcType"> </div> <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12"> <label style="font-size:12px">VNFC Function Code</label> @@ -201,7 +211,7 @@ limitations under the License. </div> <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12"> <label style="font-size:12px;">VNFC Type</label> - <input type="text" class="form-control" id="txtVnfcTypeInColl" required [(ngModel)]="item['vnfc-type']" #vnfcType{{j}}="ngModel" name="vnfcType{{j}}"> + <input type="text" class="form-control" id="txtVnfcTypeInColl" required [(ngModel)]="item['vnfc-type']" #vnfcType="ngModel" name="vnfcType{{j}}"> <span class="error-message" [hidden]="vnfcType.valid || (vnfcType.pristine && !userForm.submitted)">Required Field</span> </div> <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12"> @@ -298,6 +308,26 @@ limitations under the License. </div> </div> </div> + +<!-- Modal for Vnfc Identifier --> +<modal #vnfcModal> + <modal-header [show-close]="true"> + <h4 class="modal-title">Enter New VNFC Type</h4> + </modal-header> + <modal-body> + <div> + <input pattern=".*[^ ].*" name="test" type="text" class="" (ngModelChange)="validateVnfcName($event)" [(ngModel)]="newVnfcType" placeholder="vnfctype"> + <span class="error-message">{{errorMessage}}</span> + </div> + </modal-body> + <modal-footer [show-default-buttons]="false"> + <div> + <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" (click)="templateId=''" data-dismiss="modal">cancel</button> + <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" data-dismiss="modal" (click)="addVnfc()" [disabled]="invalid">Add</button> + </div> + </modal-footer> +</modal> + <div id="identifierModal" class="modal fade" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> @@ -339,4 +369,4 @@ limitations under the License. <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="c('yes')">Yes </button> </div> -</ng-template>
\ No newline at end of file +</ng-template> diff --git a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.ts b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.ts index 8223b56..25e0721 100644 --- a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.ts +++ b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.ts @@ -36,17 +36,25 @@ import { NotificationsService } from 'angular2-notifications'; import { ParamShareService } from '../../..//shared/services/paramShare.service'; import { environment } from '../../../../environments/environment'; import { saveAs } from 'file-saver'; +import { ReferenceDataFormUtil } from './reference-dataform.util'; import { UtilityService } from '../../../shared/services/utilityService/utility.service'; import { appConstants } from '../../../../constants/app-constants'; +// Common Confirm Modal +import { DialogService } from 'ng2-bootstrap-modal'; +import { ConfirmComponent } from "../../../shared/confirmModal/confirm.component"; + declare var $: any; type AOA = Array<Array<any>>; const REFERENCE_DATA:string= "reference_data"; + @Component({ selector: 'reference-dataform', templateUrl: './reference-dataform.component.html', - styleUrls: ['./reference-dataform.component.css'] + styleUrls: ['./reference-dataform.component.css'], + providers: [ReferenceDataFormUtil] }) export class ReferenceDataformComponent implements OnInit { + public classNm= "ReferenceDataformCompon"; @ViewChild(ModalComponent) modalComponent: ModalComponent; public showUploadStatus: boolean = false; public fileUploaded: boolean = false; @@ -75,7 +83,11 @@ export class ReferenceDataformComponent implements OnInit { template: { templateData: {}, nameValueData: {}, templateFileName: '', nameValueFileName: '' }, pd: { pdData: '', pdFileName: '' } }; + errorMessage = ''; + invalid = true; fileName: any; + vnfcIdentifier; + oldVnfcIdentifier: any; public uploadFileName: any; public addVmClickedFlag: boolean = false; public getExcelUploadStatus: boolean = false; @@ -85,6 +97,7 @@ export class ReferenceDataformComponent implements OnInit { oldAction: any; nonConfigureAction: any; templateId; + newVnfcType; templateIdentifier; public actionLevels = [ 'vnfc', 'vnf' @@ -104,7 +117,7 @@ export class ReferenceDataformComponent implements OnInit { public referenceDataObject = { action: '', 'action-level': 'vnf', - scope: { 'vnf-type': '', 'vnfc-type': '' }, + scope: { 'vnf-type': '', 'vnfc-type-list': [] }, 'template': 'Y', vm: [], 'device-protocol': '', @@ -172,32 +185,52 @@ export class ReferenceDataformComponent implements OnInit { public firstArrayElement = []; public remUploadedDataArray = []; isConfigScaleOut = false - configScaleOutExist: boolean - public versionNoForApiCall: any= "0.0.1" + isConfigOrConfigModify = false; + configScaleOutExist: boolean = true; + displayVnfc = 'false'; + isVnfcType: boolean; + isVnfcTypeList: boolean = true; + public actionList = { + "ConfigScaleOut": "ConfigScaleOut", + "Configure": "Configure" + }; + public versionNoForApiCall = "0.0.1"; + private displayVMBlock: boolean = true; + constructor( - private buildDesignComponent: BuildDesignComponent, - private httpUtils: HttpUtilService, - private route: Router, - private location: Location, - private activeRoutes: ActivatedRoute, - private notificationService: NotificationService, - private paramShareService: ParamShareService, - private mappingEditorService: MappingEditorService, - private modalService: NgbModal, - private nService: NotificationsService, - private ngProgress: NgProgress, - private utilityService: UtilityService) { + private buildDesignComponent: BuildDesignComponent, + private httpUtils: HttpUtilService, + private route: Router, + private location: Location, + private activeRoutes: ActivatedRoute, + private notificationService: NotificationService, + private paramShareService: ParamShareService, + private mappingEditorService: MappingEditorService, + private modalService: NgbModal, + private nService: NotificationsService, + private ngProgress: NgProgress, + private utilityService: UtilityService, + private dialogService: DialogService, + private referenceDataFormUtil: ReferenceDataFormUtil ) + { + console.log( this.classNm+": new: start."); } ngOnInit() { - + console.log( this.classNm+": ngOnInit: start."); + this.displayVnfc = sessionStorage.getItem("vnfcSelectionFlag"); + if (this.configScaleOutExist) { + this.actions = ['', 'Configure', 'ConfigModify', 'ConfigBackup', 'ConfigRestore', 'GetRunningConfig', 'HealthCheck', 'StartApplication', 'StopApplication', 'QuiesceTraffic', 'ResumeTraffic', 'UpgradeBackout', 'UpgradeBackup', 'UpgradePostCheck', 'UpgradePreCheck', 'UpgradeSoftware', 'OpenStack Actions', 'ConfigScaleOut']; + } else { + this.actions = ['', 'Configure', 'ConfigModify', 'ConfigBackup', 'ConfigRestore', 'GetRunningConfig', 'HealthCheck', 'StartApplication', 'StopApplication', 'QuiesceTraffic', 'ResumeTraffic', 'UpgradeBackout', 'UpgradeBackup', 'UpgradePostCheck', 'UpgradePreCheck', 'UpgradeSoftware', 'OpenStack Actions']; + } this.self = this; let path = this.location.path; this.title = 'Reference Data'; this.referenceDataObject = { action: '', 'action-level': 'vnf', - scope: { 'vnf-type': '', 'vnfc-type': '' }, + scope: { 'vnf-type': '', 'vnfc-type-list': [] }, 'template': 'Y', vm: [], 'device-protocol': '', @@ -215,6 +248,7 @@ export class ReferenceDataformComponent implements OnInit { this.refernceScopeObj.sourceType = this.referenceDataObject['scopeType']; this.oldAction = this.referenceDataObject.action; this.populateExistinAction(this.referenceDataObject.action); + this.displayHideVnfc(); } } else if (this.updateParams != 'undefined') { this.getArtifact(); @@ -223,22 +257,35 @@ export class ReferenceDataformComponent implements OnInit { if (appData != null || appData != undefined) this.appData = appData; var downloadData = this.mappingEditorService.downloadDataObject; if (downloadData != null || downloadData != undefined) this.downloadData = downloadData; - this.vnfParams = JSON.parse(sessionStorage.getItem('vnfParams')); + if (sessionStorage.getItem('vnfParams')) { + this.vnfParams = JSON.parse(sessionStorage.getItem('vnfParams')); + } if (this.vnfParams && this.vnfParams.vnfType) { - this.referenceDataObject['scope']['vnf-type'] = this.vnfParams.vnfType; + console.log( this.classNm+": ngOnInit: vnfParams.vnfType:["+ + this.vnfParams.vnfType+"]"); + this.referenceDataObject['scope']['vnf-type']= this.vnfParams.vnfType; } if (this.vnfParams && this.vnfParams.vnfcType) { - this.referenceDataObject['scope']['vnfc-type'] = this.vnfParams.vnfcType; + console.log( this.classNm+": ngOnInit: vnfParams.vnfcType:["+ + this.vnfParams.vnfcType+"]"); + this.referenceDataObject['scope']['vnfc-type']= this.vnfParams.vnfcType; } this.uploadedDataArray = []; this.remUploadedDataArray = []; this.firstArrayElement = []; this.uploadFileName = ''; this.templateIdentifier = this.mappingEditorService.identifier + this.oldVnfcIdentifier = this.vnfcIdentifier; + console.log( this.classNm+": ngOnInit: displayVnfc:["+this.displayVnfc+"]"); + console.log( this.classNm+": ngOnInit: templateIdentifier:["+ + this.templateIdentifier+"]"); // Enable or Block Template and PD Tabs - this.buildDesignComponent.getRefData(this.referenceDataObject); + this.buildDesignComponent.getRefData( + { ...this.referenceDataObject, displayVnfc: this.displayVnfc }, + { reqField: this.templateIdentifier }); this.configDrp(this.referenceDataObject.action) } + toggleIdentifier(data) { if (data == 'ConfigScaleOut') { this.isConfigScaleOut = true @@ -250,6 +297,7 @@ export class ReferenceDataformComponent implements OnInit { //to retrive the data from appc and assign it to the vaiables, if no data display the message reterived from the API getArtifact() { + console.log( this.classNm+": getArtifact: start."); try { let data = this.utilityService.createPayloadForRetrieve(true, '', '', ''); this.ngProgress.start(); @@ -257,7 +305,10 @@ export class ReferenceDataformComponent implements OnInit { url: environment.getDesigns, data: data }).subscribe(resp => { + console.log( this.classNm+": getArtifact: got response ..."); if (resp.output.data.block != undefined) { + console.log( this.classNm+ + ": getArtifact: output.data.block not empty."); this.nService.success(appConstants.notifications.titles.status, appConstants.messages.datafetched); let artifactInfo = JSON.parse(resp.output.data.block).artifactInfo[0]; let reference_data = JSON.parse(artifactInfo['artifact-content'])['reference_data'][0]; @@ -266,18 +317,20 @@ export class ReferenceDataformComponent implements OnInit { if (this.referenceDataObject.action == appConstants.Actions.configScaleOut) { this.groupAnotationType = [appConstants.groupAnotationType.blank, appConstants.groupAnotationType.firstVnfcName, appConstants.groupAnotationType.fixedValue, appConstants.groupAnotationType.relativeValue, appConstants.groupAnotationType.existingGroupName]; } - + //chck vnfc or vnfcTypeList + this.displayHideVnfc(); // Enable or Block Template and PD Tabs - this.buildDesignComponent.getRefData(this.referenceDataObject); + this.buildDesignComponent.getRefData( + {...this.referenceDataObject, displayVnfc: this.displayVnfc } ); this.refernceScopeObj.sourceType = this.referenceDataObject['scopeType']; this.mappingEditorService.getReferenceList().push(JSON.parse(artifactInfo['artifact-content'])); this.tempAllData = JSON.parse(artifactInfo['artifact-content'])['reference_data']; this.oldAction = this.referenceDataObject.action; + this.oldVnfcIdentifier = this.vnfcIdentifier; if (this.referenceDataObject.action === appConstants.Actions.openStackActions) { this.deviceProtocols = [appConstants.DeviceProtocols.blank, appConstants.DeviceProtocols.openStack]; this.buildDesignComponent.tabs = [ { - name: 'Reference Data', url: 'references', }]; @@ -314,8 +367,68 @@ export class ReferenceDataformComponent implements OnInit { }, 3500); } + displayHideVnfc() { + if( this.utilityService.getTracelvl() > 0 ) + console.log(this.classNm+": displayHideVnfc: start..."); + if( this.utilityService.getTracelvl() > 1 ) { + if( this.referenceDataObject.scope['vnfc-type-list'] ) { + console.log( this.classNm+ + ": displayHideVnfc: refDataObj.scope.vnfc-type-list.length="+ + this.referenceDataObject.scope['vnfc-type-list'].length ); + } else { + console.log( this.classNm+ + ": displayHideVnfc: refDataObj.scope.vnfc-type-list not defined"); + }; + console.log( this.classNm+": displayHideVnfc: scope.vnfc-type:["+ + this.referenceDataObject.scope['vnfc-type']+"]"); + }; + if (this.referenceDataObject.scope['vnfc-type-list'] == undefined && (this.referenceDataObject.scope['vnfc-type'] != undefined || this.referenceDataObject.scope['vnfc-type'] != "")) { + this.isVnfcType = true + this.displayVnfc = 'true' + this.isVnfcTypeList = false + } + if (this.referenceDataObject.scope['vnfc-type-list'] != undefined && this.referenceDataObject.scope['vnfc-type-list'].length != 0 && (this.referenceDataObject.scope['vnfc-type'] == undefined || this.referenceDataObject.scope['vnfc-type'] == "")) { + this.isVnfcType = false + this.displayVnfc = 'true' + this.isVnfcTypeList = true + if(!this.mappingEditorService.newObject.vnfc) { + this.vnfcIdentifier = this.referenceDataObject.scope['vnfc-type-list'][0]; + // this.mappingEditorService.newObject.vnfc = this.vnfcIdentifier; + // this.referenceDataObject['vnfcIdentifier'] = this.vnfcIdentifier; + + } else { + this.vnfcIdentifier = this.mappingEditorService.newObject.vnfc; + } + if( this.utilityService.getTracelvl() > 0 ) + console.log(this.classNm+": displayHideVnfc: vnfcIdentifier:["+ + this.vnfcIdentifier+"]"); + } + if (this.referenceDataObject.scope['vnfc-type-list'] != undefined && this.referenceDataObject.scope['vnfc-type-list'].length == 0 && this.referenceDataObject.scope['vnfc-type'] != undefined && this.referenceDataObject.scope['vnfc-type'].length == 0) { + if(this.displayVnfc == 'true') { + this.isVnfcType = false + this.displayVnfc = 'true' + this.isVnfcTypeList = true + } else { + this.isVnfcType = false + this.displayVnfc = 'false' + this.isVnfcTypeList = false + } + } + if (this.referenceDataObject.scope['vnfc-type-list'] == undefined && this.referenceDataObject.scope['vnfc-type'] == '') { + this.isVnfcType = false + this.displayVnfc = 'false' + this.isVnfcTypeList = false + } + if( this.utilityService.getTracelvl() > 0 ) + console.log(this.classNm+": displayHideVnfc: finish. isVnfcType:["+ + this.isVnfcType+" displayVnfc:["+this.displayVnfc+"] isVnfcTypeList:["+ + this.isVnfcTypeList+"]"); + } + //reinitializing the required values ngOnDestroy() { + console.log( this.classNm+": ngOnDestroy: start:"+ + " vnfcIdentifier:["+this.vnfcIdentifier+"]"); let referenceObject = this.prepareReferenceObject(); this.mappingEditorService.changeNavAppData(this.appData); this.mappingEditorService.changeNavDownloadData(this.downloadData); @@ -333,7 +446,7 @@ export class ReferenceDataformComponent implements OnInit { this.numberOfVmTest = false; } } - + // update my vnf pop up session values updateSessionValues(event: any, type: string) { if (type === 'action') { sessionStorage.setItem('action', event); @@ -355,6 +468,27 @@ export class ReferenceDataformComponent implements OnInit { this.referenceDataObject.vm[vmNumber].vnfc.push(newObj); } + //validating the vnf and vnfc data in the pop up + validateVnfcName(name) { + console.log( this.classNm+": validateVnfcName: start: name:["+name+"]"); + if (!name.trim() || name.length < 1) { + this.errorMessage = ''; + this.invalid = true; + } else if (name.startsWith(' ') || name.endsWith(' ')) { + this.errorMessage = 'Leading and trailing spaces are not allowed'; + this.invalid = true; + } else if (name.includes(' ')) { + this.errorMessage = 'More than one space is not allowed in VNFC Type'; + this.invalid = true; + } else if (name.length > 50) { + this.errorMessage = 'VNFC Type should be of minimum one character and maximum 50 character'; + this.invalid = true; + } else { + this.invalid = false; + this.errorMessage = ''; + } + } + //to remove the VM's created by the user removeFeature(vmNumber: any, index: any, templateId) { if (this.referenceDataObject.action == "Configure") { @@ -422,6 +556,7 @@ export class ReferenceDataformComponent implements OnInit { //Reference object to create reference data prepareReferenceObject(isSaving?: any) { + console.log( this.classNm+": prepareReferenceObject: start."); let scopeName = this.resetParamsOnVnfcType(); let extension = this.decideExtension(this.referenceDataObject); this.prepareArtifactList(scopeName, extension); @@ -462,14 +597,16 @@ export class ReferenceDataformComponent implements OnInit { } upload(evt: any) { + console.log( this.classNm+": upload: start."); /* wire up file reader */ const target: DataTransfer = <DataTransfer>(evt.target); - //// console.log("filename========" + evt.target.files[0].name) this.uploadFileName = evt.target.files[0].name; var fileExtension = this.uploadFileName.substr(this.uploadFileName.lastIndexOf('.') + 1); if (target.files.length != 1) { + console.log( this.classNm+": upload: Error: got no file !"); throw new Error(appConstants.errors.multipleFileUploadError); } + console.log( this.classNm+": upload: filename:["+evt.target.files[0].name+"]"); if (fileExtension.toUpperCase() === 'XLS' || fileExtension.toUpperCase() === 'XLSX') { const reader = new FileReader(); reader.onload = (e: any) => { @@ -509,6 +646,7 @@ export class ReferenceDataformComponent implements OnInit { } addVmCapabilitiesData() { + console.log( this.classNm+": addVmCapabilitiesData: start."); for (var i = 0; i < this.uploadedDataArray.length; i++) { var vnfcFuncCodeArray = []; var data = this.uploadedDataArray[i]; @@ -541,6 +679,8 @@ export class ReferenceDataformComponent implements OnInit { //download template save(form: any, isValid: boolean) { + console.log( this.classNm+": save: start: referenceDataObject.action:["+ + this.referenceDataObject.action+"]"); if (this.referenceDataObject.action === '') { this.nService.error(appConstants.notifications.titles.error, appConstants.errors.noActionError); return; @@ -570,13 +710,16 @@ export class ReferenceDataformComponent implements OnInit { } } downloadFile(blob, fileName, delay) { + console.log( this.classNm+": downloadFile: start."); setTimeout(() => { saveAs(blob, fileName); }, delay) } downloadTemplate() { + console.log( this.classNm+": downloadTemplate: start."); var fileName = this.downloadData.template.templateFileName; + console.log( this.classNm+": downloadTemplate: fileName:["+fileName+"]"); var theJSON = this.downloadData.template.templateData; if (fileName != null || fileName != '') { var fileExtensionArr = fileName.split('.'); @@ -607,31 +750,25 @@ export class ReferenceDataformComponent implements OnInit { this.downloadFile(blob, fileName, 180) } - saveToAppc(valid, form, event) { - if (this.referenceDataObject.action === '') { - this.nService.error(appConstants.notifications.titles.error, appConstants.errors.noActionError); - return; - } - if (this.referenceDataObject['device-protocol'] === '') { - this.nService.error(appConstants.notifications.titles.error, appConstants.errors.noDeviceProtocolError); - return; - } - + // save the values to the cache, on action change without download + validateDataAndSaveToAppc( valid, form, event) { + console.log( this.classNm+": validateDataAndSaveToAppc: start: valid:"+valid); + // will show error message + this.showValidationErrors(this.referenceDataObject); try { form._submitted = true; if (valid) { - let referenceObject = this.prepareReferenceObject(true); + let removedKeysArray = [] + this.tempAllData.forEach((data, index) => { + if (data.action) { + removedKeysArray.push(JSON.parse(JSON.stringify(this.deleteUnwantedKeys(data)))) + } + }); + this.tempAllData = removedKeysArray; + this.validateTempAllData(); - let theJSON = JSON.stringify(this.tempAllData, null, '\t'); - let fileName = 'reference_AllAction_' + referenceObject.scopeName + '_' + '0.0.1V.json'; - this.uploadArtifact(JSON.stringify({ reference_data: this.tempAllData }), this.tempAllData[this.tempAllData.length - 1], fileName); - var templateData = JSON.stringify(this.appData.template.templateData); - var nameValueData = JSON.stringify(this.appData.template.nameValueData); - var pdData = JSON.stringify(this.appData.pd); - if (templateData != '{}' && templateData != null && templateData != undefined) this.saveTemp(); - if (nameValueData != '{}' && nameValueData != null && nameValueData != undefined) this.saveNameValue(); - if (pdData != '{}' && pdData != null && pdData != undefined) this.savePd(); + this.saveToAppc(); if (this.actionChanged) { this.clearVnfcData() if (this.currentAction) { @@ -644,11 +781,29 @@ export class ReferenceDataformComponent implements OnInit { } } catch (e) { - this.nService.warn(appConstants.notifications.titles.status, appConstants.messages.artifactSaveError); + this.nService.warn('status', 'unable to save the artifact'); } } + //this method saves reference, template, param and PD data to APPC + saveToAppc() { + console.log( this.classNm+": saveToAppc: start: vnf-type:["+ + this.referenceDataObject.scope['vnf-type']+"]"); + let theJSON = JSON.stringify(this.tempAllData, null, '\t'); + let fileName = 'reference_AllAction_' + this.referenceDataObject.scope['vnf-type'].replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, '') + '_' + '0.0.1V.json'; + this.saveReferenceDataToAppc(JSON.stringify({ reference_data: this.tempAllData }), this.tempAllData[this.tempAllData.length - 1], fileName); + + var templateData = JSON.stringify(this.appData.template.templateData); + var nameValueData = JSON.stringify(this.appData.template.nameValueData); + var pdData = JSON.stringify(this.appData.pd); + if (templateData != '{}' && templateData != null && templateData != undefined) this.referenceDataFormUtil.handleApiData(this.appData.template.templateData, 'template data'); + if (nameValueData != '{}' && nameValueData != null && nameValueData != undefined) this.referenceDataFormUtil.handleApiData(this.appData.template.nameValueData, 'name value pairs'); + if (pdData != '{}' && pdData != null && pdData != undefined) this.referenceDataFormUtil.handleApiData(this.appData.pd, 'PD file'); + } + + // valaidation of template data validateTempAllData() { + console.log( this.classNm+": validateTempAllData: start."); if (this.tempAllData) { var updatedData = []; this.tempAllData.forEach(data => { @@ -660,30 +815,28 @@ export class ReferenceDataformComponent implements OnInit { } } - appendSlashes(artifactData) { - return artifactData.replace(/"/g, '\\"'); - } - - uploadArtifact(artifactData, dataJson, fileName) { + //.. prepare and send the data to the API. + saveReferenceDataToAppc(artifactData, dataJson, fileName) { + console.log( this.classNm+": saveReferenceDataToAppc: start."); let data = []; - let slashedPayload = this.appendSlashes(artifactData); - let payload = this.utilityService.createPayLoadForSave(REFERENCE_DATA, dataJson['scope']['vnf-type'], "AllAction", fileName, this.versionNoForApiCall, slashedPayload); + let slashedPayload = this.referenceDataFormUtil.appendSlashes(artifactData); + let payload = this.utilityService.createPayLoadForSave("reference_data", dataJson['scope']['vnf-type'], "AllAction", fileName, this.versionNoForApiCall, slashedPayload); this.ngProgress.start(); this.httpUtils.post({ url: environment.getDesigns, data: payload }).subscribe((resp) => { - if (resp != null && resp.output.status.code == appConstants.errorCode["400"]) { + if (resp != null && resp.output.status.code == '400') { window.scrollTo(0, 0); - this.nService.success(appConstants.notifications.titles.status, appConstants.messages.referenceDataUplaodSuccess); + this.nService.success('Status', 'successfully uploaded the Reference Data'); } else { - this.nService.warn(appConstants.notifications.titles.status, appConstants.messages.referenceDataUplaodFailure); + this.nService.warn('Status', 'Error while saving Reference Data'); } this.uploadStatusError = false; this.getRefStatus = false; this.ngProgress.done(); }, (err) => { - this.nService.error(appConstants.notifications.titles.status, appConstants.errors.connectionError); + this.nService.error('Status', 'Error Connecting to the APPC Network'); window.scrollTo(0, 0); }); this.appData.reference = payload; @@ -693,6 +846,7 @@ export class ReferenceDataformComponent implements OnInit { } retriveFromAppc() { + console.log( this.classNm+": retriveFromAppc: start."); if (sessionStorage.getItem('updateParams') != 'undefined') { this.getArtifact(); this.noCacheData = false; @@ -715,6 +869,8 @@ export class ReferenceDataformComponent implements OnInit { }; public fileChange(input) { + if( this.utilityService.getTracelvl() > 0 ) + console.log( this.classNm+": fileChange: start."); this.fileName = input.target.files[0].name.replace(/C:\\fakepath\\/i, ''); this.fileUploaded = true; this.disableRetrieve = true; @@ -728,7 +884,29 @@ export class ReferenceDataformComponent implements OnInit { let obj: any; let jsonObject = (JSON.parse(result))['reference_data']; this.uploadedData = JSON.parse(JSON.stringify(jsonObject)); + //check for legacy artifact and do not allow it + for (let i = 0; i < this.uploadedData.length; i++) { + obj = this.uploadedData[i]; + if (obj.scope['vnfc-type'] != undefined && obj.scope['vnfc-type'] != '') { + this.nService.error('Error', 'The legacy reference artifact not supported'); + return; + } + } + this.displayVnfc = 'false'; + this.isVnfcType = false; + this.isVnfcTypeList = false; + for (let i = 0; i < this.uploadedData.length; i++) { + obj = this.uploadedData[i]; + if (obj.scope['vnfc-type-list'] && obj.scope['vnfc-type-list'].length > 0) { + this.displayVnfc = 'true'; + this.isVnfcTypeList = true; + this.vnfcIdentifier = obj.scope['vnfc-type-list'][0]; + } + } + this.oldAction=obj.action; this.tempAllData = JSON.parse(JSON.stringify(jsonObject)); + if( this.utilityService.getTracelvl() > 0 ) + console.log( this.classNm+": fileChange: read & parsed."); this.notificationService.notifySuccessMessage('Reference Data file successfully uploaded..'); if (jsonObject instanceof Array) { this.referenceDataObject = jsonObject[0]; @@ -740,6 +918,10 @@ export class ReferenceDataformComponent implements OnInit { this.selectedActions.push(jsonObject.action); } + if( this.utilityService.getTracelvl() > 0 ) + console.log( this.classNm+": fileChange: "+ + "referenceDataObject.action:["+ + this.referenceDataObject.action+"]"); this.toggleIdentifier(this.referenceDataObject.action) this.configDrp(this.referenceDataObject.action) if (this.referenceDataObject.action === 'OpenStack Actions') { @@ -775,8 +957,12 @@ export class ReferenceDataformComponent implements OnInit { if (this.referenceDataObject['action-level'] == null) { this.referenceDataObject['action-level'] = 'VNF'; } + if( this.utilityService.getTracelvl() > 0 ) + console.log( this.classNm+": fileChange: displayVnfc:["+ + this.displayVnfc+"]"); // Enable or Block Template and PD Tabs - this.buildDesignComponent.getRefData(this.referenceDataObject); + this.buildDesignComponent.getRefData( + { ...this.referenceDataObject, displayVnfc: this.displayVnfc }); } catch (e) { this.nService.error(appConstants.notifications.titles.error, appConstants.messages.incorrectFileFormat); } @@ -784,11 +970,14 @@ export class ReferenceDataformComponent implements OnInit { this.hideModal = true; }); } else { + if( this.utilityService.getTracelvl() > 0 ) + console.log( this.classNm+": fileChange: Error: Failed to read file!"); this.notificationService.notifyErrorMessage('Failed to read file..'); } } public readFile(file, reader, callback) { + console.log( this.classNm+": readFile: start."); // Set a callback funtion to fire after the file is fully loaded reader.onload = () => { // callback with the results @@ -804,6 +993,7 @@ export class ReferenceDataformComponent implements OnInit { } clearVnfcData() { + console.log( this.classNm+": clearVnfcData: start."); this.Sample = { 'vnfc-instance': '1', 'vnfc-function-code': '', @@ -817,17 +1007,18 @@ export class ReferenceDataformComponent implements OnInit { this.referenceDataObject.vm[index]['vm-instance'] = index + 1; } - setVnfcType(str: String) { - this.Sample['vnfc-type'] = str; - } + // setVnfcType(str: String) { + // this.Sample['vnfc-type'] = str; + // } - getChange(value: String) { - if (value === 'vnfType') { - this.referenceDataObject.scope['vnfc-type'] = ''; - } - } + // getChange(value: String) { + // if (value === 'vnfType') { + // this.referenceDataObject.scope['vnfc-type'] = ''; + // } + // } resetForm() { + console.log( this.classNm+": resetForm: start."); this.referenceDataObject['action-level'] = 'vnf'; this.referenceDataObject.template = 'Y'; this.referenceDataObject['device-protocol'] = ''; @@ -837,7 +1028,9 @@ export class ReferenceDataformComponent implements OnInit { this.Sample['vnfc-type'] = ''; } + // this method gets called with the action as parameter and the respective action details are fetched and assigned to the current page populateExistinAction(data) { + console.log( this.classNm+": populateExistinAction: start."); let existAction = this.tempAllData.findIndex(obj => { return obj.action == data; }); @@ -848,7 +1041,11 @@ export class ReferenceDataformComponent implements OnInit { this.referenceDataObject.scope['vnfc-type-list'] = obj['scope']['vnfc-type-list']; this.referenceDataObject['device-protocol'] = obj['device-protocol']; this.refernceScopeObj['sourceType'] = obj['scopeType']; + if(obj['scope']['vnfc-type-list'] != undefined && obj['scope']['vnfc-type-list'].length >0) { + this.referenceDataObject['vnfcIdentifier'] = obj['scope']['vnfc-type-list'][0]; + } } else { + console.log( this.classNm+": populateExistinAction: action not found"); this.resetForm(); this.referenceDataObject.action = data; } @@ -868,7 +1065,6 @@ export class ReferenceDataformComponent implements OnInit { case 'ConfigRestore': case 'StartApplication': case 'StopApplication': - case 'GetRunningConfig': case 'ConfigBackup': this.deviceProtocols = ['', 'CHEF', 'ANSIBLE']; break; @@ -878,6 +1074,9 @@ export class ReferenceDataformComponent implements OnInit { case 'ConfigScaleOut': this.deviceProtocols = ['', 'CHEF', 'ANSIBLE', 'NETCONF-XML', 'RESTCONF']; break; + case 'GetRunningConfig': + this.deviceProtocols = ['', 'CHEF', 'ANSIBLE', 'NETCONF-XML', 'RESTCONF', 'CLI', 'REST']; + break; default: this.deviceProtocols = ['', 'ANSIBLE', 'CHEF', 'NETCONF-XML', 'RESTCONF', 'CLI']; this.actionHealthCheck = false; @@ -885,55 +1084,87 @@ export class ReferenceDataformComponent implements OnInit { } //Modal pop up for action change with values entered. - actionChange(data, content, userForm) { + actionChange(data, userForm) { + var methName= "actionChange"; + console.log( this.classNm+": "+methName+": start: data:["+data+"]"); this.disableGrpNotationValue = false if (data == null) { + console.log( this.classNm+": "+methName+": data == null"); return; } if ((userForm.valid) && this.oldAction != '' && this.oldAction != undefined) { this.actionChanged = true; - this.modalService.open(content, { backdrop: 'static', keyboard: false }).result.then(res => { - if (res == 'yes') { - this.currentAction = this.referenceDataObject.action; - this.referenceDataObject.action = this.oldAction; - $('#saveToAppc').click();//make sure the save all is done before the tempall obj is saved form the API - this.toggleIdentifier(data) - this.oldAction = this.currentAction;// this.referenceDataObject.action + ''; - this.referenceDataObject.action = this.currentAction - - this.populateExistinAction(data); - if (this.oldAction === 'OpenStack Actions') { - - this.uploadedDataArray = []; - this.remUploadedDataArray = []; - this.firstArrayElement = []; - this.uploadFileName = ''; - //this.tempAllData = []; + console.log( this.classNm+": "+methName+ + ": userForm valid and oldAction defined"); + // Calling common Confirmation Modal + let disposable = this.dialogService.addDialog(ConfirmComponent) + .subscribe((isConfirmed)=>{ + //We get dialog result + console.log( this.classNm+": "+methName+": isConfirmed:["+ + isConfirmed+"]"); + if(isConfirmed) { + // User clicked on Yes + this.currentAction = this.referenceDataObject.action; + console.log( this.classNm+": "+methName+ + ": clicked on Yes: currentAction:["+this.currentAction+ + "] oldAction:["+this.oldAction+"]"); + this.referenceDataObject.action = this.oldAction; + $('#saveToAppc').click();//make sure the save all is done before the tempall obj is saved form the API + this.toggleIdentifier(data) + this.oldAction = this.currentAction;// this.referenceDataObject.action + ''; + this.referenceDataObject.action = this.currentAction; + this.populateExistinAction(data); + if (this.oldAction === 'OpenStack Actions') { + + this.uploadedDataArray = []; + this.remUploadedDataArray = []; + this.firstArrayElement = []; + this.uploadFileName = ''; + //this.tempAllData = []; + } + this.clearCache(); + this.refernceScopeObj.from = ''; + this.getArtifactsOpenStack(); + + // Clears VNFC Information data on action change + this.clearVnfcData() + this.resetVmsForScaleout(data); + } + else { + // User clicked on No + this.toggleIdentifier(data) + this.currentAction = this.referenceDataObject.action; + console.log( this.classNm+": "+methName+ + ": clicked on No: currentAction:["+this.currentAction+"]"); + this.populateExistinAction(data); + this.resetVmsForScaleout(data); + this.oldAction = this.referenceDataObject.action + ''; + this.clearCache(); + this.clearVnfcData() + this.refernceScopeObj.from = ''; } - this.clearCache(); - this.refernceScopeObj.from = ''; - this.getArtifactsOpenStack() - } else { - this.toggleIdentifier(data) - this.currentAction = this.referenceDataObject.action; - this.populateExistinAction(data); - this.resetVmsForScaleout(data); - this.oldAction = this.referenceDataObject.action + ''; - this.clearCache(); - this.clearVnfcData() - this.refernceScopeObj.from = ''; - } - // Enable or Block Template and PD Tabs - if (this.currentAction == 'ConfigScaleOut' && this.templateIdentifier) { - let referenceDataObjectTemp = this.referenceDataObject; - referenceDataObjectTemp['template-id'] = this.templateIdentifier; - this.buildDesignComponent.getRefData(referenceDataObjectTemp); - } else { - this.buildDesignComponent.getRefData(this.referenceDataObject); - } - }); + if (this.referenceDataObject.action === 'Configure' || this.referenceDataObject.action === 'ConfigModify') { + this.isConfigOrConfigModify = true; + } else { + this.isConfigOrConfigModify = false; + delete this.mappingEditorService.newObject['vnfc']; + } + + // Enable or Block Template and PD Tabs + if (this.currentAction == 'ConfigScaleOut' && this.templateIdentifier && this.templateIdentifier != '') { + // let referenceDataObjectTemp = this.referenceDataObject; + // referenceDataObjectTemp['template-id'] = this.templateIdentifier; + // this.buildDesignComponent.getRefData(referenceDataObjectTemp); + this.buildDesignComponent.getRefData({ ...this.referenceDataObject, displayVnfc: this.displayVnfc }, { reqField: this.templateIdentifier }); + + } else { + this.buildDesignComponent.getRefData({ ...this.referenceDataObject, displayVnfc: this.displayVnfc }); + } + }); } else { + console.log( this.classNm+": "+methName+ + ": userForm Not valid or oldAction not defined"); this.actionChanged = true; this.currentAction = this.referenceDataObject.action; this.oldAction = this.referenceDataObject.action + ''; @@ -943,17 +1174,19 @@ export class ReferenceDataformComponent implements OnInit { // Enable or Block Template and PD Tabs if (this.currentAction == 'ConfigScaleOut' && this.templateIdentifier) { - let referenceDataObjectTemp = this.referenceDataObject; - referenceDataObjectTemp['template-id'] = this.templateIdentifier; - this.buildDesignComponent.getRefData(referenceDataObjectTemp); + // let referenceDataObjectTemp = this.referenceDataObject; + // referenceDataObjectTemp['template-id'] = this.templateIdentifier; + // this.buildDesignComponent.getRefData(referenceDataObjectTemp); + this.buildDesignComponent.getRefData({ ...this.referenceDataObject, displayVnfc: this.displayVnfc }, { reqField: this.templateIdentifier }); } else { - this.buildDesignComponent.getRefData(this.referenceDataObject); + this.buildDesignComponent.getRefData({ ...this.referenceDataObject, displayVnfc: this.displayVnfc }); } } this.configDrp(data) } configDrp(data) { + console.log( this.classNm+": configDrp: start: data:["+data+"]"); if (data == 'ConfigScaleOut') { this.groupAnotationType = ['', 'first-vnfc-name', 'fixed-value', 'relative-value', 'existing-group-name']; } else { @@ -992,52 +1225,120 @@ export class ReferenceDataformComponent implements OnInit { } deviceProtocolChange() { + console.log( this.classNm+": deviceProtocolChange: start."); + if (this.referenceDataObject['device-protocol'] == 'REST') { + + } else { + delete this.referenceDataObject['context-url'] + } // Enable or Block Template and PD Tabs - this.buildDesignComponent.getRefData(this.referenceDataObject) + this.buildDesignComponent.getRefData( + {...this.referenceDataObject,displayVnfc: this.displayVnfc }, + {reqField: this.templateIdentifier}); } - // For the issue with multiple template changes - idChange(data, content, userForm) { + // used to call or trigger save object on template Identifier changes + idChange(data, userForm) { + console.log( this.classNm+": idChange: start: data:["+data+"]"); if (data == null) { return; } // Enable or Block Template and PD Tabs - let referenceDataObjectTemp = this.referenceDataObject; - referenceDataObjectTemp['template-id'] = data; - this.buildDesignComponent.getRefData(referenceDataObjectTemp); - - if ((userForm.valid) && this.oldtemplateIdentifier != '' && this.oldtemplateIdentifier != undefined) { + // let referenceDataObjectTemp = this.referenceDataObject; + // referenceDataObjectTemp['template-id'] = data; + // this.buildDesignComponent.getRefData(referenceDataObjectTemp); + this.buildDesignComponent.getRefData( + {...this.referenceDataObject, displayVnfc: this.displayVnfc }, + { reqField: data }); + + if ((userForm.valid)) { this.currentAction = "ConfigScaleOut" this.oldtemplateIdentifier = this.templateIdentifier let referenceObject = this.prepareReferenceObject(); this.actionChanged = true; if (this.templateIdentifier) { - this.modalService.open(content).result.then(res => { - if (res == 'yes') { - this.validateTempAllData(); - let theJSON = JSON.stringify(this.tempAllData, null, '\t'); - let fileName = 'reference_AllAction_' + referenceObject.scopeName + '_' + '0.0.1V.json'; - this.uploadArtifact(JSON.stringify({ reference_data: this.tempAllData }), this.tempAllData[this.tempAllData.length - 1], fileName); - var templateData = JSON.stringify(this.appData.template.templateData); - var nameValueData = JSON.stringify(this.appData.template.nameValueData); - var pdData = JSON.stringify(this.appData.pd); - if (templateData != '{}' && templateData != null && templateData != undefined) this.saveTemp(); - if (nameValueData != '{}' && nameValueData != null && nameValueData != undefined) this.saveNameValue(); - if (pdData != '{}' && pdData != null && pdData != undefined) this.savePd(); - this.clearCache(); - this.clearVnfcData() - this.refernceScopeObj.from = ''; - } - else { - this.clearCache(); - this.refernceScopeObj.from = ''; - } - }); + // Calling common Confirmation Modal + let disposable = this.dialogService.addDialog(ConfirmComponent) + .subscribe((isConfirmed)=>{ + //We get dialog result + if(isConfirmed) { + // User clicked on Yes + this.validateTempAllData(); + this.saveToAppc(); + this.clearCache(); + this.clearVnfcData(); + this.refernceScopeObj.from = ''; + } + else { + // User clicked on No + this.clearCache(); + this.refernceScopeObj.from = ''; + } + }); + } + } else { + this.oldtemplateIdentifier = this.templateIdentifier; + } + } + + // used to call or trigger save object on multiple VNFC's changes + vnfcChanged( data, userForm) { + console.log( this.classNm+": vnfcChanged: new vnfcIdentifier:["+data+"]"); + console.log( this.classNm+": vnfcChanged: oldVnfcIdentifier:["+ + this.oldVnfcIdentifier+"]"); + console.log(this.classNm+": vnfcChanged: scope.vnfc-type:["+ + this.referenceDataObject.scope['vnfc-type']+"]"); + this.vnfcIdentifier = data; + this.clearCache(); + if (data == null) { + return; + } + //.. populate VNFC Type in Sample field + this.setVnfcTypeInSample( this.vnfcIdentifier ); + // Enable or Block Template and PD Tabs + let referenceDataObjectTemp = this.referenceDataObject; + referenceDataObjectTemp['vnfcIdentifier'] = data; + console.log( this.classNm+ + ": vnfcChanged: displayVnfc:["+this.displayVnfc+"]"); + this.buildDesignComponent.getRefData( + {...this.referenceDataObject, displayVnfc: this.displayVnfc }, + { reqField: data }); + console.log( this.classNm+ + ": vnfcChanged: userForm.valid:["+userForm.valid+"]"); + if ((userForm.valid) && this.oldVnfcIdentifier != '' && this.oldVnfcIdentifier != undefined) { + this.currentAction = this.referenceDataObject.action + this.oldVnfcIdentifier = this.vnfcIdentifier + let referenceObject = this.prepareReferenceObject(); + this.actionChanged = true; + if (this.vnfcIdentifier) { + // Calling common Confirmation Modal + let disposable = this.dialogService.addDialog(ConfirmComponent) + .subscribe((isConfirmed)=>{ + //We get dialog result + if(isConfirmed) { + // User clicked on Yes + this.validateTempAllData(); + this.saveToAppc(); + this.clearCache(); + this.clearVnfcData() + this.refernceScopeObj.from = ''; + } + else { + // User clicked on No + this.clearCache(); + this.refernceScopeObj.from = ''; + } + }); + } + } else { + if (data != null) { + this.oldVnfcIdentifier = this.vnfcIdentifier } } } clearCache() { + console.log( this.classNm+": clearCache: start."); // get the value and save the userid and persist it. this.clearTemplateCache(); this.clearPdCache(); @@ -1059,6 +1360,7 @@ export class ReferenceDataformComponent implements OnInit { } saveTemp() { + console.log( this.classNm+": saveTemp: start."); this .httpUtils .post( @@ -1076,6 +1378,7 @@ export class ReferenceDataformComponent implements OnInit { } saveNameValue() { + console.log( this.classNm+": saveNameValue: start."); this .httpUtils .post( @@ -1118,6 +1421,7 @@ export class ReferenceDataformComponent implements OnInit { } openModel(toShow: any, message: any, title: any) { + console.log( this.classNm+": openModel: start: title:["+title+"]"); this.modalComponent.isShow = toShow; this.modalComponent.message = message; this.modalComponent.title = title; @@ -1142,9 +1446,42 @@ export class ReferenceDataformComponent implements OnInit { if (!(this.referenceDataObject['template-id-list'].indexOf(this.templateId.trim()) > -1)) { this.referenceDataObject['template-id-list'].push(this.templateId.trim()); } + // Changing value to blank otherwise it will show previous value in text box of popup + this.templateId = ''; + } + + // adds the vnfc to the vnfc dropdown list + addVnfc() { + var newVnfcTypeV= this.newVnfcType.trim(); + console.log(this.classNm+ + ": addVnfc: start: newVnfcTypeV:["+newVnfcTypeV+"]"); + if (!(this.referenceDataObject.scope['vnfc-type-list'])) { + this.referenceDataObject.scope['vnfc-type-list'] = []; + // this.vnfcIdentifier = newVnfcTypeV; + } else if (this.referenceDataObject.scope['vnfc-type-list'].length == 0){ + // this.vnfcIdentifier = newVnfcTypeV; + } + this.vnfcIdentifier = newVnfcTypeV; + console.log(this.classNm+ + ": addVnfc: vnfcIdentifier:["+this.vnfcIdentifier+"]"); + if (!(this.referenceDataObject.scope['vnfc-type-list'].indexOf(newVnfcTypeV) > -1)) { + this.referenceDataObject.scope['vnfc-type-list'].push(newVnfcTypeV); + } + this.tempAllData.forEach(obj => { + if (obj.action == "Configure" || obj.action == "ConfigModify") { + obj.scope['vnfc-type-list'] = this.referenceDataObject.scope['vnfc-type-list'] + } + this.resetArtifactList(obj); + }); + console.log(this.classNm+": addVnfc: scope vnfc-type:["+ + this.referenceDataObject.scope['vnfc-type']+"]"); + this.setVnfcTypeInSample( newVnfcTypeV ); + // Changing newVnfcType value to blank otherwise it will show previous value in text box of popup + this.newVnfcType = '' } resetVms() { + console.log( this.classNm+": resetVms: start."); this.referenceDataObject.vm = []; } @@ -1178,6 +1515,9 @@ export class ReferenceDataformComponent implements OnInit { } resetParamsOnVnfcType() { + console.log( this.classNm+": resetParamsOnVnfcType: start:\n "+ + "ref.DataObject.scope vnfc-type:["+ + this.referenceDataObject.scope['vnfc-type']+"]"); let scopeName = ''; //if only vnf is there if (this.referenceDataObject.scope['vnfc-type'] == '' || this.referenceDataObject.scope['vnfc-type'] == null || this.referenceDataObject.scope['vnfc-type'] == 'null') { @@ -1201,8 +1541,11 @@ export class ReferenceDataformComponent implements OnInit { if (scopeName) { scopeName = scopeName.replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, ''); } + console.log( this.classNm+": resetParamsOnVnfcType: return scopeName:["+ + scopeName+"]"); return scopeName } + decideExtension(obj) { //marking the extension based on the device-protocol selected by the user let extension = '.json'; @@ -1220,6 +1563,8 @@ export class ReferenceDataformComponent implements OnInit { return extension; } prepareArtifactList(scopeName, extension) { + console.log( this.classNm+": prepareArtifactList: start: scopeName:["+ + scopeName+"] extension:["+extension+"]"); this.referenceDataObject['artifact-list'] = []; //preparing the artifact list array file names along with extension let config_template_fileName = this.referenceDataObject.action + '_' + scopeName + '_' + '0.0.1V.' + extension; @@ -1280,6 +1625,18 @@ export class ReferenceDataformComponent implements OnInit { return newObj } pushOrReplaceTempData(newObj, action) { + console.log( this.classNm+": pushOrReplaceTempData: start: action:["+ + action+"]\n newObj.scope vnfc-type:["+newObj.scope['vnfc-type']+"]"); + if( newObj.scope['vnfc-type'] == undefined || + newObj.scope['vnfc-type'] == null || + newObj.scope['vnfc-type'].length < 1 ) + { + console.log( this.classNm+": pushOrReplaceTempData: scope vnfc-type"+ + " is empty.\n vnfcIdentifier:["+this.vnfcIdentifier+"]"); + if( this.vnfcIdentifier.length > 0 ) { + newObj.scope['vnfc-type']= this.vnfcIdentifier; + } + }; let actionObjIndex = this.tempAllData.findIndex(obj => { return obj['action'] == action; }); @@ -1313,7 +1670,26 @@ export class ReferenceDataformComponent implements OnInit { } + // removes the unwanted keys added in the artifact for vnfc level actions + deleteUnwantedKeys(newObj) { + console.log( this.classNm+": deleteUnwantedKeys: start."); + newObj = JSON.parse(JSON.stringify(newObj)) + delete newObj['template-id'] + delete newObj['vnfcIdentifier'] + if (newObj.action != "ConfigScaleOut") { + delete newObj['template-id-list'] + } + if (newObj.action != 'HealthCheck') { + delete newObj['url']; + } + if (newObj.action != "Configure" && newObj.action != "ConfigModify") { + newObj.scope['vnfc-type-list'] = []; + } + return newObj + } + addAllActionObj(newObj, scopeName) { + console.log( this.classNm+": addAllActionObj: start."); //Creating all action block to allow mulitple actions at once let allAction = { action: 'AllAction', @@ -1335,6 +1711,7 @@ export class ReferenceDataformComponent implements OnInit { } resetTempData() { + console.log( this.classNm+": resetTempData: start."); if (this.uploadedDataArray && this.uploadedDataArray != undefined && this.uploadedDataArray.length != 0) { if (this.tempAllData && this.tempAllData != undefined) { for (var i = 0; i < this.tempAllData.length; i++) { @@ -1359,7 +1736,10 @@ export class ReferenceDataformComponent implements OnInit { trackByFn(index, item) { return index; } + getArtifactsOpenStack() { + console.log( this.classNm+": getArtifactsOpenStack: start: "+ + "tempAllData length="+this.tempAllData.length ); var array = [] var vnfcFunctionCodeArrayList = []; var vnfcSetArray=[]; @@ -1373,7 +1753,8 @@ export class ReferenceDataformComponent implements OnInit { vnfcSetArray=this.tempAllData[i]['firstRowVmSpreadSheet'] } } - + console.log( this.classNm+": getArtifactsOpenStack: vnfcSetArray length="+ + vnfcSetArray.length ); if(vnfcSetArray) { let vnfcSetArrayLen = vnfcSetArray.length; @@ -1396,4 +1777,108 @@ export class ReferenceDataformComponent implements OnInit { this.remUploadedDataArray = vnfcFunctionCodeArrayList; } } + + /** + * Handles the display of VM block based on the action change + */ + handleVMBlockDisplay() { + switch (this.referenceDataObject.action) { + case this.actionList.ConfigScaleOut: + case this.actionList.Configure: + case undefined: + case '': + this.displayVMBlock = true; + break; + default: + this.displayVMBlock = false; + } + } + + //.. check VNFC Type equality in Upper Selection vs entered in Sample field + checkVnfcTypeEqual( vnfctp: string ) { + var methName= "checkVnfcTypeEqual"; + console.log(this.classNm+": "+methName+": vnfctp:["+vnfctp+"]"); + console.log( this.classNm+": "+methName+": vnfcIdentifier:["+ + this.vnfcIdentifier+"]"); + console.log( this.classNm+": "+methName+": Sample[vnfc-type]:["+ + this.Sample['vnfc-type']+"]"); + if( vnfctp != null && vnfctp.length > 0 ) { + if( this.vnfcIdentifier != null && this.vnfcIdentifier.length > 0 ) { + console.log( + this.classNm+": "+methName+": compare non empty VNFC Types..."); + if( vnfctp != this.vnfcIdentifier ) { + console.log( this.classNm+": "+methName+": Non-match WARNING !"); + //.. display in pop-up + this.nService.warn( 'WARNING', + "The specified VNFC Types don't match."+ + " Can cause discrepancy in the artifacts.", this.options ); + } else { + console.log(this.classNm+": checkVnfcTypeEqual: VNFC Types're equal."); + }; + }; + }; + }; + + //.. populating VNFC Type in Sample fields + setVnfcTypeInSample( vnfctp: string ) { + // if( this.utilityService.getTracelvl() > 0 ) + console.log( this.classNm+": setVnfcTypeInSample: vnfctp:["+vnfctp+"]"); + this.Sample['vnfc-type']= vnfctp; + }; + + // Common method to show validation errors + private showValidationErrors(referenceDataObject) { + if (this.referenceDataObject.action === '') { + this.nService.error('Error', 'Select a valid Action'); + return; + } + if (this.referenceDataObject['device-protocol'] === '') { + this.nService.error('Error', 'Select a valid Device protocol'); + return; + } + + if (referenceDataObject.action === 'ConfigScaleOut' && !this.templateIdentifier) { + this.nService.error('Error', 'Select a valid Template Identifier'); + } + } + + resetArtifactList( obj) { + console.log( this.classNm+": resetArtifactList: start..."); + let vnfcTypeList = obj.scope['vnfc-type-list']; + let vnf = this.referenceDataObject.scope['vnf-type'] + let pd_fileName + let config_template_fileName + let configTemplate + let pdTemplate + let paramValue + let param_fileName + obj['artifact-list'] = []; + for (var x = 0; x < vnfcTypeList.length; x++) { + let extension = this.referenceDataFormUtil.decideExtension(obj) + //for replacing spaces and "/" with "_" + let type = vnfcTypeList[x].replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, ''); + pd_fileName = this.referenceDataObject.action + '_' + vnf.replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, '') + '_' + type + '_' + '0.0.1V.yaml'; + config_template_fileName = this.referenceDataObject.action + '_' + vnf.replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, '') + '_' + type + '_' + '0.0.1V' + extension; + param_fileName = this.referenceDataObject.action + '_' + vnf.replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, '') + '_' + type + '_' + '0.0.1V.json'; + configTemplate = { + 'artifact-name': 'template_' + config_template_fileName, + 'artifact-type': 'config_template' + }; + pdTemplate = { + 'artifact-name': 'pd_' + pd_fileName, + 'artifact-type': 'parameter_definitions' + }; + paramValue = { + 'artifact-name': 'param_' + param_fileName, + 'artifact-type': 'param_values' + }; + + this.referenceDataObject['artifact-list'].push(configTemplate, + pdTemplate, paramValue + ); + obj['artifact-list'].push(configTemplate, + pdTemplate, paramValue + ); + } + } } diff --git a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.util.ts b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.util.ts new file mode 100644 index 0000000..00e014c --- /dev/null +++ b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.util.ts @@ -0,0 +1,169 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018 AT&T Intellectual Property. All rights reserved. +=================================================================== +Copyright (C) 2018 IBM. +=================================================================== +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + +import { Injectable } from '@angular/core'; +import { NotificationsService } from 'angular2-notifications'; +import {Observable} from 'rxjs'; +import {UtilityService} from '../../../shared/services/utilityService/utility.service'; +import { environment } from '../../../../environments/environment'; +import { HttpUtilService } from '../../../shared/services/httpUtil/http-util.service'; +//import {APIService} from "../../../shared/services/cdt.apicall"; + +@Injectable() +export class ReferenceDataFormUtil { + + private successMessage = 'Retrieved artifact successfully'; + private failureMessage = 'There is no artifact saved in APPC for the selected action!'; + private response: Observable<Object>; + + constructor( + private notificationService: NotificationsService, private utilityService:UtilityService, private httpUtils: HttpUtilService + ) { + } + + checkResult(result: any) { + + if (result.output.status.code == '401') { + this.notificationService.info('Information', this.failureMessage); + return false; + } + else if (result.output.status.code == '400') { + this.notificationService.success('Success', this.successMessage); + return true; + } + + } + + // utility to add the slashes to the payload + appendSlashes(artifactData) { + return artifactData.replace(/"/g, '\\"'); + } + + public nullCheckForVnfcType(object: any) { + if (object == undefined || object == 'null' || object == false) { + return true; + } + + } + + public nullCheckForVnfcTypeList(object: any) { + if (object == undefined || object == null || object.length == 0) { + return true; + } + + } + + //used for forming the file exension + decideExtension(obj) { + //marking the extension based on the device-protocol selected by the user + let extension = '.json'; + switch (obj['device-protocol']) { + case 'ANSIBLE': + case 'CHEF': + case 'CLI': + extension = '.json'; + break; + case 'NETCONF-XML': + case 'REST': + extension = '.xml'; + break; + } + return extension; + } + + + + createArtifactName(action, vnf, type, extension) { + if (type) + return action + '_' + vnf.replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, '') + '_' + type + '_' + '0.0.1V' + extension; + else + return action + '_' + vnf.replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, '') + '_' + '0.0.1V' + extension; + } + + createArtifactNameForIdentifiers(action, vnf, type, extension) + { + return action + '_' + vnf.replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, '') + '_' + '0.0.1V_' + type + extension; + } + + + createConfigTemplate(config_template_fileName) { + var template= { + 'artifact-name': 'template_' + config_template_fileName, + 'artifact-type': 'config_template' + }; + + return template; + } + + createConfigTemplateForPushReplaceData(config_template_fileName) { + var template= { + 'template_artifact': 'template_' + config_template_fileName, + }; + + return template; + } + + createPdTemplate(pd_fileName) { + var pd= { + 'artifact-name': 'pd_' + pd_fileName, + 'artifact-type': 'parameter_definitions' + }; + + return pd; + } + + createPdTemplateForPushReplaceData(pd_fileName) { + var pd= { + 'pd_artifact': 'pd_' + pd_fileName, + }; + + return pd; + } + + createParamValue(param_fileName) { + var paramValue= { + 'artifact-name': 'param_' + param_fileName, + 'artifact-type': 'param_values' + }; + return paramValue; + } + + createParamValueForPushReplaceData(param_fileName) { + var paramValue= { + 'param_artifact': 'param_' + param_fileName, + }; + return paramValue; + } + + handleApiData(payloadData,artifactType) + { + this.response = + this.httpUtils.post({ + url: environment.getDesigns, + data: payloadData }); + this.response.subscribe( response => { + this.utilityService.processApiSubscribe(response, this.utilityService.putAction, artifactType) + }, + error => this.utilityService.processApiError()); + } + +} diff --git a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html index e505b59..26cbf27 100644 --- a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html +++ b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html @@ -69,9 +69,14 @@ ECOMP is a trademark and service mark of AT&T Intellectual Property. <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> <label>Vnf Type</label><input class="form-control" type="text" disabled value="{{vnfType}}" /> </div> - <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> + <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf=" +vnfcType" +> <label>Vnfc Type</label><input class="form-control" type="text" disabled value="{{vnfcType}}" /> </div> + <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="!vnfcType"> + + </div> <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> <label>Protocol</label><input class="form-control" type="text" disabled value="{{protocol}}" /> </div> @@ -109,8 +114,8 @@ ECOMP is a trademark and service mark of AT&T Intellectual Property. <div class="mdl-card__title-text">Param Name Value List</div> <div><font size="1">(Please click anywhere on the editor to see the synced name value pairs)</font></div> </label> - <ace-editor [(text)]="this.artifactRequest.paramsContent" #templateeditor [theme]="'chrome'" [mode]="'velocity'" (textChanged)="onParamChanges($event)" [options]="{maxLines: 'Infinity', fontSize: '13pt' }" style="min-height: 500px; width: 100%"></ace-editor> + <ace-editor [(text)]="this.artifactRequest.paramsContent" #templateeditor [theme]="'chrome'" [mode]="'velocity'" (textChanged)="onParamChanges($event)" [options]="{maxLines: '100', fontSize: '13pt' }" style="min-height: 200px; width: 100%"></ace-editor> </div> </tab> -</tabs>
\ No newline at end of file +</tabs> diff --git a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html index 65f3b6a..105f0ec 100644 --- a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html +++ b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html @@ -41,9 +41,12 @@ limitations under the License. <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> <label>Vnf Type</label><input class="form-control" type="text" disabled value="{{vnfType}}" /> </div> - <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> + <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="vnfcType"> <label>Vnfc Type</label><input class="form-control" type="text" disabled value="{{vnfcType}}" /> </div> + <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="!vnfcType"> + + </div> <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12"> <label>Protocol</label><input class="form-control" type="text" disabled value="{{protocol}}" /> </div> @@ -78,7 +81,7 @@ limitations under the License. <div><label for="textAreaGeneratedTemplate"> <div class="mdl-card__title-text">File Editor</div> </label> - <ace-editor [(text)]="configMappingEditorContent" #templateeditor [theme]="'chrome'" [mode]="'velocity'" [options]="{maxLines: 'Infinity', fontSize: '13pt' }" style="min-height: 500px; width: 100%"></ace-editor> + <ace-editor [(text)]="configMappingEditorContent" #templateeditor [theme]="'chrome'" [mode]="'velocity'" [options]="{maxLines: '100', fontSize: '13pt' }" style="min-height: 200px; width: 100%; caret-color: white "></ace-editor> </div> <app-modal [title]="'Confirmation'" [isShow]="false" [message]="'Template is saved and ready for creating parameter definition'" #modalComponent> </app-modal> @@ -106,4 +109,4 @@ limitations under the License. " (click)="modal.close()">Cancel</button> </modal-footer> - </modal>
\ No newline at end of file + </modal> diff --git a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts index 6cae746..0be5f68 100644 --- a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts +++ b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts @@ -45,6 +45,7 @@ const PARAM_DATA:string="param_data"; const TEMPLATE_DATA:string="template_data"; @Component({ selector: 'app-golden-configuration', templateUrl: './template-configuration.component.html', styleUrls: ['./template-configuration.component.css'] }) export class GoldenConfigurationComponent implements OnInit { + clName= "TemplateConfigCompon"; @ViewChild('templateeditor') templateeditor; @Input() configMappingEditorContent: string; @Input() isMappingComp: boolean; @@ -154,7 +155,13 @@ export class GoldenConfigurationComponent implements OnInit { //======================================Start of ngOnInit() Method============================================ ngOnInit() { + var methName= "ngOnInit"; + if( this.utilityService.getTracelvl() > 0 ) + console.log( this.clName+": "+methName+": start."); var refObj = this.refObj = this.prepareFileName(); + if( this.utilityService.getTracelvl() > 0 ) + console.log( this.clName+": "+methName+ + ": refObj:["+JSON.stringify(refObj)+"]"); if (refObj && refObj != undefined) { this.item = refObj; @@ -162,6 +169,10 @@ export class GoldenConfigurationComponent implements OnInit { this.vnfcType = this.item.scope["vnfc-type"]; this.protocol = this.item['device-protocol']; this.action = this.item.action; + if( this.utilityService.getTracelvl() > 0 ) + console.log( this.clName+": "+methName+": vnfType:["+this.vnfType+ + "] vnfcType:["+this.vnfcType+"] protocol:["+this.protocol+"] action:["+ + this.action+"]"); this.artifactRequest.action = this.item.action; this.artifactRequest.vnfType = this.vnfType; if (this.vnfcType != undefined && this.vnfcType.length != 0) { diff --git a/src/app/vnfs/myvnfs/myvnfs.component.html b/src/app/vnfs/myvnfs/myvnfs.component.html index 3ce7859..3bfabc3 100644 --- a/src/app/vnfs/myvnfs/myvnfs.component.html +++ b/src/app/vnfs/myvnfs/myvnfs.component.html @@ -84,13 +84,13 @@ limitations under the License. </div> </div> <div class="col-lg-12-ln2"> - <button type="button" (click)="buildNewDesign(content)" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">Create New - VNF Type or VNFC Type + <button type="button" (click)="createVnfcModal.open()" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary"> + Create New VNF Type </button> </div> </div> -<ng-template #content let-c="close" let-d="dismiss"> +<!-- <ng-template #content let-c="close" let-d="dismiss"> <form ngNativeValidate (ngSubmit)="c('yes')"> <div class="modal-header"> <h4 class="modal-title">Enter VNF type and VNFC to proceed</h4> @@ -130,4 +130,38 @@ limitations under the License. </div> </form> -</ng-template>
\ No newline at end of file +</ng-template> --> + +<!-- Modal for Create new Vnf --> +<modal #createVnfcModal> + <form ngNativeValidate (ngSubmit)="buildNewDesign('yes')"> + <modal-header [show-close]="true"> + <h4 class="modal-title">Enter VNF Type</h4> + </modal-header> + <modal-body> + <div class="form-group row"> + <label for="example-text-input" class="col-12 col-form-label">Enter Vnf Type</label> + <div class="col-12"> + <input pattern=".*[^ ].*" required name="vnfType" class="form-control" (ngModelChange)="validateVnfName($event)" [(ngModel)]="vnfType" type="text" id="vnfType"> + <span class="error-message">{{errorMessage}}</span> + </div> + + </div> + <div class="form-check"> + <label class="form-check-label"> + <input name="vnfcRequired" class="form-check-input" [(ngModel)]="vnfcRequired" type="checkbox" + id="vnfcRequired"> + This VNF has VNFC templates + </label> + </div> + </modal-body> + <modal-footer [show-default-buttons]="false"> + <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" (click)="buildNewDesign('no')"> + Proceed To Upload + </button> + <button type="submit" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" [disabled]="invalid"> + Next + </button> + </modal-footer> + </form> +</modal> diff --git a/src/app/vnfs/myvnfs/myvnfs.component.ts b/src/app/vnfs/myvnfs/myvnfs.component.ts index d3bfc24..a124705 100644 --- a/src/app/vnfs/myvnfs/myvnfs.component.ts +++ b/src/app/vnfs/myvnfs/myvnfs.component.ts @@ -43,6 +43,9 @@ export class MyvnfsComponent implements OnInit, OnDestroy { noDataMsg: string; vnfType: any; vnfcType: any; + vnfcRequired: boolean = false; + errorMessage = ''; + invalid = true; options = { timeOut: 1000, showProgressBar: true, @@ -84,32 +87,31 @@ export class MyvnfsComponent implements OnInit, OnDestroy { } getArtifacts(data) { + let tempObj: any; this.ngProgress.start(); - this.subscription = this.httpUtil.post({ + //this.subscription = this.httpUtil.post({ + this.httpUtil.post({ url: environment.getDesigns, data: data }) - .subscribe(resp => { - console.log("resp:", resp); - const tempObj = JSON.parse(resp.output.data.block); - this.vnfData = tempObj.designInfo; + .subscribe( resp => { + if (resp.output.data.block !== undefined && resp.output.data.block !== null && resp.output.data.block.length !== 0) { + console.log("getArtifacts: resp:", resp.output.data.block); + tempObj = JSON.parse(resp.output.data.block); + this.vnfData = tempObj.designInfo; + } if (this.vnfData == undefined || this.vnfData == null || this.vnfData.length == 0) { this.noData = true; - - this.noDataMsg = resp.output.data.status.message; + // this.noDataMsg = resp.output.data.status.message; } else { this.noData = false; } - console.log(this.noData); + console.log("getArtifacts: noData:"+this.noData); this.ngProgress.done(); - } - , - error => { - - this.nService.error(appConstants.errors.error, appConstants.errors.connectionError) - } - - ); + }, + error => { + this.nService.error(appConstants.errors.error, appConstants.errors.connectionError) + }); this.filter = ['vnf-type', 'vnfc-type', 'artifact-name']; setTimeout(() => { @@ -122,25 +124,56 @@ export class MyvnfsComponent implements OnInit, OnDestroy { getData() { } - buildNewDesign(content) { - - this.modalService.open(content).result.then(res => { - this.mappingEditorService.referenceNameObjects = undefined; - sessionStorage.setItem('vnfParams', JSON.stringify({ vnfType: this.vnfType, vnfcType: this.vnfcType })); - this - .router - .navigate([ - 'vnfs', 'design', 'references' - ]); - }); + buildNewDesign( response) { + // this.modalService.open(content).result.then(res => { + // this.mappingEditorService.referenceNameObjects = undefined; + // sessionStorage.setItem('vnfParams', JSON.stringify({ vnfType: this.vnfType, vnfcType: this.vnfcType })); + // this.router.navigate([ + // 'vnfs', 'design', 'references' + // ]); + // }); + if (response == 'yes') { + sessionStorage.setItem('vnfParams', JSON.stringify({ vnfType: this.vnfType })); + sessionStorage.setItem("vnfcSelectionFlag", '' + this.vnfcRequired + '') + } else { + sessionStorage.setItem('vnfParams', "") + } + this.mappingEditorService.referenceNameObjects = undefined; + this.mappingEditorService.identifier = ''; + //this.mappingEditorService.newObject = {}; + this.router.navigate([ + 'vnfs', 'design', 'references' + ]); + } + validateVnfName(name) { + if (!name.trim() || name.length < 1) { + this.errorMessage = ''; + this.invalid = true; + } else if (name.startsWith(' ') || name.endsWith(' ')) { + this.errorMessage = 'Leading and trailing spaces are not allowed'; + this.invalid = true; + } else if (name.includes(' ')) { + this.errorMessage = 'More than one space is not allowed in VNF Type'; + this.invalid = true; + } else if (name.length > 150) { + this.errorMessage = 'VNF Type should be of minimum one character and maximum 150 character'; + this.invalid = true; + } else { + this.invalid = false; + this.errorMessage = ''; + } } navigateToReference(item) { sessionStorage.setItem('updateParams', JSON.stringify(item)); this.mappingEditorService.referenceNameObjects = undefined; - + sessionStorage.setItem('vnfParams', JSON.stringify({ vnfType: item.vnfType, vnfcType: item.vnfcType })); + this.mappingEditorService.identifier = ''; + if (this.mappingEditorService.newObject && this.mappingEditorService.newObject.vnfc != undefined) { + this.mappingEditorService.newObject.vnfc = ''; + } this .router .navigate(['../design/references'], { @@ -165,7 +198,7 @@ export class MyvnfsComponent implements OnInit, OnDestroy { clearCache() { // get the value and save the userid and persist it. - + sessionStorage.setItem("vnfcSelectionFlag", '' + this.vnfcRequired + ''); this.mappingEditorService.setTemplateMappingDataFromStore(undefined); localStorage['paramsContent'] = '{}'; this.mappingEditorService.setParamContent(undefined); @@ -179,6 +212,4 @@ export class MyvnfsComponent implements OnInit, OnDestroy { this.mappingEditorService.changeNavAppData(appData); this.mappingEditorService.changeNavDownloadData(downloadData); } - - -}
\ No newline at end of file +} |