@extends('adminlayout.dashadmin')
<!-- 'adminlayout.admin'
 --> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

@section('content')


<!-- Content Wrapper Start -->
<div class="content-wrapper" ng-controller="PurchaseController">

  <!-- Content Header Start -->
  <!--<section class="content-header" style="float:right;">
   <a  class="btn btn-lg btn-info" href="{{('admin/purchase-invoice')}}">
        <i class="fa fa-fw fa-plus"></i>
        PURCHASE LIST
        </a>
        <a  class="btn btn-lg btn-info" href="{{('admin/party-sale-list')}}">
        <i class="fa fa-fw fa-plus"></i>
        SELL LIST
        </a>
  </section>-->
  <br>
  <br>
  <!-- Content Header end -->
@if(Session::has('message'))
    <p class="alert alert-{{ Session::get('alert-class', 'alert-info') }}" style="text-align: center;">{{ Session::get('message') }}</p>

    @endif
  <!-- Content Start -->
  <!-- Content Start -->
  <section class="content">
     <div class="box box-info">
        <div class="box-header with-border">
          <h3 class="box-title">
            <span class="fa fa-fw fa-plus"></span>   New Vehicle Sale*            </h3>
           
        </div>
        <form  action="{{ route('save_customer_vehicle_order') }}" id="customer_vehicle_order_form" method="post">
     @csrf
        <!-- Add Sale Create Form -->
        <div  class="form-horizontal" >
          <div class=" col-sm-12 col-md-3">
            <input class="form-control input-sm text-center" type="hidden" name="uid" value="{{ Auth::user()->id }}">
            
                 <label for="name" class="control-label">
                  Customer Name<i class="required">*</i>
                </label>
                <input type="text" class="form-control requiredfiled" id="name" name="name" autocomplete="off" placeholder="Enter Customer name..." required>
				@error('name')
                <p class="text-danger">{{ $message }}</p>
               @enderror
              </div>
              <div class=" col-sm-12 col-md-3">
               <label for="Phone" class="control-label">
                Phone<i class="required">*</i>
              </label>
              <input type="text" class="form-control requiredfiled" id="Phone" name="phone" autocomplete="off" placeholder="Enter Phone.." onkeypress="return isNumber(event)" maxlength="10" required>
			   @error('phone')
                <p class="text-danger">{{ $message }}</p>
              @enderror
            </div>
            <div class=" col-sm-12 col-md-3">
               <label for="father" class="control-label">
                Father Name<i class="required">*</i>
              </label>
              <input type="text" class="form-control requiredfiled" id="father_name" name="father_name" autocomplete="off" placeholder="Enter father.." required>
			   @error('father_name')
                <p class="text-danger">{{ $message }}</p>
              @enderror
            </div>
           
           <div class=" col-sm-12 col-md-3">
             <label for="Email" class="control-label">
              Email<i class="required">*</i>
            </label>
            <input type="email" class="form-control requiredfiled" id="Email" name="email" autocomplete="off" placeholder="Enter Email.." required>
			  @error('email')
              <p class="text-danger">{{ $message }}</p>
              @enderror
          </div>
          <div class="col-sm-4 col-md-3">
                
              <label for="date" class="control-label">
                   State<i class="required">*</i>
              </label>
                <select class="form-control requiredfiled" name="state_id" id="state_id" onchange="getCity(this.value)" required >
				 <option value="">--Select--</option>
				 @foreach($states as $state)
					<option value="{{$state->id}}">{{$state->name}}</option>
				 @endforeach	
				</select>
              </div>
			 <div class=" col-sm-6 col-md-3 ">
              <label for="pan" class="control-label">
                Town/City<i class="required">*</i>
              </label>

               <select class="form-control requiredfiled" name="city" id="city_id" required>
					<option></option>
				</select>	

             
              <input type="hidden" name="country" value="India" id="country">
              <input type="hidden" name="latitude" id="latitude" value="">
              <input type="hidden" name="longitude" id="longitude" value="">

              @error('post_office')
              <p class="text-danger">{{ $message }}</p>
              @enderror
          </div>  
          <div class=" col-sm-4 col-md-3 " id="pin_div">
              <label for="pin" class="control-label">
                Pin Code<i class="required">*</i>
              </label>

               <input type="text" name="pin" class="form-control  @error('pincode') error @enderror requiredfiled" id="pin" placeholder="Enter pin Code" value=""  maxlength="6" onkeypress="return isNumber(event)" >

              @error('pin')
              <p class="text-danger">{{ $message }}</p>
              @enderror
              <p class="text-danger" id="pin_error"></p>

          </div>
         
       <div class=" col-sm-6 col-md-3 ">
            <label for="pan" class="control-label">
              Village/Mohalla/Appartment*<i class="required">*</i>
            </label>
             <input type="text" name="address" class="form-control  @error('address') error @enderror requiredfiled" id="address" placeholder="Enter Full Address.." value=""  >
           
          </div>
          <div class="row col-sm-12 ">
          
          <div class="col-sm-6 col-md-3 " >
              <label for="pin" class="control-label">
                Pan Number<i class="required">*</i>
              </label>

               <input type="text" name="pan" class="form-control  @error('pan') error @enderror requiredfiled" id="pan" placeholder="Enter pin Code" value=""   >

              @error('pan')
              <p class="text-danger">{{ $message }}</p>
              @enderror
              
            <br>
          </div>
          <div class="col-sm-6 col-md-3 ">
              <label for="pin" class="control-label">
                Aadhar<i class="required">*</i>
              </label>

               <input type="text" name="aadhar_no" class="form-control  @error('pincaadhar_noode') error @enderror requiredfiled" id="aadhar_no" placeholder="Enter pin Code" value=""   >

              @error('aadhar_no')
              <p class="text-danger">{{ $message }}</p>
              @enderror
               <br>
          </div>
       </div>
        
