Title: Displaying the intent report status

Desc: the protal supports intention management to display the intention
reeporting status
Issue-ID: USECASEUI-798

Signed-off-by: zhenzhenbai <850084376@qq.com>
Change-Id: I2e0034eeb640be7f372bfe703fc3444794ac497a

9 files changed, 159 insertions, 7 deletions

diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts
index 65e8ec06..2b9506b3 100644
--- a/usecaseui-portal/src/app/app.module.ts
+++ b/usecaseui-portal/src/app/app.module.ts
@@ -114,6 +114,7 @@ import { InputIntentManagementComponent } from './views/intent-management/input-
 import { InputIntentExpectationComponent } from './views/intent-management/input-intent-expectation/input-intent-expectation.component';
 import { InputIntentStateComponent } from './views/intent-management/input-intent-state/input-intent-state.component';
 import { InputIntentConditionComponent } from './views/intent-management/input-intent-condition/input-intent-condition.component';
+import { IntentReportDetailComponent } from './views/intent-management/intent-report-detail/intent-report-detail.component';
 
 export function HttpLoaderFactory(httpClient: HttpClient) {
 	return new TranslateHttpLoader(httpClient, "./assets/i18n/", ".json");
@@ -218,6 +219,7 @@ registerLocaleData(en);
 		InputIntentExpectationComponent,
 		InputIntentStateComponent,
 		InputIntentConditionComponent,
+		IntentReportDetailComponent,
 	],
 	imports: [
 		BrowserModule,
diff --git a/usecaseui-portal/src/app/core/services/intentManagement.service.ts b/usecaseui-portal/src/app/core/services/intentManagement.service.ts
index de0216db..ee9cd3b2 100644
--- a/usecaseui-portal/src/app/core/services/intentManagement.service.ts
+++ b/usecaseui-portal/src/app/core/services/intentManagement.service.ts
@@ -25,7 +25,8 @@ export class IntentManagementService {
     createIntentManagement:  "/api/usecaseui-intent-analysis/v1/intents",
     getIntentManagement: "/api/usecaseui-intent-analysis/v1/intents/intentGenerateType/USERINPUT",
     deleteIntentManagement: "/api/usecaseui-intent-analysis/v1/intents/",
-    updateIntentManagementData: "/api/usecaseui-intent-analysis/v1/intents/"
+    updateIntentManagementData: "/api/usecaseui-intent-analysis/v1/intents/",
+    getIntentReport: "/api/usecaseui-intent-analysis/v1/intentReport/"
   };
 
   // intentManagement
@@ -38,7 +39,10 @@ export class IntentManagementService {
   deleteIntentManagementData(intentId) {
     return this.http.delete<any>(this.url.deleteIntentManagement + intentId);
   }
-  updateIntentManagementData(id, requestBody) {//更新接口未完成
+  updateIntentManagementData(id, requestBody) {
     return this.http.put<any>(this.url.updateIntentManagementData + id, requestBody);
   }
+  getIntentReportData(intentId){
+    return this.http.get<any>(this.url.getIntentReport+intentId);
+  }
 }
diff --git a/usecaseui-portal/src/app/views/intent-management/intent-management.component.html b/usecaseui-portal/src/app/views/intent-management/intent-management.component.html
index 7e3a5712..e7eb0ad4 100644
--- a/usecaseui-portal/src/app/views/intent-management/intent-management.component.html
+++ b/usecaseui-portal/src/app/views/intent-management/intent-management.component.html
@@ -26,10 +26,11 @@
   >
     <thead>
       <tr>
-        <th nzWidth="12%">No</th>
+        <th nzWidth="10%">No</th>
         <th nzWidth="30%">Intent ID</th>
         <th nzWidth="30%">Intent Name</th>
-        <th nzWidth="18%">{{"i18nTextDefine_Action" | translate}}</th>
+        <th nzWidth="15%">Status</th>
+        <th nzWidth="15%">{{"i18nTextDefine_Action" | translate}}</th>
       </tr>
     </thead>
     <tbody>
@@ -38,7 +39,9 @@
           <td>{{i+1}}</td>
           <td>{{ data.intentId }}</td>
           <td>{{ data.intentName }}</td>
+          <td>{{ data.intentStatus }}</td>
           <td>
+            <em class="anticon anticon-menu-fold" (click)="viewReport(data,i)"></em>
             <em class="anticon anticon-edit" (click)="editIntentList(data,i)"></em>
             <em class="anticon anticon-delete" (click)="deleteIntentList(data)"></em>
           </td>
@@ -47,4 +50,5 @@
     </tbody>
   </nz-table>
 </div>
-<app-input-intent-management [showModel]="intentModuleShow" (modalOpreation)="inputIntentModuleClose($event)" [editIntentTableData]="editIntentTableList"></app-input-intent-management>
\ No newline at end of file
+<app-input-intent-management [showModel]="intentModuleShow" (modalOpreation)="inputIntentModuleClose($event)" [editIntentTableData]="editIntentTableList"></app-input-intent-management>
+<app-intent-report-detail [showModel]="intentReportDetailShow" (modalOpreation)="intentReportModuleClose($event)" [reportData]="reportData" [intentInfo]="intentInfo" ></app-intent-report-detail>
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/intent-management/intent-management.component.less b/usecaseui-portal/src/app/views/intent-management/intent-management.component.less
index 04580fef..43f61660 100644
--- a/usecaseui-portal/src/app/views/intent-management/intent-management.component.less
+++ b/usecaseui-portal/src/app/views/intent-management/intent-management.component.less
@@ -14,7 +14,7 @@
       margin-top: 7px;
     }
   }
