<clr-datagrid (clrDgRefresh)="refresh($event)" class="wayne-clr-datagrid">
  <clr-dg-placeholder>{{'MESSAGE.NO_MESSAGE' | translate}}</clr-dg-placeholder>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">
      {{'TITLE.NAME' | translate}}
    </ng-container>
  </clr-dg-column>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">
      {{'CRONJOB.GROUP' | translate}}
    </ng-container>
  </clr-dg-column>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">
      {{'TITLE.STATUS' | translate}}
    </ng-container>
  </clr-dg-column>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">
      {{'CRONJOB.FAIL_REASON' | translate}}
    </ng-container>
  </clr-dg-column>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">
      {{'TITLE.START_TIME' | translate}}
    </ng-container>
  </clr-dg-column>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">
      {{'TITLE.END_TIME' | translate}}
    </ng-container>
  </clr-dg-column>
  <clr-dg-row *clrDgItems="let job of jobs">
    <clr-dg-cell class="copy">{{job.kubeJob.metadata.name}}</clr-dg-cell>
    <clr-dg-cell>{{job.cluster}}</clr-dg-cell>
    <clr-dg-cell>
      <a href="javascript:void(0)" (click)="listPod(job)" class="label"
         [class.label-success]="job.kubeJob.status.detail=='active'"
         [class.label-warning]="job.kubeJob.status.detail=='warnings'">
        {{job.kubeJob.status.detail}}
      </a>
      <a href="javascript:void(0)"
         *ngIf="job.kubeJob.status.warnings"
         (click)="listEvent(job.kubeJob.status.warnings)"
         style="color:#a32100">
        <clr-icon shape="error-standard"></clr-icon>
      </a>
    </clr-dg-cell>
    <clr-dg-cell>
      <span
        *ngIf="job.kubeJob.status.conditions"
      >
      {{job.kubeJob.status.conditions[0]['message']}}
      </span>
    </clr-dg-cell>
    <clr-dg-cell>{{job.kubeJob.status.startTime | date: "yyyy-MM-dd HH:mm:ss"}}</clr-dg-cell>
    <clr-dg-cell>{{job.kubeJob.status.completionTime | date: "yyyy-MM-dd HH:mm:ss"}}</clr-dg-cell>
  </clr-dg-row>
  <clr-dg-footer>
    <wayne-paginate
      [(currentPage)]="currentPage"
      [total]="page.totalCount"
      [rate]="0.5"
      [pageSizes]="[5, 10, 25]"
      (sizeChange)="pageSizeChange($event)">
    </wayne-paginate>
  </clr-dg-footer>
</clr-datagrid>
<list-pod></list-pod>
<list-event></list-event>