<div class="well well-sm">
  <div class="row">
    <div class=" col-sm-6 col-md-2"></div>
    <div class=" col-sm-6 col-md-6">            
             <input type="text"  id="chassis_number" class="form-control  @error('chassis_number') error @enderror" id="chassis_number" placeholder="ENTER CHASSIS NUMBER.." value=""  >
           
            <br>
			<p id="error" style="color:red;"></p>
    </div>
   <div class=" col-sm-6 col-md-2 ">
           
     <button  class="form-control btn btn-lg btn-info" onclick="getVehicle()" type="button" name="submit" data-loading-text="Processing...">
      <i class="fa fa-fw fa-search"></i>
      Check Details        
	  </button>             
    </div>
    <div class=" col-sm-6 col-md-2"></div>
    <div class="col-md-12 text-center" style="display:none;">
      <img id="itmimg" src="" style="max-height: 110px;">
    </div>
    <div class="col-md-12">
       <div class="table-responsive">
        <table id="invoiceTable" class="table table-striped table-editable table-bordered mb-0">
            <div class="col-sm-12 col-md-12 bg-info">

            <h4 class="text-center">Change Battery</h4>

              
            </div>
  <div class="row">
  <!-- Battery Type Dropdown -->
  <div class="col-sm-6 col-md-3">
    <label for="battery_type" class="control-label">
      Change Battery<i class="required">*</i>
    </label>
    <select class="form-control input-sm text-center" name="change_battery" id="battery_type" required onchange="getSerialInputs()">
      <option value="">Select Product</option>
      <option value="LEAD GHREFINE">LEAD GHREFINE</option>
      <option value="LITHIUM">LITHIUM</option>
    </select>
  </div>

  <!-- Battery Volt Dropdown -->
  <div class="col-sm-6 col-md-3">
    <label for="battery_volt" class="control-label">
      Battery Volt<i class="required">*</i>
    </label>
    <select class="form-control input-sm text-center" name="battery_voltage" id="battery_volt" required onchange="getSerialInputs()">
      <option value="">Select Volt</option>
      <option value="48">48v</option>
      <option value="60">60v</option>
      <option value="72">72v</option>
    </select>
  </div>

  <!-- Battery Serial Input Field -->
  <div id="serial_inputs" class="col-sm-12 col-md-6">
    <!-- The serial input fields will be inserted here by jQuery -->
  </div>
