<div >
 <?php
$email = Auth::user()->email;
$currentPath= Route::getFacadeRoot()->current()->uri();
?>

    
<form id="{{$pageModule}}Search">
<table class="table search-table table-hover" id="advance-search">
	<tbody>
@foreach ($tableForm as $t)
	@if($t['search'] =='1')
		<tr id="{{ $t['field'] }}" class="fieldsearch" >
			<td >{!! SiteHelpers::activeLang($t['label'],(isset($t['language'])? $t['language'] : array())) !!} </td>
			<td style=" width:80px;"> 
			
			@if(stripos($currentPath,'pagosmantenimientos') !== FALSE)
			<select id="{{ $t['field']}}_operate" class="form-control form-control-sm oper" name="operate" onchange="changeOperate(this.value , '{{ $t['field']}}')">
				<option value="equal"> = </option>
				<!--<option value="bigger_equal"> >= </option>
				<option value="smaller_equal"> <= </option>
				<option value="smaller"> < </option>
				<option value="bigger"> > </option>
				<option value="not_null"> No Vacio  </option>
				<option value="is_null"> Nulo </option>
				<option value="between"> Entre </option>
				<option value="like"> Como </option>-->
			</select>
			@else
			<select id="{{ $t['field']}}_operate" class="form-control form-control-sm oper" name="operate" onchange="changeOperate(this.value , '{{ $t['field']}}')">
				<option value="equal"> = </option>
				<option value="bigger_equal"> >= </option>
				<option value="smaller_equal"> <= </option>
				<option value="smaller"> < </option>
				<option value="bigger"> > </option>
				<!--<option value="not_null"> No Vacio  </option>
				<option value="is_null"> Nulo </option>
				<option value="between"> Entre </option>
				<option value="like"> Como </option>-->
			</select>
			@endif
			
			</td>
			<td id="field_{{ $t['field']}}" >{!! SiteHelpers::transForm($t['field'] , $tableForm) !!}</td>
		
		</tr>
	
	@endif
@endforeach
		<tr >
			<!--<td></td>-->
			<td colspan="3" style="text-align:center;"><button type="button" name="search" class="doSearch btn btn-default btn-sm" style="border-color: #f29f41; font-size: 12px;outline: none !important;box-shadow: none;margin-top:10px;"> Filtrar </button></td>
		
		</tr>
	</tbody>     
	</table>
</form>	
</div>

<script>
function changeOperate( val , field )
{
	if(val =='is_null') {
		$('input[name='+field+']').attr('readonly','1');
		$('input[name='+field+']').val('is_null');
	} else if(val =='not_null') {
		$('input[name='+field+']').attr('readonly','1');
		$('input[name='+field+']').val('not_null');		

	} else if(val =='between') {
	
		html = '<input name="'+field+'" class="date form-control form-control-sm" placeholder="Start Date" style="width:100px;"  /> -  <input name="'+field+'_end" class="date form-control form-control-sm"  placeholder="End Date" style="width:100px;"    />';
		$('#field_'+field+'').html(html);
	} else {
		//$('input[name='+field+']').removeAttr('readonly');
		$('#field_'+field+'').html('<input type="text" value="" class="form-control form-control-sm" name="'+field+'">');
		$('input[name='+field+']').val('');	
		
	}
}
jQuery(function(){
		$('.date').datepicker({format:'yy-mm-dd',autoClose:true,monthNames:["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"],dayNamesMin: ["Do", "Lu", "Ma", "Mie", "Ju", "Vi", "Sa"],
		    prevText: ["Prev"],nextText: ["Prox"]})
		//$('.datetime').datetimepicker({format: 'yyyy-mm-dd hh:ii:ss'}); 
		//$(".sel-search").select2({ width:"98%"});	
        

	$('.doSearch').click(function(){
		//alert('test');
		var attr = '';
		$('#advance-search tr.fieldsearch').each(function(i){
			var field = $(this).attr('id');
			var operate = $(this).find('#'+field+'_operate').val();
			var value_select  = $(this).find("select[name="+field+"] option:selected").val();
			if( typeof value_select !=='undefined' )
			{
				value  = value_select;
			} else {
				value  = $(this).find("input[name="+field+"]").val();
			}

			if(value !=='' && typeof value !=='undefined' && this.name !='_token')
			{

				if(operate =='between')
				{
					var value  = $(this).find("input[name="+field+"]").val();
					var value2  = $(this).find("input[name="+field+"_end]").val();
					attr += field+':'+operate+':'+value+':'+value2+'|';
				} else {
					attr += field+':'+operate+':'+value+'|';
				}	
					
			}
			
		});
		<?php if($searchMode =='ajax') { ?> 
			reloadData( '#{{ $pageModule }}',"{{ $pageUrl }}/data?search="+attr);	
			$('#sximo-modal').modal('hide');
		<?php } else { ?>
			window.location.href = '{{ $pageUrl }}?search='+attr;
		<?php } ?>
	});
});









