@extends('layouts.app')

@section('title', 'Tools')

@section('content')
<style>
    .mes
    {
    color: #ed5565;
    list-style-type: none;
    }
</style>
    <div class="wrapper wrapper-content animated fadeInRight">
                <div class="row equal">
         
                    <div class="col-lg-6">
             
                            <div class="ibox float-e-margins">
                                <div class="ibox-title">
                                    <h5>Importazione pratiche  <small class="m-l-sm">genera</small></h5>
                                    <div class="ibox-tools">
                                        <a class="collapse-link">
                                            <i class="fa fa-chevron-up"></i>
                                        </a>
                                    
                                  
                                       
                                    </div>
                                </div>
                                <div class="ibox-content" id="carica">
                                <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 .csv input pratiche inagec<br>
                                    </h2>
                                    <p>
                                        non hai il template?<a href="/templates/templateInagec.xls">scaricalo</a>
                                      
                                    </p>
                                    <form method="post" enctype="multipart/form-data">
                                        <input type="hidden" name="_token" value="{{ Session::token() }}" />
                                     <div class="fileinput fileinput-new input-group {{$errors->has('file')?'has-error':''}}" data-provides="fileinput">
                                        <div class="form-control" data-trigger="fileinput">
                                            <i class="glyphicon glyphicon-file fileinput-exists"></i>
                                            <span class="fileinput-filename"></span>
                                        </div>
                                        <span class="input-group-addon btn btn-primary btn-file" style="background:#1ab394!important;color:white;">
                                            <span class="fileinput-new">Seleziona file</span>
                                            <span class="fileinput-exists">cambia</span>
                                            <input type="file" name="file_gestionale"  accept=".xls" />
                                        </span>
                                        <a href="#" class="input-group-addon btn btn-danger fileinput-exists" data-dismiss="fileinput">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 type="submit" class="btn btn-primary btn-lg center-block">Conferma</button>
                                        </div>
                                        <div class="clearfix"></div>
                                      
                                      
                                    </form>
                                </div>
                                <div class="ibox-footer">
                                   
                                  
                                </div>
                            </div>
                    
                        
                    </div>
                        <div class="col-lg-6">
                            
                            <div id="info" class="panel panel-info" style="min-height: 268px;">
                                        <div class="panel-heading">
                                            <i class="fa fa-info-circle"></i> Informazioni di importazione
                                        </div>
                                        <div class="panel-body">
                                            <p>Nessuna informazione da visualizzare al momento</p>
                                        </div>

                            </div>
                            
                        </div>
    
     </div>
        
        <div class="row equal">
            <div class="col-md-12">
            <div class="ibox">
                <div class="ibox-title">
                    <h2>Stato elaborazione</h2>
                </div>
                <div class="ibox-content">
                    <h4>elaborati &nbsp;<span id="start"> 0 </span>&nbsp;su <span id="stop"> 0 </span></h4>
                    <div class="progress progress-striped">
                        <div id="p"  style="width:0" aria-valuemax="100" aria-valuemin="0" aria-valuenow="80" role="progressbar" class="progress-bar progress-bar-warning">
                            <span class="sr-only">40% Complete (success)</span>
                        </div>
                    </div>

                </div>


            </div>
                
            </div>
          


        </div>
    </div>
@endsection 

@section('scripts')
<script>
  var toDo=[];
  var start;
  var stop;
  var elaborati=0;
  var isLast=false;
  
    function elaboraProgress()
    {
          //calcolo percentuale elaborato
          var progress=(start*100)/stop;
          progress=!progress?0:progress;
          //$('#perc_comp').html(progress.toFixed(2)+'%');
          //console.log(progress);
            $('#start').html(start+" pratiche ");
           $('#stop').html(stop+ " per un totale di "+elaborati+" elementi");
          $('#p').css('width',progress+'%').attr('aria-valuenow', progress);
    }
    
  function elaborateSingleJob()
  {
     token=$('[name="_token"]').val();
     size=300;
    
     job=JSON.stringify(toDo.slice(0,size)); 
           $.ajax({
                url: "/tools/elaboraPraticheInagecSingoloTask",
                type: 'POST',
                data: {'_token':token,'job':job},
                dataType: "json",
                success: function (data) {
                toDo.splice(0,size);
                elaborati+=toDo.length;

                 if(toDo.length+1>size && !isLast)
                    {
                       elaborateSingleJob(); 
                       start+=size;
                       elaboraProgress();
                    }
                    else
                    {
                        if(!isLast)
                        {
                            isLast=true;
                            elaborateSingleJob(); 
                            start+=size;
                            elaboraProgress();
                        }
                        else
                        {
                          start+=size;
                          elaboraProgress();   
                        }
                         $('#info').find('.panel-body').empty().append('<p>importati '+elaborati+' elementi </p>');
                         elaborati=0;
                    }
         
                }
                
        });
      
  }
  
    $('form').submit(function( event ) {
        event.preventDefault();
        var formData = new FormData($(this)[0]);
        $('#carica').toggleClass('sk-loading');
       $('#info').find('.panel-body').empty().append('<p>in caricamento.....</p>');
  
       
            
        
          $.ajax({
            url: window.location.pathname,
            type: 'POST',
            data: formData,
            dataType: "json",
            success: function (data) {
            
                    $('#carica').toggleClass('sk-loading');
                    toDo=data;
                      $('#info').find('.panel-body').empty().append('<p>pratiche da importare:'+    toDo.length+'</p>');
                      start=0;
                      stop=data.length;
                      elaborateSingleJob(); 
                   
 
            },
            error: function (jqXHR, textStatus, errorThrown) 
            {
                    $('#carica').toggleClass('sk-loading');
                console.log(jqXHR);
            },
            cache: false,
            contentType: false,
            processData: false
        });
        
    });

  
</script>

@endsection