@extends('layouts.tienda')

@section('content')


<div class="container-fluid tope-imagen">
    <div class="d-flex justify-content-center">
        <div class="col-12 col-md-10">
                
                    
        @if($superior->count())
        <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
                @for($i=0; $i<$superior->count(); $i++)
                    @if($i == 0)
                     <li data-target="#carouselExampleIndicators" data-slide-to="{{ $i }}" class="active"></li>
                    @else
                     <li data-target="#carouselExampleIndicators" data-slide-to="{{ $i }}"></li>
                    @endif
                @endfor    
            </ol>
            <div class="carousel-inner">
                
                @for($i=0; $i<$superior->count(); $i++)
                    @if($i == 0)
                      <div class="carousel-item active">
                        <img src="{{ asset('anuncios/banner/'.$superior[$i]->imagen) }}" class="d-block w-100" alt="{{ $superior[$i]->id }}" style="border-radius: 20px;">
                      </div>
                    @else
                      <div class="carousel-item">
                        <img src="{{ asset('anuncios/banner/'.$superior[$i]->imagen) }}" class="d-block w-100" alt="{{ $superior[$i]->id }}" style="border-radius: 20px;">
                      </div>
                    @endif
                @endfor    
            </div>
            
        </div>
        @endif
        
              
        </div>
    </div>
</div>



<div class="container-fluid mt-3">
    <div class="row">
        <div class="col-12">
            <div class="d-flex justify-content-center">
                <div class="col-12 col-md-10">
                    <div class="row">
                        
                        
                        @if($recomendados->count() > 0)    
                        <div class="col-md-12 mt-5 mb-4">
                            <h2 class="grosor"> Recomendaciones. <strong class="color-gris">Los mejores productos para usted </strong></h2>
                        </div> 
                        
                        @foreach($recomendados as $rec)
                            <div class="col-md-3 col-6">
                                <div class="card">
                                    <a class="text-center" href="{{ route('tienda-externa-show', ['slug' => $rec->post_name]) }}">
                                       <img class="img-fluid" src="{{ $rec->guid }}" alt="">
                                    </a>
                                    <div class="card-body">
                                        <div class="row colapse-row">
                                            <div class="col-md-7 col-12">
                                               <h5 class="product-title text-truncate mb-0">{{ $rec->post_title }}</h5> 
                                               
                                               <p class="text-category mb-0">{{ $rec->name }}</p>
                                               
                                               <p class="card-text mb-0">
                                        	       <p>
                                        	           <i class="fa fa-star text-azulclaro"></i> {{ $rec->pinged }}
                                        	       </p>
                                               </p>
                                            </div>
                                                
                                            <div class="col-md-5 col-12 text-md-right">
                                            
                                                <h5 class="product-title text-truncate">
                                                    @if ($moneda->mostrar_a_d)
                                                      {{$moneda->simbolo}} {{ $rec->precio }}
                                                    @else
                                                      {{ $rec->precio }} {{$moneda->simbolo}}
                                                    @endif 
                                                </h5>
                                                
                                            </div>
                                            
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                        
                        <div class="col-md-12">
                            <div class="form-group">
                               {{ $recomendados->links('tienda.paginate.tienda_externa') }}        
                            </div>
                        </div>
                        
                    
                    @endif    
                        
                        
                    
                    @if($vistos->count() > 0)        
                        <div class="col-md-12 mt-5 mb-4">
                            <h2 class="grosor"> Los más vendidos. <strong class="color-gris">Los más vendidos del mes </strong></h2>
                        </div> 
                        
                        @foreach($vistos as $vist)
                            <div class="col-md-3 col-6">
                                <div class="card">
                                    <a class="text-center" href="{{ route('tienda-externa-show', ['slug' => $vist->post_name]) }}">
                                       <img class="img-fluid" src="{{ $vist->guid }}" alt="">
                                    </a>
                                    <div class="card-body">
                                        <div class="row colapse-row">
                                            <div class="col-md-7 col-12">
                                               <h5 class="product-title text-truncate mb-0">{{ $vist->post_title }}</h5>  
                                               
                                               <p class="text-category mb-0">{{ $vist->name }}</p>
                                               
                                               <p class="card-text mb-0">
                                        	       <p>
                                        	           <i class="fa fa-star text-azulclaro"></i> {{ $vist->pinged }}
                                        	       </p>
                                               </p>
                                            </div>
                                    
                                            <div class="col-md-5 col-12 text-md-right">
                                                
                                                <h5 class="product-title text-truncate">
                                                    @if ($moneda->mostrar_a_d)
                                                      {{$moneda->simbolo}} {{ $vist->precio }}
                                                    @else
                                                      {{ $vist->precio }} {{$moneda->simbolo}}
                                                    @endif 
                                                </h5>
                                                
                                            </div>
                                            
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                        
                        
                        <div class="col-md-12">
                            <div class="form-group">
                               {{ $vistos->links('tienda.paginate.tienda_externa') }}        
                            </div>
                        </div>
                        
                    @endif    
                    
                    
                    
                        <div class="container-fluid">
                            @if($inferior->count())
                            <div id="carouselExampleIndicators2" class="carousel slide" data-ride="carousel">
                                <ol class="carousel-indicators">
                                    @for($i=0; $i<$inferior->count(); $i++)
                                        @if($i == 0)
                                         <li data-target="#carouselExampleIndicators2" data-slide-to="{{ $i }}" class="active"></li>
                                        @else
                                         <li data-target="#carouselExampleIndicators2" data-slide-to="{{ $i }}"></li>
                                        @endif
                                    @endfor    
                                </ol>
                                <div class="carousel-inner">
                                    @for($i=0; $i<$inferior->count(); $i++)
                                        @if($i == 0)
                                          <div class="carousel-item active">
                                            <img src="{{ asset('anuncios/banner/'.$inferior[$i]->imagen) }}" class="d-block w-100" alt="{{ $inferior[$i]->id }}" style="border-radius: 20px;">
                                          </div>
                                        @else
                                          <div class="carousel-item">
                                            <img src="{{ asset('anuncios/banner/'.$inferior[$i]->imagen) }}" class="d-block w-100" alt="{{ $inferior[$i]->id }}" style="border-radius: 20px;">
                                          </div>
                                        @endif
                                    @endfor
                                </div>
                            </div>
                            @endif
                        </div>
                        
                    
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>    
                    
@endsection