summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-10-10 15:03:00 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-10-10 15:03:08 +0800
commit39f1403b2e4cbe8bc6189c3ff132d12d558bf0fa (patch)
tree55c80bf17deb7cc91a52f8280bcb7388fd4fd8dd /usecaseui-portal
parenta82b518867281a85f7c80a3604f40a91409ea964 (diff)
style: optimize the style of the create dialog
Change-Id: If8f27ebee4717ac7b49b4f7511d1aee859ad0ced Issue-ID: USECASEUI-307 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal')
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.html107
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.less20
2 files changed, 71 insertions, 56 deletions
diff --git a/usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.html b/usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.html
index aa2cb06a..e093b3b8 100644
--- a/usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.html
+++ b/usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.html
@@ -1,60 +1,59 @@
<nz-modal nzWidth="428" [(nzVisible)]="isVisible" nzTitle=" {{'i18nTextDefine_ServiceCreation' | translate}} "
- (nzOnCancel)="handleCancel()"
- (nzOnOk)="handleOk()" nzClassName="serviceCreationModel"
- nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} "
- nzOkText=" {{'i18nTextDefine_modelOk' | translate}} ">
+ (nzOnCancel)="handleCancel()"
+ (nzOnOk)="handleOk()" nzClassName="serviceCreationModel"
+ nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} "
+ nzOkText=" {{'i18nTextDefine_modelOk' | translate}} "
+>
+ <div class="select-list">
+ <span> {{"i18nTextDefine_Customer" | translate}} : </span>
+ <nz-select [(ngModel)]="currentCustomer.name" nzAllowClear
+ (ngModelChange)="customerChange()">
+ <nz-option *ngFor="let item of customerList" [nzValue]="item.name" [nzLabel]="item.name"></nz-option>
+ </nz-select>
+ </div>
+ <div class="select-list">
+ <span> {{"i18nTextDefine_ServiceType" | translate}} : </span>
+ <nz-select [(ngModel)]="currentServiceType.name" nzAllowClear>
+ <nz-option *ngFor="let item of serviceTypes" [nzValue]="item.name" [nzLabel]="item.name">
+ </nz-option>
+ </nz-select>
+ </div>
+ <div class="select-list">
+ <span> {{"i18nTextDefine_UseCase" | translate}} : </span>
+ <nz-select [(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> {{"i18nTextDefine_Template" | translate}} : </span>
+ <nz-select [(ngModel)]="currentTemplate" 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;" class="label"> {{"i18nTextDefine_Customer" | translate}} : </span>
- <nz-select style="width: 176px;float: right;" [(ngModel)]="currentCustomer.name" nzAllowClear
- (ngModelChange)="customerChange()">
- <nz-option *ngFor="let item of customerList" [nzValue]="item.name" [nzLabel]="item.name"></nz-option>
+ <span> {{"i18nTextDefine_Orchestrator" | translate}} : </span>
+ <nz-select [(ngModel)]="orchestratorSelected" nzAllowClear>
+ <nz-option *ngFor="let item of orchestratorList" [nzValue]="item" [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)]="currentServiceType.name" nzAllowClear>
- <nz-option *ngFor="let item of serviceTypes" [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)]="currentTemplate" 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 class="checkbox select-list">
+ <span>Sol005 :</span>
+ <input type="checkbox"
+ [(ngModel)]="isSol005Interface" value="true" nzAllowClear>
+
</div>
-
- </nz-modal>
- <div class="loading" *ngIf="loadingAnimateShow">
- <img src="assets/images/loading-animate2.gif" alt="loading">
- <p>Please wating……</p>
- </div>
+ </div>
+ <div class="select-list" *ngIf="temParametersTips">
+ {{"i18nTextDefine_Templateparsingfailed" | translate}}
+ </div>
+</nz-modal>
+<div class="loading" *ngIf="loadingAnimateShow">
+ <img src="assets/images/loading-animate2.gif" alt="loading">
+ <p>Please wating……</p>
+</div>
diff --git a/usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.less b/usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.less
index a42c4128..fdee93c8 100644
--- a/usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.less
+++ b/usecaseui-portal/src/app/views/services/services-list/create-model/create-model.component.less
@@ -1,14 +1,30 @@
-select-list{
+.select-list{
width: 320px;
height: 32px;
line-height: 32px;
margin: 35px auto;
.select-list>span{
+ display:inline-block;
text-align: right;
- width: 110px!important;
line-height: 32px;
}
+ nz-select{
+ width: 176px;
+ float: right;
+ }
+ &.checkbox{
+ margin: 0 auto;
+ line-height: 32px;
+ input[type="checkbox"]{
+ zoom: 1.3;
+ width: 140px;
+ }
+ }
+}
+::ng-deep nz-modal button.ant-btn {
+ margin-top:20px !important;
}
+
.loading{
width: 100%;
height: 100%;