به دوستان من خوش آمدید، من روی پروژه دیگری کار می کردم که این است کوله پشتی. کوله پشتی نوعی خوابگاه است که مسافران می توانند برای مدت کوتاهی در اتاق خود با دیگران بمانند.
در اینجا من یک وب سایت ایجاد کرده ام که کاربر می تواند هاستل ها را جستجو کند و قیمت آنها را بررسی کند و آنها را نیز رزرو کند.
من از سرور XAMPP برای پایگاه داده استفاده می کنم و پروژه خود را روی لوکال هاست اجرا می کنم. بنابراین اگر می خواهید از پروژه استفاده کنید، XAMPP یا WAMPP را دانلود کنید.
https://www.youtube.com/watch?v=69vhqR_0gBU
کد منبع-
1.) dbconnect.php
<?php
$servername = "localhost";
$username = "root";
$password = "";
$database = "the_backpacker";
$conn = mysqli_connect($servername,$username,$password,$database);
if(!$conn)
{
die("connection is not established");
}
?>
2.) header.php
<?php
require("dbconnect.php");
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap demo</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
</head>
<style>
html
{
scroll-behavior: smooth;
}
.centered
{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 100px;
}
</style>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/the_backpacker/welcome.php">The BackPacker</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/the_backpacker/welcome.php">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" aria-current="page" href="#top_destinations">Destinations</a>
</li>
</ul>
</div>
</div>
</nav>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
</body>
</html>
3.) footer.php
<div class="container">
<footer class="py-5">
<div class="row">
<div class="col-6 col-md-2 mb-3">
<h5>Accomodations</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Destination</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Hostels</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Workstations</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Group Bookings</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Sitemap</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Policies</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Guest Policy</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Privacy Policy</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Refund Policy</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Terms & Conditions</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Contact us</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Important Links</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Career</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Volunteer</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Invest & Partener</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Press Mentions</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">About us</a></li>
</ul>
</div>
<div class="col-md-5 offset-md-1 mb-3">
<form>
<h5>Subscribe to our newsletter</h5>
<p>Monthly digest of what's new and exciting from us.</p>
<div class="d-flex flex-column flex-sm-row w-100 gap-2">
<label for="newsletter1" class="visually-hidden">Email address</label>
<input id="newsletter1" type="text" class="form-control" placeholder="Email address">
<button class="btn btn-primary" type="button">Subscribe</button>
</div>
</form>
</div>
</div>
<div class="d-flex flex-column flex-sm-row justify-content-between my-4 border-top">
<p>© <?php echo date("Y")?> The BackPacker, Inc. All rights reserved.</p>
</div>
</footer>
</div>
4.) Welcome.php
<?php
include "header.php";
if(isset($_GET['success']))
{
echo '<div class="alert alert-success alert-dismissible fade show" role="alert">
<strong>Success !</strong> Your booking is successfully!
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>';
}
?>
<div id="carouselExample" class="carousel slide carousel-fade" data-bs-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="stock-images/img1.jpg" class="d-block w-100" alt="img1">
</div>
<?php
$img_array = ["img2.jpg","img3.jpg","img4.jpg","img5.jpg","img6.jpg","img7.jpg"];
for ($i=0; $i < count($img_array); $i++) {
echo '<div class="carousel-item">
<img src="https://dev.to/madhubankhatri/stock-images/".$img_array[$i].'" class="d-block w-100" alt="img1">
</div>';
}
?>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExample" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExample" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
<div class="container my-4 bg-dark py-3">
<table class="table text-light">
<tr>
<form action="/the_backpacker/destination.php" method="get">
<td>
<label class="form-label">Select your Destination</label>
<select class="form-control" name="dest">
<option>Jodhpur</option>
<option>Jaisalmer</option>
<option>Coorg</option>
<option>Bir</option>
<option>Jaipur</option>
<option>Agra</option>
<option>Delhi</option>
<option>Kasol</option>
<option>Goa</option>
</select>
</td>
<td>
<label class="form-label">Check In</label>
<input type="date" name="check_in" id="date1" value="<?php echo date("Y-m-d")?>" min="<?php echo date("Y-m-d")?>" class="form-control" oninput="my_fun()" required/>
</td>
<td>
<label class="form-label">Check Out</label>
<input type="date" name="check_out" id="date2" value="<?php echo date("Y-m-d",strtotime(' +1 day'))?>" min="<?php echo date("Y-m-d")?>" class="form-control" required/>
</td>
<td>
<label class="form-label"></label>
<input type="submit" class="form-control btn btn-outline-primary my-2" value="CHECK NOW"/>
</td>
</form>
</tr>
</table>
</div>
<div class="container row mx-5" id="top_destinations">
<h2>Top Destination</h2>
<hr>
<?php
$card_details = [
'jaisalmer'=>'jaisalmer.jpg', 'jaipur'=>'jaipur.jpg','bir'=>'bir.jpg','jodhpur'=>'jodhpur.jpg','agra'=>'agra.jpg','coorg'=>'coorg.jpg','delhi'=>'delhi.jpg', 'goa'=>'goa.jpg', 'kasol'=>'kasol.jpg'
];
foreach ($card_details as $key => $value) {
echo '<div class="container-flex col-md-4 my-3">
<div class="card" style="width: 25rem;">
<img src="https://dev.to/madhubankhatri/stock-images/".$value.'" class="card-img-top" height="300px" alt="https://dev.to/madhubankhatri/...">
<div class="card-body">
<a href="https://dev.to/the_backpacker/destination.php?dest=".$key."&check_in='.date("Y-m-d").'&check_out=".date("Y-m-d",strtotime(" +1 day')).'" style="text-decoration: none;"><h5 class="card-title">'.strtoupper($key).'</h5></a>
</div>
</div>
</div>';
}
?>
<hr>
</div>
<script>
<?php
echo 'var d1 = document.getElementById("date1");
var d2 = document.getElementById("date2");
console.log(d1.min);
function my_fun()
{
d2.value = d1.value;
d2.min = d1.value;
}';
?>
</script>
<?php
include "footer.php";
?>
5.) destination.php
<?php
include("header.php");
if(!isset($_GET['dest']) and !isset($_GET['check_in']) and !isset($_GET['check_out']))
{
header("location:welcome.php");
}
?>
<?php
$dest = $_GET['dest'];
$sql_query = "SELECT * FROM `hostels` WHERE `hostel_destination`='$dest'";
$result = mysqli_query($conn,$sql_query);
$row = mysqli_fetch_assoc($result);
echo '<div class="container-flex text-center text-capitalize" >
<img src="https://dev.to/madhubankhatri/stock-images/".strtolower($dest).'.jpg" class="img-fluid w-100 opacity-75" alt="'.$dest.'">
<h1 class="centered" style="text-shadow: 2px 2px 2px black;">'.$dest.'</h1>
</div>';
?>
<div class="container-fluid my-5">
<h2>Hostel in <?php echo strtoupper($dest);?></h2>
<div class="card mb-3 w-100">
<div class="row g-0">
<div class="col-md-4">
<div id="carouselExampleIndicators" class="carousel slide">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="stock-images/room1.jpg" class="img-fluid rounded-start">
<!-- <img src="https://dev.to/madhubankhatri/..." class="d-block w-100" alt="https://dev.to/madhubankhatri/..."> -->
</div>
<div class="carousel-item">
<img src="stock-images/room2.jpg" class="img-fluid rounded-start">
<!-- <img src="https://dev.to/madhubankhatri/..." class="d-block w-100" alt="https://dev.to/madhubankhatri/..."> -->
</div>
<div class="carousel-item">
<img src="stock-images/room3.jpg" class="img-fluid rounded-start">
<!-- <img src="https://dev.to/madhubankhatri/..." class="d-block w-100" alt="https://dev.to/madhubankhatri/..."> -->
</div>
</div>
</div>
</div>
<div class="col-md-8 my-3">
<div class="card-body">
<div class="row">
<div class="col-md-7">
<h5 class="card-title text-decoration-underline">Mixed Bed Dormitory</h5>
</div>
<div class="col-md-5">
<h1 class="card-title text-end"><?php echo $row['price'];?>Rs.</h1>
</div>
</div>
<div class="row">
<b>Address</b>
<p class="card-text"><?php echo $row['address'];?></p>
</div>
<div class="row my-3">
<div class="col-md-8">
<b>Amenties</b>
<p class="card-text"><i>Wi-Fi | Cafe | CCTV Camera | Common Area | Indoor games | Parking | Pet friendly |</i></p>
</div>
<div class="col-md-4">
<p class="card-text text-end text-success"><b><?php echo $row['num_rooms']?> beds available</b></p>
</div>
</div>
<div class="row my-3">
<div class="col-md-8">
<b>Important Timings</b><br>
<span class="card-text"> Cafe - <b>9AM to 11PM</b> | Reception - <b>24 Hours</b> | Guest Visit - <b>10AM to 8PM</b> | Common Area - <b>24 Hours</b></span>
</div>
<div class="col-md-4 text-end">
<?php
if($row['num_rooms']==0)
{
echo '<button class="btn btn-primary text-end" data-bs-toggle="modal" data-bs-target="#exampleModal" disabled>Sold Out</button>';
}
else
{
echo '<button class="btn btn-primary text-end" data-bs-toggle="modal" data-bs-target="#exampleModal">Add Bed</button>';
}
?>
</div>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">Booking</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/the_backpacker/add_customer.php?dest=<?php echo $dest?>&check_in=<?php echo $_GET['check_in']?>&check_out=<?php echo $_GET['check_out']?>" method="post">
<div class="modal-body">
<div class="mb-3">
<label for="fname" class="form-label">Full Name</label>
<input type="text" name="customer_name" class="form-control" id="fname" required>
</div>
<div class="mb-3">
<label for="email" class="form-label">Email address</label>
<input type="email" name="email" class="form-control" id="email" required>
</div>
<div class="mb-3">
<label for="contact" class="form-label">Contact Number</label>
<input type="number" name="contact_num" class="form-control" id="contact" required>
</div>
<div class="mb-3">
<div class="row my-1">
<div class="col-md-8 py-3 border border-primary">
Check In
</div>
<div class="col-md-4 py-3 border border-primary">
<input type="date" name="check_in" value="<?php echo $_GET["check_in"]?>" class="form-control"/>
</div>
</div>
<div class="row my-1">
<div class="col-md-8 py-3 border border-primary">
Check Out
</div>
<div class="col-md-4 py-3 border border-primary">
<input type="date" name="check_out" value="<?php echo $_GET["check_out"]?>" class="form-control"/>
</div>
</div>
</div>
<div class="mb-3">
<h5>Add Beds</h5>
<div class="row">
<div class="col-md-9 py-3 border border-primary">
<span onclick="remove_bed()" class="btn btn-primary btn-sm">-</span>
<input type="text" class="text-center" name="bed_count" id="bed_count" value="1" size="1" style="border: none; outline: none" readonly/>
<span onclick="add_bed()" class="btn btn-primary btn-sm">+</span>
</div>
<div class="col-md-3 py-3 text-end border border-primary">
<input type="text" id="amnt_text" class="form-control text-center" name="total_pay" value="<?php echo $row['price']?>Rs." size="1" style="border: none; outline: none" readonly/>
</div>
</div>
<div class="row my-1">
<button type="submit" class="btn btn-outline-primary">Confirm Booking</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
<?php
echo '
var a = document.getElementById("bed_count");
var total_beds=".$row["num_rooms"]."
var amntText = document.getElementById("amnt_text");
function add_bed(){
if(a.value<total_beds)
{
a.value++;
var total_amount = a.value*'.$row["price"].'
amntText.value = total_amount+" Rs.";
}
a.value = a.value;
}
function remove_bed(){
if(a.value>1)
{
a.value--;
var total_amount = a.value*'.$row["price"].'
amntText.value = total_amount+" Rs.";
}
a.value = a.value;
}
';
?>
</script>
<?php
include("footer.php");
?>
6.) add_customer.php
<?php
require("dbconnect.php");
if($_SERVER['REQUEST_METHOD']=='POST')
{
$customer_name = $_POST['customer_name'];
$email = $_POST['email'];
$contact_num = $_POST['contact_num'];
$checkIn = $_POST['check_in'];
$checkOut = $_POST['check_out'];
$dest = $_GET['dest'];
$bedCount = $_POST['bed_count'];
$totalPay = $_POST['total_pay'];
if(!empty($customer_name) and !empty($email) and !empty($contact_num) and !empty($checkIn) and !empty($checkOut) and !empty($dest))
{
$sql_query = "INSERT INTO `customers` (`customer_name`, `email`, `destination`, `check_in`, `check_out`, `contact_num`, `rooms_book`, `total_pay`) VALUES ('$customer_name', '$email', '$dest', '$checkIn', '$checkOut', '$contact_num', '$bedCount', '$totalPay')";
$result = mysqli_query($conn,$sql_query);
$select_query = "SELECT * FROM `hostels` WHERE `hostel_destination`='$dest'";
$select_query_result = mysqli_query($conn, $select_query);
$select_row = mysqli_fetch_assoc($select_query_result);
if($result)
{
$update_room = $select_row['num_rooms'] - $bedCount;
$update_query = "UPDATE `hostels` SET `num_rooms` = '$update_room' WHERE `hostel_id` = '$select_row[hostel_id]'";
$update_result = mysqli_query($conn,$update_query);
header("location:welcome.php?success=true");
}
}
}
?>
این پروژه من است. اگر می خواهید ایده های خود را به اشتراک بگذارید، می توانید.
در زیر نظر بدهید…
