@extends('layouts.admin')
@section('content')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.full.min.js"></script>

<a href="{{ route('admin.commande_fournisseur.index') }}"> Retour à la liste </a>
<div class="row">	
    <div class="col-xl-12">
        <div class="card">
            <div class="card-body border-0 bg-light">
                <h3> Bordereau de Livraison </h3> 
            </div>
            <!--div class="card-body pb-3 transaction-details d-flex flex-wrap justify-content-between align-items-center">
                <a class="btn btn-primary m-2" type="button" data-bs-toggle="modal" data-bs-target="#nouveau-bl"><i class="uil-clipboard-notes"></i> Voire la commande</a>
                
                @if($bl_chauffeur->fk_statut == 4)
                    <a class="btn btn-primary m-2" type="button" data-bs-toggle="modal" data-bs-target="#date-reception"><i class="uil-check"></i> Classer réceptionné</a>
                @endif 

        
                @if($bl_chauffeur->fk_statut == 5)
                    <form  action="{{ route('admin.commande_fournisseur.nonrecu') }}" method="POST">
                        @csrf    
                        <input type="hidden" name="id" value="{{ $bl_chauffeur->rowid }}" />
                        <input type="submit" class="btn btn-primary" value="Classer Non Reçu" />
                    </form>
                @endif 
            </div -->
        </div>
    </div>
      <!-- Profile -->
        <div class="card bg-primary">
            <div class="card-body profile-user-box">
                <div class="row">
                    <div class="col-sm-8">
                        <div class="row align-items-center">
                            <div class="col-auto">
                                <div class="avatar-lg">
                                    <img src="/img/supplier.webp" alt="" class="rounded-circle img-thumbnail">
                                </div>
                            </div>
                            <div class="col">
                                <div>
                                    <h4 class="mt-1 mb-1 text-white">{{$bl_chauffeur->chauffeur ?? '' }}</h4>
                                    <p class="font-13 text-white-50"> Chauffeur </p>

                                    <ul class="mb-0 list-inline text-light">
                                        <li class="list-inline-item" style="margin-right: 30px;">
                                            <h5 class="mb-1">{{ $bl_chauffeur->zone_adresse ?? '' }}</h5>
                                            <p class="mb-0 font-13 text-white-50">Zone</p>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div> <!-- end col-->
              
                    <div class="col-sm-4">
                        <div class="text-center mt-sm-0 mt-3 text-sm-end">
                            
                            <div id="tooltip-container2">
                                <button 
                                    type="button" 
                                    data-bs-toggle="modal" 
                                    data-bs-target="#modifier-fournisseur" 
                                    class="btn btn-light" 

                                    id="btn-modifier-fournisseur"
                                    data-bl_chauffeur="{{ $bl_chauffeur->chauffeur }}"
                                    data-blchauffeur_date_livraison="{{ $bl_chauffeur->date_livraison }}"
                                    data-bl_chauffeur_commercial="{{ $bl_chauffeur->commericial }}"
                                    data-bl_chauffeur_banque="{{ $bl_chauffeur->banque }}"
                                    onclick="modiferFournisseur(event.target)"
                                >
                                    <i class="mdi mdi-account-edit me-1"></i> Modifier 
                                </button>
                            </div>
                        </div>
                    </div> <!-- end col-->
                </div> <!-- end row -->

            </div> <!-- end card-body/ profile-user-box-->
        </div><!--end profile/ card -->
    <div class="col-xl-3 col-xxl-3 col-lg-3 col-sm-3">
        <div class="widget-stat card">
            <div class="card-body p-4">
                <div class="media ai-icon  justify-content-center">
                    <span class="me-3 bgl-primary text-primary">
                            <i class="uil-user" style="font-size: 30px;"></i> 
                    </span>
                    <div class="media-body">
                        <p class="mb-1">Commerciale</p>
                        <span class="badge bg-success p-1 font-weight-bold text-capitalize">{{ $bl_chauffeur->user->name ?? '' }}</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-xl-3 col-xxl-3 col-lg-3 col-sm-3">
        <div class="widget-stat card">
            <div class="card-body p-4">
                <div class="media ai-icon">
                    <span class="me-3 bgl-warning text-warning">
                        <i class="uil-schedule" style="font-size: 30px;"></i>
                    </span>
                    <div class="media-body">
                        <p class="mb-1">Date Livraison</p>
                        <span class="badge bg-secondary p-1">{{ Carbon\Carbon::parse($bl_chauffeur->date_livraison)->format('d/m/Y') ?? '' }} </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-xl-3 col-xxl-3 col-lg-3 col-sm-3">
        <div class="widget-stat card">
            <div class="card-body  p-4">
                <div class="media ai-icon">
                    <span class="me-3 bgl-danger text-danger">
                        <i class="uil-notes" style="font-size: 30px;"></i>
                    </span>
                    <div class="media-body">
                        <p class="mb-1">Statut</p>
                       
                            @if($bl_chauffeur->fk_statut == 0)
                                <span class="badge bg-secondary p-1">   
                                    Brouillon
                                </span>
                            @elseif($bl_chauffeur->fk_statut == 1)
                                <span class="badge bg-secondary p-1">   
                                    Validé
                                </span>
                            @elseif($bl_chauffeur->fk_statut == 2)
                                <span class="badge bg-secondary p-1">   
                                    Approuvé
                                </span>
                            @elseif($bl_chauffeur->fk_statut == 3)
                                <span class="badge bg-warning p-1">   
                                    Commandé
                                </span>
                            @elseif($bl_chauffeur->fk_statut == 4)
                                <span class="badge bg-success p-1">   
                                    Validé et expedié
                                </span>
                            @elseif($bl_chauffeur->fk_statut == 5)
                                <span class="badge bg-success p-1">   
                                    Produit Reçu
                                </span>
                            @endif 
                      
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-xl-3 col-xxl-3 col-lg-3 col-sm-3">
        <div class="widget-stat card">
            <div class="card-body p-4">
                <div class="media ai-icon">
                    <span class="me-3 bgl-success text-success">
                        <i class="uil-money-stack" style="font-size: 30px;"></i>
                    </span>
                    <div class="media-body">
                        <p class="mb-1">Frais de Livraison</p>
                        <span class="badge bg-primary" style="font-size: 16px;"> {{ number_format($bl_chauffeur->total_ttc, 0, '', ' ') ?? ''}} FCFA </span> 
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-xl-12">
        <div class="card">
            <div class="card-body pb-3">
                <div class="row align-items-center">
                    <div class="col-xl-4 mb-1">
                        <p class="mb-2">Réf. Bon Livraison</p>
                        <h2 class="mb-0">#{{ $bl_chauffeur->ref ?? '' }} </h2>
                    </div>
                    <div class="col-xl-8 d-flex flex-wrap justify-content-between align-items-center">
                        <div class="d-flex me-3 mb-3 ms-2 align-items-start">
                            <i class="fa fa-phone scale-2 me-4 mt-2"></i>
                            <div>
                                <p class="mb-2">Date Livraison</p>
                                <h4 class="mb-0">{{ Carbon\Carbon::parse($bl_chauffeur->date_commande)->format('d/m/Y') ?? '' }} </h4>
                            </div>
                        </div>

                        <div class="d-flex me-3 mb-3 ms-2 align-items-start">
                            <i class="fa fa-phone scale-2 me-4 mt-2"></i>
                            <div>
                                <p class="mb-2">Date Réception</p>
                                <h4 class="mb-0">{{ ($bl_chauffeur->date_reception != NULL  ) ? Carbon\Carbon::parse($bl_chauffeur->date_reception)->format('d/m/Y') : 'Pas encore reçu !' }} </h4>
                            </div>
                        </div>
                    
                        <div class="d-flex mb-3">
                            <a type="button" data-bs-toggle="modal" data-bs-target="#modifier-commande" class="btn btn-warning  m-1"><i class="uil-cog"></i>Modifier</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="card-body pb-3 transaction-details d-flex flex-wrap justify-content-between align-items-center">
                <div class="user-bx-2 me-3 mb-3">
                    <i class="uil-notes scale-2 me-1 mt-1 text-primary" style="font-size: 18em;"></i>
                    <br /> 
                
                </div>
               
                <div class="me-3 mb-3">
                    <p class="mb-2">Zone ou Region</p>
                    <h4 class="mb-0">{{ $bl_chauffeur->zone ?? '' }} </h4>
                </div>
            
                <div class="amount-bx mb-3">
                    <i class="fas fa-dollar-sign"></i>
                    <div>
                        <p class="mb-1">Frais de Livraison</p>
                        <span class="">
                            <h4 class="mb-0 badge bg-danger p-1">{{ number_format($bl_chauffeur->frais_livraison, 0, '', ' ') ?? ''}} FCFA</h4>
                        </span>

                    </div>
                </div>

                <div class="me-3 mb-3">
                    <p class="mb-2">Statut  </p>
                        @if($bl_chauffeur->fk_statut == 0)
                            <span class="badge bg-secondary p-1">   
                                Brouillon
                            </span>
                        @elseif($bl_chauffeur->fk_statut == 1)
                            <span class="badge bg-secondary p-1">   
                                Validé
                            </span>
                        @elseif($bl_chauffeur->fk_statut == 2)
                            <span class="badge bg-secondary p-1">   
                                Approuvé
                            </span>
                        @elseif($bl_chauffeur->fk_statut == 3)
                            <span class="badge bg-warning p-1">   
                                Commandé
                            </span>
                        @elseif($bl_chauffeur->fk_statut == 4)
                            <span class="badge bg-success p-1">   
                                Validé et expedié
                            </span>
                        @elseif($bl_chauffeur->fk_statut == 5)
                            <span class="badge bg-success p-1">   
                                <strong> Produit Reçu </strong> 
                            </span>
                        @endif 
                </div>
            </div>
        </div>
    </div>

    <div class="card">
        <div class="card-body">
            <div class="card-header d-sm-flex d-block border-0 pb-0">
                <div class="me-auto mb-sm-0 mb-4">
                    <h4 class="fs-20 text-black">Produit(s) Expédié(s)</h4>
                </div>
                    @if($bl_chauffeur->fk_statut == 0 || $bl_chauffeur->fk_statut == NULL)
                        <a type="button" data-bs-toggle="modal" data-bs-target="#ajouter-produit" class="btn btn-primary btn-rounded btn-md mx-3">+Ajouter un Produit</a>
                    @endif 
                </div>
            <div class="table-responsive">
                <table class="table table-hover table-centered mb-0">
                    <thead>
                        <tr>
                            <th>Produit</th>
                            <th>Quantité</th>
                          
                            @if($bl_chauffeur->fk_statut == 0 || $bl_chauffeur->fk_statut == NULL)
                                <th>Action</th>
                            @endif 
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($bl_chauffeur->blchauffeurdet as $bl)
                            <tr>
                                <td>{{ $bl->label ?? '' }} </td>
                                <td>{{ $bl->qte }}</td>
                             
                           
                                @if($bl_chauffeur->fk_statut == 0 || $bl_chauffeur->fk_statut == NULL)
                                    <td>   
                                        <div class="dropdown pb-3">
                                            <a href="javascript:void(0);" class="btn-link" data-bs-toggle="dropdown" aria-expanded="false">
                                                <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z" stroke="#575757" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                                                    <path d="M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z" stroke="#575757" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                                                    <path d="M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z" stroke="#575757" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                                                </svg>
                                            </a>
                                            <div class="dropdown-menu dropdown-menu-right"> 
                                                <a class="dropdown-item" href="{{ route('admin.bl_chauffeur.produit.modifier', $bl->rowid) }}"
                                                >Modifier</a>
                                                <form action="{{ route('admin.bl_chauffeurdet.produit.destroy', $bl->rowid) }}" method="POST" onsubmit="return confirm('Etes-vous sûr de vouloir le supprimer ?');" style="display: inline-block;">
                                                    <input type="hidden" name="_method" value="DELETE" />
                                                    <input type="hidden" name="_token" value="{{ csrf_token() }}" />
                                                    <button type="submit" class="dropdown-item">
                                                       Supprimé
                                                    </button> 
                                                </form>
                                            </div>
                                        </div>
                                    </td>
                                @endif 
                            </tr>
                        @endforeach
                    </tbody>
                    <tfoot>
                   
                    </tfoot>
                </table>
                <div class="mt-2 transaction-details d-flex flex-wrap justify-content-between align-items-center" style="">
                    
                    @if($bl_chauffeur->fk_statut == 0 || $bl_chauffeur->fk_statut == NULL )
                        <form  action="{{ route('admin.bl_chauffeur.valider') }}" method="POST">
                            @csrf
                            <input type="hidden" name="id" value="{{ $bl_chauffeur->rowid }}" />
                            <input type="submit" class="btn btn-primary" value="Valider et Approuver" />
                        </form>
                    @else 
                        <form  action="{{ route('admin.bl_chauffeur.brouillon') }}" method="POST">
                            @csrf
                            <input type="hidden" name="id" value="{{ $bl_chauffeur->rowid }}" />
                            <input type="submit" class="btn btn-primary" value="Retour en brouillon" />
                        </form>
                    @endif

                    <a href="{{ route('admin.bl_chauffeur.pdf', ['id' => $bl_chauffeur->rowid]) }}" target="_blank"   type="submit" class="btn btn-primary"> Générer un Bon de Livraison </a> 
                </div>
            </div> <!-- end table responsive-->
        </div> <!-- end col-->
    </div> <!-- end row-->
    
    
    <div class="card">
        <div class="card-body">
            <div class="card-header d-sm-flex d-block border-0 pb-0">
                <div class="me-auto mb-sm-0 mb-4">
                    <h4 class="fs-20 text-black">Evénement(s)</h4>
                </div>
            </div>
            <div class="table-responsive">
                <table class="table table-hover table-centered mb-0">
                    <thead>
                        <tr>
                            <th>Date</th>
                            <th>Objet</th>
                            <th>Opération</th>
                            <th>Utilisateur</th>
                            <th>Description</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($activites as $a)
                            <tr>
                                <td>{{ $a->date }} </td>
                                <td>{{ $a->objet }} </td>
                                <td><span class="badge bg-primary">{{ $a->operation }} </span></td>
                                <td>{{ App\User::find($a->user_id)->name }}</td>
                                <td>{{ $a->description }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div> <!-- end table responsive-->
        </div> <!-- end col-->
    </div> <!-- end row-->
    
        @include('admin.bl_chauffeur.modal.ajouter-produit')

        @include('admin.bl_chauffeur.modal.ajouter-ligne')

        @include('admin.bl_chauffeur.modal.modifier-bl_chauffeur')

</div>

<script> 
    function modiferFournisseur(e){
        $('#fournisseur_nom').val($(e).data("fournisseur_nom_val"));
        $('#fournisseur_adresse').val($(e).data("fournisseur_adresse_val"));
        $('#fournisseur_telephone').val($(e).data("fournisseur_telephone_val"));
  
    }

    function modiferCommandeFournisseur(e){
        $('#fournisseur_nom').val($(e).data("fournisseur_nom_val"));
        $('#fournisseur_telephone').val($(e).data("fournisseur_telephone_val"));
        $('#fournisseur_adresse').val($(e).data("fournisseur_adresse_val"));
    }

    function modiferProduit(e){
        $('#fournisseur_nom').val($(e).data("fournisseur_nom_val"));
        $('#fournisseur_telephone').val($(e).data("fournisseur_telephone_val"));
        $('#fournisseur_adresse').val($(e).data("fournisseur_adresse_val"));
    }

</script> 
@endsection