File "consul.php"

Full Path: C:/wamp64/www/APPSST/invenconsul/consul.php
File size: 11.74 KB
MIME-type: text/x-php
Charset: utf-8

<?php
set_time_limit(0);
session_start();
header("Cache-control: private"); // Arregla IE 6

//*******Datos de Conexion Base de Datos************
include("../bd/conexion.php");

?>

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />

  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.13.1/css/jquery.dataTables.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/menup.css">
    <link rel="stylesheet" type="text/css" href="../css/consueppc1.css">
    <link rel="stylesheet" type="text/css" href="../css/consul.css">
    <title>CONSULTA EPP NUEVO</title>
	<link rel="icon" type="image/png" href="../img/icono.png"><!-- Cambia el icono de los titulos en las pestañas ico 16X16 -->

  </head>

  <style>
    /* Estilo general */
body {
  height: 100vh;
  background-image: linear-gradient(to right, #e2e2e2, #ffe5c9);
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

/* Wrapper para centrar el contenido */
.wrapper {
  background-image: linear-gradient(to right, #e2e2e2, #ffe5c9);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 100%;
  padding: 20px;
  background-repeat: no-repeat;
  background-position: top center;
  overflow-x: auto; /* Permite desplazamiento horizontal si es necesario */
}

/* Formulario en el cuadro blanco */
form {
  background: white;
  border-radius: 25px;
  padding: 20px; /* Aumento del padding para mayor espacio */
  box-shadow: 0px 10px 20px 10px rgb(0 0 0 / 10%);
  width: 100%;
  max-width: 1000px; /* Mantén el tamaño máximo que deseas */
  min-width: 600px; /* Mantén el tamaño mínimo */
  word-wrap: break-word;
}

/* Estilos del título */
.centerTitulo {
  text-align: center;
  width: 100%;
}

.centerTitulo h3 {
  font-size: 24px; /* Asegura que el título mantenga un tamaño adecuado */
  font-weight: bold;
  margin: 0;
  text-align: center;
  word-wrap: break-word;
  max-width: 95%; /* Asegura que el título no se desborde del cuadro blanco */
}

/* Tabla */
table {
  width: 100%; /*  Ajustamos la tabla al 95% del contenedor */
  box-shadow: 0px 10px 20px 10px rgb(0 0 0 / 10%);
  margin-bottom: 20px;
  border-collapse: collapse;
}

th, td {
  padding: 10px;
  text-align: center;
  border: 1px solid #ddd;
}

th {
  background-color: rgb(255, 138, 55);
  color: white;
}

td {
  text-align: center;
}

/* Botones */
.btn {
  display: inline-block;
  padding: 10px 20px;
  font-size: 14px;
  color: white;
  text-decoration: none;
  border-radius: 5px;
  margin-top: 10px;
}

.btn:hover {
  opacity: 0.8;
}

/* Responsividad para pantallas más pequeñas */
@media (max-width: 768px) {
  /* Ajustamos el formulario para pantallas medianas */
  form {
    width: 95%; /* El formulario ocupará el 95% del contenedor */
    min-width: 320px; /* Asegura que el formulario no se haga demasiado pequeño */
  }

  .centerTitulo h3 {
    font-size: 20px; /* Ajustamos el tamaño del título en pantallas medianas */
    max-width: 100%; /* Ajuste del título */
  }

  table {
    width: 100%; /* Aseguramos que la tabla ocupe el 100% del contenedor */
  }

  th, td {
    font-size: 12px; /* Ajuste del tamaño de la fuente para pantallas medianas */
    padding: 8px;
  }

  .btn {
    font-size: 12px;
    padding: 8px 16px;
  }
}

/* Responsividad para pantallas más pequeñas (teléfonos) */
@media (max-width: 480px) {
  form {
    width: 100%; /* El formulario ocupa todo el ancho de la pantalla */
    min-width: 300px; /* Asegura que el formulario no se reduzca demasiado */
  }

  .centerTitulo h3 {
    font-size: 16px; /* Ajuste de tamaño del título */
    max-width: 100%; /* Ajustamos el título */
  }

  th, td {
    font-size: 10px; /* Reducción del tamaño de la fuente */
    padding: 6px;
  }

  .btn {
    font-size: 10px;
    padding: 6px 12px;
  }
}
.btn-orange {
    background-color: #FFA500;  /* Color de fondo naranja */
    color: #fff; /* Color del texto */
    font-size: 12px;
    padding: 10px 45px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    margin-top: 10px;
    cursor: pointer;
    text-decoration: none; /* Para eliminar el subrayado en enlaces */
    display: inline-block; /* Para que el enlace se comporte como un botón */
}

/* Mantener el color naranja al pasar el mouse */
.btn-orange:hover {
    background-color: #FF8C00;  /* Un tono más oscuro de naranja para efecto hover */
    color: #fff; /* Color del texto */
}


  </style>

  <body style="height: 100vh;background-image: linear-gradient(to right, #e2e2e2, #ffe5c9);">
    <div class="wrapper" style="background-image: linear-gradient(to right, #e2e2e2, #ffe5c9);display: flex;align-items: center;flex-direction: column;justify-content: center;width: 100%;min-height: 100%;padding: 20px;background-repeat: no-repeat;background-position: top center;">
      <FORM action="CONSUEPPC1.PHP" method="post" style="background: white;border-radius: 25px;padding: 10px; box-shadow: 0px 10px 20px 10px rgb(0 0 0 / 10%);">
        <table>
          <tr>
            <td height="87">
              <center class="centerTitulo" style="margin-bottom: 20px;">
                <H3>CONSULTA INVENTARIO EPP NUEVO</H3>
              </center>
            </td>
          </tr>
        </table>
        <CENTER>
          <table style="width: 95%; box-shadow: 0px 10px 20px 10px rgb(0 0 0 / 10%);" class="table table-bordered" id="tablaManual">
            <thead style="background-color: rgb(255, 138, 55); color: white;">
              <tr>
                <th style="vertical-align: middle;"><strong>
                    <center>ID</center>
                  </strong></th>
                <th style="vertical-align: middle;"><strong>
                    <center>CODIGO</center>
                  </strong></th>
                <th style="vertical-align: middle;"><strong>
                    <center>DESCRIPCION</center>
                  </strong></th>
                <th style="vertical-align: middle;"><strong>
                    <center>CANTIDAD</center>
                  </strong></th>
              </tr>
            </thead>
            <tbody>
                <?php
                // Realizar una consulta a la tabla inventario
                $consulta_inventario = $conexion->query("SELECT ID, CODIGO, DESCRIPCION, CANTIDAD FROM inventario");

                // Verificar si se obtuvieron resultados
                if ($consulta_inventario->num_rows > 0) {
                    // Mostrar los resultados en un bucle while
                    while ($fila_inventario = $consulta_inventario->fetch_assoc()) {
                        $ID = $fila_inventario['ID'];
                        $CODIGO = $fila_inventario['CODIGO'];
                        $DESCRIPCION = $fila_inventario['DESCRIPCION'];
                        $CANTIDAD = $fila_inventario['CANTIDAD'];
                        ?>
                        <tr>
                            <td class="align-middle">
                                <CENTER><b><?PHP echo $ID; ?></b></CENTER>
                            </td>
                            <td class="align-middle">
                                <CENTER><b><?PHP echo $CODIGO; ?></b></CENTER>
                            </td>
                            <td class="align-middle">
                                <center><b><?PHP echo $DESCRIPCION; ?></b></center>
                            </td>
                            <td class="align-middle">
                                <CENTER><b><?PHP echo $CANTIDAD; ?></b></CENTER>
                            </td>
                        </tr>
                        <?php
                    }
                } else {
                    // Si no se encontraron resultados
                    echo "<tr><td colspan='4'>No se encontraron registros en la tabla inventario.</td></tr>";
                }
                ?>
            </tbody>
          </table>
            <a class="btn btn-blue btn-lg" href="consulReposicion/consulDotaUsa.php">Inventario Dotacion Reposicion</a>
            <a class="btn btn-green btn-lg" href="../invenconsul/excelInventa.PHP"><i class="fa-solid fa-file-excel" style="margin-right: 8px;"></i>Descargar inventario</a>
            <a class="btn btn-red btn-lg" href="../dotacion/menup.PHP"><i class="fa-solid fa-circle-arrow-left"></i></a>
			<br>
			<a class="btn-orange" href="movimiento.php">Movimiento inventario</a>
		  <p>&nbsp;</p>
		  
        </CENTER>




      </form>
    </div>

    <script>
      $(document).ready(function() {
        $.noConflict();
        $('#tablaManual').DataTable({
          language: {
            "decimal": "",
            "emptyTable": "No hay información",
            "info": "Mostrando _START_ a _END_ de _TOTAL_ Entradas",
            "infoEmpty": "Mostrando 0 to 0 of 0 Entradas",
            "infoFiltered": "(Filtrado de _MAX_ total entradas)",
            "infoPostFix": "",
            "thousands": ",",
            "lengthMenu": "Mostrar _MENU_ Entradas",
            "loadingRecords": "Cargando...",
            "processing": "Procesando...",
            "search": "Buscar:",
            "zeroRecords": "Sin resultados encontrados",
            "paginate": {
              "first": "Primero",
              "last": "Ultimo",
              "next": "Siguiente",
              "previous": "Anterior"
            }
          }
        });
      })
    </script>

    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.4/umd/popper.min.js"></script>
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>

  </body>
  </html>