feat: Optimize the public request method of axios

Change-Id: Iab9e86c66628c9a0c39e0a9ed56607417805c9d4
Issue-ID: USECASEUI-444
Signed-off-by: cyuamber <xuranyjy@chinamobile.com>

12 files changed, 392 insertions, 515 deletions

diff --git a/usecaseui-portal/src/app/views/fcaps/monitor-5g/monitor-5g.component.ts b/usecaseui-portal/src/app/views/fcaps/monitor-5g/monitor-5g.component.ts
index 3ed3fe61..2c763909 100644
--- a/usecaseui-portal/src/app/views/fcaps/monitor-5g/monitor-5g.component.ts
+++ b/usecaseui-portal/src/app/views/fcaps/monitor-5g/monitor-5g.component.ts
@@ -52,26 +52,19 @@ export class Monitor5gComponent implements OnInit {
             pageNo: this.pageIndex,
             pageSize: this.pageSize
         };
-        this.myhttp.getSlicingBusinessList(paramsObj, false).subscribe(res => {
-            const { result_header: { result_code }, result_body: { slicing_business_list, record_number } } = res;
-            this.loading = false;
-            if (+result_code === 200) {
-                this.total = record_number;
-                this.loading = false;
-                this.listOfData = [].concat(slicing_business_list);
-                this.getChartsData();
-            }else {
-                console.log("getBusinessList false");
-                this.isSpinningTraffic = false;
-                this.isSpinningOnlineuser = false;
-                this.isSpinningBandwidth = false;
-            }
-        },(res) => {
+        let getSlicingBusinessListFailedCallback = () => {
             this.loading = false;
             this.isSpinningTraffic = false;
             this.isSpinningOnlineuser = false;
             this.isSpinningBandwidth = false;
-            console.error(res);
+        }
+        this.myhttp.getSlicingBusinessList(paramsObj, false, getSlicingBusinessListFailedCallback).then(res => {
+            const { result_body: { slicing_business_list, record_number } } = res;
+            this.loading = false;
+            this.total = record_number;
+            this.loading = false;
+            this.listOfData = [].concat(slicing_business_list);
+            this.getChartsData();
         })
     }
     disabledDate = (current: Date): boolean => {
@@ -118,10 +111,13 @@ export class Monitor5gComponent implements OnInit {
         this.fetchBandwidthData(requestBody, time);
     }
     fetchTrafficData(service_list, time) {
-        this.myhttp.getFetchTraffic(service_list, time).subscribe(res => {
+        let getFetchTrafficFailedCallback  = () => {
+            this.isSpinningTraffic = false;
+        }
+        this.myhttp.getFetchTraffic(service_list, time, getFetchTrafficFailedCallback).then(res => {
             this.isSpinningTraffic = false;
-            const { result_header: { result_code }, result_body: { slicing_usage_traffic_list } } = res;
-            if (+result_code === 200 && slicing_usage_traffic_list.length > 0) {
+            const { result_body: { slicing_usage_traffic_list } } = res;
+            if (slicing_usage_traffic_list.length > 0) {
                 this.trafficData = [];
                 this.trafficLegend = [];
                 slicing_usage_traffic_list.forEach((item) => {
@@ -151,88 +147,81 @@ export class Monitor5gComponent implements OnInit {
                     }]
                 };
             }
-        },(res) => {
-            this.isSpinningTraffic = false;
-            console.error(res);
         })
     }
     fetchOnlineusersData(service_list, time) {
-        this.myhttp.getFetchOnlineusers(service_list, time).subscribe(res => {
+        let getFetchOnlineusersFailedCallback  = () => {
             this.isSpinningOnlineuser = false;
-            const { result_header: { result_code }, result_body: { slicing_online_user_list } } = res;
-            if (+result_code === 200) {
-                this.onlineuserXAxis = [];
-                this.onlineusersData = [];
-                this.onlineuserLegend = [];
-                let filterList = [];
-                filterList = this.filterData(slicing_online_user_list);
-                filterList[0].online_user_list.map((key) => {
-                    let date = moment(Number(key.timestamp)).format('YYYY-MM-DD/HH:mm').split("/")[1];
-                    this.onlineuserXAxis.push(date)
-                });
-                filterList.forEach((item) => {
-                    this.onlineuserLegend.push(item.service_id);
-                    this.onlineusersData.push({
-                        name: item.service_id,
-                        type: 'line',
-                        data: this.getOnlineuserSeriesData(item)
-                    })
-                });
-                this.onlineuserChartData = {
-                    legend: {
-                        bottom: '0px',
-                        type: 'scroll',
-                        data: this.onlineuserLegend
-                    },
-                    xAxis: {
-                        data: this.onlineuserXAxis
-                    },
-                    series: this.onlineusersData
-                };
-            }
-        },(res) => {
+        }
+        this.myhttp.getFetchOnlineusers(service_list, time, getFetchOnlineusersFailedCallback).then(res => {
             this.isSpinningOnlineuser = false;
-            console.error(res);
+            const { result_body: { slicing_online_user_list } } = res;
+            this.onlineuserXAxis = [];
+            this.onlineusersData = [];
+            this.onlineuserLegend = [];
+            let filterList = [];
+            filterList = this.filterData(slicing_online_user_list);
+            filterList[0].online_user_list.map((key) => {
+                let date = moment(Number(key.timestamp)).format('YYYY-MM-DD/HH:mm').split("/")[1];
+                this.onlineuserXAxis.push(date)
+            });
+            filterList.forEach((item) => {
+                this.onlineuserLegend.push(item.service_id);
+                this.onlineusersData.push({
+                    name: item.service_id,
+                    type: 'line',
+                    data: this.getOnlineuserSeriesData(item)
+                })
+            });
+            this.onlineuserChartData = {
+                legend: {
+                    bottom: '0px',
+                    type: 'scroll',
+                    data: this.onlineuserLegend
+                },
+                xAxis: {
+                    data: this.onlineuserXAxis
+                },
+                series: this.onlineusersData
+            };
         })
     }
     fetchBandwidthData(service_list, time) {
-        this.myhttp.getFetchBandwidth(service_list, time).subscribe(res => {
+        let getFetchBandwidthFailedCallback  = () => {
             this.isSpinningBandwidth = false;
-            const { result_header: { result_code }, result_body: { slicing_total_bandwidth_list } } = res;
-            if (+result_code === 200) {
-                this.bandwidthXAxis = [];
-                this.bandwidthData = [];
-                this.bandwidthLegend = [];
-                let filterList = [];
-                filterList = this.filterData(slicing_total_bandwidth_list);
-                console.log(filterList,"filterList----slicing_total_bandwidth");
-                filterList[0].total_bandwidth_list.map((key) => {
-                    let date = moment(Number(key.timestamp)).format('YYYY-MM-DD/HH:mm').split("/")[1];
-                    this.bandwidthXAxis.push(date)
-                });
-                filterList.forEach((item) => {
-                    this.bandwidthLegend.push(item.service_id);
-                    this.bandwidthData.push({
-                        name: item.service_id,
-                        type: 'line',
-                        data: this.getBandwidthSeriesData(item)
-                    })
-                });
-                this.bandwidthChartData = {
-                    legend: {
-                        bottom: '0px',
-                        type: 'scroll',
-                        data: this.bandwidthLegend
-                    },
-                    xAxis: {
-                        data: this.bandwidthXAxis
-                    },
-                    series: this.bandwidthData
-                };
-            }
-        },(res) => {
+        }
+        this.myhttp.getFetchBandwidth(service_list, time, getFetchBandwidthFailedCallback).then(res => {
             this.isSpinningBandwidth = false;
-            console.error(res);
+            const { result_body: { slicing_total_bandwidth_list } } = res;
+            this.bandwidthXAxis = [];
+            this.bandwidthData = [];
+            this.bandwidthLegend = [];
+            let filterList = [];
+            filterList = this.filterData(slicing_total_bandwidth_list);
+            console.log(filterList,"filterList----slicing_total_bandwidth");
+            filterList[0].total_bandwidth_list.map((key) => {
+                let date = moment(Number(key.timestamp)).format('YYYY-MM-DD/HH:mm').split("/")[1];
+                this.bandwidthXAxis.push(date)
+            });
+            filterList.forEach((item) => {
+                this.bandwidthLegend.push(item.service_id);
+                this.bandwidthData.push({
+                    name: item.service_id,
+                    type: 'line',
+                    data: this.getBandwidthSeriesData(item)
+                })
+            });
+            this.bandwidthChartData = {
+                legend: {
+                    bottom: '0px',
+                    type: 'scroll',
+                    data: this.bandwidthLegend
+                },
+                xAxis: {
+                    data: this.bandwidthXAxis
+                },
+                series: this.bandwidthData
+            };
         })
     }
     getOnlineuserSeriesData(item) {
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 c624c64c..cac2bb29 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
@@ -193,20 +193,14 @@ export class BusinessOrderComponent implements OnInit {
         let paramsObj = {
             slicing_order_info: this.slicing_order_info
         };
-        console.log(paramsObj, "-----paramsObj");
         this.isSpinning = true;
-        this.myhttp.csmfSlicingPurchase(paramsObj).subscribe(res => {
-            const {result_header: {result_code}} = res;
-            this.isSpinning = false;
-            if (+result_code === 200) {
-                this.handleCancel();
-            }else{
-                this.message.error(res.result_header.result_message)
-            }
-        }, (err) => {
-            this.message.error(err);
+        let csmfSlicingPurchaseFailedCallback  = () => {
             this.handleCancel();
             this.isSpinning = false;
+        }
+        this.myhttp.csmfSlicingPurchase(paramsObj, csmfSlicingPurchaseFailedCallback).then(res => {
+            this.isSpinning = false;
+            this.handleCancel();
         })
     }
 }
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 9f6a9236..d7062473 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
@@ -49,33 +49,32 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
             pageNo: this.pageIndex,
             pageSize: this.pageSize
         };
-        this.myhttp.getCSMFSlicingBusinessList(paramsObj).subscribe(res => {
-            const { result_header: { result_code }, result_body: { slicing_order_list, record_number } } = res;
+        let getCSMFSlicingBusinessListFailedCallback  = () => {
             this.loading = false;
-            if (+result_code === 200) {
-                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 }) => {
-                                item.last_operation_progress = prodata.operation_progress || item.last_operation_progress;
-                            };
-                            let obj = {
-                                serviceId: item.order_id
-                            };
-                            if (item.last_operation_type.toUpperCase() === 'DELETE') this.terminateStart[index] = true
-                            else this.terminateStart[index] = false;
-                            this.queryProgress(obj, index, updata).then(() => {
-                                item.last_operation_progress = '100';
-                                this.getCSMFBusinessList();
-                            })
-                        }
-                        return item
-                    });
-                }
-            }else{
-                this.message.error(res.result_header.result_message)
+        }
+        this.myhttp.getCSMFSlicingBusinessList(paramsObj, getCSMFSlicingBusinessListFailedCallback).then(res => {
+            const { result_body: { slicing_order_list, record_number } } = res;
+            this.loading = false;
+            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 }) => {
+                            item.last_operation_progress = prodata.operation_progress || item.last_operation_progress;
+                        };
+                        let obj = {
+                            serviceId: item.order_id
+                        };
+                        if (item.last_operation_type.toUpperCase() === 'DELETE') this.terminateStart[index] = true
+                        else this.terminateStart[index] = false;
+                        this.queryProgress(obj, index, updata).then(() => {
+                            item.last_operation_progress = '100';
+                            this.getCSMFBusinessList();
+                        })
+                    }
+                    return item
+                });
             }
         })
     }
