<div class="container-fluid py-5">
    
    <h3 class="text-center py-2">Add Fare</h3>
    <!--<span class="text-danger">(*)Fields are Mandatory</span>-->
      <?php 
	$success=$this->session->flashdata('message_name');
	$error=$this->session->flashdata('error');
	
	if(!empty($success)) { ?>

	<div class="alert alert-success col-md-6 mx-auto py-1 rounded-0 mb-3">
	<strong>Success!</strong> <?php echo $this->session->flashdata('message_name'); ?>
	</div>

	<?php } ?>
	<?php if(!empty($error)) { ?>

	<div class="alert alert-danger col-md-6 mx-auto py-1 rounded-0 mb-3">
	<strong>Error!</strong> <?php echo $this->session->flashdata('error'); ?>
	</div>

	<?php } ?>
    <div class="box-body">
		<form action="<?=base_url()?>Admin/add_cabfare" method="post"  enctype="multipart/form-data" >
						<div class="row col-md-11 mx-auto p-2 bg-white py-3 gy-3">
							<div class="form-group  col-md-6">
							<label for="gender" class="col-sm-3 control-label">Vehicle Type <em class="text-danger">*</em></label>
						<select class="form-control" name="veh_type" required >
						  
						    
					                                   <option value="0" selected=""> Selected Vehicle Type</option>
 
                                   <?php 
                        $rs = $this->Login_model->Select('tbl_vehicletype', '*', array());
                        foreach($rs as $r){?>
                        <option value="<?=$r->id;?>" ><?=$r->name;?></option>
                        <?php } ?>             
						    
						    
						</select>
						</div>
						<div class="form-group  col-md-6">
							<label for="input_email" class="control-label">Per Kilometer Charge<em class="text-danger">*</em></label>
							<div class="col-sm-offset-1">
								<input class="form-control" id="input_email" placeholder="Per Kilometer Charge" name="km_charge" type="number" required>
							
							</div>
						</div>
							<div class="form-group  col-md-6">
							<label for="input_status" class="control-label">Capacity </label>
							<div class="col-sm-offset-1">
								<input class="form-control" id="city" placeholder="Capacity" name="capacity" type="number" required>
								<span class="text-danger"></span>
							</div>
						</div>
						<div class="form-group  col-md-6">
							<label for="input_password" class="control-label">Waiting Time Limit (In Minutes)<em class="text-danger">*</em></label>
							<div class="col-sm-offset-1">
								<input class="form-control" id="input_password" placeholder="Waiting Time Limit in minute" name="wait_limit" type="number" required>
								
							</div>
						</div>
					
					
						<div class="form-group  col-md-6 ">
							<label for="input_status" class="control-label">Waiting Charges (Per Minute) <em class="text-danger">*</em></label>
							<div class="col-sm-offset-1">
								<input class="form-control" id="mobile_number" placeholder="Waiting Charges" name="wait_charge" type="number"  required="required">
							
							</div>
						</div>
					
						<div class="form-group  col-md-6">
							<label for="input_status" class="control-label">Schedule Ride Fare* </label>
							<div class="col-sm-offset-1">
								<input class="form-control" id="address_line1" placeholder="Schedule Ride Fare" name="sch_ride" type="number" required>
								<span class="text-danger"></span>
							</div>
						</div>
					
					
								<div class="form-group  col-md-6">
							<label for="gender" class="control-label">Apply Night Fare <em class="text-danger">*</em></label>
						<select class="form-control" id="night_fare"  onchange="toggleDivVisibility()" name="night_fare_sts" required >
						    <option value="0">No</option>
						     <option value="1">Yes</option>
						</select>
						</div>
						
					
				<div class="col-md-12" id= "night_fare_div" style="display:none;">
                <div class="panel panel-info">
                  <div class="panel-header">
                    <h4> Night Fare Details </h4>
                  </div>
                  <div class="panel-body" >
                    <div class="row">
                   
                      <div class="night-fare-row">
                        <div class="row">
                          <div class="col-md-4">
                            <div class="input-addon">
                              <label>
                                Start Time
                              </label>
                             <input type="time"  class="form-control" name="strt_time" >
                              <span class="input-suffix"></span>
                            </div>
                           
                          </div>
                          <div class="col-md-4">
                            <div class="input-addon">
                              <label>
                                End Time
                              </label>
                              <input type="time"  class="form-control" name="end_time" >
                            </div>
                           
                          </div>
                          <div class="col-md-4 night-fare-wrap">
                            <div class="input-addon">
                              <label class="night-fare-label">
                                Night Fare(%)
                                <i id="night-fare-tooltip" data-toggle="tooltip" data-html="true" class="glyphicon  glyphicon-info-sign admin_fare_tooltip" title="Normal fare = 100<br>Night Fare x = 2 <br>Night Time Pricing x2 = 100<br>sub total = 200"></i>
                              </label>
                              <input type="number" id="night_fare_charge" name="night_fare" class="form-control " placeholder="Enter night fare charges">
                              <span id="error-message" style="color: red; display: none;">Percentage cannot be greater than 100</span>
                            </div>
                            
                          </div>
                        </div>
                        <span class="text-danger night_fare_error hide" id="night_fare_error">Please Choose Valid Time</span>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
				
			
				
				
			<div class="py-3 text-end">
			    <button type="submit" id="sub_btn" class="btn btn-primary">Add Fare</button>
			</div>
					</div>
					
					
					
					</form>
											</div>
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
</div>



<script>
$(document).ready(function () {
  
    function validateNightFare() {
        let value = parseFloat($('#night_fare_charge').val());
        if (isNaN(value) || value < 0 || value > 100) {
            $('#error-message').show(); 
            $('#night_fare_charge').val(''); 
            $('#night_fare_charge').addClass('is-invalid');
        } else {
            $('#error-message').hide(); 
            $('#night_fare_charge').removeClass('is-invalid'); 
        }
    }

   
    $('#night_fare_charge').on('input', function () {
        validateNightFare();
    });
});

</script>

<script>
 function toggleDivVisibility() {

  const optionSelect = document.getElementById('night_fare');
  
  const hiddenDiv = document.getElementById('night_fare_div');

  
    if (optionSelect.value === '1') {
      hiddenDiv.style.display = 'block';
    } else {
      hiddenDiv.style.display = 'none';
    }
}
</script>

<script>
     function onlyNumberKey(evt) {
              
            // Only ASCII character in that range allowed
            var ASCIICode = (evt.which) ? evt.which : evt.keyCode
            if (ASCIICode > 31 && (ASCIICode < 48 || ASCIICode > 57))
                return false;
            return true;
        }
</script>