</div>

<script>
  function getSerialInputs() {
    const batteryType = $('#battery_type').val();  // Get selected battery type
    const batteryVolt = $('#battery_volt').val();  // Get selected voltage

    // Clear the previous serial inputs
    $('#serial_inputs').empty();

    // Only proceed if both battery type and voltage are selected
    if (batteryType && batteryVolt) {
      let serialCount = 0;

      // Logic for LEAD GHREFINE batteries
      if (batteryType === 'LEAD GHREFINE') {
        if (batteryVolt === '48') {
          serialCount = 4;  // Add 4 serial fields for 48v LEAD
        } else if (batteryVolt === '60') {
          serialCount = 5;  // Add 5 serial fields for 60v LEAD
        } else if (batteryVolt === '72') {
          serialCount = 6;  // Add 6 serial fields for 72v LEAD
        }
      }
      // Logic for LITHIUM batteries
      else if (batteryType === 'LITHIUM') {
        serialCount = 1;  // Only 1 serial input for LITHIUM batteries
      }

      // Append the correct number of serial inputs
      for (let i = 0; i < serialCount; i++) {
        $('#serial_inputs').append(`
          <div class="col-sm-6 col-md-4">
            <label for="serial_${i}" class="control-label">
              Battery Serial <i class="required">*</i>
            </label>
            <input
              id="serial_${i}"
              class="form-control input-sm text-center"
              type="text"
              name="new_serial[]"
              required
            >
          </div>
        `);
      }
    }
  }
</script>

