From c8cdcf2a8ca3d4f5d50f6ee876e8b22603451e05 Mon Sep 17 00:00:00 2001
From: Philipp Schweizer <Philipp.schw@directbox.com>
Date: Mon, 20 Jan 2020 20:59:35 +0100
Subject: [PATCH] template Files for customers and suppliers created

---
 .../hso/ecommerce/app/RequestController.java  |  25 ++++
 .../src/main/resources/static/css/NoFocus.css |  15 ++
 .../src/main/resources/static/css/ecom.css    |   9 ++
 .../intern/customers_allOrders_overview.html  |  80 +++++++++++
 .../customers_detailview_bookings_orders.html | 106 ++++++++++++++
 .../intern/customers_order_detailview.html    | 101 +++++++++++++
 .../templates/intern/customers_overview.html  | 133 ++++++++++++++++++
 .../intern/suppliers_allOrders_overview.html  |  88 ++++++++++++
 .../suppliers_detailview_bookings_orders.html | 111 +++++++++++++++
 .../intern/suppliers_order_detailview.html    |  91 ++++++++++++
 .../templates/intern/suppliers_overview.html  |  76 ++++++++++
 11 files changed, 835 insertions(+)
 create mode 100644 prototype/src/main/resources/static/css/NoFocus.css
 create mode 100644 prototype/src/main/resources/templates/intern/customers_allOrders_overview.html
 create mode 100644 prototype/src/main/resources/templates/intern/customers_detailview_bookings_orders.html
 create mode 100644 prototype/src/main/resources/templates/intern/customers_order_detailview.html
 create mode 100644 prototype/src/main/resources/templates/intern/customers_overview.html
 create mode 100644 prototype/src/main/resources/templates/intern/suppliers_allOrders_overview.html
 create mode 100644 prototype/src/main/resources/templates/intern/suppliers_detailview_bookings_orders.html
 create mode 100644 prototype/src/main/resources/templates/intern/suppliers_order_detailview.html
 create mode 100644 prototype/src/main/resources/templates/intern/suppliers_overview.html

diff --git a/prototype/src/main/java/org/hso/ecommerce/app/RequestController.java b/prototype/src/main/java/org/hso/ecommerce/app/RequestController.java
index 0fa38c3..590863b 100644
--- a/prototype/src/main/java/org/hso/ecommerce/app/RequestController.java
+++ b/prototype/src/main/java/org/hso/ecommerce/app/RequestController.java
@@ -104,6 +104,31 @@ public class RequestController {
         return "intern/listedArticlesEdit";
     }
 
