@extends('layouts.app')

@section('title', 'Tools')

@section('content')

    <style>
        .mes {
            color: #ed5565;
            list-style-type: none;
        }

    </style>

    {{-- ************************************ SEZIONE IMPORTAZIONE FILES --}}
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row equal">

            {{-- ********************************************* PANNELLO IMPORTAZIONE FILES --}}
            <div class="col-lg-12">

                <div class="ibox float-e-margins">

                    {{-- ************** TITOLO --}}
                    <div class="ibox-title">
                        <h1 style="font-size: 35px !important;"><b>IMPORTAZIONE LETTURE DISTRIBUTORE NUOVI FORMATI</b> <small class="m-l-sm"></small></h1>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                        </div>
                    </div>

                    {{-- ************** SEZIONE IMPORTAZIONE --}}
                    <div class="ibox-content" id="carica">

                        {{-- ************** DIVIDER --}}
                        <div class="sk-spinner sk-spinner-wave">
                            <div class="sk-rect1"></div>
                            <div class="sk-rect2"></div>
                            <div class="sk-rect3"></div>
                            <div class="sk-rect4"></div>
                            <div class="sk-rect5"></div>
                        </div>

                        <h2>
                            File .XML input da distribuzione<br>
                        </h2>

                        <p>Selezionare il file XML per provvedere al caricamento delle letture</p>

                        {{-- ************** FORM CARICAMENTO FILES --}}
                        <form method="post" enctype="multipart/form-data">

                            {{-- ************** VALIDAZIONE SESSIONE --}}
                            <input type="hidden" name="_token" value="{{ Session::token() }}" />

                            {{-- ************** SELEZIONE DEI FILES --}}
                            <div class="fileinput fileinput-new input-group {{ $errors->has('file') ? 'has-error' : '' }}"
                                data-provides="fileinput">
                                {{-- <div class="form-control" data-trigger="fileinput"> --}}

                                {{-- ************** DISPLAY CONTATORE DEI FILES SELEZIONATI --}}
                                <div class="form-control" data-trigger="fileinput">
                                    <i class="glyphicon glyphicon-file fileinput-exists"></i>
                                    {{-- <span class="fileinput-filename"></span> --}}
                                    <span id="fileInputCount"></span>
                                </div>

                                {{-- ************** CAMPO CON I NOMI DEI FILES SELEZIONATI --}}
                                <span class="input-group-addon btn btn-primary btn-file"
                                    style="background:#1ab394!important;color:white;">

                                    {{-- ************** TASTI --}}
                                    <span class="fileinput-new">Seleziona files</span>
                                    <span class="fileinput-exists">cambia</span>

                                    {{-- ************** SELETTORE DEI FILES --}}
                                    <input id="fileinput" type="file" accept=".xml" name="file_gestionale[]" multiple
                                        onchange="getFiles() " />

                                </span>

                                <a href="#" class="input-group-addon btn btn-danger fileinput-exists"
                                    data-dismiss="fileinput" onclick="javascript:deleteFiles()">Cancella</a>
                            </div>

                            @if ($errors->has('file'))
                                <span class="help-block">
                                    <label class="control-label"
                                        style="color:#ed5565">{{ $errors->first('file') }}</label>
                                </span>
                            @endif

                            <div class="col-md-12">
                                <button id="btn_Conferma" type="submit" class="btn btn-primary btn-lg center-block"
                                    disabled>Conferma</button>
                            </div>

                            <div class="clearfix"></div>

                        </form>

                    </div>

                </div>

            </div>

            {{-- ************** LISTA FILES DA IMPORTARE --}}
            <div class="col-lg-12">
                <div class="ibox">
                    <div class="ibox-content">
                        <div id="listafilesDaImportare">
                            <h2><b>Lista file/s da importare</b></h2>
                            <p class="panel-body"><b>Nessun file selezionato</b></p>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>

    {{-- ************************************ SEZIONE REPORT --}}
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row equal">
            <div class="col-lg-12">
                <div class="ibox float-e-margins">

                    {{-- ************** INTESTAZIONE --}}
                    <div class="ibox-title">
                        <h1 style="font-size: 35px !important;"><b>REPORT IMPORTAZIONE LETTURE DISTRIBUTORE NUOVI FORMATI</b>
                            <small class="m-l-sm"></small>
                        </h1>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                        </div>
                    </div>

                    {{-- ************** INFO ELABORAZIONE --}}
                    @for ($i = 0; $i < $totalCount; $i++)
                        <div class="ibox-content" id="" style="max-height: 170px;">
                            <div>
                                <table width="100%">
                                    <tbody>
                                        <tr>

                                            {{-- ************** CONTATORE E NOME FILES IMPORTATI --}}
                                            <td width="98%">
                                                <h2><b>{{ $i + 1 }})
                                                        {{ $datiImportazioneTuttiIFiles->nomeFilesImportati[$i] }}
                                                </h2></b>
                                            </td>
                                            <td width="2%">
                                                <table width="100%" cellpadding="10" cellspacing="10">
                                                    <tbody>

                                                        {{-- ************** CONTATORE POD IMPORTATI --}}
                                                        <tr>
                                                            <td style="padding-right: 10px;" align="right" valign="middle">
                                                                <h1><b>{{ $datiImportazioneTuttiIFiles->contaPodImportati[$i] }}
                                                                    </b></h1>
                                                            </td>
                                                            <td nowrap="nowrap" width="1%" align="left" valign="middle"
                                                                style="padding-top: 4px;">
                                                                <h3><b>POD</b></h3>
                                                            </td>
                                                        </tr>

                                                        {{-- ************** CONTATORE FLUSSI IMPORTATI --}}
                                                        <tr>
                                                            <td style="padding-right: 10px;" align="right" valign="middle">
                                                                <h1><b>{{ $datiImportazioneTuttiIFiles->contaFlussiImportati[$i] }}
                                                                    </b></h1>
                                                            </td>
                                                            <td nowrap="nowrap" width="1%" align="left" valign="middle"
                                                                style="padding-top: 4px;">
                                                                <h3><b>FLUSSI</b></h3>
                                                            </td>
                                                        </tr>

                                                        {{-- ************** CONTATORE FLUSSI IMPORTATI ERRATI --}}
                                                        <tr>
                                                            <td style="padding-right: 10px;" align="right" valign="middle">
                                                                <h1><b>{{ $datiImportazioneTuttiIFiles->contaFlussiImportatiErrori[$i] }}
                                                                    </b></h1>
                                                            </td>
                                                            <td nowrap="nowrap" width="1%" align="left" valign="middle"
                                                                style="padding-top: 4px;">
                                                                <h3><b>FLUSSI ERRATI</b></h3>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    @endfor

                </div>
            </div>
        </div>
    </div>

