VID-913 : Addition of Instance IDs in Audit Info screen

Change-Id: I7a440c6797f63588c68d490715272992e626424f
Issue-ID: VID-913
Signed-off-by: Kruthi Bhat <krutbhat@att.com>

2 files changed, 12 insertions, 6 deletions

diff --git a/vid-webpack-master/src/app/shared/components/auditInfoModal/auditInfoModal.component.html b/vid-webpack-master/src/app/shared/components/auditInfoModal/auditInfoModal.component.html
index 874f13a01..0de1b88ae 100644
--- a/vid-webpack-master/src/app/shared/components/auditInfoModal/auditInfoModal.component.html
+++ b/vid-webpack-master/src/app/shared/components/auditInfoModal/auditInfoModal.component.html
@@ -11,7 +11,8 @@
         <br>
         <span style="font-size: 16px;">
           <!-- ServiceInstanceName(ServiceModelName/ServiceModelId) -->
-          <span title="Service Instance name">{{serviceInstanceName }}</span><span title="Service Model name"> ({{serviceModelName}}/</span>
+          <span title="Service Instance name">{{serviceInstanceName }} </span><span *ngIf= "serviceInstanceId" title="Service Instance ID"> | {{serviceInstanceId}}</span>
+          <span title="Service Model name"> ({{serviceModelName}}/</span>
           <span title="Service Model version">{{serviceModelVersion}})</span>
         </span>
       </div>
@@ -38,7 +39,7 @@
               <thead class="thead-dark row">
               <tr class="row">
                 <th scope="col" class="request-id">Request ID</th>
-                <th *ngIf="isAlaCarte&&isALaCarteFlagOn" id="instanceName" class="col-md-2" scope="col" >Instance Name</th>
+                <th *ngIf="isAlaCarte&&isALaCarteFlagOn" id="instanceName" class="col-md-2" scope="col" >Instance Name | <br>Instance ID</th>
                 <th>Model Type</th>
                 <th>Request Type</th>
                 <th>Start Time</th>
@@ -49,11 +50,11 @@
               </thead>
               <tbody>
               <tr class="row" *ngFor="let data of msoInfoData">
-                <td id="msoRequestId" style="width: 22%">
+                <td id="msoRequestId" class="col-md-2" style="width: 22%">
                   <custom-ellipsis [id]="data?.requestId" [value]="data?.requestId" [attr.data-tests-id]="'requestId'"></custom-ellipsis>
                 </td>
-                <td *ngIf="isAlaCarte && isALaCarteFlagOn" class="msoInstanceName" style="width: 10%">
-                  <custom-ellipsis [id]="data?.instanceName" [value]="data?.instanceName"></custom-ellipsis>
+                <td id="msoInstanceName" *ngIf="isAlaCarte && isALaCarteFlagOn" class="msoInstanceName col-md-2" style="width: 10%">
+                  <custom-ellipsis [id]="data?.instanceId" [value]="data?.instanceColumn"></custom-ellipsis>
                 </td>
                 <td id="msoModelType" style="width: 7%">
                   <custom-ellipsis [value]="data?.modelType"></custom-ellipsis>
diff --git a/vid-webpack-master/src/app/shared/components/auditInfoModal/auditInfoModal.component.ts b/vid-webpack-master/src/app/shared/components/auditInfoModal/auditInfoModal.component.ts
index 6afc8d92e..41e99aee9 100644
--- a/vid-webpack-master/src/app/shared/components/auditInfoModal/auditInfoModal.component.ts
+++ b/vid-webpack-master/src/app/shared/components/auditInfoModal/auditInfoModal.component.ts
@@ -32,7 +32,7 @@ export class AuditInfoModalComponent {
   serviceModelId: string;
   jobId: string;
   vidInfoData: AuditStatus[] = [];
-  msoInfoData: AuditStatus[] = [];
+  msoInfoData : any= [];
   isAlaCarte: boolean;
   parentElementClassName = 'content';
   isLoading = true;
@@ -45,6 +45,7 @@ export class AuditInfoModalComponent {
   auditInfoModalComponentService : AuditInfoModalComponentService;
   serviceInstanceName : string;
   serviceModelVersion : any;
+  serviceInstanceId : any;
   exportMSOStatusFeatureEnabled: boolean;
   dataIsReady : boolean = false;
   jobDataLocal : any;
@@ -68,6 +69,7 @@ export class AuditInfoModalComponent {
         _iframeService.addClassOpenModal(this.parentElementClassName);
         this.serviceModelName = jobData.serviceModelName ? jobData.serviceModelName : '';
         this.serviceModelId = jobData.serviceModelId;
+        this.serviceInstanceId = jobData.serviceInstanceId;
         this.jobId = jobData.jobId;
         this.auditInfoModal.show();
         this.serviceInstanceName = jobData.serviceInstanceName;
@@ -152,6 +154,9 @@ export class AuditInfoModalComponent {
         this.vidInfoData = res[0];
         this.msoInfoData = res[1];
         this.msoInfoData.sort(this.getSortOrder("startTime"));
+        this.msoInfoData.forEach((element ) => {
+           element.instanceColumn = element.instanceName + " | " +"<br>" + element.instanceId;
+        });
         this.isLoading = false;
       });
   }