Implement Listed Articles Overview

This commit is contained in:
CodeSteak 2020-01-12 18:00:40 +01:00
parent f120212d62
commit 255195715f
5 changed files with 207 additions and 0 deletions

View File

@ -43,6 +43,12 @@ public class RequestController {
@GetMapping("/searchresults")
public String searchresults() { return "searchResults";}
@GetMapping("/employee/articles")
public String articles() { return "articles";}
@GetMapping("/employee/listedarticles")
public String listedarticles() { return "listedArticles";}
@GetMapping("/login")
public String login(@CookieValue(value = "loginToken", defaultValue = "") String loginToken, Model model) {
model.addAttribute(new Customer());

View File

@ -0,0 +1,19 @@
img.xs {
width: var(--u2);
}
img.s {
width: var(--u4);
}
.full-width {
width: 100%;
}
span.checked::after {
content: "✔️";
}
span.unchecked::after {
content: "❌";
}

View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<title>e-commerce</title>
<link href="../static/css/ecom.css" rel="stylesheet" th:href="@{/css/ecom.css}" />
</head>
<body>
<nav th:replace="fragments/header :: header">Header</nav>
<main class="sidebar-layout content-width">
<nav th:replace="fragments/employee :: sidebar">Header</nav>
<div class="content-width">
<h1> Artikel</h1>
<p>TODO</p>
</div>
</main>
<footer th:replace="fragments/footer :: footer"></footer>
</body>
</html>

View File

@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>e-commerce</title>
</head>
<body>
<nav th:fragment="sidebar">
<ul>
<li><a>Dashboard</a>
<ul>
<li><a>Artikel</a></li>
<li><a>Umsatzsteuer</a></li>
<li><a class='selected'>Geldbuchungen</a></li>
<li><a>Einstellungen</a></li>
</ul>
</li>
<li><a>Lieferanten</a>
<ul>
<li><a>Warenbuchungen</a></li>
<li><a>Geldbuchungen</a></li>
</ul>
</li>
<li><a>Lager</a>
<ul>
<li><a>Bestandsbuchungen</a></li>
</ul>
</li>
<li><a>Kunden</a>
<ul>
<li><a>Bestellungen</a></li>
<li><a>Geldbuchungen</a></li>
</ul>
</li>
</ul>
</nav>
</body>
</html>

View File

@ -0,0 +1,119 @@
<!DOCTYPE html>
<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<title>e-commerce</title>
<link rel="stylesheet" th:href="@{/css/ecom.css}" />
<link rel="stylesheet" th:href="@{/css/listedArticles.css}" />
<script th:src="@{/js/filterTable.js}"></script>
</head>
<body>
<nav th:replace="fragments/header :: header">Header</nav>
<main class="sidebar-layout content-width">
<nav th:replace="fragments/employee :: sidebar">Header</nav>
<div class="content-width">
<h1> Gelistete Artikel </h1>
<!--
ArticleListing (
article : Article
pricePerUnitNetCent : int
unitsPerWarehouseSlot : int
title : String
description : String
tags : Tag[]
image : Blob
)
Article (
manufacturer : string
articleId : string
vatPercent : int
)
-->
<h2>Artikel Hinzufügen</h2>
<p>
Weitere Artikel können über Artikelübersicht gelistet werden.
<a class="button smaller" th:href="@{/employee/articles}"> Jetzt Hinzufügen </a>
</p>
<p>
<table id="main-table">
<tr>
<th colspan="8">
<input type="text" placeholder="Filtern" class="smaller jsFilterTable full-width" data-target-id="main-table"></input>
</th>
</tr>
<tr>
<th>Bild</th>
<th>Name</th>
<th>Preis</th>
<th>(Netto)</th>
<th>Kategorien</th>
<th>Aktiv</th>
<th>Artikel</th>
<th>Id (bearbeiten)</th>
</tr>
<tr>
<td><img th:src="@{/img/product-1.jpg}" class="s" /></td>
<td>Kamera</td>
<td>100,50 €</td>
<td> (84.45 €) </td>
<td>Úberwachung, Elektronik</td>
<td><span class="checked"></span></td>
<td><a th:href="@{/employee/articles}">A-5051</a></td>
<td><a th:href="@{/employee/listedArticlesDetail}">L-890</a></td>
</tr>
<tr>
<td><img th:src="@{/img/product-2.jpg}" class="s" /></td>
<td>Earbuds</td>
<td>63,95 €</td>
<td>(53,73 €)</td>
<td>Kopfhörer, Elektronik</td>
<td><span class="checked"></span></td>
<td><a th:href="@{/employee/articles}">A-840</a></td>
<td><a th:href="@{/employee/listedArticlesDetail}">L-13850</a></td>
</tr>
<tr>
<td><img th:src="@{/img/product-3.jpg}" class="s" /></td>
<td>USB-Magic Light</td>
<td>11,90 €</td>
<td> (10,00 €) </td>
<td>Sonstiges, Elektronik</td>
<td><span class="unchecked"></span></td>
<td><a th:href="@{/employee/articles}">A-8401</a></td>
<td><a th:href="@{/employee/listedArticlesDetail}">L-5784</a></td>
</tr>
<tr>
<td><img th:src="@{/img/product-4.jpg}" class="s" /></td>
<td>3D Magic Stativ</td>
<td>15,99 €</td>
<td> (13.44 €) </td>
<td>Úberwachung, Elektronik</td>
<td><span class="checked"></span></td>
<td><a th:href="@{/employee/articles}">A-2135</a></td>
<td><a th:href="@{/employee/listedArticlesDetail}">L-4564</a></td>
</tr>
<tr>
<td><img th:src="@{/img/product-5.jpg}" class="s" /></td>
<td>Ersatzfernbedinung</td>
<td>7,95 €</td>
<td> (6.68 €) </td>
<td>Úberwachung, Elektronik</td>
<td><span class="checked"></span></td>
<td><a th:href="@{/employee/articles}">A-4565</a></td>
<td><a th:href="@{/employee/listedArticlesDetail}">L-4566</a></td>
</tr>
</table>
<p>
</div>
</main>
<footer th:replace="fragments/footer :: footer"></footer>
</body>
</html>