@extends('layout.front.front_copying')
	@include('includes.head')
	@stack('head')


	@include('includes.page-js')
@push('head')
<script type="text/javascript" src="{{ asset('/assets/dcopying/toastr/toastr.min.js') }}"></script>
<link href="{{ asset('/assets/dcopying/toastr/toastr.min.css') }}" rel="stylesheet" />
<link href="{{ asset('/assets/dcopying/css/custom.css') }}" rel="stylesheet" />
<script type="text/javascript" src="{{ asset('/assets/dcopying/js/custom.js') }}"></script>

@endpush

<style type="text/css">
	.pre-scrollable {
    max-height: 340px;
    overflow-y: scroll;
}



</style>

@section('content')
<section id="blog" class="blog">
      <div class="container-fluid aos-init aos-animate" data-aos="fade-up">

   
          
<div class="position-relative">
	<!-- begin breadcrumb -->
<div class="loader_div" style="display: none;"></div>
<div class="panel">

<div class="panel-heading card-bg-color">
<h4 class="panel-title">Add New Registration</h4>

</div>


<div class="panel-body">

	<div class="row">

<div class="col-md-9">

<form action="{{ route('highcourt.copying.getFormData') }}" method="POST" id="form">


	<div class="row">

	  <div class="col-md-2">
	  	<div class="mb-2">
		<label class="form-label">Bench</label>
        <select class="form-control form-control-sm" name="bench" id="bench">
		  <option value="">--SELECT--</option>
		  <option value="1">JABALPUR</option>
		  <option value="2">INDORE</option>
		  <option value="3">GWALIOR</option>
		</select>
     </div>
	</div>

	  <div class="col-md-3">
	  	<div class="mb-3">
<label class="form-label">Case Type</label>


<select class="form-control form-control-sm default-select2" name="case_type" id="case_type">

	@foreach ($case_types as $case_type_key => $case_type_value)


   <option value="{{$case_type_value->casecode_new}}">{{$case_type_value->skey_new}} ({{$case_type_value->casename}})</option>
    @endforeach
</select>
</div>
	  </div>

	  <div class="col-md-2">

<div class="mb-3">
<label class="form-label">Case No.</label>
<input class="form-control form-control-sm" type="text" placeholder="Enter Case No"  maxlength="5" size="5" name="case_no" id="case_no">
</div>
	  </div>
	    <div class="col-md-2">

<div class="mb-3">
<label class="form-label">Year</label>
<input class="form-control form-control-sm" type="text" placeholder="Enter Year" name="year_registration" id="year_registration">
</div>
	  </div>
	      <div class="col-md-3">

<div class="mb-3">
<button class="btn btn-primary button-loader"
        data-loading-text="<i class='fa-solid fa-circle-notch fa-spin'></i> Loading..."
        type="submit">
        Search
</button>
</div>
	  </div>

</div>


</form>


</div>
<div class="col-md-3 text-center fs-6 party_detail">

</div>



	</div>
<div class="row">

	<div class="parties_list">

</div>
</div>

	</div>


</div>

<div class="panel">

<div class="panel-heading card-bg-color">
<h4 class="panel-title">Application Details</h4>

</div>


<div class="panel-body">
<form action="{{ route('highcourt.copying.submitFormData') }}" method="POST" id="submit_form">

<input type="hidden" name="applong_page" value="0" id="applong_page">
<input type="hidden" name="entry_by" value="cino" id="entry_by">
<input type="hidden" name="regcase_type" value="" id="regcase_type">
<input type="hidden" name="post_case_type" value="" id="post_case_type">
<input type="hidden" name="judge_name" value="" id="judge_name">
<input type="hidden" name="aplong_charge" value="0" id="input_aplong_charge">
	<div class="row">
		<div class="col-md-8">


<div class="row">

<div class="col-md-6">
					  <div class="row mb-3">
    <label for="staticEmail" class="col-sm-4 col-form-label">Applicant Type</label>
    <div class="col-sm-8">
    <select class="form-control form-control-sm" name="app_type" id="app_type">

	<option value="">--Select--</option>
	<option value="Express">Express</option>
<option value="Ordinary">Ordinary</option>
</select>
    </div>
  </div>

</div>


<div class="col-md-6">
	 <div class="row mb-3">
	   <label for="inputPassword" class="col-sm-4 col-form-label">Application purpose</label>

    <div class="col-sm-8">
     <div class="form-check form-check-inline">
  <input class="form-check-input" type="radio" name="pur_pose" id="inlineRadio1" value="Private" checked="checked">
  <label class="form-check-label" for="inlineRadio1">Private</label>
</div>

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

