@extends('main')
@section('styles')
  {!! Html::style(Theme::current()->assetPath.'/vendor/smk-accordion/accordion.css') !!}
@endsection
@section('page-title')
  <section class="breadcrumbs-wrap">
    <div class=" section-content ">
      <div class="container clearfix">
        <div class="breadcrumbs-inner">
          <h1 class="page-title">
            {{ $brand->title }}
          </h1>
          <ul class="breadcrumbs ul--inline ul--no-style">
            <li>
              <a href="{{ Route('mobily.site.home.page') }}">{{ __('Home') }}</a>
            </li>
            <span>/</span>
            <li>
              <a href="{{ Route('mobily.product.index') }}">{{ __('Products') }}</a>
            </li>
            <span>/</span>
            <li>{{ $brand->title }}</li>
          </ul>
        </div>
      </div>
    </div>
  </section>
@endsection
@section('content')
  <section class="we-are">
    <div class="container">
      @if (session()->has('success_message'))
        <div class="alert alert-success">
          {{ session()->get('success_message') }}
        </div>
      @endif
      @if (session()->has('error_message'))
        <div class="alert alert-danger">
          {{ session()->get('error_message') }}
        </div>
      @endif
      <div class="row">
        <div class="col-md-9 col-sm-12 col-xs-12">
          <div class="shop-content">
            <div class="container">
              <div class="row">
                @foreach ($products as $key => $product)
                  <div class="list-product col-lg-3 col-md-6">
                    <div class="pro__item">
                      <div class="pro__img zoom-img">
                        <a href="{{ Route('mobily.product.show',[$product->category->slug,$product->slug]) }}"><img src="{{ asset($product->image_url) }}" alt="{{ $product->title }}"></a>
                      </div>
                      <div class="pro__detail">
                        <h5>
                          <a href="{{ Route('mobily.product.show',[$product->category->slug,$product->slug]) }}">{{ $product->title }}</a>
                        </h5>
                        <form action="{{ url('/cart') }}" method="POST" class="side-by-side">
                          {!! csrf_field() !!}
                          <input type="hidden" name="id" value="{{ $product->id }}">
                          <input type="hidden" name="name" value="{{ $product->title }}">
                          <input type="hidden" name="price" value="{{ $product->price2 }}">
                          <div class="action">
                            <div class="add-cart-button btn-group">
                              <a class="btn btn-primary icon" title="{{ $product->brand->title }}"
                                href="{!! URL::Route('mobily.brandroducts',[$product->brand->slug]) !!}">
                                <i class="fa fa-tags "></i>
                              </a>
                              <a class="btn btn-primary cart-btn red-cart" href="{{ Route('mobily.product.show',[$product->category->slug,$product->slug]) }}">{{ __('More') }}</a>

                            </div>
                          </div>
                        </form>
                      </div>
                    </div>
                  </div>
                @endforeach
              </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                  <div class="shop-pagination  text-center">
                    <div class="pagination">
                      {{ $products->links('vendor.pagination.mobile') }}
                    </div>
                  </div>
                </div>
            </div>
          </div>
        </div>
        <div class="col-md-3 col-sm-12 col-xs-12 mt-tab-30">
          @widget('ListCategoriesMenu')
          @widget('ListBrandMenu')
        </div>
      </div>
    </div>
  </section>
@endsection
@section('scripts')
  {!! Html::script(Theme::current()->assetPath.'/vendor/smk-accordion/accordion.js') !!}
  <script type="text/javascript">
    jQuery(document).ready(function($){
      /************************/
      $(".accordion-demo").accordionjs({
        activeIndex : 1,
        closeAble: false,
        closeOther  : true,
        slideSpeed: 200
      });
      /************************/
    });
  </script>
@endsection