step-execution-details.component.html

<app-page *ngIf="stepExecutionDetails$ | async as stepExecutionDetails; else loading">

  <app-page-head>
    <app-page-head-back [defaultUrl]="'/jobs/executions/' + jobId"></app-page-head-back>
    <app-page-head-title>
      Step Execution <strong>{{ stepExecutionDetails.stepExecution.stepExecution.name }}
      ({{ stepExecutionDetails.stepExecution.stepExecution.id }})</strong>
      - Job execution  <strong>{{ stepExecutionDetails.jobExecution.name }}</strong>
      ({{ stepExecutionDetails.jobExecution.jobExecutionId }})
    </app-page-head-title>
    <app-page-head-actions>
      <button id="stats" class="btn btn-primary btn-fa" title="Details"
              (click)="viewStepExecutionProgress(stepExecutionDetails.stepExecution)">
        <span class="fa fa-info-circle"></span>
        More details
      </button>
      <button id="refresh" class="btn btn-primary btn-fa" (click)="refresh()">
        <span class="fa fa-refresh"></span>
        Refresh
      </button>
    </app-page-head-actions>
  </app-page-head>

  <div *ngIf="stepExecutionDetails.stepExecutionProgress.percentageComplete < 1">
    <h4>Step Execution Progress</h4>
    <progressbar [animate]="false" max="100"
                 [value]="stepExecutionDetails.stepExecutionProgress.percentageComplete * 100"
                 type="success">
      <b>{{ stepExecutionDetails.stepExecutionProgress.percentageComplete * 100}}%</b>
    </progressbar>
  </div>

  <div>
    <h4>Step Execution</h4>
    <div id="nostepexecution" *ngIf="!stepExecutionDetails?.stepExecution.stepExecution">
      No Step Execution available.
    </div>

    <table id="stepExecution" *ngIf="stepExecutionDetails?.stepExecution?.stepExecution" class="table table-hover">
      <thead>
      <tr>
        <th style="width: 250px">Property</th>
        <th>Value</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td>Step Execution Id</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.id }}</td>
      </tr>
      <tr>
        <td>Job Execution Id</td>
        <td>{{ stepExecutionDetails.stepExecution.jobExecutionId }}</td>
      </tr>
      <tr>
        <td>Step Name</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.name }}</td>
      </tr>
      <tr>
        <td>Step Type</td>
        <td>{{ stepExecutionDetails.stepExecution.stepType }}</td>
      </tr>
      <tr>
        <td>Status</td>
        <td>
          <app-job-execution-status
            [status]="stepExecutionDetails.stepExecution.stepExecution.status"></app-job-execution-status>
        </td>
      </tr>
      <tr>
        <td>Commits</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.commitCount }}</td>
      </tr>
      <tr>
        <td>Duration</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.startTime | dataflowDuration:
          stepExecutionDetails.stepExecution.stepExecution.endTime }}
        </td>
      </tr>
      <tr>
        <td>Filter Count</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.filterCount }}</td>
      </tr>
      <tr>
        <td>Process Skips</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.processSkipCount }}</td>
      </tr>
      <tr>
        <td>Reads</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.readCount }}</td>
      </tr>
      <tr>
        <td>Read Skips</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.readSkipCount }}</td>
      </tr>
      <tr>
        <td>Rollbacks</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.rollbackCount }}</td>
      </tr>
      <tr>
        <td>Skips</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.skipCount }}</td>
      </tr>
      <tr>
        <td>Writes</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.writeCount }}</td>
      </tr>
      <tr>
        <td>Write Skips</td>
        <td>{{ stepExecutionDetails.stepExecution.stepExecution.writeSkipCount }}</td>
      </tr>
      </tbody>
    </table>
  </div>

  <div *ngIf="stepExecutionDetails?.stepExecution?.stepExecution?.exitMessage">
    <h4>Exit Description</h4>
    <pre class="exit">{{ stepExecutionDetails?.stepExecution?.stepExecution?.exitMessage || 'N/A' }}</pre>
  </div>

  <div *ngIf="stepExecutionDetails?.stepExecution?.stepExecution?.executionContext?.values">
    <h4>Step Execution Context</h4>
    <table id="stepExecutionContext" class="table table-hover">
      <thead>
      <tr>
        <th style="width: 250px">Key</th>
        <th>Value</th>
      </tr>
      </thead>
      <tbody>
      <ng-template ngFor let-item
                   [ngForOf]="stepExecutionDetails.stepExecution.stepExecution.executionContext.values | keyvalue">
        <tr>
          <td>{{ item.key }}</td>
          <td>{{ item.value }}</td>
        </tr>
      </ng-template>
      </tbody>
    </table>
  </div>

</app-page>
<ng-template #loading>
  <app-loader></app-loader>
</ng-template>