sacg-cronogramas/src/app/pages/actualizacion-pd/actualizacion-pd.component.html

<div class="p-3 text-white">
  <div class="flex align-content-start flex-wrap gap-2 border-round border-blue-400 my-2 lg:px-0 py-3 my-1">
    <div class="col-12 md:col-3 lg:col-2 tablaAzul border-round ">
        <div class="border-round font-bold ">
          <div class="h-4rem">Filtro Empresa</div>
          <p-select [options]="empresas" [(ngModel)]="selectedCity" optionLabel="name" placeholder="Seleccione..." class="w-full md:w-56" />
        </div>
    </div>
    <div class="col-12 md:col-3 lg:col-2 tablaAzul border-round">
        <div class="border-round font-bold">
          <div class="h-4rem">Filtro C&oacute;digo Cronograma</div>
          <p-select [options]="empresas" [(ngModel)]="selectedCity" optionLabel="name" placeholder="Seleccione..." class="w-full md:w-56" />
          </div>
    </div>
  </div>
<!-- Tabla1 -->
<div class="font-bold my-2 tituloTabla">T&iacute;tulo de la tabla:</div>
  <p-table  id="azul"
    [value]="products" stripedRows
    showGridlines
    [paginator]="true"
    [rows]="5"
    [showCurrentPageReport]="true"
    currentPageReportTemplate="Mostrando del {first} al {last} de un total de {totalRecords} registros"
    [rowsPerPageOptions]="[5, 10, 20]">
        <ng-template #header>
            <tr>
                <th class="tablaAzul font-bold text-white">Empresa</th>
                <th class="tablaAzul font-bold text-white">C&oacute;digo de cronograma</th>
                <th class="tablaAzul font-bold text-white">Etapa del Servicio</th>
                <th class="tablaAzul font-bold text-white">Nombre sistema</th>
                <th class="tablaAzul font-bold text-white">Tipo de inversi&oacute;n</th>
                <th class="tablaAzul font-bold text-white">C&oacute;digo de glosa PD</th>
                <th class="tablaAzul font-bold text-white">Descripci&oacute;n glosa</th>
                <th class="tablaAzul font-bold text-white">Monto Inversi&oacute;n Total (UF)</th>
                <th class="tablaAzul font-bold text-white">A&ntilde;o de Inicio</th>
                <th class="tablaAzul font-bold text-white">A&ntilde;o de T&eacute;rmino</th>
                <th class="tablaAzul font-bold text-white">Mes de T&eacute;rmino</th>
                <th class="tablaAzul font-bold text-white">Nota</th>
                <th class="bg-green-400 font-bold text-white">Estado aprobaci&oacute;n</th>
                <th class="bg-green-400 font-bold text-white">Observaci&oacute;n</th>
            </tr>
        </ng-template>
        <ng-template #body let-product>
            <tr>
                <td>{{ product.empresa }}</td>
                <td>{{ product.codigoCronograma }}</td>
                <td>{{ product.codigoCronogramaAjuste }}</td>
                <td>{{ product.tipoCarga }}</td>
                <td>{{ product.estadoRevision }}</td>
                <td>{{ product.estadoRevision }}</td>
                <td>{{ product.fechaIngreso }}</td>
                <td>
                  <div class="border-round font-bold">
                    <p-select [options]="estadoAprobacion" [(ngModel)]="product.dato13" optionLabel="name" placeholder="Seleccione..." class="selectTabla"/>
                  </div>
                </td>
                <td>{{ product.dato9 }}</td>
                <td>{{ product.dato10 }}</td>
                <td>{{ product.dato11 }}</td>
                <td>{{ product.dato12 }}</td>
                <td class="bg-verde">
                  <div class="border-round font-bold">
                    <p-select [options]="estadoAprobacion" [(ngModel)]="product.dato13" optionLabel="name" placeholder="Seleccione..." class="selectTabla"/>
                  </div>
                </td>
                <td class="bg-verde">
                  <input
                  type="analista"
                  pInputText
                  [(ngModel)]="product.analista"
                  placeholder="Analista"
                  name="analista"
                  class="input-with-icon w-full"
                  style="background-color: white; color: black;width: 228px !important;"
                /></td>
            </tr>
        </ng-template>
</p-table>
<div class="col-12 text-right">
  <i class="fa-solid fa-file-excel" style="color: #007239;font-size: 24px;"></i>
</div>

</div>