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