@extends('layout.padrao')
@section('title', 'List - Stuffing Terminals')

@section ('content')

<style>
    .modal-footer{
        padding-bottom: 17px !important;
    }
</style>
    
    <div class="col col-lg-12 col-sm-12 col-md-12">
        <div class="row folha-branca-contornada rounded"> 
            <form class="form-inline2 w-100" method="GET" action="{{ route('listStuffingTerminalRate','stuffingTerminalRate') }}" id="searchStuffingForm" style="display: none;">
                <h5 style="padding: 5px 29px;">Search For:</h5>    
                <div class="col col-lg-12 col-sm-12 col-md-12">
                    <div class="col col-lg-4 form-group ">
                        {!! Form::label('stuffing_terminal_id', 'Stuffing Terminal:', [ 'class' => 'w-100 control-label']) !!}
                        {!! Form::select('stuffing_terminal_id[]', $select['stuffingTerminal'] , old('stuffing_terminal_id', $returnSearchSelect['stuffingTerminal']),  ['class' => 'stuffingTerminal form-control','multiple'=>'multiple']) !!} 
                    </div>
                    <div class="col col-lg-4 form-group ">
                        {!! Form::label('clients_id', 'Client', [ 'class' => 'w-100 control-label', ]) !!} 
                        {!! Form::select('clients_id[]', $select['clients'], old('clients_id', $returnSearchSelect['clients']) , ['class' => 'clients form-control','multiple'=>'multiple']) !!}
                    </div>
                    <div class="col col-lg-4 form-group ">
                        {!! Form::label('loading_ports_id', 'Loading Port', [ 'class' => 'w-100 control-label', ]) !!} 
                        {!! Form::select('loading_ports_id[]', $select['loadingPorts'], old('loading_ports_id', $returnSearchSelect['loadingPorts']), ['class' => 'loadingPorts form-control','multiple'=>'multiple']) !!} 
                    </div>
                </div>
                <div class="col col-lg-12 col-sm-12 col-md-12">
                    <div class="col col-lg-3 form-group ">
                        {!! Form::label('platforms_id', 'Product', [ 'class' => 'w-100 control-label', ]) !!} 
                        {!! Form::select('platforms_id[]', $select['platforms'], old('platforms_id', $returnSearchSelect['platforms']), ['class' => 'platforms form-control','multiple'=>'multiple']) !!} 
                    </div>
                    <div class="col col-lg-3 form-group ">
                        {!! Form::label('tank_owners_id', 'Tank Owner', [ 'class' => 'w-100 control-label', ]) !!} 
                        {!! Form::select('tank_owners_id[]', $select['tank_owners_id'], old('tank_owners_id', $returnSearchSelect['tank_owners_id']), ['class' => 'tank_owners_id form-control','multiple'=>'multiple']) !!} 
                    </div>
                    <div class="col col-lg-3 form-group ">
                        {!! Form::label('container_types_id', 'Container Type/Equipment', [ 'class' => 'w-100 control-label', ]) !!} 
                        {!! Form::select('container_types_id[]', $select['containerTypes'], old('container_types_id', $returnSearchSelect['containerTypes']), ['class' => 'containerTypes form-control' , 'id' => 'containerTypes', 'multiple'=>'multiple']) !!}  
                    </div>
                
                    <div class="col col-lg-3 form-group ">
                        {!! Form::label('packing_types_id', 'Cargo Type', [ 'class' => 'w-100 control-label', ]) !!} 
                        {!! Form::select('packing_types_id[]', $select['packingType'], old('packing_types_id', $returnSearchSelect['packingType']), ['class' => 'packingType form-control' , 'id' => 'packingType', 'multiple'=>'multiple']) !!}  
                    </div>    
                </div>
                <div class="col col-lg-12 col-sm-12 col-md-12">            
                    <div class="col col-lg-2 form-group ">
                        {!! Form::label('tankValidadeFrom', 'Valid From', [ 'class' => 'w-100 control-label', ]) !!} 
                        {!! Form::date('tankValidadeFrom', null , ['class' => 'form-control ', 'min' => '2019-01-01', 'max' => '2080-01-01']) !!}    
                    </div>
                    <div class="col col-lg-2 form-group ">
                        {!! Form::label('tankValidadeTo', 'Valid To', [ 'class' => 'w-100 control-label', ]) !!} 
                        {!! Form::date('tankValidadeTo', null , ['class' => 'form-control ', 'min' => '2019-01-01', 'max' => '2080-01-01']) !!}   
                    </div>
                </div>
                <div class="col col-lg-12 form-group " style="text-align: right; padding: 12px 30px 0px 0px; z-index: 7">
                    <button class="btn btn-primary " type="submit" >Search</button>
                    <button onclick="if(tipo){window.location = window.location.pathname+'?tipo=clear'+tipo}else{window.location = window.location.pathname};" id="searchclearSelect2" class="btn btn-primary " type="button">Clear Filter</button>
                </div>
            </form> 
            <!-- Botão para recolher a pesquisa -->
            <div class="col" id="colunaPesquisa" style="text-align: center; margin-top: 1px; z-index: 2">
                <div class="btn" id="dropSearch">
                    <div title="Open Search" style="color: #0d6397 !important; font-size: 1.1 rem;">
                        <span id="spanSearch" style="margin-bottom:-23px">Search</span> </br><i id="openBtn" class="fas fa-chevron-down"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @include('include.filtro_result')
    <div class="col col-lg-12 col-sm-12 col-md-12 input-group control-group" style="text-align: right; padding: 13px 50px 0 0;margin-bottom:20px">
    @can('create', App\Usuario::class)
        <button onclick="location.href='{{ route('createStuffingTerminalRate') }}'"  class="btn btn-padrao" style="margin-right:19px">+ New</button>
    @endcan
        <a title="Export This Consult" href="{{ action('StuffingTerminalRateController@index', ['tipo' => 'export']) }}" style='width:50px;' class="btn btn-padrao" >
            <i class="fas fa-download"></i>
        </a>
    </div>
    <div class="wrapper">
        <div class="table-responsive tableMenor">
            @include('stuffingTerminalRate.table')        
        </div>
    </div>
    <div align="center"  class="d-flex justify-content-center">
        {{ $registers->links() }}
    </div>
        @include('bibliotecas.floattheadOverflow')
        <!-- Delete Model -->
        @include('include.modal_deletar', ["rota" => "Stuffing Terminal Rate"])
        @include('stuffingTerminalRate.script')

    <script>
        $(document).on('click', '#dropSearch', function (click) {
            var formulario = document.getElementById("searchStuffingForm");
            var seta = document.getElementById("dropSearch");
            var spanSearch = document.getElementById("spanSearch");
            var icone = document.getElementById("openBtn");
            var colunaPesquisa = document.getElementById("colunaPesquisa");

            if (formulario.style.display == "none") {
                formulario.style.display = "block";
                spanSearch.style.display = "none";
                icone.style.transition = "0.3s";
                icone.style.transform = "rotate(180deg)";
                colunaPesquisa.style.marginTop = "-42px";
            } else {
                formulario.style.display = "none";
                spanSearch.style.display = "block";
                icone.style.transition = "0.3s";
                icone.style.transform = "rotate(0deg)";
                colunaPesquisa.style.marginTop = "1px";
            }
        })

        function clearSelect2(){
            $("#stuffingTerminal").val(null).trigger('change');

        }
        $(function(){
            $("#searchclearSelect2").click(function(){
                $('[name="tankValidadeTo"]').val(null);
                $('[name="tankValidadeFrom"]').val(null);
                $(".stuffingTerminal").select2('val', 'All');
                $(".clients").select2('val', 'All');
                $(".loadingPorts").select2('val', 'All');
                $(".platforms").select2('val', 'All');
                $(".tank_owners_id").select2('val', 'All');
                $(".containerTypes").select2('val', 'All');
                $(".packingType").select2('val', 'All');
                $("#searchStuffingForm").submit();
            });
        });
    </script>
@endsection