@extends('adminlte.app')

@section('content')
   
    <div class="content-wrapper">
           <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
          <div class="row mb-2">
            <div class="col-sm-6">
              <h1 class="m-0">Bem Vindo {{auth()->user()->name}}</h1>
            </div><!-- /.col -->
            <div class="col-sm-6">
              
            </div><!-- /.col -->
          </div><!-- /.row -->
        </div><!-- /.container-fluid -->
      </div>
      <!-- /.content-header -->
      @if ($message = Session::get('success'))
      <div class="alert alert-success">
          <p>{{ $message }}</p>
      </div>
      @endif

 <div class="card mx-3 mt-3">
    <div class="card-header pb-3 pt-3">
      Dashboard

    </div>
    <div class="card-body">

      {{-- <div class="row px-3 pb-3">
        <br>
        <div class="col-md-12 shadow"> --}}

          <div class="row">
            <div class="col-lg-3 col-12">
              <!-- small box -->
              <div class="small-box" style="background-color: rgb(110,210, 225);">
                <div class="inner text-center">

                  <strong> <p class="mb-2" style="color: white">Novos Clientes</p></strong>
                  <p class="mb-0" style="font-size: 12pt; color: white"> {{date('m/y')}}  - <strong><i class="fas fa-user"></i> {{$clientesMes->count()}} </strong> | {{date('m')}}/{{date('y')-1}} - <strong><i class="fas fa-user"></i> {{$clientesMesAnoPassado->count()}} </strong></p>
                  <p class="mb-1" style="font-size: 12pt; color: white"> {{date('Y')}} -  <strong><i class="fas fa-user"></i> {{$clientesAno->count()}}  </strong>| {{date('Y')-1}} -  <strong><i class="fas fa-user"></i> {{$clientesAnoPassado->count()}} </strong></p>
                </div>
                <div class="icon">
                    <i class="fas fa-user"></i>
                </div>
                <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
               </div>
            </div>

            <div class="col-lg-3 col-12">
                <!-- small box -->
                <div class="small-box" style="background-color: rgb(110 225 140);">
                  <div class="inner text-center">
  
                        <strong> <p class="mb-2" style="color: white">Vendas</p></strong>
                        <p title="Análise mensal em metros cúbicos: " class="mb-0" style="font-size: 12pt; color: white" > {{date('m/y')}}  - <strong><i class="fa fa-tint"  ></i> {{number_format($vendasMes->sum('quantidade')/1000,0,',','.')}} m³ </strong> | {{date('m')}}/{{date('y')-1}} - <strong><i class="fa fa-tint" ></i> {{number_format($vendasMesAnoPassado->sum('quantidade')/1000,0,',','.')}} m³ </strong></p>
                        <p title="Análise anual em milhões de metros cúbicos:" class="mb-1" style="font-size: 12pt; color: white" > {{date('Y')}} -  <strong><i class="fa fa-tint" ></i> {{number_format($vendasAno->sum('quantidade')/1000000,0,',','.')}}M m³  </strong>| {{date('Y')-1}} -  <strong><i class="fa fa-tint" ></i> {{number_format($vendasAnoPassado->sum('quantidade')/1000000,0,',','.')}}M m³ </strong></p>
                  </div>
                    <div class="icon">
                        <i class="fa fa-tint"></i>
                    </div>
                    <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                 </div>
             </div>

              <div class="col-lg-3 col-12">
                  <!-- small box -->
                  <div class="small-box bg-warning" style="background-color: rgb(110 225 140);">
                    <div class="inner text-center">
                          <strong> <p class="mb-2" style="color: white">Status BD</p></strong>
                          <div class="row mb-1 text-left">
                            <div class="col">
                                <p title="Última atualização Pendentes TFUEL: " class="mb-0" style="font-size: 12pt; color: white"><strong>TFUEL</strong> {{ $ultimaAtualizacaoTFUEL->created_at->format('d/m/Y H:i:s') }}</p>
                                <p title="Última atualização Pendentes IM: " class="mb-0" style="font-size: 12pt; color: white"><strong>IM</strong> {{ $ultimaAtualizacaoIM->created_at->format('d/m/Y H:i:s') }}</p>
                                <p title="Última atualização VENDAS: " class="mb-0" style="font-size: 12pt; color: white"><strong>VENDAS</strong> {{ $ultimaAtualizacaoVendas->created_at->format('d/m/Y H:i:s') }}</p>
                            </div>
                        </div>
                    </div>
                      <div class="icon">
                        <i class="fas fa-sync-alt"></i>
                      </div>
                      <a href="#" class="small-box-footer" style="color: white !important">More info <i class="fas fa-arrow-circle-right"></i></a>
                  </div>
              </div>

          </div>

          <div class="row">
            <div class="col-12">
              {{-- <p>Indicadores</p> --}}
              <hr>
            </div>
          </div>
          <div class="row">

            
            <div class="col-12">
              <!-- small box -->
              <div class="small-box bg-orange">
                <div class="inner text-center">

                  <strong> <p class="mb-2" style="color: white">Total Recebido do Mês</p></strong>
                  {{-- <h3 style="color: white" >€ @if(isset($total_mes->total)) {{number_format($total_mes->total,2,",",".")}} @else 0,00 @endif</h3> --}}
                  <h3 style="color: white" >€ @if(isset($total_mes)) {{number_format($total_mes->sum('total'), 2, ",", ".")}} @else 0,00 @endif</h3>
                 
                  
                </div>
  
                  
              </div>
            </div>



          </div>

          <div class="row">

            <div class="col-lg-3 col-12">
              <!-- small box -->
              <div class="small-box bg-danger">
                <div class="inner text-center">

                  <h3>€ {{number_format($vermelho_total,2,",",".")}}</h3>


                  <p class="mb-2 " style="font-size: 12pt"> <i class="fas fa-user"></i> {{$vermelho_cliente_quantidade}} clientes - <i class="fas fa-barcode"></i> {{$vermelho_fatura_quantidade}} documentos</p>
                  <p class="mb-2">Risco de Bloqueio e/ou Sinistro</p>

                </div>
                <div class="icon">
                  <i class="fas fa-barcode"></i>
                </div>
                    {{-- <a href="/detalhe?cor_escolhida=vermelho" class="small-box-footer">Mais Info<i class="fas fa-arrow-circle-right"></i></a> --}}

              </div>
            </div>
            <!-- ./col -->

            <div class="col-lg-3 col-12">
              <!-- small box -->
              <div class="small-box bg-warning" >
                <div class="inner text-center">

                  <h3 style="color: white">€ {{number_format($amarelo_total,2,",",".")}}</h3>

                  <p class="mb-2" style="font-size: 12pt; color: white"> <i class="fas fa-user"></i> {{$amarelo_cliente_quantidade}} clientes - <i class="fas fa-barcode"></i> {{$amarelo_fatura_quantidade}} documentos</p>
                  <p class="mb-2" style="color: white">Em Incumprimento</p>
                </div>
                <div class="icon">
                  <i class="fas fa-barcode"></i>
                </div>

                  {{-- <a href="/detalhe?cor_escolhida=amarelo"  class="small-box-footer"><span style="color: white"> Mais Info<i class="fas fa-arrow-circle-right"></i> </span></a> --}}
       
              </div>
            </div>
            <!-- ./col -->

            <div class="col-lg-3 col-12">
              <!-- small box -->
              <div class="small-box bg-success">
                <div class="inner text-center">
 
                  <h3>€ {{number_format($verde_total,2,",",".")}}</h3>
             
                  
                  <p class="mb-2" style="font-size: 12pt"> <i class="fas fa-user"></i> {{$verde_cliente_quantidade}} clientes - <i class="fas fa-barcode"></i> {{$verde_fatura_quantidade}} documentos</p>
                  <p class="mb-2" >Documentos não vencidos</p>
                </div>
                <div class="icon">
                  <i class="fas fa-barcode"></i>
                </div>
    
                  {{-- <a href="/detalhe?cor_escolhida=verde" class="small-box-footer">Mais Info<i class="fas fa-arrow-circle-right"></i></a> --}}
           
              </div>
            </div>
            <!-- ./col -->

            <div class="col-lg-3 col-12">
              <!-- small box -->
              <div class="small-box bg-dark ">
                <div class="inner text-center">

                  <h3>€ {{number_format($preto_total,2,",",".")}}</h3>

                  
                  <p class="mb-2" style="font-size: 12pt"> <i class="fas fa-user"></i> {{$preto_cliente_quantidade}} clientes - <i class="fas fa-barcode"></i> {{$preto_fatura_quantidade}} documentos</p>
                  <p class="mb-2">Clientes Sinistrados</p>
                </div>
                <div class="icon">
                  <i class="fas fa-barcode"></i>
                </div>

                  {{-- <a href="/detalhe-preto" class="small-box-footer">Mais Info<i class="fas fa-arrow-circle-right"></i></a> --}}

              </div>
            </div>
            <!-- ./col -->


          </div>

          <div class="row">

            <div class="col-md-6  mt-2">
              <!-- DONUT CHART -->
                  <div class="card card-primary shadow">
                      <div class="card-body">
                         <canvas id="donutChart" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%;"></canvas>
                      </div>
                      <!-- /.card-body -->
                  </div>
                  <!-- /.card -->               
            </div>  


            <div class="col-md-6 card card-primary shadow">
                <div class="card-header  ">
                  <h3 class="card-title">Agenda da Semana</h3>

  
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                    <button type="button" class="btn btn-tool" data-card-widget="remove">
                      <i class="fas fa-times"></i>
                    </button>
                  </div>
                </div>
                <div class="card-body">
                  <a href="/home?dias=dia"> <button class="btn btn-primary mt-3" @if($dias=="dia") style="background-color: #a55312" @endif  type="button">Dia</button>    </a>
                  <a href="/home?dias=semana"> <button class="btn btn-primary mt-3" @if($dias=="semana") style="background-color: #a55312" @endif type="button">Semana</button>    </a>
                  <a href="/home?dias=mes"> <button class="btn btn-primary mt-3" @if($dias=="mes") style="background-color: #a55312" @endif type="button">Mês</button>    </a>
                  <div id="tabelaLeads"> 
  
                    <div class="table-responsive">    
                    <table id="tabelashow" style="width:100%"  class="table table-striped table-bordered table-hover">
                        <thead>
                            <tr style="text-align: center;">
                                {{-- <th>
                                  <div style="width: 50px;">
                                        Ação
                                  </div>
                                </th> --}}
                                <th>
                                    Data
                                </th>
  
                    
                                <th>
                                  <div style="width: 120px;">
                                    Cliente
                                  </div>
                                </th>
                                   
                                
                                <th>
                                  Valor
                                </th>

                                <th>
                                  Tipo de Agendamento
                                </th>
    
                            </tr>
                        </thead>
                        <tbody>
                            {{-- {{ $leads }} --}}
                                    
                              
                                        @foreach($ultimo_atrasado as $lead)
                                            <tr style="text-align: center; @if($lead->data_proxima_interacao <$ontem) background-color:RGB(255,228,214) @endif" >
                                                {{-- <td class="">
                                                    
                                
  
                                                        <a href="/relacionamento/{{ $lead->cliente_id }}/create"> <button  class="  btn btn-success btn-sm" title="Novo Relacionamento" type="button"><i class="fa fa-user-plus"  aria-hidden="true"></i></button></a>
                                                  
                              
                                                      
                                                </td> --}}
                                                <td> <span style="display:none;">{{$lead->data_marcada}}  -   </span>   {{ date( 'd', strtotime( $lead->data_marcada ) ).'/'.date( 'm', strtotime( $lead->data_marcada ) ).'/'.date( 'Y', strtotime( $lead->data_marcada ) )}}</td>
                              
                                                <td> {{ $lead->nome }} </td>
                                                <td>
                                                  @if($valor_total[$lead->registro_relacionamento_id])
                                                   {{$valor_total[$lead->registro_relacionamento_id]->total}} 
                                                  @endif
                                                </td>
                                                <td> {{ $lead->tipo_interacao }} </td>
                          
  
  
                                                
                                            </tr>
                                            @endforeach
  
                        </tbody>
                    </table>  
                    </div>
                    
                    
                </div> 
                <a href="/clientes/agenda?dias={{$dias}}"> <button class="btn btn-primary mt-3" type="button">Ver Todas</button>    </a>
                </div>
                <!-- /.card-body -->
              </div>
            
          </div>
                           
        {{-- </div>

        


    </div> --}}

  


   

    
            
 
    </div>

 </div>

