@extends('fragments.fullTemplate')
@php
    $id_usuario = session('id_usuario');
    if (! session('id_usuario')) {
            header('location: /');
            die();
    }
@endphp
@section('contenido')
    <div class="ui big breadcrumb">
        <div class="section">Administración</div>
        <i class="right chevron icon divider"></i>
        <div class="section">Facturación</div>
        <i class="right chevron icon divider"></i>
        <div class="section">Clientes</div>
        <i class="right chevron icon divider"></i>
        <div class="active section">Facturas e Informes</div>
    </div>
    
    <div class="ui divider"></div>
    <div data-module-notifications-anchor></div>

    <div class="content">
        <div class="col-lg-12 col-md-12 col-sm-12">
            @if(session()->has('success'))
                <div class="alert alert-success text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('success') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if(session()->has('warning'))
                <div class="alert alert-warning text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('warning') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if(session()->has('error'))
                <div class="alert alert-danger text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('error') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if(session()->has('danger'))
                <div class="alert alert-danger text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('danger') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if (count($errors) > 0)
            <div class="alert alert-danger alert-dismissible" role="alert">
                <strong>¡Error!</strong> Revise los campos obligatorios.<br><br>
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <ul>
                @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
                @endforeach
                </ul>
            </div>
            @endif
        </div>
    </div>
    
    <div class="form-group row">
        <div class="form-group col-md-6">
            <p><strong>DATOS PARA FACTURAR</strong></p>
            <p><strong>Empresa:</strong> {{$datos_cliente_factura->nombre_empresa}} </p>
            <p><strong>RFC:</strong> {{$datos_cliente_factura->rfc}}</p>
            <p><strong>Domicilio:</strong>
                {{$datos_cliente_factura->direccion}}
            </p>
        </div>
        <div class="form-group col-md-6">
            <p>
                <a class="btn btn btn-outline-info btn-block" data-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">
                    <i class="address book icon"></i>Contactos
                </a>
            </p>

            <div class="collapse" id="collapseExample">
                <table class="ui celled table unstackable small">
                    <thead>
                        <th>Nombre</th>
                        <th>E-mail</th>
                        <th>Teléfono</th>
                        <th>Extensión</th>
                        <th>Celular</th>
                    </thead>
                    <tbody>
                        @foreach ($contactos as $dato_contacto)
                        <tr>
                            <td>{{$dato_contacto->nombre_contacto}}</td>
                            <td>{{$dato_contacto->correo}}</td>
                            <td>{{($dato_contacto->telefono != "null") ? $dato_contacto->telefono : ""}}</td>
                            <td>{{($dato_contacto->extension != "null") ? $dato_contacto->extension : ""}}</td>
                            <td>{{($dato_contacto->celular != "null") ? $dato_contacto->celular : ""}}</td>
                        </tr> 
                        @endforeach
                        
                    </tbody>
                </table>
            </div>
        </div>
    </div> 

    <div class="ui grid">
        <div class="six wide column">
            <a class="ui button fluid primary inverted" id="create_comprobante_wizzard">
                <i class="pencil alternate icon"></i> Nueva Factura
            </a>
        </div>
        <div class="six wide column">
            <a class="ui green inverted fluid button" id="create_complemento">
                <i class="file icon"></i> Nuevo complemento de pago
            </a>
        </div>
        <div class="four wide column">
            <a class="ui secondary inverted fluid button send_mail_servicio_cliente_modal">
                <i class="envelope icon"></i> Enviar correo
            </a>
        </div>
    </div>
    <div class="sx-autorender mt-3">
        <div class="sx-scroll-x">
            <table id="tabla_facturas_informes" class="ui celled table unstackable">
                <thead>
                    <tr>
                        <th style="display:none;">Orden</th>
                        <th>Serie y folio</th>
                        <th>UUID</th>
                        <th>Tipo de comprobante</th>
                        <th class="collapsing">Total</th>
                        <th>Uso de CFDI</th>
                        <th>Forma de pago</th>
                        <th>Fecha</th>
                        <th class="text-center">Factura/Complemento Enviado</th>
                        <th class="text-center">Informe Enviado</th>
                        <th class="">Acciones</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($facturasOrdenadas as $factura)
                        <tr>
                            <td style="display:none;">
                                {{
                                    $factura->fecha_ordenamiento
                                        ? \Carbon\Carbon::parse($factura->fecha_ordenamiento)->timestamp
                                        : 0
                                }}
                            </td>
                            <td>{{ $factura->complemento->serie ?? '' }} - {{ $factura->complemento->concecutivo ?? '' }}</td>
                            <td>{{ $factura->complemento->uiid ?? '' }}</td>
                            <td>{{ $factura->tipo_comprobante }}</td>
                            <td class="collapsing">{{ $factura->total }}</td>
                            <td>{{ $factura->cfdi }}</td>
                            <td>{{ $factura->tipo_pago }}</td>
                            <td>{{ \Carbon\Carbon::parse($factura->fecha_ordenamiento)->format('d/m/Y H:i:s') }}</td>
                            <td class="text-center">
                                <span class="{{ $factura->documento_enviado_badge['clase'] }}">
                                    {{ $factura->documento_enviado_badge['estatus'] }}
                                    @if($factura->documento_enviado_badge['fecha'])
                                        <br>{{ $factura->documento_enviado_badge['fecha'] }}
                                    @endif
                                </span>
                            </td>

                            <td class="text-center">
                                <span class="{{ $factura->informe_enviado_badge['clase'] }}">
                                    {{ $factura->informe_enviado_badge['estatus'] }}
                                    @if($factura->informe_enviado_badge['fecha'])
                                        <br>{{ $factura->informe_enviado_badge['fecha'] }}
                                    @endif
                                </span>
                            </td>

                            <td class="collapsing">
                                <div class="ui tiny icon buttons">
                                    <a class="ui button orange"
                                    href="{{ url('facturacion_sw_cliente/'.$datos_cliente_factura->id_cliente_factura.'/detalle/'.$factura->id_factura.$factura->tipo_comprobante_clave) }}">
                                        Detalles <i class="arrow right icon"></i>
                                    </a>
                                </div>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
            
        
    @include('fragments.back', ['url' => 'facturacion_sw'])
    @include('Facturacion-sw.create_facturacion_wizzard')
    @include('Facturacion-sw.create_complemento_wizzard')
    
    <!---WIZARD--------------------->
   <style type="text/css">
    .stepwizard-step p {
        margin-top: 10px;
    }

    .stepwizard-row {
        display: table-row;
    }

    .stepwizard {
        display: table;
        width: 100%;
        position: relative;
    }

    /*.stepwizard-step button[disabled] {
        opacity: 1 !important;
        filter: alpha(opacity=100) !important;
    }**/

    .stepwizard-row:before {
        top: 14px;
        bottom: 0;
        position: absolute;
        content: " ";
        width: 100%;
        height: 1px;
        background-color: #ccc;
        z-order: 0;

    }

    .stepwizard-step {
        display: table-cell;
        text-align: center;
        position: relative;
    }

    .btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
    }
    </style> 
    <script>
        var id_cliente = 0;
        let num_complementos = 0;

        buscarFolio = (id) => {
            $.ajax({
                url:"{{ url('facturacion_sw/buscarFolio') }}",
                method:"POST",
                data:{'_token': _token = $('input[name="_token"]').val()},
                success:function(response){
                    result = JSON.parse(response); 
                    resultData = result.data;
                    console.log(`#${id} #folio:input`);
                    $(`#${id} #folio:input`).val(resultData + 1);
                    
                }
            });
        }

        $(document).ready(function(){
            $('#fechaPago').datepicker({
                format: 'yyyy-mm-dd'
            });
            $('#horaPago').datetimepicker({
                format: 'hh:mm:ss'
            });
            $('#create_comprobante_wizzard').click(function(){
                const id_modal = "create_comprobante_facturacion_wizzard";
                readButtons(id_modal);
                buscarFolio(id_modal);
                $('#create_facturacion_wizzard').modal('show'); 
            });

            $('#create_complemento').click(function(){
                const id_modal = "create_complemento_wizzard";
                readButtons(id_modal);
                buscarFolio(id_modal);
                $('#create_complemento_wizzard').modal('show');  
            });

            $('#new_complemento').click(function(){
                $('div#complementos').append(`
                    <div class="card mt-3 mb-3" id="card_${++num_complementos}">
                        <div class="card-body" id="cardbody_${num_complementos}">
                        </div>
                    </div>`
                );

                $("#cardbody_"+num_complementos).load('{{url("facturacion_sw/complemento/".$id_cliente_factura."/num")}}/'+num_complementos, function(){
                    $(".selectpicker").selectpicker();

                    $("select.complementos").off('change.complementoSaldo').on('change.complementoSaldo', function(){
                        id_factura = $(this).val();
                        num = $(this).data("num");
                        let monto = 0;

                        if (!id_factura) {
                            return;
                        }

                        $.ajax({
                            url:"{{ url('facturacion_sw/cobranza') }}",
                            method:"POST",
                            data:{
                                'id_factura': id_factura,
                                'num': num,
                                '_token': $('input[name="_token"]').val()
                            },
                            success:function(response){
                                result = JSON.parse(response);
                                resultData = result.data;

                                console.log(result);

                                $('#pagos_'+num).empty();

                                $.each(resultData.conceptos, function(key, value) {
                                    estatus = "Sin Pago";
                                    if(value['id_cobranza']){
                                        estatus = "Pagado";
                                    }

                                    $('#pagos_'+num).append(`
                                        <div class="col-12">
                                            <label>${value['num_informe']} ${estatus}</label>
                                            <input type="text" class="form-control" id="id_cobranza_${num}[]" name="id_cobranza[]" value="${value['id_cobranza']}" hidden>
                                        </div>
                                    `);
                                });

                                $("#serie_"+num).val(resultData.factura['serie']);
                                $("#folio_"+num).val(resultData.factura['concecutivo']);

                                $("#ImpPagado_"+num).attr('max', resultData.pagos.importe_saldo_insoluto);
                                $("#ImpSaldoAnt_"+num).val(parseFloat(resultData.pagos.importe_saldo_insoluto).toFixed(2));
                                $("#ImpSaldoInsoluto_"+num).val(parseFloat(resultData.pagos.importe_saldo_insoluto).toFixed(2));

                                if (parseFloat(resultData.pagos.importe_saldo_insoluto) === 0) {
                                    $("#ImpPagado_"+num).prop('disabled', true);
                                } else {
                                    $("#ImpPagado_"+num).prop('disabled', false);
                                }
                            }
                        });
                    });

                    // Calcular saldo si el select ya trae una factura seleccionada.
                    if ($("#complemento_"+num_complementos).val()) {
                        $("#complemento_"+num_complementos).trigger('change');
                    }
                });
            });

            $(document).off('keyup', '.pagados').on('keyup', '.pagados', function () {
                let monto = 0;
                let num = $(this).data('num');

                $(".pagados").each(function() {
                    if ($.isNumeric($(this).val())) {
                        monto += parseFloat($(this).val());
                    }
                });

                let saldoAnterior = parseFloat($('#ImpSaldoAnt_'+num).val()) || 0;
                let pagoActual = parseFloat($(this).val()) || 0;
                let calculo_saldo_insoluto = saldoAnterior - pagoActual;

                if (calculo_saldo_insoluto >= 0) {
                    $("#ImpSaldoInsoluto_"+num).val(calculo_saldo_insoluto.toFixed(2));
                } else {
                    $("#ImpSaldoInsoluto_"+num).val("0.00");
                }

                $("#Monto").val(monto.toFixed(2));
            });

            
        });

        readButtons = function(type_accion){
            let navListItems = $('div#'+type_accion+' div.setup-panel div a'),
            allWells = $('div#'+type_accion+' .setup-content'),
            allNextBtn = $('div#'+type_accion+' .nextBtn');
            allBackBtn = $('div#'+type_accion+' .backBtn');

            navListItems.click(function (e) {
                e.preventDefault();
                var $target = $($(this).attr('href')),
                    $item = $(this);

                if (!$item.hasClass('disabled')) {
                    navListItems.removeClass('btn-primary').addClass('btn-default');
                    $item.addClass('btn-primary').removeClass('disabled');
                    allWells.hide();
                    $target.show();
                    //$target.find('input:eq(0)').focus();
                }
            });

            allNextBtn.click(function(){
                var curStep = $(this).closest("div#"+type_accion+" .setup-content"),
                    curStepBtn = curStep.attr("id"),
                    nextStepWizard = $('div#'+type_accion+' div.setup-panel div a[href="#' + curStepBtn + '"]').parent().next().children("a"),
                    curInputs = curStep.find("input[type='text'],input[type='url']"),
                    isValid = true;

                $(".form-group").removeClass("has-error");
                    navListItems.addClass('disabled');
                    nextStepWizard.removeAttr('disabled').removeClass('disabled').trigger('click');
            });

            allBackBtn.click(function(){
                var curStep = $(this).closest("div#"+type_accion+" .setup-content"),
                    curStepBtn = curStep.attr("id"),
                    nextStepWizard = $('div#'+type_accion+' div.setup-panel div a[href="#' + curStepBtn + '"]').parent().prev().children("a"),
                    curInputs = curStep.find("input[type='text'],input[type='url']"),
                    isValid = true;

                $(".form-group").removeClass("has-error");
                    navListItems.addClass('disabled');
                    nextStepWizard.removeAttr('disabled').removeClass('disabled').trigger('click');
            });

            $('div.setup-panel div a.btn-primary').trigger('click'); 
        } 
    </script>
    <script>
        let subtotal = 0;
        let descuento = 0;
        let total = 0;
        let total_total = 0;
        let iva = 0;
        $(document).ready(function(){
            $('#facturar').change(function(){
                let id_concepto = $(this).val();
                $.ajax({
                    url:"{{ url('facturacion_sw/consultaInforme') }}",
                    method:"POST",
                    data:{'id_concepto': id_concepto, '_token': _token = $('input[name="_token"]').val()},
                    success:function(response){
                        result = JSON.parse(response); 
                        resultData = result.data;
                        let html = '';
                        $.each(resultData.partidas, function(key, concepto) {
                           html+=`
                                    <tr class="">
                                    <td class="">{{--$recibo->reporte->tipo_pago--}}${concepto.reporte.tipo_pago}</td>
                                    <td class="">{{--$recibo->estatus--}}${concepto.reporte.recibo_muestra.estatus}</td>
                                    <td class="">{{--$concepto->num_informe--}}${concepto.num_informe}</td>
                                    <td class="">{{--$concepto->producto--}}${concepto.producto}</td>
                                    <td class="">{{--$concepto->marca--}}${concepto.marca}</td>
                                    <td class="">{{--$concepto->modelo--}}${concepto.modelo}</td>
                                    <td class="collapsing">{{--$concepto->servicio--}}${concepto.servicio}</td>
                                    <td class=""><input type="text" class="form-control" id="comentario_${concepto.id_servicio_cliente_concepto}" name="comentario_${concepto.id_servicio_cliente_concepto}" placeholder="Referencia" maxlength="150"></td>
                                    <td class="collapsing">$ {{--$concepto->precio_unitario--}}${concepto.precio_unitario}</td>
                                    <td class="collapsing">$ {{--($concepto->descuento_activo?($concepto->precio_unitario - ($concepto->precio_unitario*($concepto->descuento / 100))):$concepto->precio_unitario)--}}${concepto.subtotal}</td>
                                    <td class="collapsing">$ {{--($concepto->descuento_activo?(($concepto->precio_unitario - ($concepto->precio_unitario*($concepto->descuento / 100))) * .16):($concepto->precio_unitario * .16))--}}${concepto.iva}</td>
                                    </tr>`
                            
                        });
                        $('table#breakdown tbody').html(html);
                        $('#subTotal').val(resultData.totales.subtotal);
                        $('#iva').val(resultData.totales.iva);
                        $('#total1').val(resultData.totales.total1);
                        $('#total').val(resultData.totales.subtotal);

                    }
                });
            });

            $("#selectAll").click(function() {
                if($(this).prop('checked')){
                    subtotal = 0;
                    descuento = 0;
                    iva = 0;
                    total = 0;
                    $("input.facturar").each(function (index, val) {
                        suma_subtotal($(val).data('precio'), $(val).data('descuento'), $(this).data('iva'));
                    });
                    $(".facturar").prop("checked", true);
                    
                }else{
                    $("input.facturar").each(function (index, val) {
                        if($(val).prop('checked')){
                            resta_subtotal($(val).data('precio'), $(val).data('descuento'), $(this).data('iva'));
                        }
                    });
                    $(".facturar").prop("checked", false);
                }
            });

            $("#relacion").click(function() {
                if($(this).prop('checked')){
                    //console.log("Hola");
                    $('div#relacion').load('{{url("facturacion/relacion/".$id_cliente_factura)}}', function(){
                        $(".selectpicker").selectpicker();
                    });
                }else{
                    $('div#relacion').empty();
                    console.log("Adios");
                }
            });

            $("#metodoDePago").change(function(){
                metodoDePago = $(this).val();
                if(metodoDePago == "PPD"){
                    $("#formaDePago").val(99);
                    $('.selectpicker#formaDePago').selectpicker('refresh');
                }
            });

            $("#tipoDeComprobante").change(function(){
                tipoDeComprobante = $(this).val();
                if(tipoDeComprobante === "P"){
                    $('.facturar').prop('disabled', true);
                }else{
                    $('.facturar').prop('disabled', false);
                }
            });

            $("#moneda").change(function(){
                moneda = $(this).val();
                if(moneda == "MXN"){
                    $("#info_tipo_cambio_banxico").hide();
                    $("#tipo_cambio").val(1);
                }else if(moneda == "USD"){
                    let cambio_dls = {{ $tipo_de_cambio['valor'] }};
                    cambio_dls = parseFloat(cambio_dls).toFixed(2);
                    $("#tipo_cambio").val(cambio_dls);
                    $("#info_tipo_cambio_banxico").show();
                    $("#tipo_cambio_url").text("{{ $tipo_de_cambio['url'] }}");
                    $("#tipo_cambio_fecha").text("{{ $tipo_de_cambio['fecha'] }}");
                }
            });
        });

        var suma_subtotal = function(precio, porcentaje, iva_unitario){
            subtotal+= parseFloat(precio);
            descuento+= parseFloat(precio) * (parseFloat(porcentaje)/100);
            iva = dividir(multiplicar(iva) + multiplicar(iva_unitario));
            total = subtotal - descuento;
            total_total = dividir(multiplicar(subtotal) + multiplicar(iva));
            show_valores();
        }

        var resta_subtotal = function(precio, porcentaje, iva_unitario){
            subtotal-= parseFloat(precio);
            descuento-= parseFloat(precio) * (parseFloat(porcentaje)/100);
            iva = dividir(multiplicar(iva) - multiplicar(iva_unitario));
            total = subtotal - descuento;
            total_total = dividir(multiplicar(subtotal) + multiplicar(iva));
            show_valores();
        }

        var show_valores = function(){
            $('#subTotal').val(subtotal);
            $('#descuento').val(descuento);
            $('#iva').val(iva);
            $('#total').val(total);
            $('#total1').val(total_total);
        }

        function multiplicar(a){
            return a*1000;
        }

        function dividir(a){
            return a/1000;
        }

        
    </script>

