diff options
5 files changed, 108 insertions, 130 deletions
diff --git a/usecaseui-portal/src/app/shared/utils/utils.ts b/usecaseui-portal/src/app/shared/utils/utils.ts index 63e19075..0633778c 100644 --- a/usecaseui-portal/src/app/shared/utils/utils.ts +++ b/usecaseui-portal/src/app/shared/utils/utils.ts @@ -104,13 +104,13 @@ export class Util { if (!this.deepCheck(target[i])) { return false; } - } + } } else if (type === '[object Object]') { for (const prop in target) { if (target.hasOwnProperty(prop)) { - if (!this.deepCheck(target[prop])) { - return false; - } + if (!this.deepCheck(target[prop])) { + return false; + } } } } else { @@ -124,10 +124,10 @@ export class Util { } pick(obj: object, arr: Array<string>): Object { return arr.reduce((iter, val) => { - if(val in obj) { - iter[val] = obj[val]; - } - return iter; + if(val in obj) { + iter[val] = obj[val]; + } + return iter; }, {}); } }
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html index 38ecbf11..0f138db8 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html +++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html @@ -1,68 +1,60 @@ -<nz-spin nzTip='Loading...' [nzSpinning]="isSpinning"> - <nz-modal [(nzVisible)]="showModel" nzTitle="Create Communication Service" (nzOnCancel)="handleCancel()" - (nzOnOk)="handleOk()" nzWidth="80%"> - <div class="subnet_params_container"> - <form nz-form> - <nz-form-item *ngFor="let item of comunicationFormItems; let i = index"> - <nz-form-label [nzSpan]="6" [nzRequired]="item.required" [nzFor]=" item.key"> - {{ item.title }} - </nz-form-label> - <nz-form-control [nzSpan]="15"> - <input nz-input nz-tooltip [id]="item.key" [name]="item.key" +<nz-modal [(nzVisible)]="showModel" nzTitle="Create Communication Service" (nzOnCancel)="handleCancel()" + (nzOnOk)="handleOk()" nzWidth="80%"> + <div class="subnet_params_container"> + <form nz-form> + <nz-form-item *ngFor="let item of comunicationFormItems; let i = index"> + <nz-form-label [nzSpan]="6" [nzRequired]="item.required" [nzFor]=" item.key"> + {{ item.title }} + </nz-form-label> + <nz-form-control [nzSpan]="15"> + <nz-tooltip [nzTitle]="item.scoped&&item.scopedText?item.scopedText:''" [nzPlacement]="'right'" + [nzTrigger]="'focus'"> + <input nz-input nz-tooltip [id]="item.key" [name]="item.key" *ngIf="item.type === 'input'" [(ngModel)]="slicing_order_info[item.key]" - [ngClass]="{'error-input-border':validateRulesShow[i] === true}" - *ngIf=" item.type === 'input'&&!item.scoped " - [placeholder]="item.placeholder?item.placeholder:''" - (blur)="item.required?this.Util.validator(item.title,item.key,slicing_order_info[item.key],i,rulesText,validateRulesShow):this.Util.validator()" /> - <nz-tooltip [nzTitle]="tooltipText" [nzPlacement]="'right'" [nzTrigger]="'focus'"> - <input nz-input nz-tooltip [id]="item.key" [name]="item.key" *ngIf="item.scoped" - [(ngModel)]="slicing_order_info[item.key]" - [ngClass]="{'error-input-border':validateRulesShow[i] === true}" - (blur)="this.Util.validator(item.title,item.key,slicing_order_info[item.key],i,rulesText,validateRulesShow)" - (focus)="changeTooltipText(item.title)" /> - </nz-tooltip> - <nz-radio-group [name]="item.key" [(ngModel)]="slicing_order_info[item.key]" - *ngIf="item.type === 'radio'"> - <label nz-radio [nzValue]="option.key" *ngFor="let option of item.options"> - {{ option.title }} - </label> - </nz-radio-group> - <nz-select [name]="item.key" [(ngModel)]="slicing_order_info[item.key]" - *ngIf="item.type === 'select'"> - <nz-option [nzValue]="option.key" [nzLabel]="option.title" - *ngFor="let option of item.options"> - </nz-option> - </nz-select> - <nz-form-explain *ngIf="item.type === 'input' && validateRulesShow[i]" class="validateRules"> - {{rulesText[i]}} - </nz-form-explain> - </nz-form-control> + [ngClass]="{'error-input-border' : validateRulesShow[i] === true}" + [placeholder]="item.placeholder ? item.placeholder : ''" + (blur)="item.required ? this.Util.validator(item.title,item.key,slicing_order_info[item.key],i,rulesText,validateRulesShow) : this.Util.validator()" /> + </nz-tooltip> + <nz-radio-group [name]="item.key" [(ngModel)]="slicing_order_info[item.key]" + *ngIf="item.type === 'radio'"> + <label nz-radio [nzValue]="option.key" *ngFor="let option of item.options"> + {{ option.title }} + </label> + </nz-radio-group> + <nz-select [name]="item.key" [(ngModel)]="slicing_order_info[item.key]" + *ngIf="item.type === 'select'"> + <nz-option [nzValue]="option.key" [nzLabel]="option.title" *ngFor="let option of item.options"> + </nz-option> + </nz-select> + <nz-form-explain *ngIf="item.type === 'input' && validateRulesShow[i]" class="validateRules"> + {{rulesText[i]}} + </nz-form-explain> + </nz-form-control> - <div *ngIf="item.type === 'city-select'"> - <div *ngFor="let area of areaList; let i = index"> - <nz-form-control [nzSpan]="!ind ? 3 : 4" [nzOffset]="i && !ind ? 6 : 0" - class="subnet_params_area" *ngFor="let item of area; let ind = index"> - <nz-select [(ngModel)]="item.selected" [name]="'area' + i + ind" - (nzOpenChange)="handleChange(area, item)" - (ngModelChange)=" handleChangeSelected(area, item) "> - <nz-option [nzValue]="op.name" [nzLabel]="op.name" *ngFor="let op of item.options"> - </nz-option> - </nz-select> - </nz-form-control> - <nz-form-control [nzSpan]="1" [nzOffset]="1"> - <button nz-button nzType="primary" nzSize="small" class="subnet_params_button" - *ngIf="!i" (click)="creatAreaList()"> - <i nz-icon class="anticon anticon-plus subnet_params_icon"></i> - </button> - <button nz-button nzType="primary" nzSize="small" class="subnet_params_button" *ngIf="i" - (click)="deleteAreaList(i)"> - <i nz-icon class="anticon anticon-minus subnet_params_icon"></i> - </button> - </nz-form-control> - </div> + <div *ngIf="item.type === 'city-select'"> + <div *ngFor="let area of areaList; let i = index"> + <nz-form-control [nzSpan]="!ind ? 3 : 4" [nzOffset]="i && !ind ? 6 : 0" + class="subnet_params_area" *ngFor="let item of area; let ind = index"> + <nz-select [(ngModel)]="item.selected" [name]="'area' + i + ind" + (nzOpenChange)="handleChange(area, item)" + (ngModelChange)=" handleChangeSelected(area, item) "> + <nz-option [nzValue]="op.name" [nzLabel]="op.name" *ngFor="let op of item.options"> + </nz-option> + </nz-select> + </nz-form-control> + <nz-form-control [nzSpan]="1" [nzOffset]="1"> + <button nz-button nzType="primary" nzSize="small" class="subnet_params_button" *ngIf="!i" + (click)="creatAreaList()"> + <i nz-icon class="anticon anticon-plus subnet_params_icon"></i> + </button> + <button nz-button nzType="primary" nzSize="small" class="subnet_params_button" *ngIf="i" + (click)="deleteAreaList(i)"> + <i nz-icon class="anticon anticon-minus subnet_params_icon"></i> + </button> + </nz-form-control> </div> - </nz-form-item> - </form> - </div> - </nz-modal> -</nz-spin>
\ No newline at end of file + </div> + </nz-form-item> + </form> + </div> +</nz-modal>
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts index 8e58a60c..bfef2d20 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts +++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts @@ -40,10 +40,8 @@ export class BusinessOrderComponent implements OnInit { coverageAreaNumber: null }; areaList: any[] = []; - isSpinning: boolean = false; validateRulesShow: any[] = []; rulesText: any[] = []; - tooltipText: string = 'Scope: 1-100000'; AreaFormatting(): void { let areaList = ['Beijing;Beijing;Haidian District;Wanshoulu Street']; @@ -71,7 +69,7 @@ export class BusinessOrderComponent implements OnInit { } creatAreaList(): void { - let arr = [ + const arr = [ { key: 'province', selected: '', @@ -156,30 +154,16 @@ export class BusinessOrderComponent implements OnInit { coverageArea: '', coverageAreaNumber: null }; - } - - changeTooltipText(title: string): void { - if (title === 'Max Number of UEs') { - this.tooltipText = 'Scope: 1-100000' - } else if (title === 'Data Rate Downlink (Mbps)' || title === 'Data Rate Uplink (Mbps)') { - this.tooltipText = 'Scope: 100-3000' - } else if (title === 'Latency') { - this.tooltipText = 'Scope: 10-200' - } else if (title === 'Use Interval (Month)') { - this.tooltipText = 'Scope: ≥1' - } + this.validateRulesShow = [] } handleOk(): void { const coverage_list: string[] = []; - let coverageAreaNumber = null; let coverageAreas; COMMUNICATION_FORM_ITEMS.forEach((item, index) => { - if (item.key !== 'resourceSharingLevel' && item.key !== 'uEMobilityLevel' && item.key !== 'coverageArea' && item.key !== 'coverageAreaNumber') { + if (item.required && item.type==="input") { this.Util.validator(item.title,item.key, this.slicing_order_info[item.key], index, this.rulesText, this.validateRulesShow) - }else if(item.key === 'coverageAreaNumber'){ - coverageAreaNumber = this.slicing_order_info[item.key] } }); if (this.validateRulesShow.indexOf(true) > -1) { @@ -193,12 +177,12 @@ export class BusinessOrderComponent implements OnInit { }); coverage_list.push(str.substring(0, str.length - 1)); }); - if (coverage_list.length > 1) { coverageAreas = coverage_list.join('|') } else { coverageAreas = coverage_list.toString(); } + const coverageAreaNumber = this.slicing_order_info["coverageAreaNumber"]; if(coverageAreaNumber){ this.slicing_order_info.coverageArea = `${coverageAreas}-${coverageAreaNumber}`; }else{ @@ -209,14 +193,16 @@ export class BusinessOrderComponent implements OnInit { const paramsObj = { slicing_order_info: this.slicing_order_info }; - console.log(paramsObj,"===>paramsObj") - this.isSpinning = true; const csmfSlicingPurchaseFailedCallback = () => { this.handleCancel(); - this.isSpinning = false; } this.myhttp.csmfSlicingPurchase(paramsObj, csmfSlicingPurchaseFailedCallback).then(res => { - this.isSpinning = false; + const result = res.result_header; + if(result&&result.result_code&&+result.result_code===200){ + console.log(res) + }else{ + this.message.create('error','Network error') + } this.handleCancel(); }) } diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/constants.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/constants.ts index 4f64a5c7..9f79bff6 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/constants.ts +++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/constants.ts @@ -1,46 +1,50 @@ export const COMMUNICATION_FORM_ITEMS = [ - /*** - title: MARK THE ITEM NAME, - key: MARK THE ITEM KEY, - type: MARKE THE ITEM TYPE, CAN BE ADDED IF NECESSARY: input/select/radio/city-select - required: IF REQUIRED, + /******* + title /MUST/: MARK THE ITEM NAME, + key /MUST/: MARK THE ITEM KEY, + type /MUST/: MARKE THE ITEM TYPE, CAN BE ADDED IF NECESSARY: input/select/radio/city-select + required /MUST/: IF REQUIRED, scoped: IF SCOPED NUMBERS, CAN BE EMITTED IF NOT + scopedText: SCOPED NUMBERS' DESCRIPTION. IF SCOPED NUMBERS EXITS, IT'S A MUST placeholder: IF PLACEHOLDER, CAN BE EMITTED IF NOT options: IF ITEM NEEDS OPTIONS, CAN BE EMITTED IF NOT - ***/ + ********/ { title: 'Communication Service Name', key: 'name', type:"input", required:true - }, { title: 'Max Number of UEs', key: 'maxNumberofUEs', type:"input", scoped:true, + scopedText:'Scope: 1-100000', required:true }, { - title: 'Data Rate Downlink (Mbps)', - key: 'expDataRateDL', + title: 'Data Rate Uplink (Mbps)', + key: 'expDataRateUL', type:"input", scoped:true, + scopedText:'Scope: 100-3000', required:true }, { - title: 'Latency', - key: 'latency', + title: 'Data Rate Downlink (Mbps)', + key: 'expDataRateDL', type:"input", scoped:true, + scopedText:'Scope: 100-3000', required:true }, { - title: 'Data Rate Uplink (Mbps)', - key: 'expDataRateUL', + title: 'Latency', + key: 'latency', type:"input", scoped:true, + scopedText:'Scope: 10-200', required:true }, { @@ -185,7 +189,7 @@ export const COMMUNICATION_FORM_ADDRESS = [ "name": "Shanghai City", "county": [{ "id": "2001", - "name": "udongxin District", + "name": "Pudongxin District", "street": [ { "id": "200101", diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts index a448bcf2..20bcd104 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts +++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts @@ -32,7 +32,6 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit { ngOnInit() {} ngOnDestroy() { - console.log(this.progressingTimer) this.progressingTimer.forEach((item) => { clearInterval(item.timer) }) @@ -51,26 +50,29 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit { getCSMFBusinessList(): void { this.loading = true; this.listOfData = []; - let paramsObj = { + const paramsObj = { status: this.selectedValue.toLocaleLowerCase(), pageNo: this.pageIndex, pageSize: this.pageSize }; - let getCSMFSlicingBusinessListFailedCallback = () => { + const getCSMFSlicingBusinessListFailedCallback = () => { this.loading = false; } this.myhttp.getCSMFSlicingBusinessList(paramsObj, getCSMFSlicingBusinessListFailedCallback).then(res => { const { result_body: { slicing_order_list, record_number } } = res; - this.loading = false; + setTimeout(() => { + this.loading = false; + }, 100); + this.total = record_number; if (slicing_order_list !== null && slicing_order_list.length > 0) { this.listOfData = slicing_order_list.map((item, index) => { item.order_creation_time = moment(Number(item.order_creation_time)).format('YYYY-MM-DD HH:mm:ss'); if (item.last_operation_progress && item.last_operation_type && Number(item.last_operation_progress) < 100) { - let updata = (prodata: { operation_progress: string }) => { + const updata = (prodata: { operation_progress: string }) => { item.last_operation_progress = prodata.operation_progress || item.last_operation_progress; }; - let obj = { + const obj = { serviceId: item.order_id }; if (item.last_operation_type.toUpperCase() === 'DELETE') this.terminateStart[index] = true @@ -120,23 +122,20 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit { }, nzCancelText: 'No', nzOnCancel: () => { - let singleSlicing = Object.assign({}, this.listOfData[i]); + const singleSlicing = Object.assign({}, this.listOfData[i]); this.listOfData[i] = singleSlicing; this.listOfData = [...this.listOfData]; } }); } changeActivate(paramsObj: any, isActivate: boolean, index: number): void { - this.loading = true; - let changeActivateFailedCallback = () => { - this.loading = false; - let singleSlicing = Object.assign({}, this.listOfData[index]); + const changeActivateFailedCallback = () => { + const singleSlicing = Object.assign({}, this.listOfData[index]); this.listOfData[index] = singleSlicing; this.listOfData = [...this.listOfData]; this.getCSMFBusinessList(); } this.myhttp.changeActivateSlicingService(paramsObj, isActivate, changeActivateFailedCallback).then((res) => { - this.loading = false; this.getCSMFBusinessList(); }) } @@ -146,15 +145,12 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit { nzTitle: 'Are you sure you want to terminate this task?', nzContent: '<b>Name: </b>' + slicing.order_name, nzOnOk: () => { - let paramsObj = { serviceId: slicing.order_id }; + const paramsObj = { serviceId: slicing.order_id }; this.terminateStart[index] = true; - this.loading = true; - let terminateFailedCallback = () => { - this.loading = false; + const terminateFailedCallback = () => { this.terminateStart[index] = false; } this.myhttp.terminateSlicingService(paramsObj, terminateFailedCallback).then(res => { - this.loading = false; this.getCSMFBusinessList(); }) }, @@ -166,8 +162,8 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit { } queryProgress(obj:any, index:number, callback:any) { return new Promise(res => { - let requery = () => { - let queryProgressFailedCallback = () => { + const requery = () => { + const queryProgressFailedCallback = () => { this.progressingTimer.forEach((item) => { if (item.serviceId === obj.serviceId) { clearInterval(item.timer); |