</div>



<!-- ChartJS -->
<script src="../../plugins/chart.js/Chart.min.js"></script>




<script>
    
    $(function () {
  //-------------
    //- DONUT CHART -
    //-------------
    // Get context with jQuery - using jQuery's .get() method.
    var donutChartCanvas = $('#donutChart').get(0).getContext('2d')
    var donutData        = {
      labels: [
 
           'Risco de Bloqueio e/ou Sinistro (%)', 'Em Incumprimento (%)', 'Documentos não vencidos (%)', 'Clientes Sinistrados (%)'
           
      
      ],
      
      datasets: [
        {
          data: [
            
          @if($total_grafico>0)
              
              {{ number_format(($vermelho_total /$total_grafico)*100,0) }},{{ number_format(($amarelo_total/ $total_grafico)*100 ,0)}},{{ number_format( ($verde_total /$total_grafico)*100 ,0) }},{{ number_format( ($preto_total/$total_grafico)*100 ,0)}}
            
          @else


          @endif

          ],
          backgroundColor : ['#f0462e',  '#ffc000', '#55b03e','#343a40' ],
        }
      ]
    }
    var donutOptions     = {
      maintainAspectRatio : false,
      responsive : true,


    }
    //Create pie or douhnut chart
    // You can switch between pie and douhnut using the method below.
    new Chart(donutChartCanvas, {
      type: 'doughnut',
      data: donutData,
      options: donutOptions
    })

})
</script>