<br>
           <div class="col-sm-12 col-md-12 bg-info">

            <h4 class="text-center">Vehicle Details</h4>

              <input class="form-control input-sm text-center "  type="hidden" readonly name="image">
             
            
            </div>
         
          <div class="col-md-12">
            <div class=" col-sm-6 col-md-3 ">
              <label for="name" class="control-label">
                Vehicle Name<i class="required">*</i>
              </label>
              
              <!-- <input class="form-control input-sm text-center itemName"  type="text" readonly name="itemName" required> -->
              <select class="form-control input-sm text-center requiredfiled"  onchange="getItemDetail(this.value)" name="chassis_number" id="chassisnumber" required>
             <option >Select Product</option> 
              @foreach($products as $data)              
              <option value="{{$data->chassis_number}}">{{$data->name}}-{{$data->chassis_number}}</option>
              @endforeach
            </select>
              <input class="itemid" type="hidden"  name="itemid[]" value="">
             
            </div>
            <div class="col-sm-6 col-md-2 ">
              <label for="name" class="control-label">
                Vehicle Color<i class="required">*</i>
              </label>
              <input class="form-control input-sm text-center color"  type="text" readonly name="color" id="color" required>
            </div>
            <div class="col-sm-6 col-md-2 ">
              <label for="name" class="control-label">
                HSN Number<i class="required">*</i>
              </label>
              <input class="form-control input-sm text-center hsn"  type="text" readonly name="hsn" id="hsn" required>
            </div>
            <div class="col-sm-6 col-md-3 ">
              <label for="name" class="control-label">
                Controller Number<i class="required">*</i>
              </label>
              <input class="form-control input-sm text-center hsn"  type="text"  name="control_number" id="control_number" required readonly>
            </div>
            <div class="col-sm-6 col-md-2 ">
              <label for="name" class="control-label">
                Controller Warranty<i class="required">*</i>
              </label>
              <input class="form-control input-sm text-center "  type="text"  name="control_warranty" id="control_warranty" value="" required>
             
            </div>

          </div>
           <div class="col-md-12">
            
            <div class="col-sm-6 col-md-3 ">
              <label for="name" class="control-label">
                Moter Number<i class="required">*</i>
              </label>
              <input class="form-control input-sm text-center color"  type="text"  name="moter_number" id="moter_number" required>
            </div>
            <div class="col-sm-6 col-md-2 ">
              <label for="name" class="control-label">
                Moter Warranty (Month)<i class="required">*</i>
              </label>
              <input class="form-control input-sm text-center "  type="text"  name="moter_warranty" id="moter_warranty" value="" required>
             
            </div>
           
              <!-- <div class="col-sm-6 col-md-2 ">
              <label for="name" class="control-label">
                Rang
              </label>
              
            </div>-->
            <div class=" col-sm-6 col-md-3 ">
              <label for="name" class="control-label">
                Charger Serial<i class="required">*</i>
              </label>
              <input class="form-control input-sm text-center"  type="hidden"  name="riding_range" id="riding_range">
              <!-- <input class="form-control input-sm text-center itemName"  type="text" readonly name="itemName" required> -->
              <input type="text" required class="form-control input-sm text-center"   name="charger_Serial" id="charger_Serial"  >
             
              <input class="itemid" type="hidden"  name="itemid[]" value="">
             
            </div>
          </div>
          <div class="col-md-12" style="padding-bottom: 10px;">
            <!--<div class=" col-sm-6 col-md-3 ">
              <label for="name" class="control-label">
                Volt<i class="required">*</i>
              </label>
              
              <input class="form-control input-sm text-center"  type="text" readonly name="battery_volt" id="battery_volt" required>
             
            </div>-->
            
            <div class="col-sm-6 col-md-3 ">
              
            </div>
            <div class="col-sm-6 col-md-2 ">
              
            </div>
 
          </div>
          
        
        <tfoot>
          <tr class="bg-info">
            <th class="text-right" colspan="9">
            MRP                  </th>
            <th class="col-sm-2 text-right">
              <input  type="hidden" name="qty" oninput="calculateTotal(this)" value="1" required>
              <input class="form-control input-sm text-center mrp"  type="text" name="mrp" id="mrp" oninput="calculateTotal(this)" required>
              
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
          <tr class="bg-info">
            <th class="text-right" colspan="9">
            UNIT PRICE                  </th>
            <th class="col-sm-2 text-right">
              <input class="form-control input-sm text-center unitPrice"  type="text" name="unitPrice" id="unitPrice" readonly oninput="calculateTotal(this)">
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
		  <tr class="bg-info">
            <th class="text-right" colspan="9">
            Discount Amount                  </th>
            <th class="col-sm-2 text-right">
              <input class="form-control input-sm text-center discount" type="number" name="discount" id="discount"  oninput="calculateTotal(this)" value="0" required>
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
          <tr class="bg-info">
            <th class="text-right" colspan="9">
            Taxable Amount                  </th>
            <th class="col-sm-2 text-right">
              <input class="form-control input-sm text-center requiredfiled" type="number" name="taxableAmount" id="taxableAmount" readonly>
              <h4 class="text-center"><b></b></h4>
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
		    
          <tr class="bg-info">
            <th class="text-right" colspan="9">
            GST(%)                  </th>
            <th class="col-sm-2 text-right">
              <select class="form-control input-sm text-center"  name="gst_percent" id="gst_percent" onchange ="calculateTotal(this)" required> 
              @foreach($GstTax as $data)
              
              <option value="{{$data->value}}">{{$data->name}}</option>

              @endforeach
              <!-- <input class="itemid" type="hidden"  name="itemid[]" value="">
               -->
             </select>
              <h4 class="text-center"><b></b></h4>
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
          <tr class="bg-info">
            <th class="text-right" colspan="9">
            GST Amount                  </th>
            <th class="col-sm-2 text-right">
              <input class="form-control input-sm text-center" type="text" name="sgstUtgst" id="sgstUtgst" value="0" readonly>
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
        
          <tr class="bg-yellow">
            <th class="text-right" colspan="9">
            Payable Amount                  </th>
            <th class="col-sm-2 text-right">
              <input class="form-control input-sm text-center" type="text" name="totalValue" id="totalValue" value="0" readonly>
            
              <h4 class="text-center"><b></b></h4>
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
		  <tr class="bg-blue">
            <th class="text-right" colspan="9">
            Down Amount                  </th>
            <th class="col-sm-2 text-right">
              <input class="form-control input-sm text-center" type="number" name="down_amount" id="down_amount" value="0" >
            
              <h4 class="text-center"><b></b></h4>
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
          <tr class="bg-blue">
            <th class="text-right" colspan="9">
            Payment Method                  </th>
            <th class="col-sm-2 text-center">
              <select id="pmethod-id" class="form-control select2" name="payment_method" onchange="paymentHandler(this.value)">
                <option value="Cash">Cash</option>
                <option value="Cheque">Cheque</option>                
                <option value="Bank">Bank</option>
				<option value="UPI">UPI</option>
				<option value="Razorpay">Razorpay</option>
				<option value="Payu">Payu</option>
				<option value="Cashfree">Cashfree</option>
				<option value="Easebuzz">Easebuzz</option>
				
              </select>
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>
          <tr class="bg-blue">
            <th class="text-right" colspan="9">
            Paid Amount                  </th>
            <th class="col-sm-2 text-right" >
             
              <input type="text" id="paid_amount" class="text-center paidAmount" style="background-color: #fff;"  name="paid_amount" value="">
            </th>
            <th class="w-25p">&nbsp;</th>
          </tr>

				</tfoot>
			  </table>
			</div>
		  </div>
		</div>
		</div>
              <div class="form-group">
                <div class="col-sm-4 col-sm-offset-3 text-center submittype">            
                  <button id="create-purchase-submit" class="btn btn-block btn-lg btn-info" data-form="#form-purchase" data-datatable="#purchase-purchase-list" name="submit" data-loading-text="Processing...">
                    <i class="fa fa-fw fa-save"></i>
                      Submit        </button>
                </div>
				
				 <div class="col-sm-4 col-sm-offset-3 text-center buttontype" style="display:none">            
                  <button type="button" id="create-purchase-submit" class="btn btn-block btn-lg btn-info"  name="submit" data-loading-text="Processing..." onclick="doPayemnt()">
                    <i class="fa fa-fw fa-save"></i>
                      Submit        </button>
                </div>
                <div class="col-sm-2 text-center">            
                  <button type="reset" class="btn btn-block btn-lg btn-danger" id="reset" name="reset">
                    <span class="fa fa-fw fa-circle-o"></span>
                      Reset        </button>
                </div>
              </div>
            </div>
