<!DOCTYPE html>
<?php
// Turn off error reporting
$id_villa = $_GET['id'];
error_reporting(0);
include "admin/config/koneksi.php";
$qproduk=mysqli_query($connect,"SELECT * FROM produk where id_produk = '$id_villa'");
$fproduk=mysqli_fetch_array($qproduk);
$id_produk =$fproduk['id_produk'];
$nama=$fproduk['nama'];
$harga=$fproduk['harga'];
$transmisi=$fproduk['transmisi'];
$seat_door=$fproduk['seat_door'];
$foto=$fproduk['foto'];
$deskripsi=$fproduk['deskripsi'];
$jenis=$fproduk['jenis'];
$kategori=$fproduk['kategori'];
// $result = mysqli_query($connect,"SELECT checkindate FROM `booking` WHERE status !='Belum Dibayar' and id_villa=$id_villa");
// $bookedDates = [];
// while ($row = mysqli_fetch_assoc($result)) {
// $bookedDates[] = $row['checkindate'];
// }
$stmt = $connect->prepare("SELECT checkindate, checkoutdate FROM booking WHERE status !='Belum Dibayar' AND id_villa =$id_villa");
$status = 'Belum Dibayar';
$stmt->bind_param("si", $status, $id_villa);
$stmt->execute();
$result = $stmt->get_result();
$bookedDates = [];
while ($row = $result->fetch_assoc()) {
$checkin = new DateTime($row['checkindate']);
$checkout = new DateTime($row['checkoutdate']);
// Loop dari checkin sampai sehari sebelum checkout
$interval = new DateInterval('P1D'); // 1 hari
$period = new DatePeriod($checkin, $interval, $checkout); // exclude checkout date
foreach ($period as $date) {
$bookedDates[] = $date->format('Y-m-d');
}
}
?>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- title -->
<title>Mountana-Villa</title>
<!-- favicon -->
<!-- <link rel="shortcut icon" type="image/png" href="images/logo.png"> -->
<!-- google font -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Poppins:400,700&display=swap" rel="stylesheet">
<!-- fontawesome -->
<link rel="stylesheet" href="assets/css/all.min.css">
<!-- bootstrap -->
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.css">
<!-- owl carousel -->
<link rel="stylesheet" href="assets/css/owl.carousel.css">
<!-- magnific popup -->
<link rel="stylesheet" href="assets/css/magnific-popup.css">
<!-- animate css -->
<link rel="stylesheet" href="assets/css/animate.css">
<!-- mean menu css -->
<link rel="stylesheet" href="assets/css/meanmenu.min.css">
<!-- main style -->
<link rel="stylesheet" href="assets/css/main.css">
<!-- responsive -->
<link rel="stylesheet" href="assets/css/responsive.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css">
</head>
<body>
<!--PreLoader-->
<!--<div class="loader">-->
<!-- <div class="loader-inner">-->
<!-- <div class="circle"></div>-->
<!-- </div>-->
<!--</div>-->
<!--PreLoader Ends-->
<!-- Header -->
<div class="top-header-area" id="sticker">
<div class="container">
<div class="row">
<div class="col-lg-12 col-sm-12 text-center">
<div class="main-menu-wrap">
<!-- logo -->
<div class="site-logo">
<a href="Home">
<!-- <img src="images/logo.png" alt=""> -->
</a>
</div>
<!-- Main Menu -->
<nav class="main-menu d-none d-lg-block">
<ul>
<li class="current-list-item"><a href="Home">Home</a></li>
<li><a href="About">Tentang Kami</a></li>
<li><a href="Booking">Cara Booking</a></li>
<li><a href="Galleri">Galeri Villa</a></li>
<li><a href="Contact">Kontak Kami</a></li>
<li></li>
</ul>
</nav>
<!-- Mobile Menu -->
<div class="mobile-menu d-block d-lg-none"></div>
</div>
</div>
</div>
</div>
</div>
<!-- Hero Area -->
<div class="hero-area hero-bg">
<div class="container">
<img src="admin/modul/mod_produk/mobil/<?php echo "$foto"?>" height="100%" width="100%" alt="Slide 1">
</div>
</div>
<!-- End Hero Area -->
<div class="content-feature">
<!-- features list section -->
<a href="https://wa.me/6282220778332" class="wa-float" target="_blank" title="Chat via WhatsApp">
<img src="https://img.icons8.com/color/48/000000/whatsapp--v1.png" alt="WhatsApp Chat">
</a>
<div class="container my-5">
<!-- <h2 class="mb-4"><i class="fas fa-box-open text-primary"></i> Detail Villa</h2> -->
<div id="accordionDetail">
<!-- Deskripsi Produk -->
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
<i class="fas fa-star"></i> Deskripsi
</button>
</h5>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionDetail">
<div class="card-body">
<p> <?php echo "$deskripsi"?></p>
<div class="row">
<?php
$s_deskripsi=mysqli_query($connect,"SELECT * FROM deskripsi where id_produk = '$id_villa'");
while ($f_deskripsi=mysqli_fetch_array($s_deskripsi)){
$foto_des=$f_deskripsi['foto'];
$teks_des=$f_deskripsi['teks'];
?>
<div class="col-4 text-center">
<img src="admin/modul/mod_deskripsi/villa/<?php echo "$foto_des"?>" alt="Gambar 1" class="img-fluid rounded">
<small><?php echo "$teks_des"?></small>
</div>
<?php ;}?>
</div>
</div>
</div>
</div>
<!-- Spesifikasi -->
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
<i class="fas fa-star"></i> Detail Villa
</button>
</h5>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionDetail">
<div class="card-body">
<ul>
<?php
$s_detail=mysqli_query($connect,"SELECT * FROM detail where id_produk = '$id_villa'");
while ($f_detail=mysqli_fetch_array($s_detail)){
//$foto_des=$f_detail['foto'];
$teks_det=$f_detail['teks'];
?>
<li><?php echo "$teks_det"?></li>
<?php };?>
</ul>
</div>
</div>
</div>
<!-- Ulasan -->
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
<i class="fas fa-star"></i> Fasilitas Villa
</button>
</h5>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionDetail">
<div class="card-body">
<ul>
<?php
$s_fasilitas=mysqli_query($connect,"SELECT * FROM fasilitas where id_produk = '$id_villa'");
while ($f_fasilitas=mysqli_fetch_array($s_fasilitas)){
//$foto_des=$f_detail['foto'];
$teks_fas=$f_fasilitas['teks'];
?>
<li><?php echo "$teks_fas"?></li>
<?php };?>
</ul>
</div>
</div>
</div>
</div>
<!-- Tambahan -->
<!-- <div class="card">
<div class="card-header" id="headingTambahan">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTambahan" aria-expanded="false" aria-controls="collapseTambahan">
<i class="fas fa-star"></i> Tambahan
</button>
</h5>
</div>
<div id="collapseTambahan" class="collapse" aria-labelledby="headingTambahan" data-parent="#accordionDetail">
<div class="card-body">
<p><i class="fas fa-user"></i> ★★★★★ – Produk sangat bagus, kualitas premium dan pelayanan cepat!</p>
</div>
</div>
</div> -->
<!-- Wisata Terdekat -->
<div class="card">
<div class="card-header" id="headingWisata">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseWisata" aria-expanded="false" aria-controls="collapseWisata">
<i class="fas fa-star"></i> Wisata Terdekat
</button>
</h5>
</div>
<div id="collapseWisata" class="collapse" aria-labelledby="headingWisata" data-parent="#accordionDetail">
<div class="card-body">
<ul>
<?php
$s_wisata=mysqli_query($connect,"SELECT * FROM wisata where id_produk = '$id_villa'");
while ($f_wisata=mysqli_fetch_array($s_wisata)){
//$foto_des=$f_detail['foto'];
$teks_wis=$f_wisata['teks'];
?>
<li><?php echo "$teks_wis"?></li>
<?php };?>
</div>
</div>
</div>
<!-- Syarat & Ketentuan -->
<div class="card">
<div class="card-header" id="headingSK">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSK" aria-expanded="false" aria-controls="collapseSK">
<i class="fas fa-star"></i> Syarat & Ketentuan
</button>
</h5>
</div>
<div id="collapseSK" class="collapse" aria-labelledby="headingSK" data-parent="#accordionDetail">
<div class="card-body">
<p><i class="fas fa-user"></i> ★★★★★ – Harap Baca Syarat & Ketentuan Sebelum Melakukan Pemesanan</p>
</div>
</div>
</div>
<!-- Cara Booking -->
<div class="card">
<div class="card-header" id="headingBooking">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseBooking" aria-expanded="false" aria-controls="collapseBooking">
<i class="fas fa-star"></i> Cara Booking
</button>
</h5>
</div>
<div id="collapseBooking" class="collapse" aria-labelledby="headingBooking" data-parent="#accordionDetail">
<div class="card-body">
<h2>1. Pilih Villa yang Anda Inginkan</h2>
<p>Pilih villa yang sesuai dengan kebutuhan Anda. Kami menyediakan berbagai pilihan villa yang dapat Anda lihat di website atau melalui katalog WhatsApp.</p>
<h2>2. Cek Ketersediaan Tanggal</h2>
<p>Setelah memilih villa, periksa ketersediaan tanggal dengan cara:</p>
<ul>
<li>Mengklik tombol <strong>“Detail”</strong> pada halaman villa.</li>
<li>Atau menghubungi kami langsung melalui nomor yang tersedia di halaman <strong>Kontak</strong>.</li>
</ul>
<h2>3. Pembayaran Uang Muka (DP)</h2>
<ul>
<li><strong>30%</strong> untuk weekend dan weekday biasa.</li>
</ul>
<p>Setelah pembayaran DP kirimkan Bukti pembayaran via WhatsApp atau email.</p>
<h2>4. Pelunasan</h2>
<p>Pelunasan penuh wajib dilakukan saat <strong>check-in</strong> di villa.</p>
<h2>5. Check-In dan Penyerahan Kunci</h2>
<p>Pada hari kedatangan, tim kami akan menjemput Anda sesuai lokasi yang disepakati, lalu menyerahkan kunci villa.</p>
</div>
</div>
</div>
<!-- Cara Booking -->
<div class="card">
<div class="card-header" id="headingnow">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapsenow" aria-expanded="false" aria-controls="collapsenow">
<i class="fas fa-star"></i> Form Pemesanan
</button>
</h5>
</div>
<div id="collapsenow" class="collapse" aria-labelledby="headingnow" data-parent="#accordionDetail">
<div class="card-body">
<!-- Form Pemesanan -->
<div class="form-section">
<h3 class="form-header">Data Pemesan</h3>
<form action="proses_p.php" method="POST" onsubmit="return confirmBooking()">
<input type="hidden" class="form-control" id="id_villa" name="id_villa" value="<?php echo $id_villa; ?>">
<div class="form-group">
<label for="fullName">Nama Lengkap</label>
<input type="text" class="form-control" id="fullName" name="fullName" required placeholder="Masukkan nama lengkap Anda">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" class="form-control" id="email" name="email" required placeholder="Masukkan email Anda">
</div>
<div class="form-group">
<label for="phoneNumber">Nomor Telepon</label>
<input type="tel" class="form-control" id="phoneNumber" name="phoneNumber" required placeholder="Masukkan nomor telepon Anda">
</div>
<!-- Check-in -->
<div class="form-group">
<label for="checkinDate">Tanggal Check-In</label>
<input type="text" class="form-control" id="checkinDate" name="checkinDate" placeholder="yyyy-mm-dd" required autocomplete="off">
</div>
<!-- Check-out -->
<div class="form-group">
<label for="checkoutDate">Tanggal Check-Out</label>
<input type="text" class="form-control" id="checkoutDate" name="checkoutDate" placeholder="yyyy-mm-dd" required autocomplete="off">
</div>
<div class="form-group">
<label for="paymentMethod">Metode Pembayaran</label>
<select class="form-control" id="paymentMethod" name="paymentMethod" required>
<option value="transfer">Transfer Bank</option>
<!--<option value="cash">Tunai</option>-->
</select>
</div>
<button type="submit" class="btn btn-primary btn-block">Kirim Pemesanan</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- features list section -->
<!-- <div class="list-section pt-80 pb-80">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<div class="section-title">
<h3>Segera Hubungi kami<br><br>Untuk Mendapatkan Perjalanan Terbaik Anda ?</h3>
<a href="cart.html" class="cart-btn"><img src="images/waicon.png" alt="" height="40 px" width="50 px">Pesan Sekarang</a>
</div>
</div>
</div>
</div>
</div> -->
<!-- end features list section -->
</div>
<!-- footer -->
<div class="footer-area">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="footer-box about-widget">
<h2 class="widget-title">About us</h2>
<p>Mountana Villa berada di Desa Sembungan yang terletak di Dataran Tinggi Dieng, Wonosobo, Jawa Tengah. Desa ini berada di ketinggian sekitar 2.300 meter di atas permukaan laut (mdpl).</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="footer-box get-in-touch">
<h2 class="widget-title">Get in Touch</h2>
<ul>
<li>Jalan sikunir Dieng kejajar Wonosobo Jawa Tengah</li>
<li>marketing@mountanavilla.com</li>
<li>0822 - 2077 - 8332</li>
<li>
<a href="https://instagram.com/mountana_sikunir_hill" target="_blank" style="text-decoration:none; color: #C13584;">
<i class="fab fa-instagram"></i> @mountana_sikunir_hill
</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="footer-box pages">
<h2 class="widget-title">Pages</h2>
<ul>
<li><a href="Home">Home</a></li>
<li><a href="About">About</a></li>
<li><a href="Service">Service</a></li>
<li><a href="Galleri">Galleri</a></li>
<li><a href="Contact">Contact</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- end footer -->
<!-- jquery -->
<script src="assets/js/jquery-1.11.3.min.js"></script>
<!-- bootstrap -->
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<!-- count down -->
<script src="assets/js/jquery.countdown.js"></script>
<!-- isotope -->
<script src="assets/js/jquery.isotope-3.0.6.min.js"></script>
<!-- waypoints -->
<script src="assets/js/waypoints.js"></script>
<!-- owl carousel -->
<script src="assets/js/owl.carousel.min.js"></script>
<!-- magnific popup -->
<script src="assets/js/jquery.magnific-popup.min.js"></script>
<!-- mean menu -->
<script src="assets/js/jquery.meanmenu.min.js"></script>
<!-- sticker js -->
<script src="assets/js/sticker.js"></script>
<!-- main js -->
<script src="assets/js/main.js"></script>
<!-- Bootstrap Datepicker JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
<script>
const bookedDates = <?php echo json_encode($bookedDates); ?>;
$(document).ready(function () {
const today = new Date();
// Nonaktifkan checkout di awal
$('#checkoutDate').prop('disabled', true);
// Inisialisasi check-in datepicker
$('#checkinDate').datepicker({
format: 'yyyy-mm-dd',
startDate: today,
autoclose: true,
todayHighlight: true,
datesDisabled: bookedDates // ini diasumsikan berupa array JS: ['2025-06-01', '2025-06-02']
}).on('changeDate', function (e) {
const selectedDate = e.date;
const minCheckout = new Date(selectedDate);
minCheckout.setDate(minCheckout.getDate() + 1);
// Aktifkan field checkout dan atur ulang datepicker-nya
$('#checkoutDate').prop('disabled', false).datepicker('destroy').datepicker({
format: 'yyyy-mm-dd',
startDate: minCheckout,
autoclose: true,
todayHighlight: true,
datesDisabled: bookedDates
});
});
});
function confirmBooking() {
return confirm("Apakah data pemesanan sudah benar?");
}
</script>
</body>
</html> |