-  .anticon-edit,.anticon-delete{
+  .anticon-edit,.anticon-delete,.anticon-menu-fold{
     font-size: 18px;
     margin-right: 10px;
     cursor: pointer;
@@ -53,7 +53,7 @@
     top: 32px;
     left: 110px;
   }
-  .anticon-edit,.anticon-delete{
+  .anticon-edit,.anticon-delete,.anticon-menu-fold{
     font-size: 18px;
     margin-right: 10px;
     cursor: pointer;
@@ -61,6 +61,10 @@
 }
 .intent-table{
   margin-bottom: 15px;
+  ::ng-deep ant-modal-body{
+    height: 300 !important;
+    overflow-y: auto !important;
+  }
 }
 .target-div{
   float: left;
diff --git a/usecaseui-portal/src/app/views/intent-management/intent-management.component.ts b/usecaseui-portal/src/app/views/intent-management/intent-management.component.ts
index 758aad06..e7dbc7fd 100644
--- a/usecaseui-portal/src/app/views/intent-management/intent-management.component.ts
+++ b/usecaseui-portal/src/app/views/intent-management/intent-management.component.ts
@@ -17,9 +17,20 @@ export class IntentManagementComponent implements OnInit {
   ngOnInit() {
     this.getIntentManagementData()
   }
+  ngOnDestroy(){
+    window.clearInterval(this.timer)
+  }
 
   listOfData: any[] = [];
+  reportData: any[] = [];
+  intentInfo: Object={
+    intentId:'',
+    intentName:'',
+    reportTime: ''
+  };
+  timer: any;
   intentModuleShow: boolean = false;
+  intentReportDetailShow: boolean = false;
   editIntentTableList: Object={};
   currentIndex: number=-1;
 
@@ -28,12 +39,28 @@ export class IntentManagementComponent implements OnInit {
     .subscribe(
       (data) => {
         this.listOfData=data.result_body
+        this.getIntentReportData(this.listOfData)
+        this.timer=setInterval(function(){
+        this.getIntentReportData(this.listOfData)
+        },5000)
       },
       (err) => {
         this.message.error('Failed to obtain intent data');
       }
     )
   }
+  getIntentReportData(data): void{
+    data.forEach(item => {
+      this.myhttp.getIntentReportData(item.intentId).subscribe(
+        (data) => {
+          item.intentStatus=data.result_body.fulfillmentInfos[0].fulfillmentStatus
+        },
+        (err) => {
+          this.message.error('Failed to obtain Report data');
+        }
+      )
+    });
+  }
   inputIntentModuleShow(): void {
     this.intentModuleShow = true;
   }
@@ -45,6 +72,32 @@ export class IntentManagementComponent implements OnInit {
     }
     this.getIntentManagementData()
   }
+  intentReportModuleClose($event: any): void {
+    this.intentReportDetailShow = false 
+    if ($event.cancel) {
+      return;
+    }
+  }
+  viewReport(data,i): void{
+    this.reportData=[]
+    this.intentInfo={
+      intentId:'',
+      intentName:'',
+      reportTime: ''
+    };
+    this.intentInfo['intentId']=data['intentId']
+    this.intentInfo['intentName']=data['intentName']
+    this.myhttp.getIntentReportData(data.intentId).subscribe(
+        (data) => {
+          this.reportData=data.result_body.fulfillmentInfos
+          this.intentInfo['reportTime']=data.result_body.reportTime
+          this.intentReportDetailShow = true 
+        },
+        (err) => {
+          this.message.error('Failed to obtain Report data');
+        }
+      )
+  }
   editIntentList(data,i): void {
     this.editIntentTableList=JSON.parse(JSON.stringify(data))
     this.currentIndex=i
diff --git a/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.html b/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.html
new file mode 100644
index 00000000..0f263c76
--- /dev/null
+++ b/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.html
@@ -0,0 +1,35 @@
+<nz-modal [(nzVisible)]="showModel" nzTitle="Intent Report" (nzOnCancel)="handleCancel()"
+ nzWidth="56%" nzHeight="600px" [nzFooter]="null" class="intent-management-modal">
+<div class="subnet_params_container clearfix">
+  <p>
+    <span class="title" style="margin-right: 30px;">Intent Name: {{intentInfo['intentName']}}</span>
+    <span class="title">ID: {{intentInfo['intentId']}}</span>
+  </p>
+  <div class="intent-table">
+    <p>ReportTime: {{intentInfo['reportTime']}}</p>
+    <nz-table
+      #basicTable [nzData]="reportData"
+      [nzFrontPagination]="false"
+      [nzShowPagination]="false"
+      >
+      <thead>
+        <tr>
+          <th nzWidth="10%">No</th>
+          <th nzWidth="40%">Status </th>
+          <th nzWidth="50%">Reason</th>
+        </tr>
+      </thead>
+      <tbody>
+        <ng-template ngFor let-data [ngForOf]="basicTable.data" let-i="index">
+          <tr>
+            <td>{{i+1}}</td>
+            <td>{{ data.fulfillmentStatus }}</td>
+            <td>{{ data.notFulfilledReason }}</td>
+          </tr>
+        </ng-template>
+      </tbody>
+    </nz-table>
+  </div>
+</div>
+
+</nz-modal>
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.less b/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.less
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.less
diff --git a/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.spec.ts b/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.spec.ts
new file mode 100644
index 00000000..b507cd4e
--- /dev/null
+++ b/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { IntentReportDetailComponent } from './intent-report-detail.component';
+
+describe('IntentReportDetailComponent', () => {
+  let component: IntentReportDetailComponent;
+  let fixture: ComponentFixture<IntentReportDetailComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ IntentReportDetailComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(IntentReportDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.ts b/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.ts
new file mode 100644
index 00000000..aa65d9fe
--- /dev/null
+++ b/usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.ts
@@ -0,0 +1,25 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+
+@Component({
+  selector: 'app-intent-report-detail',
+  templateUrl: './intent-report-detail.component.html',
+  styleUrls: ['../intent-management.component.less']
+})
+export class IntentReportDetailComponent implements OnInit {
+
+  constructor() { }
+
+  @Input() showModel: boolean;
+  @Input() reportData;
+  @Input() intentInfo;
+  @Output() modalOpreation = new EventEmitter();
+
+  ngOnInit() {
+  }
+  ngOnChanges(){
+  }
+  handleCancel(): void {
+    this.showModel = false;
+    this.modalOpreation.emit({ "cancel": false });
+  }
+}