168 lines
7.6 KiB
PHP
168 lines
7.6 KiB
PHP
<?php include_once('header02.php');
|
|
?>
|
|
|
|
<style>
|
|
.image {
|
|
width: 400px;
|
|
/* Set your desired width */
|
|
height: 350px;
|
|
/* Set your desired height */
|
|
overflow: hidden;
|
|
/* Hide any overflow */
|
|
display: block;
|
|
/* Ensure proper block behavior */
|
|
}
|
|
|
|
.image img {
|
|
width: 100%;
|
|
/* Image scales to fill the container */
|
|
height: 100%;
|
|
/* Image scales to fill the container */
|
|
object-fit: cover;
|
|
/* Fills the container while maintaining aspect ratio */
|
|
object-position: top;
|
|
/* Aligns the top of the image with the top of the container */
|
|
display: block;
|
|
/* Prevents inline whitespace issues */
|
|
}
|
|
</style>
|
|
|
|
<?php
|
|
$bannerFolder = 'assets/images/banners/';
|
|
$bannerImages = glob($bannerFolder . '*.{jpg,jpeg,png,webp}', GLOB_BRACE);
|
|
|
|
$randomBanner = 'assets/images/base4/camping.jpg'; // default fallback
|
|
if (!empty($bannerImages)) {
|
|
$randomBanner = $bannerImages[array_rand($bannerImages)];
|
|
}
|
|
?>
|
|
<section class="page-banner-area pt-50 pb-35 rel z-1 bgs-cover" style="background-image: url('<?php echo $randomBanner; ?>');">
|
|
<div class="banner-overlay"></div>
|
|
<div class="container">
|
|
<div class="banner-inner text-white mb-50">
|
|
<h2 class="page-title mb-10" data-aos="fade-left" data-aos-duration="1500" data-aos-offset="50">4WDCSA Trips</h2>
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb justify-content-center mb-20" data-aos="fade-right" data-aos-delay="200" data-aos-duration="1500" data-aos-offset="50">
|
|
<li class="breadcrumb-item"><a href="index.php">Home</a></li>
|
|
<li class="breadcrumb-item active">4WDCSA Trips</li>
|
|
</ol>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Tour List Area start -->
|
|
<section class="tour-list-page py-100 rel z-1">
|
|
<div class="container">
|
|
<div class="row">
|
|
|
|
<div class="col-lg-12">
|
|
<div class="shop-shorter rel z-3 mb-20">
|
|
<!-- <ul class="grid-list mb-15 me-2">
|
|
<li><a href="#"><i class="fal fa-border-all"></i></a></li>
|
|
<li><a href="#"><i class="far fa-list"></i></a></li>
|
|
</ul> -->
|
|
<div class="sort-text mb-15 me-4 me-xl-auto">
|
|
<?php echo getTripCount();?> Trips available
|
|
</div>
|
|
<!-- <div class="sort-text mb-15 me-4">
|
|
Sort By
|
|
</div>
|
|
<select>
|
|
<option value="default" selected="">Sort By</option>
|
|
<option value="new">Newness</option>
|
|
<option value="old">Oldest</option>
|
|
<option value="hight-to-low">High To Low</option>
|
|
<option value="low-to-high">Low To High</option>
|
|
</select> -->
|
|
</div>
|
|
<?php
|
|
|
|
|
|
// Query to retrieve data from the trips table
|
|
$sql = "SELECT trip_id, trip_name, location, short_description, start_date, end_date, vehicle_capacity, cost_members, places_booked FROM trips WHERE start_date > CURDATE()";
|
|
$result = $conn->query($sql);
|
|
|
|
if ($result->num_rows > 0) {
|
|
// Loop through each row
|
|
while ($row = $result->fetch_assoc()) {
|
|
$trip_id = $row['trip_id'];
|
|
$trip_name = $row['trip_name'];
|
|
$location = $row['location'];
|
|
$short_description = $row['short_description'];
|
|
$start_date = $row['start_date'];
|
|
$end_date = $row['end_date'];
|
|
$capacity = $row['vehicle_capacity'];
|
|
$cost_members = $row['cost_members'];
|
|
$places_booked = $row['places_booked'];
|
|
$remaining_places = getAvailableSpaces($trip_id);
|
|
|
|
// Determine the badge text based on the status
|
|
$badge_text = ($remaining_places > 0) ? $remaining_places.' PLACES LEFT!!' : 'FULLY BOOKED';
|
|
|
|
// Output the HTML structure with dynamic data
|
|
echo '
|
|
<div class="destination-item style-three bgc-lighter" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50">
|
|
<div class="image">
|
|
<span class="badge bgc-pink">' . $badge_text . '</span>
|
|
<img src="assets/images/trips/' . $trip_id . '_01.jpg" alt="' . $trip_name . '">
|
|
</div>
|
|
<div class="content">
|
|
<div class="destination-header">
|
|
<span class="location"><i class="fal fa-map-marker-alt"></i> ' . $location . '</span>
|
|
<div class="ratting">
|
|
<i class="fas fa-star"></i>
|
|
<i class="fas fa-star"></i>
|
|
<i class="fas fa-star"></i>
|
|
<i class="fas fa-star"></i>
|
|
<i class="fas fa-star"></i>
|
|
</div>
|
|
</div>
|
|
<h5><a href="trip-details.php?token=' . encryptData($trip_id, $salt) . '">' . $trip_name . '</a></h5>
|
|
<p>' . $short_description . '</p>
|
|
<ul class="blog-meta">
|
|
<li><i class="far fa-calendar"></i> ' . convertDate($start_date) . ' - ' . convertDate($end_date) . '</li>
|
|
<li><i class="far fa-clock"></i> '.calculateDaysAndNights($start_date, $end_date).'</li>
|
|
<li><i class="far fa-user"></i>' . $capacity . ' vehicles max</li>
|
|
</ul>
|
|
<div class="destination-footer">
|
|
<span class="price"><span>R ' . $cost_members . '</span>/person</span>
|
|
<a href="trip-details.php?token=' . encryptData($trip_id, $salt) . '" class="theme-btn style-two style-three">
|
|
<span data-hover="Book Now">Book Now</span>
|
|
<i class="fal fa-arrow-right"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>';
|
|
}
|
|
}
|
|
|
|
// Close connection
|
|
$conn->close();
|
|
?>
|
|
|
|
<!-- <ul class="pagination pt-15 flex-wrap" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50">
|
|
<li class="page-item disabled">
|
|
<span class="page-link"><i class="far fa-chevron-left"></i></span>
|
|
</li>
|
|
<li class="page-item active">
|
|
<span class="page-link">
|
|
1
|
|
<span class="sr-only">(current)</span>
|
|
</span>
|
|
</li>
|
|
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
|
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
|
<li class="page-item"><a class="page-link" href="#">...</a></li>
|
|
<li class="page-item">
|
|
<a class="page-link" href="#"><i class="far fa-chevron-right"></i></a>
|
|
</li>
|
|
</ul> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- Tour List Area end -->
|
|
|
|
|
|
<?php include_once("insta_footer.php"); ?>
|