@extends('layouts.app')

@section('createRichiesta', 'Richieste')

@section('content')
    <style>
        thead input {
            width: 100%;
        }

        .table tr>*:nth-child(10) {
            display: none;
        }

        .table tr>*:nth-child(11) {
            display: none;
        }
    </style>
    <select class="form-control" id="richiesta_id" style="display:none">
        <option></option>
        @foreach ($tipologia_richieste as $tipologia_richiesta)
            <option value="{{ $tipologia_richiesta->id }}">{{ $tipologia_richiesta->nome }}</option>
        @endforeach
    </select>
    <select class="form-control" id="stato_id" style="display:none">
        <option></option>
        @foreach ($stati as $stato)
            <option value="{{ $stato->id }}">{{ $stato->stato }}</option>
        @endforeach
    </select>
    <select class="form-control" id="creatore_id" style="display:none">
        <option></option>
        @foreach ($creatori as $creatore)
            <option value="{{ $creatore->id }}">{{ $creatore->name }}</option>
        @endforeach
    </select>
    <select class="form-control" id="attuale_id" style="display:none">
        <option></option>
        @foreach ($utenti_attuali as $attuale)
            <option value="{{ $attuale->id }}">{{ $attuale->name }}</option>
        @endforeach
    </select>






    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row equal">
            <div class="col-md-12">

                <div class="ibox">
                    <div class="ibox-content">

                        <h2>Lista Richieste</h2>
                        <div class="row">

                            @if (Auth::user()->users_type_id < 3)
                                <div class="row m-b-md">
                                    <div class="col-md-2" style="float:right;">
                                        <a href="richieste/createRichiesta"
                                            class="btn btn-primary btn-md center-block text-right" type="submit">
                                            <i class="fa fa-plus"></i>&nbsp;Crea Pratica</a>
                                        <a href="richieste/createRichiesta"
                                            class="btn btn-primary btn-md center-block text-right"><i
                                                class="fa fa-plus"></i>&nbsp;Modulistica</a>

                                    </div>
                                </div>
                                <div class="row m-b-md">
                                    <div class='col-md-12'>
                                        <div class="col-md-2" style="float:left;">

                                            <a href="richieste/exportPrecheck?type=Gas"
                                                class="btn btn-danger btn-md center-block text-right" type="submit"><i
                                                    class="fa fa-user-o"></i>&nbsp;Esporta Precheck GAS</a>

                                        </div>



                                        <div class="col-md-2" style="float:left;">

                                            <a href="richieste/exportPrecheck?type=EE"
                                                class="btn btn-danger btn-md center-block text-right" type="submit"><i
                                                    class="fa fa-user-o"></i>&nbsp;Esporta Precheck EE</a>

                                        </div>


                                        <div class="col-md-2" style="float:left;">

                                            <a href="richieste/exportSwitch?type=EE"
                                                class="btn btn-warning btn-md center-block text-right" type="submit"><i
                                                    class="fa fa-user-o"></i>&nbsp;Esporta Switch EE</a>

                                        </div>
                                        <div class="col-md-2" style="float:left;">

                                            <a href="richieste/exportSwitch?type=Gas"
                                                class="btn btn-warning btn-md center-block text-right" type="submit"><i
                                                    class="fa fa-user-o"></i>&nbsp;Esporta Switch Gas</a>

                                        </div>
                                    </div>
                                </div>
                                <div class="row m-b-md">
                                    <div class='col-md-12'>
                                        <div class="col-md-2" style="float:left;">

                                            <a href="richieste/exportSwitchFileForMubi"
                                                class="btn btn-warning btn-md center-block text-right" type="submit"><i
                                                    class="fa fa-user-o"></i>&nbsp;Esporta File Utenze x Mubi</a>

                                        </div>




                                        <div class="col-md-2" style="float:left;">

                                            <a href="richieste/exportVolture"
                                                class="btn btn-primary btn-md center-block text-right" type="submit"><i
                                                    class="fa fa-exchange"></i>&nbsp;Esporta Volture</a>

                                        </div>
                                        <div class="col-md-2" style="float:left;">

                                            <a href="richieste/exportVoltureContestuali"
                                                class="btn btn-primary btn-md center-block text-right" type="submit"><i
                                                    class="fa fa-exchange"></i>&nbsp;Esporta Volture Contestuali</a>

                                        </div>
                                        <div class="col-md-2" style="float:left;">

                                            <a href="#" class="btn btn- btn-md center-block text-right"
                                                style="background: #e7eaec;" type="submit"><i
                                                    class="fa fa-envelope-o"></i>&nbsp;Invia Welcome Mail</a>

                                        </div>
                                    </div>
                                @else
                                    <div class="col-md-2" style="float:right;"> <a href="richieste/createRichiesta"
                                            class="btn btn-primary btn-md center-block text-right" type="submit"><i
                                                class="fa fa-plus"></i>&nbsp;Crea Pratica</a></div>
                            @endif


                        </div>
                        <div class="clients-list">
                            <div class="full-height-scroll" style="overflow: hidden; width: auto; height: 100%;">
                                <div class="table-responsive">
                                    <table class="table table-striped table-hover" id="tableclient">
                                        <thead>
                                            <tr>
                                                <th></th>
                                                <th>Servizio</th>
                                                <th>Tipo Richiesta</th>
                                                <th>Creatore</th>
                                                <th>Data Creazione</th>
                                                <th>Nominativo</th>
                                                <th>Indirizzo</th>
                                                <th>Pdp</th>
                                                <th>Utente Attuale</th>
                                                <th>Stato</th>
                                                <th>Azioni</th>
                                                <th style="display: none!important">Codice_fiscale</th>
                                                <th style="display: none!important">Partita_Iva</th>
                                                <th style="display: none!important">note</th>
                                                <th style="display: none!important">data_decorrenza</th>
                                                <th style="display: none!important">nome</th>
                                                <th style="display: none!important">cognome</th>
                                                <th style="display: none!important">ragione sociale</th>
                                                <th style="display: none!important">telefono</th>
                                                <th style="display: none!important">codice_agente</th>
                                                <th style="display: none!important">agente_nome</th>
                                                <th style="display: none!important">esito_ultimo_ko</th>
                                            </tr>
                                        </thead>
                                        <tbody>



                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>

    <div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" style="display: none;" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content animated bounceInRight">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span
                            class="sr-only">Close</span></button>
                    <h1>Genera richiesta di Riattivazione</h1>
                    <input type='hidden' id='richiesta_id' value=''>
                </div>
                <div class="modal-body">
                    <h2>Attenzione,procedendo si generarà una richiesta di riattivazione per il seguente utente</h2>
                    <p>facendo ciò verrà creata una nota con causale di avvenuto pagamento.<br>Si deisdera procedere?</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal">Chiudi</button>
                    <button type="button" class="btn btn-primary" value="Append" onclick="generaRiattivazionePost()"
                        data-dismiss="modal">Genera Richiesta</button>
                </div>
            </div>
        </div>
    </div>

