Hotel/hotel/rooms/templates/index.html

107 lines
3.7 KiB
HTML

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="{% static 'style.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'jquery-ui.css' %}">
<meta charset="UTF-8">
<title>Hotel INO Scrum</title>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
function changeBackground(imageUrl) {
if(imageUrl != null) {
document.body.style.background = "url(" + imageUrl + ") no-repeat center center fixed";
document.body.style.backgroundSize = "cover";
localStorage.backgroundImage = imageUrl;
}
}
$( function() {
$( ".datepicker" ).datepicker({ dateFormat: 'dd-mm-yy' }).val();
$( ".dateform" ).submit(function(event){
var begindate = $(this).find('input[name=begindate]').val().split("-");
var enddate = $(this).find('input[name=enddate]').val().split("-");
var todayTime = new Date();
var dd = today.getDate();
var mm = today.getMonth();
var yyyy = today.getFullYear();
var today = new Date(yyyy, mm, dd);
begindate = new Date(begindate[2], begindate[1] - 1, begindate[0]);
enddate = new Date(enddate[2], enddate[1] - 1, enddate[0]);
if (begindate.getTime() < today.getTime()){
alert('Data początkowa jest z przeszłości');
return false;
}
if (enddate.getTime() < today.getTime()){
alert('Data końcowa jest z przeszłości');
return false;
}
if (begindate.getTime() > enddate.getTime()){
alert('Data końcowa jest przed początkową');
return false;
}
});
} );
</script>
</head>
<body onLoad="changeBackground(imageUrl = 'static/images/background5.jpg')">
<h1>Hotel INO Scrum</h1>
<center><h3>Lista pokoi dostępnych w naszym hotelu</h3></center>
<center><h3>{{ error }}</h3></center>
<table id="hotels">
<col style="width:10%">
<col style="width:30%">
<col style="width:15%">
<col style="width:45%">
<th>Numer pokoju</th>
<th>Typ pokoju</th>
<th>Cena</th>
<th>Rezerwacja</th>
{% for room in rooms %}
<tr>
<td>{{ room.room_number }}</td>
<td>{{ room.room_type }}</td>
<td>{{ room.price }} zł</td>
<td>
<form action="{% url 'reservation' %}" class="dateform" method="POST">
{% csrf_token %}
<input type="hidden" name="room" value="{{ room.room_number }}">
<div class="button-box" >
Od: <input type="text" class="datepicker" name="begindate" size="6" required>
Do: <input type="text" class="datepicker" name="enddate" size="6" required>
<button>Rezerwuj</button>
</div>
</form>
</td>
</tr>
{% endfor %}
</table>
<br>
<center>
{% if firstpage == False %}
<a href="{% url 'indexpage' currentpage|add:'-1' %}"><button id="page"><<</button></a>
{% endif %}
{% for p in pages %}
<a href="{% url 'indexpage' p %}"><div id="page">{{ p }}</div></a>
{% endfor %}
{% if lastpage == False %}
<a href="{% url 'indexpage' currentpage|add:'+1' %}"><button id="page">>></button></a>
{% endif %}
</center>
</body>
</html>