update source to Ceph Pacific 16.2.2

[ceph.git] / ceph / src / pybind / mgr / dashboard / frontend / src / app / ceph / cluster / logs / logs.component.html

<div *ngIf="contentData">
  <ng-container *ngTemplateOutlet="logFiltersTpl"></ng-container>

  <ul ngbNav
      #nav="ngbNav"
      class="nav-tabs"
      cdStatefulTab="logs">
    <li ngbNavItem="cluster-logs">
      <a ngbNavLink
         i18n>Cluster Logs</a>
      <ng-template ngbNavContent>
        <div class="card bg-light mb-3"
             *ngIf="clog">
          <div class="btn-group"
               role="group"
               *ngIf="clog.length">
            <cd-download-button [objectItem]="clog"
                                [textItem]="clogText"
                                fileName="cluster_log">
            </cd-download-button>
            <cd-copy-2-clipboard-button
                    [source]="clogText"
                    [byId]="false">
            </cd-copy-2-clipboard-button>
          </div>
          <div class="card-body">
            <p *ngFor="let line of clog">
              <span class="timestamp">{{ line.stamp | cdDate }}</span>
              <span class="priority {{ line.priority | logPriority }}">{{ line.priority }}</span>
              <span class="message">{{ line.message }}</span>
            </p>

            <ng-container *ngIf="clog.length != 0 else noEntriesTpl"></ng-container>
          </div>
        </div>
      </ng-template>
    </li>
    <li ngbNavItem="audit-logs">
      <a ngbNavLink
         i18n>Audit Logs</a>
      <ng-template ngbNavContent>
        <div class="card bg-light mb-3"
             *ngIf="audit_log">
          <div class="btn-group"
               role="group"
               *ngIf="audit_log.length">
            <cd-download-button [objectItem]="audit_log"
                                [textItem]="auditLogText"
                                fileName="audit_log">
            </cd-download-button>
            <cd-copy-2-clipboard-button
                    [source]="auditLogText"
                    [byId]="false">
            </cd-copy-2-clipboard-button>
          </div>
          <div class="card-body">
            <p *ngFor="let line of audit_log">
              <span class="timestamp">{{ line.stamp | cdDate }}</span>
              <span class="priority {{ line.priority | logPriority }}">{{ line.priority }}</span>
              <span class="message">{{ line.message }}</span>
            </p>

            <ng-container *ngIf="audit_log.length != 0 else noEntriesTpl"></ng-container>
          </div>
        </div>
      </ng-template>
    </li>
  </ul>

  <div [ngbNavOutlet]="nav"></div>
</div>

<ng-template #logFiltersTpl>
  <div class="form-inline">
    <div class="form-group">
      <label for="logs-priority"
             i18n>Priority:</label>
      <select id="logs-priority"
              class="form-control custom-select"
              [(ngModel)]="priority"
              (ngModelChange)="filterLogs()">
        <option *ngFor="let prio of priorities"
                [value]="prio.value">{{ prio.name }}</option>
      </select>
    </div>

    <div class="form-group">
      <label for="logs-keyword"
             i18n>Keyword:</label>
      <div class="input-group">
        <div class="input-group-prepend">
          <span class="input-group-text">
            <i [ngClass]="[icons.search]"></i>
          </span>
        </div>

        <input class="form-control"
               id="logs-keyword"
               type="text"
               [(ngModel)]="search"
               (keyup)="filterLogs()">

        <div class="input-group-append">
          <button type="button"
                  class="btn btn-light"
                  (click)="clearSearchKey()">
            <i class="icon-prepend {{ icons.destroy }}"></i>
          </button>
        </div>
      </div>
    </div>

    <div class="form-group">
      <label for="logs-date"
             i18n>Date:</label>
      <div class="input-group">
        <input class="form-control"
               id="logs-date"
               placeholder="YYYY-MM-DD"
               ngbDatepicker
               [maxDate]="maxDate"
               #d="ngbDatepicker"
               (click)="d.open()"
               [(ngModel)]="selectedDate"
               (ngModelChange)="filterLogs()">
        <span class="input-group-append">
          <button type="button"
                  class="btn btn-light"
                  (click)="clearDate()">
            <i class="icon-prepend {{ icons.destroy }}"></i>
          </button>
        </span>
      </div>
    </div>

    <div class="form-group">
      <label i18n>Time range:</label>
      <ngb-timepicker [spinners]="false"
                      [(ngModel)]="startTime"
                      (ngModelChange)="filterLogs()"></ngb-timepicker>

      <span>&nbsp;&mdash;&nbsp;</span>

      <ngb-timepicker [spinners]="false"
                      [(ngModel)]="endTime"
                      (ngModelChange)="filterLogs()"></ngb-timepicker>
    </div>
  </div>
</ng-template>

<ng-template #noEntriesTpl>
  <span i18n>No log entries found. Please try to select different filter options.</span>
  <span>&nbsp;</span>
  <a href="#"
     (click)="resetFilter()"
     i18n>Reset filter.</a>
</ng-template>