@extends('adminlte.app')

@section('content')

    <div class="content-wrapper">
        @if ($message = Session::get('success'))
            <div class="alert alert-success">
                <p>{{ $message }}</p>
            </div>
        @endif
        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="container-fluid">
                @if (count($postos) > 1)
                    <div class="input-group input-group-lg">
                        <select name="postos" id="postos" class=" form-control" required>
                            <option value=""></option>
                            @foreach ($postos as $pt)
                                <option @if($posto && $posto->id == $pt->id) selected @endif value="{{ $pt->id }}">{{ $pt->nome_posto }}</option>
                            @endforeach
                        </select> 
                        <div class="input-group-append">
                            <button type="button" id="chama_modalPosto" class="btn btn-primary" data-toggle="modal" data-target="#postoModal" >
                                <i class="fas fa-search"></i>
                            </button>
                        </div>
                    </div>
                @else
                    <h2 class="">
                        {{ $posto->nome_posto }}
                    </h2>
                @endif
            </div><!-- /.container-fluid -->
        </div>
        <!-- /.content-header -->

        <div class="row px-3 mr-0 text-sm">
            <div class="col-md-2 ">
                {{-- Dados do Posto --}}
                <x-postoshow.dados-posto :posto="$posto" />

                {{-- Informações do contrato --}}
                @if ($permissao->exibir_informacao_contrato)
                    <x-postoshow.dados-contrato :posto="$posto" />
                @endif
            </div>
            <div class="col ">
                {{-- Tabela preços --}}
                <x-postoshow.tabela-precos :posto="$posto" :dias="$dias" :ordem-produtos="$ordemProdutos" :semana-atual="$semanaAtual" :ultimo-preco="$ultimoPreco" :desconto-check="$descontoCheck" :precos="$precos" :page="$page" />
                
                <x-postoshow.graf_report_mensal_vendas_litros :vendas-litros="$vendasLitros" :variacoes="$variacoes" :coresVariacao="$coresVariacao" tipo="Litros" />
                <x-postoshow.tabela-produtos-litros :produtos="$produtos" :mesAnos="$mesAnos" :ano=0 tipo="Litros" />
                <x-postoshow.tabela-produtos-litros :produtos="$produtosAnoAnterior" :mesAnos="$mesAnosAnterior" :ano=-1 tipo="Litros" />

                <x-postoshow.graf_report_mensal_vendas_litros :vendas-litros="$vendasEuros" :variacoes="$variacoesEuros" :coresVariacao="$coresVariacaoEuros" tipo="Euros" />
                <x-postoshow.tabela-produtos-litros :produtos="$familias" :mesAnos="$mesAnos" :ano=0 tipo="Euros" />
                <x-postoshow.tabela-produtos-litros :produtos="$familiasAnoAnterior" :mesAnos="$mesAnosAnterior" :ano=-1 tipo="Euros" />
                

                <x-postoshow.tabela-sondagens :permissao="$permissao" :posto="$posto" :dias="$dias" :ordem-produtos="$ordemProdutos" :config-cores="$configCores" />
                <x-postoshow.tabela-agendamentos :posto="$posto" :dias="$dias" :ordem-produtos="$ordemProdutos" />
                <x-postoshow.tabela-combustiveis :posto="$posto" :ordem-produtos="$ordemProdutos" />
            </div>
            <div class="col-md-2 ">
                {{-- Combustiveis --}}
                {{-- <x-postoshow.combustiveis :posto="$posto" :ordem-produtos="$ordemProdutos"/> --}}

                {{-- Bombas --}}
                <x-postoshow.bombas :posto="$posto" />

            </div>

        </div>
    </div>

    <x-forms.b-s-modal nome-modal="postoModal" destino-id="postos" titulo-modal="Postos" id-tabela="tabelaPostos" nome-item="nome_posto" :dados="$postos" />



    <!-- ChartJS -->
    <script src="../../plugins/chart.js/Chart.min.js"></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>

 
    <!-- Page specific script -->

    <script>
        var table = $('.tabelashow').DataTable( {
            
            "paging": true,
            "lengthChange": false,
            "searching": false,
            "ordering": false,
            "info": true,
            "autoWidth": false,
            "responsive": true,
            "buttons": [ "csv", "excel", "pdf", {"extend":"print","text":"Imprimir"}, {"extend":"colvis","text":"Colunas"}],
            "lengthMenu": [[8, 10, 25, 50, -1], [8, 10, 25, 50, "All"]],
                        "bJQueryUI": true,
                        "oLanguage": {
                            "sProcessing":   "Processando...",
                            "sLengthMenu":   "Registros _MENU_ ",
                            "sZeroRecords":  "Não foram encontrados resultados",
                            "sInfo":         "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                            "sInfoEmpty":    "Mostrando de 0 até 0 de 0 registros",
                            "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>


    {{-- <script >
        
        
        $("#telefone").mask("(00) 0000-0000");
        $("#celular").mask("(00) 00000-0000");
    
        $('.money').mask('#.##9,99', { reverse: true });   
    
    </script> --}}

    <script src={{ asset('/plugins/jquery/jquery.min.js') }}></script>
    <script src={{ asset('/plugins/bootstrap/js/bootstrap.bundle.min.js') }}></script>

    {{-- Consultar Posto --}}
    <script>
        var valOriginal = @if($posto) {{ $posto->id }} @else '' @endif;
        $('#postos').change(function(){
            var url = "/postos/";
            if($(this).val() != ''){

                url += $(this).val();
                window.location.replace(url);
                // var url = window.location.href;
                // if(url.indexOf("?") > 0) {
                //     url = url.substring(0, url.indexOf("?"));
                // } 
                // url += "?postos=" + $(this).val();
                // window.location.replace(url);
            }
        })

        $(document).ready(function(){
            $('#postoModal').on('hide.bs.modal', function(e){
                if($('#postos').val() != '' && $('#postos').val() != valOriginal){
                    $('#postos').trigger('change');

                }
            })
        })
    </script>


<script>
    $('#combustiveis').on('change', function (e) {
        var $optionSelected = $("option:selected", this);
        $optionSelected.tab('show')
        $optionSelected.removeClass('active')
      });

      $('#bombas').on('change', function (e) {
        var $optionSelected = $("option:selected", this);
        $optionSelected.tab('show')
        $optionSelected.removeClass('active')
      });

</script>

@endsection