@endsection
@section('scripts')
    <script>
        var urlParams = new URLSearchParams(window.location.search);
        var myReqType = urlParams.get('req');
        urlParams = new URLSearchParams(window.location.search);
        var myTipologia = urlParams.get('type');

        //console.log(myReqType,myTipologia);

        var table = $('table').DataTable({
            pageLength: 8,
            bSort: false,
            select: true,
            "scrollY": "500px",
            "orderCellsTop": true,
            "fixedHeader": false,
            "bFilter": true,


            "serverSide": true,
            "stateSave": true,
            "ajax": {
                "url": "/richieste/elencoPratiche",
                "data": function(d) {
                    d.req = myReqType;
                    d.type = myTipologia;
                    // d.custom = $('#myInput').val();
                    // etc
                }
            },
            "lengthMenu": [
                [8, 10, 25, 100, 150, -1],
                [8, 10, 25, 100, 150, 'Tutte']
            ],
            dom: 'Blfrtip',
            buttons: [
                'copy', 'csv', 'excel', 'pdf'
            ]
        }).search('');


        table.on('click', 'tbody tr', function() {
            //alert(this);
            // table.row('.selected').remove().draw( false );
        });

        function prendiInCarico(id, CurrentUserId) {


            $.post("/richieste/PrendiInCarico", {
                reqId: id,
                currentUser: CurrentUserId
            }).done(function(data) {

                // table.ajax.reload();
                table.row('.selected').remove().draw(false);
                refreshRequest();
            });

        }


        function generaRiattivazione(id, CurrentUserId) {

            $('#richiesta_id').val(id);
            $("#myModal").modal();


        }

        function generaRiattivazionePost() {
            id = $('#richiesta_id').val();
            $.post("/richieste/GeneraRiattivazione", {
                reqId: id
            }).done(function(data) {
                table.ajax.reload();
                refreshRequest();
            });
        }




        $(document).ready(function() {
            $('table thead tr').clone(true).appendTo('table thead').css("background-color", "#ddd");
            $('table thead tr:eq(1) th').each(function(i) {


                if (i != 9 && i != 7 && i != 8 && i != 1 && i != 2) {
                    var title = $(this).text();
                    $(this).html('<input type="text" placeholder="Cerca ' + title +
                        '" class="input form-control tableinput" style="width:100%;color:#2f4050;" />');
                } else if (i == 1) {
                    $(this).html('<select  class="form-control tableinput" placeholder="Cerca ' + title +
                        '"  style="width:100%;color:#2f4050;">' + $('#richiesta_id').html() +
                        "</select>");

                } else if (i == 2) {
                    $(this).html('<select  class="form-control tableinput" placeholder="Cerca ' + title +
                        '"  style="width:100%;color:#2f4050;">' + $('#creatore_id').html() + "</select>"
                        );

                } else if (i == 7) {
                    $(this).html('<select  class="form-control tableinput" placeholder="Cerca ' + title +
                        '"  style="width:100%;color:#2f4050;">' + $('#attuale_id').html() + "</select>");

                } else if (i == 8) {
                    $(this).html('<select  class="form-control tableinput" placeholder="Cerca ' + title +
                        '"  style="width:100%;color:#2f4050;">' + $('#stato_id').html() + "</select>");

                } else if (i == 2) {
                    //data
                    $(this).html(
                        '<input type="text"  id="data_filter" placeholder="Cerca per data" class="input form-control tableinput" style="width:100%;color:#2f4050;" />'
                        );

                }
                $('.form-control.input-sm').eq(1).attr('disabled', 'disabled');





            });

            $('#data_filter').daterangepicker({

                "direction": "ltr",
                "format": "DD-MM-YYYY",
                "separator": " al ",
                "applyLabel": "Applica",
                "cancelLabel": "Annulla",
                "fromLabel": "Da",
                "toLabel": "A",
                "customRangeLabel": "Personalizzata",
                "daysOfWeek": [
                    "Do",
                    "Lu",
                    "Ma",
                    "Me",
                    "Gi",
                    "Ve",
                    "Sa"
                ],
                "monthNames": [
                    "Gennaio",
                    "Febbraio",
                    "Marzo",
                    "April",
                    "Maggio",
                    "Giugno",
                    "Luglio",
                    "Agosto",
                    "Settembre",
                    "Ottobre",
                    "Novembre",
                    "Dicembre"
                ],
                "firstDay": 1

            });




            $('.tableinput').each(function(index, value) {
                $(this).on('keyup change', function() {

                    if (table.column(index).search() !== this.value) {

                        data = $(value).val();
                        if (index == 0 || index == 7 || index == 1 || index == 6) {
                            data = $(this).children("option:selected").val();
                        }
                        table
                            .column(index)
                            .search(data)
                            .draw();
                    }
                });
            });

            table
                .search('')
                .columns().search('')
                .draw();
        });
    </script>


@endsection