diff options
Diffstat (limited to 'usecaseui-portal/src/app/views/services/services-list/services-list.component.html')
| -rw-r--r-- | usecaseui-portal/src/app/views/services/services-list/services-list.component.html | 474 |
1 files changed, 132 insertions, 342 deletions
diff --git a/usecaseui-portal/src/app/views/services/services-list/services-list.component.html b/usecaseui-portal/src/app/views/services/services-list/services-list.component.html index a995b485..216e92df 100644 --- a/usecaseui-portal/src/app/views/services/services-list/services-list.component.html +++ b/usecaseui-portal/src/app/views/services/services-list/services-list.component.html @@ -14,7 +14,6 @@ limitations under the License. --> <div class="action ant-tabs-bar"> - <span> <i class="icon"> <img src="assets/images/customer.png" alt=""> @@ -51,88 +50,26 @@ <i *ngIf="width>1200" class="anticon anticon-plus"></i> <span> {{"i18nTextDefine_Create" | translate}} </span> </button> - <nz-modal nzWidth="428" [(nzVisible)]="isVisible" nzTitle=" {{'i18nTextDefine_ServiceCreation' | translate}} " - (nzOnCancel)="handleCancel()" - (nzOnOk)="handleOk()" nzClassName="serviceCreationModel" - nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " - nzOkText=" {{'i18nTextDefine_modelOk' | translate}} "> - <div class="select-list"> - <span style="display:inline-block;"> {{"i18nTextDefine_Customer" | translate}} : </span> - <nz-select style="width: 176px;float: right;" [(ngModel)]="customerSelected2.name" nzAllowClear - (ngModelChange)="customerChange()"> - <nz-option *ngFor="let item of customerList2" [nzValue]="item.name" [nzLabel]="item.name"></nz-option> - </nz-select> - </div> - <div class="select-list"> - <span style="display:inline-block;"> {{"i18nTextDefine_ServiceType" | translate}} : </span> - <nz-select style="width: 176px;float: right;" [(ngModel)]="serviceTypeSelectedName" nzAllowClear - (ngModelChange)="serviceTypeChange()"> - <nz-option *ngFor="let item of serviceTypeList2" [nzValue]="item.name" [nzLabel]="item.name"> - </nz-option> - </nz-select> - </div> - <div class="select-list"> - <span style="display:inline-block;"> {{"i18nTextDefine_UseCase" | translate}} : </span> - <nz-select style="width: 176px;float: right;" [(ngModel)]="templateTypeSelected" nzAllowClear - (ngModelChange)="choseTemplateType()"> - <nz-option nzValue="SOTN" nzLabel="SOTN"></nz-option> - <nz-option nzValue="CCVPN" nzLabel="CCVPN"></nz-option> - <nz-option nzValue="E2E Service" nzLabel="E2E Service"></nz-option> - <nz-option nzValue="Network Service" nzLabel="Network Service"></nz-option> - </nz-select> - </div> - - <div class="select-list"> - <span style="display:inline-block;width:70px;"> {{"i18nTextDefine_Template" | translate}} : </span> - <nz-select style="width: 176px;float: right;" [(ngModel)]="template1" nzAllowClear> - <nz-option *ngFor="let item of templates" [nzValue]="item" [nzLabel]="item.name"></nz-option> - </nz-select> - </div> - <div *ngIf="templateTypeSelected == 'E2E Service'"> - <div class="select-list"> - <span style="display:inline-block;width:70px;"> {{"i18nTextDefine_Orchestrator" | translate}} : </span> - <nz-select style="width: 176px;float: right;" [(ngModel)]="orchestratorSelected" nzAllowClear> - <nz-option *ngFor="let item of orchestratorList" [nzValue]="item" [nzLabel]="item.name"></nz-option> - </nz-select> - </div> - </div> - <div *ngIf="templateTypeSelected == 'E2E Service'"> - <div class="check-box" style="margin:30px; height: 50px"> - <input class="check-box-style" style="zoom: 1.8; width: 70px" type="checkbox" - [(ngModel)]="isSol005Interface" value="true" nzAllowClear> - <label class="label" style="font-size: 20px; color: rgb(60,79,140,0.5)">Sol005</label> - </div> - </div> - <div class="select-list" style="color: red;margin-left: 66px;" *ngIf="temParametersTips"> - {{"i18nTextDefine_Templateparsingfailed" | translate}} - </div> - </nz-modal> + <app-create-model *ngIf="isVisible" [isVisible]="isVisible" (cancel)="isVisible=$event" (createdModalShow)="createdModalShow($event)" + [customerList]="customerList" [serviceTypeList]="serviceTypeList" [customerSelected]="customerSelected" [serviceTypeSelected]="serviceTypeSelected"> + </app-create-model> + </div> -<nz-layout style=" padding: 20px 32px; "> - <ul class="top-num"> - <li *ngFor="let item of serviceMunber" class="top-list"> - <span class="round">{{item.serviceDomain}}</span> - <div class="top-list-text"> - <p> - <span>{{item.failed}}</span> - <span> {{"i18nTextDefine_Failed" | translate}} </span> - </p> - <p> - <span>{{item.Success}}</span> - <span> {{"i18nTextDefine_Success" | translate}} </span> - </p> - <p> - <span>{{item.InProgress}}</span> - <span> {{"i18nTextDefine_InProgress" | translate}} </span> - </p> - <p class="service-description"> {{item.detailName | translate}} </p> - </div> - </li> - </ul> - <div class="list" id="services-list" [ngClass]="{'listdisplay':listDisplay == true}"> - <nz-table *ngIf="1" #nzTable [nzData]="tableData" nzShowSizeChanger [nzFrontPagination]="false" +<nz-layout> + <div class="top-num"> + <app-top-card + *ngFor="let item of serviceNunber" + [serviceDomain]="item.serviceDomain" + [successNum]="item.Success" + [failedNum]="item.failed" + [inProgressNum]="item.InProgress" + [serviceDetailName]="item.detailName"> + </app-top-card> + </div> + <div class="list" id="services-list" [ngClass]="{'listdisplay':listDisplay === true}"> + <nz-table #nzTable [nzData]="tableData" nzShowSizeChanger [nzFrontPagination]="false" [nzShowQuickJumper]="true" [nzPageSizeOptions]="[5,10,15,20]" [nzTotal]='total' [(nzPageSize)]="pageSize" - [(nzPageIndex)]='pageIndex' [nzLoading]="loading" [nzSize]="'middle'" [nzScroll]="{ y: '58vh' }" + [(nzPageIndex)]='pageIndex' [nzLoading]="loading" [nzSize]="'middle'" (nzPageIndexChange)="searchData()" (nzPageSizeChange)="searchData(true)"> <thead> <tr> @@ -153,31 +90,30 @@ <td>{{data["service-instance-name"] || data.nsName}}</td> <td>{{data["service-instance-id"] || data.nsInstanceId}}</td> <td> - <p - [ngClass]="{'e2eColor':data.serviceDomain=='E2E Service','nsColor':data.serviceDomain=='Network Service','ccvpnColor':data.serviceDomain=='CCVPN','sotnColor':data.serviceDomain=='SOTN','voLTEColor':data.serviceDomain=='voLTE type'}"> + <p class="usecase"> {{data.serviceDomain}} </p> </td> <td> - <span [ngClass]="{'active':data.statusClass=='2001','closed':data.statusClass=='Closed','onboarding':data.statusClass=='Onboarding', - 'updating':data.statusClass=='Updating','deleting':data.statusClass=='1002','creating':data.statusClass=='1001', - 'scaling':data.statusClass=='1003','healing':data.statusClass=='1004'}" - *ngIf="data.tips != 'Available' && data.tips != 'Unavailable'">{{data.tips}}</span> - <span *ngIf="data.tips == 'Available' " style="margin-left: 10px"> + <span [ngClass]="{'active':data.statusClass==='2001','closed':data.statusClass==='Closed','onboarding':data.statusClass==='Onboarding', + 'updating':data.statusClass==='Updating','deleting':data.statusClass==='1002','creating':data.statusClass==='1001', + 'scaling':data.statusClass==='1003','healing':data.statusClass==='1004'}" + *ngIf="data.tips !== 'Available' && data.tips !== 'Unavailable'">{{data.tips}}</span> + <span *ngIf="data.tips === 'Available' " class="marginLeft10"> <img src="assets/images/wancheng-icon.png" alt="Available"> </span> - <span *ngIf="data.tips == 'Unavailable' " style="margin-left: 10px"> + <span *ngIf="data.tips === 'Unavailable' " class="marginLeft10"> <img src="assets/images/shibai-icon.png" alt="Unavailable"> </span> - <nz-progress *ngIf="data.status == 'In Progress'" [nzPercent]="data.rate" + <nz-progress *ngIf="data.status === 'In Progress'" [nzPercent]="data.rate" [nzShowInfo]="false" nzStatus="active"></nz-progress> </td> <td> - <i [ngClass]="{'cannotclick':data.status == 'In Progress'||(data.status=='Failed' && data.operationType=='1001')||(data.status=='Failed' && data.operationType=='1002')}" + <i [ngClass]="{'cannotclick':data.status === 'In Progress'||(data.status=='Failed' && data.operationType=='1001')||(data.status==='Failed' && data.operationType=='1002')}" class="anticon anticon-bars" (click)="serviceDetail(data,1)"></i> - <i [ngClass]="{'cannotclick':data.status == 'In Progress'}" class="anticon anticon-delete" + <i [ngClass]="{'cannotclick':data.status === 'In Progress'}" class="anticon anticon-delete" (click)="deleteModel(data)"></i> - <i [ngClass]="{'cannotclick':data.status == 'In Progress'}" class="anticon anticon-ellipsis" + <i [ngClass]="{'cannotclick':data.status === 'In Progress'}" class="anticon anticon-ellipsis" (click)="iconMoreShow(data,tableData)" style="transform: rotate(90deg);"></i> <ul *ngIf="data.iconMore==true " class="icon-more"> @@ -218,255 +154,50 @@ </tbody> </nz-table> - <nz-modal nzWidth="428" [nzVisible]="scaleModelVisible" nzTitle=" {{'i18nTextDefine_Scale' | translate}} " - (nzOnCancel)="scaleCancel()" (nzOnOk)="scaleOk(templatescalestarting,templateScaleSuccessFaild)" - nzClassName="scaleModel" nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " - nzOkText=" {{'i18nTextDefine_modelOk' | translate}} "> - <h3><span style="color: red">* </span> {{"i18nTextDefine_SureScale" | translate}} </h3> - <div class="question"> - <h4> {{"i18nTextDefine_InstanceID" | translate}} :</h4> - <div class="scaleModelContent" style="width: 100%">{{ thisService["service-instance-id"] || - thisService["nsInstanceId"] || - thisService["vnfInstanceId"]}} - </div> - </div> - <div *ngFor="let item of e2e_nsData" style="margin-top: 20px"> - <h3>{{ item.netWorkServiceName }}</h3> - <div class="e2eScaleContent"> - <span class="e2eScaleLable"> {{"i18nTextDefine_ScaleType" | translate}} :</span> - <nz-select style="width: 165px;" [(ngModel)]="item.scaleType"> - <nz-option nzValue="SCALE_NS" nzLabel="SCALE_NS"></nz-option> - <nz-option nzValue="SCALE_VNF" nzLabel="SCALE_VNF"></nz-option> - </nz-select> - </div> - <div class="e2eScaleContent"> - <span class="e2eScaleLable"> {{"i18nTextDefine_AspectId" | translate}} :</span> - <input style="width: 165px;" nz-input [(ngModel)]="item.aspectId" placeholder="string"> - </div> - <div class="e2eScaleContent"> - <span class="e2eScaleLable"> {{"i18nTextDefine_Number_Of_Steps" | translate}} :</span> - <nz-input-number style="width: 165px;" [(ngModel)]="item.numberOfSteps" [nzMin]="1" [nzMax]="100" - nzPrecision=0 [nzStep]="1" nzPlaceHolder="number"></nz-input-number> - </div> - <div class="e2eScaleContent"> - <span class="e2eScaleLable"> {{"i18nTextDefine_ScalingDirection" | translate}} :</span> - <nz-select style="width: 165px;" nzPlaceHolder="Chose" [(ngModel)]="item.scalingDirection"> - <nz-option nzValue="SCALE_IN" nzLabel="SCALE_IN"></nz-option> - <nz-option nzValue="SCALE_OUT" nzLabel="SCALE_OUT"></nz-option> - </nz-select> - </div> - </div> - - <ng-template #templatescalestarting> - <div class="ant-notification-notice-content"> - <div class="ant-notification-notice-with-icon"> - <span class="ant-notification-notice-icon"> - <img src="assets/images/execute-inproess.png" alt="instance temination is starting"> - </span> - <div class="ant-notification-notice-message">E2E - {{"i18nTextDefine_InstanceTeminationStarting" | translate}} - </div> - <div class="ant-notification-notice-description"> - <div class="notificationlist"> - <p> {{"i18nTextDefine_InstanceName" | translate}} :</p> - <span>{{ thisService["service-instance-name"] || - thisService["nsInstanceName"] }} - </span> - </div> - <div class="notificationlist"> - <p> {{"i18nTextDefine_Customer" | translate}} :</p> - <span>{{ customerSelected.name }}</span> - </div> - <div class="notificationlist"> - <p> {{"i18nTextDefine_UseCase" | translate}} :</p> - <span>{{ thisService["serviceDomain"] }}</span> - </div> - </div> - <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> - </div> - </div> - </ng-template> - </nz-modal> - - <nz-modal nzWidth="428" [(nzVisible)]="deleteModelVisible" nzTitle=" {{'i18nTextDefine_delete' | translate}} " - (nzOnCancel)="deleteCancel()" (nzOnOk)="deleteOk(templatedeletestarting,templateDeleteSuccessFaild)" - nzClassName="{{thisService['serviceDomain'] == 'Network Service'?'nsdeleteModel':'deleteModel'}}" - nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " - nzOkText=" {{'i18nTextDefine_modelOk' | translate}} "> - <h3><span style="color: red">* </span> {{"i18nTextDefine_SureDelete" | translate}} </h3> - <div class="question"> - <h4> {{"i18nTextDefine_InstanceName" | translate}} :</h4> - <div class="deleteModelContent">{{ thisService["service-instance-name"] || - thisService["nsInstanceName"] }} - </div> - </div> - <div class="question"> - <h4> {{"i18nTextDefine_InstanceID" | translate}} :</h4> - <div class="deleteModelContent">{{ thisService["service-instance-id"] || - thisService["nsInstanceId"] }} - </div> - </div> - <div *ngIf="thisService['serviceDomain'] == 'Network Service'"> - <div class="question"> - <h4> {{"i18nTextDefine_terminationType" | translate}} :</h4> - <nz-select style="width: 306px;" [(ngModel)]="terminationType"> - <nz-option nzValue="graceful" nzLabel=" {{'i18nTextDefine_graceful' | translate}} "></nz-option> - <nz-option nzValue="forceful" nzLabel=" {{'i18nTextDefine_forceful' | translate}} "></nz-option> - </nz-select> - </div> - <div class="question"> - <h4 *ngIf="terminationType=='graceful'"> {{"i18nTextDefine_gracefulTerminationTimeout" | translate}} - :</h4> - <input *ngIf="terminationType=='graceful'" style="width: 306px;" nz-input - [(ngModel)]="gracefulTerminationTimeout"> - </div> - </div> - - <ng-template #templatedeletestarting> - <div class="ant-notification-notice-content"> - <div class="ant-notification-notice-with-icon"> - <span class="ant-notification-notice-icon"> - <img src="assets/images/execute-inproess.png" alt="instance temination is starting"> - </span> - <div class="ant-notification-notice-message" - *ngIf="thisService['serviceDomain'] == 'CCVPN' || thisService['serviceDomain'] == 'SOTN'"> - {{ thisService['serviceDomain'] }} {{"i18nTextDefine_InstanceTeminationStarting" | - translate}} - </div> - <div class="ant-notification-notice-message" - *ngIf="thisService['serviceDomain'] == 'E2E Service'">E2E - {{"i18nTextDefine_InstanceTeminationStarting" | translate}} - </div> - <div class="ant-notification-notice-message" - *ngIf="thisService['serviceDomain'] == 'Network Service'">NS - {{"i18nTextDefine_InstanceTeminationStarting" | translate}} - </div> - <div class="ant-notification-notice-description"> - <div class="notificationlist"> - <p> {{"i18nTextDefine_InstanceName" | translate}} :</p> - <span>{{ thisService["service-instance-name"] || - thisService["nsInstanceName"] }} - </span> - </div> - <div class="notificationlist"> - <p> {{"i18nTextDefine_Customer" | translate}} :</p> - <span>{{ customerSelected.name }}</span> - </div> - <div class="notificationlist"> - <p> {{"i18nTextDefine_UseCase" | translate}} :</p> - <span>{{ thisService["serviceDomain"] }}</span> - </div> - </div> - <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> - </div> - </div> - </ng-template> - </nz-modal> - - <nz-modal nzWidth="428" [nzVisible]="healModelVisible" nzTitle=" {{'i18nTextDefine_Heal' | translate}} " - (nzOnCancel)="healCancel()" (nzOnOk)="healOk(templatehealstarting,templatehealSuccessFaild)" - nzClassName="healModel" nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " - nzOkText=" {{'i18nTextDefine_modelOk' | translate}} "> - <h3><span style="color: red">* </span> {{"i18nTextDefine_SureHeal" | translate}} </h3> - <div class="heal-question"> - <p class="heal-label"> {{"i18nTextDefine_InstanceID" | translate}} : </p> - <div class="healModelContent" title="{{ thisService['service-instance-id'] || thisService['nsInstanceId'] || - thisService['vnfInstanceId']}}"> {{ thisService["service-instance-id"] || - thisService["nsInstanceId"] || - thisService["vnfInstanceId"]}} - </div> - </div> - <!-- NS --> - <div *ngIf="thisService['serviceDomain'] == 'Network Service'"> - <div class="question"> - <p class="heal-label"> {{"i18nTextDefine_degreeHealing" | translate}} :</p> - <nz-select style="width: 200px;height:42px;margin-left: 15px;border-radius: 6px" - [(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> - <div> - <span style="display:inline-block;"> {{"i18nTextDefine_actionsHealing" | translate}} :</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%;"> {{"i18nTextDefine_healScript" | translate}} :</span> - <input style="width: 165px;" nz-input [(ngModel)]="nsParams.healScript"> - <div> - <span style="display:inline-block;"> {{"i18nTextDefine_additionalParamsforNs" | translate}} :</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'" style="clear: both"> - <div class="heal-question"> - <p class="heal-label"> {{"i18nTextDefine_cause" | translate}} :</p> - <input nz-input [(ngModel)]="vnfParams.cause" class="heal-input"> - </div> - <div class="heal-question"> - <p class="heal-label"> {{"i18nTextDefine_action" | translate}} :</p> - <input nz-input [(ngModel)]="vnfParams.additionalParams.action" class="heal-input"> - </div> - <div class="heal-question"> - <p class="heal-label"> {{"i18nTextDefine_actionvminfo" | translate}}:</p> - <nz-select - style=" float: right;width: 200px;margin-left: 15px;border-radius: 6px;margin-right: 30px" - [(ngModel)]="vmSelected"> - <nz-option *ngFor="let item of vnfVms" [nzValue]="item" [nzLabel]="item.vmName"></nz-option> - </nz-select> - </div> - </div> - - <ng-template #templatehealstarting> - <div class="ant-notification-notice-content"> - <div class="ant-notification-notice-with-icon"> - <span class="ant-notification-notice-icon"> - <img src="assets/images/execute-inproess.png" alt="instance temination is starting"> - </span> - <div class="ant-notification-notice-message">NS - {{"i18nTextDefine_InstanceHealingStarting" | translate}} - </div> - <div class="ant-notification-notice-description"> - <div class="notificationlist"> - <p> {{"i18nTextDefine_InstanceName" | translate}} :</p> - <span>{{ thisService["service-instance-name"] || - thisService["nsInstanceName"] }} - </span> - </div> - <div class="notificationlist"> - <p> {{"i18nTextDefine_Customer" | translate}} :</p> - <span>{{ customerSelected.name }}</span> - </div> - <div class="notificationlist"> - <p> {{"i18nTextDefine_UseCase" | translate}} :</p> - <span>{{ thisService["serviceDomain"] }}</span> - </div> - </div> - <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> - </div> - </div> - </ng-template> - </nz-modal> + <app-delete-model + *ngIf="deleteModalVisible" + [deleteModalVisible]="deleteModalVisible" + [thisService]="thisService" + [terminationType]="terminationType" + [loadingAnimateShow]="loadingAnimateShow" + [gracefulTerminationTimeout]="gracefulTerminationTimeout" + [templateDeleteSuccessFaild]="templateDeleteSuccessFaild" + (cancel)="deleteModalVisible=$event" + (deleteModalOK)="deleteModalOK($event,templateDeleteSuccessFaild)" + > + </app-delete-model> + <app-scale-model + *ngIf="scaleModelVisible" + [scaleModelVisible]="scaleModelVisible" + [thisService]="thisService" + [e2e_nsData]="e2e_nsData" + [customerSelected]="customerSelected" + [serviceTypeSelected]="serviceTypeSelected" + [templatescalestarting]="templatescalestarting" + [templateScaleSuccessFaild]="templateScaleSuccessFaild" + (cancel)="scaleModelVisible=$event" + (scaleModalOK)="scaleModalOK($event,templatescalestarting,templateScaleSuccessFaild)" + > + </app-scale-model> + <app-heal-model + *ngIf="healModelVisible" + [healModelVisible]="healModelVisible" + [thisService]="thisService" + [nsParams]="nsParams" + [healActions]="healActions" + [nsAdditional]="nsAdditional" + [vnfParams]="vnfParams" + [vmSelected]="vmSelected" + [vnfVms]="vnfVms" + [templatehealstarting]="templatehealstarting" + [templatehealSuccessFaild]="templatehealSuccessFaild" + (cancel)="healModelVisible=$event" + (healModalOK)="healModalOK($event,templatehealstarting,templatehealSuccessFaild)" + ></app-heal-model> + <app-notification #notification [isServicesList]="true" [customerSelected]="customerSelected"></app-notification> <!-- add notification--> + <ng-template #templateCreatestarting> <div class="ant-notification-notice-content"> <div class="ant-notification-notice-with-icon"> @@ -474,7 +205,7 @@ <img src="assets/images/execute-inproess.png" alt="instance temination is starting"> </span> <div class="ant-notification-notice-message" - *ngIf="thisCreateService['serviceDomain'] == 'CCVPN' || thisService['serviceDomain'] == 'SOTN'"> + *ngIf="thisCreateService['serviceDomain'] === 'CCVPN' || thisService['serviceDomain'] === 'SOTN'"> {{ thisService['serviceDomain'] }} {{"i18nTextDefine_InstanceCreationStarting" | translate}} </div> @@ -582,6 +313,7 @@ *ngIf="(thisService['serviceDomain'] == 'Network Service') && thisService.status == 'Successful'"> NS {{"i18nTextDefine_InstanceTeminatedSuccessfully" | translate}} </div> + <div class="ant-notification-notice-message" *ngIf="(thisService['serviceDomain'] == 'CCVPN' || thisService['serviceDomain'] == 'SOTN') && thisService.status == 'Failed'"> {{ thisService['serviceDomain'] }} {{"i18nTextDefine_InstanceTeminationFailed" | @@ -615,6 +347,35 @@ </div> </div> </ng-template> + <ng-template #templatescalestarting> + <div class="ant-notification-notice-content"> + <div class="ant-notification-notice-with-icon"> + <span class="ant-notification-notice-icon"> + <img src="assets/images/execute-inproess.png" alt="instance temination is starting"> + </span> + <div class="ant-notification-notice-message">E2E + {{"i18nTextDefine_InstanceTeminationStarting" | translate}} + </div> + <div class="ant-notification-notice-description"> + <div class="notificationlist"> + <p> {{"i18nTextDefine_InstanceName" | translate}} :</p> + <span>{{ thisService["service-instance-name"] || + thisService["nsInstanceName"] }} + </span> + </div> + <div class="notificationlist"> + <p> {{"i18nTextDefine_Customer" | translate}} :</p> + <span>{{ customerSelected.name }}</span> + </div> + <div class="notificationlist"> + <p> {{"i18nTextDefine_UseCase" | translate}} :</p> + <span>{{ thisService["serviceDomain"] }}</span> + </div> + </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> + </div> + </div> + </ng-template> <ng-template #templateScaleSuccessFaild> <div class="ant-notification-notice-content"> <div class="ant-notification-notice-with-icon"> @@ -650,6 +411,35 @@ </div> </div> </ng-template> + <ng-template #templatehealstarting> + <div class="ant-notification-notice-content"> + <div class="ant-notification-notice-with-icon"> + <span class="ant-notification-notice-icon"> + <img src="assets/images/execute-inproess.png" alt="instance temination is starting"> + </span> + <div class="ant-notification-notice-message">NS + {{"i18nTextDefine_InstanceHealingStarting" | translate}} + </div> + <div class="ant-notification-notice-description"> + <div class="notificationlist"> + <p> {{"i18nTextDefine_InstanceName" | translate}} :</p> + <span>{{ thisService["service-instance-name"] || + thisService["nsInstanceName"] }} + </span> + </div> + <div class="notificationlist"> + <p> {{"i18nTextDefine_Customer" | translate}} :</p> + <span>{{ customerSelected.name }}</span> + </div> + <div class="notificationlist"> + <p> {{"i18nTextDefine_UseCase" | translate}} :</p> + <span>{{ thisService["serviceDomain"] }}</span> + </div> + </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> + </div> + </div> + </ng-template> <ng-template #templatehealSuccessFaild> <div class="ant-notification-notice-content"> <div class="ant-notification-notice-with-icon"> @@ -728,7 +518,7 @@ </div> <div class="detailComponent" *ngIf="detailshow2"> <app-e2e-detail [detailParams]="detailData" (closeDetail)="detailshow2 = false;listDisplay = false;"> - </app-e2e-detail> + </app-e2e-detail> </div> <div class="createComponent" *ngIf="createshow"> <app-ccvpn-creation [createParams]="createData" [ccvpn_temParametersContent]="ccvpn_temParametersContent" |