@endsection

@section('scripts')
    <script>
        var fileInputCount = 0;

        //Cancelliamo la lista dei file da importare 
        function deleteFiles() {

            var element = document.getElementById('fileInputCount');

            element.innerHTML = "";

            //Cancelliamo il contenuto ogni volta che facciamo l'append della lista dei files da caricare
            $('#listafilesDaImportare').find('.panel-body').empty();
            $('#listafilesDaImportare').find('.panel-body').append('<b>Nessun file selezionato</b>')

            //Disabilitiamo il tasto CONFERMA
            $('#btn_Conferma').prop('disabled', true);

        }

        //Popoliamo la lista dei files da importare
        function getFiles() {
            var element = document.getElementById('fileInputCount');
            var fi = document.getElementById('fileinput');
            var fileInputCount = 0;
            var filesToLoad = ''; //Lista dei file da caricare che passiamo all'input field
            var maxFilesImportabili = 20; //Più di 20 files selezionati il form non li passa ai controller


            if (fi.files.length > 0 && fi.files.length <= maxFilesImportabili) {

                //Abilitiamo il tasto CONFERMA
                $('#btn_Conferma').prop('disabled', false);

                fileInputCount = fi.files.length;

                //Popoliamo il DISPLAY CONTATORE DEI FILES SELEZIONATI
                if (fileInputCount == 1) {
                    element.innerHTML = fileInputCount + " file selezionato";
                } else {
                    element.innerHTML = fileInputCount + " files selezionati";
                }

                //Cancelliamo il contenuto ogni volta che facciamo l'append della lista dei files da caricare
                $('#listafilesDaImportare').find('.panel-body').empty();

                //alert('Selected file: ' + fi.files.item(0).name + " Size:" + fi.files.item(0).size + " Type:" + fi.files.item(0).type);
                //console.log(fi.files);

                //Compositiamo la stringa con i nomi dei files da caricare
                for (var i = 0; i <= fi.files.length - 1; i++) {
                    $('#listafilesDaImportare').find('.panel-body').append('<b>' + (i + 1) + ') ' + fi.files.item(i).name +
                        '</b><br>')

                    filesToLoad += fi.files.item(i).name;
                }

            } else { //Se si selezionano più di maxFilesImportabili visualizziamo un alert
                element.innerHTML = fileInputCount + " files selezionati";

                alert("Hai selezionato " + fi.files.length + " files, numero massimo di file importabili " +
                    maxFilesImportabili + ".");
            }
        }
    </script>

@endsection