<?php 
include_once('../../../php/sessionStart.php'); 
include_once('../../../php/db/dbExec.php');
include_once('../../../php/timezone.php');

$empCod = $_SESSION['empCod'];

# QUERYS
$sBancos = "SELECT *, TRIM(ban_nom) as ban_nom FROM bancos WHERE ban_emp='$empCod'";
$sTipopol = "SELECT * FROM tipopol WHERE tp_bansn='S'";

# EJECUCION DE QUERYS
$db = new dbExec();
$select["bancos"] = $db->query($sBancos);
$select["tipopol"] = $db->query($sTipopol);
$db->close();
?>
<?php include_once('../includes/htmlOpen.php'); ?>
    <main class="main" style="">
      <?php 
        $li[0] = '<i class="fas fa-archive"></i>';
        $li[1] = $_GET["opcNom"];
        include_once('../../../php/includes/ol.php');

        $modalImp = "modalImp";
        include_once('../../../php/includes/modalImp.php');
      ?>

      <!-- MODAL CONCILIAR -->
      <div class="modal fade" id="modalConci" tabindex="-1" role="dialog" aria-labelledby="modalConTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable modal-xl" role="document">
          <div class="modal-content bg-light">
            <div class="modal-header">
              <ul class="nav nav-pills mb-1" id="pills-tab" role="tablist">
                <li class="nav-item">
                  <a class="nav-link active" id="pills-00-tab" data-toggle="pill" href="#pills-00" role="tab" aria-controls="pills-00" aria-selected="true">Conciliar Documentos</a>
                </li>
              </ul>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span class="text-dark" aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
              <div class="tab-content bg-transparent border-2" id="pills-tabContent">
                <div class="tab-pane fade show active" id="pills-00" role="tabpanel" aria-labelledby="pills-00-tab">

                  <form action="" name="" autocomplete="off" enctype="multipart/form-data">
                    <div class="form-row">
                      <div class="col-12 col-sm-10">
                        <div class="form-group">
                          <div class="form-row">
                            <div class="col-md-12">
                              <div class="table-responsive">
                                <table class="table table-hover table-bordered table-dark table-xs" id="tblMa">
                                  <thead>
                                    <tr>
                                      <th scope="col" class="text-center">NÚMERO</th>
                                      <th scope="col" class="text-center" width="35">FEC/DOCTO.</th>
                                      <th scope="col" class="text-center">BENEFICIARIO</th>
                                      <th scope="col" class="text-center" style="min-width:75px">DEBE</th>
                                      <th scope="col" class="text-center" style="min-width:75px">HABER</th>
                                      <th scope="col" class="text-center">CAMBIAR STATUS</th>
                                    </tr>
                                  </thead>
                                  <tbody>
                                  </tbody>
                                </table>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                      <div class="col-12 col-lg-3 col-xl-2 text-left mt-5">
                        <div class="form-group position-fixed-lg w-lg-3 w-xl-2">
                          <div class="form-row">
                            <div class="col-10 mt-2">
                              <button class="btn btn-warning btn-block" id="btnProcesar" type="button">Procesar Status</button>
                            </div>
                          </div>
                          <div class="form-row">
                            <div class="col-10 mt-2">
                              <button class="btn btn-success btn-md btn-block" id="btnCancelar" type="button">Cancelar Cambio</button>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </form>

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


      <div class="container-as">
        <div class="row">
          <div class="col">
            <ul class="nav nav-pills mb-1" id="pills-tab" role="tablist">
              <li class="nav-item">
                <a class="nav-link active" id="pills-0-tab" data-toggle="pill" href="#pills-0" role="tab" aria-controls="pills-0" aria-selected="true">Conciliar Documentos</a>
              </li>
            </ul>
            <div class="tab-content bg-transparent border-0" id="pills-tabContent">
              <div class="tab-pane fade show active" id="pills-0" role="tabpanel" aria-labelledby="pills-0-tab">
                
                <form action="" name="thisform" autocomplete="off" enctype="multipart/form-data">
                  <div class="form-group">

                    <div class="form-row">
                      <div class="col-md-4">
                        <label for="selTipo" class="font-size-lg">Seleccione Cuenta Bancaria</label>
                          <select class="form-control form-control-sm form-control-as font-size-lg" name="selBan" id="selBan">
                            <?php
                              while ($rec = $db->fetchAssoc($select['bancos'])) {
                                echo  '<option value="'.$rec['ban_num'].'" data-ctab="'.$rec['ban_ctab'].'">'.utf8_encode($rec['ban_nom']).'</option>';
                              }
                            ?>
                          </select>
                      </div>
                      <div class="col-md-4">
                        <label for="selTipo" class="font-size-lg">Tipo Documento</label>
                        <select class="form-control form-control-sm form-control-as font-size-lg" name="selTipo" id="selTipo">
                          <?php
                            while ($rec = $db->fetchAssoc($select['tipopol'])) {
                              echo  '<option value="'.$rec['tp_cod'].'" data-deha="'.$rec['tp_deha'].'">'.utf8_encode($rec['tp_nom']).'</option>';
                            }
                          ?>
                        </select>
                      </div>
                    </div>

                    <div class="form-row">
                      <div class="col-4">
                        <label for="dtFecI" class="font-size-lg">Fecha Inicial:</label>
                        <input type="date" class="form-control form-control-as" id="dtFecI" placeholder="">
                      </div>
                      <div class="col-4">
                        <label for="dtFecF" class="font-size-lg">Fecha Final: </label>
                        <input type="date" class="form-control form-control-as" id="dtFecF" placeholder="">
                      </div>
                    </div>
                    <div class="form-row">
                      <div class="col-6">
                        <label class="pr-1"></label><br>
                        <div class="custom-control custom-radio custom-control-inline">
                          <input type="radio" id="crCP1" name="crCP" class="custom-control-input" value="C">
                          <label class="custom-control-label" for="crCP1">Circulación</label>
                        </div>
                        <div class="custom-control custom-radio custom-control-inline">
                          <input type="radio" id="crCP2" name="crCP" class="custom-control-input" value="P">
                          <label class="custom-control-label" for="crCP2">Pagados</label>
                        </div>
                      </div>
                    </div>
                  </div>

                  <h3 class="text-light"></h3>

                  <div class="form-group">
                    <div class="form-row">
                      <div class="form-group col-2">
                      </div>
                      <div class="form-group col-4">
                        <button class="btn btn-primary btn-lg btn-block" id="btnConciliar" type="button">Conciliar</button>
                      </div>
                  </div>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </main>
