gerrit.onap Code Review - usecase-ui.git/blob

   1 import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
   2 import {COMMUNICATION_FORM_ITEMS, COMMUNICATION_FORM_ADDRESS} from "../../../../../../constants/constants";
   3 import {SlicingTaskServices} from "../../../../../core/services/slicingTaskServices";
   4 import {NzMessageService} from "ng-zorro-antd";
   5 @Component({
   6   selector: 'app-business-order',
   7   templateUrl: './business-order.component.html',
   8   styleUrls: ['./business-order.component.less']
   9 })
  10 export class BusinessOrderComponent implements OnInit {
  11
  12     constructor(
  13         private myhttp: SlicingTaskServices,
  14         private message: NzMessageService
  15         ) {
  16     }
  17
  18     ngOnInit() {
  19     }
  20     ngOnChanges() {
  21         this.AreaFormatting();
  22     }
  23     @Input() showModel: boolean;
  24     @Output() cancel = new EventEmitter<boolean>();
  25     comunicationFormItems = COMMUNICATION_FORM_ITEMS;
  26     slicing_order_info = {
  27         name: null,
  28         maxNumberofUEs: null,
  29         expDataRateDL: null,
  30         latency: null,
  31         expDataRateUL: null,
  32         resourceSharingLevel: "shared",
  33         uEMobilityLevel: "stationary",
  34         useInterval: null,
  35         coverageArea: ''
  36     };
  37     areaList: any[] = [];
  38     isSpinning: boolean = false;
  39     validateRules: any[] = [];
  40     rulesText: any[] = [];
  41     tooltipText: string = 'Scope: 1-100000';
  42     AreaFormatting() {
  43         let areaList = ['Beijing;Beijing;Haidian District;Wanshoulu Street'];
  44         this.areaList = areaList.map((item: any) => {
  45             let arr = item.split(';');
  46             item = arr.map((ite, index) => {
  47                 let key: string;
  48                 if (!index) {
  49                     key = 'province';
  50                 } else if (index === 1) {
  51                     key = 'city'
  52                 } else if (index === 2) {
  53                     key = 'district'
  54                 } else {
  55                     key = 'street'
  56                 }
  57                 const obj: any = {};
  58                 obj.key = key;
  59                 obj.selected = ite
  60                 obj.options = [{name: ite, id: ite}]
  61                 return obj
  62             })
  63             return item;
  64         })
  65     }
  66
  67     creatAreaList (): void {
  68         let arr = [
  69             {
  70                 key: 'province',
  71                 selected: '',
  72                 options: []
  73             },
  74             {
  75                 key: 'city',
  76                 selected: '',
  77                 options: []
  78             },
  79             {
  80                 key: 'district',
  81                 selected: '',
  82                 options: []
  83             },
  84             {
  85                 key: 'street',
  86                 selected: '',
  87                 options: []
  88             }
  89         ]
  90         this.areaList.push(arr)
  91     }
  92
  93     deleteAreaList (index: number): void {
  94         this.areaList.splice(index,1);
  95     }
  96
  97     handleChange(area: any[], areaItem: any): void{
  98         if (areaItem.key === 'province' && areaItem.options.length <= 1) {
  99             areaItem.options = COMMUNICATION_FORM_ADDRESS;
 100         } else if (areaItem.key === 'city' && areaItem.options.length <= 1) {
 101             COMMUNICATION_FORM_ADDRESS.forEach( item => {
 102                 if(item.name === area[0].selected) {
 103                     areaItem.options = item.city;
 104                 }
 105             })
 106         }else if (areaItem.key === 'district' && areaItem.options.length <= 1) {
 107             COMMUNICATION_FORM_ADDRESS.forEach( (item: any) => {
 108                 item.city.forEach(city => {
 109                     if (city.name === area[1].selected) {
 110                         areaItem.options = city.county;
 111                     }
 112                 })
 113             })
 114         }else if (areaItem.key === 'street' && areaItem.options.length <= 1) {
 115             COMMUNICATION_FORM_ADDRESS.forEach( (item: any) => {
 116                 item.city.forEach(city => {
 117                     if (city.name === area[1].selected) {
 118                         city.county.forEach(county => {
 119                             if (county.name === area[2].selected) {
 120                                 areaItem.options = county.street;
 121                             }
 122                         })
 123                     }
 124                 })
 125             })
 126         }
 127     }
 128
 129     handleChangeSelected(area: any[], areaItem: any) {
 130         if (areaItem.key === 'province') {
 131             area[1].selected = ''
 132             area[1].options = [];
 133             area[2].selected = '';
 134             area[2].options = [];
 135             area[3].selected = '';
 136             area[3].options = [];
 137         } else if (areaItem.key === 'city') {
 138             area[2].selected = '';
 139             area[2].options = [];
 140             area[3].selected = '';
 141             area[3].options = [];
 142         }else if (areaItem.key === 'district') {
 143             area[3].selected = '';
 144             area[3].options = [];
 145         }
 146     }
 147
 148     handleCancel() {
 149         this.showModel = false;
 150         this.cancel.emit(this.showModel);
 151         this.slicing_order_info = {
 152             name: null,
 153             maxNumberofUEs: null,
 154             expDataRateDL: null,
 155             latency: null,
 156             expDataRateUL: null,
 157             resourceSharingLevel: "shared",
 158             uEMobilityLevel: "stationary",
 159             useInterval: null,
 160             coverageArea: ''
 161         };
 162     }
 163
 164     changeTooltipText(title){
 165         if(title === 'Max Number of UEs'){
 166             this.tooltipText = 'Scope: 1-100000'
 167         }else if(title === 'Data Rate Downlink (Mbps)' || title === 'Data Rate Uplink (Mbps)'){
 168             this.tooltipText = 'Scope: 100-3000'
 169         }else if(title === 'Latency'){
 170             this.tooltipText = 'Scope: 10-200'
 171         }else if(title === 'Use Interval (Month)'){
 172             this.tooltipText = 'Scope: ≥1'
 173         }
 174     }
 175
 176     getRulesText = (words,title,val,index) => {
 177         return this.rulesText[index] = words + title
 178     };
 179
 180     validator(key,val,i){
 181         if(val === null || val.replace(/\s*/g,'').length<=0){
 182             this.validateRules[i] = true;
 183             this.getRulesText('Please enter',key,val,i,);
 184             return false
 185         }else {
 186             this.validateRules[i] = false;
 187         }
 188         if(key === 'maxNumberofUEs' && !/^([1-9]\d{0,4}|100000)$/.test(val) && isNaN(val)){
 189             this.validateRules[i] = true;
 190             this.getRulesText('Only numbers can be entered','','',i);
 191             return false
 192         }else if(key === 'maxNumberofUEs' && !/^([1-9]\d{0,4}|100000)$/.test(val) && !isNaN(val)){
 193             console.log("-----maxNumberofUEs")
 194             this.validateRules[i] = true;
 195             this.getRulesText('Scope: 1-100000','','',i);
 196             return false
 197         }else {
 198             this.validateRules[i] = false;
 199         }if((key === 'expDataRateDL' || key === 'expDataRateUL') && !/^([1-9]\d{2}|[1-3]\d{3}|3000)$/.test(val) && isNaN(val)){
 200             this.validateRules[i] = true;
 201             this.getRulesText('Only numbers can be entered','','',i);
 202             return false
 203         }else if((key === 'expDataRateDL' || key === 'expDataRateUL') && !/^([1-9]\d{2}|[1-3]\d{3}|3000)$/.test(val) && !isNaN(val)){
 204             this.validateRules[i] = true;
 205             this.getRulesText('Scope: 100-3000','','',i);
 206             return false
 207         }else {
 208             this.validateRules[i] = false;
 209         }if(key === 'latency' && !/^1[0-9]$|^[2-9]\d$|^1\d{2}$|^200$/.test(val) && isNaN(val)){
 210             this.validateRules[i] = true;
 211             this.getRulesText('Only numbers can be entered','','',i);
 212             return false
 213         }else if(key === 'latency' && !/^1[0-9]$|^[2-9]\d$|^1\d{2}$|^200$/.test(val) && !isNaN(val)){
 214             this.validateRules[i] = true;
 215             this.getRulesText('Scope: 10-200','','',i);
 216             return false
 217         }else {
 218             this.validateRules[i] = false;
 219         }if(key === 'useInterval' && !/^[1-9]\d*$/.test(val) && isNaN(val)){
 220             this.validateRules[i] = true;
 221             this.getRulesText('Only numbers can be entered','','',i);
 222             return false
 223         }else if(key === 'useInterval' && !/^[1-9]\d*$/.test(val) && !isNaN(val)){
 224             this.validateRules[i] = true;
 225             this.getRulesText('Scope: ≥1','','',i);
 226             return false
 227         }else {
 228             this.validateRules[i] = false;
 229         }
 230     }
 231
 232     handleOk(): void {
 233         Object.keys(this.slicing_order_info).forEach((item,index)=>{
 234             if(item !== 'resourceSharingLevel' && item !== 'uEMobilityLevel' && item !== 'coverageArea'){
 235                 this.validator(item,this.slicing_order_info[item],index)
 236             }
 237         });
 238         if(this.validateRules.indexOf(true)>-1){
 239             return
 240         };
 241             const coverage_list: string[] = [];
 242             this.areaList.forEach( item => {
 243                 let str: string = '';
 244                 item.forEach( area => {
 245                     str += area.selected + ';';
 246                 });
 247                 coverage_list.push(str.substring(0, str.length-1));
 248             });
 249             if(coverage_list.length>1){
 250                 this.slicing_order_info.coverageArea = coverage_list.join('|')
 251             }else {
 252                 this.slicing_order_info.coverageArea = coverage_list.toString();
 253             }
 254         let paramsObj = {
 255             slicing_order_info:this.slicing_order_info
 256         };
 257         console.log(paramsObj,"-----paramsObj");
 258         this.isSpinning = true;
 259         this.myhttp.csmfSlicingPurchase(paramsObj).subscribe(res => {
 260             const { result_header: { result_code, result_message }, result_body: { service_id,operation_id } } = res;
 261             if (+result_code === 200) {
 262                 this.isSpinning = false;
 263                 this.handleCancel();
 264             }
 265         }, (err) => {
 266             this.message.error(err);
 267             this.handleCancel();
 268             this.isSpinning = false;
 269         })
 270     }
 271 }