diff options
Diffstat (limited to 'src/app/vnfs/myvnfs')
| -rw-r--r-- | src/app/vnfs/myvnfs/myvnfs.component.html | 42 | ||||
| -rw-r--r-- | src/app/vnfs/myvnfs/myvnfs.component.ts | 95 |
2 files changed, 101 insertions, 36 deletions
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 +} |