conf-parametros-eva.component.html

<!--Importaciones necesarias-->
<link
  href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap"
  rel="stylesheet" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet" />

<!--desarrollo-->

<div class="contenedorP">
  <!--div superior-->
  <div class="sobremontado">
    <div>
      <button (click)="AgregarParametro()">
        <span class="institution">
          <mat-icon>tune</mat-icon>
          <span class="institution-name">Parametros de Evaluación</span>
          <span class="add-icon"  style="margin-left: 20px">+</span>
        </span>
      </button>

      <button class="volver" (click)="volver()">
        <mat-icon>keyboard_arrow_left</mat-icon>
      </button>

    </div>
  </div>
  <!-- Div del área de búsqueda -->
  <div class="area-busqueda">
    <input type="text" [(ngModel)]="terminoBusqueda" placeholder="Buscar parámetro..." (input)="buscarParametros()">
  </div>

  <!-- Div de la tabla -->
  <div>

    <mat-card class="card">
      <table>
        <thead class="colorsito">
          <tr>
            <th class="colorsito"></th>
            <th class="colorsito">Fecha Configuración</th>
            <th class="colorsito">Descripción</th>
            <th class="colorsito">Puntaje mínimo requerido</th>
            <th class="colorsito">Activo</th>
            <th class="colorsito" style="min-width:200px">Acciones</th>
          </tr>
        </thead>
        <tbody>
          <ng-container *ngFor="let parametro of parametros; let i = index">
            <tr id="fila-{{ i }}">
              <td>
                <button (click)="toggleDiv(i)">
                  <mat-icon>{{ mostrarDiv[i] ? 'keyboard_arrow_down' :
                    'keyboard_arrow_right' }}</mat-icon>
                </button>
              </td>

              <td>{{ formatFecha(parametro.uzytavconparaeva_fecha_c) }}</td>

              <td>{{ parametro.uzytavconparaeva_descrip }}</td>
              <td>{{ parametro.uzytavconparaeva_puminire }}</td>
              <td>
                <section>
                  <mat-checkbox [checked]="parametro.uzytavconparaeva_estado === 'A'" disabled></mat-checkbox>
                </section>
              </td>
              <td>
                <button>
                  <mat-icon class="colorEditar"
                    (click)="EditarParametro(this.parametro.uzytavconparaeva_id)">edit</mat-icon>
                </button>
                <button>
                  <mat-icon color="warn"
                    (click)="eliminarParametro(parametro.uzytavconparaeva_id)">delete</mat-icon>
                </button>
              </td>

            </tr>
            <tr *ngIf="mostrarDiv[i]">
              <div></div>
              <td colspan="5">
                <app-parametros-eva
                  [idConf]="parametro.uzytavconparaeva_id"></app-parametros-eva>
              </td>
            </tr>
          </ng-container>
        </tbody>
      </table>
    </mat-card>
  </div>
</div>