<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <title>Sistema de logistica </title>
  <link rel="stylesheet" type="text/css" href="<?= ruta ?>include/css/style_login.css">
  <link rel="stylesheet" type="text/css" href="<?= ruta ?>app/css/xweb.css">
  <link href="https://fonts.googleapis.com/css?family=Poppins:600&display=swap" rel="stylesheet">
  <script src="https://kit.fontawesome.com/a81368914c.js"></script>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" type="text/css" href="<?php echo ruta ?>include/css/bootstrap.css">





  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
  <script src="<?php echo ruta ?>include/js/popper.min.js"></script>
  <script src="<?php echo ruta ?>include/js/bootstrap.min.js"></script>

</head>

<body>





  <div class="mt-5">



    <div class="center">
      <form action="" method="post">

        <input type="hidden" name="pagina" value="login">

        <img src="<?= ruta ?>publico/img/logo-castillo.svg" style="width: 75%;">

        <h5 class="modal-title text-center" id="exampleModalLabel" style="width: 100%;
    font-weight: 900; margin: 15px 0;
    font-size: 25px;"> </h5>
        <?php
        if (isset($_GET['error'])) {
          $error = $_GET['error'];
        } else {
          $error = '0';
        }
        if (isset($_GET['b'])) {
          $b_get = $_GET['b'];
        } else {
          $b_get = '0';
        }
        if ($error == '1') { ?>
          <div class="alert alert-danger" role="alert"> Tú contraseña o usuario esta mal escrito, intentalo nuevamente</div>
        <?php } ?>
 


        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="basic-addon1"> <i class="fas fa-user"></i></span>
          </div>
          <input type="text" class="form-control" name="usuario" placeholder="usuario">
        </div>



        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="basic-addon1"> <i class="fas fa-lock"></i></span>
          </div>
          <input type="text" class="form-control" name="clave" placeholder="clave">
        </div>

 
        <input type="hidden" name="login" value="ok">

        <!-- <a href="<?= ruta ?>recuperar_clave" class="text-left" style="padding: 10px 0; text-decoration: none;">Recuperar clave</a> -->

        <input id="" name="r" type="hidden" value="<?= $b_get; ?>" />
        <input type="submit" class="btn" value="Ingresar">



        <button id="buttonCancel" style="display: none" type="button" class="btn btn-outline-secondary">CANCEL</button>
        <div id="prompt">
         
        </div>

<p style="
    font-family: auto;
    font-weight: bold;
    padding-top: 10px;
    padding-bottom: 0px;
    font-size:14px;
">© 2020-2024 Sistemas - Asociación Civil Castillo de Chancay. Todos los derechos reservados.
</p>


      </form>
    </div>
  </div>


  <!--  -->
  <script>
    function cerra_alerta() {
      $(".alerta").slideUp();
      top.document.location.href = "<?php echo ruta ?>";
    }

    function validar_usuario(a) {
      var seo = a.value;
      var ru = '<?php echo ruta ?>';
      $.ajax({
        type: "POST",
        url: ru + "?pagina=login",
        data: "seo=" + seo + "&validar_usuario=ok",
        dataType: "json",
        success: function(data) {
          //  alert(data)
          if (data.seo == 1) {
            $("#vali_disdup").html(
              '<div style="position: absolute; right: 0px; font-size: 12px; color: red;"><i class="fas fa-times"></i> Usuario no disponible </div>');
            $("#regis_vali").attr("disabled", true);
          }
          if (data.seo == 0) {
            $("#vali_disdup").html(
              '<div style="position: absolute; right: 0px; font-size: 12px; color: #38d39f;"><i class="fas fa-check"></i> Usuario disponible </div>');
            $("#regis_vali").attr("disabled", false);

          }
        },
      });
    }

    function validar_claves_iguales(c) {

      var clave1 = $("#clave1").val()
      var clave2 = c.value;

      if (clave1 == clave2) {
        $("#vali_claves").html(
          '<div style="position: absolute; right: 0px; font-size: 12px; color: #38d39f;"><i class="fas fa-check"></i>  </div>');
        $("#regis_vali").attr("disabled", false);
      } else {
        $("#vali_claves").html(
          '<div style="position: absolute; right: 0px; font-size: 12px; color: red;"><i class="fas fa-times"></i> Las claves no son iguales </div>');
        $("#regis_vali").attr("disabled", true);

      }


    }




    const inputs = document.querySelectorAll(".input");

    function addcl() {
      let parent = this.parentNode.parentNode;
      parent.classList.add("focus");
    }

    function remcl() {
      let parent = this.parentNode.parentNode;
      if (this.value == "") {
        parent.classList.remove("focus");
      }
    }
    inputs.forEach(input => {
      input.addEventListener("focus", addcl);
      input.addEventListener("blur", remcl);
    });
  </script>


</body>

</html>