ceph/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.html

   1 <!-- Embed dashboard -->
   2 <cd-loading-panel *ngIf="loading && grafanaExist"
   3                   i18n>Loading panel data...</cd-loading-panel>
   4
   5 <cd-alert-panel type="info"
   6                 *ngIf="!grafanaExist"
   7                 i18n>Please consult the
   8   <a href="{{ docsUrl }}"
   9      target="_blank">documentation</a> on how to
  10   configure and enable the monitoring functionality.</cd-alert-panel>
  11
  12 <cd-alert-panel type="info"
  13                 *ngIf="!dashboardExist"
  14                 i18n>Grafana Dashboard doesn't exist. Please refer to
  15   <a href="{{ docsUrl }}"
  16      target="_blank">documentation</a> on how to
  17   add dashboards to Grafana.</cd-alert-panel>
  18
  19 <ng-container *ngIf="grafanaExist && dashboardExist">
  20   <div class="row">
  21     <div class="col-12">
  22       <div class="form-inline timepicker">
  23         <label for="timepicker"
  24                class="ml-1 my-1 col-form-label"
  25                i18n>Grafana Time Picker</label>
  26
  27         <select id="timepicker"
  28                 name="timepicker"
  29                 class="custom-select my-1 mx-3"
  30                 [(ngModel)]="time"
  31                 (ngModelChange)="onTimepickerChange($event)">
  32           <option *ngFor="let key of grafanaTimes"
  33                   [ngValue]="key.value">{{ key.name }}
  34           </option>
  35         </select>
  36
  37         <button class="btn btn-light my-1"
  38                 i18n-title
  39                 title="Reset Settings"
  40                 (click)="reset()">
  41           <i [ngClass]="[icons.undo]"></i>
  42         </button>
  43       </div>
  44     </div>
  45   </div>
  46
  47   <div class="row">
  48     <div class="col-12">
  49       <div class="grafana-container">
  50         <iframe #iframe
  51                 id="iframe"
  52                 [src]="grafanaSrc"
  53                 class="grafana"
  54                 [ngClass]="panelStyle"
  55                 frameborder="0"
  56                 scrolling="no">
  57         </iframe>
  58       </div>
  59     </div>
  60   </div>
  61 </ng-container>