@extends('Templates.PlantillaFull', ['PaginaTitulo' => 'Pago a repartidores', 'PaginaUrl' => 'pago-repartidores', 'Padre' => '1'])


@section('Contenido')
    <x-table>

        @slot('titulo')
            <i class="fas fa-file-alt" style="font-size: 20px"></i>&nbsp;&nbsp;<h1 class="d-inline-block p-0"
                style="margin: -2px 0px -1px 5px;">Pago a repartidores</h1>
        @endslot

        @slot('idTabla', 'TablePagoRepartidor')

        @slot('classBuscador', 'd-none')

        @slot('btnAgregar')
            <div class="d-flex align-items-center mt-3">
                <label class="text-muted mr-2" for="">Desde:</label>
                <input type="date" name="desde" id="desde" class="form-control" style="margin-left: 12px; margin-right: 14px;">
                <label class="text-muted" for="">Hasta:</label>
                <input type="date" name="hasta" id="hasta" class="form-control" readonly
                    style="margin-left: 12px; margin-right: 12px;">
                <button class="btn btn-primary" style="background-color: #{{env('APP_COLOR')}}" onclick="filtrar()"><i class="fas fa-filter"></i>&nbsp;&nbsp; Filtrar</button>
            </div>
        @endslot

        {{-- @slot('filtros', [[0, 'Comercio']]) --}}

        {{-- @slot('leftElements')
            <input type="date" class="form-control">
        @endslot --}}

        @slot('rightElements')
            <div class="mt-3 float-end">
                <button class="btn btn-primary" style="background-color: #{{env('APP_COLOR')}}" id="btnImprimirBoleta"><i class="fas fa-print"></i>&nbsp;&nbsp; Imprimir boleta</button>
                <button class="btn btn-secondary" id="btnImprimirPlanilla"><i class="fas fa-print"></i>&nbsp;&nbsp; Imprimir planilla</button>

                <form class="d-none" action="{{ route('generar-reporte') }}" enctype="multipart/form-data" method="post" id="formImprimir"> @csrf
                <input type="text" name="RReporteSelect" id="RReporteSelect" value="">
                <input type="date" name="RFechaInicial" id="RFechaInicial" value="">
                <button type="submit" form='formImprimir' formtarget="_blank" id="btnSubmit"></button>
                </form>
            </div>
        @endslot

        @slot('accionBuscar')
            {{-- onkeyup="if(event.keyCode == 13) MakeRequestData('{{ route('abrirComercios.buscar') }}', '#TablePagoRepartidor', 'POST', 2,
            '','', true, false, false, ['Palabra/' + $(this).val(), 'Filtro/0', 'SUCU_ID/' +
            $('#SUCU_ID').val()])" --}}
        @endslot


        @slot('header')
            <th>No</th>
            <th>Delivery</th>
            <th>Total pedidos</th>
            <th>Total devengado</th>
            <th>Total descuentos</th>
            <th>Total a pagar</th>
            <th>Acciones</th>

        @endslot

        @slot('body')
            @include('reportes.pago-repartidores.pago-repartidores-data')
        @endslot

    </x-table>
@endsection

@section('scripts')
    <script>
        Date.prototype.addDays = function(days) {
            var date = new Date(this.valueOf());
            date.setDate(date.getDate() + days);
            return date;
        }

        $('#desde').change(function(e) {
            let date = (new Date(this.value + ' 00:00')).addDays(6);
            $('#hasta').val(date.getFullYear() + '-' + (date.getMonth() + 1).toString().padStart(2, '0') + '-' + date.getDate().toString().padStart(2, '0'));
        });

        function filtrar() {
            let date = new Date($('#desde').val() + ' 00:00');
            console.log(date.addDays(6));

            $.ajax({
                type: "GET",
                url: "{{ route('pagoRepartidores.filtrar') }}",
                data: {
                    desde: $('#desde').val()
                },
                dataType: "HTML",
                beforeSend: function() {
                    LoadingAlert();
                },
                success: function(response) {
                    $('#TablePagoRepartidor').html(response);
                },
                error: function(e) {
                    console.log(e.responseText);
                },
                complete: function(e) {
                    $.unblockUI();
                }
            });
        }

        $('#btnImprimirBoleta').click(function(e){
            if(!$('#desde').val()){
                Swal.fire({title: 'Seleccione la fecha "Desde".', icon: 'error'});
                return;
            }
            $('#RFechaInicial').val($('#desde').val());
            // 66 es el ID DE BOLETA DE PAGO A REPARTIDORES
            $('#RReporteSelect').val(66);

            $('#btnSubmit').click();
        });

        $('#btnImprimirPlanilla').click(function(e){
            if(!$('#desde').val()){
                Swal.fire({title: 'Seleccione la fecha "Desde".', icon: 'error'});
                return;
            }
            $('#RFechaInicial').val($('#desde').val());
            // 66 es el ID DE BOLETA DE PAGO A REPARTIDORES
            $('#RReporteSelect').val(72);
            $('#btnSubmit').click();
        });

        $(document).ready(function(){
            $('#desde').val('2022-05-30');
            filtrar();
        });
    </script>
@endsection