ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.html

   1 <nav ngbNav
   2      #nav="ngbNav"
   3      class="nav-tabs"
   4      cdStatefulTab="image-list">
   5   <ng-container ngbNavItem="issues">
   6     <a ngbNavLink
   7        i18n>Issues ({{ image_error.data.length }})</a>
   8     <ng-template ngbNavContent>
   9       <cd-table [data]="image_error.data"
  10                 columnMode="flex"
  11                 [columns]="image_error.columns"
  12                 [autoReload]="-1"
  13                 (fetchData)="refresh()"
  14                 [status]="tableStatus">
  15       </cd-table>
  16     </ng-template>
  17   </ng-container>
  18   <ng-container ngbNavItem="syncing">
  19     <a ngbNavLink
  20        i18n>Syncing ({{ image_syncing.data.length }})</a>
  21     <ng-template ngbNavContent>
  22       <cd-table [data]="image_syncing.data"
  23                 columnMode="flex"
  24                 [columns]="image_syncing.columns"
  25                 [autoReload]="-1"
  26                 (fetchData)="refresh()"
  27                 [status]="tableStatus">
  28       </cd-table>
  29     </ng-template>
  30   </ng-container>
  31   <ng-container ngbNavItem="ready">
  32     <a ngbNavLink
  33        i18n>Ready ({{ image_ready.data.length }})</a>
  34     <ng-template ngbNavContent>
  35       <cd-table [data]="image_ready.data"
  36                 columnMode="flex"
  37                 [columns]="image_ready.columns"
  38                 [autoReload]="-1"
  39                 (fetchData)="refresh()"
  40                 [status]="tableStatus">
  41       </cd-table>
  42     </ng-template>
  43   </ng-container>
  44 </nav>
  45
  46 <div [ngbNavOutlet]="nav"></div>
  47
  48 <ng-template #stateTmpl
  49              let-row="row"
  50              let-value="value">
  51   <span [ngClass]="row.state_color | mirrorHealthColor">{{ value }}</span>
  52 </ng-template>
  53
  54 <ng-template #progressTmpl
  55              let-row="row"
  56              let-value="value">
  57   <div *ngIf="row.state === 'Replaying'">
  58   </div>
  59   <div class="w-100 h-100 d-flex justify-content-center align-items-center">
  60     <ngb-progressbar *ngIf="row.state === 'Replaying'"
  61                      type="info"
  62                      class="w-100"
  63                      [value]="value"
  64                      [showValue]="true"></ngb-progressbar>
  65   </div>
  66 </ng-template>