From 4d526a0771ad93b1ab9807b413ad33f5b28fc8f6 Mon Sep 17 00:00:00 2001 From: guochuyicmri Date: Fri, 2 Nov 2018 10:21:26 +0800 Subject: delete nsService function Change-Id: Ied7b698ee77084e57fc2b7f36aa4aef1b47ed291 Issue-ID: USECASEUI-161 Signed-off-by: guochuyicmri --- usecaseui-portal/src/app/myhttp.service.ts | 18 ++ .../services-list/services-list.component.css | 34 ++-- .../services-list/services-list.component.html | 45 +++-- .../services-list/services-list.component.less | 38 ++-- .../services-list/services-list.component.ts | 197 +++++++++++++-------- 5 files changed, 191 insertions(+), 141 deletions(-) diff --git a/usecaseui-portal/src/app/myhttp.service.ts b/usecaseui-portal/src/app/myhttp.service.ts index 1c36d881..14d81aef 100644 --- a/usecaseui-portal/src/app/myhttp.service.ts +++ b/usecaseui-portal/src/app/myhttp.service.ts @@ -32,6 +32,9 @@ export class MyhttpService { // ns_createService2: this.baseUrl + "/createNsService2.json", // inputNamesTransform: this.baseUrl + "/configuration_files/inputNamesTranslate.json?", // deleteService: this.baseUrl + "/deleteService.json?", + // ns_deleteService: this.baseUrl + "/deleteNsService.json?", + // ns_stopService: this.baseUrl + "/stopNsService.json?", + // ns_healService: this.baseUrl + "/healNsService.json?", // progress:this.baseUrl + "/progress.json?", // nsProgress:this.baseUrl + "nsProgress.json?", @@ -69,6 +72,9 @@ export class MyhttpService { ns_createService2: this.baseUrl + "/uui-lcm/instantiateNetworkServiceInstance", inputNamesTransform: "./assets/json/configuration_files/inputNamesTranslate.json?", deleteService: this.baseUrl + "/uui-lcm/services/", + ns_deleteService: this.baseUrl + "/uui-lcm/deleteNetworkServiceInstance?ns_instance_id=", + ns_stopService: this.baseUrl + "/uui-lcm/terminateNetworkServiceInstance?ns_instance_id=", + ns_healService: this.baseUrl + "/uui-lcm/healNetworkServiceInstance?ns_instance_id=", progress:this.baseUrl + "/uui-lcm/services/" + "*_*" + "/operations/", nsProgress:this.baseUrl + "/uui-lcm/jobs/getNsLcmJobStatus/"+ "*_*" + "?responseId=", @@ -207,6 +213,18 @@ export class MyhttpService { // return this.http.get(this.url.deleteService); //Local simulation return this.http.delete(this.url.deleteService + obj.serviceInstanceId, httpOptions); } + nsDeleteInstance(id){ + // return this.http.get(this.url.ns_deleteService); //Local simulation + return this.http.delete(this.url.ns_deleteService + id); + } + stopNsService(id,requestBody){ //You need to terminate before deleting + // return this.http.get(this.url.ns_stopService); //Local simulation + return this.http.post(this.url.ns_stopService + id,requestBody); + } + healNsService(id,requestBody){ + // return this.http.get(this.url.ns_healService); //Local simulation + return this.http.post(this.url.ns_healService + id,requestBody); + } // Query progress interface getProgress(obj){ diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.css b/usecaseui-portal/src/app/services/services-list/services-list.component.css index 63426fd9..1f9d051a 100644 --- a/usecaseui-portal/src/app/services/services-list/services-list.component.css +++ b/usecaseui-portal/src/app/services/services-list/services-list.component.css @@ -96,6 +96,14 @@ hr { font-size: 12px; color: green; } +.list nz-table tbody td span.stopping { + font-size: 12px; + color: purple; +} +.list nz-table tbody td span.healing { + font-size: 12px; + color: orangered; +} .list nz-table tbody td i.anticon { cursor: pointer; font-size: 18px; @@ -104,34 +112,14 @@ hr { .list nz-table tbody td i.anticon:hover { color: #147dc2; } -.list nz-table tbody tr.childtr td { - font-size: 12px; - color: #147dc2; -} -.list nz-table.table2 tr td { - padding: 10px 8px; -} -.list nz-table.table2 tr td span.action { - color: #3fa8eb; - cursor: pointer; - padding: 5px; -} -.list nz-table.table2 tr td span.cannotclick { +.list nz-table tbody td .cannotclick { pointer-events: none; color: #aaa; opacity: 0.6; } -.list nz-table.table2 tr td span.deleting { - color: red; - font-size: 12px; - display: block; - height: 12px; -} -.list nz-table.table2 tr td span.creating { - color: #3fa8eb; +.list nz-table tbody tr.childtr td { font-size: 12px; - display: block; - height: 12px; + color: #147dc2; } .detailComponent { position: absolute; diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.html b/usecaseui-portal/src/app/services/services-list/services-list.component.html index c18d294a..cfb81703 100644 --- a/usecaseui-portal/src/app/services/services-list/services-list.component.html +++ b/usecaseui-portal/src/app/services/services-list/services-list.component.html @@ -37,7 +37,7 @@ - + Service: @@ -93,11 +93,11 @@ [nzScroll]="{ y: '58vh' }" (nzPageIndexChange)="searchData()" (nzPageSizeChange)="searchData(true)"> - + NO - Service Instance Id + Service Instance Id Name Type Status @@ -114,33 +114,48 @@ {{data.serviceDomain}} {{data.status || "Active"}} - - + 'updating':data.status=='Updating','deleting':data.status=='Deleting','creating':data.status=='Creating', + 'stopping':data.status=='Stopping','healing':data.status=='Healing'}">{{data.status || "Active"}} + - - - + - {{data["service-instance-id"] || data.nsInstanceId}} - {{data["service-instance-name"] || data.nsName}} - {{item.serviceDomain}} + {{item["service-instance-id"] || item.nsInstanceId || item.vnfInstanceId}} + {{item["service-instance-name"] || item.nsName || item.vnfInstanceName}} + {{item.serviceDomain}} + + {{item.status || "Active"}} + + + + + + +

Are you sure delete this instance?

+ Instance ID: {{ thisService["service-instance-id"] || thisService["nsInstanceId"] }} +
+ terminationType: + + + + + gracefulTerminationTimeout: + +
+
diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.less b/usecaseui-portal/src/app/services/services-list/services-list.component.less index 8f83cc9d..3d9962d2 100644 --- a/usecaseui-portal/src/app/services/services-list/services-list.component.less +++ b/usecaseui-portal/src/app/services/services-list/services-list.component.less @@ -99,6 +99,14 @@ hr { font-size: 12px; color: green; } + span.stopping { + font-size: 12px; + color: purple; + } + span.healing { + font-size: 12px; + color: orangered; + } i.anticon { cursor: pointer; font-size: 18px; @@ -107,6 +115,11 @@ hr { color: #147dc2; } } + .cannotclick { + pointer-events: none; + color: #aaa; + opacity: 0.6; + } } tr.childtr { td { @@ -118,31 +131,6 @@ hr { } } -.list nz-table.table2 tr td { - padding: 10px 8px; -} -.list nz-table.table2 tr td span.action { - color: #3fa8eb; - cursor: pointer; - padding: 5px; -} -.list nz-table.table2 tr td span.cannotclick { - pointer-events: none; - color: #aaa; - opacity: 0.6; -} -.list nz-table.table2 tr td span.deleting { - color: red; - font-size: 12px; - display: block; - height: 12px; -} -.list nz-table.table2 tr td span.creating { - color: #3fa8eb; - font-size: 12px; - display: block; - height: 12px; -} .detailComponent { position: absolute; diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.ts b/usecaseui-portal/src/app/services/services-list/services-list.component.ts index 9ea28d4b..aecc6f2c 100644 --- a/usecaseui-portal/src/app/services/services-list/services-list.component.ts +++ b/usecaseui-portal/src/app/services/services-list/services-list.component.ts @@ -68,7 +68,7 @@ export class ServicesListComponent implements OnInit { // Create modal box 2 (dialog box) create ------------------------------- isVisible = false; - showModal(): void { + createModal(): void { this.isVisible = true; this.getAlltemplates(); } @@ -103,13 +103,12 @@ export class ServicesListComponent implements OnInit { } - // createshow = false; createshow2 = false; createData:Object={}; handleOk(): void { - console.log('Button ok clicked!'); + // console.log('Button ok clicked!'); this.isVisible = false; if(this.templateTypeSelected=="SOTN"||this.templateTypeSelected=="CCVPN"){ @@ -135,34 +134,35 @@ export class ServicesListComponent implements OnInit { pageSize = 10; total = 100; loading = false; - sortName = null; - sortValue = null; + getTableData(){ // params: customer serviceType pageIndex，pageSize，sortName let paramsObj = { customer:this.customerSelected.id, serviceType:this.serviceTypeSelected.name, pageIndex:this.pageIndex, - pageSize:this.pageSize, - serviceIdSort:this.sortValue + pageSize:this.pageSize } this.myhttp.getServicesTableData(paramsObj) .subscribe((data)=>{ console.log(data); this.total = data.body.total; - this.tableData = data.body.tableList; + this.tableData = data.body.tableList.map((item)=>{ + if(item["serviceDomain"]=="Network Service"){ + item["childServiceInstances"] = item["vnfInfo"].map((vnf)=>{ + vnf["serviceDomain"] = "vnf"; + return vnf; + }); + } + return item; + }) },(err)=>{ console.log(err); }) } - sort(sort: { key: string, value: string }): void { - console.log(sort); - this.sortName = sort.key; - this.sortValue = sort.value; - this.getTableData(); - } + searchData(reset:boolean = false){ - console.log(reset) + // console.log(reset) this.getTableData(); } @@ -198,68 +198,27 @@ export class ServicesListComponent implements OnInit { this.detailData = service; console.log(service); } - // deleteService(){ - // console.log("deleteService!"); - // } - - // - deleteService(service){ - this.modalService.confirm({ - nzTitle : 'Are you sure delete this instance?', - nzContent : `Instance ID: ${service["service-instance-id"]}`, - nzOkText : 'Yes', - nzOkType : 'danger', - nzOnOk : () => { - console.log(service); - let allprogress = {}; // - let querypros = []; // - service.rate = 0; - service.status = "Deleting"; - - service["childServiceInstances"].push({"service-instance-id":service["service-instance-id"]}) - - let deletePros = service["childServiceInstances"].map((item)=>{ - let params = { - globalSubscriberId:this.customerSelected.id, - serviceType:this.serviceTypeSelected, - serviceInstanceId:item["service-instance-id"] - } - return new Promise((res,rej)=>{ - this.myhttp.deleteInstance(params) - .subscribe((data)=>{ - let obj = {serviceId:params.serviceInstanceId,operationId:data.operationId} - let updata = (prodata)=>{ - allprogress[prodata.operationId] = prodata.progress; - let average = ((arr)=>{return eval(arr.join("+"))/arr.length})(Object.values(allprogress)); - service["rate"]=average; - } - querypros.push(this.queryProgress(obj,updata)); - res(); - }) - }) - }) - console.log(deletePros) - Promise.all(deletePros).then(()=>{ - Promise.all(querypros).then((data)=>{ - console.log(data); - service.rate = 100; - service.status = "completed"; - let hasUndone = this.tableData.some((item)=>{ - return item.rate < 100; - }) - if(!hasUndone){ - setTimeout(()=>{ - this.getTableData(); - },1000) - } - }) - }) + thisService = {}; + deleteModelVisible = false; + terminationType = "graceful"; + gracefulTerminationTimeout = 120; + // delete Model show + deleteModel(service){ + this.thisService = service; + this.deleteModelVisible = true; + } + deleteOk(){ + this.deleteModelVisible = false; + if(this.thisService["serviceDomain"] == "Network Service"){ + this.deleteNsService(this.thisService); + }else{ + this.deleteService(this.thisService); + } + } - }, - nzCancelText: 'No', - nzOnCancel : () => console.log('Cancel') - }); + deleteCancel(){ + this.deleteModelVisible = false; } //ccvpn sotn createservice @@ -461,8 +420,6 @@ export class ServicesListComponent implements OnInit { },1000) } }) - - }) } @@ -485,7 +442,91 @@ export class ServicesListComponent implements OnInit { }) return mypromise; } - + + deleteService(service){ + let allprogress = {}; // + let querypros = []; // + service.rate = 0; + service.status = "Deleting"; + + service["childServiceInstances"].push({"service-instance-id":service["service-instance-id"]}); + let deletePros = service["childServiceInstances"].map((item)=>{ + let params = { + globalSubscriberId:this.customerSelected.id, + serviceType:this.serviceTypeSelected, + serviceInstanceId:item["service-instance-id"] + } + return new Promise((res,rej)=>{ + this.myhttp.deleteInstance(params) + .subscribe((data)=>{ + let obj = {serviceId:params.serviceInstanceId,operationId:data.operationId} + let updata = (prodata)=>{ + allprogress[prodata.operationId] = prodata.progress; + let average = ((arr)=>{return eval(arr.join("+"))/arr.length})(Object.values(allprogress)); + service["rate"]=average; + } + querypros.push(this.queryProgress(obj,updata)); + res(); + }) + }) + }) + // console.log(deletePros) + Promise.all(deletePros).then(()=>{ + Promise.all(querypros).then((data)=>{ + console.log(data); + service.rate = 100; + service.status = "completed"; + let hasUndone = this.tableData.some((item)=>{ + return item.rate < 100; + }) + if(!hasUndone){ + setTimeout(()=>{ + this.getTableData(); + },1000) + } + }) + }) + } + deleteNsService(service){ + service.rate = 0; + service.status = "Deleting"; + let id = service.nsInstanceId; + let requestBody = { + terminationType : this.terminationType, + gracefulTerminationTimeout : this.gracefulTerminationTimeout + } + this.stopNsService(id,requestBody).then((jobid)=>{ + let updata = (prodata)=>{ + service.rate = prodata.responseDescriptor.progress; + } + return this.queryNsProgress(jobid,updata); + }).then(()=>{ + this.myhttp.nsDeleteInstance(id) + .subscribe((data)=>{ + console.log(data); + service.rate = 100; + service.status = "completed"; + let hasUndone = this.tableData.some((item)=>{ + return item.rate < 100; + }) + if(!hasUndone){ + setTimeout(()=>{ + this.getTableData(); + },1000) + } + }) + }) + } + + stopNsService(id,obj){ + let mypromise = new Promise((res,rej)=>{ + this.myhttp.stopNsService(id,obj) + .subscribe((data)=>{ + res(data.jobId); + }) + }) + return mypromise; + } queryProgress(obj,callback){ let mypromise = new Promise((res,rej)=>{ // let data = { -- cgit 1.2.3-korg