186 lines
5.0 KiB
Groovy
186 lines
5.0 KiB
Groovy
<!DOCTYPE html>
|
|
<html lang="pl">
|
|
<head>
|
|
<title>Stołówka ZPM Płatności Online</title>
|
|
<h5><p style="text-align: right;">Zalogowano jako {{.UserView}} <button class="button button4"><a href="wylogowano" target="self">WYLOGUJ</a></button></p></h5>
|
|
<link rel="shortcut icon" href="http://www.bronowicka.zs4.lublin.eu/wp-content/uploads/cutlery-297617_1280.png" />
|
|
<center><img src="http://www.bronowicka.zs4.lublin.eu/wp-content/uploads/cutlery-297617_1280.png" width="150" height="100"/></center>
|
|
<style>
|
|
body {
|
|
font-family: Arial;
|
|
font-size: 17px;
|
|
padding: 8px;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.row {
|
|
display: -ms-flexbox; /* IE10 */
|
|
display: flex;
|
|
-ms-flex-wrap: wrap; /* IE10 */
|
|
flex-wrap: wrap;
|
|
margin: 0 -16px;
|
|
}
|
|
|
|
.col-25 {
|
|
-ms-flex: 25%; /* IE10 */
|
|
flex: 25%;
|
|
}
|
|
|
|
.col-50 {
|
|
-ms-flex: 50%; /* IE10 */
|
|
flex: 50%;
|
|
}
|
|
|
|
.col-75 {
|
|
-ms-flex: 75%; /* IE10 */
|
|
flex: 75%;
|
|
}
|
|
|
|
.col-25,
|
|
.col-50,
|
|
.col-75 {
|
|
padding: 0 16px;
|
|
}
|
|
|
|
.container {
|
|
background-color: #f2f2f2;
|
|
padding: 5px 20px 15px 20px;
|
|
border: 1px solid lightgrey;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
input[type=text] {
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
padding: 12px;
|
|
border: 1px solid #ccc;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
label {
|
|
margin-bottom: 10px;
|
|
display: block;
|
|
}
|
|
|
|
.icon-container {
|
|
margin-bottom: 20px;
|
|
padding: 7px 0;
|
|
font-size: 24px;
|
|
}
|
|
|
|
.btn {
|
|
background-color: #4CAF50;
|
|
color: white;
|
|
padding: 12px;
|
|
margin: 10px 0;
|
|
border: none;
|
|
width: 100%;
|
|
border-radius: 3px;
|
|
cursor: pointer;
|
|
font-size: 17px;
|
|
}
|
|
|
|
.btn:hover {
|
|
background-color: #45a049;
|
|
}
|
|
|
|
a {
|
|
color: #2196F3;
|
|
}
|
|
|
|
hr {
|
|
border: 1px solid lightgrey;
|
|
}
|
|
|
|
span.price {
|
|
float: right;
|
|
color: grey;
|
|
}
|
|
|
|
@media (max-width: 800px) {
|
|
.row {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.col-25 {
|
|
margin-bottom: 20px;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1><center>Formularz do płatności online</center></h1>
|
|
<h4><b><p style="text-indent: 2%;"><a href="http://localhost:9197/platnosci">Anuluj</a></p></b></h4>
|
|
<div class="row">
|
|
<div class="col-75">
|
|
<div class="container">
|
|
<form action="/placeOnline" method="POST">
|
|
<div class="row">
|
|
<div class="col-50">
|
|
<h3>Adres rozliczeniowy</h3>
|
|
<label for="fname"><i class="fa fa-user"></i> Imie</label>
|
|
<input type="text" id="fname" name="firstname" placeholder="Krystian Kłopocki">
|
|
<label for="email"><i class="fa fa-envelope"></i> E-mail</label>
|
|
<input type="text" id="email" name="email" placeholder="kryklo@st.amu.edu.pl">
|
|
<label for="adr"><i class="fa fa-address-card-o"></i> Addres</label>
|
|
<input type="text" id="adr" name="address" placeholder="os. Zielony Zakątek 73/1">
|
|
<label for="city"><i class="fa fa-institution"></i> Miasto</label>
|
|
<input type="text" id="city" name="city" placeholder="Poznań">
|
|
|
|
<div class="row">
|
|
<div class="col-50">
|
|
<label for="state">Poczta (miasto)</label>
|
|
<input type="text" id="state" name="state" placeholder="Poznań">
|
|
</div>
|
|
<div class="col-50">
|
|
<label for="zip">Kod pocztowy</label>
|
|
<input type="text" id="zip" name="zip" placeholder="60-107">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-50">
|
|
<h3>Zapłata</h3>
|
|
<label for="fname">Akceptowane karty</label>
|
|
<div class="icon-container">
|
|
<i class="fa fa-cc-visa" style="color:navy;"></i>
|
|
<i class="fa fa-cc-amex" style="color:blue;"></i>
|
|
<i class="fa fa-cc-mastercard" style="color:red;"></i>
|
|
<i class="fa fa-cc-discover" style="color:orange;"></i>
|
|
</div>
|
|
<label for="cname">Imię na karcie</label>
|
|
<input type="text" id="cname" name="cardname" placeholder="Krystian Kłopocki">
|
|
<label for="ccnum">Numer karty kredytowej</label>
|
|
<input type="text" id="ccnum" name="cardnumber" placeholder="1111-2222-3333-4444">
|
|
<label for="expmonth">Miesiąc ważności</label>
|
|
<input type="text" id="expmonth" name="expmonth" placeholder="Maj">
|
|
<div class="row">
|
|
<div class="col-50">
|
|
<label for="expyear">Rok ważności</label>
|
|
<input type="text" id="expyear" name="expyear" placeholder="2021">
|
|
</div>
|
|
<div class="col-50">
|
|
<label for="cvv">CVV</label>
|
|
<input type="text" id="cvv" name="cvv" placeholder="469">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<label>
|
|
<input type="checkbox" checked="checked" name="sameadr"> Adres do faktury taki sam jak powyżej
|
|
</label>
|
|
<input type="submit" name="place" value="Kontynuuj płacenie" class="btn">
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div class="col-25">
|
|
<div class="container">
|
|
<p>Całkowity koszt <span class="price" style="color:black"><b>{{.Zaplac}} zł</b></span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |