<?php
require_once 'header.php';
require_once 'navbar.php';
$id = $_GET['id'];

$q=$conn->query("SELECT * FROM route WHERE route.id='$id'");
$res=$q->fetch_assoc();

$sql="select id,type from cab_types";
$result=$conn->query($sql);
if($result->num_rows>0)
{
    while($row=$result->fetch_assoc())
    {
        $cab_types[]=$row;
    }
}
?>
<!-- Page content -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<div class="container-fluid pt-8">
    <div class="page-header mt-0 p-3">
        <h3 class="mb-sm-0">Edit Route</h3>
        <a href="routes" class="btn btn-primary pull-right">Back</a>
    </div>
    <div id="alert"></div>
    <div class="card shadow">
        <div class="p-4">
            <div class="grid-margin">
              <form method="post" id="edit_route">
                <div class="row">
                    <div class="col-lg-12 d-flex align-items-center mb-3">
                        <h2 class=" mb-0">Edit Route</h2>
                        <?php if ($res['reverse_route']==0) { ?>
                            <div class="toggle-button-cover routes pl-3">
                                <div id="button-3" class="button r">
                                    <input class="checkbox reverse_checkbox" name="route_reverse" value="1" type="checkbox">
                                    <div class="knobs"></div>
                                    <div class="layer"></div>
                                </div>
                            </div>
                        <?php }elseif($res['reverse_route']==1){ ?>
                            <div class="toggle-button-cover routes pl-3">
                                <div id="button-3" class="button r">
                                    <input class="checkbox reverse_checkbox" disabled checked value="1" type="checkbox">
                                    <div class="knobs"></div>
                                    <div class="layer"></div>
                                </div>
                            </div>
                        <?php } ?>
                    </div>
                    <div class="col-lg-7">
                        <div class="row">
                            <div class="col-md-6 form-group">
                                <label>From</label>
                                <input type="hidden" name="reverse_route" id="reverse_route">
                                <input type="hidden" name="route_id" value="<?=$id?>">
                                <input type="text" class="form-control" value="<?=$res['city1']?>" id="address_one" name="edit_from" required>
                            </div>
                            <div class="col-md-6 form-group">
                                <label>To</label>
                                <input type="text" class="form-control" value="<?=$res['city2']?>" id="address_two" name="edit_to" required>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-5">
                        <div class="row">
                            <div class="col-md-4 form-group">
                                <label>Distance</label>
                                <input type="number" class="form-control" name="distance"  value="<?=$res['distance']?>" required>
                            </div>
                            <div class="col-md-4 form-group">
                                <label>Discount (%)</label>
                                <input type="number" class="form-control" name="discount"  value="<?=$res['discount']?>" required>
                            </div>
                            <div class="col-md-4 form-group">
                                <label>Status</label>
                                <select class="form-control" name="status">
                                    <option value="1" <?php if($res['status']==1){echo 'selected';} ?>>Active</option>
                                    <option value="0" <?php if($res['status']==0){echo 'selected';} ?>>Disabled</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <?php
                $i=1;
                foreach($cab_types as $cab_type){
                    $sql=$conn->query("select * from cab_route where route_id='$id' and cab_type='".$cab_type['id']."'");
                    $row=$sql->fetch_assoc();
                    ?>
                    <hr class="mt-0">
                    <div class="h3 d-flex gap-15 align-items-center"><u><?=$cab_type['type']?></u> 
                        <!-- <div class="toggle-button-cover routes">
                            <div id="button-3" class="button r">
                                <input class="checkbox reverse_checkbox" name="cab_type[<?=$i?>][reverse]" <?php if($row['reverse']==1){echo 'checked';} ?> value="1" type="checkbox">
                                <div class="knobs"></div>
                                <div class="layer"></div>
                            </div>
                        </div> -->
                        <div class="toggle-button-cover round-routes routes">
                            <div id="button-3" class="button r">
                                <input class="checkbox" name="cab_type[<?=$i?>][round]" <?php if($row['round']==1){echo 'checked';} ?> value="1" type="checkbox">
                                <div class="knobs"></div>
                                <div class="layer"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                      <div class="col-md-2 form-group">
                          <label> Amount</label>
                          <input type="number" class="form-control" name="cab_type[<?=$i?>][amount]" value="<?=$row['amount']?>">
                          <input type="hidden" class="form-control" name="cab_type[<?=$i?>][id]" value="<?=$cab_type['id'];?>">
                      </div>
                      <!-- <div class="col-md-2 form-group reverse_amount_box<?=$i?>" <?php if($res['reverse_route']!=1){ ?> style="display: none;" <?php } ?>>
                          <label> Reverse Amount</label>
                          <input type="number" class="form-control" name="cab_type[<?=$i?>][reverse_amount]" value="<?=$row['reverse_amount']?>">
                      </div> -->
                      <div class="col-md-2 form-group round_amount_box<?=$i?>" <?php if($row['round']==0){ ?> style="display: none;" <?php } ?>>
                          <label> Round Trip Amount</label>
                          <input type="number" class="form-control" name="cab_type[<?=$i?>][round_amount]" value="<?=$row['round_amount']?>">
                      </div>
                      <div class="col-md-2 form-group">
                          <label> Extra Price/Km</label>
                          <input type="number" class="form-control" name="cab_type[<?=$i?>][extra_amount]" value="<?=$row['extra_amount']?>">
                      </div>
                      <div class="col-md-2 form-group">
                        <label> Select Route Type</label>
                        <select class="form-control" name="cab_type[<?=$i?>][route_type]"  onchange="myFunction<?=$i?>(this.value)">
                          <option value="">Select Option</option>
                          <option value="Weekend" <?php if($row['route_type']=='Weekend'){echo 'selected';} ?>>Weekend</option>
                          <!-- <option value="Festival" <?php if($row['route_type']=='Festival'){echo 'selected';} ?>>Festival</option> -->
                          <option value="Days" <?php if($row['route_type']=='Days'){echo 'selected';} ?>>Days</option>
                      </select>
                  </div>

                  <div class="col-md-2 form-group route_type<?=$i?>">
                    <label> Date From</label>
                    <input type="date" min="<?=date('Y-m-d')?>" class="form-control" value="<?=$row['date_from']?>" name="cab_type[<?=$i?>][date_from]">
                </div>

                <div class="col-md-2 form-group route_type<?=$i?>">
                    <label> Date To</label>
                    <input type="date" min="<?=date('Y-m-d')?>" class="form-control" value="<?=$row['date_to']?>" name="cab_type[<?=$i?>][date_to]">
                </div>

                <div class="col-md-2 form-group route_type<?=$i?>">
                    <label> Amount</label>
                    <input type="number" class="form-control" value="<?=$row['price']?>" name="cab_type[<?=$i?>][price]">
                </div>

                <div class="col-md-2 form-group route_date<?=$i?>">
                  <label> Days</label>
                  <input type="date" class="form-control" id="dateInput<?=$i?>">
              </div>
          </div>
          <div class="row" id="dateForm<?=$i?>"></div>

          <script>
            $(document).ready(function(){
                $('input[name="cab_type[<?=$i?>][reverse]"]').change(function() {
                    if($(this).is(':checked')) {
                        $('.reverse_amount_box<?=$i?>').show();
                    } else {
                        $('.reverse_amount_box<?=$i?>').hide();
                    }
                });
                $('input[name="cab_type[<?=$i?>][round]"]').change(function() {
                    if($(this).is(':checked')) {
                        $('.round_amount_box<?=$i?>').show();
                    } else {
                        $('.round_amount_box<?=$i?>').hide();
                    }
                });
            });

            function myFunction<?=$i?>(e){
                if (e=='Weekend' || e=='Festival') {
                  $('.route_type<?=$i?>').show();
                  $('.route_date<?=$i?>').hide();
              }else if(e=='Days'){
                  $('.route_type<?=$i?>').hide();
                  $('.route_date<?=$i?>').show();
              }else{
                  $('.route_type<?=$i?>').hide();
                  $('.route_date<?=$i?>').hide();
              }
          }

          // date append
          $(document).ready(function() {
            var num = 1;
            $('#dateInput<?=$i?>').change(function() {
                let currentDate = $(this).val();

                $.ajax({
            url: 'route_date_amount.php', // Change to your endpoint
            type: 'POST',
            dataType: "JSON",
            data: {
                date: currentDate,
                route_id: <?=$id?>,
                cab_route_id: <?=$cab_type['id']?>
            },
            success: function(response) {

                $('#dateForm<?=$i?>').html(
                    '<div class="col-md-3 form-group del' + num + ' ' + currentDate + '<?=$i?>">' +
                    '<label class="w-100"><b>(' + currentDate + ')</b> Amount <a class="btn btn-danger btn-sm text-white float-right" onclick="removedate(' + response.id + ')"><i class="fa fa-times m-0"></i></a></label>' +
                    '<input type="number" class="form-control" placeholder="Amount" name="cab_type[<?=$i?>][amt][]" value="' + response.amount + '">' +
                    '<input type="hidden" class="form-control" name="cab_type[<?=$i?>][date][]" value="' + currentDate + '">' +
                    '<input type="hidden" class="form-control" name="cab_type[<?=$i?>][route_date_id][]" value="' + response.id + '">' +
                    '</div>'
                    );

                num++;
            },
            error: function(xhr, status, error) {
                console.error('AJAX Error: ', status, error);
            }
        });
            });
        });


    </script>
    <?php $i++; } ?>
    <hr>
    <div class="col-md-12">
      <input type="submit" name="add" class="btn btn-primary wdt-bg" value="Save Changes">
  </div>

