@extends('layouts.admin')
@section('estilos')
<link href="{{ asset('assets/css/bootstrap-datepicker3.min.css') }}" rel="stylesheet">
<link href="{{ asset('assets/css/bootstrap-clockpicker.min.css') }}" rel="stylesheet">
<style media="screen">
  #tbcmps th, #tbcmps tr{text-align:center;}
</style>
@endsection
@section('contenido')
<!--Modal cancelar complemento-->
<div class="modal fade modal-slide-in-right" aria-hidden="true" role="dialog" tabindex="-1" id="modal-cancelar-complemento">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Cancelar complemento</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">×</span>
        </button>
      </div>
      {!!Form::open(array('autocomplete'=>'off','id'=>'form-cancelarc', 'enctype'=>'multipart/form-data','method'=>'DELETE','url'=>'complementos'))!!}
      <div class="modal-body">
        <input type="hidden" name="idcom" id="idcomcanc" value="">
        <div class="form-group">
          <label>Motivo</label>
          <select name="motivo" id="motivoc" class="form-control" required>
            <option value="01">[01] Comprobantes emitidos con errores con relación.</option>
            <option value="02">[02] Comprobantes emitidos con errores sin relación.</option>
            <option value="03">[03] No se llevó a cabo la operación.</option>
            <option value="04">[04] Operación nominativa relacionada en una factura global.</option>
          </select>
        </div>
        <div class="form-group">
          <label>Folio con el cual se reemplaza:</label>&nbsp;&nbsp;
          <label class="badge badge-warning">UUID del documento que lo sustituye</label>
          <input type="text" class="form-control" name="sustitucion" id="sustitucionc" required/>
        </div>
      </div>
      <div class="modal-footer m-t-10">
        <button class="btn btn-danger" id="btncncl8" data-dismiss="modal" type="reset"><i class="fa fa-close"></i>&nbsp;Cerrar</button>
        <button class="btn btn-info" id="btnsbmt8" type="submit"><i class="fa fa-check"></i>&nbsp;Aceptar</button>
      </div>
      {!!Form::close()!!}
    </div>
  </div>
</div>

<!--Modal visualizar un pdf-->
<div class="modal fade" id="modal-pdf" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog modal-lg" style="text-align:center" role="document">
    <div class="modal-content" style="background:#0000">
      <embed src="" type="application/pdf" class="col-xs-12" height="600" id="vpdf"></embed>
      <div class="modal-footer">
        <button class="btn btn-primary btn-xs" type="button" data-dismiss="modal">Cerrar</button>
      </div>
    </div>
  </div>
</div>

<!--Modal enviar por correo electrónico-->
<div class="modal fade modal-slide-in-right" aria-hidden="true" role="dialog" tabindex="-1" id="modal-send">
  <div class="modal-dialog">
    <div class="modal-content">
			<div class="modal-header">
        <h4 class="modal-title">Enviar factura por E-mail</h4>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">×</span>
        </button>
			</div>
			<div class="modal-body">
        {!!Form::open(array('autocomplete'=>'off','id'=>'form-send', 'enctype'=>'multipart/form-data', 'method'=>'PATCH'))!!}
        <input type="hidden" name="idsend" id="idsend" value="">
        <div class="col-sm-12">
          <div class="input-group">
            <span class="input-group-addon">Nombre responder a: </span>
            <input type="text" class="form-control" onkeypress="return numerosyletras(event)" name="nombre" value="{{Session::get('nombre')}}" placeholder="Nombre del remitente">
          </div><br>
          <div class="input-group">
            <span class="input-group-addon">Correo responder a: </span>
            <input type="text" class="form-control" onkeypress="return validacorreo(event)" name="remit" value="{{Session::get('email')}}" placeholder="ejemplo@mail.com">
          </div><br>
          <div class="input-group">
            <span class="input-group-addon">Correo destinatario: </span>
            <input type="text" class="form-control" onkeypress="return validacorreo(event)" name="desti" value="" placeholder="ejemplo@mail.com">
          </div><br>
        </div>
        <div class="modal-footer">
          <button class="btn btn-danger" data-dismiss="modal" type="reset"><i class="fa fa-close"></i>&nbsp;Cerrar</button>
          <button class="btn btn-info" type="submit"><i class="fas fa-envelope"></i>&nbsp;Enviar correo</button>
        </div>
        {!!Form::close()!!}
      </div>
    </div>
  </div>
</div>

<section>
  <div class="col-sm-12 border scrollx" id="tbFacts"></div>
