<div class="titulo">
  <span class="titulo-texto">Parametros de Evaluacion</span>
  <button class="rounder-nuevo" (click)="GuardarParametro()">
    <mat-icon class="white-icon">add</mat-icon>
  </button>
</div>


<table class="principal">
  <thead class="colorsito">
    <tr>
      <th class="colorsito"></th>
      <th class="colorsito" style="min-width:400px">Descripción</th>
      <th class="colorsito">Opción</th>
      <th class="colorsito">Aspecto de Evaluación</th>

      <th class="colorsito" style="min-width:200px" >Acciones</th>
    </tr>
  </thead>
  <tbody>
    <ng-container *ngFor="let parametro of parametrosEvaluacion; let i = index">
      <tr>
        <td>
          <button (click)="toggleDiv(i)" class="opciones">
            <mat-icon>{{ mostrarDiv.includes(i) ? 'keyboard_arrow_down' : 'keyboard_arrow_right' }}</mat-icon>
          </button>
        </td>

        <td>{{ parametro.uzytavparaeva_descrip }}</td>
        <td>{{ opciones[parametro.uzytavparaeva_opcmenu] }}</td>
        <td>{{ aspectos[parametro.uzytavparaeva_aspeva] }}</td>

        <td>
          <button>
            <mat-icon class="azul" (click)="EditarParametro(parametro.uzytavparaeva_id)">edit</mat-icon>
          </button>
          <button>
            <mat-icon color="warn" (click)="eliminarParametro(parametro.uzytavparaeva_id)">delete</mat-icon>
          </button>
        </td>
      </tr>
      <tr *ngIf="mostrarDiv.includes(i)">
        <div></div>

        <td colspan="5">
          <app-op-resp-eva [idParaeva]="this.parametro.uzytavparaeva_id"></app-op-resp-eva>
        </td>
      </tr>
    </ng-container>
  </tbody>
</table>