@extends('layouts.dashboardnew')

@section('content')

<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">

                    <div class="row">
                        <div class="col-md-4">
                            
                            <a href="{{$productos->guid}}" data-fancybox="gallery" data-caption="{{$productos->post_title}}">
                                <img class="img-fluid" src="{{$productos->guid}}" alt="{{$productos->post_title}}">
                            </a>
                            
                            <div class="row">
                                @foreach($imagenes as $imagen)
                                    <div class="col-md-4 col-6 mt-3 text-center">
                                        <a href="{{ asset('adicional/'.$imagen->foto) }}" data-fancybox="gallery" data-caption="{{$productos->post_title}}">
                                            <img class="img-fluid" src="{{ asset('adicional/'.$imagen->foto) }}">
                                        </a>  
                                    </div>
                                @endforeach
                            </div>
                            
                        </div>

                        <div class="col-md-8 mt-3">
                            <h3 class="mt-0">{{$productos->post_title}}</h3>
                            <p>
                                @if($productos->pinged > 0)
                                    @for($i=1; $i<=$productos->pinged; $i++)
                                        <i class="fa fa-star text-warning"></i>
                                    @endfor
                                @endif  
                            </p>
                            <h3 class="mt-0 text-success">
                                @if ($moneda->mostrar_a_d)
                                  {{$moneda->simbolo}} {{$productos->meta_value}}
                                @else
                                  {{$productos->meta_value}} {{$moneda->simbolo}}
                                @endif 
                            </h3>

                                {!! $productos->post_content !!}
                                
                            
                            
                                @if(Auth::user()->rol_id == 0 || Auth::user()->rol_id == 1)
                                    @if($like == null)
                                        <div class="col-md-3 mt-3">
                                            <a class="btn btn-danger" href="{{ route('megusta-gusta', ['idproducto' => $productos->ID]) }}" title="Recomendar"> 
                                                <i class="fa-solid fa-thumbs-up text-white"></i>
                                            </a>
                                        </div>
                                    @else
                                    <div class="col-md-3 mt-3">
                                        <a class="btn btn-danger" href="{{ route('megusta-no-gusta', ['idproducto' => $productos->ID]) }}" title="Eliminar de mis Recomendados">
                                            <i class="fa-solid fa-thumbs-down text-white"></i>
                                        </a>
                                    </div>
                                    @endif
                                @endif    
                            
                                            
                            
                        <form method="POST" action="{{ route('setting-guardar') }}">
                            {{ csrf_field() }}

                            <input type="hidden" name="id" value="{{$productos->ID}}">
                            <input type="hidden" name="precio" value="{{$productos->meta_value}}">

                            <div class="d-flex flex-row bd-highlight mb-3">
                                <div class="p-2 bd-highlight">
                                    <a class="btn btn-dark text-white" onclick="restar()">-</a>
                                </div>
                                <div class="p-2 bd-highlight">
                                    <input type="number" name="cantidad" class="form-control cantidad" min="1" readonly value="1" style="height: 37px !important;">
                                </div>
                                <div class="p-2 bd-highlight">
                                    <a class="btn btn-dark text-white" onclick="sumar()">+</a>
                                </div>   
                            </div>  
                            
                            <div class="col-md-4">
                              <div class="form-group">
                                  <button class="btn btn-info btn-block text-white"> Comprar</button>
                              </div>
                            </div>        
                        
                        </form>
                                
                        </div>
                    </div>


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

@endsection   


@push('script')
<script>
   function sumar(){
     var cantidad = $('.cantidad').val();

     $('.cantidad').val(parseFloat(cantidad) + 1)
   }

   function restar(){
    var cantidad = $('.cantidad').val();
    
    if(cantidad > 1){
     $('.cantidad').val(parseFloat(cantidad) - 1)
    }

   }
</script>
@endpush