From 036d317e9a713fca592015837c38625a8e1bdbc9 Mon Sep 17 00:00:00 2001
From: zhenzhenbai <850084376@qq.com>
Date: Thu, 20 Apr 2023 17:24:35 +0800
Subject: 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
---
 .../intent-management.component.html               | 10 ++--
 .../intent-management.component.less               |  8 +++-
 .../intent-management.component.ts                 | 53 ++++++++++++++++++++++
 .../intent-report-detail.component.html            | 35 ++++++++++++++
 .../intent-report-detail.component.less            |  0
 .../intent-report-detail.component.spec.ts         | 25 ++++++++++
 .../intent-report-detail.component.ts              | 25 ++++++++++
 7 files changed, 151 insertions(+), 5 deletions(-)
 create mode 100644 usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.html
 create mode 100644 usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.less
 create mode 100644 usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.spec.ts
 create mode 100644 usecaseui-portal/src/app/views/intent-management/intent-report-detail/intent-report-detail.component.ts

(limited to 'usecaseui-portal/src/app/views')

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
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 });
+  }
+}
-- 
cgit