diff options
3 files changed, 42 insertions, 72 deletions
diff --git a/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css b/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css index 99095ec3..5d65e550 100644 --- a/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css +++ b/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css @@ -94,20 +94,32 @@ hr { color: #000; } /* SOTN VPN */ -.model .creation .sotnvpn .service-title{ - margin-bottom: 35px; +.model .creation .service-title{ + margin:60px 50px; } -.model .creation .sotnvpn .service-title .lable { +.model .creation .service-title .info-inputs{ + width:400px; + height: 42px; display: inline-block; - width: 90px; +} +.model .creation .service-title span{ + height: 42px; + line-height: 42px; + vertical-align: middle; +} +.model .creation .service-title .lable{ + display: inline-block; + width: 100px; font: 700 14px "Arial"; color: #3C4F8C; + height: 42px; + line-height: 42px; vertical-align: middle; margin-left: 5px; } -.model .creation .sotnvpn .service-title input { - width: 234px; - height: 40px; +.model .creation .service-title input { + width: 230px; + height: 42px; border-radius:4px; outline: none; margin-right: 50px; @@ -177,7 +189,7 @@ hr { .model .sitemodel .inputs input,.model .sitemodel .inputs nz-select { width: 186px; float: right; - margin-right: 25px; + margin-right: 60px; } .model .sotnnpnmodel .inputs input{ width: 186px; diff --git a/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.html b/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.html index 8aa7bd61..3ae5af27 100644 --- a/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.html +++ b/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.html @@ -42,14 +42,16 @@ </div> <div class="creation"> <nz-tabset [nzTabPosition]="'top'" [nzShowPagination]=false [nzTabBarGutter]="'2'" [nzTabBarStyle]=tabBarStyle> - <nz-tab nzTitle="sdwanvpnresource_list"> + <nz-tab nzTitle="Service Info"> + <div class="service-title" style="clear: both"> + <span style="color: red;">*</span><span class="lable" style="width: 60px">name:</span> + <input nz-input [(ngModel)]="this.templateParameters.service['name']" required="required"> + <span style="color: red;">*</span><span class="lable">description:</span> + <input nz-input [(ngModel)]="this.templateParameters.service['description']"> + </div> + </nz-tab> + <nz-tab nzTitle="Sdwanvpnresource List"> <div class="sotnvpn clearfix"> - <div class="service-title" style="clear: both"> - <span style="color: red;">*</span><span class="lable" style="width: 50px">name:</span> - <input nz-input [(ngModel)]="this.templateParameters.service['name']" required="required"> - <span style="color: red;">*</span><span class="lable">description:</span> - <input nz-input [(ngModel)]="this.templateParameters.service['description']"> - </div> <div style="clear: both;height: 10px"> <h3 style="float: left;color: #3C4F8C">sdwanVPN List</h3> <button nz-button (click)="addSotnvpn()" class="addListBtn" @@ -86,7 +88,7 @@ </nz-table> </div> </nz-tab> - <nz-tab nzTitle="sdwansiteresource_list"> + <nz-tab nzTitle="Sdwansiteresource List"> <div class="site"> <div> <h3 style="float: left;color: #3C4F8C">Site List</h3> @@ -134,7 +136,7 @@ </div> <!-- sotnVpnmodel --> <div class="sotnnpnmodel" *ngIf="sotnVpnModelShow"> - <h3>sdwanvpnresource_list</h3> + <h3>Base</h3> <div class="inputs"> <ul> <li *ngFor="let item of this.templateParameters.sotnvpn.sdwanvpnresource_list"> @@ -144,7 +146,7 @@ </ul> </div> <div> - <h3>sdwansitelan_list</h3> + <h3>Sdwansitelan List</h3> <div> <div style="width: 100%;text-align: right"> <button nz-button (click)="addSotnSdwansitelan()" class="addListBtn"><i class="anticon anticon-plus" @@ -191,7 +193,7 @@ </div> <!-- sitemodel --> <div class="sitemodel" *ngIf="siteModelShow"> - <h3>sdwansiteresource_list</h3> + <h3>Base</h3> <div class="inputs"> <ul> <li *ngFor="let item of this.templateParameters.site.sdwansiteresource_list"> @@ -201,7 +203,7 @@ </ul> </div> <div> - <h3>sdwandevice_list</h3> + <h3>Sdwandevice</h3> <div class="inputs"> <ul> <li *ngFor="let item of this.templateParameters.site.sdwandevice_list"> @@ -210,7 +212,7 @@ required="{{item.required==true ? 'required':null}}"></li> </ul> </div> - <h3>sdwansitewan_list</h3> + <h3>Sdwansitewan List</h3> <div> <div style="width: 100%;text-align: right"> <button nz-button (click)="addSiteWan()" class="addListBtn"><i class="anticon anticon-plus" diff --git a/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.ts b/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.ts index 063d609a..0200de85 100644 --- a/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.ts +++ b/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.ts @@ -38,7 +38,7 @@ export class CcvpnCreationComponent implements OnInit { //tabBarStyle tabBarStyle = { "height": "58px", - "width": "460px", + "width": "694px", "box-shadow": "none", "margin": "0", "border-radius": "4px 4px 0px 0px" @@ -591,58 +591,14 @@ export class CcvpnCreationComponent implements OnInit { locationConstraints: [ ], }, + resources:[], requestInputs: { - }, - resources:[] + sdwanvpnresource_list:[], + sdwansiteresource_list:[] + } }; - - let sotnbody = this.sotnVpnTableData.map((sotn) => { - let sotninputs = { - resourceIndex: 0, - resourceName:this.templateParameters["sotnvpn"]["info"]["resourceName"], - resourceInvariantUuid: this.templateParameters["sotnvpn"]["info"]["resourceInvariantUuid"], - resourceUuid: this.templateParameters["sotnvpn"]["info"]["resourceUuid"], - resourceCustomizationUuid:this.templateParameters["sotnvpn"]["info"]["resourceCustomizationUuid"], - parameters: { - locationConstraints: [ - ], - resources: [ - ], - requestInputs: {} - } - }; - sotninputs.parameters.requestInputs=Object.assign({}, sotn); - - return sotninputs; - }); - - let sitebody = this.sotnVpnTableData.map((site) => { - let siteinputs = { - resourceIndex: 0, - resourceName:this.templateParameters["site"]["info"]["resourceName"], - resourceInvariantUuid: this.templateParameters["site"]["info"]["resourceInvariantUuid"], - resourceUuid: this.templateParameters["site"]["info"]["resourceUuid"], - resourceCustomizationUuid:this.templateParameters["site"]["info"]["resourceCustomizationUuid"], - parameters: { - locationConstraints: [ - ], - resources: [ - ], - requestInputs: {} - } - }; - siteinputs.parameters.requestInputs=Object.assign({}, site); - - return siteinputs; - }); - - servicebody.resources = sotnbody.concat(sitebody); - servicebody.resources.map((item,index) => { - item.resourceIndex=index; - }); - - console.log(sotnbody); - console.log(sitebody); + servicebody.requestInputs.sdwanvpnresource_list=servicebody.requestInputs.sdwanvpnresource_list.concat(this.sotnVpnTableData); + servicebody.requestInputs.sdwansiteresource_list=servicebody.requestInputs.sdwansiteresource_list.concat(this.siteTableData); console.log(servicebody); this.closeCreate.emit(servicebody); |