</div>
</form>
</div>
</div>
</div>
</div>
<?php
require_once 'footer.php';
require_once 'jslinks.php';
?>
<script>

  $('#edit_route').submit(function(e) {
    var reverseCheckbox = $('.reverse_checkbox');
    // Check if the checkbox is checked
    if(reverseCheckbox.is(':checked')) {
        $('#reverse_route').val(reverseCheckbox.val());
    }
    e.preventDefault();
    $.ajax({
      url: "ajax_route.php",
      type: "POST",
      data: $("#edit_route").serialize(),
      success: function(response) {
        if(response == "success") {
          $('#alert').html('<div class="alert alert-success">Updated Successfully.</div>').show();
                // setTimeout(function(){ 
                //    $('#alert').hide()
                // }, 2000)

                // Scroll to top smoothly
          $('html, body').animate({ scrollTop: 0 }, 'slow');  
      }
      else {
          $('#alert').html('<div class="alert alert-danger">Something Wrong, can\'t add.</div>').show()
          setTimeout(function(){ 
            $('#alert').hide()
        }, 2000)
      }
  }
});
})

  function removedate(e,num) {
    $('#dateForm'+e+' .del'+num).remove();
}

function removedate(e) {
  var verify = confirm("Do you really want to delete!!!");
  if (verify) {
     $("#global-loader").show();
     $.ajax({
        url: "ajax_route.php",
        type: "POST",
        data: {
          delete_route_price: e,
      },
      success: function (response) {
          $("#global-loader").fadeOut();
          if (response == "success") {
            $("#global-loader").fadeOut();
            $('#alert').html('<div class="alert alert-success">Successfully Deleted</div>').show()
            location.reload();
        } else {
            $('#alert').html('<div class="alert alert-danger">Something Wrong, can\'t delete.</div>').show()
        }
    },
})
 }
}

 $(document).ready(function() {
$('input[name="route_reverse"]').change(function() {
    if($(this).is(':checked')) {
        $('.reverse_amount_box').show();
    } else {
        $('.reverse_amount_box').hide();
    }
});
});
</script>