</div>





					  <div class="mb-3 row">
    <label for="staticEmail" class="col-sm-4 col-form-label">Applicant Name</label>
    <div class="col-sm-8">
       <input type="text" class="form-control form-control-sm" id="applicant" name="applicant">
    </div>
  </div>
   <div class="mb-3 row">
    <label for="inputPassword" class="col-sm-4 col-form-label">Applicant Address</label>
    <div class="col-sm-8">
      <input type="text" class="form-control form-control-sm" id="app_add" name="app_add">
    </div>
  </div>


			<div class="row">
				<div class="col">

			   <div class="mb-3 row">
    <label for="inputPassword" class="col-sm-4 col-form-label">Mobile No</label>
    <div class="col-sm-8">
      <input type="text" class="form-control form-control-sm" id="mobile_no" name="mobile_no">
    </div>
  </div>
				</div>
				<div class="col">
						   <div class="mb-3 row">
    <label for="inputPassword" class="col-sm-4 col-form-label">Email ID</label>
    <div class="col-sm-8">
      <input type="text" class="form-control form-control-sm" id="email_id" name="email_id">
    </div>
  </div>

				</div>

			</div>
			<div class="row charge_detail">

</div>

<div class="row">
		<div class="d-flex justify-content-around bd-highlight mb-3 mb-2 bg-gradient  border border-1">
    <div class="p-2 bd-highlight"><b>Copying Fee : </b><span class="copying_fees">0</span></div>
    <div class="p-2 bd-highlight"><b>Application Charges: </b><span class="application_charge">0</span></div>
    <div class="p-2 bd-highlight"><b>Aplong Charges : </b><span class="aplong_charge">0</span></div>
  </div>
	</div>
			<div class="row">

					<div class="col">

 <div class="mb-3 row">
    <label for="inputPassword" class="col-sm-4 col-form-label">Total Page(s)</label>
    <div class="col-sm-8">
      <input type="text" class="form-control form-control-sm" id="proposed_page" name="proposed_page" readonly="readonly">
    </div>
  </div>
				</div>
					<div class="col">

   <div class="mb-3 row">
    <label for="inputPassword" class="col-sm-4 col-form-label">Amount</label>
    <div class="col-sm-8">
      <input type="text" class="form-control form-control-sm" id="amt_rec" name="amt_rec" readonly="readonly">
    </div>
  </div>
				</div>
			</div>

	<div class="row mb-3">
		<div class="col-md-12">
			
		<div class="form-check form-check-inline">
  <input class="form-check-input" type="checkbox" name="check" id="check" value="check">
  <label class="form-check-label" for="inlineCheckbox1">I have read and verified above content and I know that above amount will not be refunded. Certified copy will be provided as per CC rules</label>
</div>
		</div>
	</div>

		</div>
<div class="col-md-4">

<div class="scanned_docs">

</div>
</div>

		</div>

<button class="btn btn-primary button-loader"
        data-loading-text="<i class='fa-solid fa-circle-notch fa-spin'></i> Saving..."
        type="submit">
        Save
</button>


</form>
	</div>


</div>


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

@endsection

@push('scripts')
<script type="text/javascript">
var aplong_page=0;


