@php use Carbon\Carbon; @endphp

@extends('base')

@section('content')

    <div class="alert alert-success text-center">ENVOI MAIL</div>

    <div class="form-row">

        <div class="form-group col-md-2">
            <label for="date_debut">Début:</label>
            <input type="date" class="form-control" style="color:black !important" id="date_debut" value="{{ old('date_debut', Carbon::now()->format('Y-m-d')) }}">
        </div>


        <div class="form-group col-md-2">
            <label for="date_fin">Fin:</label>
            <input type="date" class="form-control" style="color:black !important" id="date_fin" value="{{ old('date_fin', Carbon::now()->format('Y-m-d')) }}">
        </div>

        <div class="col-md-3">
            <label for="recherche_statut" >Statut :</label>
            <select  class="form-control" id="recherche_statut">
                <option value="3">TOUS</option>
                <option value="1">BIEN ENVOYE</option>
                <option value="0">ERREUR</option>
            </select>
        </div>
        <div class="form-group col md-3">
            <label for="recherche_sujet" ><b>Sujet</b></label>
            <select  id="recherche_sujet" class="form-control" style="width: 100%;">
                <option value="0">TOUS</option>
                @foreach ($sujet as $sujet)
                    <option value="{{$sujet->envoi_mail_sujet}}"> {{$sujet->envoi_mail_sujet}}</option>
                @endforeach
            </select>
        </div>
        <div class="col md-2 d-flex justify-content-center align-items-center">
            <button class="btn btn-success" style="margin-left:2px" id="rafraichir">Rafraichir</button>
        </div>
    </div>>

    <div class="col-md-12 text-center">Nombre envois de mail : <span class="badge" style="background : #dff0d8; color: #000; font-size: 15px; margin-bottom:0.5%;">0</span></div>
    <div class="table-responsive">
        <table class="table table-striped table-hover table-bordered" id="table_envoi_mail" style="width:100%">
            <thead style="background-color:#28a745; color:white">
            <tr>
                <th scope="col" class="text-center">DATE</th>
                <th scope="col" class="text-center">HEURE</th>
                <th scope="col" class="text-center">UTILISATEUR</th>
                <th scope="col" class="text-center">SUJET</th>
                <th scope="col" class="text-center">DESTINATIRE</th>
                <th scope="col" class="text-center">SATUT</th>
            </tr>
            </thead>

        </table>
    </div>



    <script>

        $(function() { // Dom ready


            $("#date_debut").val("{{ Carbon::now()->format('Y-m-d') }}");

            $("#date_fin").val("{{ Carbon::now()->format('Y-m-d') }}");

            $('title').text("ENVOI MAIL - SMART CENTRAL");


            $("#date_debut").change(function (e) {
                e.preventDefault();

                // console.log('chnage');

                //$("#date_fin").val($("#date_debut").val())
                $("#rafraichir").click();


            });

            $("#date_fin").change(function (e) {
                e.preventDefault();

                // console.log('chnage');

                $("#rafraichir").click();


            });

            $("#recherche_statut").change(function (e) {
                e.preventDefault();



                $("#rafraichir").click();


            });

            var table = $('#table_envoi_mail').on('processing.dt', function (e, settings, processing) {

                $('.ring').css('display', processing ? 'block' : 'none');
                $('#filtre_loading').css('display', processing ? 'block' : 'none');
            }).DataTable({
                scrollX: true,
                orderCellsTop: true,
                // fixedHeader: true,
                scrollCollapse: true,
                autoWidth: true,
                // paging: true,
                // serverSide: true,
                iDisplayLength: '50',
                dom: 'lBfrtip',
                buttons: [
                    { "extend": 'excel', "text": 'Export excel', "className": 'btn_export_excel', title: 'Liste de(s) envois de mail',"attr": {"style" :"color: rgb(255, 255, 255); background-color: rgb(33, 136, 56);"}}
                ],



                'ajax': {
                    "url": "{{route('envoi_mail.table')}}",
                    "type": "POST",
                    "data": {
                        //'date_debut':function() {return $('#date_debut').val()},'date_fin':function() {return $('#date_fin').val()},'centrale_id':function() {return $('#centrale_id').val()},'formule_id':function() {return $('#formule_recherche_id').attr('formule_id')},'bl_id':function() {return $('#bl_recherche_id').attr('bl_id')}},
                        'date_debut':function() {return $('#date_debut').val()},
                        'date_fin':function() {return $('#date_fin').val()},
                        'recherche_statut':function() {return $('#recherche_statut').val()},
                        'recherche_sujet':function() {return $('#recherche_sujet').val()},

                        _token: '{{ csrf_token() }}'


                    },

                    'dataSrc': function (json) {

                        $('.badge').html(json.recordsTotal);

                        return json.data;
                    },
                },



                columnDefs: [

                    {'className': 'text-center align-middle ', 'targets': '_all'},
                ],

            });



            $("#rafraichir").click(function (e){
                e.preventDefault();
                table.ajax.reload(null, false);

            });





        });
    </script>
@endsection