diff options
16 files changed, 124 insertions, 25 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 24b2af67..c6626379 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 @@ -150,7 +150,14 @@ <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'}">{{data.tips}}</span> + '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"> + <img src="assets/images/wancheng-icon.png" alt="Available"> + </span> + <span *ngIf="data.tips == 'Unavailable' " style="margin-left: 10px"> + <img src="assets/images/shibai-icon.png" alt="Unavailable"> + </span> <nz-progress *ngIf="data.status == 'In Progress'" [nzPercent]="data.rate" [nzShowInfo]="false" nzStatus="active"></nz-progress> </td> @@ -163,14 +170,14 @@ (click)="iconMoreShow(data,tableData)" style="transform: rotate(90deg);"></i> <ul *ngIf="data.iconMore==true " class="icon-more"> - <li> + <li (click)="scaleService(data)"> <i [ngClass]="{'cannotclick':data.serviceDomain!='E2E Service' || data.status == 'In Progress'||(data.status=='Failed' && data.operationType=='1001')||(data.status=='Failed' && data.operationType=='1002')}" - class="anticon anticon-setting" (click)="scaleService(data)"></i> + class="anticon anticon-scale"></i> <span> {{"i18nTextDefine_Scale" | translate}} </span> </li> - <li> + <li (click)="update(data)"> <i [ngClass]="{'cannotclick':data.serviceDomain!='CCVPN' || data.status == 'In Progress'||(data.status=='Failed' && data.operationType=='1001')||(data.status=='Failed' && data.operationType=='1002')}" - class="anticon anticon-cloud-upload-o" (click)="update(data)"></i> + class="anticon anticon-update" ></i> <span> {{"i18nTextDefine_Update" | translate}} </span> </li> </ul> @@ -264,6 +271,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -329,6 +337,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -424,6 +433,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -455,6 +465,7 @@ <span>{{ thisCreateService['serviceDomain'] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -489,6 +500,7 @@ <span>{{ thisCreateService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -523,6 +535,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -551,6 +564,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -579,6 +593,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -607,6 +622,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> 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 c1cf7598..b7499724 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 @@ -238,8 +238,7 @@ hr { .icon-more{ position: absolute; width: 115px; - height: 135px; - //height: 156px; + height: 90px; top:50px; padding:15px 0 0 15px; background: #ffffff; @@ -250,10 +249,28 @@ hr { margin-bottom:10px; line-height: 20px; text-align: left; + cursor: pointer; + .anticon{ + width: 18px; + height: 18px; + background: url("../../../assets/images/scale.png") no-repeat; + } + .anticon.anticon-update{ + background: url("../../../assets/images/update.png") no-repeat; + } span{ margin-left: 5px; } } + li:hover{ + color: #0DA9E2; + .anticon{ + background: url("../../../assets/images/scale-active.png") no-repeat; + } + .anticon.anticon-update{ + background: url("../../../assets/images/update-active.png") no-repeat; + } + } } } tr.childtr { @@ -275,7 +292,7 @@ hr { height: 100vh; background-color: #f3f3f3; overflow-y: auto; - padding: 20px 32px; + //padding: 20px 32px; z-index: 3; } .createComponent { @@ -291,29 +308,32 @@ hr { } /*2019.01.14*/ .e2eColor,.nsColor,.ccvpnColor,.sotnColor,.voLTEColor{ - color: #FFFFFF; + color: #3671AB; width:120px; height: 34px; line-height: 34px; margin-bottom: 0!important; text-align: center; - background:linear-gradient(131deg,rgba(79,151,239,1) 0%,rgba(48,217,196,1) 100%); + background:linear-gradient(131deg,rgba(147,196,255,1) 0%,rgba(120,241,226,1) 100%); border-radius:4px } .nsColor{ - background:linear-gradient(135deg,rgba(252,167,91,1) 0%,rgba(253,203,106,1) 100%); + background:linear-gradient(135deg,rgba(253,187,127,1) 0%,rgba(250,215,153,1) 100%); border-radius:4px; + color: #A16C39; } -.ccvpnColor{ - background:linear-gradient(135deg,rgba(81,113,251,1) 0%,rgba(201,123,254,1) 100%); +.ccvpnColor{ + background:linear-gradient(135deg,rgba(198,222,251,1) 0%,rgba(217,215,252,1) 100%); border-radius:4px; + color: #7C74BB; } .sotnColor{ - background:linear-gradient(133deg,rgba(24,179,170,1) 0%,rgba(70,216,178,1) 100%); + background:rgba(201,243,239,1); border-radius:4px; + color: #30B0A0; } -.voLTEColor{ - background:#0AD251; +.voLTEColor{ + background:rgba(201,243,239,1); } .vnfColor,.siteColor,.SDWANColor{ color:rgba(60,79,140,0.5); 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 55e339f1..06991b47 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 @@ -54,23 +54,23 @@ export class ServicesListComponent implements OnInit { serviceMunber = [ { "serviceDomain": "E2E", - "Success": 16, - "failed": 4, - "InProgress": 11, + "Success": 0, + "failed": 0, + "InProgress": 0, "detailName":"i18nTextDefine_End_To_End_Service" }, { "serviceDomain": "NS", - "Success": 21, - "failed": 2, - "InProgress": 17, + "Success": 0, + "failed": 0, + "InProgress": 0, "detailName":"i18nTextDefine_Network_Service" }, { "serviceDomain": "CCVPN", - "Success": 36, - "failed": 15, - "InProgress": 6, + "Success": 0, + "failed": 0, + "InProgress": 0, "detailName":"i18nTextDefine_Cross_Domain_and_Cross_Layer_VPN" } ]; @@ -361,6 +361,36 @@ export class ServicesListComponent implements OnInit { return item; }) console.log(this.tableData) + this.tableData.map((item,index) => { + if(item.serviceDomain == 'E2E Service'){ + if(item.operationResult == 2001){ + this.serviceMunber[0]["Success"]+=1; + }else if(item.operationResult == 2002){ + this.serviceMunber[0]["failed"]+=1; + }else if(item.operationResult == 2003){ + this.serviceMunber[0]["InProgress"]+=1; + } + } + else if(item.serviceDomain == 'Network Service'){ + if(item.operationResult == 2001){ + this.serviceMunber[1]["Success"]+=1; + }else if(item.operationResult == 2002){ + this.serviceMunber[1]["failed"]+=1; + }else if(item.operationResult == 2003){ + this.serviceMunber[1]["InProgress"]+=1; + } + } + else if(item.serviceDomain == 'CCVPN'){ + if(item.operationResult == 2001){ + this.serviceMunber[2]["Success"]+=1; + }else if(item.operationResult == 2002){ + this.serviceMunber[2]["failed"]+=1; + }else if(item.operationResult == 2003){ + this.serviceMunber[2]["InProgress"]+=1; + } + } + }) + console.log(this.serviceMunber) },(err)=>{ console.log(err); }) @@ -838,6 +868,11 @@ e2eCloseCreate(obj,templateCreatestarting,templateCreateSuccessFaild) { if(data.status == "FAILED"){ console.log("scale E2e service failed :" + JSON.stringify(data)); service.status = "failed"; + service.tips = this.listSortMasters["operationTypes"].find((its) => { + return its["sortCode"] == service.statusClass && its["language"] == this.language + })["sortValue"] + '\xa0\xa0\xa0' + this.listSortMasters["operationResults"].find((its) => { + return its["sortCode"] == 2002 && its["language"] == this.language + })["sortValue"]; this.scaleSuccessNotification(templateScaleSuccessFaild); return false; } diff --git a/usecaseui-portal/src/assets/i18n/cn.json b/usecaseui-portal/src/assets/i18n/cn.json index 3983d099..9686dea3 100644 --- a/usecaseui-portal/src/assets/i18n/cn.json +++ b/usecaseui-portal/src/assets/i18n/cn.json @@ -81,6 +81,7 @@ "i18nTextDefine_InstanceUpdateStarting":"更新开始", "i18nTextDefine_InstanceUpdatedSuccessfully":"更新成功", "i18nTextDefine_InstanceUpdateFailed":"更新失败", + "i18nTextDefine_Close":"关闭", "ccvpn-creation-component":"--:", "i18nTextDefine_InstanceCreation":"实例创建", diff --git a/usecaseui-portal/src/assets/i18n/en.json b/usecaseui-portal/src/assets/i18n/en.json index 255134f8..26e95fda 100644 --- a/usecaseui-portal/src/assets/i18n/en.json +++ b/usecaseui-portal/src/assets/i18n/en.json @@ -81,6 +81,7 @@ "i18nTextDefine_InstanceUpdateStarting":"instance update is starting.", "i18nTextDefine_InstanceUpdatedSuccessfully":"instance was updated successfully.", "i18nTextDefine_InstanceUpdateFailed":"instance update failed!!!", + "i18nTextDefine_Close":"close", "ccvpn-creation-component":"--:", "i18nTextDefine_InstanceCreation":"Instance Creation", diff --git a/usecaseui-portal/src/assets/images/damaged-icon.png b/usecaseui-portal/src/assets/images/damaged-icon.png Binary files differnew file mode 100644 index 00000000..37a016bc --- /dev/null +++ b/usecaseui-portal/src/assets/images/damaged-icon.png diff --git a/usecaseui-portal/src/assets/images/execute-faild.png b/usecaseui-portal/src/assets/images/execute-faild.png Binary files differindex 91ab52fe..c7bfce06 100644 --- a/usecaseui-portal/src/assets/images/execute-faild.png +++ b/usecaseui-portal/src/assets/images/execute-faild.png diff --git a/usecaseui-portal/src/assets/images/execute-inproess.png b/usecaseui-portal/src/assets/images/execute-inproess.png Binary files differindex 6a1beb3b..7a11d6cd 100644 --- a/usecaseui-portal/src/assets/images/execute-inproess.png +++ b/usecaseui-portal/src/assets/images/execute-inproess.png diff --git a/usecaseui-portal/src/assets/images/execute-success.png b/usecaseui-portal/src/assets/images/execute-success.png Binary files differindex 36d67efd..aaf46c35 100644 --- a/usecaseui-portal/src/assets/images/execute-success.png +++ b/usecaseui-portal/src/assets/images/execute-success.png diff --git a/usecaseui-portal/src/assets/images/scale-active.png b/usecaseui-portal/src/assets/images/scale-active.png Binary files differnew file mode 100644 index 00000000..0ff69f30 --- /dev/null +++ b/usecaseui-portal/src/assets/images/scale-active.png diff --git a/usecaseui-portal/src/assets/images/scale.png b/usecaseui-portal/src/assets/images/scale.png Binary files differnew file mode 100644 index 00000000..1cd508bd --- /dev/null +++ b/usecaseui-portal/src/assets/images/scale.png diff --git a/usecaseui-portal/src/assets/images/shibai-icon.png b/usecaseui-portal/src/assets/images/shibai-icon.png Binary files differnew file mode 100644 index 00000000..374f6270 --- /dev/null +++ b/usecaseui-portal/src/assets/images/shibai-icon.png diff --git a/usecaseui-portal/src/assets/images/update-active.png b/usecaseui-portal/src/assets/images/update-active.png Binary files differnew file mode 100644 index 00000000..75eeecc0 --- /dev/null +++ b/usecaseui-portal/src/assets/images/update-active.png diff --git a/usecaseui-portal/src/assets/images/update.png b/usecaseui-portal/src/assets/images/update.png Binary files differnew file mode 100644 index 00000000..d6788024 --- /dev/null +++ b/usecaseui-portal/src/assets/images/update.png diff --git a/usecaseui-portal/src/assets/images/wancheng-icon.png b/usecaseui-portal/src/assets/images/wancheng-icon.png Binary files differnew file mode 100644 index 00000000..4d672a81 --- /dev/null +++ b/usecaseui-portal/src/assets/images/wancheng-icon.png diff --git a/usecaseui-portal/src/styles.less b/usecaseui-portal/src/styles.less index a5a95a1d..3cdc7112 100644 --- a/usecaseui-portal/src/styles.less +++ b/usecaseui-portal/src/styles.less @@ -742,7 +742,11 @@ nz-notification-container .ant-notification{ background: rgba(255,255,255,0); opacity: 1!important; color: #ffffff; + position: relative; + background-image: url("assets/images/notificationmodel.png"); + background-repeat: no-repeat; .ant-notification-notice-content{ + position: relative; .ant-notification-notice-icon{} .ant-notification-notice-message{ margin-left: 88px; @@ -752,6 +756,8 @@ nz-notification-container .ant-notification{ } .ant-notification-notice-description{ margin-left: 88px; + width: 68%; + display: inline-block; .notificationlist{ height: 25px; line-height: 25px; @@ -766,10 +772,30 @@ nz-notification-container .ant-notification{ } } } + .close-icons{ + position: absolute; + width: 100px; + text-align: center; + display: inline-block; + color: #D9DEF1; + top: 0; + line-height: 120px; + font-size: 18px; + } } .ant-notification-notice-close,.ant-notification-notice-close:hover{ color: #ffffff!important; } + .ant-notification-notice-close{ + width: 80px; + height: 100%; + position: absolute; + border-left: 1px solid #717171; + top: 0; + .ant-notification-notice-close-x{ + display: none; + } + } } } } |
