ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.html

   1 <div class="row">
   2   <div class="col-sm-12 col-lg-12">
   3     <div class="card">
   4       <div class="card-header"
   5            i18n>CRUSH map viewer</div>
   6       <div class="card-body">
   7         <div class="row">
   8           <div class="col-sm-6 col-lg-6">
   9             <i *ngIf="loadingIndicator"
  10                [ngClass]="[icons.large, icons.spinner, icons.spin]"></i>
  11
  12             <tree-root #tree
  13                        [nodes]="nodes"
  14                        [options]="treeOptions"
  15                        (updateData)="onUpdateData()">
  16               <ng-template #treeNodeTemplate
  17                            let-node>
  18                 <span *ngIf="node.data.status"
  19                       class="badge"
  20                       [ngClass]="{'badge-success': ['in', 'up'].includes(node.data.status), 'badge-danger': ['down', 'out', 'destroyed'].includes(node.data.status)}">
  21                   {{ node.data.status }}
  22                 </span>
  23                 <span>&nbsp;</span>
  24                 <span class="node-name"
  25                       [ngClass]="{'type-osd': node.data.type === 'osd'}"
  26                       [innerHTML]="node.data.name"></span>
  27               </ng-template>
  28             </tree-root>
  29           </div>
  30           <div class="col-sm-6 col-lg-6 metadata"
  31                *ngIf="metadata">
  32             <legend>{{ metadataTitle }}</legend>
  33             <cd-table-key-value [data]="metadata"></cd-table-key-value>
  34           </div>
  35         </div>
  36       </div>
  37     </div>
  38   </div>
  39 </div>