@extends('layouts.app')

@section('title', 'Statistiche')

@section('content')
<style>
    
    .table-hover > tbody > tr:hover {
    background-color: #1ab394!important;
    color: #ffffff!important;
}

</style>
<div class="row wrapper border-bottom white-bg page-heading">
    
    <h1>Riepilogo Accise</h1>
    
</div>

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row equal">
        <div class="col-md-6 ">
            
                <form method="post" id="form_contratto" > 
               {{csrf_field()}}
                   
                <div class="ibox float-e-margins" id='contratto_form'>
                   
                    <div class="ibox-title">
                        <div class="col-md-12 no-padding">
                            <h5 >data di riferimento</h5> 
                           
                        </div>
                    
                    </div>
                    <div class="ibox-content" id="contratto_form_content">
                          <div class="sk-spinner sk-spinner-chasing-dots">
                                <div class="sk-dot1"></div>
                                <div class="sk-dot2"></div>
                          </div>
                        <div class="row">
       
                            <div class="col-md-4">
                                <div class="form-group"><label>Data Inizio</label> <input type="text" name="data_inizio" placeholder="Data da"  value="{{date('01/m/Y')}}" class="form-control date"></div>   
                            </div>
                            <div class="col-md-4">
                                <div class="form-group"><label>Data Fine</label> <input type="text" placeholder="Data a" name="data_fine" value="{{date('t/m/Y')}}"  class="form-control date"></div>   
                            </div>
                            
                        <div class="col-md-4">
                                
                            <h4>Tipo imposta erariale</h4>
                              
                            <div class="form-group">
                            <div class="col-md-6 no-padding">
                                <div class="i-checks"><label> <input type="radio"   name="tipo_categoria" value="provinciale" checked> <i></i> provinciale</label></div>   
                                
                            </div>
                            <div class="col-md-6 no-padding">
                               <div class="i-checks"><label> <input type="radio"  name="tipo_categoria" value="regionale" > <i></i>regionale</label></div>  
                            </div>
                                
                            </div>
                        
                        
  
                        </div>
                        
                        
                        </div>
                        
                        
                        
                        <div class="row m-md text-center">
                            <button type="button"  onclick="calcolaAccise()" class="btn btn-primary btn-lg">Interroga</button>
                        </div>

                    </div>
                </div>  
                </form>
        </div>
        
        <div class="col-md-6 ">
            <div id="panelDetImp" style="display:none">
                <form method="post" action="/editAccise" id="form_acciseed" > 
               {{csrf_field()}}
               <input id="cat_edit" type="hidden" name="cat" value="" />
               <input id="cat_tipo" type="hidden" name="tipo" value="" />
               
               
                <div class="ibox float-e-margins" id='contratto_form'>
                   
                    <div class="ibox-title">
                        <div class="col-md-12 no-padding">
                            <h5 id="accisa_head" >dettagli imposta</h5> 
                           
                        </div>
                    
                    </div>
                    <div class="ibox-content" id="contratto_form_content">
                          <div class="sk-spinner sk-spinner-chasing-dots">
                                <div class="sk-dot1"></div>
                                <div class="sk-dot2"></div>
                          </div>
                        <div class="row">
       
                            <div class="col-md-6">
                                <div class="form-group"><label>Importo</label> <input type="text" name="importo" placeholder="importo"   class="form-control"></div>   
                            </div>
                          

                            <div class="col-md-6">

                                <h4>comunicato</h4>

                                <div class="form-group">
                                    <div class="col-md-6 no-padding">
                                        <div class="i-checks"><label> <input type="radio"   name="comunicato" value="no" checked> <i></i> NO</label></div>   

                                    </div>
                                    <div class="col-md-6 no-padding">
                                        <div class="i-checks"><label> <input type="radio"  name="comunicato" value="si" > <i></i>SI</label></div>  
                                    </div>

                                </div>
                            </div>  
                        </div>
                        <div class="row m-md text-center">
                            <button type="button"  onclick="saveAcciseData()" class="btn btn-warning btn-lg">Modifica</button>
                        </div>

                    </div>
                </div>  
                </form>
            </div>
            <div id="noresultImp" class="text-center p-h-lg">
                <h1>Nessun accisa selezionata</h1>
            </div>
        </div>  
    </div>

    <div class="row equal">
        <div class="col-md-6">
            <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>Risultati Energia</h5>
                    
                    </div>
                    <div class="ibox-content" id="tbee">
                         <div class="sk-spinner sk-spinner-chasing-dots">
                                <div class="sk-dot1"></div>
                                <div class="sk-dot2"></div>
                         </div>
                        
                        <table class="table table-hover" id="tblEE">
                           
                            <thead>
                            <tr>
                                <th id="tbeH_cat">provincia</th>
                                <th>data apertura</th>
                                 <th>importo</th>
                                  <th>comunicato</th>
                                <th>stato</th>
                            </tr>
                            </thead>
                            <tbody>
                    
                            </tbody>
                        </table>

                    </div>
                </div>
            
        </div>
          <div class="col-md-6">
            <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>Risultati Gas</h5>
                    
                    </div>
                    <div class="ibox-content" id="tbgas">
                       <div class="sk-spinner sk-spinner-chasing-dots">
                                <div class="sk-dot1"></div>
                                <div class="sk-dot2"></div>
                         </div>

                        <table class="table table-hover" id="tblGas">
                            <thead>
                            <tr>
                                <th id="tbgH_cat">provincia</th>
                                <th>data apertura</th>
                                  <th>importo</th>
                                  <th>comunicato</th>
                                <th>stato</th>
                            </tr>
                            </thead>
                            <tbody>
                    
                            </tbody>
                        </table>

                    </div>
                </div>
            
        </div>
    </div>
