<h1 mat-dialog-title class="prevent-select">Detalles gerencia de seguridad</h1>
<div mat-dialog-content class="prevent-select">
  <div class="is-loading animated fadeIn fast" *ngIf="isLoading">
    <mat-spinner align="center"></mat-spinner>
    <h3>Cargando datos ...</h3>
  </div>
  <div class="has-error animated fadeIn pt-64" *ngIf="!isLoading && hasError">
    <mat-icon class="red_primary_font">error</mat-icon>
    <h2>{{ errorStr }}</h2>
  </div>
  <div class="dialog_details_column animated fadeIn" *ngIf="!isLoading && !hasError">
    <p><b>Gerencia de seguridad #{{ securityManagement!.ID_GERENCIA_SEGURIDAD }}</b></p>
    <p><b>
      Teléfono principal: 
    </b>{{ securityManagement!.LADA_TELEFONO_PRINCIPAL }}-{{ securityManagement!.TELEFONO_PRINCIPAL }}. <span *ngIf="securityManagement!.EXTENSION_TELEFONO_PRINCIPAL != null">
      <b>Ext. </b> {{ securityManagement!.EXTENSION_TELEFONO_PRINCIPAL }}
    </span></p>
    <p *ngIf="securityManagement!.TELEFONO_SECUNDARIO != null"><b>
      Teléfono secundario: 
    </b>{{ securityManagement!.LADA_TELEFONO_PRINCIPAL }}-{{ securityManagement!.TELEFONO_PRINCIPAL }}. <span *ngIf="securityManagement!.EXTENSION_TELEFONO_SECUNDARIO != null">
      <b>Ext. </b> {{ securityManagement!.EXTENSION_TELEFONO_PRINCIPAL }}
    </span></p>
    <p><b>Correo electrónico: </b>{{ securityManagement!.CORREO_GERENCIA }}</p>
    <p><b>Gerente: </b>{{ securityManagement!.GERENTE }}</p>
    <p class="m-0"><b>Órdenes de trabajo relacionadas: </b></p>
    <ul class="m-0">
      <li *ngFor="let order of securityManagement!.ORDENES_TRABAJO!">
        Orden de mantenimiento correctivo #{{ order.ID_ORDEN }}
      </li>
      <li *ngIf="securityManagement!.ORDENES_TRABAJO!.length == 0">Ninguna</li>
    </ul>
    <p class="mt-12"><b>Estado: </b>{{ securityManagement!.ESTADO }}</p>
    <p><b>Usuario registró: </b>{{ securityManagement!.USUREG }}</p>
    <p><b>Fecha de registro: </b>{{ securityManagement!.FECREG }}</p>
    <p><b>Usuario que modificó: </b>{{ securityManagement!.USUMOD != null ? securityManagement!.USUMOD : '-' }}</p>
    <p><b>Fecha de modificación: </b>{{ securityManagement!.FECMOD != null ? securityManagement!.FECMOD : '-' }}</p>
  </div>
</div>
<div mat-dialog-actions align="end">
  <button mat-button mat-dialog-close>Cerrar</button>
</div>