@extends('layouts.front.app')

@section('og')
<meta property="og:type" content="home"/>
<meta property="og:description" content="{{ config('app.description') }}"/>
@endsection

@section('content')

@php $cat = $category->name ?? $category->segmento @endphp

<section>
  <div class="container my-3">
    <nav class="grey lighten-3 rounded">
      <ol class="breadcrumb">
        <li class="breadcrumb-item">
          <a class="font-weight-bold fosco-text" href="{{ route('home') }}">
            <i class="fas fa-home mr-1"></i>Home
          </a>
        </li>
        <li class="breadcrumb-item font-weight-bolder black-text">{{ $cat }}</li>
      </ol>
    </nav>
  </div>
</section>

<section>
  <div class="container">
    
    <div class="row">
      
      <div class="col-lg-3 pr-0">
        
        <div class="filtro">
          
          <div class="border my-1">
            
            <div class="card-header gray-200">
              <h5 class="font-weight-bold text-center">Preço</h5>
            </div>
            
            <div class="card-body">
              
              <div class="form-row">
                <form action="{{ route('search.product.byPrice') }}" method="get">
                  <input type="hidden" name="tipo_filtro">
                  
                  <div class="form-group col-md">
                    <div class="input-group mb-3">
                      <div class="input-group-prepend">
                        <span class="input-group-text pr-3 gray-200">Min</span>                   
                      </div>
                      <input type="text" class="form-control" name="min_price">
                    </div>
                  </div>
                  
                  <div class="form-group col-md text-right">
                    <div class="input-group mb-3">
                      <div class="input-group-prepend">
                        <span class="input-group-text gray-200">Max</span>
                      </div>
                      <input type="text" class="form-control" name="max_price">
                    </div>
                  </div>
                  
                  <button type="submit" class="btn green-shadow text-white btn-md font-weight-bold btn-block">Pesquisar</button>
                  
                </form>
              </div>
            </div>
            
          </div>
          
        </div>
        
      </div>
      
      <div class="col-lg">
        @include(config('site.domain').'.front.products.product-list')
      </div>
      
    </div>
    
  </div>
</section>

@endsection

@section('js')
<script>
  $(function () {
    $('input[name=min_price]').maskMoney({showSymbol: false, decimal: ",", thousands: "."})
    $('input[name=max_price]').maskMoney({showSymbol: false, decimal: ",", thousands: "."})
  })
</script>
@endsection