<?php 

include('include/auth.php');?>
<!doctype html>
<html class="fixed dark">
<?php 

    $pagerole="user";
	include('include/head.php');
   
		?>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/rome/3.0.2/rome.css"
    integrity="sha512-TAAJeGIyqkrJ4o4ZkIPesmqNKH9zowoRBGHkHUf1s4vWeII8Dv3NayKIq8Hws02HWT3OpocxeSaOQEQo9SH7ZQ=="
    crossorigin="anonymous" />
<style>
    .ecommerce-timeline:before {

        box-shadow: none !important;
    }

    .ecommerce-timeline:after {

        box-shadow: none !important;
    }

    .editbutton {
        position: absolute;
        right: 15px;
        top: 10px;
    }

    .editnotes {
        position: absolute;
        right: 15px;
        bottom: 10px;
    }

    .rd-container-attachment {
        z-index: 10002;
        zoom: 80%
    }

    .modal {
        max-width: 90%;
    }
</style>

<body>

    <section class="body">

        <!-- start: header -->
        <header class="header">
            <div class="logo-container">
                <a href="index.php" class="logo">
                    <img src="img/logo-light.png" width="75" height="35" alt="Web Voyage" />
                </a>
                <div class="d-md-none toggle-sidebar-left" data-toggle-class="sidebar-left-opened" data-target="html"
                    data-fire-event="sidebar-left-opened">
                    <i class="fas fa-bars" aria-label="Toggle sidebar"></i>
                </div>
            </div>

            <!-- start: search & user box -->
            <div class="header-right">
                <?php include('include/search.php');?>


                <span class="separator"></span>
                <?php include('include/notifications.php');?>


                <span class="separator"></span>
                <?php include('include/userbox.php');?>

            </div>
            <!-- end: search & user box -->
        </header>
        <!-- end: header -->

        <div class="inner-wrapper">
            <!-- start: sidebar -->
            <?php include('include/nav.php');?>
            <!-- end: sidebar -->

            <section role="main" class="content-body">
                <header class="page-header">
                    <h2>Availability
                    </h2>

                    <div class="right-wrapper text-right">
                        <ol class="breadcrumbs">
                            <li>
                                <a href="index.php">
                                    <i class="fas fa-home"></i>
                                </a>
                            </li>
                            <li><span>WV Admin</span></li>
                            <li><span>Availability </span></li>
                        </ol>

                        <a class="sidebar-right-toggle" data-open="sidebar-right"><i
                                class="fas fa-chevron-left"></i></a>
                    </div>
                </header>

                <!-- start: page -->


                <div class="row">
                    <div class="col-xl-6">
  <form class="order-details" action="livegroupavail.php" method="get" name="availabilityForm">
    <div class="card card">
        <div class="card-header">
            <h2 class="card-title">Specific Group Availability</h2>
        </div>
        <div class="card-body">
            <div class="form-row">
                <div class="form-group col mb-1">
                    <label>14 Days From</label>
                    <input class="form-control" type="date" name="sdateg2" id="sdateg2" required>

                    <label>Vehicle Type:</label>
                    <select class="form-control" id="vehicle_type" name="vehicle_type" required>
                        <option value="">-- Select Type --</option>
                        <option value="1">Car</option>
                        <option value="2">Bike</option>
                    </select>

                    <label>Availability Group:</label>
                    <select class="form-control" id="availability_group" name="cargroup" required>
                        <option value="">-- Select Group --</option>
                        <option value="all">All</option> <!-- "All" option added -->
                    </select>

                    <button class="btn btn-primary mt-2" type="submit">Check Availability</button>
                </div>
            </div>
        </div>
    </div>
</form>


                    </div>
                    <div class="col-xl-6">
                        <form class="order-details" action="livetotalgroupavail.php" method="get" name="groupAvailabilityForm">
    <div class="card card">
        <div class="card-header">
            <h2 class="card-title">Total Group Availability</h2>
        </div>
        <div class="card-body">
            <div class="form-row">
                <div class="form-group col mb-1">
                    <label>14 Days From</label>
                   <input class="form-control" type="date" name="sdateg2" id="sdateg2" required>

                    <label>Vehicle Type:</label>
                    <select class="form-control" name="vehicle_type">
                        <option value="1">Cars</option>
                        <option value="2">Bikes</option>
                    </select>

                    <button class="btn btn-primary mt-2" type="submit">Select</button>
                </div>
            </div>
        </div>
    </div>
</form>

                    </div>
                    
                    
                </div>


                <!-- end: page -->
                <?php include('include/modals.php');?>
            </section>
        </div>

        <?php include('include/aside.php');?>

    </section>


    <!-- Vendor -->
    <script src="vendor/jquery/jquery.js"></script>
    <script src="vendor/jquery-browser-mobile/jquery.browser.mobile.js"></script>
    <script src="vendor/popper/umd/popper.min.js"></script>
    <script src="vendor/bootstrap/js/bootstrap.js"></script>
    <script src="vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
    <script src="vendor/common/common.js"></script>
    <script src="vendor/nanoscroller/nanoscroller.js"></script>
    <script src="vendor/magnific-popup/jquery.magnific-popup.js"></script>
    <script src="vendor/jquery-placeholder/jquery.placeholder.js"></script>

    <!-- Specific Page Vendor -->
    <script src="vendor/select2/js/select2.js"></script>
    <script src="vendor/pnotify/pnotify.custom.js"></script>

    <!--(remove-empty-lines-end)-->

    <!-- Theme Base, Components and Settings -->
    <script src="js/theme.js"></script>

    <!-- Theme Custom -->
    <script src="js/custom.js"></script>

    <!-- Theme Initialization Files -->
    <script src="js/theme.init.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
    <!-- Examples -->
    <script src="js/examples/examples.header.menu.js"></script>
    <script src="js/examples/examples.ecommerce.orders.detail.js"></script>
    <script src="js/examples/examples.modals.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"
        integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ=="
        crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/rome/3.0.2/rome.standalone.min.js"
        integrity="sha512-cJ4aSZY0xBXrcH65MOwCloQAiTNCBm2F8/KlcBTlczgn4txZkT7h3YSXULN06pkUnsySMEg5BU4QCHAr97U7ng=="
        crossorigin="anonymous"></script>

   <script>
   
    $(document).ready(function() {
        $('#vehicle_type').change(function() {
            var vehicleType = $(this).val();
            if (vehicleType) {
                $.ajax({
                    url: 'actions/get_availability_groups.php',
                    type: 'GET',
                    data: { vehicle_type: vehicleType },
                    success: function(response) {
                        $('#availability_group').html('<option value="all">All</option>' + response);
                    }
                });
            } else {
                $('#availability_group').html('<option value="">-- Select Group --</option>');
            }
        });

        $('#availabilityForm').submit(function(event) {
            var selectedGroup = $('#availability_group').val();
            var selectedType = $('#vehicle_type').val();
            
            if (selectedGroup === "all") {
                $('<input>').attr({
                    type: 'hidden',
                    name: 'cargroup',
                    value: selectedType // Set cargroup to 1 for Cars or 2 for Bikes
                }).appendTo('#availabilityForm');
                $('#availability_group').attr('name', ''); // Prevents sending empty cargroup
            }
        });
    });
</script>
</body>

</html>
<?php  include('include/footer.php');?>