<input type="hidden" name="payment_info" id="payment_info" value="" />
          </form>
        

<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script>

function doPayemnt()
{
	var error=0;
	 $(".requiredfiled").each(function(){
       if(!$(this).val())
	   {
		   error=1;
	   }
    });
	if(error)
	{
		return false;
	}
	var name = $('#name').val();
	var phone = $('#Phone').val();
	var email = $('#Email').val();
	var amount = $('#totalValue').val()-$('#down_amount').val();
	
	 var options = {

								
								"key": "{{env('RAZORPAY_KEY')}}",								

								"amount": amount*100,

								"name": "SMGO",

								"description": "description",

								"image": "https://spvaigautomobiles.com/assets/autoev/images/logo.png ",

								"handler": function(response) {
									jQuery('#payment_info').val(response.razorpay_payment_id);							      
									jQuery('#customer_vehicle_order_form').submit();									 

								},

								"prefill": {

									"name": name, 

									"email": email, 

									"contact": "+91"+phone

								},

								"notes": {

									"address": "address" //customer address 

								},

								"theme": {

									"color": "#15b8f3" // screen color

								},
								"modal": {
									"ondismiss": function(){
										
									       //history.go(-1);					 

									}
								}
								

							};

							var propay = new Razorpay(options);

							propay.open();
}

function paymentHandler(pay_method)
{
	if(pay_method=='Razorpay')
	{
		 
		$('.submittype').hide();
		$('.buttontype').show();
		
	}else
	{
		$('.submittype').show();
		$('.buttontype').hide();
	}
}

