@extends('layouts.designer')
@php $page_title = 'Mes projets'; @endphp
@section('meta-title','Espace designers')
@section('meta-keywords','')
@section('meta-description','')
@section('content')

	<div class="row">
	    <div class="col-md-6 ">
	        <div class="panel {{ $class??''}}">
	             

	            <label class="mb-3"><b>Référence question :</b> {{$consultation->id }} </label><br>
	            <label class="mb-3"><b>Date de réception : </b> {{$consultation->created_at }} </label><br>
	            <label class="mb-3"><b>Nom du client :</b> {{$consultation->user->prenom }} {{$consultation->user->nom }} </label><br>
	            <label class="mb-3"><b>Adresse du client :</b> 
	            	{{ $consultation->user->adresse_facturation->adresse ?? '' }}
                    {{ $consultation->user->adresse_facturation->code_postal?? '' }}
                    {{ $consultation->user->adresse_facturation->ville?? '' }}
	            </label><br>
	            <label class="mb-3"><b>Statut :</b> {{$consultation->status }} </label><br>
	            
	            <hr> 
	             
					 
				@include('front.bricorama.partials.details')
			 

	                
	        </div>
	    </div>
	    <div class="col-md-6 ">
	        

	        <div class="panel {{ $class??''}}">
	            <div class="row">
	                <div class="col">                    
	                    <b>Réponse du designer</b> 
	                </div>
	                <div class="col-auto">
	                    
	                    @if($consultation->status != 'Réponse validée')
                            <a href="{{ route('consulter-un-designer.bricorama.envoyer', $consultation->id) }}" class="btn btn-xsm btn8">Envoyer ma réponse</a>
                        @else
                            {{$consultation->status}}
                        @endif
	                    
	                    
	                </div>
	            </div>
	            <hr> 

	            <label>{!! lang('Message') !!}</label>
	            
	            <div class="messages">
	                @foreach($consultation->messages as $message)
	                    @if( ( auth()->user()->type == 'admin' &&  $message->visible_to_admin  )  || ( auth()->user()->type == 'designer' && $message->visible_to_designer ) ) 
	                        <div class="message pt-3 {{ $message->sender_id == auth()->id() ? 'mine':'' }}" style="background: #f8f8f8; border: 1px solid #e8e8e8">
	                            <small class="date d-block pull-right" style="right: 10px; left: auto; top: unset; bottom: 0px;">
	                                {{ $message->created_at }}
	                            </small>
	                            
	                            <p class="font-size-12">{!! $message->message !!}</p>
	                        </div>
	                    @endif

	                @endforeach
	            </div>
	            
	            @php
	            if( isset($message) && $message->sender_id == auth()->id() ){
	                $isDisabled = 1;
	            }
	            @endphp

	            <form action="{{ route('consulter-un-designer.produit.message.bricorama', $consultation->id) }}" method="post" enctype="multipart/form-data">
	                {{csrf_field()}}

	                @if(isset($message) && $message->sender_id == auth()->id())
	                    <input type="hidden" name="message_id" value="{{$message->id}}">
	                @endif

	                <fieldset >
	                	
	                
		                @if($consultation->status != 'Réponse validée' || auth()->user()->type == 'admin')
		                    <div class="form-group">
		                        <textarea name="message" class="summernote">
		                            @if(isset($message) && $message->sender_id == auth()->id())
		                                {!! $message->message ?? '' !!}
		                            @endif
		                        </textarea>
		                    </div>
		                @endif
	                </fieldset>

	                @if($consultation->status != 'Réponse validée' || auth()->user()->type == 'admin')
	                    <div class="text-right">
	                        	
	                        @if( isset($message) && $message->sender_id == auth()->id() )
	                            <div class="btn btn2 btn-xs disable-summernote show-disabled btn-success">{!! lang('Modifier') !!}</div>
	                            <button class="btn btn2 btn-xs hide-disabled btn-primary" name="save" value="true">{!! lang('Enregistrer') !!}</button>
	                        @else
	                            <button class="btn btn2 btn-xs hide-disabled btn-primary" name="save" value="true">{!! lang('Enregistrer') !!}</button>
	                        @endif
	                    </div>
	                @endif
 
		            <hr>

		            <div class="form-group mt-20">
		                <label>{!! lang('Visuel de la proposition') !!}</label>
		                <div class="form-group">
		                    <span class="font-size-13 mt-0 text-danger">Format recommandé : paysage A4 largeur / hauteur = <strong>1.8</strong> (Exemple : 850px x 472px ou 3308px x 1838px) </span>
		                    <hr>
		                    <div class="img-preview">
		                        <div class="preview" style="width: 100%; height: 400px; @if($consultation->visuel)background-image: url({{ asset($consultation->visuel)  }})@endif"></div>
		                        <input type="file" accept="image/*" name="visuel" class="form-control">
		                    </div>
		                </div>
		            </div>

		             <div class="text-right">
	                    @if($consultation->status != 'Réponse validée' || auth()->user()->type == 'admin')
	                        @if( isset($message) && $message->sender_id == auth()->id() )
	                            <div class="btn btn2 btn-xs disable-summernote show-disabled btn-success">{!! lang('Modifier') !!}</div>
	                            <button class="btn btn2 btn-xs hide-disabled btn-primary" name="save" value="true">{!! lang('Enregistrer') !!}</button>
	                        @else
	                            <button class="btn btn2 btn-xs hide-disabled btn-primary" name="save" value="true">{!! lang('Enregistrer') !!}</button>
	                        @endif
	                    @else
	                        {{$consultation->status}}
	                    @endif
	                </div>
	            </form>
				
				<hr>

	            <div class="form-group mt-20">
	                <label>{!! lang('Shopping List') !!}</label>
	                <br> 
	                @foreach($consultation->produits as $produit)
	                    @if( ( auth()->user()->type == 'admin' &&  $produit->visible_to_admin  )  || ( auth()->user()->type == 'designer' && $produit->visible_to_designer ) ) 
	                        <div class="row">
	                            <div class="col-auto">
	                                <img src="{{ asset($produit->produit->photo) }}" width="100" alt="">
	                            </div>
	                            <div class="col">
	                                <div>{{ $produit->produit->nom }}</div>
	                                <small>{{ $produit->produit->marque }}</small><br>
	                                <small>L:{{ $produit->produit->largeur ?? '-' }} x H: {{ $produit->produit->hauteur ?? '-'}} x P: {{ $produit->produit->profondeur?? '-' }}</small>
	                            </div>
	                            <div class="col-3 text-right">
	                                {!! lang('Prix') !!} : {{ $produit->produit->prix ? ($produit->produit->prix.' €'):'-' ?? '-' }} 
	                                @if($produit->produit->prix_pipcke ?? 0)
	                                <br>
	                                {!! lang('Prix pipcke') !!} : {{ $produit->produit->prix_pipcke ? ($produit->produit->prix_pipcke.' €'):'-' ?? '-' }}
	                                @endif
	                            </div>
	                            <div class="col-auto">
	                                {{-- <a href="{{ route('produit.edit', $produit->produit_id ) }}" target="_blank" class="btn btn-secondary p-1 pl-2 pr-2 mr-1 text-white"><i class="fa fa-pencil"></i></a> --}}

	                                @if($consultation->status != 'Réponse validée' || auth()->user()->type == 'admin')
	                                    <a class="" data-target="#modal-{{$produit->produit_id}}" data-toggle="modal" ><i class="fa fa-pencil"></i></a>
	                                    @include('admin.partials.modals.produit', ['produit'=>$produit->produit])

	                                    <a href="{{ route('consulter-un-designer.produit.delete', $produit->id ) }}" class="ml-1 text-danger"><i class="fa fa-trash"></i></a>
	                                @endif
	                            </div>
	                        </div>
	                        <hr> 
	                    @endif
	                @endforeach
	                

	                <form action="{{ route('produits.post') }}" class="mt-30 formation-item" style="display: none;" method="post" enctype="multipart/form-data" id="addProduitForm_brico">
	                    {{ csrf_field() }}
	                    <input type="hidden" name="consultation_id" value="{{ $consultation->id }}">
						<div class="row">
							<div class="col-md-4">
								<label for="fournisseur">Fournisseur</label>
								 <input type="text" class="form-control" id="fournisseur_brico" name="fournisseur" value="Bricorama" disabled>
							</div>
							<div class="col-md-6">
								<div class="form-group">
									<label for="">{!! lang('URL') !!} </label>
									<input type="text" class="form-control" id="url_brico" name="url">
								</div>
							</div>
							<div class="col-md-2" style="position: relative;">
								<div class="btn btn-xsm btn2" style="position: absolute;
								top: 60%; left: 50%;
								transform: translate(-50%,-50%);" id="scrapperBtn_brico">Chercher</div>
							</div>
						</div>

						<hr style="height:2px;border-width:0;color:black;background-color:black""> 


	                    <div class="form-group row">
							<div class="col-md-4">
	                            <label>{!! lang('Photo') !!} * : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="file" class="inputfile" name="photo" required="" id="photo">
	                            <label for="photo" id="labelUploadPhoto_brico">
	                                <i class="fa fa-upload"></i> 
	                                <span>{!! lang('Choisir un fichier') !!}&hellip;</span>
	                            </label>
								<input class="form-control d-none" type="text" class="form-control" id="url_photo_brico" name="url_photo">
	                        </div>
	                    </div>

	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Nom') !!} * : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="text" class="form-control" name="nom" required="">
	                        </div>
	                    </div>
	                    
	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Marque') !!} * : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="text" class="form-control" name="marque" required="">
	                        </div>
	                    </div>

	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Référence') !!} * : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="text" class="form-control" name="reference" required="">
	                        </div>
	                    </div>

	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Source') !!} * : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="url" class="form-control" name="source" required="">
	                        </div>
	                    </div>

	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Prix affiché') !!} (€ TTC) : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="text" class="form-control" name="prix" pattern="[0-9]+([\.,][0-9]+)?" title="Veuillez saisir un chiffre">
	                        </div>
	                    </div>

	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Prix pipcke') !!} (€ TTC) : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="text" class="form-control" name="prix_pipcke" pattern="[0-9]+([\.,][0-9]+)?" title="Veuillez saisir un chiffre">
	                        </div>
	                    </div>
	 
	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Largeur') !!} (cm) : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="text" class="form-control" name="largeur" pattern="[0-9]+([\.,][0-9]+)?" title="Veuillez saisir un chiffre">
	                        </div>
	                    </div>

	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Hauteur') !!} (cm) : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="text" class="form-control" name="hauteur" pattern="[0-9]+([\.,][0-9]+)?" title="Veuillez saisir un chiffre">
	                        </div>
	                    </div>

	                    <div class="form-group row">
	                        <div class="col-md-4">
	                            <label>{!! lang('Profondeur') !!} (cm) : </label>
	                        </div>
	                        <div class="col-md-8">
	                            <input type="text" class="form-control" name="profondeur" pattern="[0-9]+([\.,][0-9]+)?" title="Veuillez saisir un chiffre">
	                        </div>
	                    </div>
	                    
	                    <div class="text-right">
	                        <button class="btn btn2 btn-xs">{!! lang('Ajouter') !!}</button>
	                    </div>
	                </form>

	                
	                    @if($consultation->status != 'Réponse validée' || auth()->user()->type == 'admin')
	                        <div class="content-add">
	                            <div> <i class="fa fa-plus"></i></div> {!! lang('Ajouter un produit') !!}
	                        </div>
	                    @endif

	            </div>
	        </div>
	         
	    </div>
	</div>




	@section('style')
	<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.css" rel="stylesheet">

	@endsection
	@section('script')
	    
	    <script src="{{ asset('js/jquery-3.2.1.min.js') }}"></script>
	    <script src="{{ asset('js/summernote-lite.js') }}"></script>
	    <script src="{{ asset('js/summernote-fr-FR.min.js') }}"></script>
	    
	    <script>
	        jQuery(document).ready(function($) {
	            
	          $('.summernote').summernote({
	            name: 'contenu',
	            placeholder: '',
	            tabsize: 2,
	            lang: 'fr-FR',
	            height: 100
	          });

	          $('.disable-summernote').click(function(event) {
	              $('.summernote').summernote('enable');
	          });

	          $('.summernote.disabled').each(function(index, el) {
	              $(this).summernote('disable');
	          });
	    
	        });
	      $(document).ready(function() { 
	          $('#btnAddProduct').click(function(event) {
	              $('#add-product').toggleClass('d-none');
	          });
	      });
	    </script> 

	@endsection

@endsection