112 lines
4.5 KiB
HTML
112 lines
4.5 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();
|
|
var enddate = $(this).find('input[name=enddate]').val();
|
|
var beginpop = $(this).find('[name=beginPopup]');
|
|
var endpop = $(this).find('[name=endPopup]');
|
|
beginpop.addClass('popup')
|
|
var today = $.datepicker.formatDate('dd-mm-yy', new Date());
|
|
|
|
if (begindate.getDate() < today.getDate()){
|
|
alert('Data początkowa jest z przeszłości');
|
|
return false;
|
|
}
|
|
if (enddate.getDate() < today.getDate()){
|
|
alert('Data końcowa jest z przeszłości');
|
|
return false;
|
|
}
|
|
if (begindate.getDate() > enddate.getDate()){
|
|
alert('Data końcowa jest przed początkową');
|
|
return false;
|
|
}
|
|
|
|
});
|
|
|
|
} );
|
|
|
|
</script>
|
|
</head>
|
|
<body onLoad="changeBackground(imageUrl = localStorage.backgroundImage)">
|
|
<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="3" required>
|
|
Do: <input type="text" class="datepicker" name="enddate" size="3" 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 %}
|
|
|
|
<br>
|
|
<table id="images">
|
|
<th><input type="image" src="static/images/background1.jpg" height="150px" width="250px" onClick="changeBackground(imageUrl='static/images/background1.jpg')"/></th>
|
|
<th><input type="image" src="static/images/background2.jpg" height="150px" width="250px" onClick="changeBackground(imageUrl='static/images/background2.jpg')"/></th>
|
|
<th><input type="image" src="static/images/background3.jpg" height="150px" width="250px" onClick="changeBackground(imageUrl='static/images/background3.jpg')"/></th>
|
|
<th><input type="image" src="static/images/background4.jpg" height="150px" width="250px" onClick="changeBackground(imageUrl='static/images/background4.jpg')"/></th>
|
|
<th><input type="image" src="static/images/background5.jpg" height="150px" width="250px" onClick="changeBackground(imageUrl='static/images/background5.jpg')"/></th>
|
|
</table>
|
|
</center>
|
|
</body>
|
|
</html>
|