</div>
@endsection 

@section('scripts')
<script>
    var interrogazione;
    var tabellaGas=$('#tblGas').dataTable();
    var tabellaLuce=$('#tblEE').dataTable();
    
     function esporta()
     {
         alert('sdfsd');
     }
    function calcolaAccise()
    {
        $('#tbee').toggleClass('sk-loading');
        $('#tbgas').toggleClass('sk-loading');
        tabellaGas.fnDestroy();
        tabellaLuce.fnDestroy();
        data=$('form').serialize();
        $.post( "riepilogoAccise",data).done(function( data ) {
        interrogazione=JSON.parse(data);
         $('#tblEE').find('tbody').empty();
         
         
        $.each(interrogazione.EE, function(index, value) {
            if(value)
            {
            $('#tblEE').find('tbody').append("<tr data-codice='"+index+"' data-tipo='E'  ><td>"+index+"</td><td>"+value.DataApertura+"</td><td>"+value.importo+"</td><td>"+value.comunicato+"</td><td>"+value.STATO+"</td></tr>");
             }
        });
        tabellaLuce=$('#tblEE').dataTable({ paging:true, dom: 'Bfrtip',
        buttons: [
            'copy', 'csv', 'excel', 'pdf', 'print'
        ]});
        $('#tblGas').find('tbody').empty();
           $.each(interrogazione.G, function(index, value) {
           if(value)
           {
           $('#tblGas').find('tbody').append("<tr data-codice='"+index+"' data-tipo='G' ><td>"+index+"</td><td>"+value.DataApertura+"</td><td>"+value.importo+"</td><td>"+value.comunicato+"</td><td>"+value.STATO+"</td></tr>");
           }
        }); 
        tabellaGas= $('#tblGas').dataTable({  dom: 'Bfrtip',
        buttons: [
            'copy', 'csv', 'excel', 'pdf', 'print'
        ]});
        var chk=$("[name='tipo_categoria']").eq(0).prop('checked')?"provinciale":"regionale";
   
        if(chk=='provinciale'){
        $('#tbeH_cat').html('provincia');
        $('#tbgH_cat').html('provincia');
        $('#tbee').show();
        }
        else
        {
        $('#tbee').hide();
        $('#tbeH_cat').html('regione');
        $('#tbgH_cat').html('regione');
        }

         $('#tbee').toggleClass('sk-loading');
        $('#tbgas').toggleClass('sk-loading');
        
        
      });
    }
 
 function saveAcciseData()
 {
      data=$('#form_acciseed').serialize();
        $.post( "/statistiche/editAccise",data).done(function( data ) {
             toastr.success('modifiche salvate con successo');
              $('#panelDetImp').hide();
              $('#noresultImp').fadeIn();
             calcolaAccise();
             
        });
 }
    
 function interrogaAccise(code,tipo)
 {
     var tipocat=$("[name='tipo_categoria']").eq(0).prop('checked')?"provinciale":"regionale";
     $('#noresultImp').hide();
      $('#panelDetImp').removeClass('animated flipInY');
    $.getJSON("/api/accisa/byCode?code="+code+"&tipo="+tipo+"&categoria="+tipocat, function(result){
      console.log(result);
      $('#accisa_head').html("dettagli imposta "+result.tipo_cat+"(" +result.cat+")");
      $("[name='importo']").val(result.importo);
      $('#cat_edit').val(result.cat);
      $('#cat_tipo').val(result.tipo);
      
      $('#panelDetImp').show().addClass('animated flipInY');
      
      if(result.comunicato)
      {
     
         if($("[name='comunicato']").eq(0).prop('checked'))
         {
         $("[name='comunicato']").eq(1).iCheck('toggle');
         }
      }
      else
      {
         
         if(!$("[name='comunicato']").eq(0).prop('checked'))
         {
  
             $("[name='comunicato']").eq(0).iCheck('toggle');
         }
      }
      
      
    });
    
 }
    
$(document).ready(function(){
   
       $('#tblEE tbody').on('click', 'tr', function () {
     
       interrogaAccise($(this).data('codice'),$(this).data('tipo'));
    } );
        $('#tblGas tbody').on('click', 'tr', function () {
        interrogaAccise($(this).data('codice'),$(this).data('tipo'));
    } );
    
});

</script>

@endsection