@include('Facturacion-sw.Recorts.send_mail_modal')
<script>
    $(document).ready(function(){
       
        $(document).on('click','.send_mail_servicio_cliente_modal',function(){
    
            $('#send_mail_servicio_cliente_modal').modal('show'); 
        });
        let cc = $('.copia').toArray().length;
        let para = $(".para").toArray().length;;
        console.log(para);
        $("#enter-mail-id-cc").keydown(function (e) {
        if (e.keyCode == 13 || e.keyCode == 32) {
            //alert('You Press enter');
            var getValue = $(this).val();
            
            if ((/^([\da-z_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/).test(getValue.trim())){
                $('.all-mail-cc').append('<div class="input-group mb-1 col-6">'+ 
                                            '<input class="form-control form-control-sm disabled" type="email" id="copia_'+(++cc)+'" name="copia[]" value="'+getValue+'">'+
                                            '<div class="input-group-append">'+
                                                '<button class="btn btn-outline-danger btn-sm cancel-email" type="button">X</button>'+
                                            '</div>'+
                                        '</div>');
                $(this).val('');
            } else {
                alert("La dirección de email es incorrecta.");
            }
            
        }
        });

        $("#enter-mail-id-para").keydown(function (e) {
        if (e.keyCode == 13 || e.keyCode == 32) {
            //alert('You Press enter');
            var getValue = $(this).val();
            if ((/^([\da-z_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/).test(getValue.trim())){
                $('.all-mail-para').append('<div class="input-group mb-1 col-6">'+ 
                                                '<input class="form-control form-control-sm para disabled" type="email" id="para_opcional_'+(++para)+'" name="para_opcional[]" value="'+getValue+'">'+
                                                '<div class="input-group-append">'+
                                                    '<button class="btn btn-outline-danger btn-sm cancel-email" type="button">X</button>'+
                                                '</div>'+
                                            '</div>');
                $(this).val('');
            }else{
                alert("La dirección de email es incorrecta.");
            }
        }
        });

        $(document).on('click','.cancel-email',function(){
            cc--;
            $(this).parent().parent().remove();
        });

        $('.summernote').summernote({
            placeholder: 'Mensaje',
            tabsize: 1,
            height: 150,
            toolbar: [
                ['style', ['bold', 'italic', 'underline']],
                ['font', ['strikethrough', 'superscript', 'subscript']],
                ['color', ['color']],
                ['para', ['ul', 'ol', 'paragraph']],
                ['table', ['table']],
                ['view', ['fullscreen']]
            ]
        });
        
    });
</script>
<script>
    $(document).ready(function () {
        if ($.fn.DataTable && !$.fn.DataTable.isDataTable('#tabla_facturas_informes')) {
            $('#tabla_facturas_informes').DataTable({
                pageLength: 10,
                lengthMenu: [[10, 25, 50, 100, -1], [10, 25, 50, 100, "Todos"]],
                ordering: true,
                searching: true,
                paging: true,
                info: true,
                autoWidth: false,
                order: [[0, 'desc']], // orden real correcto
                columnDefs: [
                    { targets: 0, visible: false, searchable: false }
                ],
                language: {
                    sProcessing: "Procesando...",
                    sLengthMenu: "Mostrar _MENU_ registros",
                    sZeroRecords: "No se encontraron resultados",
                    sEmptyTable: "No hay datos disponibles en la tabla",
                    sInfo: "Mostrando registros del _START_ al _END_ de _TOTAL_",
                    sSearch: "Buscar:",
                    oPaginate: {
                        sNext: "Siguiente",
                        sPrevious: "Anterior"
                    }
                }
            });
        }
    });
</script>
@endsection