<?php include_once('../../../php/includes/htmlClose.php'); ?>

<script>
  const dtFecI = document.thisform.dtFecI;
  const dtFecF = document.thisform.dtFecF;
  const selBanCod = document.thisform.selBan;
  const selTipoCod = document.thisform.selTipo;
  const crCP = document.thisform.crCP;


  function addRowPol(numd, fecd, bened, debe, haber,l){
    const row = "<tr>"
                +"<td id='datanumd' class='text-left'>"+numd+"</td>"
                +"<td id='datafecd'>"+YMDToDMY(fecd)+"</td>"
                +"<td id='databened' class='text-left'>"+bened+"</td>"
                +"<td id='datadebe' class='text-right'>"+debe+"</td>"
                +"<td id='dataHaber' class='text-right'>"+haber+"</td>"
                +"<td class='text-center'>"
                  +"<div class='custom-control custom-checkbox'>"
                  +"<input type='checkbox' class='custom-control-input' id='dataCheck"+l+"' name='cb'>"
                  +"<label class='custom-control-label mt-0' for='dataCheck"+l+"'></label>"
                  +"</div>"
                +"</td>"
                +"</tr>";
    $("#tblMa tbody").append(row);
  }


  $(document).ready(function() {
    $(this).find('select:visible:first').focus();
    dtFecI.value = dateToday();
    dtFecF.value = dateToday();
    selTipo.value ="004";
    crCP1.checked = true;
    crCP2.checked = false;
    
    // SUBMIT FORM
    $('form').submit(function() {
      return false;
    });

    // CLICK CONCILIAR
    $("#btnConciliar").click(function (){

      tblClear("tblMa");

      const parametros = new FormData();
      parametros.append("action", "consultar");

      parametros.append("selTipoCod", selTipo.value);
      parametros.append("selBanCod", selBan.value);
      parametros.append("dtFecI", dtFecI.value);
      parametros.append("dtFecF", dtFecF.value);
      parametros.append("crCP", crCP.value);


      $.ajax({
        data:  parametros,
        url:   window.location.origin+window.location.pathname+"actions.php",
        type:  "post",
        contentType: false,
        processData: false,
        success: function (jsonPhp) {
          const jsonJS = JSON.parse(jsonPhp);

          if(jsonJS.error == true){
            alError(jsonJS);
          } else {
            if (jsonJS.mov_acu === null) {
              nuevo = true;
            } else {
              jsonJS.mov_acu.forEach(function(i,index){
               addRowPol(i.ma_num, i.ma_fec, i.ma_bene, i.ma_debe, i.ma_haber,index);
              });  
              nuevo = false;
              $('#modalConci').modal('toggle');
            }
          }
        }
      });
    });

    // PROCESAR CONCILIACION
    $("#btnProcesar").click(function (){

      colMova = ["numero", "fecha", "bene", "debe", "haber", "check"];

      const parametros = new FormData();
      parametros.append("action", "procesar");

      parametros.append("selTipoCod", selTipo.value);
      parametros.append("selBanCod", selBan.value);
      parametros.append("dtFecI", dtFecI.value);
      parametros.append("dtFecF", dtFecF.value);
      parametros.append("crCP", crCP.value);
      parametros.append("tblMa", tblToJsonCbSkip(colMova, "tblMa", 10, 5));

      $.ajax({
        data:  parametros,
        url:   window.location.origin+window.location.pathname+"actions.php",
        type:  "post",
        contentType: false,
        processData: false,
        success: function (jsonPhp) {
          console.log(jsonPhp);
          const jsonJS = JSON.parse(jsonPhp);

          if(jsonJS.error == true){
            alError(jsonJS);
          } else {
            $('#modalConci').modal('toggle');
          }
        }
      });
    });

    // CLICK CANCELAR
    $("#btnCancelar").click(function (){
      $('#modalConci').modal('toggle');
    });

  });

 


</script>