function getCity(state_id)
{
	 $.ajax({
            type: "GET",
            url: "{{url('admin/city-list')}}/" + state_id,
            dataType: 'json',
            success: function(response) {
                console.log(response.cities);
                 var option = '';
                if (response.status) {
                     option += '<option value="" selected disabled> -- Select Option -- </option>';
                    for (let index = 0; index < response.cities.length; index++) {
                        option += "<option value='" + response.cities[index].id + "'>" + response.cities[index].name + "</option>";
                    }
                   $('#city_id').html(option);
                } else {
                    $('#city_id').html(option);
                }
            }
        });
}
function getVehicle()
{
	var chassis_number = $('#chassis_number').val();
	if(chassis_number)
	{
	 $.ajax({
            type: "GET",
            url: "{{url('admin/vehicle-detail')}}" +'/'+ chassis_number,
            dataType: 'json',
            success: function(response) {
                console.log(response);
               
                if (response.status == "Success") {         
                    var item_details = response.item_details;  
                   if(item_details)	
				   {					   
                      $('#color').val(item_details.color);
					  $('#hsn').val(item_details.hsn);
					  $('#control_number').val(item_details.controller);
					  $('#control_warranty').val(item_details.controller_warranty);
					  $('#moter_warranty').val(item_details.moter_warranty);
					  $('#moter_number').val(item_details.moter);
					  $('#battary_number').val(item_details.serial);
					  $('#battery_type').val(item_details.battery_type);
					  $('#battary_warranty').val(item_details.warranty);
					  $('#battery_volt').val((item_details.battery_volt).substring(0, 2));
					  $('#riding_range').val(item_details.riding_range);
					  $('#mrp').val(response.customer_price);
					  $('#unitPrice').val(response.customer_price);
					  $('#taxableAmount').val(response.customer_price);
					  $('#payableamount').val(response.customer_price);
					  $('#chassisnumber').val(item_details.chassis_number);
					  $('#charger_Serial').val(item_details.charger_serial_number);
					  
					  $('#itmimg').attr('src','/'+item_details.image);
					  $('#error').html('');
					  $('#serial_inputs').empty();
					   for (let i = 0; i < item_details.battery_serial_numbers.length; i++) {
							$('#serial_inputs').append('<div class="col-sm-6 col-md-4">\
							<label for="serial_'+i+'" class="control-label">\
								  Battery Serial <i class="required">*</i>\
								</label><input id="serial_'+i+'" class="form-control input-sm text-center"value="'+item_details.battery_serial_numbers[i]+'" type="text" name="new_serial[]" required></div>');
						  }
					  
				   }else{
					   $('#color').val('');
					  $('#hsn').val('');
					  $('#control_number').val('');
					  $('#control_warranty').val('');
					  $('#moter_warranty').val('');
					  $('#moter_number').val('');
					  $('#battary_number').val('');
					  $('#battery_type').val('');
					  $('#battary_warranty').val('');
					  $('#battery_volt').val('');
					  $('#riding_range').val('');
					  $('#mrp').val(0);
					  $('#unitPrice').val(0);
					  $('#taxableAmount').val(0);
					  $('#payableamount').val(0);
					  $('#chassisnumber').val('');
					  $('#itmimg').attr('src','');
					  $('#error').html('Chassis number not found!');
					  setTimeout(function(){$('#error').html('')},5000);
				   }
				  calculateTotal();
          
                }else if(response.status == "Failed"){
					$('#error').html(response.message);
					  setTimeout(function(){$('#error').html('')},5000);
				} else {
                    $('#error').html(response[0].Message);
                  
                }
            }
        });
	}
	
}
function getItemDetail(val)
{
   
    $('#chassis_number').val(val);
	getVehicle();
  
}
        function addNewProductRow() {
            // Clone the template row
            var newRow = document.querySelector('#invoiceTable tbody tr').cloneNode(true);

            // Clear the input values in the new row
            var inputs = newRow.querySelectorAll('input');
            inputs.forEach(input => {
                input.value = '';
                if (input.name === 'totalValue[]' || input.name === 'taxableAmount[]') {
                    input.value = 0;
                }
            });

            // Append the new row to the table
            document.querySelector('#invoiceTable tbody').appendChild(newRow);
        }

        function calculateTotal(input='') {
           
            //var row = input.closest('tr'); // Find the closest table row element
            //var div = input.closest('div'); // Find the closest div element
            var qty = 1;
            var mrp = parseFloat($('#mrp').val()) || 0;
            var unitPrice = parseFloat($('#unitPrice').val()) || 0;
            var discount = parseFloat($('#discount').val()) || 0;
			
			$('#unitPrice').val(mrp);
            var taxableAmount = qty * mrp;
            var cgst = parseFloat($('#gst_percent').val()) || 0;
			
			taxableAmount -=discount;
            //var cgst = parseFloat(row.find("select[name^='cgst']").val()) || 0;

            //var sgstUtgst = parseFloat(row.querySelector('input[name="sgstUtgst[]"]').value) || 0;

            var gstamtValue = (taxableAmount * cgst/100) || 0;

            $('#sgstUtgst').val( gstamtValue.toFixed(2));

            var totalValue = (taxableAmount + gstamtValue) || 0;

            // Update the Taxable Amount and TOTAL Value fields
            
            document.querySelector('input[name="totalValue"]').value = totalValue.toFixed(2);
            document.querySelector('input[name="taxableAmount"]').value = taxableAmount.toFixed(2);
            // Update the overall TOTAL Value
            updateOverallTotal();
        }

        function updateOverallTotal() {
            var totalValues = document.querySelectorAll('input[name="totalValue"]');
            var overallTotal = 0;

            totalValues.forEach(input => {
                overallTotal += parseFloat(input.value) || 0;
            });

          //  document.getElementById('total').textContent =  overallTotal.toFixed(2);
          document.getElementById('paid_amount').value =  overallTotal.toFixed(2);
      
      
        }

        function removeRow(button) {
            // Only remove rows after the first row
            var row = button.closest('tr');
            if (row.rowIndex !== 1) {
                row.parentNode.removeChild(row);

                // Update the overall TOTAL Value after removing the row
                updateOverallTotal();
            }
        }
    </script>

          

