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 { Util } from '../../../../../shared/utils/utils';
   4 import {SlicingTaskServices} from "../../../../../core/services/slicingTaskServices";
   5 import {NzMessageService} from "ng-zorro-antd";
   6
   7 @Component({
   8     selector: 'app-business-order',
   9     templateUrl: './business-order.component.html',
  10     styleUrls: ['./business-order.component.less']
  11 })
  12 export class BusinessOrderComponent implements OnInit {
  13
  14     constructor(
  15         private myhttp: SlicingTaskServices,
  16         private message: NzMessageService,
  17         private Util: Util
  18     ) {
  19     }
  20
  21     ngOnInit() {
  22     }
  23
  24     ngOnChanges() {
  25         this.AreaFormatting();
  26     }
  27
  28     @Input() showModel: boolean;
  29     @Output() cancel = new EventEmitter<boolean>();
  30     comunicationFormItems = COMMUNICATION_FORM_ITEMS;
  31     slicing_order_info = {
  32         name: null,
  33         maxNumberofUEs: null,
  34         expDataRateDL: null,
  35         latency: null,
  36         expDataRateUL: null,
  37         resourceSharingLevel: "shared",
  38         uEMobilityLevel: "stationary",
  39         coverageArea: ''
  40     };
  41     areaList: any[] = [];
  42     isSpinning: boolean = false;
  43     validateRulesShow: any[] = [];
  44     rulesText: any[] = [];
  45     tooltipText: string = 'Scope: 1-100000';
  46
  47     AreaFormatting(): void {
  48         let areaList = ['Beijing;Beijing;Haidian District;Wanshoulu Street'];
  49         this.areaList = areaList.map((item: any) => {
  50             let arr = item.split(';');
  51             item = arr.map((it, index) => {
  52                 let key: string;
  53                 if (!index) {
  54                     key = 'province';
  55                 } else if (index === 1) {
  56                     key = 'city'
  57                 } else if (index === 2) {
  58                     key = 'district'
  59                 } else {
  60                     key = 'street'
  61                 }
  62                 const obj: any = {};
  63                 obj.key = key;
  64                 obj.selected = it;
  65                 obj.options = [{name: it, id: it}]
  66                 return obj
  67             })
  68             return item;
  69         })
  70     }
  71
  72     creatAreaList(): void {
  73         let arr = [
  74             {
  75                 key: 'province',
  76                 selected: '',
  77                 options: []
  78             },
  79             {
  80                 key: 'city',
  81                 selected: '',
  82                 options: []
  83             },
  84             {
  85                 key: 'district',
  86                 selected: '',
  87                 options: []
  88             },
  89             {
  90                 key: 'street',
  91                 selected: '',
  92                 options: []
  93             }
  94         ]
  95         this.areaList.push(arr)
  96     }
  97
  98     deleteAreaList(index: number): void {
  99         this.areaList.splice(index, 1);
 100     }
 101
 102     handleChange(area: any[], areaItem: any): void {
 103         if (areaItem.key === 'province' && areaItem.options.length <= 1) {
 104             areaItem.options = COMMUNICATION_FORM_ADDRESS;
 105         } else if (areaItem.key === 'city' && areaItem.options.length <= 1) {
 106             COMMUNICATION_FORM_ADDRESS.forEach(item => {
 107                 if (item.name === area[0].selected) {
 108                     areaItem.options = item.city;
 109                 }
 110             })
 111         } else if (areaItem.key === 'district' && areaItem.options.length <= 1) {
 112             COMMUNICATION_FORM_ADDRESS.forEach((item: any) => {
 113                 item.city.forEach(city => {
 114                     if (city.name === area[1].selected) {
 115                         areaItem.options = city.county;
 116                     }
 117                 })
 118             })
 119         } else if (areaItem.key === 'street' && areaItem.options.length <= 1) {
 120             COMMUNICATION_FORM_ADDRESS.forEach((item: any) => {
 121                 item.city.forEach(city => {
 122                     if (city.name === area[1].selected) {
 123                         city.county.forEach(county => {
 124                             if (county.name === area[2].selected) {
 125                                 areaItem.options = county.street;
 126                             }
 127                         })
 128                     }
 129                 })
 130             })
 131         }
 132     }
 133
 134     handleChangeSelected(area: any[], areaItem: any): void {
 135         let areaItemIndex = area.indexOf(areaItem);
 136         area.map((item,index)=>{
 137             if(index > areaItemIndex){
 138                 item.selected = '';
 139                 item.options = [];
 140             }
 141         })
 142     }
 143
 144     handleCancel(): void {
 145         this.showModel = false;
 146         this.cancel.emit(this.showModel);
 147         this.slicing_order_info = {
 148             name: null,
 149             maxNumberofUEs: null,
 150             expDataRateDL: null,
 151             latency: null,
 152             expDataRateUL: null,
 153             resourceSharingLevel: "shared",
 154             uEMobilityLevel: "stationary",
 155             coverageArea: ''
 156         };
 157     }
 158
 159     changeTooltipText(title: string): void {
 160         if (title === 'Max Number of UEs') {
 161             this.tooltipText = 'Scope: 1-100000'
 162         } else if (title === 'Data Rate Downlink (Mbps)' || title === 'Data Rate Uplink (Mbps)') {
 163             this.tooltipText = 'Scope: 100-3000'
 164         } else if (title === 'Latency') {
 165             this.tooltipText = 'Scope: 10-200'
 166         } else if (title === 'Use Interval (Month)') {
 167             this.tooltipText = 'Scope: ≥1'
 168         }
 169     }
 170
 171     handleOk(): void {
 172         COMMUNICATION_FORM_ITEMS.forEach((item, index) => {
 173             if (item.key !== 'resourceSharingLevel' && item.key !== 'uEMobilityLevel' && item.key !== 'coverageArea') {
 174                 this.Util.validator(item.title,item.key, this.slicing_order_info[item.key], index, this.rulesText, this.validateRulesShow)
 175             }
 176         });
 177         if (this.validateRulesShow.indexOf(true) > -1) {
 178             return
 179         }
 180         const coverage_list: string[] = [];
 181         this.areaList.forEach(item => {
 182             let str = '';
 183             item.forEach(area => {
 184                 str += area.selected + ';';
 185             });
 186             coverage_list.push(str.substring(0, str.length - 1));
 187         });
 188         if (coverage_list.length > 1) {
 189             this.slicing_order_info.coverageArea = coverage_list.join('|')
 190         } else {
 191             this.slicing_order_info.coverageArea = coverage_list.toString();
 192         }
 193         let paramsObj = {
 194             slicing_order_info: this.slicing_order_info
 195         };
 196         this.isSpinning = true;
 197         let csmfSlicingPurchaseFailedCallback  = () => {
 198             this.handleCancel();
 199             this.isSpinning = false;
 200         }
 201         this.myhttp.csmfSlicingPurchase(paramsObj, csmfSlicingPurchaseFailedCallback).then(res => {
 202             this.isSpinning = false;
 203             this.handleCancel();
 204         })
 205     }
 206 }