f65ed32cfd12b2b5c644a8bcebb4a6f0068e20f1
[usecase-ui.git] /
1 import { Component, OnInit, Input, Output, EventEmitter, ViewChild } from '@angular/core';
2 import { NzMessageService } from 'ng-zorro-antd';
3 import { SlicingTaskServices } from '@src/app/core/services/slicingTaskServices';
4
5 @Component({
6   selector: 'app-slicing-task-model',
7   templateUrl: './slicing-task-model.component.html',
8   styleUrls: ['./slicing-task-model.component.less']
9 })
10 export class SlicingTaskModelComponent implements OnInit {
11   @Input() showDetail: boolean;
12   @Input() moduleTitle: string;
13   @Input() taskId: string;
14   @Output() cancel = new EventEmitter<object>();
15   @ViewChild('notification') notification1: any;
16
17   constructor(private http: SlicingTaskServices, private message: NzMessageService) { }
18
19   // 配置审核详情
20   checkDetail: any[] = [{}];
21   //业务需求信息
22   businessRequirement: any[] = [];
23   //匹配NST信息 
24   NSTinfo: object[] = [{}];
25   // 共享切片实例
26   selectedServiceId: string;
27   selectedServiceName: string;
28   slicingInstances: any;
29   // 子网实例
30   slicingSubnet: any[] = [
31     {
32       title: 'An',
33       context: 'an',
34       slicingId: '',
35       slicingName: '',
36       total: 0,
37       currentPage: '1',
38       pageSize: '10',
39       isLoading: false,
40       flag: false,
41       instances: []
42     },
43     {
44       title: 'Tn',
45       context: 'tn',
46       slicingId: '',
47       slicingName: '',
48       total: 0,
49       currentPage: '1',
50       pageSize: '10',
51       isLoading: false,
52       flag: false,
53       instances: []
54     },
55     {
56       title: 'Cn',
57       context: 'cn',
58       slicingId: '',
59       slicingName: '',
60       total: 0,
61       currentPage: '1',
62       pageSize: '10',
63       isLoading: false,
64       flag: false,
65       instances: []
66     }
67   ]
68   isDisabled: boolean = true;
69   // 子网参数
70   isShowParams: boolean;
71   paramsTitle: string;
72   params: any;
73   // 获取数据loading
74   isSpinning: boolean = false;
75   loading: boolean = false;
76
77
78   ngOnInit() { }
79
80   ngOnChanges() {
81     if (this.showDetail) {
82       this.isSpinning = true;
83       this.getautidInfo();
84     } else {
85       this.isDisabled = true;
86     }
87   }
88
89   // used for picking some key-value pairs from a object. 
90   pick(obj, arr): Object {
91     return arr.reduce((iter, val) => {
92       if(val in obj) {
93         iter[val] = obj[val];
94       }
95       return iter;
96     }, {});
97   }
98
99   getautidInfo(): void {
100     this.http.getAuditInfo(this.taskId).subscribe( res => {
101       const { result_header: { result_code, result_message } } = res;
102       this.isSpinning = false;
103       if (+result_code === 200) {
104         const {
105           business_demand_info,
106           nst_info,
107           nsi_nssi_info,
108           ...checkInfo
109         } = res.result_body;
110         // 处理配置审核详情数据
111         this.checkDetail = [{...checkInfo, 'service_snssai': business_demand_info.service_snssai}];
112         // 业务需求信息数据
113         business_demand_info.area = business_demand_info.coverage_area_ta_list.map(item => {
114           item = item.split(';').join(' - ')
115           return item
116         })
117         // 前端模拟数据
118         let areaList = ["Haidian District;Beijing;Beijing", "Xicheng District;Beijing;Beijing", "Changping District;Beijing;Beijing"].map(item => {
119           item = item.split(';').join(' - ')
120           return item
121         })
122         this.businessRequirement = [{ ...business_demand_info, area: areaList }];
123         // 匹配NST信息
124         this.NSTinfo = [nst_info];
125         // 共享切片实例
126         this.selectedServiceId = nsi_nssi_info.suggest_nsi_id;
127         this.selectedServiceName = nsi_nssi_info.suggest_nsi_name;
128         if (!this.selectedServiceId || !this.selectedServiceName) {
129           this.isDisabled = false;
130         }
131         this.slicingInstances = {
132           currentPage: '1',
133           pageSize: '10',
134           isLoading: false,
135           total: 0,
136           flag: false,
137           list: [{
138             service_instance_id: this.selectedServiceId,
139             service_instance_name: this.selectedServiceName
140           }]
141         }
142         // 子网实例
143         let subnetData = this.pick(nsi_nssi_info, ['an_suggest_nssi_id', 'an_suggest_nssi_name', 'tn_suggest_nssi_id', 'tn_suggest_nssi_name', 'cn_suggest_nssi_id', 'cn_suggest_nssi_name']);
144         this.subnetDataFormatting(subnetData, 0);
145         // 前端模拟数据
146         let area = ["Beijing;Beijing;Haidian District", "Beijing;Beijing;Xicheng District", "Beijing;Beijing;Changping District"];
147         this.slicingSubnet[0].params = {...this.pick(nsi_nssi_info, [
148                 'an_service_snssai',
149                 'an_resource_sharing_level',
150                 'an_ue_mobility_level',
151                 'an_latency',
152                 'an_max_number_of_ues',
153                 'an_activity_factor',
154                 'an_exp_data_rate_dl',
155                 'an_exp_data_rate_ul',
156                 'an_area_traffic_cap_dl',
157                 'an_area_traffic_cap_ul',
158                 'an_script_name',
159                 'an_overalluser_density',
160                 'an_Endpoint'
161             ]), an_coverage_area_ta_list: area};
162         this.slicingSubnet[1].params = this.pick(nsi_nssi_info, ['tn_latency', 'tn_bandwidth', 'tn_script_name', 'tn_jitter', 'tn_service_snssai']);
163         this.slicingSubnet[2].params = {...this.pick(nsi_nssi_info, [
164           'cn_service_snssai',
165           'cn_resource_sharing_level',
166           'cn_ue_mobility_level',
167           'cn_latency',
168           'cn_max_number_of_ues',
169           'cn_activity_factor',
170           'cn_exp_data_rate_dl',
171           'cn_exp_data_rate_ul',
172           'cn_area_traffic_cap_dl',
173           'cn_area_traffic_cap_ul',
174           'cn_script_name',
175           'cn_overalluser_density',
176           'cn_Endpoint'
177         ])};
178       } else {
179         this.message.error(result_message || 'Failed to get data')
180       }
181     }, ({ status, statusText }) => {
182       this.message.error(status + ' (' + statusText + ')');
183       this.isSpinning = false;
184     })
185   }
186
187   openSlicingInstance(bool: boolean): void {
188     const { total, currentPage, pageSize } = this.slicingInstances;
189     if (bool && !total) {
190       this.slicingInstances.list = [];
191       this.getSlicingInstances(currentPage, pageSize)
192     }
193   }
194
195   getNextPageData(): void {
196     const { total, currentPage, pageSize } = this.slicingInstances;
197     if (total - (+currentPage * +pageSize) > 0) {
198       if (this.slicingInstances.flag) return;
199       this.slicingInstances.flag = true
200       this.getSlicingInstances(currentPage, pageSize)
201       this.slicingInstances.currentPage = (+this.slicingInstances.currentPage + 1).toString();
202     }
203   }
204
205   getSlicingInstances(pageNo: string, pageSize: string): void {
206     this.slicingInstances.isLoading = true;
207     this.http.getSlicingInstance(pageNo, pageSize).subscribe(res => {
208       const { result_header: { result_code, result_message }, result_body } = res;
209       setTimeout(() => {
210         if (+result_code === 200) {
211           const { nsi_service_instances, record_number } = result_body;
212           this.slicingInstances.total = record_number;
213           this.slicingInstances.list.push(...nsi_service_instances);
214         } else {
215           this.message.error(result_message || 'Failed to get slicing instance ID')
216         }
217         this.slicingInstances.isLoading = false;
218         this.slicingInstances.flag = false;
219       }, 2000)
220     }, ({ status, statusText }) => {
221       this.message.error(status + ' (' + statusText + ')');
222       this.slicingInstances.isLoading = false;
223       this.slicingInstances.flag = false;
224     })
225   }
226
227
228   slicingInstanceChange(): void { // choose the target nssi
229     this.isDisabled = true;
230     this.selectedServiceName = '';
231     // 获取切片子网实例数据
232     this.http.getSlicingSubnetInstance(this.selectedServiceId).subscribe(res => {
233       const { result_header: { result_code, result_message }, result_body, record_number} = res;
234       if (+result_code === 200) {
235         this.subnetDataFormatting(result_body, record_number)
236       } else {
237         this.subnetDataFormatting({}, 1);
238         this.message.error(result_message || 'Failed to get slicing subnet instance ID')
239       }
240     }, ({ status, statusText }) => {
241       this.message.error(status + ' (' + statusText + ')');
242     })
243     this.slicingInstances.list.forEach(item => {
244       if (item.service_instance_id === this.selectedServiceId) {
245         this.selectedServiceName = item.service_instance_name;
246       }
247     })
248   }
249
250   subnetDataFormatting ( subnetData?: any, total?: number): void{
251     const { an_suggest_nssi_id, an_suggest_nssi_name, tn_suggest_nssi_id, tn_suggest_nssi_name, cn_suggest_nssi_id, cn_suggest_nssi_name } = subnetData;
252     this.slicingSubnet[0].slicingId = an_suggest_nssi_id;
253     this.slicingSubnet[0].slicingName = an_suggest_nssi_name;
254     this.slicingSubnet[0].total = total;
255     this.slicingSubnet[0].currentPage = '1';
256     this.slicingSubnet[0].instances = [{
257       service_instance_id: an_suggest_nssi_id,
258       service_instance_name: an_suggest_nssi_name
259     }];
260
261     this.slicingSubnet[1].slicingId = tn_suggest_nssi_id;
262     this.slicingSubnet[1].slicingName = tn_suggest_nssi_name;
263     this.slicingSubnet[1].total = total;
264     this.slicingSubnet[1].currentPage = '1';
265     this.slicingSubnet[1].instances = [{
266       service_instance_id: tn_suggest_nssi_id,
267       service_instance_name: tn_suggest_nssi_name
268     }];
269
270     this.slicingSubnet[2].slicingId = cn_suggest_nssi_id;
271     this.slicingSubnet[2].slicingName = cn_suggest_nssi_name;
272     this.slicingSubnet[2].total = total;
273     this.slicingSubnet[2].currentPage = '1';
274     this.slicingSubnet[2].instances = [{
275       service_instance_id: cn_suggest_nssi_id,
276       service_instance_name: cn_suggest_nssi_name
277     }];
278   }
279
280   resetSlicingInstance(): void {
281     this.selectedServiceId = '';
282     this.selectedServiceName = '';
283     this.slicingSubnet.map(item => {
284       item.slicingId = '';
285       item.slicingName = '';
286     })
287     this.isDisabled = false;
288   }
289
290   openSubnetInstances(bool: boolean, instance: any): void {
291     if (bool && !instance.total) {
292       instance.instances = []
293       this.getSubnetInstances(instance)
294     }
295   }
296
297   getNextPageSubnet(instance: any): void {
298     const { total, currentPage, pageSize } = instance;
299     if (total - (+currentPage * +pageSize) > 0) {
300       if (instance.flag) return;
301       instance.flag = true;
302       this.getSubnetInstances(instance);
303       let count = +instance.currentPage;
304       instance.currentPage = (++count).toString();
305     }
306   }
307
308   getSubnetInstances(instance: any): void {
309     instance.isLoading = true;
310     const { context, currentPage, pageSize } = instance;
311     this.http.getSubnetInContext(context, currentPage, pageSize).subscribe(res => {
312       const { result_header: { result_code, result_message }, result_body } = res;
313       if (+result_code === 200) {
314         const { nssi_service_instances, record_number } = result_body;
315         this.slicingSubnet.map(item => {
316           if (item.context === context) {
317             item.total = record_number;
318             item.instances.push(...nssi_service_instances);
319           }
320         })
321       } else {
322         this.message.error(result_message || 'Failed to get slicing subnet instance ID');
323       }
324       instance.isLoading = false;
325       instance.flag = false;
326     }, ({ status, statusText }) => {
327       this.message.error(status + ' (' + statusText + ')');
328       instance.isLoading = false;
329       instance.flag = false;
330     })
331   }
332
333   slicingSubnetChange(instance: any): void {
334     instance.slicingName = ''
335     instance.instances.forEach(item => {
336       if (instance.slicingId === item.service_instance_id) {
337         instance.slicingName = item.service_instance_name;
338       }
339     })
340   }
341
342   restSubnetInstance(instance: any): void {
343     instance.slicingId = '';
344     instance.slicingName = '';
345   }
346
347   showParamsModel(item: any): void {
348     console.log(item,"------->")
349     this.isShowParams = true;
350     this.paramsTitle = item.title;
351     this.params = item.params
352   }
353
354   changeParams(params: any): void {
355     const index = this.paramsTitle === 'An' ? 0 : (this.paramsTitle === 'Tn' ? 1 : 2);
356     this.slicingSubnet[index].params = params
357   }
358
359   handleCancel(bool: boolean = false) {
360     this.showDetail = false;
361     this.cancel.emit({ showDetail: this.showDetail, bool });
362   }
363   handleOk() {
364     this.loading = true;
365     const { selectedServiceId, selectedServiceName, slicingSubnet, checkDetail, businessRequirement, NSTinfo } = this;
366     const nsi_nssi_info: object = {
367       suggest_nsi_id: selectedServiceId,
368       suggest_nsi_name: selectedServiceName,
369       an_suggest_nssi_id: slicingSubnet[0].slicingId,
370       an_suggest_nssi_name: slicingSubnet[0].slicingName,
371       ...slicingSubnet[0].params,
372       tn_suggest_nssi_id: slicingSubnet[1].slicingId,
373       tn_suggest_nssi_name: slicingSubnet[1].slicingName,
374       ...slicingSubnet[1].params,
375       cn_suggest_nssi_id: slicingSubnet[2].slicingId,
376       cn_suggest_nssi_name: slicingSubnet[2].slicingName,
377       ...slicingSubnet[2].params,
378     }
379     delete businessRequirement[0].area
380     let reqBody = { ...checkDetail[0], business_demand_info: businessRequirement[0], nst_info: NSTinfo[0], nsi_nssi_info };
381     delete reqBody.service_snssai;
382     this.http.submitSlicing(reqBody).subscribe(res => {
383       const { result_header: { result_code } } = res;
384       if (+result_code === 200) {
385         this.notification1.notificationSuccess('Task', 'Sumbit', this.taskId)
386       } else {
387         this.notification1.notificationFailed('Task', 'Sumbit', this.taskId)
388       }
389       this.loading = false;
390       this.handleCancel(true);
391     }, ({ status, statusText }) => {
392       this.message.error(status + ' (' + statusText + ')');
393       this.loading = false;
394     })
395   }
396 }