@extends('Layout')
@section('Content')
<div class="col-md-12">
 
{{ HF::DrawHeadPage(array(array('title'=>$Data['SubTitle']) ),$Data['SubTitle'])}}

    <div class="panel-body">
        <ul class="nav nav-tabs">
			<li >
                {{ HTML::linkRoute('ListSales','السارية')}}
            </li>
            <li >
                <a href="{{URL::Route('ListSales')}}?s=2">الخالصة</a>
            </li>   

            <li class="active">
                {{ HTML::linkRoute('GetAdvancedSearchSales',$Data['SubTitle'])}}
            </li> 
             <li >
                {{ HTML::linkRoute('GetScheduleInstallments','الأقساط والدفعات')}}
            </li> 
         </ul>
    </div>
    	{{Form::open(array('id'=>'MutakheratSearch'))}}
    	    <div class="col-md-12" style="background:#eee;padding:20px;border-bottom:#C5C5C5 1px solid;border-radius:5px;">
 	    		 
				<div class="col-md-3">
	 	    		<div class="form-group">
		    			<lable >المستثمرين</lable>
		    			<select name="inv"  data-placeholder="أختر المستثمر" style="width:100%;" class="chosen-select ">
		    				<option value="">##عرض الجميع##</option>
			    			@foreach($Data['Investor'] as $inv)
			    				<option value="{{$inv->id_person}}">{{$inv->full_name_person}}</option>
			    			@endforeach
	    				</select>
		    		</div>
	     		</div>
				<div class="col-md-3">
	 	    		<div class="form-group	">
		    			<lable >نوع العقد</lable>
		    			<select class="form-control" name="type">
		    				<option value="0">عرض الكل</option>
		    				<option value="T">الأقساط</option>
		    				<option value="G">الآجل</option>
		    				<option value="M">التمويل</option>
	    				</select>
		    		</div>
	     		</div>
				<div class="col-md-3">
	 	    		<div class="form-group	">
		    			<lable >الترتيب حسب</lable>
		    			<br />
		    			<select class="form-control" name="OrderColumn" style="width:50%;float:right">
		    				<option value="agd">رقم العقد</option>
		    				<option value="seller">المستثمر</option>
		    				<option value="mutakher">المتأخر</option>
		    				<option value="mosadad">المسدد</option>
		    				<option value="matloob">المطلوب</option>
	    				</select>
	    				<select class="form-control" name="OrderWay" style="width:50%;float:right">
		    				<option value="ASC">تصاعدي</option>
		    				<option value="DESC">تنازلي</option>
	    				</select>
		    		</div>
	     		</div>
 	    		<div class="col-md-3">
		    		 <div class="form-group">
		    		 	<br clear="both"/>
						<input type="checkbox" name="OnlyMutakher" value="1"> عرض العقود المتأخرة بالسداد فقط
		    		</div>
	    		</div>
	    		<br clear="both"/>

	    	</div>	    		
	    	<br clear="both"/><br/><button type="button" id="submit_btn" tabindex="123" class="btn btn-success btn-lg f_left" onclick="$('#MutakheratSearch').submit();"><i class="fa fa-search"></i> البحث</button>

     	{{Form::close()}}
<br clear="both"/>
<br clear="both"/>
			<center id="loader"  style="display:none;margin-top:50px;">
			<i class="fa fa-spinner fa-spin fa-5x"></i><br />
				جاري التحميل
			</center>

<div id="mutkherat"></div>
    </div>
</div>
 <script>
function getPosts(e) {
     $('#loader').show();
     $('#mutkherat').hide();

    $.ajax({
        url: "{{URL::Route('AjaxAdvancedSearchSales')}}?pg=1&inv="+$('#inv').val()+"&type="+$('#type').val()+"&OrderColumn="+$('#OrderColumn').val()+"&OrderWay="+$('#OrderWay').val()+"&OnlyMutakher="+$('#OnlyMutakher').val()+"&page=" + e,
        dataType: "json"
    }).done(function (t) {

        $("#mutkherat").html(t);
        $('#mutkherat').show();
        $('#loader').hide();
        location.hash = e
    }).fail(function (data) {
        $('#mutkherat').show();
        $('#loader').hide();
        alert("يوجد خطأ في الاتصال بقاعدة البيانات");
    })
}
$(window).on("hashchange", function () {
    if (window.location.hash) {
        var e = window.location.hash.replace("#", "");
        if (e == Number.NaN || e <= 0) {
            return false
        } else {
            getPosts(e)
        }
    }
});
$(document).ready(function () {
 
    $(document).on("click", ".pagination a", function (e) {
        getPosts($(this).attr("href").split("page=")[1]);
        e.preventDefault()
    })
})</script>
<script type="text/javascript">
$( document ).ready(function() {
$('#MutakheratSearch').submit(function(event) {
	$('#mutkherat').hide();
	$('#loader').show();

 			var postData = $(this).serializeArray();
		    var formURL = $(this).attr("action");
		    $.ajax(
		    {
		        url : '{{URL::Route("AjaxAdvancedSearchSales")}}',
		        type: "GET",
		        data : postData,
		        success:function(data, textStatus, jqXHR) 
		        {
		        	$('#mutkherat').show();
		        	$('#loader').hide();

		        	$('#mutkherat').html(data);
		        },
		        error: function(jqXHR, textStatus, errorThrown) 
		        {
		        	$('#mutkherat').show();
		        	$('#loader').hide();

		            alert('يوجد خطأ !.') ;
		        }
		    });
		    e.preventDefault(); //STOP default action
		    e.unbind(); //unbind. to stop multiple form submit.
		});
        $('#from').calendarsPicker({calendar: $.calendars.instance('ummalqura','ar'),dateFormat: 'yyyy/mm/dd',defaultDate: '{{DT::GetDate("Y/m/01")}}', selectDefaultDate: true,}); 
        $('#to').calendarsPicker({calendar: $.calendars.instance('ummalqura','ar'),dateFormat: 'yyyy/mm/dd',defaultDate: '{{DT::GetDate("Y/m/30")}}', selectDefaultDate: true,}); 
});
</script>
@stop