@extends('layout.padrao')
@section('title', '  Trade Recaps')

@section('pesquisa')
    <form class="form-inline w-100 search-listas-int" method="GET" action="{{ route('listTradeRecaps','trade_recaps') }}">
        <input class="form-control mr-sm-2 text-primary" type="search" placeholder="Search for Client Name" name="trade_recaps">   
        <button class="btn btn-outline-light " type="submit">Pesquisar</button>
    </form> 
@endsection

@section('content')

    <!--Botão Novo-->
    @can('create', App\Usuario::class)
        @include('include.btn_adicionar',["btn" => "tradeRecaps"])
    @endcan

    <div class="card-list">
    
    @foreach($registers as $item)
    
            <div class="row list folha-interna shadow p-3 mb-5 bg-white rounded">
                <div id="map-{{$item->id}}" class='col-lg-4 col-sm-12 col-md-12 '>
                    <h4>TRADE  {{$item->id}}</h4>
                </div>
                <div class='col-lg-4 col-sm-12 col-md-12 text-right'> 
                    <span class='stronger'>Actions: </span>                
                    @can('update', App\Usuario::class)
                        <a class="icone-padding" href="{{ route('editTradeRecaps', $item->id) }}" data-toggle="tooltip" data-placement="top" title="Edit"><i class="fas fa-pencil-alt"></i></a>                          
                    @endcan
                    @can('delete', App\Usuario::class)
                        <a class="icone-padding" data-catid={{$item->id}} data-toggle="modal" data-target="#delete" data-toggle="tooltip" data-placement="top" title="Delete">
                            <i class="fas fa-trash-alt"></i>
                        </a>
                    @endcan
                    <a class="icone-padding" href="{{ route('editTradeRecaps', $item->id) }}" alt="Clonar"data-toggle="tooltip" data-placement="top" title="Clone"><i alt="Clonar" class="fas fa-clone"></i></a>  
                                        
                </div>
                @foreach($porcents as $porcent)
                    @if($item->id == $porcent->id)
                    <div class="col-lg-4 col-sm-12 col-md-12 ">
                        <div class="progress">                                        
                                <div class="progress-bar progress-bar-striped  {{$porcent->colors}}" role="progressbar" style="width: {{$porcent->stats}}%;" 
                                    aria-valuenow="{{$porcent->stats}}" aria-valuemin="0" aria-valuemax="100">{{$porcent->stats}} %
                                </div>
                        
                        </div>
                    </div>
                    @endif
                @endforeach
                <div class="row w-100 col-lg-12 col-sm-12 col-md-12">
                    <div class="table-responsive tableMenor">
                        <table id='table' class="table table-striped table-sm">
                            <thead>
                                <tr>                                    
                                    <th>Client</th>
                                    <th>Destination Country</th>
                                    <th>Product</th>
                                    <th>Price m/ton Total</th>
                                    <th>Quantity (tons)</th>
                                    <th>Trade Status</th>
                                    <th>Contract Status</th>
                                </tr>
                            </thead>
                            <tbody>
                                    <tr class={{ $item->status == 'Cancel' ? 'alert-danger':''}}>   
                                        <td>{{ $item->clients_id ?? '-'}}</td>
                                        <td>{{ $item->countries_id ?? '-' }}</td>
                                        <td>{{ $item->platforms->id ?? '-' }}</td>
                                        <td>{{ $item->priceMtonTotal ?? '-'}}</td>
                                        <td>{{ $item->totalQtyT ?? '-'}}</td>
                                        <td>{{ $item->status ?? '-'}}</td>
                                        <td><i class="fa fa-file-contract fa-lg" style="color: {{ (empty($item->signedContractReceivedOn) ? (empty($item->contractsSenttoBuyer) ? '#cccccc' : '#FFCA2C') :'#20A902') }}"></i></span></td>
                                    </tr>
                                    <tr> 
                                        <td colspan="6">
                                        @if(count($item->loading_requests)> 0 )
                                            <span  data-toggle="collapse" data-target=".loadinglist-{{$item->id}}" class="collapsed active w-100">
                                                <a style="width:100%; display: flex;" href="#map-{{$item->id}}">
                                                    <p class="w-100" style="">Loading Requests</p>  
                                                    <i class="text-right inter-arrow fa fa-chevron-down fa-lg"></i></a>
                                                </span>
                                            <div  class="loadinglist-{{$item->id}} collapse">

                                            
                                            <div class="table-responsive tableMenor">
                                                <table class="table table-striped table-sm">
                                                    <thead>
                                                        <tr>
                                                            <th>Vessel</th>
                                                            <th>Booking</th>
                                                            <th>Inttra Ref</th>
                                                            <th></th>
                                                            <th></th>
                                                            <th></th>
                                                            <th></th>

                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @foreach($item->loading_requests as $load)
                                                            <tr>
                                                                <td>{{ $load->vessel }}</td>
                                                                <td>{{ $load->booking }}</td>
                                                                <td>{{ $load->InttraRef }}</td>
                                                                <td><i class="fa fa-file-contract fa-lg" style="color: {{ (empty($item->signedContractReceivedOn) ? (empty($item->contractsSenttoBuyer) ? '#cccccc' : '#FFCA2C') :'#20A902') }}"></i></span></td>
                                                                <td><i class="fa fa-ship fa-lg " style="color:#ccc;"></i></span></td>
                                                                <td><i class="fa fa-edit fa-lg " style="color:#ccc;"></i></span></td>
                                                                <td><i class="fa fa-check-circle fa-lg" style="color:#ccc;"></i></span></td>
                                                            </tr>
                                                        @endforeach
                                                    </tbody>                                                    
                                                </table>
                                            </div>
                                        @endif
                                        </td>

                                    </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

    @endforeach
<script>
$(".collapsed").click(function(){ 
    $(this).toggleClass("active");
});

</script>

    </div>
    <div align="center"  class="d-flex justify-content-center">
        {{-- {{ $registers->links() }} --}}
    </div>

    <!-- Delete Model -->
    @include('include.modal_deletar', ["rota" => "tradeRecaps"])
        
   

@endSection