@extends('layout.app')
@section('meta-title', $brand->name . ' Products | Googoz IT Hardware and Solution Provider')
@section('meta-description', 'Explore a wide range of ' . $brand->name . ' products at Googoz, your trusted online IT hardware and solution provider. With an extensive portfolio and comprehensive technical skills, we offer innovative distribution solutions to support our reseller channel. Find the latest ' . $brand->name . ' products and request a quote today.')

@if(empty($brand->keywords))
    @section('meta-keywords', $brand->name. ' IT hardware, ' .$brand->name. ' IT hardware hub, ' .$brand->name. ' IT Solutions, ' .$brand->name. ' Technology Solutions, ' .$brand->name. ' Business Solutions, ' .$brand->name. ' Corporate Solutions') 
@else
    @section('meta-keywords', $brand->keywords) 
@endif

@section('content')

<div class="breadcrumb-option set-bg" data-setbg="img/breadcrumb-bg.jpg">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <div class="breadcrumb__text">
                        <h2>Products By Brand</h2>
                        <div class="breadcrumb__links">
                            <span>{{ $brand->name }} Products</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Breadcrumb End -->
  <section>

              <div class="container">

                <div class="solutions-main">



                  <div class="">



              <p class=" solution_para">With an extensive portfolio of products and comprehensive technical skills, Googoz delivers a solution-led and innovative approach to distribution to assist and support our reseller channel.</p>

                  </div>



                </div> <!--solutions ends-->

              </div>

            </section>

             <section class="about spad">
                  <div class="container searchcontainer">
                  <div class="">
                    <div id="search-main">
                    <form action="{{ route('search-part-no') }}" method="POST">
				        @csrf
                        <input name='search_query' id='ecatalogsearch' type="text" placeholder="search..."  class="search-field">
                        <button value="search" type="submit" id="search"  class="search" >Search</button>
                    </form>
                    </div>
                    </div>
                    </div>

                  <div class="container">
                  <div class="row">
                    <button class="normal-btn view_all_btn" style="display: none;">Back</button>
                    <span class="search-icon"></span>
                    <div class="col-md-12">
                               <div class="product-range table-responsive">

                      <table width="100%" border="0" cellpadding="0" cellspacing="0" style="padding:10px" class="table table-bordered table-striped table_search">
                        <thead>
                          <tr bgcolor="#003C4A" height="38" style="color:#FFF; font-weight:bold">


                            <th width="30%">Brand</th>

                             <th width="25%" style="padding-left:15px">Part No</th>

                            <th width="30%">Part Description</th>
                            <th width="15%">Request Quote</th>
                          </tr>
                          </thead>
                          <div id="success_message"></div>
                          <tbody class="tbody_search">
                          </tbody>

                    </table>

                    </div>
                    </div>
         <div class="product-range table-responsive">

                      <table width="100%" border="0" cellpadding="0" cellspacing="0" style="padding:10px" class="table table-bordered table-striped show_products" >
                        <thead>
                          <tr bgcolor="#003C4A" height="38" style="color:#FFF; font-weight:bold">


                            <th width="15%">Brand</th>

                             <th width="20%" style="padding-left:15px">Part No.</th>

                            <th width="30%">Part Description</th>
                            <th width="12%">Request Quote</th>
                          </tr>
                          </thead>
                          <tbody>
                          @foreach ($manufacture as $manufact)
                           <tr height="34" bgcolor="#f1f6fc">
                          <td style="padding-left:15px"> {{ $manufact->brand->name }}</td>
                          <td>{{ $manufact->manufacturer_part_no }}</td>
                          <td>{{ $manufact->part_description }}</td>
                          <td><a href="{{ route('rfq', ['part_number' => $manufact->manufacturer_part_no]) }}"><button name="" type="button" value="Request Quote" class="normal-btn view_all_btn">Request Quote</button></a></td>
                        </tr>
                        @endforeach
                          </tbody>

                    </table>

                    </div> <!--prodcut-range ends-->
                     <div class="col-lg-12 col-md-12">
                       <div class="product__pag" id="product__pag">
                        {!! $manufacture->appends(request()->input())->links();!!}
                       </div>
                   </div>
        </div>
          </div>
            </section>

<!-- Services Page Section End -->
@endsection
@section('scripts')
<script type="text/javascript">


  $(document).ready(function(){
 $('.table_search').hide();
    $(document).on('click','.search2', function (e) {
      e.preventDefault();
     var stud_id = $('#ecatalogsearch').val();
      // console.log(stud_id);
       // alert(stud_id);
        if(stud_id=="")
        {
          // alert(stud_id+"empty");
          stud_id="empty";
           $('.tbody_search').html("");
            $('.table_search').hide();
            $('.show_products').show();


        }
           $.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
    });

 $.ajax({
         type: "GET",
         url: "/search-product/"+stud_id,
         dataType: "json",
         success: function(response)
         {
         // alert(stud_id+ "ajax");
    console.log(response.products);
    if(response.data!='empty')
    {
     // alert('hello hello');
        if(response.status == 404)
        {
           // alert('hello hello if');
           $('#success_message').html("");
             $('#success_message').addClass('alert alert-danger');
           $('#success_message').text(response.message);

        }
        else
        {
          // alert('hello hello else');
           if(response.products==""){
            // alert('No record return');
            $('#success_message').css("display", "block");
            $('#success_message').html("");
             $('#success_message').addClass('alert alert-danger');
             // console.log(response.products);
           $('#success_message').text(response.message);
           $(function() {
           setTimeout(function() { $("#success_message").fadeOut(1500); }, 2500)
           })
           }
           else{
         $('.table_search').show();
         $('.show_products').hide();
         $('.view_all_btn').css("display", "block");
         $('#search-main').css("display", "none");
         $('#success_message').css("display", "none");
         $('.product__pag').css("display", "none");
         $('.tbody_search').html("");
         $.each(response.products, function (key, item){
         $('.tbody_search').append(
          '<tr>\
        <td>'+item.manufacture+'</td>\
       <td>'+item.part_number+'</td>\
       <td>'+item.part_name+'</td>\
       <td><a href="/rfq?partnumber='+ item.part_number+' "><button name="" type="button" value="Request Quote" class="normal-btn">Request Quote</button></a></td>\
      </tr>'

                );
            });
        }
         }
}
else{
  $('#success_message').css("display", "block");
   $('#success_message').html("");
   $('#success_message').addClass('alert alert-danger');
   $('#success_message').text(response.message);
   $(function() {
setTimeout(function() { $("#success_message").fadeOut(1500); }, 2500)

})
}

         }// success end
  });
  });
      $(document).on('click','.view_all_btn', function (e) {
         setTimeout(function(){// wait for 5 secs(2)
           location.reload(); // then reload the page.(3)
      }, 1000);
    });
   });// ready end


</script>
@endsection