<script type="text/javascript">
$(document).ready(function() {
  $('.datepicker').datepicker({
    language: langCode,
    format: "yyyy-mm-dd",
    autoclose:true,
    todayHighlight: true
  }).datepicker("setDate",'now');
});
</script>        
      
  
  </section>
  <!-- Content End -->
</div>
<!-- Content Wrapper End -->

        </div>
      </div>
      </section>
  <!-- Content End -->

</div>
<!-- Content Wrapper End -->
    
   
    <div class="scrolling-sidebar-bg"></div>
    <div class="scrolling-sidebar-mask"></div>
    <!-- Scrolling Sidebar End -->
 
</div>
<!-- End Wrapper -->





<style>
.profitWrap
{
  padding: 5px;
}
</style>

@endsection



<script> 
  //   function getRefDetail(refid)
  // {
  //   if(refid !='')
  //   {
  //    var url = "{{ url('get-referral') }}"+'/'+refid;    
  //    $.ajax({
  //           type: "GET",
  //           url: url,
  //           dataType: 'json',
  //           success: function(response) {
  //               console.log(response);
              
  //               if (response.status == "1") {
  //                  $('#refname').html('<span style="color: #f5f6fa;">'+response.name+'</span>');
                             
  //                   $('#user_type').val(response.slug);
  //         $('#select2-user_type-container').html(response.rolename);  
  //                   defaultid(response.slug);         

  //               } else {
  //                   $('#refname').html('<span style="color: #ef1806;">'+response.message+'</span>');
  //               }
  //           }
  //       });
  //   }else{
  //      $('#refname').html('');
  //   }
    
  // }
    function getPostOffice(m_pincode) {
        //var pin_select = ('#pinaddress').val();
        $.ajax({
            type: "GET",
            url: "https://api.postalpincode.in/pincode/" + m_pincode,
            dataType: 'json',
            success: function(response) {
                console.log(response);
                var option = '';
                if (response[0].Status == "Success") {
                    var PostOffice = response[0].PostOffice;
                    var len = PostOffice.length;
                    option += '<option value="" selected disabled> -- Select Option -- </option>';
                    for (let index = 0; index < PostOffice.length; index++) {
                        option += "<option value='" + PostOffice[index].Name + "'>" + PostOffice[index].Name + ", " + PostOffice[index].District + ", " + PostOffice[index].State + "</option>";
                    }
                    $('#pin_error').html("");
                    $('#post_office').html(option);

                    $("#post_office").on("click", function() {

                    });
                    document.getElementById('post_office').click();

                } else {
                    $('#pin_error').html(response[0].Message);
                    $('#post_office').html("");
                }
            }
        });
    }

    function changeAddress() {
        var pin             = $('#pin').val();
        var post_office     = $('#post_office').val();
        $.ajax({
            type: "GET",
            url: "https://api.postalpincode.in/pincode/" + pin,
            dataType: 'json',
            success: function(response) {
                console.log(response);
                var pin_select_status = 0;
                var option = '';
                if (response[0].Status == "Success") {
                    var PostOffice = response[0].PostOffice;
                    option += '<option value="" selected disabled> -- Select Option -- </option>';
                    for (let index = 0; index < PostOffice.length; index++) {
                        if (post_office == PostOffice[index].Name) {
                            pin_select_status   = 1;
                            $('#city').val(PostOffice[index].District);
                            $('#state').val(PostOffice[index].State);
                            $('#country').val(PostOffice[index].Country);
                        }
                        option += "<option value='" + PostOffice[index].Name + "'>" + PostOffice[index].Name + ", " + PostOffice[index].District + ", " + PostOffice[index].State + "</option>";
                    }
                    if (pin_select_status == 0) {
                        $('#pin_error').html("Error Please re-select address.");
                        $('#post_office').html(option);
                    } else {
                        $('#pin_error').html('');
                    }
                } else {
                    $('#pin_error').html(response[0].Message);
                    $('#post_office').html('');
                }
            }
        });
    }
    // function PanValidate(panVal) {
    //     var regpan = /^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$/;

    //     if(regpan.test(panVal)){
    //         // valid pan card number
    //         $('#pan_error').html('');
    //         var url = "{{ url('pan_validate') }}";

    //         $.ajax({
    //             url: url,
    //             headers: {
    //                 'X-CSRF-TOKEN': '{{ csrf_token() }}'
    //             },
    //             type: "POST",
    //             data: {
    //                 'pan': panVal
    //             },
    //             dataType: 'json',
    //             context: this,
    //             success: function(result) {
    //                 if(result.message=="PAN verified successfully"){
    //                     $('#name').val(result.registered_name);
    //                     $('#father_name').val(result.father_name);
    //                 } else {
    //                     $('#name').val('');
    //                     $('#father_name').val('');
    //                     $('#pan_error').html(result.message);
    //                 }
    //                 console.log(result);
    //             },
    //             error: function(error) {
    //                 console.log(error.responseText);
    //             }
    //         });
    //     } else {
    //         $('#pan_error').html('invalid pan card number');
    //     }
    // }



    // NioApp.Toast('This is a note for top right toast message.', 'info', {
    //   position: 'top-right'
    // });
    
    // NioApp.Toast('<h5>Update Successfully</h5><p>Your profile has been successfully updated.</p>', 'success');

    // var url = "";
    // Swal.fire({
    //     title: "Registration Successfull!",
    //     html: "Your User Id is <h4>user->user_id</h4> and Password is <h4>password</h4> <h5><a href='"+url+"'> Click here to Login </a></h5>",
    //     icon: "success",
    //     showCancelButton: true,
    //     showCloseButton: true,
    // });
	
	function isNumber(evt) {
    evt = (evt) ? evt : window.event;
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && (charCode < 48 || charCode > 57)) {
        return false;
    }
    return true;
}
</script>
<script>
    // alert(document.cookie);
    getLocation();
    function getLocation() {
      if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
      } else { 
        alert("Geolocation is not supported by this browser.");
      }
    }
    
    function showPosition(position) {
        
      document.getElementById("latitude").value=position.coords.latitude;
      document.getElementById("longitude").value=position.coords.longitude;
      sessionStorage.setItem("latitude", position.coords.latitude);
      sessionStorage.setItem("longitude", position.coords.longitude);
    }
    </script>