<?php 
    if(!isset($_SESSION["user_id"])){ Core::redir("./");}
    $user_sesion= UserData::getById($_SESSION["user_id"]);
    // si el id  del usuario no existe.
    if($user_sesion==null){ Core::redir("./");}
?>
<?php $cliente = ClienteData::getById(intval($_GET["id"]));?>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">        
  <!-- Main content -->
  <section class="content">
    <div class="row">
      <div class="col-md-12">
        <div class="box">
          <div class="box-header with-border">
            <h1 class="box-title"><b>PAGOS: </b><?php echo $cliente->nombre; ?></h1>
            <div class="box-tools pull-right"></div>
          </div>
          <!-- /.box-header -->
          <div class="box-body">
              <b>DIRECCIÓN:</b> <?php echo $cliente->direccion; ?><br>
              <b>TELEFONO:</b> <?php echo $cliente->telefono; ?><br>
          </div>
        </div><!-- /.box -->

        <div class="box box-primary">
          <!-- /.box-header -->
          <div class="box-body">
            <?php
              $dateA = date("Y");
              $hoy = new DateTime();

              $fecha = new DateTime($cliente->fecha_mensualidad);

              for($i=1;$i<=12;$i++){
                $existePago = PagoData::ExistPayment_MonthDay($i,$cliente->cliente_id);
                //$fecha = new DateTime($dateA.'-'.$i.'-01');
                $fecha->setdate($dateA,$i,$fecha->format('d'));


                echo '<div class="col-md-3 col-sm-6 col-xs-12"><div class="info-box">';

                if(is_null($existePago)){
                  echo '<span class="info-box-icon bg-yellow"><i class="fa fa-calendar"></i></span>
                      <div class="info-box-content">
                        <span class="info-box-text">';

                  if($fecha<=$hoy){
                    echo '<a href="cobrar/edit/'.$cliente->cliente_id.'">Pendiente</a></span>';
                  }
                  else{
                    echo 'Pendiente</span>';
                  }
                }
                else{
                  echo '<span class="info-box-icon bg-green"><i class="fa fa-thumbs-o-up"></i></span>
                      <div class="info-box-content">
                        <span class="info-box-text">Pagada</span>';
                }
                echo '
                      <span class="info-box-number">'.strtoupper(strftime("%B", $fecha->getTimestamp())).'</span>
                      <span class="progress-description">Corte: '.$fecha->format('d-m-Y').'</span>
                    </div>
                  </div>
                </div>';
              }
            ?>
          </div>
        </div><!-- /.box -->
      </div><!-- /.col -->

    </div><!-- /.row -->
  </section><!-- /.content -->
  <section>
    <div class="row">
      <div class="col-md-12">   
        <div class="form-group">
          <div class="col-md-4"  style="display: none">
            <div class="input-group input-group-sm">
              <input type="text" class="form-control" placeholder="Nombre" name="q" id='q' value="<?php echo $_GET['id'] ?>" onkeyup="load(1);">
              <span class="input-group-btn">
                <button type="button" class="btn btn-info btn-lg btn-flat" onclick='load(1);'><i class='fa fa-refresh'></i></button>
              </span>
            </div>
          </div>
          <div class="col-xs-1">
            <div id="loader" class="text-center"></div>
          </div>
          <!-- <div class="col-md-offset-10"> -->
          <div class=" pull-right">
            <button type="button" class="btn btn-info" onclick='load(1);'><i class='fa fa-refresh'></i></button>
            <!-- <a class="btn btn-primary" href="history/create"><i class='fa fa-plus'></i> Nuevo</a> -->
            <div class="btn-group">
              <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                Mostrar <span class="caret"></span>
              </button>
              <ul class="dropdown-menu pull-right" role="menu">
                <li class='active' onclick='per_page(15);' id='15'><a href="cliente/history/<?php echo intval($_GET['id']) ?>#">15</a></li>
                <li  onclick='per_page(25);' id='25'><a href="cliente/history/<?php echo intval($_GET['id']) ?>#">25</a></li>
                <li onclick='per_page(50);' id='50'><a href="cliente/history/<?php echo intval($_GET['id']) ?>#">50</a></li>
                <li onclick='per_page(100);' id='100'><a href="cliente/history/<?php echo intval($_GET['id']) ?>#">100</a></li>
                <li onclick='per_page(1000000);' id='1000000'><a href="cliente/history/<?php echo intval($_GET['id']) ?>#">Todos</a></li>
              </ul>
            </div>
            <input type='hidden' id='per_page' value='15'>
          </div>
        </div>
        <!-- <div class="col-xs-3"></div> -->
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="panel panel-default">
          <div class="panel-heading">
            Pagos:
          </div>
          <div class="panel-body">            
            <div class=" table-responsive">
              <div class="outer_div"></div><!-- Datos ajax Final -->  
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
</div><!-- /.content-wrapper -->


<script>
  $(function() {
    load(1);
  });
  function load(page){
      var query=$("#q").val();
      var per_page=$("#per_page").val();
      var parametros = {"page":page,'query':query,'per_page':per_page};
      //$.get("./?action=loadexpenses",parametros,function(data){
      $.get({
        url:"./?action=cliente&type=history",
        data:parametros,
        beforeSend: function(data){
          $("#loader").html("<img src='res/images/ajax-loader.gif'>");
        },
        //console.log(data);
        success:function(data){
          $(".outer_div").html(data);
          $("#loader").html("");
        }

      });
  }
  function per_page(valor){
    $("#per_page").val(valor);
    load(1);
    $('.dropdown-menu li' ).removeClass( "active" );
    $("#"+valor).addClass( "active" );
  }
</script>
<script>
  function eliminar(id){
    if(confirm('Esta acción  eliminará de forma permanente el registro \n\n Desea continuar?')){
      var page=1;
      var query=$("#q").val();
      var per_page=$("#per_page").val();
      var parametros = {"page":page,"query":query,"per_page":per_page,"id":id};
      
      $.get({
        // method: "GET",
        url:'./?action=cliente&type=history',
        data: parametros,
        beforeSend: function(objeto){
        $("#loader").html("<img src='res/images/ajax-loader.gif'>");
        },
        success:function(data){
          $(".outer_div").html(data).fadeIn('slow');
          $("#loader").html("");
          window.setTimeout(function() {
          $(".alert").fadeTo(500, 0).slideUp(500, function(){
          $(this).remove();});}, 5000);
        }
      })
    }
  }
</script>