+    @GetMapping("/intern/customers_allOrders_overview")
+    public String customers_allOrders_overview() {return "intern/customers_allOrders_overview"; }
+
+    @GetMapping("/intern/customers_order_detailview")
+    public String customers_order_detailview() {return "intern/customers_order_detailview"; }
+
+    @GetMapping("/intern/customers_overview")
+    public String customers_overview() {return "intern/customers_overview"; }
+
+    @GetMapping("/intern/customers_detailview_bookings_orders")
+    public String customers_detailview_bookings_orders() {return "intern/customers_detailview_bookings_orders"; }
+
+    @GetMapping("/intern/suppliers_overview")
+    public String suppliers_overview() {return "intern/suppliers_overview"; }
+
+    @GetMapping("/intern/suppliers_detailview_bookings_orders")
+    public String suppliers_detailview_bookings_orders() {return "intern/suppliers_detailview_bookings_orders"; }
+
+    @GetMapping("/intern/suppliers_allOrders_overview")
+    public String suppliers_allOrders_overview() {return "intern/suppliers_allOrders_overview"; }
+
+    @GetMapping("/intern/suppliers_order_detailview")
+    public String suppliers_order_detailview() {return "intern/suppliers_order_detailview"; }
+
+
     @GetMapping("/customer/accountsettings")
     public String customerAccountSettings(Model model) {
         Customer customer = new Customer();
diff --git a/prototype/src/main/resources/static/css/NoFocus.css b/prototype/src/main/resources/static/css/NoFocus.css
new file mode 100644
index 0000000..8f93494
--- /dev/null
+++ b/prototype/src/main/resources/static/css/NoFocus.css
@@ -0,0 +1,15 @@
+.border{
+
+	border:4px solid black;
+	border-radius: 0.7rem;
+}
+
+input.nofocus:focus{
+
+	outline-width: 0;
+}
+
+button.nofocus:focus{
+
+	outline-width: 0;
+}
diff --git a/prototype/src/main/resources/static/css/ecom.css b/prototype/src/main/resources/static/css/ecom.css
index 6189227..d273d7d 100644
--- a/prototype/src/main/resources/static/css/ecom.css
+++ b/prototype/src/main/resources/static/css/ecom.css
@@ -584,6 +584,15 @@ fieldset {
 .leftspace {
     padding-left: 1em;
 }
+.noPadding {
+   padding: 0rem;
+}
+.noMargin {
+   margin: 0rem;
+}
+.Margin-left.s {
+   margin-left: 2rem;
+}
 
 
 
diff --git a/prototype/src/main/resources/templates/intern/customers_allOrders_overview.html b/prototype/src/main/resources/templates/intern/customers_allOrders_overview.html
new file mode 100644
index 0000000..a4b92b0
--- /dev/null
+++ b/prototype/src/main/resources/templates/intern/customers_allOrders_overview.html
@@ -0,0 +1,80 @@
+<!DOCTYPE html>
+<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+   <head>
+      <meta charset="utf-8">
+      <title>Bestell -und Buchungsübersicht</title>
+      <link rel="stylesheet" th:href="@{/css/ecom.css}" />
+      <link rel="stylesheet" th:href="@{/css/NoFocus.css}" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+   </head>
+   <body>
+      <nav class='hero'>
+         <div class='content-width bar-flex'>
+            <h1>Project eCommerce</h1>
+            <button>Angebote</button>
+            <div class='spacer input-icon secondary'>
+               <input type="text" placeholder="Nach Produkten suchen..."/>
+               <button>Finden</button>
+            </div>
+            <button>Login</button>
+         </div>
+      </nav>
+
+      <main>
+         <div class="content-width">
+            <h1>Übersicht aller Bestellungen</h1>
+            <br>
+            <h2>Bestellungen</h2>
+            <div class='spacer input-icon border backgroundprimary'>
+               <input type="text" class="nofocus" placeholder="Bestellungen Filtern"/>
+               <button class="nofocus">Filtern</button>
+            </div>
+            <p>
+               <table>
+                  <tr>
+                     <th>Kundennummer</th>
+                     <th>Bestellnummer</th>
+                     <th>Bestelldatum</th>
+                     <th>Betrag</th>
+                     <th>Bonuspunkte</th>
+                     <th></th>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>10,13 EUR</td>
+                     <td>10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+               </table>
+            </p>
+            <br>
+         </div>
+      </main>
+
+      <footer class="hero-black">
+         <div class='content-width bar-flex'>
+            <h3>Project eCommerce</h3>
+            <div class="spacer"></div>
+            <div>
+               <h4>Seite</h4>
+               <ul>
+                  <li><a>Login</a></li>
+                  <li><a>Angebote</a></li>
+                  <li><a>Suche</a></li>
+                  <li><a>Mitarbeiter Login</a></li>
+               </ul>
+            </div>
+            <div>
+               <h4>Mehr</h4>
+               <ul>
+                  <li><a>Nutzungsbedingungen</a></li>
+                  <li><a>Datenschutz</a></li>
+                  <li><a>Über</a></li>
+               </ul>
+            </div>
+         </div>
+      </footer>
+   </body>
+</html>
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/intern/customers_detailview_bookings_orders.html b/prototype/src/main/resources/templates/intern/customers_detailview_bookings_orders.html
new file mode 100644
index 0000000..6fc8f3e
--- /dev/null
+++ b/prototype/src/main/resources/templates/intern/customers_detailview_bookings_orders.html
@@ -0,0 +1,106 @@
+<!DOCTYPE html>
+<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+   <head>
+      <meta charset="utf-8">
+      <title>Bestell -und Buchungsübersicht</title>
+      <link rel="stylesheet" th:href="@{/css/ecom.css}" />
+      <link rel="stylesheet" th:href="@{/css/NoFocus.css}" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+   </head>
+   <body>
+      <nav class='hero'>
+         <div class='content-width bar-flex'>
+            <h1>Project eCommerce</h1>
+            <button>Angebote</button>
+            <div class='spacer input-icon secondary'>
+               <input type="text" placeholder="Nach Produkten suchen..."/>
+               <button>Finden</button>
+            </div>
+            <button>Login</button>
+         </div>
+      </nav>
+
+      <main>
+         <div class="content-width">
+            <h1>1 (Kundennummer)</h1>
+            <br>
+            <h2>Bestellungen</h2>
+            <div class='spacer input-icon border backgroundprimary'>
+               <input type="text" class="nofocus" placeholder="Bestellungen Filtern"/>
+               <button class="nofocus">Filtern</button>
+            </div>
+            <p>
+               <table>
+                  <tr>
+                     <th>Bestellnummer</th>
+                     <th>Bestelldatum</th>
+                     <th>Betrag</th>
+                     <th>Bonuspunkte</th>
+                     <th></th>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>10,13 EUR</td>
+                     <td>10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+               </table>
+            <br>
+            <h2>Buchungen</h2>
+            <div class='spacer input-icon border'>
+               <input class="nofocus" type="text" placeholder="Buchungen Filtern"/>
+               <button class="nofocus">Filtern</button>
+            </div>
+            <p>
+               <table>
+                  <tr>
+                     <th>Zeitpunkt</th>
+                     <th>Betrag</th>
+                     <th>Von</th>
+                     <th>Kontostand</th>
+                     <th>Nach</th>
+                     <th>Kontostand</th>
+                     <th>Grund</th>
+                     <th>Referenz</th>
+                  </tr>
+                  <tr>
+                     <td>10.09.2019 14:10</td>
+                     <td>119,00 EUR</td>
+                     <td><a href="/intern/accountingmain">Hauptkonto</a></td>
+                     <td>331,00 EUR</td>
+                     <td><a href="/intern/accountingvat">Mehrwertsteuer</a></td>
+                     <td>1510,95 EUR</td>
+                     <td>Kunden-Bestellung</td>
+                     <td><a href="/intern/customerorders">2504</a></td>
+                  </tr>
+               </table>
+            </p>
+         </div>
+      </main>
+
+      <footer class="hero-black">
+         <div class='content-width bar-flex'>
+            <h3>Project eCommerce</h3>
+            <div class="spacer"></div>
+            <div>
+               <h4>Seite</h4>
+               <ul>
+                  <li><a>Login</a></li>
+                  <li><a>Angebote</a></li>
+                  <li><a>Suche</a></li>
+                  <li><a>Mitarbeiter Login</a></li>
+               </ul>
+            </div>
+            <div>
+               <h4>Mehr</h4>
+               <ul>
+                  <li><a>Nutzungsbedingungen</a></li>
+                  <li><a>Datenschutz</a></li>
+                  <li><a>Über</a></li>
+               </ul>
+            </div>
+         </div>
+      </footer>
+   </body>
+</html>
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/intern/customers_order_detailview.html b/prototype/src/main/resources/templates/intern/customers_order_detailview.html
new file mode 100644
index 0000000..9eea06a
--- /dev/null
+++ b/prototype/src/main/resources/templates/intern/customers_order_detailview.html
@@ -0,0 +1,101 @@
+<!DOCTYPE html>
+<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+   <head>
+      <meta charset="utf-8">
+      <title>Bestell -und Buchungsübersicht</title>
+      <link rel="stylesheet" th:href="@{/css/ecom.css}" />
+      <link rel="stylesheet" th:href="@{/css/NoFocus.css}" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+   </head>
+   <body>
+      <nav class='hero'>
+         <div class='content-width bar-flex'>
+            <h1>Project eCommerce</h1>
+            <button>Angebote</button>
+            <div class='spacer input-icon secondary'>
+               <input type="text" placeholder="Nach Produkten suchen..."/>
+               <button>Finden</button>
+            </div>
+            <button>Login</button>
+         </div>
+      </nav>
+
+      <main>
+        <div class="content-width">
+            <h1>Bestelldetails</h1>
+            <div class="grid l">
+               <section class="hero">
+                  <h3>Allgemeineinformationen</h3>
+                  <p>Die Bestellung wurde am 01.01.2020 bestellt</p>
+                  <p>Bestellnummer: 614899499</p>
+                  <p>Letzte Ziffern der Karte: 578</p>
+               </section>
+               <section class="hero">
+                  <h3>Versandinformationen</h3>
+                  <p>Name<br>Straße<br>Ort, plz<br>Deutschland</p>
+               </section>
+               <section class="hero">
+                  <h3>Preiszusammensetzung</h3>
+                  <div class="grid s">
+                     <section class="noMargin noPadding">
+                        <p>Startwert<br>Versand<br>Bonuspunkte</p>
+                        <p>Gesamtsumme</p>
+                     </section>
+                     <section class="noMargin noPadding">
+                        <p>6,00 EUR<br>3,00 EUR<br>-1,00 EUR</p>
+                        <p>9,52‬ EUR</p>
+                     </section>
+                  </div>
+               </section>
+            </div>
+           <div class="vertical-spacer s"></div>
+           <h1>Bestellte Artikel</h1>
+           <div class='grid m shadow'>
+
+              <section class="hero">
+                 <h2>Lorem Ipsum</h2>
+                 <img src="../img/product-1.jpg">
+                 <h3>Menge: 1</h3>
+                 <p class='price'> 25.14 €</p>
+                 <p>
+                    Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte.
+                 </p>
+              </section>
+
+              <section class="hero">
+                 <h2>Lorem Ipsum</h2>
+                 <img src="../img/product-1.jpg">
+                 <h3>Menge: 4</h3>
+                 <p class='price'> 25.14 €</p>
+                 <p>
+                    Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte.
+                 </p>
+              </section>
+           </div>
+        </div>
+      </main>
+      <footer class="hero-black">
+         <div class='content-width bar-flex'>
+            <h3>Project eCommerce</h3>
+            <div class="spacer"></div>
+            <div>
+               <h4>Seite</h4>
+               <ul>
+                  <li><a>Login</a></li>
+                  <li><a>Angebote</a></li>
+                  <li><a>Suche</a></li>
+                  <li><a>Mitarbeiter Login</a></li>
+               </ul>
+            </div>
+            <div>
+               <h4>Mehr</h4>
+               <ul>
+                  <li><a>Nutzungsbedingungen</a></li>
+                  <li><a>Datenschutz</a></li>
+                  <li><a>Über</a></li>
+               </ul>
+            </div>
+         </div>
+      </footer>
+   </body>
+</html>
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/intern/customers_overview.html b/prototype/src/main/resources/templates/intern/customers_overview.html
new file mode 100644
index 0000000..28ff1f4
--- /dev/null
+++ b/prototype/src/main/resources/templates/intern/customers_overview.html
@@ -0,0 +1,133 @@
+<!DOCTYPE html>
+<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+   <head>
+      <meta charset="utf-8">
+      <title>Kundenübersicht</title>
+      <link rel="stylesheet" th:href="@{/css/ecom.css}" />
+      <link rel="stylesheet" th:href="@{/css/NoFocus.css}" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+   </head>
+   <body>
+      <nav class='hero'>
+         <div class='content-width bar-flex'>
+            <h1>Project eCommerce</h1>
+            <button>Angebote</button>
+            <div class='spacer input-icon secondary'>
+               <input type="text" placeholder="Nach Produkten suchen..."/>
+               <button>Finden</button>
+            </div>
+            <button>Login</button>
+         </div>
+      </nav>
+
+      <main>
+         <div class="content-width">
+            <h1>Kunden</h1>
+            <div class='spacer input-icon border backgroundprimary'>
+               <input type="text" class="nofocus" placeholder="Kunden Filtern"/>
+               <button class="nofocus">Filtern</button>
+            </div>
+            <p>
+               <table>
+                  <tr>
+                     <th>Kundennummer</th>
+                     <th>Beitrittsdatum</th>
+                     <th>Geschäftskunde</th>
+                     <th>Kartennummer</th>
+                     <th>Adresse</th>
+                     <th></th>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>Ja</td>
+                     <td>51988516981</td>
+                     <td>HTMLgasse 10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>Ja</td>
+                     <td>51988516981</td>
+                     <td>HTMLgasse 10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>Ja</td>
+                     <td>51988516981</td>
+                     <td>HTMLgasse 10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>Ja</td>
+                     <td>51988516981</td>
+                     <td>HTMLgasse 10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>Ja</td>
+                     <td>51988516981</td>
+                     <td>HTMLgasse 10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>Ja</td>
+                     <td>51988516981</td>
+                     <td>HTMLgasse 10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>Ja</td>
+                     <td>51988516981</td>
+                     <td>HTMLgasse 10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+                  <tr>
+                     <td>1</td>
+                     <td>2019-11-10</td>
+                     <td>nein</td>
+                     <td>51988516981</td>
+                     <td>HTMLgasse 10</td>
+                     <td><button class="smaller">Details</button></td>
+                  </tr>
+               </table>
+            </p>
+         </div>
+      </main>
+
+      <footer class="hero-black">
+         <div class='content-width bar-flex'>
+            <h3>Project eCommerce</h3>
+            <div class="spacer"></div>
+            <div>
+               <h4>Seite</h4>
+               <ul>
+                  <li><a>Login</a></li>
+                  <li><a>Angebote</a></li>
+                  <li><a>Suche</a></li>
+                  <li><a>Mitarbeiter Login</a></li>
+               </ul>
+            </div>
+            <div>
+               <h4>Mehr</h4>
+               <ul>
+                  <li><a>Nutzungsbedingungen</a></li>
+                  <li><a>Datenschutz</a></li>
+                  <li><a>Über</a></li>
+               </ul>
+            </div>
+         </div>
+      </footer>
+   </body>
+</html>
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/intern/suppliers_allOrders_overview.html b/prototype/src/main/resources/templates/intern/suppliers_allOrders_overview.html
new file mode 100644
index 0000000..37d6fae
--- /dev/null
+++ b/prototype/src/main/resources/templates/intern/suppliers_allOrders_overview.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+<head>
+    <meta charset="utf-8">
+    <title>Bestell -und Buchungsübersicht</title>
+    <link rel="stylesheet" th:href="@{/css/ecom.css}" />
+    <link rel="stylesheet" th:href="@{/css/NoFocus.css}" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+</head>
+<body>
+<nav class='hero'>
+    <div class='content-width bar-flex'>
+        <h1>Project eCommerce</h1>
+        <button>Angebote</button>
+        <div class='spacer input-icon secondary'>
+            <input type="text" placeholder="Nach Produkten suchen..."/>
+            <button>Finden</button>
+        </div>
+        <button>Login</button>
+    </div>
+</nav>
+
+<main>
+    <div class="content-width">
+        <h1>Übersicht aller Bestellungen</h1>
+        <br>
+        <h2>Bestellungen</h2>
+        <div class='spacer input-icon border backgroundprimary'>
+            <input type="text" class="nofocus" placeholder="Bestellungen Filtern"/>
+            <button class="nofocus">Filtern</button>
+        </div>
+        <p>
+        <table>
+            <tr>
+                <th>Bestellnummer</th>
+                <th>Bestelldatum</th>
+                <th>Artikel</th>
+                <th>Menge</th>
+                <th>Gesamtpreis</th>
+                <th></th>
+            </tr>
+            <tr>
+                <td>1</td>
+                <td>2019-11-10</td>
+                <td>Grafikkarte</td>
+                <td>600,00 EUR</td>
+                <td><button class="smaller">Details</button></td>
+                <td><button class="smaller">Angekommen</button></td>
+            </tr>
+            <tr>
+                <td>1</td>
+                <td>2019-11-10</td>
+                <td>Grafikkarte</td>
+                <td>600,00 EUR</td>
+                <td><button class="smaller">Details</button></td>
+                <td>Angekommen</td>
+            </tr>
+        </table>
+        </p>
+        <br>
+    </div>
+</main>
+
+<footer class="hero-black">
+    <div class='content-width bar-flex'>
+        <h3>Project eCommerce</h3>
+        <div class="spacer"></div>
+        <div>
+            <h4>Seite</h4>
+            <ul>
+                <li><a>Login</a></li>
+                <li><a>Angebote</a></li>
+                <li><a>Suche</a></li>
+                <li><a>Mitarbeiter Login</a></li>
+            </ul>
+        </div>
+        <div>
+            <h4>Mehr</h4>
+            <ul>
+                <li><a>Nutzungsbedingungen</a></li>
+                <li><a>Datenschutz</a></li>
+                <li><a>Über</a></li>
+            </ul>
+        </div>
+    </div>
+</footer>
+</body>
+</html>
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/intern/suppliers_detailview_bookings_orders.html b/prototype/src/main/resources/templates/intern/suppliers_detailview_bookings_orders.html
new file mode 100644
index 0000000..1d5e6a7
--- /dev/null
+++ b/prototype/src/main/resources/templates/intern/suppliers_detailview_bookings_orders.html
@@ -0,0 +1,111 @@
+    <!DOCTYPE html>
+    <html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+    <head>
+        <meta charset="utf-8">
+        <title>Bestell -und Buchungsübersicht</title>
+        <link rel="stylesheet" th:href="@{/css/ecom.css}" />
+        <link rel="stylesheet" th:href="@{/css/NoFocus.css}" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+    </head>
+    <body>
+    <nav class='hero'>
+        <div class='content-width bar-flex'>
+            <h1>Project eCommerce</h1>
+            <button>Angebote</button>
+            <div class='spacer input-icon secondary'>
+                <input type="text" placeholder="Nach Produkten suchen..."/>
+                <button>Finden</button>
+            </div>
+            <button>Login</button>
+        </div>
+    </nav>
+
+    <main>
+        <div class="content-width">
+            <h1>1 (Lieferranten)</h1>
+            <br>
+            <h2>Bestellungen</h2>
+            <div class='spacer input-icon border backgroundprimary'>
+                <input type="text" class="nofocus" placeholder="Bestellungen Filtern"/>
+                <button class="nofocus">Filtern</button>
+            </div>
+            <p>
+            <table>
+                <tr>
+                    <th>Bestellnummer</th>
+                    <th>Bestelldatum</th>
+                    <th>Artikel</th>
+                    <th>Menge</th>
+                    <th>Gesamtpreis</th>
+                    <th></th>
+                    <th></th>
+                </tr>
+                <tr>
+                    <td>1</td>
+                    <td>2019-11-10</td>
+                    <td>Grafikkarte</td>
+                    <td>2</td>
+                    <td>600,00 EUR</td>
+                    <td><button class="smaller">Angekommen</button></td>
+                    <td><button class="smaller">Details</button></td>
+                </tr>
+            </table>
+
+            <br>
+            <h2>Buchungen</h2>
+            <div class='spacer input-icon border'>
+                <input class="nofocus" type="text" placeholder="Buchungen Filtern"/>
+                <button class="nofocus">Filtern</button>
+            </div>
+            <p>
+            <table>
+                <tr>
+                    <th>Zeitpunkt</th>
+                    <th>Betrag</th>
+                    <th>Von</th>
+                    <th>Kontostand</th>
+                    <th>Nach</th>
+                    <th>Kontostand</th>
+                    <th>Grund</th>
+                    <th>Referenz</th>
+                </tr>
+                <tr>
+                    <td>10.09.2019 14:10</td>
+                    <td>119,00 EUR</td>
+                    <td><a href="/intern/accountingmain">Hauptkonto</a></td>
+                    <td>331,00 EUR</td>
+                    <td><a href="/intern/accountingvat">Mehrwertsteuer</a></td>
+                    <td>1510,95 EUR</td>
+                    <td>Kunden-Bestellung</td>
+                    <td><a href="/intern/customerorders">2504</a></td>
+                </tr>
+            </table>
+            </p>
+        </div>
+    </main>
+
+    <footer class="hero-black">
+        <div class='content-width bar-flex'>
+            <h3>Project eCommerce</h3>
+            <div class="spacer"></div>
+            <div>
+                <h4>Seite</h4>
+                <ul>
+                    <li><a>Login</a></li>
+                    <li><a>Angebote</a></li>
+                    <li><a>Suche</a></li>
+                    <li><a>Mitarbeiter Login</a></li>
+                </ul>
+            </div>
+            <div>
+                <h4>Mehr</h4>
+                <ul>
+                    <li><a>Nutzungsbedingungen</a></li>
+                    <li><a>Datenschutz</a></li>
+                    <li><a>Über</a></li>
+                </ul>
+            </div>
+        </div>
+    </footer>
+    </body>
+    </html>
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/intern/suppliers_order_detailview.html b/prototype/src/main/resources/templates/intern/suppliers_order_detailview.html
new file mode 100644
index 0000000..cae208c
--- /dev/null
+++ b/prototype/src/main/resources/templates/intern/suppliers_order_detailview.html
@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+    <head>
+        <meta charset="utf-8">
+        <title>Bestell -und Buchungsübersicht</title>
+        <link rel="stylesheet" th:href="@{/css/ecom.css}" />
+        <link rel="stylesheet" th:href="@{/css/NoFocus.css}" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+    </head>
+    <body>
+    <nav class='hero'>
+        <div class='content-width bar-flex'>
+            <h1>Project eCommerce</h1>
+            <button>Angebote</button>
+            <div class='spacer input-icon secondary'>
+                <input type="text" placeholder="Nach Produkten suchen..."/>
+                <button>Finden</button>
+            </div>
+            <button>Login</button>
+        </div>
+    </nav>
+
+    <main>
+        <div class="content-width">
+            <h1>Bestelldetails</h1>
+            <div class="grid l">
+                <section class="hero">
+                    <h3>Allgemeineinformationen</h3>
+                    <p>Die Bestellung wurde am 01.01.2020 bestellt</p>
+                    <p>Bestellnummer: 614899499</p>
+                    <p>Ist angekommen</p>
+                </section>
+                <section class="hero">
+                    <h3>Versandinformationen</h3>
+                    <p>Name<br>Straße<br>Ort, plz<br>Deutschland</p>
+                </section>
+                <section class="hero">
+                    <h3>Preiszusammensetzung</h3>
+                    <div class="grid s">
+                        <section class="noMargin noPadding">
+                            <p>Startwert<br>Versand<br>Summe ohne MwSt.<br>Anzurechnende MwSt.</p>
+                            <p>Gesamtsumme</p>
+                        </section>
+                        <section class="noMargin noPadding Margin-left s">
+                            <p>6,00 EUR<br>3,00 EUR<br>9,00 Eur<br>1,71 Eur<br></p>
+                            <p>‭10,71‬ EUR</p>
+                        </section>
+                    </div>
+                </section>
+            </div>
+            <div class="vertical-spacer s"></div>
+            <h1>Bestellter Artikel</h1>
+            <div class='grid m shadow'>
+
+                <section class="hero">
+                    <h2>Lorem Ipsum</h2>
+                    <img src="../img/product-1.jpg">
+                    <h3>Menge: 1</h3>
+                    <p class='price'> 25.14 €</p>
+                    <p>
+                        Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte.
+                    </p>
+                </section>
+            </div>
+        </div>
+    </main>
+    <footer class="hero-black">
+        <div class='content-width bar-flex'>
+            <h3>Project eCommerce</h3>
+            <div class="spacer"></div>
+            <div>
+                <h4>Seite</h4>
+                <ul>
+                    <li><a>Login</a></li>
+                    <li><a>Angebote</a></li>
+                    <li><a>Suche</a></li>
+                    <li><a>Mitarbeiter Login</a></li>
+                </ul>
+            </div>
+            <div>
+                <h4>Mehr</h4>
+                <ul>
+                    <li><a>Nutzungsbedingungen</a></li>
+                    <li><a>Datenschutz</a></li>
+                    <li><a>Über</a></li>
+                </ul>
+            </div>
+        </div>
+    </footer>
+    </body>
+    </html>
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/intern/suppliers_overview.html b/prototype/src/main/resources/templates/intern/suppliers_overview.html
new file mode 100644
index 0000000..89f3fbc
--- /dev/null
+++ b/prototype/src/main/resources/templates/intern/suppliers_overview.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+<head>
+    <meta charset="utf-8">
+    <title>Kundenübersicht</title>
+    <link rel="stylesheet" th:href="@{/css/ecom.css}" />
+    <link rel="stylesheet" th:href="@{/css/NoFocus.css}" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+</head>
+<body>
+<nav class='hero'>
+    <div class='content-width bar-flex'>
+        <h1>Project eCommerce</h1>
+        <button>Angebote</button>
+        <div class='spacer input-icon secondary'>
+            <input type="text" placeholder="Nach Produkten suchen..."/>
+            <button>Finden</button>
+        </div>
+        <button>Login</button>
+    </div>
+</nav>
+
+<main>
+    <div class="content-width">
+        <h1>Kunden</h1>
+        <div class='spacer input-icon border backgroundprimary'>
+            <input type="text" class="nofocus" placeholder="Lieferanten Filtern"/>
+            <button class="nofocus">Filtern</button>
+        </div>
+        <p>
+        <table>
+            <tr>
+                <th>Lieferrantennummer</th>
+                <th>Name</th>
+                <th></th>
+            </tr>
+            <tr>
+                <td>1</td>
+                <td>Nike</td>
+                <td><button class="smaller">Details</button></td>
+            </tr>
+            <tr>
+                <td>1</td>
+                <td>Adidas</td>
+                <td><button class="smaller">Details</button></td>
+            </tr>
+        </table>
+        </p>
+    </div>
+</main>
+
+<footer class="hero-black">
+    <div class='content-width bar-flex'>
+        <h3>Project eCommerce</h3>
+        <div class="spacer"></div>
+        <div>
+            <h4>Seite</h4>
+            <ul>
+                <li><a>Login</a></li>
+                <li><a>Angebote</a></li>
+                <li><a>Suche</a></li>
+                <li><a>Mitarbeiter Login</a></li>
+            </ul>
+        </div>
+        <div>
+            <h4>Mehr</h4>
+            <ul>
+                <li><a>Nutzungsbedingungen</a></li>
+                <li><a>Datenschutz</a></li>
+                <li><a>Über</a></li>
+            </ul>
+        </div>
+    </div>
+</footer>
+</body>
+</html>
\ No newline at end of file