feat: Add view progress component

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

10 files changed, 154 insertions, 4 deletions

diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts
index d041eeeb..c2abac6d 100644
--- a/usecaseui-portal/src/app/app.module.ts
+++ b/usecaseui-portal/src/app/app.module.ts
@@ -93,7 +93,7 @@ import { NssiManagementComponent } from './views/services/slicing-management/sli
 import { SubnetParamsModelComponent } from './views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component';
 import { SlicingBusinessTableComponent } from './views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component'
 import { BasicInfoComponent } from './shared/components/basic-info/basic-info.component';
-
+import { CheckProcessModelComponent } from './views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component'
 
 @NgModule({
   providers: [
@@ -151,7 +151,8 @@ import { BasicInfoComponent } from './shared/components/basic-info/basic-info.co
     NssiManagementComponent,
     SubnetParamsModelComponent,
     SlicingBusinessTableComponent,
-    BasicInfoComponent
+    BasicInfoComponent,
+    CheckProcessModelComponent
   ],
   imports: [
     BrowserModule,
diff --git a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
index 44d87cc5..b8e2690f 100644
--- a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
+++ b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
@@ -36,6 +36,7 @@ export class SlicingTaskServices {
         deactivateSlicingService:this.baseUrl+"/resource/{serviceId}/deactivate",

         terminateSlicingService:this.baseUrl+"/resource/{serviceId}",

         queryOperationProgress:this.baseUrl+"resource/{serviceId}/progress",

+        slicingBasicInfo: this.baseUrl + '/task/{taskId}/taskCreationInfo',

     }

 

 

@@ -80,6 +81,10 @@ export class SlicingTaskServices {
     submitSlicing (reqbody) {

         return this.http.put<any>(this.url.submitSlicing, reqbody)

     }

+    getSlicingBasicInfo (taskId: string) {

+        const url = this.url.slicingBasicInfo.replace('{taskId}', taskId);

+        return this.http.get<any>(url);

+    }

 

     // Get slicing business list

     getSlicingBusinessList (paramsObj,isSelect: boolean) {

diff --git a/usecaseui-portal/src/app/mock/json/slicing_taskCreationInfo.json b/usecaseui-portal/src/app/mock/json/slicing_taskCreationInfo.json
new file mode 100644
index 00000000..73185956
--- /dev/null
+++ b/usecaseui-portal/src/app/mock/json/slicing_taskCreationInfo.json
@@ -0,0 +1,31 @@
+{

+    "result_header": {

+        "result_code": "200",

+        "result_message": "5G slicing task creation info result."

+    },

+    "result_body": {

+        "task_id": "b1bb0ce7-ebca-4fa7-95ed-4840d70a1177",

+        "task_name": "5G Slicee MMB",

+        "create_time": "1454171445000",

+        "processing_status": "Waiting for review",

+        "business_demand_info": {

+            "service_name": "5G Slice eMMB",

+            "service_snssai": "1-010101",

+            "exp_data_rate_dl": "300",

+            "exp_data_rate_ul": "300",

+            "ue_mobility_level": "stageary",

+            "latency": "20",

+            "use_interval": "12",

+            "coverage_area_ta_list": [" xxxx;xxxxx;xxxxx ", " xxxx;xxxxx;xxxxx ", " xxxx;xxxxx;xxxxx "],

+            "activity_factor": "60",

+            "resource_sharing_level": "shared",

+            "area_traffic_cap_ul": "300",

+            "area_traffic_cap_dl": "300",

+            "max_number_of_ues": "10000"

+        },

+        "nst_info": {

+            "nst_id": "46da8cf8-0878-48ac-bea3-f2200959411a",

+            "nst_name": "eMBBNST"

+        }

+    }

+}

diff --git a/usecaseui-portal/src/app/mock/routes.js b/usecaseui-portal/src/app/mock/routes.js
index 5bc81fbd..35a9e139 100644
--- a/usecaseui-portal/src/app/mock/routes.js
+++ b/usecaseui-portal/src/app/mock/routes.js
@@ -98,6 +98,8 @@ module.exports =
         "/uui-slicing/nsmf/resource/nsi/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_instance",
         "/uui-slicing/nsmf/resource/nsi/:nsiId/nssiInstances": "/slicing_subnet_instance",
         "/uui-slicing/nsmf/resource/nssi/:environmentContext/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_subnet_context",
+        "/uui-slicing/nsmf/task/:taskId/taskCreationInfo": "/slicing_taskCreationInfo",
+
         ///////<-------------slicing_business--------->/////
         "/uui-slicing/nsmf/resource/business/pageNo/:pageNo/pageSize/:pageSize": "/slicing_business_list",
         "/uui-slicing/nsmf/resource/:businessStatus/business/pageNo/:pageNo/pageSize/:pageSize": "/slicing_business_list_activated",
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.html
new file mode 100644
index 00000000..e6e348c2
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.html
@@ -0,0 +1,15 @@
+<nz-modal
+	[nzVisible]="showProcess"
+	nzWidth="85%"
+	[nzTitle]="moduleTitle"
+	(nzOnCancel)="handleCancel()"
+	(nzOnOk)="handleOk()"
+>
+	<app-basic-info
+		[checkDetail]="checkDetail"
+		[businessRequirement]="businessRequirement"
+		[NSTinfo]="NSTinfo"
+	>
+	</app-basic-info>
+	
+</nz-modal>
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.less
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.less
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.spec.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.spec.ts
new file mode 100644
index 00000000..4235605a
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CheckProcessModelComponent } from './check-process-model.component';
+
+describe('CheckProcessModelComponent', () => {
+	let component: CheckProcessModelComponent;
+	let fixture: ComponentFixture<CheckProcessModelComponent>;
+
+	beforeEach(async(() => {
+		TestBed.configureTestingModule({
+			declarations: [CheckProcessModelComponent]
+		})
+			.compileComponents();
+	}));
+
+	beforeEach(() => {
+		fixture = TestBed.createComponent(CheckProcessModelComponent);
+		component = fixture.componentInstance;
+		fixture.detectChanges();
+	});
+
+	it('should create', () => {
+		expect(component).toBeTruthy();
+	});
+});
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
new file mode 100644
index 00000000..efb8ba72
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component.ts
@@ -0,0 +1,60 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { SlicingTaskServices } from '../../../../../core/services/slicingTaskServices'
+
+@Component({
+	selector: 'app-check-process-model',
+	templateUrl: './check-process-model.component.html',
+	styleUrls: ['./check-process-model.component.less']
+})
+export class CheckProcessModelComponent implements OnInit {
+
+	@Input() moduleTitle: string;
+	@Input() showProcess: boolean;
+	@Input() taskId: string;
+
+	@Output() cancel = new EventEmitter<boolean>();
+
+	constructor(private http: SlicingTaskServices) { }
+
+	checkDetail: any[];
+	businessRequirement: any[];
+	NSTinfo: any[];
+
+	ngOnInit() { }
+
+	ngOnChanges() {
+		if (this.showProcess) {
+			this.getInfo();
+		}
+	}
+
+	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 }
+				} = result_body;
+				// 处理配置审核详情数据
+				this.checkDetail = [{ task_id, task_name, create_time, processing_status, service_snssai }];
+				// 业务需求信息数据
+				this.businessRequirement = [business_demand_info];
+				// 匹配NST信息
+				this.NSTinfo = [nst_info];
+			}
+		})
+	}
+
+	handleCancel() {
+		this.showProcess = false;
+		this.cancel.emit(this.showProcess)
+	}
+	handleOk() { }
+
+}
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html
index 57e13653..135cf3ff 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html
@@ -39,4 +39,11 @@
   <app-slicing-task-model [moduleTitle]="moduleTitle" [showDetail]="showDetail" [taskId]="taskId"
     (cancel)="showDetail=$event">
   </app-slicing-task-model>
+  <app-check-process-model 
+    [moduleTitle]="moduleTitle"
+    [showProcess]="showProcess" 
+    [taskId]="taskId" 
+    (cancel)="showProcess=$event"
+  >
+  </app-check-process-model>
 </div>
\ No newline at end of file
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 5c6eb369..76e67070 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
@@ -16,8 +16,8 @@ export class SlicingTaskManagementComponent implements OnInit {
     this.getTaskList()
   }
   showDetail: boolean = false;
+  showProcess: boolean = false;
   selectedValue = null;
-  // detailData: object = {};
   taskId: string;
   moduleTitle: string = "";
   listOfData: any[] = []; 
@@ -67,7 +67,11 @@ export class SlicingTaskManagementComponent implements OnInit {
 
   showdetail(data: any): void {
     this.taskId = data.task_id;
-    this.showDetail = true;
     this.moduleTitle = data.status;
+    if(data.status === '审核阶段') {
+      this.showDetail = true;
+    } else {
+      this.showProcess = true;
+    }
   }
 }