From 88476a52e2f415becbed122416a4ca137016f49c Mon Sep 17 00:00:00 2001 From: wangyuerg Date: Fri, 5 Mar 2021 16:59:51 +0800 Subject: feat:drawing Signed-off-by: wangyuerg Change-Id: Ifef7f2e08a18220f0464227352993479b3db0d70 Issue-ID: USECASEUI-527 --- .../business-order/business-order.component.html | 2 +- .../business-order/business-order.component.less | 9 ++-- .../slicing-business-model.component.html | 57 ++++++++++++++++++++- .../slicing-business-model.component.less | 59 ++++++++++++++++++++++ .../slicing-business-model.component.ts | 18 ++++++- .../slicing-business-table.component.html | 3 +- 6 files changed, 141 insertions(+), 7 deletions(-) (limited to 'usecaseui-portal/src/app/views') diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html index e95e2452..7fd459cc 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html +++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html @@ -18,7 +18,7 @@

Note: If coverageArea is not at all provided by the user (as it is an optional input, and also optional in Service Profile), we will assume that the entire network is required to be covered. For Coverage Area Number, please enter the rectangle grid numbers corresponding to the physical coverage areas that you see on the map image. The following image shows the rectangular grid numbers for a coverage area, you can take it as an example:

- ? + diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.less b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.less index c0b15eb3..4feac5d7 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.less +++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.less @@ -40,7 +40,7 @@ text-indent: 2em; position: absolute; right: -200px; - top: -458px; + top: -430px; color:#ffffff; p{ padding: 10px 10px 0 10px; @@ -49,7 +49,10 @@ } .detail-icon{ position: absolute; - right: -16px; + right: -26px; + bottom:-2px; + width:20px; + height:20px; cursor: pointer; } @@ -58,7 +61,7 @@ cursor: pointer; content: ''; display: block; position: absolute; - right: 178px; + right: 175px; bottom: -16px; border: 20px solid transparent; border: 8px solid transparent; 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 @@
status:{{status}}
- example + +
+
+

AN

+

TN

+

CN

+
+
    +
  • +

    + +

    +

    {{outerData.anVersion}}

    +
    • +
  • +

    + vLan:{{outerData.vLanText}} +

    +

    +
    • +
  • +

    {{outerData.tnVersion}}

    +

    + +

    +

    {{outerData.tnText}}
    Gateway

    +
    • +
  • +

    {{outerData.mbps}} Mbps/yyyG

    +

    + {{outerData.msText}} ms +

    +

    +

    Link Type:{{outerData.linkType}}

    +
    • +
  • +

    {{outerData.tnEndVersion}}

    +

    + +

    +

    {{outerData.tnEndText}}
    Gateway

    +
    • +
  • +

    + vLan:{{outerData.cnVlan}} +

    +

    +
    • +
  • +

    + +

    +

    {{outerData.cnVersion}}

    +
    • +
+
\ 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 @@ + View + >View Detail -- cgit 1.2.3-korg