@extends('layouts.admin', ['title' => 'دسته بندی مقایسه'])
 
@section('css')
<style type="text/css" >
  .product-list{ 
	  max-height:300px;
	  overflow:auto;
  }

  .product-list label{
	  display:block ;
  }
</style>

@stop

@section('content')

	<h3>مدیریت دسته بندی مقایسه</h3>
	<hr />

	<p>
	<a href="/admin/compare/add/group" class="btn btn-success"><span class="glyphicon glyphicon-plus"></span>دسته بندی جدید</a>
	</p>

	<div class="row">
		<div  class="col-xs-12">
			@if(count($data)==0)
			<div class="alert alert-info" role="alert">
			اطلاعاتی برای نمایش دادن وجود ندارد.
			</div>
			@else
			<table class="table table-striped">
				<tr>
					<th style="width:150px;">عملیات</th>
					<th>تاریخ</th>
					<th>عنوان</th> 
					<th></th> 
				</tr>

				@foreach($data as $item)
					<tr>
						<td>
						<a href="/admin/compare/delete/group/{{ $item->id }}" onclick="return confirm('آیا میخواهید آیتم مورد نظر حذف شود؟');" class="confirm-delete btn btn-danger btn-sm" >حذف</a>
						<a href="/admin/compare/edit/group/{{ $item->id }}" class="btn btn-primary btn-sm"  >ویرایش</a>
						</td>

						<td style="direction:ltr;text-align:right;">{{ $item->created_at }}</td>
						<td>{{ $item->title }}</td>  
						<td>
						<a href="/admin/compare/group/{{ $item->id }}/products" class="btn btn-default btn-sm"  >کالاهای این دسته</a>
						</td>
					</tr>
				@endforeach
			</table>

			<div style="text-align: center;">
			{!! $data->render(); !!}
			</div>

			@endif
		</div>
		<div  class="col-xs-6">
			<div id="dvData">

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

@stop


@section('javascript')
  <script>
  jQuery(document).ready(function(){ 
	jQuery("#tSearch").on("change paste keyup", function() {
	  var search = jQuery(this).val().toString().toLowerCase().replaceAll(' ', '').replaceAll('ي', 'ی');
	  if(search.length == 0 ){ 
		jQuery(".product-list label").show();
	  } else{ 
		jQuery(".product-list label").hide();
		jQuery(".product-list label[title*='"+search+"']").show();
	  }
	}); 
  }); 
  </script>
@stop