var express_charge=8;
var ordinary_charge=4;
var aplong_charge=0;
var no_of_copy=1;
var application_form=0;

	$(document).on("submit", "#form", function(e){
		let _this_submit=$(this);

		    e.preventDefault();
		    let _this=$(this);

		    $.ajax({
		        url:_this.attr("action"),
		        type:_this.attr("method"),
		        dataType: "JSON",
		        data:  $(this).serialize(),
		         headers: {
                   'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                 },
                   beforeSend: function() {
                   	_this_submit.closest('form').find(':submit').button('loading');
                   	 	// reset_form('#submit_form');
   					    $('.scanned_docs').html("");
   					    $('.form-record').html("");
   					    $('.parties_list').html("");
   					    $('.party_detail').html("");
   					    // reset_charge_Details();
   					},

		        success: function (response)
		        {
		        	let error_msg="";
		        	if(response.status==0){

		        		$.each(response.errors, function (i, error) {
                         error_msg+="<p>"+error+"</p>";
                      });

		        		 errorMsg(error_msg);
		        	}else{
						aplong_page=response.aplong_page;
					$('.party_detail').html(response.case_detail);
				    $('.parties_list').html(response.party_page);
				    $('#applong_page').val(response.aplong_page);


				       getCaseDetails(response.case.fil_no);
		        	}

 	               _this_submit.closest('form').find(':submit').button('reset');
		        },
		        error: function (xhr)
		        {
                       _this_submit.closest('form').find(':submit').button('reset');

		        },
		        complete: function() {
                   _this_submit.closest('form').find(':submit').button('reset');
              }
		    });
		});


		let getCaseDetails=(fil_no)=>{

		   $.ajax({
		         url: "{{ url('highcourt/copying/getCaseOrders') }}",
		        type:"POST",
		        dataType: "JSON",
		        data:  {'fil_no':fil_no},
		         headers: {
                   'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                 },
                   beforeSend: function() {

   					    $('.scanned_docs').html("");

   					},

		        success: function (response)
		        {

                         $('.scanned_docs').html(response.case_document_page);



		        },
		        error: function (xhr)
		        {


		        },
		        complete: function() {

              }
		    });

		}

		$(document).on('change','.radio_party',function(){
			var party_name = $(this).closest('tr').find("input[name='party_name']").val();
			var party_mobile_no = $(this).closest('tr').find("input[name='party_mobile_no']").val();
			var party_email_id = $(this).closest('tr').find("input[name='party_email_id']").val();
			var party_address = $(this).closest('tr').find("input[name='party_address']").val();

			$('#applicant').val(party_name);
			$('#mobile_no').val(party_mobile_no);
			$('#email_id').val(party_email_id);
			$('#app_add').val(party_address);

	});


	  $(document).on('change', '.scanned_copy', function() {
	      	countPage();

           });

	      $(document).on('change', '.orders', function() {
	      	countPage();

           });


	      // $(document).on('change', 'input[type=radio][name=ap]', function() {
       //      let radio_val=$(this).val();
		     //  	if(radio_val == "afr"){
       //           $('#amt_rec,#post_amt').val(1);
		     //  	}else if(radio_val == "foc"){
		     //  	$('#amt_rec,#post_amt').val(0);
		     //  	}else if(radio_val == "none_opt"){
       //              calculateAmt();
		     //  	}


       //     });


	      	let countPage=()=>{
				 selected_page=0;
				 $('input.scanned_copy[type=checkbox]:checked').each(function () {
			           let page=$(this).data('pages');
			           selected_page=selected_page+page;
			     });

			      $('input.orders[type=checkbox]:checked').each(function () {
			           let page=$(this).data('pages');
			           selected_page=selected_page+page;
			     });

                  $('#proposed_page').val(selected_page);
			        calculateAmt();
			}


			$(document).on('change','#app_type',function(){
				   let page_charge=0;

				 let app_type=$('#app_type').val();
				 if(app_type == "Express"){
                            page_charge=express_charge;
                            application_form=15;

                      	}else if(app_type == "Ordinary"){
							page_charge=ordinary_charge;
                            application_form=5;
						}else{
							page_charge=0;
                            application_form=5;
                        
                      	}

				 $('.copying_fees').html(page_charge+" (Per Page)");
				 $('.application_charge').html(application_form);
				 $('#input_aplong_charge').val(aplong_page*page_charge);
				 
				 $('.aplong_charge').html(aplong_page*page_charge);
				 calculateAmt();
			})


			let calculateAmt=()=>{

				      let page_charge=0;
                      let proposed_page=parseInt($('#proposed_page').val());
                      let app_type=$('#app_type').val();
                      let radio_ap=$("input:radio[name='ap']:checked").val();
                      let tot_copy=no_of_copy;


                      	if(app_type == "Express"){
                            page_charge=express_charge;
                      	}else{

                            page_charge=ordinary_charge;
                      	}
                     let final_amt= ((proposed_page*tot_copy)*page_charge);
                     if(isNaN(final_amt)) {
						 final_amt = 0;
						}
                     $('#amt_rec').val(final_amt);




                }

	$(document).on("submit", "#submit_form", function(e){
		    e.preventDefault();
		    let _this=$(this);
            let error_msg="";
		    $.ajax({
		        url:_this.attr("action"),
		        type:_this.attr("method"),
		        dataType: "JSON",
		        data:  $(this).serialize(),
		         headers: {
                   'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                 },
                  beforeSend: function() {
                   	_this.closest('form').find(':submit').button('loading');
                   },

		        success: function (response)
		        {

		        		if(response.status==0){

		        		$.each(response.errors, function (i, error) {
                         error_msg+="<p>"+error+"</p>";
                      });

		        		 errorMsg(error_msg);
		        	}else{

						window.location.href = response.redirect_url;
		        	}



                       _this.closest('form').find(':submit').button('reset');
		        },
		           error: function (xhr)
		        {
                       _this.closest('form').find(':submit').button('reset');

		        },
		        complete: function() {
                   _this.closest('form').find(':submit').button('reset');
                }
		    });
		});


		$(document).on('blur','#case_no',function(e){
		  let case_no=$(this).val();
	      let new_case_no=add_zero(case_no,5);
	      $('#case_no').val(new_case_no);
		});



		function add_zero(your_number, length) {
		    var num = '' + your_number;
		    while (num.length < length) {
		        num = '0' + num;
		    }
		    return num;
		}


</script>
@endpush