<%- include('partials/_header/'); %>

  <style>
    .status-indicator {
      display: inline-block;
      width: 10px;
      height: 10px;
      border-radius: 4px;
      vertical-align: middle;
    }

    .status-vigente {
      background-color: rgb(21, 162, 21);
    }

    .status-anulada {
      background-color: rgb(177, 15, 3);
    }


    .status-siniestro {
      background-color: rgb(139, 10, 141);
    }

    .status-deuda {
      background-color: rgb(237, 66, 80);
    }
  </style>


  <div class="cont-1300">

    <div class="listado-tabla">
      <div class="buscador">

        <form class="d-flex just-start" action="#" method="get">
          <input style="text-transform: uppercase ; font-size: 10px; width: 100px; height: 30px;" name="polizabuscada"
            type="text" class="form-control" placeholder="Usuario">
          <button type="submit" class="btn btn-danger"
            style="width: 100px; height: 30px; font-size: 10px; background-color: darkslateblue; font: width; border-color: darkslateblue; ">
            Buscar
          </button>
        </form>
        
        

        <form class="d-flex just-start" action="#" method="get">
          <input style="font-size: 13px;" class="form-control" class="form-select" value="" type="date"
                    id="fechadesde" name="fechadesde" required>
          <input style="font-size: 13px;" class="form-control" class="form-select" value="" type="date"
                    id="fechahasta" name="fechahasta" required>          
          <button type="submit" class="btn btn-danger"
            style="width: 100px; height: 30px; font-size: 10px; background-color: darkslateblue; font: width; border-color: darkslateblue; ">
            Buscar
          </button>
        </form>        

      </div>
     

      <div class="table-responsive">
        <table class="table table-hover">
          <thead>
            <tr style="font-size: 10px;">
              <th scope="col"></th>
              <th scope="col">Contador</th>
              <th scope="col">Id</th>
              <th scope="col">Usuario</th>
              <th scope="col">Fecha y Hora</th>
              <th scope="col">Acción</th>        
              <th scope="col">Ver Póliza</th>                 
            </tr>
          </thead>
          <tbody>
            <% if (data) {%>

              <% for (var i=0; i < data.logs.length; i++) { %>
                <tr style="font-size: 10px;">     


                  
                  <td style="font-size: 10px;">
                   
                    <td class=" col-puesto" style="font-size: 10px;">
                      <%= data.logs[i].Id_Log %>
                  </td>
                  <td class="col-puesto" style="font-size: 10px;">
                    <%= data.logs[i].Id_Poliza %>
                  </td>
                  <td class="col-puesto" style="font-size: 10px;">
                    <%= data.logs[i].user %>
                  </td>                  
                  <td class="col-puesto" style="font-size: 10px;">
                    <% mifecha=data.logs[i].fecha %>          
                    <% dia = mifecha.getUTCDate().toString().padStart(2, '0') %>
                    <% mes = (mifecha.getUTCMonth() + 1).toString().padStart(2, '0') %>
                    <% anio = mifecha.getUTCFullYear() %>

                    <% hora = mifecha.getUTCHours().toString().padStart(2, '0') %>
                    <% minutos = mifecha.getUTCMinutes().toString().padStart(2, '0') %>
                    <% segundos = mifecha.getUTCSeconds().toString().padStart(2, '0') %>

                    <%= fechaCorrecta  = `${dia}/${mes}/${anio} ${hora}:${minutos}:${segundos}` %>                   
                    
                    </td>                   
                    <td class="col-puesto" style="font-size: 10px;">
                        <%= data.logs[i].Modifico %>
                    </td>     
                    
                     <td>
                        <a href="/edit_poliza/<%= data.logs[i].Id_Poliza %> "><i
                            style="color:darkslateblue; font-size: 10px;" class="fa-solid fa-pencil"></i><span
                            style="font-size: 10px;"> Ver Detalle Póliza</span>
                        </a>
                      </td>

                </tr>  

                <% } %>
                  <% } %>

          </tbody>

        </table>
      </div>
    </div>
  </div>
  <script src="//cdn.jsdelivr.net/npm/sweetalert2@10"></script>

  <% if(typeof alert !="undefined" ) { %>
    <script>
      Swal.fire({
        title: '<%= alertTitle %>',
        text: '<%= alertMessage %>',
        icon: '<%= alertIcon %>',
        showConfirmButton: <%= showConfirmButton %> ,
        timer: <%= 1500 %>             
        }).then(() => {
          window.location = '<%= ruta %>'
        })

    </script>
    <% } %>





      <%- include('partials/_footer'); %>