</section>
@endsection
@section('script')
<script src="{{ asset('assets/plugins/bootstrap-clockpicker.min.js') }}"></script>
<script src="{{ asset('assets/plugins/bootstrap-datepicker.min.js') }}"></script>
<script src="{{ asset('assets/plugins/bootstrap-datepicker.es.min.js') }}"></script>
<script type="text/javascript">
  $('.clockpicker').clockpicker();
  $('.fecha').datepicker({
    autoclose: true,
    format: 'yyyy-mm-dd',
    language:'es',
    orientation: "bottom auto"
  });
  $(document).ready(function(){
    facs = ;
    llenartabla(facs, "#tbFacts");
  });
  function showpdff(pdf){
    $('#vpdf').attr('src',url+'fac/{{Session::get('rfc')}}/'+pdf);
    $('#modal-pdf').modal('show');
  }
  function llenartabla(dat, tabla){
    var tab = '<table class="table table-bordered table-striped" id="tabFacturas">'+
                '<thead>'+
                  '<th>Receptor</th>'+
                  '<th>Folio</th>'+
                  '<th>Fecha</th>'+
                  '<th>Fecha de pago</th>'+
                  '<th>Total depósito</th>'+
                  '<th class="col-sm-1">Estado</th>'+
                  '<th class="col-sm-1">Opciones</th>'+
                '</thead>'+
              '<tbody>';
    for (fac in dat) {
      opciones = '&nbsp;<i class="far fa-file-pdf" onclick="showpdff(\''+dat[fac].fcmp_pdf+'\')" title="Ver PDF"></i>&nbsp;';
      opciones += '&nbsp;<a href="{{URL::to('/')}}/fac/{{Session::get('rfc')}}/'+dat[fac].fcmp_xml+'" download target="_blank"><i class="far fa-file-code" title="Descargar archivo XML"></i></a>&nbsp;';
      opciones += '&nbsp;<i class="far fa-envelope" onclick="sendmail('+dat[fac].fcmp_id+')" title="Enviar PDF por e-mail"></i>&nbsp;';
      if (dat[fac].fcmp_cancelado == 1)
        var estado = "<label class='label label-danger col-xs-12' style='font-size:15px'>CANCELADO</label>";
      else{
        opciones += '&nbsp;<i style="color:red;" title="Cancelar complemento de pago" class="fas fa-times-circle" onclick="delcomp('+dat[fac].fcmp_id+')"></i>&nbsp;';
        var estado = "<label class='label label-success col-xs-12' style='font-size:15px'>ACTIVO</label>";
      }

      tab +='<tr>'+
              '<td>'+dat[fac].pros_nombre+'</td>'+
              '<td>'+dat[fac].factura+'</td>'+
              '<td>'+dat[fac].fcmp_fecha+'</td>'+
              '<td>'+dat[fac].fcmp_fechaPago+'</td>'+
              '<td>$ '+dat[fac].fcmp_totalDeposito+'</td>'+
              '<td>'+estado+'</td>'+
              '<td>'+opciones+'</td>'+
            '</tr>';
    }
    tab +='</tbody></table><script>var table = tableData("tabFacturas");<\/script>';
    $(tabla).html(" ");
    $(tabla).append(tab);
  }

  function sendmail(id){
    $('#idsend').val(id)
    $('#modal-send').modal('show');
  }

  $('#form-send').submit( function(event){
    event.preventDefault();
    var formData = new FormData($(this)[0]);
    $.ajax({
      url:url+'complementos/'+$('#idsend').val(),
      type:'POST',
      data:formData,
      cache:false,
      processData: false,
      contentType: false,
      success:function(data){
        var r = JSON.parse(data);
        console.log(r);
        if (r.success) alerta('Exito!',r.msg,'success','Aceptar');
        else alerta('Error!',r.msg,'error','Aceptar');

        setTimeout(function () {
          $('#modal-send').modal('hide');
          swal.close();
        }, 1500);
      },
      error:function(){
        alerta('Error','Hubo un error al conectar con el servicio REST!','error','Aceptar');
        setTimeout(function () {
          $('#modal-send').modal('hide');
          swal.close();
        }, 1500);
      }
    });
  });

  function delcomp(id){
    const liga = url + 'complementos/' + id;
    $("#idcomcanc").val(id);
    $("#form-cancelarc").attr('action',liga);
    $("#modal-cancelar-complemento").modal("show");
  }

  $(document).on("change", "#motivoc", function() {
    const op = $(this).val();
    if (op == "01") {
      $("#sustitucionc").prop("disabled",null);
      $("#sustitucionc").prop("required","required");
    } else {
      $("#sustitucionc").prop("disabled","disabled");
      $("#sustitucionc").prop("required",null);
    }
  });

  $("#form-cancelarc").submit( function(event) {
    event.preventDefault();
    DescButtons(8);
    var formData = new FormData($(this)[0]);
    const destino = $(this).attr('action');
    $.ajax({
      url:destino,
      type:'POST',
      data:formData,
      cache:false,
      processData: false,
      contentType: false,
      success: function(response){
        alerta(response.title,response.msg,response.class,'Aceptar');
      },
      error: function(){ alerta('Error','Hubo un error al conectar con el servidor','error','Aceptar'); },
      complete: function() {
        setTimeout(function () {
          ActButtons(8);
          $("#modal-cancelar-complemento").modal("hide");
          swal.close();
        }, 1500);
      }
    });
  });

</script>
@endsection