diff options
Diffstat (limited to 'usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management')
4 files changed, 134 insertions, 3 deletions
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.html index 217e8bb4..3195783b 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.html +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.html @@ -30,7 +30,62 @@ </nz-list> <nz-list class="taskmodel_list" nzBordered [nzHeader]="'End to End Topology:'" [nzFooter]="null"> <div>status:{{status}}</div> - <img style="width: 100%;" src="assets/images/slicing-business-management/example.png" alt="example" /> + <!-- <img style="width: 100%;" src="assets/images/slicing-business-management/example.png" alt="example" /> --> <!-- <img src="assets/images/slicing-business-management/server.svg" /> --> + <div class="warp"> + <div class="header"> + <p>AN</p> + <p>TN</p> + <p>CN</p> + </div> + <ul class="list-box"> + <li> + <p> + <img src="../../../../../../../assets/images/an-img.png" class="anImg"/> + </p> + <p>{{outerData.anVersion}}</p> + </li> + <li class="vLan-line"> + <p > + vLan:{{outerData.vLanText}} + </p> + <p class="online-vlan"></p> + </li> + <li> + <p>{{outerData.tnVersion}}</p> + <p> + <img src="../../../../../../../assets/images/tn-edge-img.png" class="tnImg"/> + </p> + <p>{{outerData.tnText}}<br/>Gateway</p> + </li> + <li class="three-box" > + <p>{{outerData.mbps}} Mbps/yyyG</p> + <p> + {{outerData.msText}} ms + </p> + <p [ngClass]="{'online-type':outerData.orchestration_status!=='deactivated','offline-type':outerData.orchestration_status=='deactivated'}"></p> + <p class="">Link Type:{{outerData.linkType}}</p> + </li> + <li> + <p>{{outerData.tnEndVersion}}</p> + <p> + <img src="../../../../../../../assets/images/tn-edge-img.png" class="tnImg"/> + </p> + <p>{{outerData.tnEndText}}<br/>Gateway</p> + </li> + <li class="vLan-line"> + <p > + vLan:{{outerData.cnVlan}} + </p> + <p class="online-vlan"></p> + </li> + <li> + <p> + <img src="../../../../../../../assets/images/cn-cloud-img.jpg" class="cnCloud"/> + </p> + <p>{{outerData.cnVersion}}</p> + </li> + </ul> + </div> </nz-list> </nz-spin>
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.less index afccd61f..60dc8e59 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.less +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.less @@ -1,3 +1,62 @@ .taskmodel_list{ margin-top: 20px; } +a{ + text-decoration: none; +} +.header{ + display: flex; + justify-content: space-around; + align-items: center; + height: 40px; + line-height: 40px; + color:#000; + margin:10px 20px; +} +.anImg{ + width: 60px; + height: 85px; +} +.list-box{ + display: flex; + justify-content:center; + align-items: center; + +} +.list-box li{ + position: relative; +} +.clear{ + clear: both; +} +.online-vlan{ + width: 100px; + height: 1px; + background: #000; +} +.online-type{ + width: 200px; + height: 3px; + background: #6a9bd0; +} +.offline-type{ + width: 200px; + height: 3px; + background: #7e848a; +} +.vLan-line{ + text-align: center; + top:-20px; +} +.tnImg{ + width: 85px; + height: 85px; +} +.three-box{ + text-align: center; + top:-20px; +} +.cnCloud{ + width: 230px; + height: 160px; +}
\ No newline at end of file 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 b0207fd7..0bffccf5 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 @@ -24,9 +24,24 @@ export class SlicingBusinessModelComponent implements OnInit { nsiInfo: any[] = []; taskModel: boolean = false; isSpinning: boolean = true; - status: string = "" + status: string = ""; ngOnInit() { console.log(this.businessId, "id",this.outerData); + const param = { + anVersion:'10.2.3.4.5', + vLanText:'111', + tnVersion:'10.0.1.1.1', + tnText:'TN EDGEText', + mbps:'333', + msText:'555', + linkType:'p2p/mp2p', + tnEndVersion:'10.1.1.1', + tnEndText:'TN EDGEText', + cnVlan:'66', + cnVersion:'1.1.2.3' + } + this.outerData = {...this.outerData,...param} + console.log('new',this.outerData) this.status = this.outerData.orchestration_status this.getDetail() } @@ -46,6 +61,7 @@ export class SlicingBusinessModelComponent implements OnInit { }); 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]; } diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html index 640ba3b4..bcd024ec 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html @@ -61,8 +61,9 @@ </div> </td> <td> + <!-- [ngClass]="{'cannotclick':data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100'}" --> <a (click)="showdetail(data)" - [ngClass]="{'cannotclick':data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100'}">View + >View Detail</a> </td> </tr> |