diff options
Diffstat (limited to 'usecaseui-portal/src/app/services/services-list')
-rw-r--r-- | usecaseui-portal/src/app/services/services-list/services-list.component.html | 56 | ||||
-rw-r--r-- | usecaseui-portal/src/app/services/services-list/services-list.component.ts | 96 |
2 files changed, 143 insertions, 9 deletions
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 cfb81703..616d5b39 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 @@ -119,9 +119,11 @@ <nz-progress *ngIf="data.status == 'Creating' || data.status == 'Deleting' || data.status == 'Stopping' || data.status == 'Healing' " [nzPercent]="data.rate"></nz-progress> </td> <td> - <i *ngIf="data.serviceDomain=='E2E Service'||data.serviceDomain=='Network Service' " class="anticon anticon-setting" (click)="scaleService(data)"></i> + <i [ngClass]="{'cannotclick':data.status=='Deleting'||data.status=='Creating'||data.status=='Healing'}" + *ngIf="data.serviceDomain=='E2E Service'||data.serviceDomain=='Network Service' " class="anticon anticon-setting" (click)="scaleService(data)"></i> <!-- <i *ngIf="data.serviceDomain=='E2E Service'||data.serviceDomain=='Network Service' " class="anticon anticon-cloud-upload-o" (click)="updataService(data)"></i> --> - <i *ngIf="data.serviceDomain=='Network Service' " class="anticon anticon-reload" (click)="restartService(data)"></i> + <i [ngClass]="{'cannotclick':data.status=='Deleting'||data.status=='Creating'||data.status=='Healing'}" + *ngIf="data.serviceDomain=='Network Service' " class="anticon anticon-reload" (click)="healService(data)"></i> <i *ngIf="data.serviceDomain=='SOTN'||data.serviceDomain=='CCVPN' " class="anticon anticon-ellipsis" (click)="serviceDetail(data)"></i> <i [ngClass]="{'cannotclick':data.status=='Deleting'||data.status=='Creating'||data.status=='Healing'}" class="anticon anticon-delete" (click)="deleteModel(data)"></i> </td> @@ -137,14 +139,14 @@ <nz-progress *ngIf=" item.status == 'Healing' " [nzPercent]="item.rate"></nz-progress> </td> <td> - <i *ngIf="item.serviceDomain=='vnf'" [ngClass]="{'cannotclick':item.status=='Healing'}" class="anticon anticon-reload" (click)="restartService(item)"></i> + <i *ngIf="item.serviceDomain=='vnf'" [ngClass]="{'cannotclick':item.status=='Healing'}" class="anticon anticon-reload" (click)="healService(item)"></i> </td> </tr> </ng-template> </tbody> </nz-table> <nz-modal [(nzVisible)]="deleteModelVisible" nzTitle="Delete" (nzOnCancel)="deleteCancel()" (nzOnOk)="deleteOk()"> - <h3><i class="anticon anticon-question-circle" style="color:red;"></i>Are you sure delete this instance?</h3> + <h3><i class="anticon anticon-question-circle" style="color:yellow;"></i>Are you sure delete this instance?</h3> Instance ID: <b class="deleteModelContent"> {{ thisService["service-instance-id"] || thisService["nsInstanceId"] }}</b> <div *ngIf="thisService['serviceDomain'] == 'Network Service'"> <span style="display:inline-block;width:50%;">terminationType:</span> @@ -156,6 +158,52 @@ <input *ngIf="terminationType=='graceful'" style="width: 165px;" nz-input [(ngModel)]="gracefulTerminationTimeout"> </div> </nz-modal> + <nz-modal [nzVisible]="healModelVisible" nzTitle="Heal" (nzOnCancel)="healCancel()" (nzOnOk)="healOk()"> + <h3><i class="anticon anticon-question-circle" style="color:yellow;"></i>Are you sure heal this instance?</h3> + Instance ID: <b style="color:green"> {{ thisService["service-instance-id"] || thisService["nsInstanceId"] || thisService["vnfInstanceId"]}}</b> + <!-- NS --> + <div *ngIf="thisService['serviceDomain'] == 'Network Service'"> + <span style="display:inline-block;width:50%;">degreeHealing:</span> + <nz-select style="width: 165px;" [(ngModel)]="nsParams.degreeHealing" > + <nz-option nzValue="HEAL_RESTORE" nzLabel="HEAL_RESTORE"></nz-option> + <nz-option nzValue="HEAL_QOS" nzLabel="HEAL_QOS"></nz-option> + <nz-option nzValue="HEAL_RESET" nzLabel="HEAL_RESET"></nz-option> + <nz-option nzValue="PARTIAL_HEALING" nzLabel="PARTIAL_HEALING"></nz-option> + </nz-select> + <div> + <span style="display:inline-block;">actionsHealing:</span> + <button nz-button [nzType]="'default'" (click)="addActionsHealing()"><i class="anticon anticon-plus-circle-o"></i></button> + <br> + <div *ngFor="let item of healActions;let i = index;" style="display:inline-block;"> + <input style="width: 165px;" nz-input [(ngModel)]="item.value"><button nz-button [nzType]="'dashed'" (click)="minusActionsHealing(i)"><i class="anticon anticon-minus-circle-o"></i></button> + + </div> + </div> + <span style="display:inline-block;width:50%;">healScript:</span> + <input style="width: 165px;" nz-input [(ngModel)]="nsParams.healScript"> + <div> + <span style="display:inline-block;">additionalParamsforNs:</span> + <button nz-button [nzType]="'default'" (click)="addNsAdditional()"><i class="anticon anticon-plus-circle-o"></i></button> + <br> + <div *ngFor="let item of nsAdditional;let i = index;"> + Key: <input style="width: 165px;" nz-input [(ngModel)]="item.key"> + Value: <input style="width: 165px;" nz-input [(ngModel)]="item.value"> + <button nz-button [nzType]="'dashed'" (click)="minusNsAdditional(i)"><i class="anticon anticon-minus-circle-o"></i></button> + </div> + </div> + </div> + <!-- vnf --> + <div *ngIf="thisService['serviceDomain'] == 'vnf'"> + <span style="display:inline-block;width:50%;">cause:</span> + <input style="width: 165px;" nz-input [(ngModel)]="vnfParams.cause"> + <span style="display:inline-block;width:50%;">action:</span> + <input style="width: 165px;" nz-input [(ngModel)]="vnfParams.additionalParams.action"> + <span style="display:inline-block;width:50%;">actionvminfo:</span> + <nz-select style="width: 165px;" [(ngModel)]="vmSelected" > + <nz-option *ngFor="let item of vnfVms" [nzValue]="item" [nzLabel]="item.vmName"></nz-option> + </nz-select> + </div> + </nz-modal> </div> <div class="detailComponent" *ngIf="detailshow"> 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 aecc6f2c..9da7cf9c 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 @@ -166,19 +166,88 @@ export class ServicesListComponent implements OnInit { this.getTableData(); } + thisService = {}; //The current service of the operation scaleService(){ console.log("scaleService!"); } updataService(){ console.log("updataService!"); } - stopService(data){ + //heal + healModelVisible = false; + healActions = []; + nsAdditional = []; + nsParams = { + degreeHealing:"HEAL_RESTORE", + actionsHealing: [ + + ], + healScript: "", + additionalParamsforNs: "" } - restartService(data){ - + vnfVms = []; + vmSelected = {}; + vnfParams = { + vnfInstanceId: "", + cause: "", + additionalParams: { + action: "", + actionvminfo: { + vmid: "", + vduid: "", + vmname: "" + } + } } - // + addActionsHealing(){ + this.healActions.push({value:""}) + } + minusActionsHealing(index){ + this.healActions.splice(index,1); + } + addNsAdditional(){ + this.nsAdditional.push({key:"",value:""}) + } + minusNsAdditional(index){ + this.nsAdditional.splice(index,1); + } + healService(service){ + // console.log(service); + this.thisService = service; + this.healModelVisible = true; + if(service.serviceDomain == "vnf"){ + this.vnfParams.vnfInstanceId = service.vnfInstanceId; + this.myhttp.getVnfInfo(service.vnfInstanceId) + .subscribe((data)=>{ + // console.log(data); + this.vnfVms = data.vnfVms; + this.vmSelected = this.vnfVms[0]; + }) + } + } + healOk(){ + this.healModelVisible = false; + // nsParams + this.nsParams.actionsHealing = this.healActions.map((item)=>{return item.value}); + let additional = {}; + this.nsAdditional.forEach((item)=>{ + additional[item.key] = item.value; + }); + this.nsParams.additionalParamsforNs = JSON.stringify(additional); + // vnfParams + this.vnfParams.additionalParams.actionvminfo.vmid = this.vmSelected["vmId"]; + this.vnfParams.additionalParams.actionvminfo.vmname = this.vmSelected["vmName"]; + + let requestBody = this.thisService["serviceDomain"] == "Network Service" ? {healNsData:this.nsParams} : {healVnfData:this.vnfParams}; + console.log(requestBody); + this.healNsVnfService(this.thisService,requestBody); + } + healCancel(){ + this.healModelVisible = false; + } + + // show detail detailshow = false; detailData:Object; serviceDetail(service){ @@ -199,7 +268,6 @@ export class ServicesListComponent implements OnInit { console.log(service); } - thisService = {}; deleteModelVisible = false; terminationType = "graceful"; gracefulTerminationTimeout = 120; @@ -443,6 +511,24 @@ export class ServicesListComponent implements OnInit { return mypromise; } + healNsVnfService(service,requestBody){ + console.log(service); + service.rate = 0; + service.status = "Healing"; + this.myhttp.healNsService(service.nsInstanceId,requestBody) + .subscribe((data)=>{ + let jobid = data.jobId; + let updata = (prodata)=>{ + service.rate = prodata.responseDescriptor.progress; + } + this.queryNsProgress(jobid,updata).then((data1)=>{ + console.log(data1); + service.rate = 100; + service.status = "Active"; + }); + }) + } + deleteService(service){ let allprogress = {}; // let querypros = []; // |