From b5cfca87aa30d0207ef32d944cc447ed4c580b29 Mon Sep 17 00:00:00 2001 From: wangyuerg Date: Thu, 18 Mar 2021 14:05:27 +0800 Subject: fix: fix the display of ip tooltip Signed-off-by: wangyuerg iChange-Id: Id826511401a13bb0b8b1303acbea5ba23df948db Issue-ID: USECASEUI-527 Change-Id: Ib81c195438160e2ec0df7fed8557223c12c9f001 --- .../slicing-business-model.component.ts | 177 +++++++++++---------- 1 file changed, 96 insertions(+), 81 deletions(-) (limited to 'usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts') diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts index 6d477e4a..04c28d7a 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts @@ -1,90 +1,105 @@ -import { Component, OnInit, Input } from '@angular/core'; +import { Component, OnInit, Input } from "@angular/core"; import { NzModalService, NzMessageService } from "ng-zorro-antd"; -import { SlicingTaskServices } from '.././../../../../../core/services/slicingTaskServices'; +import { SlicingTaskServices } from ".././../../../../../core/services/slicingTaskServices"; import { NsiModelComponent } from "../../nsi-management/nsi-model/nsi-model.component"; @Component({ - selector: 'app-slicing-business-model', - templateUrl: './slicing-business-model.component.html', - styleUrls: ['./slicing-business-model.component.less'] + selector: "app-slicing-business-model", + templateUrl: "./slicing-business-model.component.html", + styleUrls: ["./slicing-business-model.component.less"], }) export class SlicingBusinessModelComponent implements OnInit { + constructor( + private myhttp: SlicingTaskServices, + private modalService: NzModalService, + private message: NzMessageService + ) {} - constructor( - private myhttp: SlicingTaskServices, - private modalService: NzModalService, - private message: NzMessageService - ) { - } + @Input() businessId; + @Input() outerData; + businessRequirement: any[]; + NSTinfo: any[] = []; + nsiInfo: any[] = []; + taskModel: boolean = false; + isSpinning: boolean = true; + status: string = ""; + businessDetailInfo: any = {}; + rantext: string = "RAN Network Edge IP address"; + isshowcore: boolean = false; + isshowran: boolean = false; + ngOnInit() { + this.status = this.outerData.orchestration_status; + this.getDetail(); + } + detailFn(flag, form) { + this.rantext = + form == "ran" + ? "RAN Network Edge IP address" + : "Core Network Edge IP address"; + if (form == "ran") { + this.isshowran = !this.isshowran; + } else { + this.isshowcore = !this.isshowcore; + } + } + getDetail() { + this.myhttp.getSlicingBusinessDetail(this.businessId).then((res) => { + this.isSpinning = false; + const { + business_demand_info, + business_demand_info: { coverage_area_ta_list }, + nst_info, + nsi_info, + connection_link: { + an_slice_task_info, + cn_slice_task_info, + tn_bh_slice_task_info, + }, + } = res.result_body; + const connect_info = { + an_ip_adrress: an_slice_task_info.ip_adrress, + an_interface_id: an_slice_task_info.interface_id, + an_nextHop_info: an_slice_task_info.nextHop_info, + cn_interface_id: cn_slice_task_info.interface_id, + cn_ip_adrress: cn_slice_task_info.ip_adrress, + cn_nextHop_info: cn_slice_task_info.nextHop_info, + max_bandWidth: tn_bh_slice_task_info.max_bandWidth, + link_type: tn_bh_slice_task_info.link_type, + lantency: tn_bh_slice_task_info.lantency, + }; + this.businessDetailInfo = connect_info; - @Input() businessId; - @Input() outerData; - businessRequirement: any[]; - NSTinfo: any[] = []; - nsiInfo: any[] = []; - taskModel: boolean = false; - isSpinning: boolean = true; - status: string = ""; - businessDetailInfo : any = {} - rantext: string = "RAN Network Edge IP address"; - isshowcore: boolean = false; - isshowran: boolean = false; - ngOnInit() { - this.status = this.outerData.orchestration_status - this.getDetail() - } - detailFn(flag,form){ - this.rantext = form =='ran'? "RAN Network Edge IP address" : "Core Network Edge IP address"; - if(form =='ran'){ - this.isshowran = !this.isshowran - }else{ - this.isshowcore = !this.isshowcore - } - } - getDetail() { - this.myhttp.getSlicingBusinessDetail(this.businessId).then(res => { - this.isSpinning = false; - const { business_demand_info, business_demand_info: { coverage_area_ta_list }, nst_info, nsi_info ,connection_link: { an_slice_task_info,cn_slice_task_info,tn_bh_slice_task_info }} = res.result_body; - const connect_info = { - an_ip_adrress: an_slice_task_info.ip_adrress, - an_interface_id: an_slice_task_info.interface_id, - an_nextHop_info: an_slice_task_info.nextHop_info, - cn_interface_id: cn_slice_task_info.interface_id, - cn_ip_adrress: cn_slice_task_info.ip_adrress, - cn_nextHop_info: cn_slice_task_info.nextHop_info, - max_bandWidth: tn_bh_slice_task_info.max_bandWidth, - link_type: tn_bh_slice_task_info.link_type, - lantency: tn_bh_slice_task_info.lantency - } - this.businessDetailInfo = connect_info - - business_demand_info.area = coverage_area_ta_list.map(item => { - item = item.split(';').join('-'); - return item - }); - // area : Front-end analog data - let area = ["Haidian District;Beijing;Beijing", "Xicheng District;Beijing;Beijing", "Changping District;Beijing;Beijing"].map(item => { - item = item.split(';').join(' - '); - return item - }); - this.businessRequirement = [{ ...business_demand_info, area }]; - this.NSTinfo = [nst_info]; - console.log('ngs',this.NSTinfo) - if (nsi_info.nsi_id !== null) { - this.nsiInfo = [nsi_info]; - } - }) - } - showdetail(data) { - const nsiModal = this.modalService.create({ - nzTitle: "Detail", - nzContent: NsiModelComponent, - nzWidth: "70%", - nzOkText: null, - nzCancelText: null, - nzComponentParams: { - nsiId: data.nsi_id - } - }); - } + business_demand_info.area = coverage_area_ta_list.map((item) => { + item = item.split(";").join("-"); + return item; + }); + // area : Front-end analog data + let area = [ + "Haidian District;Beijing;Beijing", + "Xicheng District;Beijing;Beijing", + "Changping District;Beijing;Beijing", + ].map((item) => { + item = item.split(";").join(" - "); + return item; + }); + this.businessRequirement = [{ ...business_demand_info, area }]; + this.NSTinfo = [nst_info]; + console.log("ngs", this.NSTinfo); + if (nsi_info.nsi_id !== null) { + this.nsiInfo = [nsi_info]; + } + }); + } + showdetail(data) { + const nsiModal = this.modalService.create({ + nzTitle: "Detail", + nzContent: NsiModelComponent, + nzWidth: "70%", + nzOkText: null, + nzCancelText: null, + nzComponentParams: { + nsiId: data.nsi_id, + }, + }); + } } -- cgit 1.2.3-korg