@extends('layouts.client') 
@php $page_title = 'Mon espace'; @endphp 
@section('meta-title','Mon panier') 
@section('meta-keywords','') @section('meta-description','') 
@section('content') 
<div class="row">
    <div class="col-md-11">
        @if($produits->count() > 0)
            <div class="row">
                <div class="col-md-9">
                    <div class="panel table-content table-responsive">
                        <table class="table">
                            <thead>
                                <tr bgcolor="#000" style="color: white">
                                    <th width="130" class="text-center">{!! lang('Article') !!}</th>
                                    <th>{!! lang('Désignation') !!}</th>
                                    <th width="150">{!! lang('Prix indicatif public') !!}</th>
                                    <th width="100">{!! lang('Prix Pipcke') !!}</th>
                                    <th width="50">{!! lang('Quantité') !!}</th>
                                    <th width="150">{!! lang('Frais de livraison') !!}</th>
                                    <th width="120">{!! lang('Prix total TTC') !!}</th>
                                    <th width="10"></th>
                                </tr>
                            </thead>
                            <tbody>
                                @php
                                    // $total = 0;
                                    // $quantite = 0;
                                @endphp 
                                @foreach( $produits as $ligne_panier )
                                    <tr>
                                        <td class="text-center">
                                            <a href="{{ $ligne_panier->produit->source }}" target="_blank" style="background: url('{{ asset( $ligne_panier->produit->photo ) }}') no-repeat 50% 50%; background-size: contain; display: block; height: 80px ;width:100%"></a>
                                        </td>
                                        <td class="pt-3">
                                            <div>{{ $ligne_panier->produit->nom }}</div>
                                            <div>{{ $ligne_panier->produit->reference }}</div>

                                            <div class="">
                                                @if($ligne_panier->produit->largeur)
                                                L. {{ $ligne_panier->produit->largeur }}cm 
                                                @endif

                                                @if($ligne_panier->produit->hauteur)
                                                x 
                                                H. {{ $ligne_panier->produit->hauteur }}cm 
                                                @endif

                                                @if($ligne_panier->produit->profondeur)
                                                x 
                                                P. {{ $ligne_panier->produit->profondeur }}cm
                                                @endif
                                            </div>

                                        </td>
                                        <td class="text-center pt-40">
                                            {{ $ligne_panier->produit->prix }} € 
                                            @php 
                                            // $total+=$ligne_panier->produit->prix;  
                                            @endphp
                                        </td>
                                        <td class="text-center pt-40">{{ $ligne_panier->prix_pipcke ?? '?' }}</td>
                                        <td class="text-center pt-40" data-ligne_panier_id="{{ $ligne_panier->id }}">
                                            <input type="number" class="text-center no-borders bg-light w-100" name="quantite" min="0" max="1000" value="{{$ligne_panier->quantite}}">
                                            @php 
                                            // $quantite+=$ligne_panier->quantite;  
                                            @endphp
                                        </td>
                                        <td class="text-center pt-40">{{ $ligne_panier->frais_livraison ?? '?' }}</td>
                                        <td class="text-center pt-40">{{ $ligne_panier->total >0?$ligne_panier->total ?? '?':'?' }} </td>
                                        <td class="text-center pt-40">
                                            <a data-href="{{route('client.monpanier.deleteLigne' ,$ligne_panier->id )}}" class="text-danger supprimer-produit-panier">
                                                <i class="fa fa-trash"></i>
                                            </a>
                                        </td>
                                    </tr>
  
                                @endforeach
                            </tbody>
                            <tfoot>
                                <tr class="bg-light">
                                    <th class="text-center">Total</th>
                                    <td class="text-center"></td>
                                    <td class="text-center"><span class="total">{{ $total }}</span> €</td>
                                    <td class="text-center">?</td>
                                    <td class="text-center"><span class="quantite">{{ $quantite }}</span></td>
                                    <td class="text-center">?</td>
                                    <td class="text-center">?</td>
                                    <th></th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
                <div class="col-md-3">
                    @if(auth()->user()->adresses && auth()->user()->adresses->first())
                        <div class="panel" id="adresse">
                            <div class="font-size-16 font-weight-bold text-center">{!! lang('Demande de devis') !!}</div>
                            <hr class="mt-10">
                            <div> <span class="quantite">{{$quantite}}</span> {!! lang('produit(s) dans mon panier') !!}</div>

                            <div class="row mt-20 bg-light p-2 pt-3 pb-3 border-radius-10 m-0">
                                <div class="col">
                                    <div class="font-size-14 font-weight-bold mb-20">{!! lang('Adresse de livraison') !!}</div>
                                    <div>{{auth()->user()->adresses->first()->nom }} {{auth()->user()->adresses->first()->prenom}}</div>
                                    <div>{{auth()->user()->adresses->first()->telephone_mobile ?? auth()->user()->adresses->first()->telephone_fixe }}</div>
                                    <div>{{auth()->user()->adresses->first()->adresse}}</div>
                                    <div>{{auth()->user()->adresses->first()->code_postal}}</div>
                                    <div>{{auth()->user()->adresses->first()->ville}}</div>
                                </div>
                                <div class="col-auto">
                                    <a href="#" class="pull-right text-underline toggle1">{!! lang('Modifier') !!}</a>
                                </div>
                            </div>
                            <div class="text-center mt-40">
                                <a href="{{route('client.monpanier.demandeDevis' , auth()->user()->adresses->first()->id )}}" class="btn btn2 btn-formulaire">{!! lang('Envoyer ma demande de devis') !!}</a>
                            </div>
                        </div>
                        <div class="panel hidden" id="adresse2">
                            
                            <div class="font-size-16 font-weight-bold text-center">{!! lang('Demande de devis') !!}</div>
                            <hr class="mt-10">
                            <div> <span class="quantite">{{$quantite}}</span> {!! lang('produit(s) dans mon panier') !!}</div>
                            

                            <form action="{{route('client.monpanier.adresse.update' , auth()->user()->adresses->first()->id  )}}" name="adresse-livraison-update" method="post" class="mt-20 p-3 border-radius-10 bg-light">
                                {{csrf_field()}}
                                <div class="font-size-14 font-weight-bold mb-20">{!! lang('Adresse de livraison') !!}</div>
                                <div class="form-group">
                                    <label>{!! lang('Prénom') !!}*</label>
                                    <input class="form-control" type="text" name="prenom" required="" value="{{auth()->user()->adresses->first()->prenom}}">
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Nom') !!}*</label>
                                    <input class="form-control" type="text" name="nom" required="" value="{{auth()->user()->adresses->first()->nom}}">
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Adresse') !!}*</label>
                                    <textarea class="form-control" rows="3" name="adresse" required="">{{auth()->user()->adresses->first()->adresse}}</textarea>
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Informations complémentaires') !!}</label>
                                    <br>
                                    <small class="font-size-12">{!! lang('Étage, digicode, ...') !!}</small>
                                    <input class="form-control" type="text" name="Informations" value="{{auth()->user()->adresses->first()->infos_complementaire}}">
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Code postal') !!}*</label>
                                    <input class="form-control" type="text" name="code_postal" required="" value="{{auth()->user()->adresses->first()->code_postal}}">
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Ville') !!}*</label>
                                    <input class="form-control" type="text" name="ville" required="" value="{{auth()->user()->adresses->first()->ville}}">
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Téléphone fixe') !!}</label>
                                    <input class="form-control" type="text" name="telephone_fixe" value="{{auth()->user()->adresses->first()->telephone_fixe}}">
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Téléphone mobile') !!}*</label> <small class="font-size-11">{!! lang('(nécessaire à la livraison)') !!}</small>
                                    <input class="form-control" type="text" name="telephone_mobile" required="" value="{{auth()->user()->adresses->first()->telephone_mobile}}">
                                </div>
                                <div class="mb-10 font-size-12">* Champ obligatoire</div>
                                <i class="font-size-12">{!! lang('Attention : la livraison couvre exclusivement la France métropolitaine.') !!}</i>
                                <div class="text-center mt-10">
                                    <button type="submit" class="btn btn2 btn-formulaire">{!! lang('Enregistrer') !!}</button>
                                    <button type="reset" class="btn btn2 btn-formulaire toggle2">{!! lang('Annuler') !!}</button>
                                </div>
                            </form>
                        </div>
                    @else


                        <div class="panel ">

                           

                            
                            <div class="font-size-16 font-weight-bold text-center">{!! lang('Demande de devis') !!}</div>
                            <hr class="mt-10">
                            <div> <span class="quantite">{{$quantite}}</span> {!! lang('produit(s) dans mon panier') !!}</div>


                            <form action="{{route('client.monpanier.adresse' )}}" name="adresse-livraison" method="post" class="mt-20 p-3 border-radius-10" style="border: 1px solid #ccc">
                                {{csrf_field()}}
                                <div class="font-size-14 font-weight-bold mb-20">{!! lang('Adresse de livraison') !!}</div>
                                <div class="form-group">
                                    <label>{!! lang('Prénom') !!}*</label>
                                    <input class="form-control" type="text" name="prenom" required="">
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Nom') !!}*</label>
                                    <input class="form-control" type="text" name="nom" required="">
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Adresse') !!}*</label>
                                    <textarea class="form-control" rows="3" name="adresse" required=""></textarea>
                                </div>
                                <div class="form-group">
                                    <label>{!! lang('Informations complémentaires') !!}</label>
                                    <br>
                                    <small class="font-size-12">{!! lang('Étage, digicode, ...') !!}</small>
                                    <input class="form-control" type="text" name="Informations">
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>{!! lang('Code postal') !!}*</label>
                                            <input class="form-control" type="text" name="code_postal" required="">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>{!! lang('Ville') !!}*</label>
                                            <input class="form-control" type="text" name="ville" required="">
                                        </div>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label>{!! lang('Téléphone fixe') !!}</label>
                                    <input class="form-control" type="tel" name="telephone_fixe">
                                </div>

                                <div class="form-group">
                                    <label>{!! lang('Téléphone mobile') !!}*</label> <small class="font-size-11">{!! lang('(nécessaire à la livraison)') !!}</small>
                                    <input class="form-control" type="tel" name="telephone_mobile" required="">
                                </div>
                                <div class="mb-10 font-size-12">* Champ obligatoire</div>
                                <i class="font-size-12">{!! lang('Attention : la livraison couvre exclusivement la France métropolitaine.') !!}</i>
                                <div class="text-center mt-10">
                                    <button type="submit" class="btn btn2 btn-formulaire">{!! lang('Enregistrer') !!}</button>
                                </div>
                            </form>
                        </div>
                    @endif
                </div>
            </div>
        @else
            <div class="row">
                <div class="col-md-12">
                        <div class="panel">
                            <div class="text-center ">
                                <i class="fa fa-shopping-cart mb-50 mt-30" style="font-size:70px"></i>
                                <p>{!! lang('Votre panier est actuellement vide.') !!}</p>
                            </div>
                        </div>
                </div>
            </div>
        @endif 
    </div>
</div>

 


@endsection

@section('script')
    <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function($) {
            
            $(document).on('click', '.toggle1', function(event) {
                $("#adresse").addClass('hidden');
                $("#adresse2").removeClass('hidden');      
            });
            $(document).on('click', '.toggle2', function(event) {
                $("#adresse").removeClass('hidden');
                $("#adresse2").addClass('hidden');
            });
            $(document).on('change', '[name="quantite"]', function(event) {
                var id = $(this).parents('td').data('ligne_panier_id');

                $.ajax({
                    url: '/mon-panier/ligne/'+id,
                    type: 'PUT',
                    data: {quantite: $(this).val() },
                })
                .success(function(data) {
                    console.log( data );
                    $('.quantite').html( data.quantite );
                    $('.total').html( data.total );
                })
                .error(function() {
                    console.log("error");
                });
                
                
            });
        });
</script>
@endsection