<section class="content">
  <div class="container-fluid">
    <div class="row align-items-center">
      <!-- Left-hand side: Title -->
      <div class="col-md-6 mb-2">
        <span class="mb-0 page-title">{{'LOG_DETAIL' | translate}} <app-page-help-text [code]="'ERROR_LOGS'"></app-page-help-text> </span>
      </div>

      <div class="col-md-6 d-flex justify-content-end mb-2">
        <button [routerLink]="['/logs']" class="btn btn-success btn-sm me-2">
          <i-feather name="arrow-left-circle" class="small-icon"></i-feather>
          {{"BACK_TO_LIST" | translate}}
        </button>
      </div>
    </div>
    <div class="card">
      <div class="body">
        <div class="row">
          <div class="col-md-12">
            <div class="row pb-2">
              <label for="staticEmail" class="col-sm-2 col-form-label font-weight-bold">
                {{"DATE_TIME" | translate}}
              </label>
              <div class="col-sm-4">
                <span readonly class="form-control">{{log.logged | utcToLocalTime:'full'}}</span>
              </div>

            </div>
            <div class="form-group row">
              <label for="inputPassword" class="col-sm-2 col-form-label font-weight-bold">
                {{"LEVEL" | translate}}
              </label>
              <div class="col-sm-10">
                <input type="text" readonly class="form-control" value="{{log.level}}">
              </div>
            </div>
            <div *ngIf="log.message" class="form-group row">
              <label for="inputPassword" class="col-sm-2 col-form-label font-weight-bold">
                {{"MESSAGE" | translate}}
              </label>
              <div class="col-sm-10">
                <textarea type="text" readonly class="form-control" value="{{log.message}}"></textarea>
              </div>
            </div>
            <div *ngIf="log.logger" class="form-group row">
              <label for="inputPassword" class="col-sm-2 col-form-label font-weight-bold">
                {{"LOGGER" | translate}}
              </label>
              <div class="col-sm-10">
                <textarea type="text" readonly class="form-control" value="{{log.logger}}"></textarea>
              </div>
            </div>
            <div *ngIf="log.properties" class="form-group row">
              <label for="inputPassword" class="col-sm-2 col-form-label font-weight-bold">
                {{"PROPERTIES" | translate}}
              </label>
              <div class="col-sm-10">
                <textarea type="text" readonly class="form-control" value="{{log.properties}}"></textarea>
              </div>
            </div>
            <div *ngIf="log.callsite" class="form-group row">
              <label for="inputPassword" class="col-sm-2 col-form-label font-weight-bold">
                {{"CALLSITE" | translate}}
              </label>
              <div class="col-sm-10">
                <textarea type="text" readonly class="form-control" value="{{log.callsite}}"></textarea>
              </div>
            </div>
            <div *ngIf="log.exception" class="form-group row">
              <label for="inputPassword" class="col-sm-2 col-form-label font-weight-bold">
                {{"EXCEPTION" | translate}}
              </label>
              <div class="col-sm-10">
                <textarea type="text" rows="10" readonly class="form-control" value="{{log.exception}}"></textarea>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
