@extends('masushuaia.plantilla')

@section('titulo', $titulo)

@section('scripts')
    <link href="{{ asset('css/datatables.min.css') }}" rel="stylesheet">
    <script src="{{ asset('js/datatables.min.js') }}"></script>
@endsection

@section('breadcrumb')
    <div class="col-lg-6 text-right inline pr-0">
        <a class="btn-blue py-1 px-4" href="/seguimiento">Recargar</a>
    </div>
@endsection

@section('breadcrumb-list')
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="/">Inicio</a></li>
        <li class="breadcrumb-item active">{{ $titulo }}</li>
    </ol>
@endsection

@section('contenido')
    <div class="row my-lg-4">
        <div class="col-lg-3">
            <label for="txtFechaDesde">Fecha desde</label>
            <input type="date" name="txtFechaDesde" id="txtFechaDesde" class="form-control">
        </div>
        <div class="col-lg-3">
            <label for="txtFechaHasta">Fecha hasta</label>
            <input type="date" name="txtFechaHasta" id="txtFechaHasta" class="form-control">
        </div>
        <div class="col-lg-auto align-self-end">
            <button class="btn btn-blue text-uppercase px-lg-4 py-lg-1" onclick="setFiltro();">filtrar</button>
        </div>
    </div>
    <div class="row">
        <div class="col-12">
            <div id="msg"></div>
        </div>
    </div>
    @if (isset($msg))
        <script>
            msgShow('{{ $msg['MSG'] }}', '{{ $msg['ESTADO'] }}');
        </script>
    @endif
    <table id="grilla" class="display">
        <thead>
            <tr>
                <th>Comercio</th>
                <th>Campaña</th>
                <th>Cantidad de visitas</th>
            </tr>
        </thead>
    </table>
    <script>
        function setFiltro() {
            dataTable.ajax.url(
                `{{ asset('/seguimiento/index/cargarGrilla') }}?fDesde=${$('#txtFechaDesde').val()}&fHasta=${$('#txtFechaHasta').val()}`
            ).load();
        }

        var dataTable = $('#grilla').DataTable({
            "processing": true,
            "serverSide": true,
            "bFilter": true,
            "bInfo": true,
            "bSearchable": true,
            "pageLength": 25,
            "order": [
                [2, "desc"]
            ],
            "ajax": "{{ asset('/seguimiento/index/cargarGrilla') }}"
        });
    </script>
@endsection