impl. Notifications
This commit is contained in:
parent
189c88f174
commit
18232fd0cb
|
|
@ -35,6 +35,11 @@ public class RequestController {
|
|||
return "/login";
|
||||
}
|
||||
|
||||
@PostMapping("/login")
|
||||
public String loginPost() {
|
||||
return "redirect:/";
|
||||
}
|
||||
|
||||
@GetMapping("/register")
|
||||
public String register() {
|
||||
return "/register";
|
||||
|
|
@ -50,11 +55,30 @@ public class RequestController {
|
|||
return "/shop/search";
|
||||
}
|
||||
|
||||
@GetMapping("/shop/checkout")
|
||||
public String shopCheckout() {
|
||||
return "/shop/checkout";
|
||||
}
|
||||
|
||||
@PostMapping("/shop/checkoutFinish")
|
||||
public String shopCheckoutFinish() {
|
||||
return "/shop/checkoutFinish";
|
||||
}
|
||||
@GetMapping("/shop/checkoutFinish")
|
||||
public String shopCheckoutFinishGET() {
|
||||
return "/shop/checkoutFinish";
|
||||
}
|
||||
|
||||
@GetMapping("/shop/articles/{id}")
|
||||
public String shopArticlesById() {
|
||||
return "/shop/articles/id";
|
||||
}
|
||||
|
||||
@PostMapping("/shop/articles/{id}")
|
||||
public String shopArticlesByIdBuy() {
|
||||
return "redirect:/shop/checkout";
|
||||
}
|
||||
|
||||
@GetMapping("/user/")
|
||||
public String user() {
|
||||
return "/user/index";
|
||||
|
|
@ -68,12 +92,7 @@ public class RequestController {
|
|||
|
||||
@GetMapping("/user/orders/")
|
||||
public String userOrdeers() {
|
||||
return "/user/orders/";
|
||||
}
|
||||
|
||||
@GetMapping("/user/orders/{id}")
|
||||
public String userOrdersId() {
|
||||
return "/user/orders/id";
|
||||
return "/user/orders/index";
|
||||
}
|
||||
|
||||
@GetMapping("/user/bonuspoints")
|
||||
|
|
@ -83,12 +102,7 @@ public class RequestController {
|
|||
|
||||
@GetMapping("/user/notifications/")
|
||||
public String userNotifications() {
|
||||
return "/user/notifications/";
|
||||
}
|
||||
|
||||
@GetMapping("/user/notifications/{id}")
|
||||
public String userNotificationsId() {
|
||||
return "/user/notifications/id";
|
||||
return "/user/notifications/index";
|
||||
}
|
||||
|
||||
@GetMapping("/about")
|
||||
|
|
|
|||
|
|
@ -252,6 +252,28 @@ table tr:nth-child(2n+1) {
|
|||
background-color: var(--c-base-highlight);
|
||||
}
|
||||
|
||||
table.key-value {
|
||||
width: inherit;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
table.key-value th {
|
||||
text-align: right;
|
||||
font-family: "Fira Mono";
|
||||
text-transform: uppercase;
|
||||
background-color: var(--c-base);
|
||||
color: var(--c-black);
|
||||
}
|
||||
|
||||
table.key-value tr {
|
||||
background-color: var(--c-base);
|
||||
}
|
||||
|
||||
table.key-value td {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
|
||||
img.xs {
|
||||
width: var(--u2);
|
||||
|
|
@ -462,6 +484,22 @@ fieldset label {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.flowflex {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: stretch;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.flowflex > * {
|
||||
padding: var(--u0);
|
||||
flex: 1;
|
||||
}
|
||||
.flowflex > *.spacer {
|
||||
padding-top: 0px;
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
|
||||
|
||||
.detailflex {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
|
@ -776,6 +814,28 @@ fieldset label {
|
|||
* CONTENT
|
||||
*/
|
||||
|
||||
.notification {
|
||||
|
||||
}
|
||||
|
||||
.notification:hover {
|
||||
background-color: var(--c-base-highlight);
|
||||
}
|
||||
|
||||
.notification.unread {
|
||||
background-color: var(--c-primary);
|
||||
}
|
||||
|
||||
.notification.unread > * {
|
||||
--c-primary: var(--root-c-primary-highlight);
|
||||
--c-primary-highlight: var(--root-c-primary);
|
||||
}
|
||||
|
||||
|
||||
.notification.unread:hover {
|
||||
background-color: var(--c-primary);
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: var(--u0);
|
||||
background-color: var(--c-primary);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,91 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=0.75, user-scalable=no">
|
||||
|
||||
<title>Meine Benachrichtigungen</title>
|
||||
<link rel="stylesheet" th:href="@{/css/ecom.css}" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav th:replace="/fragments/header :: header">Header</nav>
|
||||
|
||||
<div class="sidebar-layout content-width">
|
||||
<nav></nav>
|
||||
<div>
|
||||
<h1>Meine Benachrichtigungen</h1>
|
||||
</div>
|
||||
</div>
|
||||
<main class="sidebar-layout content-width">
|
||||
<nav th:replace="/fragments/customer :: sidebar"></nav>
|
||||
<div>
|
||||
<div class="grid xl">
|
||||
<section class="notification unread">
|
||||
<h2>Nachricht vom 17.08.2020, 14:38 Uhr</h2>
|
||||
<h3>Ihre Bestellung kommt voraussichtlich am Donnerstag, den 20.08.2020</h3>
|
||||
<p>
|
||||
Vielen Dank für Ihre Bestellung der folgenden Artikel:<br>
|
||||
<br>
|
||||
2x tolle Kamera<br>
|
||||
1x Bluetooth Kopfhörer<br>
|
||||
3x USB-Magic Light<br>
|
||||
<br>
|
||||
Die Sendung wird Ihnen voraussichtlich am Donnerstag, den 20.08.2020 zugestellt.
|
||||
Den aktuellen Status des Pakets können Sie jederzeit in der <a th:href="@{/shop/orders/}">Bestellübersicht</a> nachvollziehen.
|
||||
</p>
|
||||
<button type="button" name="button">Als gelesen makieren</button>
|
||||
</section>
|
||||
<section class="notification">
|
||||
<h2>Nachricht vom 15.08.2020, 16:38 Uhr</h2>
|
||||
<h3>Jetzt unsere Tagesangebote entdecken.</h3>
|
||||
<p>
|
||||
Entdecken sie jetzt unseren neusten Angebote:
|
||||
</p>
|
||||
<div class="flowflex">
|
||||
<div>
|
||||
<a th:href="@{/shop/articles/1234}" class="section">
|
||||
<h3>Lorem Ipsum</h3>
|
||||
<img th:src="@{/img/product-2.jpg}" class="s" />
|
||||
<p>Nur 15,00 €</p>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<a th:href="@{/shop/articles/1234}" class="section">
|
||||
<h3>Stativ</h3>
|
||||
<img th:src="@{/img/product-4.jpg}" class="s" />
|
||||
<p>Nur 7,00 €</p>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<a th:href="@{/shop/articles/1234}" class="section">
|
||||
<h3>Ersatzfernbedinung</h3>
|
||||
<img th:src="@{/img/product-6.jpg}" class="s" />
|
||||
<p>Nur 17,00 €</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="notification">
|
||||
<h2>Nachricht vom 13.08.2020, 14:38 Uhr</h2>
|
||||
<h3>Ihre Bestellung ist angekommen.</h3>
|
||||
<p>
|
||||
Vielen Dank für Ihre Bestellung der folgenden Artikel:<br>
|
||||
<br>
|
||||
3x USB-Magic Light<br>
|
||||
<br>
|
||||
Ihre Bestellungen ist angekommen.
|
||||
</p>
|
||||
</section>
|
||||
<section class="spacer"></section>
|
||||
<section class="spacer"></section>
|
||||
<section class="spacer"></section>
|
||||
</div>
|
||||
</main>
|
||||
<footer th:replace="/fragments/footer :: footer"></footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,175 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=0.75, user-scalable=no">
|
||||
|
||||
<title>Meine Bestellungen</title>
|
||||
<link rel="stylesheet" th:href="@{/css/ecom.css}" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav th:replace="/fragments/header :: header">Header</nav>
|
||||
|
||||
<div class="sidebar-layout content-width">
|
||||
<nav></nav>
|
||||
<div>
|
||||
<h1>Meine Bestellungen</h1>
|
||||
</div>
|
||||
</div>
|
||||
<main class="sidebar-layout content-width">
|
||||
<nav th:replace="/fragments/customer :: sidebar"></nav>
|
||||
<div class="content-width detailflex">
|
||||
<div>
|
||||
<h2 id="20202701"> Bestellung vom 27.01.2020 </h2>
|
||||
<div>
|
||||
<table class="key-value">
|
||||
<tr>
|
||||
<th>Lieferstatus</th>
|
||||
<td><b>Unterwegs</b> <br /> Vorraussichtliche Ankunft: 29.01.2020</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Sendeverfolgungsnummer</th>
|
||||
<td>XE51451436DE</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Eingelösste Bonuspunkte</th>
|
||||
<td>10</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Bild</th>
|
||||
<th>Name</th>
|
||||
<th>Menge</th>
|
||||
<th>Preis (Brutto)</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a th:href="@{/shop/articles/4151}"><img th:src="@{/img/product-1.jpg}" class="s" /><a></td>
|
||||
<td><a th:href="@{/shop/articles/4151}">Kamera<a /></td>
|
||||
<td> 1 </td>
|
||||
<td>100,50 €</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a th:href="@{/shop/articles/4151}"><img th:src="@{/img/product-2.jpg}" class="s" /><a /></td>
|
||||
<td><a th:href="@{/shop/articles/4151}">Earbuds<a /></td>
|
||||
<td> 3 </td>
|
||||
<td>63,95 €</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th>Position</th>
|
||||
<th>Preis</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>Artikel (Netto)</td>
|
||||
<td> 120,00 € </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>Bonuspunkte</td>
|
||||
<td> 5,00 € </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>Umsatzsteuer (19%)</td>
|
||||
<td> 42,00 € </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>
|
||||
<h3>Gesammtpreis</h3>
|
||||
</td>
|
||||
<td>
|
||||
<h3>240,79 €</h3>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div>
|
||||
<h2 id="20200101"> Bestellung vom 01.01.2020 </h2>
|
||||
<div>
|
||||
<table class="key-value">
|
||||
<tr>
|
||||
<th>Lieferstatus</th>
|
||||
<td><b>Angekommen</b> <br /> 03.01.2020</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Sendeverfolgungsnummer</th>
|
||||
<td>XE5140684351DE</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Gutgeschriebene Bonuspunkte</th>
|
||||
<td>5</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Bild</th>
|
||||
<th>Name</th>
|
||||
<th>Menge</th>
|
||||
<th>Preis pro Artikel (Brutto)</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a th:href="@{/shop/articles/4151}"><img th:src="@{/img/product-1.jpg}" class="s" /><a></td>
|
||||
<td><a th:href="@{/shop/articles/4151}"> Billige Kamera<a /></td>
|
||||
<td> 1 </td>
|
||||
<td>40,50 €</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a th:href="@{/shop/articles/4151}"><img th:src="@{/img/product-5.jpg}" class="s" /><a></td>
|
||||
<td><a th:href="@{/shop/articles/4151}">Apfel<a /></td>
|
||||
<td> 5 </td>
|
||||
<td>1,00 €</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th>Position</th>
|
||||
<th>Preis</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>Artikel (Netto)</td>
|
||||
<td> 20,00 € </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>Umsatzsteuer (19%)</td>
|
||||
<td> 5,00 € </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>Umsatzsteuer (7%)</td>
|
||||
<td> 2,00 € </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>
|
||||
<h3>Gesammtpreis</h3>
|
||||
</td>
|
||||
<td>
|
||||
<h3>50,79 €</h3>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer th:replace="/fragments/footer :: footer"></footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue