@extends('layouts.default', ['appTopMenu' => true])
@push('scripts')
<link rel="stylesheet" href="{{ asset('css/jquery-ui.css')}}" />
<script src="{{ asset('js/jquery-ui.js') }}"></script>
<!-- <meta name="referrer" content="none-when-downgrade" />  -->
<meta name="csrf-token" content="{{ csrf_token() }}" />
<!--<link href="/assets/plugins/datatables.net-bs5/css/dataTables.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-responsive-bs5/css/responsive.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-buttons-bs5/css/buttons.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-colreorder-bs5/css/colReorder.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-keytable-bs5/css/keyTable.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-rowreorder-bs5/css/rowReorder.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-select-bs5/css/select.bootstrap5.min.css" rel="stylesheet" />-->
<link href="/assets/plugins/bootstrap-datepicker/dist/css/bootstrap-datepicker.css" rel="stylesheet" />
<script src="/assets/plugins/bootstrap-datepicker/dist/js/bootstrap-datepicker.js" defer></script>

<!-- required files -->
<link href="../assets/plugins/datatables.net-bs5/css/dataTables.bootstrap5.min.css" rel="stylesheet" />
<link href="../assets/plugins/datatables.net-responsive-bs5/css/responsive.bootstrap5.min.css" rel="stylesheet" />
<script src="../assets/plugins/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="../assets/plugins/datatables.net-bs5/js/dataTables.bootstrap5.min.js"></script>
<script src="../assets/plugins/datatables.net-responsive/js/dataTables.responsive.min.js"></script>
<script src="../assets/plugins/datatables.net-responsive-bs5/js/responsive.bootstrap5.min.js"></script>
<script src="assets/pspdfkit.js"></script>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<script type="text/javascript">
    $( "#datepicker" ).datepicker({
    dateFormat: 'dd-mm-yy'
 });

 
 
</script>
@endpush
@section('title', 'Cause List')
@section('content')
    <div class="container">
    
            @csrf
         
            
            </div>
           
            <div class="card mb-3">
            <div class="panel">
						<div class="panel-heading card-bg-color">
								<h4 class="panel-title">Honble Cause List</h4>
							<div class="panel-heading-btn">
								<a href="{{ url('/') }}/ecauselist" class="btn btn-xs btn-icon btn-circle btn-success">
										<i class="fa fa-redo"></i>
</a>&nbsp;&nbsp;
							</div>
						</div>
				
				</div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-xl-12 mb-3" id="form_div">
                            <div class="row">
                                
                                <div class="col-sm-2 mb-3">
                                    <label class="control-label" for="app_id"><b>Honble judge</b></label>
                                    <select class="form-select" name="lst_judge" id="lst_judge">
                                  
                                    @foreach ($get_judge as $judge)
                                    <option value="{{ $judge->jcode }}">{{ $judge->jname }}</option>
                                    @endforeach
                                    </select>
                                </div>
                                <div class="col-sm-2 mb-3">
                                    <label class="control-label" for="Year"><b>Cause List Date</b></label>
                                    <input class="form-control dtp" type='text' name='datepicker' id='datepicker' maxlength='10' autocomplete="on" value="{{ date('d-m-Y') }}"/>
                                </div>
                                <div class="col-sm-2 mb-3" style="position: relative; top: 25px;">
                                
                                    <div class="form-check form-check-inline">   
                                            <input type="radio" name="sdbench" id="sdbench" value="1" class="form-check-input" checked="checked">SB
                                    </div>
                                    <div class="form-check form-check-inline">          
                                            <input type="radio" name="sdbench" id="sdbench" value="2" class="form-check-input">DB
                                    </div>
                                    <div class="form-check form-check-inline">  
                                            <input type="radio" name="sdbench" id="sdbench" value="3" class="form-check-input">FB                                            
                                    </div>
                                </div>
                                <div class="col-sm-3 mb-3" style="position: relative; top: 25px;">
                                
                                <div class="form-check form-check-inline">   
                                <input type="radio" name="mf" id="mf" value="1" checked class="form-check-input">Motion
                                </div>
                                <div class="form-check form-check-inline">          
                                <input type="radio" name="mf" id="mf" value="2"  class="form-check-input">Final
                                </div>
                                <div class="form-check form-check-inline">  
                                <input type="radio" name="mf" id="mf" value="5" class="form-check-input">Lok Adalat                                    
                                </div>
                            </div>
                                <div class="col-sm-3">
                                    <label class="control-label" for="Search"></label><br />
                                    <button type="button" class="btn btn-primary" id='btn_data'>Submit</button>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xl-12 mb-6" id="result">
                            
                        </div>
                </div>
            </div>

       
    </div>

    <!--<div class="card mb-3">
            <div class="card-header card-bg-color ">Causelist</div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-xl-12 mb-3" id="result">
                            
                        </div>
                    </div>        
                </div>
            </div>
        </div>-->
@endsection
@push('scripts')
<script>
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
    $("#btn_data").click(function(){

        var lst_judge=$("#lst_judge").val();
        var datepicker=$("#datepicker").val();
        var sdbench=$("input[name='sdbench']:checked").val();
        var mf=$("input[name='mf']:checked").val();
        $.ajax({
           url: 'get_cl_records',
           type: 'POST',
		    beforeSend: function () {
             $("#result").html("<div class='text-center'><div class='spinner-border'></div></div>"); 
          },
           data: {_token: CSRF_TOKEN, lst_judge: lst_judge,datepicker:datepicker,sdbench:sdbench,mf:mf},
           success: function(response){
           // alert(response);
            //createRows(response);
            $("#result").html(response);
            $("#form_div").hide();

            //GetOrder(fil_no);
           }
         }); 

    });

</script>
@endpush