@@ -122,25 +121,16 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
     }
     changeActivate(paramsObj: any, isActivate: boolean, index: number): void {
         this.loading = true;
-        this.myhttp.changeActivateSlicingService(paramsObj, isActivate).subscribe(res => {
-            const { result_header: { result_code } } = res;
-            this.loading = false;
-            if (+result_code === 200) {
-                this.getCSMFBusinessList();
-            } else {
-                let singleSlicing = Object.assign({}, this.listOfData[index]);
-                this.listOfData[index] = singleSlicing;
-                this.listOfData = [...this.listOfData];
-                this.message.error(res.result_header.result_message)
-                this.getCSMFBusinessList();
-            }
-            this.getCSMFBusinessList();
-        }, () => {
+        let changeActivateFailedCallback = () => {
             this.loading = false;
             let 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();
         })
     }
 
@@ -152,18 +142,13 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
                 let paramsObj = { serviceId: slicing.order_id };
                 this.terminateStart[index] = true;
                 this.loading = true;
-                this.myhttp.terminateSlicingService(paramsObj).subscribe(res => {
-                    const { result_header: { result_code } } = res;
-                    this.loading = false;
-                    if (+result_code === 200) {
-                        this.getCSMFBusinessList();
-                    } else {
-                        this.terminateStart[index] = false;
-                        this.message.error(res.result_header.result_message)
-                    }
-                }, () => {
+                let terminateFailedCallback  = () => {
                     this.loading = false;
                     this.terminateStart[index] = false;
+                }
+                this.myhttp.terminateSlicingService(paramsObj, terminateFailedCallback).then(res => {
+                    this.loading = false;
+                    this.getCSMFBusinessList();
                 })
             },
             nzCancelText: 'No',
@@ -175,44 +160,33 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
     queryProgress(obj:any, index:number, callback:any) {
         return new Promise(res => {
             let requery = () => {
-                this.myhttp.getSlicingBusinessProgress(obj)
-                    .subscribe((data) => {
-                        const { result_header: { result_code, result_message }} = data;
-                        if (+result_code === 200) {
-                            if (data.result_body.operation_progress && Number(data.result_body.operation_progress) < 100) {
-                                callback(data.result_body);
-                                let progressSetTimeOut = setTimeout(() => {
-                                    requery();
-                                }, 5000);
-                                this.progressingTimer.push({
-                                    id: obj.serviceId,
-                                    timer: progressSetTimeOut
-                                })
-                            } else {
-                                this.progressingTimer.forEach((item) => {
-                                    if (item.serviceId === obj.serviceId) {
-                                        clearInterval(item.timer);
-                                    }
-                                });
-                                res(data.result_body);
-                            }
+                let queryProgressFailedCallback  = () => {
+                    this.progressingTimer.forEach((item) => {
+                        if (item.serviceId === obj.serviceId) {
+                            clearInterval(item.timer);
+                        }
+                    });
+                    this.getCSMFBusinessList();
+                }
+                this.myhttp.getSlicingBusinessProgress(obj, queryProgressFailedCallback)
+                    .then((data) => {
+                        if (data.result_body.operation_progress && Number(data.result_body.operation_progress) < 100) {
+                            callback(data.result_body);
+                            let progressSetTimeOut = setTimeout(() => {
+                                requery();
+                            }, 5000);
+                            this.progressingTimer.push({
+                                id: obj.serviceId,
+                                timer: progressSetTimeOut
+                            })
                         } else {
                             this.progressingTimer.forEach((item) => {
                                 if (item.serviceId === obj.serviceId) {
                                     clearInterval(item.timer);
                                 }
                             });
-                            this.getCSMFBusinessList();
-                            this.message.error(result_message);
+                            res(data.result_body);
                         }
-                    }, (err) => {
-                        this.progressingTimer.forEach((item) => {
-                            if (item.serviceId === obj.serviceId) {
-                                clearInterval(item.timer);
-                            }
-                        });
-                        this.getCSMFBusinessList();
-                        this.message.error(err);
                     })
             };
             requery();
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-model/nsi-model.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-model/nsi-model.component.ts
index 71b3aba9..5deb91b7 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-model/nsi-model.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-model/nsi-model.component.ts
@@ -24,23 +24,19 @@ export class NsiModelComponent implements OnInit {
       this.getNsiDetail()
   }
     getNsiDetail() {
-        this.myhttp.getSlicingNsiDetail(this.nsiId).subscribe(res => {
+        this.myhttp.getSlicingNsiDetail(this.nsiId).then(res => {
             this.isSpinning = false;
-            const {result_header: {result_code}, result_body: {hosted_business_list,included_nssi_list} } = res;
-            if (+result_code === 200) {
-                this.businessList = hosted_business_list.map((item)=>{
-                    if(item.service_instance_id !==null){
-                        return item
-                    }
-                });
-                this.nssiList = included_nssi_list.map((item)=>{
-                    if(item.service_instance_id !==null){
-                        return item
-                    }
-                });
-            }else{
-                this.message.error(res.result_header.result_message)
-            }
+            const { result_body: {hosted_business_list,included_nssi_list} } = res;
+            this.businessList = hosted_business_list.map((item)=>{
+                if(item.service_instance_id !==null){
+                    return item
+                }
+            });
+            this.nssiList = included_nssi_list.map((item)=>{
+                if(item.service_instance_id !==null){
+                    return item
+                }
+            });
         })
     }
     showBusinessDetail(data){
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.ts
index 08716e98..1567eca5 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.ts
@@ -48,21 +48,17 @@ export class NsiTableComponent implements OnInit {
             paramsObj["instanceStatus"] = this.selectedValue.toLocaleLowerCase();
             this.isSelect = true;
         }
-        this.myhttp.getSlicingNsiList(paramsObj, this.isSelect).subscribe(res => {
-            const {result_header: {result_code}, result_body: {nsi_service_instances, record_number}} = res;
+        let getSlicingNsiListFailedCallback  = () => {
             this.loading = false;
-            if (+result_code === 200) {
-                this.total = record_number;
-                this.loading = false;
-                if (nsi_service_instances !== null && nsi_service_instances.length > 0) {
-                    this.listOfData = nsi_service_instances;
-                }
-            }else {
-                this.message.error(res.result_header.result_message)
-            }
-        }, (res) => {
+        }
+        this.myhttp.getSlicingNsiList(paramsObj, this.isSelect, getSlicingNsiListFailedCallback).then(res => {
+            const { result_body: {nsi_service_instances, record_number} } = res;
+            this.loading = false;
+            this.total = record_number;
             this.loading = false;
-            this.message.error(res);
+            if (nsi_service_instances !== null && nsi_service_instances.length > 0) {
+                this.listOfData = nsi_service_instances;
+            } 
         })
     }
 
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-model/nssi-model.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-model/nssi-model.component.ts
index 96abbeca..035a2fd9 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-model/nssi-model.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-model/nssi-model.component.ts
@@ -22,18 +22,14 @@ export class NssiModelComponent implements OnInit {
       this.getNssiDetail()
   }
     getNssiDetail(){
-        this.myhttp.getSlicingNssiDetail(this.nssiId).subscribe(res => {
+        this.myhttp.getSlicingNssiDetail(this.nssiId).then(res => {
             this.isSpinning = false;
-            const {result_header: {result_code}, result_body: {hosted_nsi_list} } = res;
-            if (+result_code === 200) {
-                this.nsiList = hosted_nsi_list.map((item)=>{
-                    if(item.service_instance_id !==null){
-                        return item
-                    }
-                });
-            }else{
-                this.message.error(res.result_header.result_message)
-            }
+            const { result_body: {hosted_nsi_list} } = res;
+            this.nsiList = hosted_nsi_list.map((item)=>{
+                if(item.service_instance_id !==null){
+                    return item
+                }
+            });
         })
     }
     showSingleNsiDetail(data){
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.ts
index ba2b8971..5fe303b0 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.ts
@@ -48,21 +48,17 @@ export class NssiTableComponent implements OnInit {
             paramsObj["instanceStatus"] = this.selectedValue.toLocaleLowerCase();
             this.isSelect = true;
         }
-        this.myhttp.getSlicingNssiList(paramsObj, this.isSelect).subscribe(res => {
-            const {result_header: {result_code}, result_body: {nssi_service_instances, record_number}} = res;
+        let getSlicingNssiListFailedCallback  = () => {
             this.loading = false;
-            if (+result_code === 200) {
-                this.total = record_number;
-                this.loading = false;
-                if (nssi_service_instances !== null && nssi_service_instances.length > 0) {
-                    this.listOfData = nssi_service_instances;
-                }
-            }else{
-                this.message.error(res.result_header.result_message)
-            }
-        }, (res) => {
+        }
+        this.myhttp.getSlicingNssiList(paramsObj, this.isSelect, getSlicingNssiListFailedCallback).then(res => {
+            const { result_body: {nssi_service_instances, record_number} } = res;
             this.loading = false;
-            this.message.error(res)
+            this.total = record_number;
+            this.loading = false;
+            if (nssi_service_instances !== null && nssi_service_instances.length > 0) {
+                this.listOfData = nssi_service_instances;
+            }
         })
     }
 
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts
index b27e5a31..7bed4304 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-model/slicing-business-model.component.ts
@@ -29,27 +29,22 @@ export class SlicingBusinessModelComponent implements OnInit {
     }
 
     getDetail() {
-        this.myhttp.getSlicingBusinessDetail(this.businessId).subscribe(res => {
+        this.myhttp.getSlicingBusinessDetail(this.businessId).then(res => {
             this.isSpinning = false;
-            const { result_body, result_header: { result_code } } = res;
-            if (+result_code === 200) {
-                const { business_demand_info, business_demand_info: { coverage_area_ta_list }, nst_info, nsi_info } = result_body;
-                business_demand_info.area = coverage_area_ta_list.map(item => {
-                    item = item.split(';').join('-');
-                    return item
-                });
-                // area : Front-end analog data
-                let area = ["Haidian District;Beijing;Beijing", "Xicheng District;Beijing;Beijing", "Changping District;Beijing;Beijing"].map(item => {
-                    item = item.split(';').join(' - ');
-                    return item
-                });
-                this.businessRequirement = [{ ...business_demand_info, area }];
-                this.NSTinfo = [nst_info];
-                if (nsi_info.nsi_id !== null) {
-                    this.nsiInfo = [nsi_info];
-                }
-            }else{
-                this.message.error(res.result_header.result_message)
+            const { business_demand_info, business_demand_info: { coverage_area_ta_list }, nst_info, nsi_info } = res.result_body;
+            business_demand_info.area = coverage_area_ta_list.map(item => {
+                item = item.split(';').join('-');
+                return item
+            });
+            // area : Front-end analog data
+            let area = ["Haidian District;Beijing;Beijing", "Xicheng District;Beijing;Beijing", "Changping District;Beijing;Beijing"].map(item => {
+                item = item.split(';').join(' - ');
+                return item
+            });
+            this.businessRequirement = [{ ...business_demand_info, area }];
+            this.NSTinfo = [nst_info];
+            if (nsi_info.nsi_id !== null) {
+                this.nsiInfo = [nsi_info];
             }
         })
     }
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts
index 5410a0f4..cf9b221c 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts
@@ -56,11 +56,13 @@ export class SlicingBusinessTableComponent implements OnInit {
             paramsObj["businessStatus"] = this.selectedValue.toLocaleLowerCase();
             this.isSelect = true;
         }
-        this.myhttp.getSlicingBusinessList(paramsObj, this.isSelect).subscribe(res => {
-            const { result_header: { result_code }, result_body: { slicing_business_list, record_number } } = res;
+        let getSlicingBusinessListFailedCallback =  () => {
             this.loading = false;
-            if (+result_code === 200) {
-                this.total = record_number;
+        }
+        this.myhttp.getSlicingBusinessList(paramsObj, this.isSelect, getSlicingBusinessListFailedCallback).then(res => {
+            const { result_body: { slicing_business_list, record_number } } = res;
+            this.loading = false;
+            this.total = record_number;
                 if(slicing_business_list !==null && slicing_business_list.length >0){
                     this.listOfData = slicing_business_list.map((item, index) => {
                         if (item.last_operation_progress && item.last_operation_type && Number(item.last_operation_progress) < 100) {
@@ -80,7 +82,6 @@ export class SlicingBusinessTableComponent implements OnInit {
                         return item
                     });
                 }
-            }
         })
     }
     getListOfProcessingStatus() {
@@ -124,27 +125,18 @@ export class SlicingBusinessTableComponent implements OnInit {
     }
     changeActivate(paramsObj, isActivate, slicing, activateValue, finished, index) {
         this.loading = true;
-        this.myhttp.changeActivateSlicingService(paramsObj, isActivate).subscribe(res => {
-            const { result_header: { result_code, result_message }, result_body: { operation_id } } = res;
-            this.loading = false;
-            if (+result_code === 200) {
-                this.notification1.notificationSuccess('slicing business', finished, slicing.service_instance_id);
-                this.getBusinessList();
-            } else {
-                let singleSlicing = Object.assign({}, this.listOfData[index]);
-                this.listOfData[index] = singleSlicing;
-                this.listOfData = [...this.listOfData];
-                this.notification1.notificationFailed('slicing business', finished, slicing.service_instance_id);
-                this.getBusinessList();
-            }
-            this.getBusinessList();
-        }, () => {
+        let changeActivateFailedCallback = () => {
             this.loading = false;
             let singleSlicing = Object.assign({}, this.listOfData[index]);
             this.listOfData[index] = singleSlicing;
             this.listOfData = [...this.listOfData];
             this.notification1.notificationFailed('slicing business', finished, slicing.service_instance_id);
             this.getBusinessList();
+        }
+        this.myhttp.changeActivateSlicingService(paramsObj, isActivate, changeActivateFailedCallback).then(res => {
+            this.loading = false;
+            this.notification1.notificationSuccess('slicing business', finished, slicing.service_instance_id);
+            this.getBusinessList();
         })
     }
     terminate(slicing,index) {
@@ -156,20 +148,15 @@ export class SlicingBusinessTableComponent implements OnInit {
                 let paramsObj = { serviceId: slicing.service_instance_id };
                 this.terminateStart[index] = true;
                 this.loading = true;
-                this.myhttp.terminateSlicingService(paramsObj).subscribe(res => {
-                    const { result_header: { result_code, result_message }, result_body: { operation_id } } = res;
-                    this.loading = false;
-                    if (+result_code === 200) {
-                        this.notification1.notificationSuccess('slicing business', 'terminate', slicing.service_instance_id);
-                        this.getBusinessList();
-                    } else {
-                        this.notification1.notificationFailed('slicing business', 'terminate', slicing.service_instance_id);
-                        this.terminateStart[index] = false;
-                    }
-                }, () => {
+                let terminateFailedCallback  = () => {
                     this.loading = false;
                     this.notification1.notificationFailed('slicing business', 'terminate', slicing.service_instance_id);
                     this.terminateStart[index] = false;
+                }
+                this.myhttp.terminateSlicingService(paramsObj, terminateFailedCallback).then(res => {
+                    this.loading = false;
+                    this.notification1.notificationSuccess('slicing business', 'terminate', slicing.service_instance_id);
+                    this.getBusinessList();
                 })
             },
             nzCancelText: 'No',
@@ -193,44 +180,33 @@ export class SlicingBusinessTableComponent implements OnInit {
     queryProgress(obj, action, index, callback) {
         return new Promise(res => {
             let requery = () => {
-                this.myhttp.getSlicingBusinessProgress(obj)
-                    .subscribe((data) => {
-                        const { result_header: { result_code, result_message }, result_body: { operation_id } } = data;
-                        if (+result_code === 200) {
-                            if (data.result_body.operation_progress && Number(data.result_body.operation_progress) < 100) {
-                                callback(data.result_body);
-                                let progressSetTimeOut = setTimeout(() => {
-                                    requery();
-                                }, 5000);
-                                this.progressingTimer.push({
-                                    id: obj.serviceId,
-                                    timer: progressSetTimeOut
-                                })
-                            } else {
-                                this.progressingTimer.forEach((item) => {
-                                    if (item.serviceId === obj.serviceId) {
-                                        clearInterval(item.timer);
-                                    }
-                                });
-                                res(data.result_body);
-                            }
+                let queryProgressFailedCallback  = () => {
+                    this.progressingTimer.forEach((item) => {
+                        if (item.serviceId === obj.serviceId) {
+                            clearInterval(item.timer);
+                        }
+                    });
+                    this.getBusinessList();
+                }
+                this.myhttp.getSlicingBusinessProgress(obj, queryProgressFailedCallback)
+                    .then((data) => {
+                        if (data.result_body.operation_progress && Number(data.result_body.operation_progress) < 100) {
+                            callback(data.result_body);
+                            let progressSetTimeOut = setTimeout(() => {
+                                requery();
+                            }, 5000);
+                            this.progressingTimer.push({
+                                id: obj.serviceId,
+                                timer: progressSetTimeOut
+                            })
                         } else {
                             this.progressingTimer.forEach((item) => {
                                 if (item.serviceId === obj.serviceId) {
                                     clearInterval(item.timer);
                                 }
                             });
-                            this.getBusinessList();
-                            this.message.error(result_message);
+                            res(data.result_body);
                         }
-                    }, (err) => {
-                        this.progressingTimer.forEach((item) => {
-                            if (item.serviceId === obj.serviceId) {
-                                clearInterval(item.timer);
-                            }
-                        });
-                        this.getBusinessList();
-                        this.message.error(err);
                     })
             };
             requery();
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.ts
index 95106050..843cf512 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.ts
@@ -41,40 +41,35 @@ export class CheckProcessModelComponent implements OnInit {
 	}
 
 	getInfo(): void {
-		this.http.getSlicingBasicInfo(this.taskId).subscribe(res => {
-			const { result_body, result_header: { result_code } } = res;
-			if (+result_code === 200) {
-				const {
-					task_id,
-					task_name,
-					create_time,
-					processing_status,
-					business_demand_info,
-					nst_info,
-					business_demand_info: { service_snssai, coverage_area_ta_list }
-				} = result_body;
-				// 处理配置审核详情数据
-				this.checkDetail = [{ task_id, task_name, create_time, processing_status, service_snssai }];
-				// 业务需求信息数据
-				business_demand_info.area = coverage_area_ta_list.map(item => {
-					item = item.split(';').join(' - ')
-					return item
-				})
-				// 前端模拟数据
-				let area = ["Beijing;Beijing;Haidian District", "Beijing;Beijing;Xicheng District", "Beijing;Beijing;Changping District"].map(item => {
-					item = item.split(';').join(' - ')
-					return item
-				})
-				this.businessRequirement = [{ ...business_demand_info, area }];
-				// 匹配NST信息
-				this.NSTinfo = [nst_info];
-			} else {
-				const errorMessage = this.moduleOperation === 'Creating' ? 'Failed to get data' : 'Viewing results failed';
-				this.message.error(errorMessage);
-			}
+		let getSlicingBasicInfoFailedCallback =  () => {
 			this.isLoadingShow();
-		}, ({ status, statusText }) => {
-			this.message.error(status + ' (' + statusText + ')');
+		}
+		this.http.getSlicingBasicInfo(this.taskId, getSlicingBasicInfoFailedCallback).then(res => {
+			const { result_body } = res;
+			const {
+				task_id,
+				task_name,
+				create_time,
+				processing_status,
+				business_demand_info,
+				nst_info,
+				business_demand_info: { service_snssai, coverage_area_ta_list }
+			} = result_body;
+			// 处理配置审核详情数据
+			this.checkDetail = [{ task_id, task_name, create_time, processing_status, service_snssai }];
+			// 业务需求信息数据
+			business_demand_info.area = coverage_area_ta_list.map(item => {
+				item = item.split(';').join(' - ')
+				return item
+			})
+			// 前端模拟数据
+			let area = ["Beijing;Beijing;Haidian District", "Beijing;Beijing;Xicheng District", "Beijing;Beijing;Changping District"].map(item => {
+				item = item.split(';').join(' - ')
+				return item
+			})
+			this.businessRequirement = [{ ...business_demand_info, area }];
+			// 匹配NST信息
+			this.NSTinfo = [nst_info];
 			this.isLoadingShow();
 		})
 	}
@@ -88,15 +83,17 @@ export class CheckProcessModelComponent implements OnInit {
 	}
 
 	getProgress(): void {
-		this.http.getSlicingCreateProgress(this.taskId).subscribe(res => {
-			const { result_body, result_header: { result_code } } = res;
-			if (+result_code === 200) {
-				this.data = [];
+		let getSlicingCreateProgressFailedCallback =  () => {
+			this.isLoadingShow();
+		}
+		this.http.getSlicingCreateProgress(this.taskId, getSlicingCreateProgressFailedCallback).then(res => {
+			const { result_body } = res;
+			this.data = [];
 				const nssiList: string[] = ['an', 'tn', 'cn'];
-				nssiList.forEach( item => {
-					const progress: number = +result_body[item +'_progress']; 
+				nssiList.forEach(item => {
+					const progress: number = +result_body[item + '_progress'];
 					const title: string = item.charAt(0).toUpperCase() + item.slice(1);
-					let status: string = result_body[item +'_status'];
+					let status: string = result_body[item + '_status'];
 					if ((progress || progress === 0) && status) {
 						let currentProgress = 1
 						if (progress === 100 && status === 'finished') {
@@ -110,7 +107,7 @@ export class CheckProcessModelComponent implements OnInit {
 				this.data = [this.data];
 				let flag: boolean = false;
 				nssiList.forEach(item => {
-					if (result_body[item +'_status'] === 'processing' && result_body[item +'_progress'] !== 0) {
+					if (result_body[item + '_status'] === 'processing' && result_body[item + '_progress'] !== 0) {
 						flag = true;
 					}
 				})
@@ -119,12 +116,6 @@ export class CheckProcessModelComponent implements OnInit {
 						this.getProgress()
 					}, 5000)
 				}
-			} else {
-				this.message.error('Failed to get progress')
-			}
-			this.isLoadingShow();
-		}, ({ status, statusText }) => {
-			this.message.error(status + ' (' + statusText + ')');
 			this.isLoadingShow();
 		})
 	}
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.ts
index 34cd4451..b15421b6 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.ts
@@ -38,15 +38,11 @@ export class SlicingTaskManagementComponent implements OnInit {
   getTaskList(): void {
     const { pageNum, pageSize } = this;
     this.loading = true;
-    this.myhttp.getSlicingTaskList(pageNum, pageSize).subscribe(res => {
-      const { result_header: { result_code }, result_body } = res
-      if (+result_code === 200) {
-        const { slicing_task_list, record_number } = result_body;
-        this.dataFormatting(slicing_task_list);
-        this.total = record_number;
-      } else {
-        this.message.error('Failed to get form data');
-      }
+    this.myhttp.getSlicingTaskList(pageNum, pageSize).then(res => {
+      const { result_body } = res;
+      const { slicing_task_list, record_number } = result_body;
+      this.dataFormatting(slicing_task_list);
+      this.total = record_number;
       this.loading = false;
     }, ({ status, statusText }) => {
       this.message.error(status + ' (' + statusText + ')');
@@ -67,15 +63,11 @@ export class SlicingTaskManagementComponent implements OnInit {
   getListOfProcessingStatus(): void {
     const { selectedValue, pageNum, pageSize } = this;
     this.loading = true;
-    this.myhttp.getTaskProcessingStatus(selectedValue, pageNum + '', pageSize + '').subscribe(res => {
-      const { result_header: { result_code }, result_body } = res
-      if (+result_code === 200) {
-        const { slicing_task_list, record_number } = result_body;
+    this.myhttp.getTaskProcessingStatus(selectedValue, pageNum + '', pageSize + '').then(res => {
+      const { result_body } = res
+      const { slicing_task_list, record_number } = result_body;
         this.dataFormatting(slicing_task_list)
         this.total = record_number;
-      } else {
-        this.message.error('Failed to get form data');
-      }
       this.loading = false;
     }, ({ status, statusText }) => {
       this.message.error(status + ' (' + statusText + ')');
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts
index ae5102ae..f7828594 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts
@@ -102,104 +102,99 @@ export class SlicingTaskModelComponent implements OnInit {
   }
 
   getautidInfo(): void {
-    this.http.getAuditInfo(this.taskId).subscribe( res => {
-      const { result_header: { result_code, result_message } } = res;
+    this.http.getAuditInfo(this.taskId).then( res => {
       this.isSpinning = false;
-      if (+result_code === 200) {
-        const {
-          business_demand_info,
-          nst_info,
-          nsi_nssi_info,
-          ...checkInfo
-        } = res.result_body;
-        // 处理配置审核详情数据
-        this.checkDetail = [{...checkInfo, 'service_snssai': business_demand_info.service_snssai}];
-        // 业务需求信息数据
-        business_demand_info.area = business_demand_info.coverage_area_ta_list.map(item => {
-          item = item.split(';').join(' - ')
-          return item
-        })
-        // 前端模拟数据
-        let areaList = ["Haidian District;Beijing;Beijing", "Xicheng District;Beijing;Beijing", "Changping District;Beijing;Beijing"].map(item => {
-          item = item.split(';').join(' - ')
-          return item
-        })
-        this.businessRequirement = [{ ...business_demand_info, area: areaList }];
-        // 匹配NST信息
-        this.NSTinfo = [nst_info];
-        // 共享切片实例
-        this.selectedServiceId = nsi_nssi_info.suggest_nsi_id;
-        this.selectedServiceName = nsi_nssi_info.suggest_nsi_name;
-        // an/tn/cn 3 select box switches parameters of Matching Shared NSSI
-        this.enableNSSISelectionList = [nsi_nssi_info.an_enableNSSISelection,nsi_nssi_info.tn_enableNSSISelection,nsi_nssi_info.cn_enableNSSISelection];
-        if (!this.selectedServiceId || !this.selectedServiceName) {
-          this.isDisabled.map((item,index)=>{
-            this.isDisabled[index] = false
-          })
-        }
+      const {
+        business_demand_info,
+        nst_info,
+        nsi_nssi_info,
+        ...checkInfo
+      } = res.result_body;
+      // 处理配置审核详情数据
+      this.checkDetail = [{...checkInfo, 'service_snssai': business_demand_info.service_snssai}];
+      // 业务需求信息数据
+      business_demand_info.area = business_demand_info.coverage_area_ta_list.map(item => {
+        item = item.split(';').join(' - ')
+        return item
+      })
+      // 前端模拟数据
+      let areaList = ["Haidian District;Beijing;Beijing", "Xicheng District;Beijing;Beijing", "Changping District;Beijing;Beijing"].map(item => {
+        item = item.split(';').join(' - ')
+        return item
+      })
+      this.businessRequirement = [{ ...business_demand_info, area: areaList }];
+      // 匹配NST信息
+      this.NSTinfo = [nst_info];
+      // 共享切片实例
+      this.selectedServiceId = nsi_nssi_info.suggest_nsi_id;
+      this.selectedServiceName = nsi_nssi_info.suggest_nsi_name;
+      // an/tn/cn 3 select box switches parameters of Matching Shared NSSI
+      this.enableNSSISelectionList = [nsi_nssi_info.an_enableNSSISelection,nsi_nssi_info.tn_enableNSSISelection,nsi_nssi_info.cn_enableNSSISelection];
+      if (!this.selectedServiceId || !this.selectedServiceName) {
         this.isDisabled.map((item,index)=>{
-          if(this.enableNSSISelectionList[index]){
-            this.isDisabled[index] = false
-          }
+          this.isDisabled[index] = false
         })
-        this.slicingInstances = {
-          currentPage: '1',
-          pageSize: '10',
-          isLoading: false,
-          total: 0,
-          flag: false,
-          list: [{
-            service_instance_id: this.selectedServiceId,
-            service_instance_name: this.selectedServiceName
-          }]
+      }
+      this.isDisabled.map((item,index)=>{
+        if(this.enableNSSISelectionList[index]){
+          this.isDisabled[index] = false
         }
-        // 子网实例
-        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']);
-        this.subnetDataFormatting(subnetData, 0);
-        // 前端模拟数据
-        let area = ["Beijing;Beijing;Haidian District", "Beijing;Beijing;Xicheng District", "Beijing;Beijing;Changping District"];
-        this.slicingSubnet[0].params = {...this.pick(nsi_nssi_info, [
-                'sliceProfile_AN_sNSSAI',
-                'sliceProfile_AN_resourceSharingLevel',
-                'sliceProfile_AN_uEMobilityLevel',
-                'an_latency',
-                'sliceProfile_AN_maxNumberofUEs',
-                'sliceProfile_AN_activityFactor',
-                'sliceProfile_AN_expDataRateDL',
-                'sliceProfile_AN_expDataRateUL',
-                'sliceProfile_AN_areaTrafficCapDL',
-                'sliceProfile_AN_areaTrafficCapUL',
-                'an_script_name',
-                'sliceProfile_AN_overallUserDensity',
-                'an_enableNSSISelection',
-                'sliceProfile_AN_maxNumberofPDUSession',
-                'sliceProfile_AN_ipAddress',
-                'sliceProfile_AN_logicInterfaceId',
-                'sliceProfile_AN_nextHopInfo'
-            ]), an_coverage_area_ta_list: area};
-        this.slicingSubnet[1].params = this.pick(nsi_nssi_info, ['tn_latency', 'tn_bandwidth', 'tn_script_name', 'sliceProfile_TN_jitte', 'sliceProfile_TN_sNSSAI',"tn_enableNSSISelection"]);
-        this.slicingSubnet[2].params = {...this.pick(nsi_nssi_info, [
-          'cn_service_snssai',
-          'cn_resource_sharing_level',
-          'cn_ue_mobility_level',
-          'cn_latency',
-          'cn_max_number_of_ues',
-          'cn_activity_factor',
-          'cn_exp_data_rate_dl',
-          'cn_exp_data_rate_ul',
-          'cn_area_traffic_cap_dl',
-          'cn_area_traffic_cap_ul',
-          'cn_script_name',
-          'sliceProfile_CN_overallUserDensity',
-          'cn_enableNSSISelection',
-          'sliceProfile_CN_maxNumberofPDUSession',
-          'sliceProfile_CN_logicInterfaceId',
-          'sliceProfile_CN_ipAddress',
-          'sliceProfile_CN_nextHopInfo'
-        ])};
-      } else {
-        this.message.error(result_message || 'Failed to get data')
+      })
+      this.slicingInstances = {
+        currentPage: '1',
+        pageSize: '10',
+        isLoading: false,
+        total: 0,
+        flag: false,
+        list: [{
+          service_instance_id: this.selectedServiceId,
+          service_instance_name: this.selectedServiceName
+        }]
       }
+      // 子网实例
+      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']);
+      this.subnetDataFormatting(subnetData, 0);
+      // 前端模拟数据
+      let area = ["Beijing;Beijing;Haidian District", "Beijing;Beijing;Xicheng District", "Beijing;Beijing;Changping District"];
+      this.slicingSubnet[0].params = {...this.pick(nsi_nssi_info, [
+              'sliceProfile_AN_sNSSAI',
+              'sliceProfile_AN_resourceSharingLevel',
+              'sliceProfile_AN_uEMobilityLevel',
+              'an_latency',
+              'sliceProfile_AN_maxNumberofUEs',
+              'sliceProfile_AN_activityFactor',
+              'sliceProfile_AN_expDataRateDL',
+              'sliceProfile_AN_expDataRateUL',
+              'sliceProfile_AN_areaTrafficCapDL',
+              'sliceProfile_AN_areaTrafficCapUL',
+              'an_script_name',
+              'sliceProfile_AN_overallUserDensity',
+              'an_enableNSSISelection',
+              'sliceProfile_AN_maxNumberofPDUSession',
+              'sliceProfile_AN_ipAddress',
+              'sliceProfile_AN_logicInterfaceId',
+              'sliceProfile_AN_nextHopInfo'
+          ]), an_coverage_area_ta_list: area};
+      this.slicingSubnet[1].params = this.pick(nsi_nssi_info, ['tn_latency', 'tn_bandwidth', 'tn_script_name', 'sliceProfile_TN_jitte', 'sliceProfile_TN_sNSSAI',"tn_enableNSSISelection"]);
+      this.slicingSubnet[2].params = {...this.pick(nsi_nssi_info, [
+        'cn_service_snssai',
+        'cn_resource_sharing_level',
+        'cn_ue_mobility_level',
+        'cn_latency',
+        'cn_max_number_of_ues',
+        'cn_activity_factor',
+        'cn_exp_data_rate_dl',
+        'cn_exp_data_rate_ul',
+        'cn_area_traffic_cap_dl',
+        'cn_area_traffic_cap_ul',
+        'cn_script_name',
+        'sliceProfile_CN_overallUserDensity',
+        'cn_enableNSSISelection',
+        'sliceProfile_CN_maxNumberofPDUSession',
+        'sliceProfile_CN_logicInterfaceId',
+        'sliceProfile_CN_ipAddress',
+        'sliceProfile_CN_nextHopInfo'
+      ])};
     }, ({ status, statusText }) => {
       this.message.error(status + ' (' + statusText + ')');
       this.isSpinning = false;
@@ -226,16 +221,12 @@ export class SlicingTaskModelComponent implements OnInit {
 
   getSlicingInstances(pageNo: string, pageSize: string): void {
     this.slicingInstances.isLoading = true;
-    this.http.getSlicingInstance(pageNo, pageSize).subscribe(res => {
-      const { result_header: { result_code, result_message }, result_body } = res;
+    this.http.getSlicingInstance(pageNo, pageSize).then(res => {
+      const { result_body } = res;
       setTimeout(() => {
-        if (+result_code === 200) {
-          const { nsi_service_instances, record_number } = result_body;
-          this.slicingInstances.total = record_number;
-          this.slicingInstances.list.push(...nsi_service_instances);
-        } else {
-          this.message.error(result_message || 'Failed to get slicing instance ID')
-        }
+        const { nsi_service_instances, record_number } = result_body;
+        this.slicingInstances.total = record_number;
+        this.slicingInstances.list.push(...nsi_service_instances);
         this.slicingInstances.isLoading = false;
         this.slicingInstances.flag = false;
       }, 2000)
@@ -255,16 +246,13 @@ export class SlicingTaskModelComponent implements OnInit {
     })
     this.selectedServiceName = '';
     // 获取切片子网实例数据
-    this.http.getSlicingSubnetInstance(this.selectedServiceId).subscribe(res => {
-      const { result_header: { result_code, result_message }, result_body, record_number} = res;
-      if (+result_code === 200) {
-        this.subnetDataFormatting(result_body, record_number)
-      } else {
-        this.subnetDataFormatting({}, 1);
-        this.message.error(result_message || 'Failed to get slicing subnet instance ID')
-      }
-    }, ({ status, statusText }) => {
-      this.message.error(status + ' (' + statusText + ')');
+
+    let getSlicingSubnetInstanceFailedCallback = () => {
+      this.subnetDataFormatting({}, 1);
+    };
+    this.http.getSlicingSubnetInstance(this.selectedServiceId, getSlicingSubnetInstanceFailedCallback).then(res => {
+      const { result_body, record_number} = res;
+      this.subnetDataFormatting(result_body, record_number)
     })
     this.slicingInstances.list.forEach(item => {
       if (item.service_instance_id === this.selectedServiceId) {
@@ -336,23 +324,19 @@ export class SlicingTaskModelComponent implements OnInit {
   getSubnetInstances(instance: any): void {
     instance.isLoading = true;
     const { context, currentPage, pageSize } = instance;
-    this.http.getSubnetInContext(context, currentPage, pageSize).subscribe(res => {
-      const { result_header: { result_code, result_message }, result_body } = res;
-      if (+result_code === 200) {
-        const { nssi_service_instances, record_number } = result_body;
-        this.slicingSubnet.map(item => {
-          if (item.context === context) {
-            item.total = record_number;
-            item.instances.push(...nssi_service_instances);
-          }
-        })
-      } else {
-        this.message.error(result_message || 'Failed to get slicing subnet instance ID');
-      }
+    let getSubnetInContextFailedCallback = () => {
       instance.isLoading = false;
       instance.flag = false;
-    }, ({ status, statusText }) => {
-      this.message.error(status + ' (' + statusText + ')');
+    };
+    this.http.getSubnetInContext(context, currentPage, pageSize,getSubnetInContextFailedCallback).then(res => {
+      const { result_body } = res;
+      const { nssi_service_instances, record_number } = result_body;
+      this.slicingSubnet.map(item => {
+        if (item.context === context) {
+          item.total = record_number;
+          item.instances.push(...nssi_service_instances);
+        }
+      })
       instance.isLoading = false;
       instance.flag = false;
     })
@@ -406,13 +390,11 @@ export class SlicingTaskModelComponent implements OnInit {
     delete businessRequirement[0].area
     let reqBody = { ...checkDetail[0], business_demand_info: businessRequirement[0], nst_info: NSTinfo[0], nsi_nssi_info };
     delete reqBody.service_snssai;
-    this.http.submitSlicing(reqBody).subscribe(res => {
-      const { result_header: { result_code } } = res;
-      if (+result_code === 200) {
-        this.notification1.notificationSuccess('Task', 'Sumbit', this.taskId)
-      } else {
-        this.notification1.notificationFailed('Task', 'Sumbit', this.taskId)
-      }
+    let submitSlicingFailedCallback =  () => {
+      this.notification1.notificationFailed('Task', 'Sumbit', this.taskId)
+    }
+    this.http.submitSlicing(reqBody,submitSlicingFailedCallback).then(res => {
+      this.notification1.notificationSuccess('Task', 'Sumbit', this.taskId)
       this.loading = false;
       this.handleCancel(true);
     }, ({ status, statusText }) => {