</script>
<style>
input:focus,
  input:active {
   box-shadow: none !important;
   -moz-box-shadow: none !important;
   -webkit-box-shadow: none !important;
   outline: none !important;
   border: 0;
 }  
 
 select:focus,select:active {
   box-shadow: none !important;
   -moz-box-shadow: none !important;
   -webkit-box-shadow: none !important;
   outline: none !important;
   border: 0;
 }   
 
 
 
.ui-datepicker {
	background-color: #fff;
	border: 1px solid #66AFE9;
	border-radius: 4px;
	box-shadow: 0 0 8px rgba(102,175,233,.6);
	display: none;
	margin-top: 4px;
	padding: 10px;
	width: 240px;
	margin-left:-26px;
}
.ui-datepicker a,
.ui-datepicker a:hover {
	text-decoration: none;
}
.ui-datepicker a:hover,
.ui-datepicker td:hover a {
	color: #2A6496;
	-webkit-transition: color 0.1s ease-in-out;
	   -moz-transition: color 0.1s ease-in-out;
	     -o-transition: color 0.1s ease-in-out;
	        transition: color 0.1s ease-in-out;
}
.ui-datepicker .ui-datepicker-header {
	margin-bottom: 4px;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title {
	font-weight: 700;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	cursor: default;
	font-family: 'Glyphicons Halflings';
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	font-weight: normal;
	height: 20px;
	line-height: 1;
	margin-top: 4px;
	width: 30px;
	font-size:11px;
}
.ui-datepicker .ui-datepicker-prev {
	float: left;
	text-align: left;
}
.ui-datepicker .ui-datepicker-next {
	float: right;
	text-align: right;
}
/*.ui-datepicker .ui-datepicker-prev:before {
	content: "\e079";
}
.ui-datepicker .ui-datepicker-next:before {
	content: "\e080";
}
.ui-datepicker .ui-icon {
	display: none;
}*/
.ui-datepicker .ui-datepicker-calendar {
  table-layout: fixed;
	width: 100%;
}
.ui-datepicker .ui-datepicker-calendar th,
.ui-datepicker .ui-datepicker-calendar td {
	text-align: center;
	padding: 4px 0;
	
}
.ui-datepicker .ui-datepicker-calendar td {
	border-radius: 4px;
	-webkit-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
	   -moz-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
	     -o-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
	        transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
}
.ui-datepicker .ui-datepicker-calendar td:hover {
	background-color: #eee;
	cursor: pointer;
}
.ui-datepicker .ui-datepicker-calendar td a {
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-current-day {
	background-color: #4289cc;
}
.ui-datepicker .ui-datepicker-current-day a {
	color: #fff
}
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-unselectable:hover {
	background-color: #fff;
	cursor: default;
}
.ui-datepicker-calendar th,{
    background-color:gray;
}

.ui-datepicker-header {
    background-color:#2777a8;
    padding:10px;
    color:white;
}
 input {
    border: none;
    background-color: transparent;
 }  
 
 
 
</style>