<!-- DataTables  & Plugins -->
<script src={{ asset('/plugins/datatables/jquery.dataTables.min.js') }}></script>
<script src={{ asset('/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js') }}></script>
<script src={{ asset('/plugins/datatables-responsive/js/dataTables.responsive.min.js') }}></script>
<script src={{ asset('/plugins/datatables-responsive/js/responsive.bootstrap4.min.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/dataTables.buttons.min.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/buttons.bootstrap4.min.js') }}></script>
<script src={{ asset('/plugins/jszip/jszip.min.js') }}></script>
<script src={{ asset('/plugins/pdfmake/pdfmake.min.js') }}></script>
<script src={{ asset('/plugins/pdfmake/vfs_fonts.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/buttons.html5.min.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/buttons.print.min.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/buttons.colVis.min.js') }}></script>
<!-- DataTables  & Plugins -->

<!-- Page specific script -->
<script>
$('#tabelashow').DataTable( {
    
      "paging": true,
      "lengthChange": false,
      "searching": false,
      "ordering": true,
      "info": true,
      "autoWidth": false,
      "responsive": true,
      "order": [[ 1, "desc" ]],
      // "buttons": [ "csv", "excel", "pdf", {"extend":"print","text":"Imprimir"}, {"extend":"colvis","text":"Colunas"}],
      "lengthMenu": [[5, 10, 25, 50, -1], [5, 10, 25, 50, "All"]],
                "bJQueryUI": true,
                "oLanguage": {
                    "sProcessing":   "Processando...",
                    "sLengthMenu":   "Registros _MENU_ ",
                    "sZeroRecords":  "Não foram encontrados resultados",
                    "sInfo":         " _START_ até _END_ de _TOTAL_ ",
                    "sInfoEmpty":    " 0 até 0 de 0 ",
                    "sInfoFiltered": "",
                    "sInfoPostFix":  "",
                    "sSearch":       "Buscar:",
                    "sUrl":          "",
                    "oPaginate": {
                        "sFirst":    "Primeiro",
                        "sPrevious": "Anterior",
                        "sNext":     "Seguinte",
                        "sLast":     "Último"
                    }
                }

} ).buttons().container().appendTo('#tabelashow_wrapper .col-md-6:eq(0)');
</script>

@endsection