diff options
12 files changed, 374 insertions, 140 deletions
diff --git a/usecaseui-portal/src/app/views/services/sotn-management/manage-service/manage-service.component.ts b/usecaseui-portal/src/app/views/services/sotn-management/manage-service/manage-service.component.ts index 098eedd2..16aee4e7 100644 --- a/usecaseui-portal/src/app/views/services/sotn-management/manage-service/manage-service.component.ts +++ b/usecaseui-portal/src/app/views/services/sotn-management/manage-service/manage-service.component.ts @@ -34,8 +34,13 @@ export class ManageServiceComponent implements OnInit { //Get SubscriptionType getSubscribeTypes() { + let httpOptions = { + headers: new HttpHeaders({ + 'Content-Type': 'application/json' + }) + }; let url = this.baseUrl + "/uui-lcm/customers/service-subscriptions"; - this.http.get<any>(url, {}).subscribe((data) => { + this.http.get<any>(url, httpOptions).subscribe((data) => { this.serviceSubscriptionList = data.subscriptions; }, (err) => { console.log(err); @@ -44,10 +49,15 @@ export class ManageServiceComponent implements OnInit { //Get subscription instanceID by calling With Subscription Type getServiceInstanceList(subscriptionType) { + let httpOptions = { + headers: new HttpHeaders({ + 'Content-Type': 'application/json' + }) + }; this.serviceInstanceList = []; this.selectedServiceInstance=""; let url = this.baseUrl + "/uui-lcm/Sotnservices/ServiceInstances/"+subscriptionType; - this.http.get<any>(url,{}).subscribe((data) => { + this.http.get<any>(url,httpOptions).subscribe((data) => { this.serviceInstanceList = data.serviceInstanceList; }, (err) => { console.log(err); @@ -56,8 +66,12 @@ export class ManageServiceComponent implements OnInit { deleteSelectedService() { let url = this.baseUrl + "/uui-lcm/Sotnservices/servicesubscription/"+this.selectedSubscriptionType+'/serviceinstance/'+this.selectedServiceInstance; - - this.http.delete<any>(url,{}).subscribe((data) => { + let httpOptions = { + headers: new HttpHeaders({ + 'Content-Type': 'application/json' + }) + }; + this.http.delete<any>(url,httpOptions).subscribe((data) => { this.serviceInstanceList = []; this.selectedServiceInstance = ""; this.getServiceInstanceList(this.selectedSubscriptionType); @@ -67,11 +81,17 @@ export class ManageServiceComponent implements OnInit { } + getSubscribedSites() { console.log("on change"); + let httpOptions = { + headers: new HttpHeaders({ + 'Content-Type': 'application/json' + }) + }; if (this.selectedServiceInstance) { let url = this.baseUrl + "/uui-lcm/Sotnservices/servicesubscription/"+this.selectedSubscriptionType+'/serviceinstance/'+this.selectedServiceInstance; - this.http.get<any>(url, {}).subscribe((data) => { + this.http.get<any>(url, httpOptions).subscribe((data) => { this.assignData(data, false); }, (err) => { console.log(err); diff --git a/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.html b/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.html index 39bfa1bf..3637d3c9 100644 --- a/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.html +++ b/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.html @@ -29,15 +29,19 @@ <td> <nz-select id="serviceInstance" class= "colm-s-2 " [(ngModel)]="selectedTopology" (ngModelChange)="getTopologyInfo($event)" nzAllowClear nzPlaceHolder="Choose"> - <nz-option *ngFor="let option of serviceTopologyList" [nzValue]="option.topologyType" [nzLabel]="option.topologyType | translate"></nz-option> + <nz-option *ngFor="let option of serviceTopologyList" [nzValue]="option.topologyType" [nzLabel]="option.topologyType | translate" [nzDisabled]="option.topologyType == 'i18nTextDefine_resourceTopology'"></nz-option> </nz-select> </td> </tr> </table> </div> - - <div class="flexDiv"> - <div id="mynetwork" class="colm-s-3"></div> + <div class="flexDiv"> + <div class="topocontainer"> + <div class="back-btn"> + <button nz-button nzType="primary" (click)="onBack()" [disabled]="isdisabled">Back</button> + </div> + <div id="mynetwork" class="colm-s-3"></div> + </div> <div class="colm-s-4"><div id="nodeDetails"></div></div> </div> </div>
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.less b/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.less index 9ebe3741..bfdcfdeb 100644 --- a/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.less +++ b/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.less @@ -95,4 +95,6 @@ #subscriptionType, #serviceInstance { width: 250px; - }
\ No newline at end of file + } + +
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.ts b/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.ts index 48c90b63..4903b102 100644 --- a/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.ts +++ b/usecaseui-portal/src/app/views/services/sotn-management/monitor-service/monitor-service.component.ts @@ -1,8 +1,9 @@ import { Component, OnInit } from '@angular/core'; import { Network, Node, Edge } from 'vis'; -import { HttpClient } from '@angular/common/http'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; import { Observable } from 'rxjs/Observable'; import { baseUrl } from '../../../../datainterface'; +import { getLocaleDateFormat } from '@angular/common'; @Component({ selector: 'app-monitor-service', templateUrl: './monitor-service.component.html', @@ -16,14 +17,6 @@ export class MonitorServiceComponent implements OnInit { serviceInstanceList = [] as Array<any>; selectedTopology:string = 'i18nTextDefine_serviceTopology'; - serviceTopologyList:any = [ - { - topologyType:"i18nTextDefine_serviceTopology", - }, - { - topologyType:"i18nTextDefine_resourceTopology", - } - ]; baseUrl = baseUrl.baseUrl title = 'Network'; @@ -31,6 +24,7 @@ export class MonitorServiceComponent implements OnInit { public edges: Edge; public network: Network; public serviceList: any; + public vpnBindingList:any; public tempNode: any; public tempEdge: any; public selectedNode: any; @@ -38,9 +32,20 @@ export class MonitorServiceComponent implements OnInit { public x: any; public abc = []; container: any; + isdisabled:boolean = true; + serviceTopologyList:any = [ + { + topologyType:"i18nTextDefine_serviceTopology", + }, + { + topologyType:"i18nTextDefine_resourceTopology", + } + ]; + + networkOptions = { layout: { - randomSeed: 15 + randomSeed: 15 }, nodes: { borderWidth: 13, @@ -52,7 +57,7 @@ export class MonitorServiceComponent implements OnInit { font: { color: '#eeeeee' } }, edges: { - color: 'lightgray' + color: 'lightgray', }, interaction: { @@ -69,12 +74,27 @@ export class MonitorServiceComponent implements OnInit { intervalData: any; returnResponse: boolean = true; - + onBack(){ + if(this.serviceList.length > 0) { + this.refreshData(""); + } else { + this.getData(""); + } + this.isdisabled = true; + }; //Get SubscriptionType getSubscribeTypes() { + this.serviceList = []; + this.vpnBindingList = []; + this.isdisabled = true; + let httpOptions = { + headers: new HttpHeaders({ + 'Content-Type': 'application/json' + }) + }; let url = this.baseUrl + "/uui-lcm/customers/service-subscriptions"; - this.http.get<any>(url, {}).subscribe((data) => { + this.http.get<any>(url, httpOptions).subscribe((data) => { this.serviceSubscriptionList = data.subscriptions; }, (err) => { console.log(err); @@ -83,10 +103,19 @@ export class MonitorServiceComponent implements OnInit { //Get subscription instanceID by calling With Subscription Type getServiceInstanceList(subscriptionType) { + debugger + this.serviceList = []; + this.vpnBindingList = []; + this.isdisabled = true; this.serviceInstanceList = []; this.selectedServiceInstance=""; + let httpOptions = { + headers: new HttpHeaders({ + 'Content-Type': 'application/json' + }) + }; let url = this.baseUrl + "/uui-lcm/Sotnservices/ServiceInstances/" + subscriptionType; - this.http.get<any>(url,{}).subscribe((data) => { + this.http.get<any>(url,httpOptions).subscribe((data) => { this.serviceInstanceList = data.serviceInstanceList; }, (err) => { console.log(err); @@ -95,8 +124,8 @@ export class MonitorServiceComponent implements OnInit { getTopologyInfo (topo) { this.selectedTopology = topo; - this.getData(); - this.refreshData(); + this.getData(""); + this.refreshData(""); } //Get subscription instanceID by calling With Subscription Type ngOnInit() { @@ -104,24 +133,28 @@ export class MonitorServiceComponent implements OnInit { this.getSubscribeTypes(); } - refreshData() { + refreshData(data) { + const com = this + var id ; var data1 = { - nodes: this.serviceList.nodes, - edges: this.serviceList.edges + nodes: data.nodes, + edges: data.edges }; var network = new Network(this.container, data1, this.networkOptions); - network.on('select', function (selection) { + network.on('doubleClick', function (selection) { + var selectedvpnid = selection.nodes[0]; + com.getData(selectedvpnid) this.selectedNodeIds = selection.nodes[0]; // array of selected node's ids var filteredNode = data1.nodes.filter(item => ( item.id == this.selectedNodeIds )); var t1 = '<div class="tblDiv">\ <nz-form-label class="lblCls">Node Information</nz-form-label>\ - <table class="table table-striped table-bordered">\ + <table class="monitor-table">\ <thead>\ <tr>\ - <th class="clr-primary padding-2p">Specification</th>\ - <th class="clr-primary padding-2p">Value</th>\ + <th class="monitor-table-td-th ">Specification</th>\ + <th class="monitor-table-td-th ">Value</th>\ </tr>\ </thead>\ <tbody>\ @@ -130,8 +163,8 @@ export class MonitorServiceComponent implements OnInit { if( entry[1] !== "null") { t1 += '<tr class="popup-table-row">\ - <td class="popup-table-header clr-primary padding-2p">'+ entry[0] + ':</td>\ - <td class="popup-table-data clr-primary padding-2p">'+ entry[1] + '</td>\ + <td class="monitor-table-td-th ">'+ entry[0] + ':</td>\ + <td class="monitor-table-td-th ">'+ entry[1] + '</td>\ </tr>\ '; } @@ -147,24 +180,49 @@ export class MonitorServiceComponent implements OnInit { }); } - getData (){ + getData (vpnid){ var comp = this; - this.http.get<any>(this.baseUrl+'/uui-lcm/Sotnservices/resourceTopology/service/service-subscriptions/service-subscription/'+this.selectedSubscriptionType.toLowerCase()+'/service-instances/service-instance/'+this.selectedServiceInstance, {}).subscribe((data) => { + let url = ""; + if(vpnid != "" ) { + if(this.vpnBindingList.length > 0) { + this.refreshData(this.vpnBindingList) + } else { + url = this.baseUrl+'/uui-lcm/Sotnservices/vpnbindingTopology/service/service-subscriptions/service-subscription/'+this.selectedSubscriptionType.toLowerCase()+'/service-instances/service-instance/'+this.selectedServiceInstance+'/vpn-informations/vpn-information/'+ vpnid; + } + } else { + if(this.serviceList.length > 0 && vpnid == "") { + this.refreshData(this.serviceList); + } else { + url = this.baseUrl+'/uui-lcm/Sotnservices/serviceTopology/service/service-subscriptions/service-subscription/'+this.selectedSubscriptionType.toLowerCase()+'/service-instances/service-instance/'+this.selectedServiceInstance; + } + } + let httpOptions = { + headers: new HttpHeaders({ + 'Content-Type': 'application/json' + }) + }; + this.http.get<any>(url, httpOptions).subscribe((data) => { + if(vpnid == "") { this.serviceList = data; - comp.refreshData(); - }, (err) => { + } else { + this.vpnBindingList = data; + this.isdisabled = false; + } + comp.refreshData(data); + }, (err) => { console.log(err); }); } + // Getting sitedata Based On Type and ID getSelectedsubscriptionInfo() { - this.getData(); - this.refreshData(); + this.getData(""); if (this.intervalData) { clearInterval(this.intervalData); } } + ngOnDestroy() { console.log('clear interval'); if (this.intervalData) { diff --git a/usecaseui-portal/src/app/views/services/sotn-management/order-service/order-service.component.ts b/usecaseui-portal/src/app/views/services/sotn-management/order-service/order-service.component.ts index d770eb06..1cfd00fd 100644 --- a/usecaseui-portal/src/app/views/services/sotn-management/order-service/order-service.component.ts +++ b/usecaseui-portal/src/app/views/services/sotn-management/order-service/order-service.component.ts @@ -20,7 +20,6 @@ export class OrderServiceComponent implements OnInit { siteData:object = {}; buttonDisabled:boolean = false; intervalData:any; - // baseUrl:string = '/api/usecaseui-server/v1'; baseUrl = baseUrl.baseUrl expandDataSet = [ { rowIdx: 1, name: 'i18nTextDefine_serviceInformation', expand: true }, @@ -59,6 +58,7 @@ export class OrderServiceComponent implements OnInit { }); } + numberOnly(event): boolean { const charCode = (event.which) ? event.which : event.keyCode; if (charCode > 31 && (charCode < 48 || charCode > 57)) { @@ -121,6 +121,10 @@ export class OrderServiceComponent implements OnInit { this.l2vpn["l2vpn_reroute"] == null) { return false; } + // for (const i in this.validateForm.controls) { + // this.validateForm.controls[i].markAsDirty(); + // this.validateForm.controls[i].updateValueAndValidity(); + // } return true; } @@ -135,13 +139,19 @@ export class OrderServiceComponent implements OnInit { 'Content-Type': 'application/json', }) }; + let url1 = this.baseUrl + '/uui-lcm/Sotnservices_unni'; this.http.post<any>(url1, body, httpOptions).subscribe((data) => { let comp = this; this.message.info('Instantiation In Progress'); this.intervalData = setInterval(() => { + const httpOptions1 = { + headers: new HttpHeaders({ + 'Content-Type': 'application/json', + }) + }; let url2 = this.baseUrl + "/uui-lcm/Sotnservices/serviceStatus/service-instance/" + data.service.serviceId; - this.http.get<any>(url2, {}).subscribe((data) => { + this.http.get<any>(url2, httpOptions1).subscribe((data) => { if (data.status == "1") { clearInterval(comp.intervalData); comp.message.success('Service Created'); diff --git a/usecaseui-portal/src/assets/i18n/cn.json b/usecaseui-portal/src/assets/i18n/cn.json index f8ec2481..bcb7851d 100644 --- a/usecaseui-portal/src/assets/i18n/cn.json +++ b/usecaseui-portal/src/assets/i18n/cn.json @@ -151,7 +151,7 @@ "i18nTextDefine_topology": "拓扑结构", "i18nTextDefine_colorAware": "色敏感", "i18nTextDefine_couplingFlag": "耦合标签", - "i18nTextDefine_networkTopology": "网络拓扑", + "i18nTextDefine_serviceTopology": "服务拓扑", "i18nTextDefine_resourceTopology": "资源拓扑", "i18nTextDefine_orderService":"订购服务", "i18nTextDefine_monitorService":"监控服务", diff --git a/usecaseui-portal/src/assets/i18n/en.json b/usecaseui-portal/src/assets/i18n/en.json index 41b7c8d8..dd967e94 100644 --- a/usecaseui-portal/src/assets/i18n/en.json +++ b/usecaseui-portal/src/assets/i18n/en.json @@ -150,7 +150,7 @@ "i18nTextDefine_topology": "Topology", "i18nTextDefine_colorAware": "Color Aware", "i18nTextDefine_couplingFlag": "Coupling Flag", - "i18nTextDefine_networkTopology": "Network Topology", + "i18nTextDefine_serviceTopology": "Service Topology", "i18nTextDefine_resourceTopology": "Resource Topology", "i18nTextDefine_orderService":"Order Service", "i18nTextDefine_monitorService":"Monitor Service", diff --git a/usecaseui-portal/src/assets/images/connectivity.png b/usecaseui-portal/src/assets/images/connectivity.png Binary files differnew file mode 100644 index 00000000..77c97321 --- /dev/null +++ b/usecaseui-portal/src/assets/images/connectivity.png diff --git a/usecaseui-portal/src/assets/images/service.png b/usecaseui-portal/src/assets/images/service.png Binary files differnew file mode 100644 index 00000000..bcb21d35 --- /dev/null +++ b/usecaseui-portal/src/assets/images/service.png diff --git a/usecaseui-portal/src/assets/images/vpnbinding.png b/usecaseui-portal/src/assets/images/vpnbinding.png Binary files differnew file mode 100644 index 00000000..6401677a --- /dev/null +++ b/usecaseui-portal/src/assets/images/vpnbinding.png diff --git a/usecaseui-portal/src/styles.less b/usecaseui-portal/src/styles.less index bd3a6b79..e3b06d8e 100644 --- a/usecaseui-portal/src/styles.less +++ b/usecaseui-portal/src/styles.less @@ -838,6 +838,14 @@ nz-notification-container .ant-notification{ } } } +.back-btn{ + text-align: right; + padding-bottom: 15px; +} +.topocontainer{ + width: 100%; +} + .taskmodel_list{ margin-bottom: 20px; nz-table{ @@ -859,4 +867,20 @@ nz-notification-container .ant-notification{ .ant-table-wrapper { padding: 10px; } -}
\ No newline at end of file +} +.ant-calendar-picker { + width: 100% !important; +} +.monitor-table{ + border-collapse: collapse; + width: 100%; + border: 1px solid gainsboro; +} + +.monitor-table-td-th { + text-align: left; + padding: 8px; + border-bottom: 1px solid gainsboro; + border-right: 1px solid gainsboro; +} +.monitor-table tr:nth-child(even) {background-color:#bfbfbf;}
\ No newline at end of file diff --git a/usecaseui-portal/testBE/FakeBackendInterceptor.ts b/usecaseui-portal/testBE/FakeBackendInterceptor.ts index dd1c0d20..9fc0868c 100644 --- a/usecaseui-portal/testBE/FakeBackendInterceptor.ts +++ b/usecaseui-portal/testBE/FakeBackendInterceptor.ts @@ -90,102 +90,218 @@ export class FakeBackendInterceptor implements HttpInterceptor { return Observable.of(new HttpResponse({ status: 200, body: body })); } - // get monotor service data - if (request.url.endsWith('/uui-lcm/Sotnservices/resourceTopology/service/service-subscriptions/service-subscription/sotn/service-instances/service-instance/ISAAC-IS02') || request.url.endsWith('/uui-lcm/Sotnservices/resourceTopology/service/service-subscriptions/service-subscription/sotn/service-instances/service-instance/ISAAC-IS03') && request.method === 'GET') { - let body = { - "nodes": [ - { - "id": "1", - "shape": "circularImage", - "image": "./assets/images/tpoint.png", - "label": "Termination Point", - "color": "Green", - "dataNode": {} - }, - { - "id": "2", - "shape": "circularImage", - "image": "./assets/images/edge.png", - "label": "Node", - "color": "Green", - "dataNode": { - "ethtSvcName": "sotn-021-VS-monitored", - "colorAware": "true", - "cbs": "100", - "couplingFlag": "true", - "ebs": "evpl", - "cir": "200000", - "eir": "0" - } - }, - { - "id": "3", - "shape": "circularImage", - "image": "./assets/images/logicallink.png", - "label": "Logical Link", - "color": "Green", - "dataNode": { - "ethtSvcName": "sotn-021-VS-monitored", - "colorAware": "true", - "cbs": "100", - "couplingFlag": "true", - "ebs": "evpl", - "cir": "200000", - "eir": "0" - } - }, - { - "id": "4", - "shape": "circularImage", - "image": "./assets/images/edge.png", - "label": "Node", - "color": "Green", - "dataNode": { - "zipcode": "100095", - "siteName": "hubtravel", - "description": "desc", - "location": "laptop-5", - "cvlan": "100" - } - }, - { - "id": "5", - "shape": "circularImage", - "image": "./assets/images/tpoint.png", - "label": "Termination Point", - "color": "Green", - "dataNode": { - "accessltpid": "155", - "siteName": "hubtravel", - "description": "desc", - "accessnodeid": "10.10.10.10", - "cvlan": "100" - } - } - ], - "edges": [ - { - "from": "1", - "to": "2" - }, - { - "from": "2", - "to": "3" - }, - { - "from": "3", - "to": "4" - }, - { - "from": "4", - "to": "5" - } - ] - }; + // get monitor service data + // VPN binding + if (request.url.endsWith('/uui-lcm/Sotnservices/resourceTopology/service/service-subscriptions/service-subscription/sotn/service-instances/service-instance/ISAAC-IS02/vpn-informations/vpn-information/vpn-bind-1') && request.method === 'GET') { + + let body = { + "nodes":[ + { + "id":"vpn-bind-1", + "shape":"circularImage", + "image":"./assets/images/vpnbinding.png", + "label":"VPN Binding", + "color":"Green", + "dataNode":{ + "vpn-name":"sotn-l2-vpn", + "vpn-type":"l2-eth" + } + }, + { + "id":"10.10.10.10", + "shape":"circularImage", + "image":"./assets/images/tpoint.png", + "label":"P-interface", + "color":"Green", + "dataNode":{ + "interface-name":"10.10.10.10", + "speed-value":"example-speed-value-val-33014", + "speed-units":"example-speed-units-val-75695", + "port-description":"p-interafce-desc" + } + }, + { + "id":"22.22.22.22", + "shape":"circularImage", + "image":"./assets/images/tpoint.png", + "label":"P-interface", + "color":"Green", + "dataNode":{ + "interface-name":"22.22.22.22", + "speed-value":"example-speed-value-val-33014", + "speed-units":"example-speed-units-val-75695", + "port-description":"p-interafce-desc" + } + } + ], + "edges":[ + { + "from":"vpn-bind-1", + "to":"10.10.10.10" + }, + { + "from":"vpn-bind-1", + "to":"22.22.22.22" + } + ] + } - return Observable.of(new HttpResponse({ status: 200, body: body })); + return Observable.of(new HttpResponse({ status: 200, body: body })); + + } + + // resource topo + + if (request.url.endsWith('/uui-lcm/Sotnservices/resourceTopology/service/service-subscriptions/service-subscription/sotn/service-instances/service-instance/ISAAC-IS02')&& request.method === 'GET') { + + let body = { + "nodes":[ + { + "id":"NNI-001", + "shape":"circularImage", + "image":"./assets/images/service.png", + "label":"Service", + "color":"Green", + "dataNode":{ + "service-instance-id":"NNI-001", + "service-instance-name":"NNI-001", + "service-type":"example-service-type-val-52265", + "service-role":"example-service-role-val-24156" + } + }, + { + "id":"vnf-instance", + "shape":"circularImage", + "image":"./assets/images/VNF.png", + "label":"Vnf", + "color":"Green", + "dataNode":{ + "vnf-id":"nni-vnf-1", + "vnf-instance-id":"vnf-instance", + "vnf-name":"SOTN-NNI-Underlay", + "vnf-type":"some-vnf-type", + "is-closed-loop-disabled":false, + "closedLoopDisabled":false + } + }, + { + "id":"eth-conn-1", + "shape":"circularImage", + "image":"./assets/images/connectivity.png", + "label":"Connectivity", + "color":"Green", + "dataNode":{ + "connectivity-id":"eth-conn-1", + "operational-status":"Created", + "vpn-type":"L2-eth" + } + }, + { + "id":"uni-1", + "shape":"circularImage", + "image":"./assets/images/edge.png", + "label":"uni-1", + "color":"Green", + "dataNode":{ + "id":"uni-1", + "tpId":"p-interface-1", + "operational-status":"Created" + } + }, + { + "id":"10.10.10.10", + "shape":"circularImage", + "image":"./assets/images/tpoint.png", + "label":"P-interface", + "color":"Green", + "dataNode":{ + "interface-name":"10.10.10.10", + "speed-value":"example-speed-value-val-33014", + "speed-units":"example-speed-units-val-75695", + "port-description":"p-interafce-desc" + } + }, + { + "id":"uni-2", + "shape":"circularImage", + "image":"./assets/images/edge.png", + "label":"uni-2", + "color":"Green", + "dataNode":{ + "id":"uni-2", + "tpId":"p-interface-2", + "operational-status":"Created" + } + }, + { + "id":"22.22.22.22", + "shape":"circularImage", + "image":"./assets/images/tpoint.png", + "label":"P-interface", + "color":"Green", + "dataNode":{ + "interface-name":"22.22.22.22", + "speed-value":"example-speed-value-val-33014", + "speed-units":"example-speed-units-val-75695", + "port-description":"p-interafce-desc" + } + }, + { + "id":"vpn-bind-1", + "shape":"circularImage", + "image":"./assets/images/vpnbinding.png", + "label":"VPN Binding", + "color":"Green", + "dataNode":{ + "vpn-name":"sotn-l2-vpn", + "vpn-type":"l2-eth" + } + } + ], + "edges":[ + { + "from":"NNI-001", + "to":"vnf-instance" + }, + { + "from":"vnf-instance", + "to":"eth-conn-1" + }, + { + "from":"vnf-instance", + "to":"uni-1" + }, + { + "from":"uni-1", + "to":"10.10.10.10" + }, + { + "from":"vnf-instance", + "to":"uni-2" + }, + { + "from":"uni-2", + "to":"22.22.22.22" + }, + { + "from":"eth-conn-1", + "to":"vpn-bind-1" + }, + { + "from":"vpn-bind-1", + "to":"10.10.10.10" + }, + { + "from":"vpn-bind-1", + "to":"22.22.22.22" + } + ] + } + + return Observable.of(new HttpResponse({ status: 200, body: body })); + + } - } if (request.url.endsWith('/uui-lcm/customers/service-subscriptions') && request.method === 'GET') { let body = { |