diff options
Diffstat (limited to 'src/app/vnfs/myvnfs')
-rw-r--r-- | src/app/vnfs/myvnfs/myvnfs.component.css | 35 | ||||
-rw-r--r-- | src/app/vnfs/myvnfs/myvnfs.component.html | 132 | ||||
-rw-r--r-- | src/app/vnfs/myvnfs/myvnfs.component.spec.ts | 168 | ||||
-rw-r--r-- | src/app/vnfs/myvnfs/myvnfs.component.ts | 163 |
4 files changed, 498 insertions, 0 deletions
diff --git a/src/app/vnfs/myvnfs/myvnfs.component.css b/src/app/vnfs/myvnfs/myvnfs.component.css new file mode 100644 index 0000000..c1b1169 --- /dev/null +++ b/src/app/vnfs/myvnfs/myvnfs.component.css @@ -0,0 +1,35 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018 AT&T Intellectual Property. All rights reserved. +=================================================================== + +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. + +ECOMP is a trademark and service mark of AT&T Intellectual Property. +============LICENSE_END============================================ +*/ + +.build-button { + padding: 11px; + font-size: 20px; + color: green; + border: 1PX SOLID GREEN; + MARGIN-BOTTOM: 40PX +} + +table.table th, +table.table td { + padding: 0rem; +}
\ No newline at end of file diff --git a/src/app/vnfs/myvnfs/myvnfs.component.html b/src/app/vnfs/myvnfs/myvnfs.component.html new file mode 100644 index 0000000..c214a2c --- /dev/null +++ b/src/app/vnfs/myvnfs/myvnfs.component.html @@ -0,0 +1,132 @@ +<!-- +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018 AT&T Intellectual Property. All rights reserved. +=================================================================== + +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. + +ECOMP is a trademark and service mark of AT&T Intellectual Property. +============LICENSE_END============================================ +--> +<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'" [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress> +<div class="container"> + <div *ngIf="noData != true"> + <div class="row"> + <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> + + </div> + <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3"> + <input placeholder="filter table" class="form-control" type="text" [(ngModel)]="filterQuery" /> + </div> + </div> + <div class="row"> + <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> + <div class="table-responsive" style="height:auto; overflow: auto;"> + <table class="table"> + <thead> + <tr> + <th>VNF TYPE <i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='vnf-type'" aria-hidden="true"></i></th> + <th>VNFC TYPE<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='vnfc-type'" aria-hidden="true"></i></th> + <!-- <th>INCART<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='subscriber'" aria-hidden="true"></i></th> --> + <!-- <th>PROTOCOL<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='protocol'" aria-hidden="true"></i></th> + <th>ACTION<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='action'" aria-hidden="true"></i></th> --> + <th>ARTIFACT NAME<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='artifact-name'" aria-hidden="true"></i></th> + <!-- <th>ARTIFACT TYPE<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='artifact-type'" + aria-hidden="true"></i></th> --> + <th></th> + </tr> + </thead> + + <tbody style="padding: 15px 25px"> + <tr *ngFor="let item of vnfData | orderBy:sortBy:sortOrder | tableFilter:filterQuery:filter"> + <td>{{item['vnf-type']}}</td> + <td>{{item['vnfc-type']}}</td> + <!-- <td>{{item.incart}}</td> --> + <!-- <td>{{item.protocol}}</td> + <td>{{item.action}}</td> --> + <td>{{item['artifact-name']}}</td> + <!-- <td>{{item['artifact-type']}}</td> --> + <td> + <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="navigateToReference(item)"><i class="fa fa-edit" + aria-hidden="true"></i> View/Edit + </button> + </td> + </tr> + </tbody> + </table> + </div> + </div> + </div> + </div> + <div *ngIf="noData == true" class="text-center"> + <div class="card"> + <div class="mdl-dialog__content"> + <div class="mdl-card__title"> + <h2 class="mdl-card__title-text">You don't have any Artifacts</h2> + </div> + <div class="mdl-card__supporting-text"> + {{noDataMsg}} + </div> + </div> + </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> + </div> +</div> + +<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> + <button type="button" class="close" aria-label="Close" (click)="d('Cross click')"> + <span aria-hidden="true">×</span> + </button> + </div> + <div class="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 required name="vnfType" class="form-control" [(ngModel)]="vnfType" type="text" id="vnfType"> + </div> + </div> + <div class="form-check"> + <label class="form-check-label"> + <input name="vnfcRequired" class="form-check-input" [(ngModel)]="vnfcRequired" type="checkbox" + id="vnfcRequired"> + Enter vnfc info + </label> + </div> + <div class="form-group row" *ngIf="vnfcRequired"> + <label for="example-search-input" class="col-12 col-form-label">Enter Vnfc Type</label> + <div class="col-12"> + <input required name="vnfcType" class="form-control" [(ngModel)]="vnfcType" type="text" id="vnfcType"> + </div> + </div> + </div> + <div class="modal-footer"> + <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent + + " (click)="c('yes')">Proceed anyway + </button> + <button type="submit" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">Next + </button> + + </div> + </form> +</ng-template>
\ No newline at end of file diff --git a/src/app/vnfs/myvnfs/myvnfs.component.spec.ts b/src/app/vnfs/myvnfs/myvnfs.component.spec.ts new file mode 100644 index 0000000..5e0c51f --- /dev/null +++ b/src/app/vnfs/myvnfs/myvnfs.component.spec.ts @@ -0,0 +1,168 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018 AT&T Intellectual Property. All rights reserved. +=================================================================== + +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. + +ECOMP is a trademark and service mark of AT&T Intellectual Property. +============LICENSE_END============================================ +*/ + +/* tslint:disable:no-unused-variable */ +import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing'; +import { NO_ERRORS_SCHEMA, Output } from '@angular/core'; +import { MyvnfsComponent } from './myvnfs.component'; +import { FormsModule } from '@angular/forms'; +import { NotificationService } from './../../shared/services/notification.service'; +import { ParamShareService } from './../../shared/services/paramShare.service'; +import { MappingEditorService } from './../../shared/services/mapping-editor.service'; +import { DialogService } from 'ng2-bootstrap-modal'; +import { RouterTestingModule } from '@angular/router/testing'; +import { HttpUtilService } from '.././../shared/services/httpUtil/http-util.service'; +import { UtilityService } from '.././../shared/services/utilityService/utility.service'; +// import{TableFilterPipe} from '.././../shared/modules/tidy-table/table-filter.pipe'; +import { TidyTableModule } from '../../shared/modules/tidy-table/tidy-table.module'; +import { NgModule } from '@angular/core'; +import { NgProgress } from 'ngx-progressbar'; + +import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; +import { + HttpModule, + Http, + Response, + ResponseOptions, + XHRBackend +} from '@angular/http'; + +import { MockBackend } from '@angular/http/testing'; +describe('MyvnfsComponent', () => { + let component: MyvnfsComponent; + let fixture: ComponentFixture<MyvnfsComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [MyvnfsComponent], + schemas: [NO_ERRORS_SCHEMA], + imports: [FormsModule, RouterTestingModule, TidyTableModule, HttpModule, NgbModule.forRoot()], + providers: [ + + { provide: XHRBackend, useClass: MockBackend }, + NgProgress, UtilityService, ParamShareService, DialogService, NotificationService, HttpUtilService, MappingEditorService] + + }) + .compileComponents(); + })); + + beforeEach(() => { + + fixture = TestBed.createComponent(MyvnfsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create myvnfscomponent', () => { + expect(component).toBeTruthy(); + }); + it('Post call to get artifact', inject([HttpUtilService, XHRBackend], (httpUtilService, mockBackend) => { + + const mockResponse = { + "output": { + "data": { + "block": "{\"userID\":\"ug0221\",\"designInfo\":[{\"vnf-type\":\"demo123\",\"vnfc-type\":\"null\",\"protocol\":\"\",\"incart\":\"N\",\"action\":\"AllAction\",\"artifact-name\":\"reference_AllAction_demo123_0.0.1V.json\",\"artifact-type\":\"APPC-CONFIG\"}],\"statusInfo\":null,\"artifactInfo\":null}", + "status":{ + "code": "400", + "message": "success" + } + } + } + } + + //"{'userID':'ug0221','designInfo':[{'vnf-type':'demo123','vnfc-type':'null','protocol':'','incart':'N','action':'AllAction','artifact-name':'reference_AllAction_demo123_0.0.1V.json','artifact-type':'APPC-CONFIG'}]}" + const data = { + 'input': { + 'design-request': { + 'request-id': "apiToken", + 'action': 'getDesigns', + 'payload': '{"userID": "","filter":"reference"}' + } + } + }; + + + mockBackend.connections.subscribe((connection) => { + connection.mockRespond(new Response(new ResponseOptions({ + body: JSON.stringify(mockResponse) + }))); + }); + component.getArtifacts(data) + httpUtilService.post({ + url: "test url", + data: data + }).subscribe((resp) => { + console.log("resp") + console.log(resp) + let block = JSON.parse(resp.output.data.block) + expect(block.userID).toBe("ug0221"); + + + + + }); + + + })) + it('Checking for the successfull post call', inject([HttpUtilService, XHRBackend], (httpUtilService, mockBackend) => { + + const mockResponse = { + "output": { + "data": { + "block": "{\"userID\":\"ug0221\",\"designInfo\":[{\"vnf-type\":\"demo123\",\"vnfc-type\":\"null\",\"protocol\":\"\",\"incart\":\"N\",\"action\":\"AllAction\",\"artifact-name\":\"reference_AllAction_demo123_0.0.1V.json\",\"artifact-type\":\"APPC-CONFIG\"}],\"statusInfo\":null,\"artifactInfo\":null}", + "status":{ + "code": "400", + "message": "success" + } + } + } + } + const data = { + 'input': { + 'design-request': { + 'request-id': "apiToken", + 'action': 'getDesigns', + 'payload': '{"userID": "","filter":"reference"}' + } + } + }; + + + mockBackend.connections.subscribe((connection) => { + connection.mockRespond(new Response(new ResponseOptions({ + body: JSON.stringify(mockResponse) + }))); + }); + component.getArtifacts(data) + httpUtilService.post({ + url: "test url", + data: data + }).subscribe((resp) => { + console.log("resp") + console.log(resp) + let block = JSON.parse(resp.output.data.status.code) + console.log("code",block) + expect(block).toBe(400); + }); + })) +}); diff --git a/src/app/vnfs/myvnfs/myvnfs.component.ts b/src/app/vnfs/myvnfs/myvnfs.component.ts new file mode 100644 index 0000000..37ebe96 --- /dev/null +++ b/src/app/vnfs/myvnfs/myvnfs.component.ts @@ -0,0 +1,163 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018 AT&T Intellectual Property. All rights reserved. +=================================================================== + +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. + +ECOMP is a trademark and service mark of AT&T Intellectual Property. +============LICENSE_END============================================ +*/ + +import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute, Router } from '@angular/router'; +import { HttpUtilService } from '../../shared/services/httpUtil/http-util.service'; +import { MappingEditorService } from '../../shared/services/mapping-editor.service'; +import { ParamShareService } from '../../shared/services/paramShare.service'; +import { environment } from '../../../environments/environment'; +import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; +import { NgProgress } from 'ngx-progressbar'; + + +@Component({ selector: 'app-myvnfs', templateUrl: './myvnfs.component.html', styleUrls: ['./myvnfs.component.css'] }) +export class MyvnfsComponent implements OnInit { + vnfData: Array<Object> = []; + sortOrder = false; + noData = true; + sortBy: string; + filter: Object = {}; + noDataMsg: string; + vnfType: any; + vnfcType: any; + + constructor (private paramShareService: ParamShareService, private ngProgress: NgProgress, private httpUtil: HttpUtilService, private router: Router, private activeROute: ActivatedRoute, + private mappingEditorService: MappingEditorService, private modalService: NgbModal) { + } + + ngOnInit() { + + sessionStorage.setItem('updateParams', undefined); + this.mappingEditorService.latestAction = undefined; + const apiToken = localStorage['apiToken']; + + const data = { + 'input': { + 'design-request': { + 'request-id': apiToken, + 'action': 'getDesigns', + 'payload': '{"userID": "","filter":"reference"}' + } + } + }; + const x = JSON.parse(data.input['design-request']['payload']); + x.userID = localStorage['userId']; + data.input['design-request']['payload'] = JSON.stringify(x); + // console.log("input to payload====", JSON.stringify(data)); + this.getArtifacts(data); + this.clearCache(); + } + + getArtifacts(data) { + this.ngProgress.start(); + 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; + if (this.vnfData == undefined || this.vnfData == null || this.vnfData.length == 0) { + this.noData = true; + + this.noDataMsg = resp.output.data.status.message; + } else { + this.noData = false; + } + console.log(this.noData); + this.ngProgress.done(); + }); + + this.filter = ['vnf-type', 'vnfc-type', 'artifact-name']; + setTimeout(() => { + this.ngProgress.done(); + }, 3500); + } + + + + 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' + ]); + }); + + + } + + navigateToReference(item) { + sessionStorage.setItem('updateParams', JSON.stringify(item)); + this.mappingEditorService.referenceNameObjects = undefined; + + this + .router + .navigate(['../design/references'], { + relativeTo: this.activeROute, + queryParams: { + id: item.id + } + }); + } + + navigateToRefrenceUpdate() { + + this + .router + .navigate(['../design/references/update'], { + relativeTo: this.activeROute, + queryParams: { + id: '10' + } + }); + } + + clearCache() { + // get the value and save the userid and persist it. + + this.mappingEditorService.setTemplateMappingDataFromStore(undefined); + localStorage['paramsContent'] = '{}'; + this.mappingEditorService.setParamContent(undefined); + this.paramShareService.setSessionParamData(undefined); + const appData = { reference: {}, template: { templateData: {}, nameValueData: {} }, pd: {} }; + const downloadData = { + reference: {}, + template: { templateData: {}, nameValueData: {}, templateFileName: '', nameValueFileName: '' }, + pd: { pdData: '', pdFileName: '' } + }; + this.mappingEditorService.changeNavAppData(appData); + this.mappingEditorService.changeNavDownloadData(downloadData); + } + + +}
\ No newline at end of file |