Finish order admin page with detail dialog and actions

backend/data/accountRoles.json

@@ -4,29 +4,19 @@
       "id": 0,
       "name": "Unregistered",
       "privilegeBuy": false,
-      "privilegeAdminPanel": false,
+      "privilegeAdminPanel": false
-      "privilegeFileAccess": false
     },
     {
       "id": 1,
       "name": "User",
       "privilegeBuy": true,
-      "privilegeAdminPanel": false,
+      "privilegeAdminPanel": false
-      "privilegeFileAccess": false
     },
     {
       "id": 2,
       "name": "Admin",
       "privilegeBuy": true,
-      "privilegeAdminPanel": true,
+      "privilegeAdminPanel": true
-      "privilegeFileAccess": false
-    },
-    {
-      "id": 3,
-      "name": "Super-Admin",
-      "privilegeBuy": true,
-      "privilegeAdminPanel": true,
-      "privilegeFileAccess": true
     }
   ]
 }

backend/data/accounts.json

@@ -19,7 +19,7 @@
           "iban": "DE92500105175721645777"
         }
       ],
-      "accountRoleId": 2
+      "accountRoleId": 1
     },
     {
       "username": "katjaStoiber",
@@ -94,7 +94,7 @@
           "iban": "DE41500105172184936679"
         }
       ],
-      "accountRoleId": 3
+      "accountRoleId": 2
     },
     {
       "username": "guitarhero",

backend/data/bands-concerts.json

@@ -78,25 +78,25 @@
               "location": "Swiss Life Hall"
             },
             {
-              "date": "4",
+              "date": "8",
               "price": 92,
               "inStock": 170,
               "location": "Swiss Life Hall"
             },
             {
-              "date": "8",
+              "date": "12",
               "price": 119.90,
               "inStock": 8736,
               "location": "Olympiahalle München"
             },
             {
-              "date": "12",
+              "date": "19",
               "price": 114.90,
               "inStock": 2793,
               "location": "Barclays Arena"
             },
             {
-              "date": "13",
+              "date": "31",
               "price": 124.90,
               "inStock": 3079,
               "location": "Uber Arena Berlin"
@@ -468,7 +468,7 @@
               "location": "ZAG Arena"
             },
             {
-              "date": "6",
+              "date": "15",
               "price": 84.90,
               "inStock": 192,
               "location": "Muffatwerk"
@@ -613,25 +613,25 @@
           "image": "concerts/will-of-the-people-tour.jpg",
           "concerts": [
             {
-              "date": "32",
+              "date": "2",
               "price": 67.90,
               "inStock": 847,
               "location": "ZAG Arena"
             },
             {
-              "date": "39",
+              "date": "17",
               "price": 67.90,
               "inStock": 847,
               "location": "ZAG Arena"
             },
             {
-              "date": "41",
+              "date": "31",
               "price": 64.90,
               "inStock": 245,
               "location": "Olympiastadion Berlin"
             },
             {
-              "date": "45",
+              "date": "43",
               "price": 64.90,
               "inStock": 245,
               "location": "Astra Kulturhaus"

backend/data/exercises.json

@@ -60,39 +60,46 @@
       "descriptionDe": "Eine Datenbank arbeitet mit SQL Befehlen um Datensätze anzulegen, abzurufen, zu verändern und löschen. Ein Server wird über API-Schnittstellen angesprochen, führt die Befehle in der Datenbank aus und liefert das Ergebnis zurück. Der Client darf keinen direkten Zugriff auf die Datenbank haben. Bei SQL Injections wird versucht, diesen Sicherheitsmechanismus zu umgehen und über die API-Schnittstellen direkte SQL Befehle auszuführen.",
       "descriptionEn": "todo",
       "exercises": [
+        {
+          "nameDe": "Wie sieht die Datenbank aus?",
+          "nameEn": "How does the database look like?",
+          "exerciseNr": 1,
+          "descriptionDe": "Wir versuchen nun die Datenbank im Hintergrund anzugreifen. Aktuell wissen wir aber noch nicht wie die Datenbank aussieht, also welche Tabellen sie beinhaltet. Wir können uns aber mit einem SQL-Befehl ausgeben. Gehe zur globalen Suchseite. Öffne mit der Tastenkombination >>Strg<< + >>D<< die >>Developer Tools<<. Klicke auf den Reiter >>Network<<. Hier siehst du, wie das Frontend mit dem Server kommuniziert. Schreibe nun eine SQL-Injection, welche den Suchbegriff ignoriert und dir stattdessen alle Datensätze der Tabelle >>sqlite_master<< zurück gibt, sofern die Bedingung >>type='table'<< erfüllt ist. Kopiere dir bei erfolgreicher Rückmeldung des Backends die Namen der Tabellen in eine Text-Datei, damit wir für die kommenden Aufgaben die richtigen Namen der Tabellen angeben können.",
+          "descriptionEn": "todo"
+        },
         {
           "nameDe": "Alle Accounts ausspähen",
           "nameEn": "Get all accounts",
-          "exerciseNr": 1,
+          "exerciseNr": 2,
-          "descriptionDe": "Wir versuchen nun die Datenbank im Hintergrund anzugreifen. Gehe zur globalen Suchseite. Öffne mit der Tastenkombination >>Strg + D<< die >>Developer Tools<<. Klicke auf den Reiter >>Network<<. Hier siehst du, wie das Frontend mit dem Server kommuniziert. Schreibe nun eine SQL-Injection, welche den Suchbegriff ignoriert und dir stattdessen alle Datensätze der Tabelle >>Accounts<< zurück liefert. Führe den Angriff über das Suchfeld aus. Sieh dir die Rückmeldung des Servers an, indem du im >>Network<<-Tab auf die zurück gegebenen Objekte klickst (z.B. >>locations<<).",
+          "descriptionDe": "Schreibe nun eine SQL-Injection, welche den Suchbegriff ignoriert und dir stattdessen alle Datensätze der Account-Tabelle zurück liefert. Führe den Angriff über das Suchfeld aus. Sieh dir die Rückmeldung des Servers an.",
           "descriptionEn": "Execute an SQL-Injection on the Search page to get all datasets from >>Accounts<< table."
         },
         {
           "nameDe": "Alle Berechtigungsgruppen ausspähen",
           "nameEn": "Get all account roles",
-          "exerciseNr": 2,
+          "exerciseNr": 3,
           "descriptionDe": "Wir sehen nun alle Accounts. Jeder hat eine Berechtigungs-ID (accountRoleId) mit der Berechtigungen wie der Zugriff aufs Admin-Panel geregelt werden. Wir wissen aber nicht, was die ID's bedeuten. Schreibe darum eine SQL-Injection, welche den Suchbegriff ignoriert und dir stattdessen alle Datensätze der Tabelle >>AccountRoles<< zurück liefert. Führe den Angriff über das Suchfeld aus. Beobachte die Rückmeldung des Servers über den >>Network<<-Tab.",
           "descriptionEn": "Execute an SQL-Injection on the Search page to get all datasets from >>AccountRoles<< table."
         },
         {
           "nameDe": "Eigene Berechtigungen erhöhen",
           "nameEn": "Upgrade your privileges",
-          "exerciseNr": 3,
+          "exerciseNr": 4,
           "descriptionDe": "Jetzt bearbeiten wir unseren eigenen Account. Schreibe hierfür einen >>UPDATE<<-SQL-Befehl, welcher die >>accountRoleId<< auf das Niveau eines >>Admin<< erhöht für deinen Account-Namen.",
           "descriptionEn": "Change the privileges of your account"
         },
         {
           "nameDe": "Einen fremden Account übernehmen",
           "nameEn": "Capture another account",
-          "exerciseNr": 4,
+          "exerciseNr": 5,
           "descriptionDe": "Statt unsere eigenen Berechtigungen zu erhöhen, können wir auch einen Account übernehmen, welcher bereits ein >>Super-Admin<< ist. Suche dir dafür aus der Liste der in Aufgabe 2.1 erhaltenen Accounts einen aus, welcher die Rolle >>Super-Admin<< inne hat. Nur damit lässt sich die Dateiverwaltung öffnen, welche wir später brauchen. Hast du den Account-Namen gefunden, gehe ins Login-Menü (logge dich aus, falls du noch angemeldet bist). Führe nun einen SQL-Injektion durch um diesen Account zu übernehmen.",
           "descriptionEn": "todo"
         },
         {
           "nameDe": "Bewertungen löschen",
           "nameEn": "Delete ratings",
-          "exerciseNr": 5,
+          "exerciseNr": 6,
-          "descriptionDe": "Jede Band hat Bewertungen auf einer Skala von eins bis fünf Sternen erhalten. Wir wollen alle Fünf-Sterne Bewertungen aus der Datenbank löschen. Schreibe eine SQL Injection, welche in der Tabelle >>Ratings<< alle Einträge mit der Bedingung >>rating = 5<< entfernt. Führe die Injection über die globale Suche aus.",
+          "descriptionDe": "Jede Band hat Bewertungen auf einer Skala von eins bis fünf Sternen erhalten. Wir wollen alle Fünf-Sterne Bewertungen aus der Datenbank löschen. Schreibe eine SQL Injection, welche in der Bewertungs-Tabelle alle Einträge mit der Bedingung >>rating = 5<< entfernt. Führe die Injection über die globale Suche aus.",
           "descriptionEn": "todo"
         }
       ]
@@ -108,14 +115,14 @@
           "nameDe": "Hallo Welt!",
           "nameEn": "Hello World!",
           "exerciseNr": 1,
-          "descriptionDe": "Nimm dir eine URL des Shops und erweitere sie mit JavaScript Code so, dass beim Öffnen des Links eine 'Hallo Welt' Nachricht erscheint",
+          "descriptionDe": "Als nächstes wollen wir Schadcode in die Web-Applikation einschleusen. Zunächst testen wir, ob die Webseite hierfür anfällig ist. Gehe hierzu auf die Seite >>Alle Bands<< und filtere die Einträge nach einem beliebigen Genre deiner Wahl. In der URL-Leiste siehst du nun, dass hinter der URL und dem Ressourcen-Ziel ein Parameter angegeben ist (der Part hinter dem Fragezeichen). Wir tauschen diesen Parameter gegen einen HTML Tag aus. Der Trick hierbei: Als Quelle geben wir den Zahlenwert >>1<< an, wodurch automatisch das ausgeführt wird, was im >>onerror<<-Tag drinnen steht. Genau hier soll eine Alert-Meldung mit >>Hello World!<< als JavaScript Code eingefügt werden. Verändere die URL so, dass sie die Meldung ausgibt. Falls du nicht mit JavaScript vertraut bist, sieh dir die letzte Seite mit nützlichen Befehlen an.",
           "descriptionEn": "Take an URL of the shop and extend it with JavaScript code so that a 'Hello World' message appears whent the link is opened"
         },
         {
           "nameDe": "Ein externes Script aufrufen",
           "nameEn": "Run an external script",
           "exerciseNr": 2,
-          "descriptionDe": "Wir haben festgestellt, dass die Seite für Cross-Site-Scripting angreifbar ist! Im zweiten Schritt binden wir nun das Script ein. Es wurde bereits auf den Server hochgeladen. Suche über die Dateiverwaltung im Admin-Panel nach dem Skript. Kopiere dir die URL der Ressource heraus. Gehe zum Login und log dich aus. Füge einen beliebig benannten Query Parameter zur URL hinzu um das Skript zu laden. Nutze ein >>import<<-Statement um das Skript einzubinden. Logge dich nun ganz normal ein und sieh dir über die Konsole (Strg + D) an, wie deine Login-Daten abgegriffen werden. Hinweis: Wenn das Skript richtig eingebunden wurde, erscheint in der Konsole eine >>Active<<-Benachrichtigung. Da das >>import<<-Statement nur beim erstmaligen Laden der Seite genutzt wird, musst nach Eingabe der URL eventuell den Neu-Laden-Button neben der URL-Leiste betätigen.",
+          "descriptionDe": "Wir haben festgestellt, dass die Seite für Cross-Site-Scripting durch Reflected XSS angreifbar ist! Im zweiten Schritt binden wir nun das Script ein. Es wurde bereits auf den Server hochgeladen. Logge dich wahlweise mit einem Admin-Account (Aufgabe 2.5) oder deinem eigenen nun berechtigten Account (Aufgabe 2.4) ein. Öffne nun das Admin-Panel über den Button rechts oben. Suche über die Dateiverwaltung im Admin-Panel nach dem Skript und notiere dir die darunter angezeigte Adresse auf dem Backend-Server. Logge dich aus. Wir wollen das Skript auf der nun sichtbaren Login-Seite über eine veränderte URL einbinden. Nutze hierfür das gleiche Prinzip wie in Aufgabe 3.1. Statt >>genreName<< kannst du einen beliebigen anderen Parameter-Namen verwenden. Nutze die Konsole mit der Tastenkombination Strg + D vor dem Abschicken der URL.Logge dich nach erfolgreicher Aufgabenlösung ein und sieh in der Konsole, wie deine Login-Daten abgegriffen werden.",
           "descriptionEn": "Create an URL of the shop, which calls the script"
         }
       ]

backend/data/licenses.json

@@ -0,0 +1,200 @@
+[
+  {
+    "image": "alex-turner.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Raph_PH",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/9/95/Alex_Turner%2C_Way_Out_West_2018.jpg"
+  },
+  {
+    "image": "andy-nicholson.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Lola's Big Adventure!",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/6/6c/Andy_Nicholson_%28cropped%29.jpg"
+  },
+  {
+    "image": "anthony-kiedis.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Hel Davies",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/c/ca/Anthony_Kiedis_2022.jpg"
+  },
+  {
+    "image": "chris-martin.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Raph_PH",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/6/68/ChrisMartinManch030623_%28cropped%29.jpg"
+  },
+  {
+    "image": "chris-wolstenholme.jpg",
+    "license": "CC BY-SA 4.0",
+    "creator": "Markus Felix",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/e/eb/2018_Chris_Wolstenholme_%28cropped%29.jpg"
+  },
+  {
+    "image": "flea.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Piyush Kumar",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/8/8e/Flea_1012_%282%29.jpg"
+  },
+  {
+    "image": "chad-smith.jpg",
+    "license": "Gemeinfrei",
+    "creator": "Bojosoto",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/4/42/Chadsmithclinic.jpg"
+  },
+  {
+    "image": "john-frusciante.jpg",
+    "license": "CC BY-SA 2.0",
+    "creator": "Hel Davies",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/1/1f/John_Frusciante_%2852279466415%29.jpg"
+  },
+  {
+    "image": "logo.png",
+    "license": "MIT",
+    "creator": "Tobias Zoghaib",
+    "url": ""
+  },
+  {
+    "image": "lanxess-arena-indoor.jpg",
+    "license": "CC BY-SA 3.0",
+    "creator": "Admin Kübelbeck",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/f/f3/Koelnarena_inside.jpg"
+  },
+  {
+    "image": "lanxess-arena-outdoor.jpg",
+    "license": "CC BY-SA 2.0",
+    "creator": "Rolf H.",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/1/18/Lanxess_Arena_Flight_over_Cologne.jpg"
+  },
+  {
+    "image": "red-hot-chili-peppers-1.jpg",
+    "license": "CC BY-SA 4.0",
+    "creator": "Kreepin Deth",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/1/14/RHCP_Live_in_London_26_June_2022.jpg"
+  },
+  {
+    "image": "swiss-life-hall-indoor.jpg",
+    "license": "CC BY-SA 3.0",
+    "creator": "Bernd Schwabe in Hannover",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/8/89/2013-09-18_Besuch_14._Dalai_Lama_Tendzin_Gyatsho_in_Hannover%2C_future4children%2C_Swiss_Life_Hall%2C_%2876%29.JPG"
+  },
+  {
+    "image": "swiss-life-hall-outdoor.jpg",
+    "license": "Public Domain",
+    "creator": "AxelHH",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/6/66/AWD_Hall_Seite.jpg"
+  },
+  {
+    "image": "astra-kulturhaus-outdoor.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Marcus Grbac",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/f/fd/Astra_Kulturhaus_Biergarten_RAW_Berlin_July_2017.jpg"
+  },
+  {
+    "image": "thom-yorke.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Raph_PH",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/2/25/RadioheadMontreal170718-70_%2843600493681%29_%28cropped%29.jpg"
+  },
+  {
+    "image": "rami-jaffee.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Raph_PH",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/f/fa/Rami_Jaffee_1.jpg"
+  },
+  {
+    "image": "philip-selway.jpg",
+    "license": "CC BY-SA 2.0",
+    "creator": "Michell Zappa",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/1/1f/Phil_Selway.jpg"
+  },
+  {
+    "image": "phil-harvey.jpg",
+    "license": "CC BY-SA 3.0",
+    "creator": "Hayley St. James",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/3/36/PhilHarveyNewYork17062021.png"
+  },
+  {
+    "image": "pat-smear.jpg",
+    "license": "GNU v.1.2",
+    "creator": "Andrew Burns",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/6/66/Patsmear.jpg"
+  },
+  {
+    "image": "mike-kerr.jpg",
+    "license": "CC BY 4.0",
+    "creator": "Dena Flows",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/8/85/017-BIME-2017-Royal-Blood-27X17-por-Dena-Flows.jpg"
+  },
+  {
+    "image": "matthew-bellamy.jpg",
+    "license": "CC BY 3.0",
+    "creator": "Minerva97",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/d/d0/2009_Matthew_Bellamy_%28cropped%29.jpg"
+  },
+  {
+    "image": "capitol-outside.jpg",
+    "license": "",
+    "creator": "AxelHH",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/6/6c/Hannover_Capitol_ganz.jpg"
+  },
+  {
+    "image": "red-hot-chili-peppers-logo.png",
+    "license": "",
+    "creator": "Viiticus",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/3/31/Red_Hot_Chili_Peppers_logo.svg"
+  },
+  {
+    "image": "red-hot-chili-peppers-2.jpg",
+    "license": "CC BY-SA 4.0",
+    "creator": "Roberto Gianardi",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/6/64/Red_Hot_Chili_Peppers_Bologna_2016.jpg"
+  },
+  {
+    "image": "arctic-monkeys-1.jpg",
+    "license": "CC BY 3.0",
+    "creator": "Bill Ebbesen",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/0/04/Arctic_Monkeys_-_Orange_Stage_-_Roskilde_Festival_2014.jpg"
+  },
+  {
+    "image": "arctic-monkeys-2.jpg",
+    "license": "CC BY-SA 3.0",
+    "creator": "Kennysun",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/6/65/Arctic_Monkeys_Playing_at_MSG.jpg"
+  },
+  {
+    "image": "arctic-monkeys-3.jpg",
+    "license": "CC BY-SA 2.0",
+    "creator": "Aurelien Guichard",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/f/f8/Arctic_Monkeys_%40_Shepherds_Bush_Empire.jpg"
+  },
+  {
+    "image": "european-tour-arctic-monkeys.jpg",
+    "license": "Gemeinfrei",
+    "creator": "Matthew Cooper",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/e/e7/%22AM%22_%28Arctic_Monkeys%29.jpg"
+  },
+  {
+    "image": "billy-talent-1.jpg",
+    "license": "CC BY-SA 4.0",
+    "creator": "Biha",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/2/2b/Billy_Talent_-_Frequency_Festival_-_2017-08-15-21-51-04.jpg"
+  },
+  {
+    "image": "billy-talent-2.jpg",
+    "license": "CC BY-SA 4.0",
+    "creator": "Markus Maier",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/3/3f/Southside_Festival_-_Billy_Talent_-_DSC05306.jpg"
+  },
+  {
+    "image": "billy-talent-3.jpg",
+    "license": "CC BY-SA 2.0",
+    "creator": "sebi ryffel",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/e/ec/Billy_Talent_at_Rock_Am_See_2007.jpg"
+  },
+  {
+    "image": "coldplay-members.jpg",
+    "license": "CC BY 2.0",
+    "creator": "Raph_PH",
+    "url": "https://upload.wikimedia.org/wikipedia/commons/2/2e/ColdplayBBC071221_%28cropped%29.jpg"
+  }
+]

backend/data/orders.json

@@ -18,7 +18,7 @@
       "username": "duranduran",
       "tickets": [
         {
-          "date": "4",
+          "date": "8",
           "concertGroupName": "Unlimited Love",
           "orderPrice": 184,
           "seatGroup": "A",
@@ -26,7 +26,7 @@
           "seat": 2
         },
         {
-          "date": "4",
+          "date": "8",
           "concertGroupName": "Unlimited Love",
           "orderPrice": 184,
           "seatGroup": "A",

backend/routes/account.routes.ts

@@ -4,7 +4,6 @@ import { validateString } from "../scripts/validateHelper";
 import { Address } from "../models/user/address.model";
 import { Payment } from "../models/user/payment.model";
 import { AccountRole } from "../models/user/accountRole.model";
-import { Exercise } from "../models/exercises/exercise.model";
 import { sequelize } from "../database";
 import jwt from "jsonwebtoken"
 import { verifyToken } from "../middlewares/auth.middleware";
@@ -12,17 +11,20 @@ import { encryptString } from "../scripts/encryptScripts";
 
 export const account = Router()
 
-account.get("/", (req: Request, res: Response) => {
+account.get("/", verifyToken, (req: Request, res: Response) => {
   Account.findAll({
     include: [ AccountRole ]
   })
     .then(accounts => {
       res.status(200).json(accounts)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 // Login user
-account.get("/login", async (req: Request, res: Response) => {
+account.get("/account/login", async (req: Request, res: Response) => {
   const encryptedPassword = encryptString(String(req.query.password))
 
   // Using raw SQL code for SQL injections!
@@ -52,7 +54,7 @@ account.get("/login", async (req: Request, res: Response) => {
 })
 
 
-account.get("/account", verifyToken, async(req: Request, res: Response) => {
+account.get("/account/data", verifyToken, async(req: Request, res: Response) => {
   Account.findOne({
     where: {
       id: req["id"]
@@ -62,11 +64,14 @@ account.get("/account", verifyToken, async(req: Request, res: Response) => {
     .then(account => {
       res.status(200).json(account)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 
 // Creating a new user
-account.post("/", async (req: Request, res: Response) => {
+account.post("/account", async (req: Request, res: Response) => {
   // Check if username is valid
   if (!validateString(req.body.username, 4))
   {
@@ -85,9 +90,10 @@ account.post("/", async (req: Request, res: Response) => {
       code: 400, 
       message: "Password too short!"
     })
+    return
   }
 
-  // Create account
+  // User on creation gets User role
   await AccountRole.findOne({
     where: {
       name: "User"
@@ -97,11 +103,12 @@ account.post("/", async (req: Request, res: Response) => {
       req.body["accountRoleId"] = role.id
     })
 
+  // Create account
   Account.create(req.body)
     .then(account => {
       // Status: 201 Created
       res.status(201).json(account)
-    }).catch(reason => {
+    }).catch(error => {
       // Status: 409 Conflict
       res.status(409).json({
         code: 409,
@@ -110,7 +117,7 @@ account.post("/", async (req: Request, res: Response) => {
     })
 })
 
-account.patch("/", verifyToken, (req: Request, res: Response) => {
+account.patch("/account", verifyToken, (req: Request, res: Response) => {
   Account.update(req.body,
   {
     where: { id: req.body.id }
@@ -157,7 +164,7 @@ account.patch("/", verifyToken, (req: Request, res: Response) => {
   })
 })
 
-account.delete("/:id", (req: Request, res: Response) => {
+account.delete("/account/:id", (req: Request, res: Response) => {
   Account.destroy({
     where: {
       id: req.params.id
@@ -166,4 +173,7 @@ account.delete("/:id", (req: Request, res: Response) => {
     .then(account => {
       res.status(200).send()
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })

backend/routes/band.routes.ts

@@ -65,6 +65,9 @@ band.get("/", (req: Request, res: Response) => {
 
       res.status(200).json(bands)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 /**
@@ -122,7 +125,7 @@ band.get("/band/:name", (req: Request, res: Response) => {
 
       res.status(200).json(band)
     })
-    .catch(e => {
+    .catch(error => {
       res.status(404).send()
     })
 })
@@ -137,11 +140,13 @@ band.get("/search", async (req: Request, res: Response) => {
 
   // On stacked prompts, execute last prompt
   if (prompts.length > 1) {
-    console.log(prompts[prompts.length - 2])
+    try {
-    const [results, metadata] =
+      const [results, metadata] =
-      await sequelize.query(prompts[prompts.length - 2])
+        await sequelize.query(prompts[prompts.length - 2])
-
+        res.status(200).json(results)
-    res.status(200).json(results)
+    } catch (e) {
+      res.status(400).send()
+    }
   } else {
       Band.findAll({
         where: {
@@ -154,6 +159,9 @@ band.get("/search", async (req: Request, res: Response) => {
         .then(bands => {
           res.status(200).json(bands)
         })
+        .catch(error => {
+          res.status(200).send()
+        })
   }
 })
 
@@ -170,6 +178,9 @@ band.patch("/", (req: Request, res: Response) => {
     .then(result => {
       res.status(200).json(result)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 
@@ -181,6 +192,9 @@ band.post("/", (req: Request, res: Response) => {
     .then(result => {
       res.status(200).json(result)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 /**

backend/routes/city.routes.ts

@@ -8,4 +8,7 @@ city.get("/", (req: Request, res: Response) => {
     .then(cities => {
       res.status(200).json(cities)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })

backend/routes/concert.routes.ts

@@ -35,6 +35,9 @@ concert.get("/", (req: Request, res: Response) => {
 
       res.status(200).json(concerts)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 
@@ -154,4 +157,7 @@ concert.get("/search", (req: Request, res: Response) => {
     .then(concerts => {
       res.status(200).json(concerts)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })

backend/routes/exercise.routes.ts

@@ -11,13 +11,17 @@ export const exercises = Router()
 exercises.get("/", (req: Request, res: Response) => {
   Exercise.findAll({
     include: [ ExerciseGroup ]
-  }).then(result => {
-    result.sort((a, b) => {
-      return (a.dataValues.exerciseGroup.dataValues.groupNr * 10 + a.dataValues.exerciseNr) > (b.dataValues.exerciseGroup.dataValues.groupNr * 10 + b.dataValues.exerciseNr) ? 1 : -1
-    })
-
-    res.status(200).json(result)
   })
+    .then(result => {
+      result.sort((a, b) => {
+        return (a.dataValues.exerciseGroup.dataValues.groupNr * 10 + a.dataValues.exerciseNr) > (b.dataValues.exerciseGroup.dataValues.groupNr * 10 + b.dataValues.exerciseNr) ? 1 : -1
+      })
+
+      res.status(200).json(result)
+    })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 /**
@@ -54,21 +58,7 @@ exercises.post("/:groupNr/:exerciseNr/:state", (req: Request, res: Response) =>
           changed: changed
         })
     })
-
+    .catch(error => {
-
+      res.status(500).send()
-  // ExerciseGroup.findOne({
+    })
-  //   where: { groupNr: req.params.groupNr }
-  // })
-  //   .then(group => {
-  //     Exercise.findOne({
-  //       where: {
-  //         exerciseNr: req.params.exerciseNr,
-  //         exerciseGroupId: group.id
-  //       }
-  //     })
-  //       .then(exercise => {
-  //         exercise.update({ solved: req.params.state == "1"})
-  //         res.status(200).send()
-  //       })
-  //   })
 })

backend/routes/files.routes.ts

@@ -1,7 +1,8 @@
 import { Request, Response, NextFunction, Router } from 'express'
-import fs from "fs"
+import fs, { createReadStream } from "fs"
 import multer from "multer"
 const upload = multer({ dest: './backend/images/' })
+import licenses from "../data/licenses.json"
 
 export const files = Router()
 
@@ -24,21 +25,28 @@ files.get("/folders", async (req: Request, res: Response) => {
 
 
 /**
- * Get all uploaded file names by file name
+ * Get all uploaded file names by folder name
+ * 
+ * @param folder Name of folder on server
  */
 files.get("/:folder", async (req: Request, res: Response) => {
   let result = []
   let fileNames = fs.readdirSync("./backend/images/" + req.params.folder + "/")
 
-
   fileNames.forEach(file => {
-    let resData = fs.readFileSync("./backend/images/" + req.params.folder + "/" + file, "utf8")
+    let resData = ""
+    let url = "http://localhost:3000/static/" + req.params.folder + "/" + file
+
+    if (file.endsWith("html") || file.endsWith("js")) {
+      resData = fs.readFileSync("./backend/images/" + req.params.folder + "/" + file, "utf8")
+    }
 
     result.push({
       name: file,
       size: fs.statSync("./backend/images/" + req.params.folder + "/" + file).size,
       content: resData,
-      url: "http://localhost:3000/static/" + req.params.folder + "/" + file
+      url: url,
+      copyright: licenses.find(data => data.image == file)
     })
   })
 
@@ -50,7 +58,5 @@ files.get("/:folder", async (req: Request, res: Response) => {
  * Upload a file
  */
 files.post("/", upload.single("file"), function (req: Request, res: Response, next: NextFunction) {
-  console.log(req.file)
-
   res.status(200).send()
 })

backend/routes/location.routes.ts

@@ -98,7 +98,7 @@ location.get("/location/:urlName", (req: Request, res: Response) => {
 
       res.status(200).json(location)
     })
-    .catch(e => {
+    .catch(error => {
       res.status(404).send()
     })
 })
@@ -133,4 +133,7 @@ location.get("/search", (req: Request, res: Response) => {
     .then(locations => {
       res.status(200).json(locations)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })

backend/routes/order.routes.ts

@@ -10,17 +10,15 @@ import { City } from "../models/locations/city.model";
 import { Seat } from "../models/locations/seat.model";
 import { SeatRow } from "../models/locations/seatRow.model";
 import { SeatGroup } from "../models/locations/seatGroup.model";
+import { verifyToken } from "../middlewares/auth.middleware";
 import { Account } from "../models/user/account.model";
-import { Exercise } from "backend/models/exercises/exercise.model";
 
 export const order = Router()
 
 // Get all orders
-order.get("/", (req: Request, res: Response) => {
+order.get("/", verifyToken, (req: Request, res: Response) => {
   Order.findAll({
     include: [
-      Account,
-      Address,
       {
         model: Ticket,
         include: [
@@ -35,14 +33,29 @@ order.get("/", (req: Request, res: Response) => {
                 include: [ City ]
               }
             ]
+          },
+          {
+            model: Seat,
+            include: [
+              {
+                model: SeatRow,
+                include: [ SeatGroup ]
+              }
+            ]
           }
         ]
-      }
+      },
+      Address,
+      Payment,
+      Account
     ]
   })
     .then(orders => {
       res.status(200).json(orders)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 
@@ -90,6 +103,9 @@ order.get("/:id", (req: Request, res: Response) => {
     .then(orders => {
       res.status(200).json(orders)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
 })
 
 // Place a new order
@@ -116,4 +132,21 @@ order.post("/", (req: Request, res: Response) => {
       // Created
       res.status(201).json(order)
     })
+    .catch(error => {
+      res.status(500).send()
+    })
+})
+
+order.patch("/", (req: Request, res: Response) => {
+  Order.update(req.body, {
+    where: {
+      id: req.body.id
+    }
+  })
+    .then(affectedCount => {
+      res.status(200).send()
+    })
+    .catch(error => {
+      res.status(500).send()
+    })
 })

backend/server.ts

@@ -29,6 +29,7 @@ startDatabase()
 const path = require('path')
 app.use('/static', express.static(path.join(__dirname, 'images')))
 app.use("/exercises", exercises)
+app.use("/files", files)
 
 // Add delay for more realistic response times
 app.use((req, res, next) => {
@@ -44,7 +45,6 @@ app.use("/orders", order)
 app.use("/accounts", account)
 app.use("/cities", city)
 app.use("/concerts", concert)
-app.use("/files", files)
 
 // Start server
 const server = app.listen(port, () => {

package-lock.json

@@ -14,6 +14,10 @@
         "axios": "^1.7.7",
         "body-parser": "^1.20.2",
         "cors": "^2.8.5",
+        "csv": "^6.3.11",
+        "csv-reader": "^1.0.12",
+        "exif-js": "^2.3.0",
+        "exifreader": "^4.25.0",
         "express": "^4.21.1",
         "jsonwebtoken": "^9.0.2",
         "jspdf": "^2.5.2",
@@ -4284,6 +4288,48 @@
       "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
       "license": "MIT"
     },
+    "node_modules/csv": {
+      "version": "6.3.11",
+      "resolved": "https://registry.npmjs.org/csv/-/csv-6.3.11.tgz",
+      "integrity": "sha512-a8bhT76Q546jOElHcTrkzWY7Py925mfLO/jqquseH61ThOebYwOjLbWHBqdRB4K1VpU36sTyIei6Jwj7QdEZ7g==",
+      "license": "MIT",
+      "dependencies": {
+        "csv-generate": "^4.4.2",
+        "csv-parse": "^5.6.0",
+        "csv-stringify": "^6.5.2",
+        "stream-transform": "^3.3.3"
+      },
+      "engines": {
+        "node": ">= 0.1.90"
+      }
+    },
+    "node_modules/csv-generate": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/csv-generate/-/csv-generate-4.4.2.tgz",
+      "integrity": "sha512-W6nVsf+rz0J3yo9FOjeer7tmzBJKaTTxf7K0uw6GZgRocZYPVpuSWWa5/aoWWrjQZj4/oNIKTYapOM7hiNjVMA==",
+      "license": "MIT"
+    },
+    "node_modules/csv-parse": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/csv-parse/-/csv-parse-5.6.0.tgz",
+      "integrity": "sha512-l3nz3euub2QMg5ouu5U09Ew9Wf6/wQ8I++ch1loQ0ljmzhmfZYrH9fflS22i/PQEvsPvxCwxgz5q7UB8K1JO4Q==",
+      "license": "MIT"
+    },
+    "node_modules/csv-reader": {
+      "version": "1.0.12",
+      "resolved": "https://registry.npmjs.org/csv-reader/-/csv-reader-1.0.12.tgz",
+      "integrity": "sha512-0AAgazKJUywtjvZbclNuovIiQY/WyvojWw15Y2k3kPixE+pDiOFnfg5FcH3CfDqqnrB2f3p5oPAc446EXD01Tw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.0.0"
+      }
+    },
+    "node_modules/csv-stringify": {
+      "version": "6.5.2",
+      "resolved": "https://registry.npmjs.org/csv-stringify/-/csv-stringify-6.5.2.tgz",
+      "integrity": "sha512-RFPahj0sXcmUyjrObAK+DOWtMvMIFV328n4qZJhgX3x2RqkQgOTU2mCUmiFR0CzM6AzChlRSUErjiJeEt8BaQA==",
+      "license": "MIT"
+    },
     "node_modules/de-indent": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
@@ -5023,6 +5069,32 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/exif-js": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/exif-js/-/exif-js-2.3.0.tgz",
+      "integrity": "sha512-1Og9pAzG2FZRVlaavH8bB8BTeHcjMdJhKmeQITkX+uLRCD0xPtKAdZ2clZmQdJ56p9adXtJ8+jwrGp/4505lYg==",
+      "license": "MIT"
+    },
+    "node_modules/exifreader": {
+      "version": "4.25.0",
+      "resolved": "https://registry.npmjs.org/exifreader/-/exifreader-4.25.0.tgz",
+      "integrity": "sha512-lPyPXWTUuYgoKdKf3rw2EDoE9Zl7xHoy/ehPNeQ4gFVNLzfLyNMP4oEI+sP0/Czp5r/2i7cFhqg5MHsl4FYtyw==",
+      "hasInstallScript": true,
+      "license": "MPL-2.0",
+      "optionalDependencies": {
+        "@xmldom/xmldom": "^0.9.4"
+      }
+    },
+    "node_modules/exifreader/node_modules/@xmldom/xmldom": {
+      "version": "0.9.5",
+      "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.9.5.tgz",
+      "integrity": "sha512-6g1EwSs8cr8JhP1iBxzyVAWM6BIDvx9Y3FZRIQiMDzgG43Pxi8YkWOZ0nQj2NHgNzgXDZbJewFx/n+YAvMZrfg==",
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=14.6"
+      }
+    },
     "node_modules/expand-template": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/expand-template/-/expand-template-2.0.3.tgz",
@@ -8590,6 +8662,12 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/stream-transform": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/stream-transform/-/stream-transform-3.3.3.tgz",
+      "integrity": "sha512-dALXrXe+uq4aO5oStdHKlfCM/b3NBdouigvxVPxCdrMRAU6oHh3KNss20VbTPQNQmjAHzZGKGe66vgwegFEIog==",
+      "license": "MIT"
+    },
     "node_modules/streamsearch": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-1.1.0.tgz",

package.json

@@ -38,6 +38,10 @@
     "axios": "^1.7.7",
     "body-parser": "^1.20.2",
     "cors": "^2.8.5",
+    "csv": "^6.3.11",
+    "csv-reader": "^1.0.12",
+    "exif-js": "^2.3.0",
+    "exifreader": "^4.25.0",
     "express": "^4.21.1",
     "jsonwebtoken": "^9.0.2",
     "jspdf": "^2.5.2",

src/App.vue

@@ -26,7 +26,6 @@ watch(() => preferencesStore.language, () => {
 // Watch for theme change
 watch(() => preferencesStore.theme, () => {
   theme.global.name.value = preferencesStore.theme
-  feedbackStore.addSnackbar(BannerStateEnum.ERROR)
 })
 
 // Watch for 404 page directions
@@ -80,9 +79,33 @@ function calcMargin(i) {
         <v-sheet color="sheet" height="100%">
           <router-view></router-view>
         </v-sheet>
+
       </v-container>
 
+      <v-btn
+        fab
+        dark
+        fixed
+        bottom
+        right
+        color="primary"
+      >
+        <v-icon>keyboard_arrow_up</v-icon>
+      </v-btn>
+
       <company-footer />
     </v-main>
   </v-app>
+
+  <!-- Test Environment sticker in bottom right corner -->
+  <v-sheet
+    color="error"
+    position="fixed" 
+    location="bottom right" 
+    class="pa-3 mb-12 mr-n16 text-center text-h5"
+    width="300"
+    style="rotate: 315deg; z-index: 1008;"
+  >
+    {{ $t('misc.testEnvironment') }}
+  </v-sheet>
 </template>

src/components/basics/cardViewHorizontal.vue

@@ -40,12 +40,16 @@ defineProps({
           type="image"
           :loading="loading"
         >
-          <v-img 
+          <v-sheet
-            :src="image" 
+            color="sheet"
-            :height="height"
+          >
-            :width="height"
+            <v-img 
-            cover
+              :src="image" 
-          />
+              :height="height"
+              :width="height"
+              cover
+            />
+          </v-sheet>
         </v-skeleton-loader>
 
         <v-skeleton-loader
@@ -55,6 +59,7 @@ defineProps({
         >
           <v-sheet
             :height="height"
+            color="sheet"
             width="100%"
             class="text-center d-flex justify-center align-center"
           >
@@ -75,6 +80,8 @@ defineProps({
         >
           <v-sheet
             :height="height"
+            color="sheet"
+            class="w-100"
           >
             <div>
               <div class="text-h4 font-weight-black pt-2 h-100">

src/components/basics/cardViewTopImage.vue

@@ -1,5 +1,8 @@
 <script setup lang="ts">
-defineProps({
+import { loadLicense } from '@/scripts/imageScripts';
+import { ref, watch } from 'vue';
+
+const props = defineProps({
   image: String,
   errorImage: {
     type: String,
@@ -16,6 +19,14 @@ defineProps({
   },
   loading: Boolean
 })
+
+const license = ref("")
+
+loadLicense(props.image)
+  .then(result => {
+    console.log(result)
+    license.value = result
+  })
 </script>
 
 <template>

src/components/basics/confirmDialog.vue

@@ -20,7 +20,7 @@ function confirmPressed() {
 <template>
   <action-dialog 
     :title="title"
-    max-width="400"
+    max-width="500"
     v-model="showDialog"
     persistent
   >
@@ -36,7 +36,7 @@ function confirmPressed() {
       <outlined-button
         @click="showDialog = false" 
         prepend-icon="mdi-close"
-        color="orange"
+        color="warning"
         :loading="loading"
       >
         {{ $t("misc.actions.cancel") }}
@@ -45,7 +45,7 @@ function confirmPressed() {
       <outlined-button
         @click="confirmPressed"
         prepend-icon="mdi-check"
-        color="red"
+        color="error"
         :loading="loading"
       >
         {{ $t("misc.actions.confirm") }}

src/components/basics/sectionDivider.vue

@@ -8,20 +8,28 @@ defineProps({
 
 <template>
   <v-row class="pt-3 d-none d-md-flex">
+    <!-- Left line -->
     <v-col class="d-flex justify-center align-center">
       <v-sheet height="12" width="100%" color="primary" class="rounded-s-lg" />
     </v-col>
     
+    <!-- Title -->
     <v-col class="v-col-auto">
       <v-skeleton-loader
         type="heading"
         :loading="loading"
         width="300"
       >
-        <span class="text-h4">{{ title }}</span>
+        <v-sheet
+          class="text-h4"
+          color="sheet"
+        >
+          {{ title }}
+        </v-sheet>
       </v-skeleton-loader>
     </v-col>
 
+    <!-- Right line -->
     <v-col class="d-flex justify-center align-center">
       <v-sheet height="12" width="100%" color="primary" class="rounded-e-lg" />
     </v-col>

src/components/navigation/navigationAppendItems.vue

@@ -27,7 +27,7 @@ exerciseStore.getAllExercises()
       :content="basketStore.itemsInBasket.reduce((tot, item) => {
         return tot + item.seats.length
       }, 0)"
-      color="red" offset-x="8" offset-y="8">
+      color="error" offset-x="8" offset-y="8">
       <v-btn variant="plain" icon="mdi-cart" to="/basket" />
     </v-badge>
   </div>

src/components/pageParts/heroImage.vue

@@ -56,6 +56,7 @@ defineProps({
             type="heading"
             :loading="loading"
             width="500"
+            class="text-white"
           >
             <span class="text-h3 font-weight-bold">
               {{ title }}
@@ -77,11 +78,18 @@ defineProps({
 
 
             <!-- Description -->
-            <p class="text-h6 text-medium-emphasis" v-if="!$slots.description">
+            <p
+              class="text-h6 text-white"
+              style="opacity: 0.7;"
+              v-if="!$slots.description"
+            >
               {{ description }}
             </p>
             
-            <p class="text-h6 text-medium-emphasis">
+            <p
+              class="text-h6 text-white"
+              style="opacity: 0.7;"
+            >
               <slot name="description"></slot>
             </p>
           </v-skeleton-loader>

src/data/api/accountApi.ts

@@ -3,34 +3,83 @@ import { AccountModel } from "../models/user/accountModel"
 
 const BASE_URL = "http://localhost:3000/accounts"
 
-export async function fetchAllAccounts() {
+/**
-  return await axios.get(BASE_URL)
+ * Fetch all accounts from server
+ * 
+ * @param token Validation token of current logged in user. User needs to have the right privileges
+ * 
+ * @returns Response from server with list of all account body
+ */
+export async function fetchAllAccounts(token: string) {
+  return await axios.get(BASE_URL, {
+    headers: {
+      "Authorization": token
+    }
+  })
 }
 
-export async function login(username: string, password: string) {
+/**
-  return await axios.get(BASE_URL + "/login?username=" + username + "&password=" + password)
+ * Start the login process
+ * 
+ * @param username Username of the account
+ * @param password Password of the account
+ * 
+ * @returns Response from server with token body
+ */
+export async function getLogin(username: string, password: string) {
+  return await axios.get(BASE_URL + "/account/login?username=" + username + "&password=" + password)
 }
 
+
+/**
+ * Get all data about a single account
+ * 
+ * @param token Validation token
+ * 
+ * @returns Response from server with account body
+ */
 export async function getAccount(token: string) {
-  return await axios.get(BASE_URL + "/account", {
+  return await axios.get(BASE_URL + "/account/data", {
     headers: {
       "Authorization": token
     }
   })
 }
 
+/**
+ * Register a new account in servers database
+ * 
+ * @param account Account data for new dataset
+ * 
+ * @returns Response from server
+ */
 export async function registerAccount(account: AccountModel) {
-  return await axios.post(BASE_URL, account)
+  return await axios.post(BASE_URL + "/account", account)
 }
 
+/**
+ * Update data of an account
+ * 
+ * @param account Account data to update
+ * @param token Validation token
+ * 
+ * @returns Response from server
+ */
 export async function updateAccount(account: AccountModel, token: string) {
-  return await axios.patch(BASE_URL, account, {
+  return await axios.patch(BASE_URL + "/account", account, {
     headers: {
       "Authorization": token
     }
   })
 }
 
+/**
+ * Delete an account in servers database
+ * 
+ * @param account Account to delete
+ * 
+ * @returns Response from server
+ */
 export async function deleteAccount(account: AccountModel) {
-  return await axios.delete(BASE_URL + "/" + account.id)
+  return await axios.delete(BASE_URL + "/account/" + account.id)
 }

src/data/api/orderApi.ts

@@ -1,5 +1,6 @@
 import axios from "axios"
 import { BasketItemModel } from "../models/ordering/basketItemModel"
+import { OrderApiModel } from "../models/apiEndpoints/orderApiModel"
 
 const BASE_URL = "http://localhost:3000/orders"
 
@@ -25,13 +26,6 @@ export async function createOrder(
     }
   }
 
-  console.log({
-    accountId: accountId,
-    tickets: tickets,
-    paymentId: paymentId,
-    addressId: addressId
-  })
-
   return axios.post(BASE_URL, {
     accountId: accountId,
     tickets: tickets,
@@ -40,6 +34,14 @@ export async function createOrder(
   })
 }
 
-export async function fetchAllOrders() {
+export async function fetchAllOrders(token: string) {
-  return axios.get(BASE_URL)
+  return axios.get(BASE_URL, {
+    headers: {
+      "Authorization": token
+    }
+  })
+}
+
+export async function patchOrder(order: OrderApiModel) {
+  return axios.patch(BASE_URL, order)
 }

src/data/enums/bannerStateEnum.ts

@@ -1,12 +1,14 @@
 export enum BannerStateEnum {
   ////////// System feedback //////////
   
-  // Some error
+  // Unknown error
   ERROR,
 
-  BASKETPRODUCTADDED,
+  // Ticket added to basket
+  BASKETTICKETADDED,
 
-  BASKETPRODUCTREMOVED,
+  // Ticket removed from basket
+  BASKETTICKETREMOVED,
 
 
   ////////// Exercise feedback //////////
@@ -30,6 +32,8 @@ export enum BannerStateEnum {
   EXERCISESOLVED24,
 
   EXERCISESOLVED25,
+  
+  EXERCISESOLVED26,
 
   EXERCISESOLVED31,
 
@@ -63,11 +67,20 @@ export enum BannerStateEnum {
   ACCOUNTREGISTERERROR,
 
   // Status: 409 Conflict
-  ACCOUNTREGISTERUSERNAMEINUSE,
+  ACCOUNTREGISTERUSERNAMEORMAILINUSE,
 
   // Status: 200 OK
   ACCOUNTUPDATESUCCESSFUL,
 
+  // Local check on unvalid username
+  ACCOUNTUSERNAMETOOSHORT,
+
+  // Local check on unvalid password
+  ACCOUNTPASSWORDTOOSHORT,
+
+  // Local check on unvalid mail address
+  ACCOUNTMAILADDRESSUNVALID,
+
   // No status code, runs in local cache
   ACCOUNTLOGOUTSUCCESSFUL,
 

src/data/models/files/filesApiModel.ts

@@ -0,0 +1,13 @@
+export class FilesApiModel {
+  name: string
+  size: number
+  content: string
+  url: string
+  copyright: CopyRightModel = new CopyRightModel()
+}
+
+class CopyRightModel {
+  license: string = ""
+  creator: string = ""
+  url: string = ""
+}

src/layouts/adminDataLayout.vue

@@ -34,7 +34,7 @@ defineProps({
         <outlined-button
           v-if="!hideAddButton"
           prepend-icon="mdi-plus"
-          color="green"
+          color="success"
           :disabled="fetchInProgress"
           @click="onAddClick()"
         >

src/locales/de.json

@@ -154,7 +154,7 @@
     "factoryReset": {
       "factoryReset": "Zurücksetzen auf Werkseinstellungen",
       "dialog": {
-        "title": "Aus Werkseinstellungen zurücksetzen?",
+        "title": "Auf Werkseinstellungen zurücksetzen?",
         "description": "Sollen alle Einstellungen und Daten auf Werkseinstellungen zurückgesetzt werden? Alle Änderungen und Fortschritte gehen verloren!"
       }
     }
@@ -173,7 +173,6 @@
     "exerciseProgressResetSuccessful": "Aufgabenfortschritt erfolgreich zurück gesetzt!",
     "registerSuccessful": "Account erfolgreich erstellt!",
     "registerError": "Fehler beim Erstellen des Accounts",
-    "usernameInUse": "Der Accountname ist bereits vergeben!",
     "accountUpdated": "Account erfolgreich aktualisiert",
     "logoutSuccessful": "Logout erfolgreich",
     "orderPlaceSuccessfull": "Bestellung erfolgreich aufgegeben",
@@ -187,7 +186,11 @@
     "genreDeleteError": "Fehler beim Löschen des Genres",
     "genreDeleteSuccessful": "Genre erfolgreich gelöscht",
     "genreSavedError": "Fehler beim Speichern des Genres",
-    "genreSavedSuccessful": "Genre erfolgreich gespeichert"
+    "genreSavedSuccessful": "Genre erfolgreich gespeichert",
+    "accountPasswordTooShort": "Passwort ist zu kurz",
+    "accountUsernameTooShort": "Username ist zu kurz",
+    "accountMailAddressUnvalid": "Mail-Adresse ungültig",
+    "usernameOrMailInUse": "Der Accountname und/oder die Mail-Adresse sind bereits vergeben!"
   },
   "misc": {
     "404": {
@@ -218,7 +221,7 @@
     "validation": {
       "required": "Darf nicht leer bleiben",
       "noDigitsAllowed": "Zahlen sind nicht erlaubt",
-      "notEnoughChars": "Nicht wenige Zeichen",
+      "notEnoughChars": "Nicht genug Zeichen",
       "tooMuchChars": "Zu viele Zeichen",
       "onlyDigitsAllowed": "Nur Zahlen erlaubt",
       "digitsAtStartNeeded": "Muss mit einer Zahl beginnen"
@@ -236,7 +239,8 @@
       "connectToServer": "Server",
       "database": "Datenbank",
       "exercises": "Aufgaben",
-      "userData": "Persönliche Daten"
+      "userData": "Persönliche Daten",
+      "enterYourPersonalData": "Bitte gebe nun deinen Namen und deine Matrikelnummer von der Universität ein. Überprüfe die Angaben vor dem Absenden genau! Die Angaben können später nicht ohne Verlust des Bearbeitungsfortschrittes geändert werden!"
     },
     "user": "Angaben zur Person",
     "registrationNumber": "Matrikelnummer",
@@ -244,7 +248,14 @@
     "chooseFile": "Datei auswählen",
     "chooseDestinationFolder": "Zielordner auswählen",
     "upload": "Hochladen",
-    "fulfillYourPersonalDataFirst": "Gehe zu den Einstellungen und fülle deinen Namen und deine Matrikelnummer aus"
+    "fulfillYourPersonalDataFirst": "Gehe zu den Einstellungen und fülle deinen Namen und deine Matrikelnummer aus",
+    "testEnvironment": "Testumgebung",
+    "search": {
+      "empty": {
+        "headline": "So leer hier..."
+      },
+      "searchterm": "Suchbegriff"
+    }
   },
   "genre": {
     "withoutBand": "ohne Band"

src/locales/en.json

@@ -173,7 +173,6 @@
     "exerciseProgressResetSuccessful": "Exercise progress successfully resetted!",
     "registerSuccessful": "Account successfully created!",
     "registerError": "Error on register account",
-    "usernameInUse": "The username is already in use!",
     "accountUpdated": "Account successfully updated",
     "logoutSuccessful": "Logout successfull",
     "orderPlaceSuccessfull": "Order successfully placed",
@@ -187,7 +186,11 @@
     "genreDeleteError": "Error on deleting Genre",
     "genreDeleteSuccessful": "Genre successfully deleted",
     "genreSavedError": "Error on saving genre",
-    "genreSavedSuccessful": "Genre successfully saved"
+    "genreSavedSuccessful": "Genre successfully saved",
+    "accountPasswordTooShort": "Password too short",
+    "accountUsernameTooShort": "Username too short",
+    "accountMailAddressUnvalid": "Mail-Address unvalid",
+    "usernameOrMailInUse": "The username and/or the mail address are already in use!"
   },
   "misc": {
     "404": {
@@ -236,7 +239,8 @@
       "connectToServer": "Server",
       "database": "Database",
       "exercises": "Exercises",
-      "userData": "User data"
+      "userData": "User data",
+      "enterYourPersonalData": "Please enter your name and your Matrikel number from your university. Check it twice! You can't change it later without loosing your exercise progress!"
     },
     "user": "About person",
     "registrationNumber": "Matrikel number",
@@ -244,7 +248,14 @@
     "chooseFile": "Choose file",
     "chooseDestinationFolder": "Choose destination folder",
     "upload": "Upload",
-    "fulfillYourPersonalDataFirst": "Go to settings and enter your name and the right register number"
+    "fulfillYourPersonalDataFirst": "Go to settings and enter your name and the right register number",
+    "testEnvironment": "Test Environment",
+    "search": {
+      "empty": {
+        "headline": "So empty here..."
+      },
+      "searchterm": "Search term"
+    }
   },
   "genre": {
     "withoutBand": "without Band"

src/pages/account/accountDataPage/accountManagingCard.vue

@@ -18,7 +18,7 @@ const accountStore = useAccountStore()
       <v-col class="d-flex justify-center align-center">
         <outlined-button
           prepend-icon="mdi-delete"
-          color="red"
+          color="error"
           :loading="accountStore.fetchInProgress"
           @click="showConfirmDialog = true"
         >
@@ -29,7 +29,7 @@ const accountStore = useAccountStore()
       <v-col class="d-flex justify-center align-center">
         <outlined-button
           prepend-icon="mdi-content-save"
-          color="green"
+          color="success"
           :loading="accountStore.fetchInProgress"
           @click="accountStore.updateAccount()"
         >

src/pages/account/accountDataPage/addressesCard.vue

@@ -81,7 +81,7 @@ const accountStore = useAccountStore()
             <v-col class="d-flex justify-center align-center">
               <outlined-button
                 @click="accountStore.removeAddress(address)"
-                color="red"
+                color="error"
                 prepend-icon="mdi-delete"
               >
                 {{ $t('misc.actions.remove') }}
@@ -102,7 +102,7 @@ const accountStore = useAccountStore()
       <outlined-button
         @click="accountStore.userAccount.addresses.push(new AddressModel())"
         prepend-icon="mdi-plus"
-        color="green"
+        color="success"
       >
         {{ $t('misc.actions.add') }}
       </outlined-button>

src/pages/account/accountDataPage/paymentsCard.vue

@@ -17,7 +17,7 @@ const accountStore = useAccountStore()
     <v-row>
       <v-col>
         <card-view-one-line
-          color="amber"
+          color="warning"
           prepend-icon="mdi-alert"
           :title="$t('account.noRealPaymentsNeeded')"
         />
@@ -60,7 +60,7 @@ const accountStore = useAccountStore()
                 <v-col class="d-flex justify-center align-center">
                   <outlined-button
                     @click="accountStore.removePayment(payment)"
-                    color="red"
+                    color="error"
                     prepend-icon="mdi-delete"
                   >
                     {{ $t('misc.actions.remove') }}
@@ -88,7 +88,7 @@ const accountStore = useAccountStore()
       <outlined-button
         @click="accountStore.userAccount.payments.push(new PaymentModel())"
         prepend-icon="mdi-plus"
-        color="green"
+        color="success"
       >
         {{ $t('misc.actions.add') }}
       </outlined-button>

src/pages/account/loginPage/loginForm.vue

@@ -33,6 +33,7 @@ async function startLogin() {
           v-model="accountStore.loginData.username"
           variant="outlined"
           clearable
+          hide-details
           @keyup.enter="startLogin"
           id="txt-username"
         />
@@ -48,6 +49,7 @@ async function startLogin() {
           variant="outlined"
           v-model="accountStore.loginData.password"
           clearable
+          hide-details
           @keyup.enter="startLogin"
           id="txt-password"
         />
@@ -67,7 +69,7 @@ async function startLogin() {
         append-icon="mdi-arrow-right"
         @click="startLogin"
         :loading="accountStore.fetchInProgress"
-        color="green"
+        color="success"
         id="btn-login"
       >
         {{ $t('account.login.login') }}

src/pages/account/loginPage/registerForm.vue

@@ -3,11 +3,9 @@ import cardView from '@/components/basics/cardView.vue';
 import outlinedButton from '@/components/basics/outlinedButton.vue';
 import { useAccountStore } from '@/stores/account.store';
 import { getEmailRules, getPasswordRules, getStringRules } from '@/scripts/validationRules';
-import { useRouter } from 'vue-router';
 
 const showRegisterCard = defineModel("showRegisterCard", { type: Boolean, default: false })
 const accountStore = useAccountStore()
-const router = useRouter()
 
 async function registerAccount() {
   accountStore.registerAccount()
@@ -31,7 +29,6 @@ async function registerAccount() {
           prepend-icon="mdi-account"
           v-model="accountStore.registerData.username"
           clearable
-          hide-details
           variant="outlined"
           :rules="getStringRules()"
         />
@@ -46,7 +43,6 @@ async function registerAccount() {
           type="password"
           v-model="accountStore.registerData.password"
           clearable
-          hide-details
           variant="outlined"
           :rules="getPasswordRules()"
         />
@@ -61,7 +57,6 @@ async function registerAccount() {
           v-model="accountStore.registerData.email"
           :rules="getEmailRules()"
           variant="outlined"
-          hide-details
           clearable
         />
       </v-col>
@@ -80,6 +75,7 @@ async function registerAccount() {
         prepend-icon="mdi-account-plus"
         @click="registerAccount"
         :loading="accountStore.fetchInProgress"
+        color="success"
       >
         {{ $t('account.register') }}
       </outlined-button>

src/pages/admin/bandsAdminPage/bandEditDialog.vue

@@ -93,7 +93,7 @@ function itemProps(item: GenreModel) {
     
     <template #actions>
       <outlined-button
-        color="green"
+        color="success"
         @click="bandStore.saveBand"
         :loading="bandStore.fetchInProgress"
       >

src/pages/admin/filesAdminPage/fileUploadDialog.vue

@@ -53,7 +53,7 @@ const test = ref()
       <outlined-button
         @click="filesStore.uploadFile"
         prepend-icon="mdi-file-upload"
-        color="green"
+        color="success"
         :disabled="filesStore.fileUploadDir.length == 0 || filesStore.fileUpload == undefined"
         :loading="filesStore.fetchInProgress"
       >

src/pages/admin/filesAdminPage/index.vue

@@ -19,6 +19,7 @@ filesStore.getStaticFolders()
     :hide-add-button="true" 
   >
     <v-row >
+      <!-- Column folder -->
       <v-col cols="2" class="border">
         <v-list>
           <v-list-item
@@ -27,10 +28,13 @@ filesStore.getStaticFolders()
             :value="folder"
             :title="folder.name + '/'"
             @click="filesStore.selectedFolder = folder; filesStore.getStaticFiles()"
+            prepend-icon="mdi-folder"
           />
         </v-list>
       </v-col>
 
+
+      <!-- Column files in folder -->
       <v-col cols="4" class="border">
         <v-skeleton-loader
           :loading="filesStore.fetchInProgress"
@@ -41,36 +45,71 @@ filesStore.getStaticFolders()
               v-for="file of filesStore.staticFiles"
               :title="file.name"
               :value="file.name"
-              :subtitle="Math.round(file.size / 1024) + ' KB'"
               @click="() => { filesStore.selectedFile = file }"
-            />
+            >
+              <template #prepend>
+                <v-icon
+                  :icon="file.name.endsWith('js') ? 'mdi-file' : 'mdi-image'"
+                  :color="file.copyright != undefined ? 'grey' : 'red'"
+                />
+              </template>
+            </v-list-item>
           </v-list>
         </v-skeleton-loader>
       </v-col>
 
+
+      <!-- File detail viewer -->
       <v-col class="border">
         <v-row>
-          <v-col>
+          <v-col v-if="filesStore.selectedFile != undefined">
-            {{ filesStore.selectedFile.url }}
-          </v-col>
-        </v-row>
-
-        <v-row>
-          <v-col>
             <v-textarea
-              v-if="filesStore.selectedFile != undefined && filesStore.selectedFile.name.endsWith('html')"
+              v-if="filesStore.selectedFile != undefined && filesStore.selectedFile.name.endsWith('js')"
               :model-value="filesStore.selectedFile.content"
               variant="outlined"
               label="Content"
               height="300"
               rows="30"
             />
+
             <v-img
               v-else-if="filesStore.selectedFile != undefined"
               :src="filesStore.selectedFile.url" max-height="400"
             />
           </v-col>
         </v-row>
+
+        <!-- File details -->
+        <v-row>
+          <v-col v-if="filesStore.selectedFile != undefined">
+            <v-list>
+              <v-list-item prepend-icon="mdi-server">
+                {{ filesStore.selectedFile.url }}
+              </v-list-item>
+
+              <v-list-item prepend-icon="mdi-package">
+                {{ Math.round(filesStore.selectedFile.size / 1024) + ' KB' }}
+              </v-list-item>
+
+              <template v-if="filesStore.selectedFile['copyright'] != undefined">
+                <v-list-item prepend-icon="mdi-copyright">
+                  {{ filesStore.selectedFile.copyright.license }}
+                </v-list-item>
+
+                <v-list-item prepend-icon="mdi-account">
+                  {{ filesStore.selectedFile.copyright.creator }}
+                </v-list-item>
+
+                <v-list-item
+                  prepend-icon="mdi-web"
+                  v-if="filesStore.selectedFile.copyright.url.length > 0"
+                >
+                  <a :href="filesStore.selectedFile.copyright.url" target="_blank" >Quelle</a>
+                </v-list-item>
+              </template>
+            </v-list>
+          </v-col>
+        </v-row>
       </v-col>
     </v-row>
   </admin-data-layout>

src/pages/admin/genresAdminPage/genreEditDialog.vue

@@ -35,7 +35,7 @@ const genreStore = useGenreStore()
 
     <template #actions>
       <outlined-button
-        color="green"
+        color="success"
         @click="genreStore.saveGenre"
         :disabled="!valid"
         :loading="genreStore.fetchInProgress"

src/pages/admin/ordersAdminPage/index.vue

@@ -13,7 +13,7 @@ const headers = [
   { title: "Adresse", value: "street" },
   { title: "Stadt", value: "city" },
   { title: "Versendet", value: "shipped" },
-  { title: "", value: "edit", width: 130 }
+  { title: "Aktionen", value: "edit", width: 130 }
 ]
 
 orderStore.getAllOrders()
@@ -26,6 +26,8 @@ orderStore.getAllOrders()
     <v-data-table
       :headers="headers"
       :items="orderStore.orders"
+      :loading="orderStore.fetchInProgress"
+      :items-per-page="100"
     >
       <template #item.account="{ item }">
         {{ item.account.firstName }} {{ item.account.lastName }}
@@ -46,23 +48,23 @@ orderStore.getAllOrders()
       <template #item.shipped="{ item }">
         <v-icon
           :icon="item.shipped ? 'mdi-check' : 'mdi-close'"
-          :color="item.shipped ? 'green' : 'red'"
+          :color="item.shipped ? 'success' : 'error'"
         />
       </template>
 
       <template #item.edit="{ item }">
-        <!-- todo <v-btn
+        <v-btn
           icon="mdi-eye"
           variant="plain"
           @click="orderStore.openDetails(item)"
-        /> -->
+        />
 
-        <!-- todo <v-btn
+        <v-btn
-          icon="mdi-delete"
+          :icon="item.shipped ? 'mdi-close-circle-outline' : 'mdi-check-circle-outline'"
           variant="plain"
-          color="red"
+          :color="item.shipped ? 'error' : 'success'"
-          @click="orderStore.deleteOrder(item)"
+          @click="orderStore.changeOrderShippedState(item, !item.shipped)"
-        /> -->
+        />
       </template>
 
     </v-data-table>

src/pages/admin/ordersAdminPage/orderDetailDialog.vue

@@ -12,15 +12,67 @@ const orderStore = useOrderStore()
     v-model="orderStore.showDetailDialog"
     :title="$t('order.order')"
     icon="mdi-basket"
+    max-width="800"
   >
     <v-list>
       <v-list-subheader>
-        {{ $t('ticket.ticket', 2) }}
+        {{ $t('account.account') }}
       </v-list-subheader>
 
-      <v-list-item v-for="ticket of orderStore.order.tickets">
+      <v-list-item prepend-icon="mdi-account">
-        {{ moment(ticket.concert.date).format("DD.MM.YYYY") }} - 
+        {{ orderStore.order.account.username }}
-        {{ ticket.concert.band.name }} - {{ ticket.concert.name }}
+      </v-list-item>
+
+      <v-list-item prepend-icon="mdi-card-account-details">
+        {{ orderStore.order.account.firstName }} {{ orderStore.order.account.lastName }}
+      </v-list-item>
+
+      <v-list-item prepend-icon="mdi-home">
+        {{ orderStore.order.address.street }} {{ orderStore.order.address.houseNumber }}
+      </v-list-item>
+
+      <v-list-item prepend-icon="mdi-city">
+        {{ orderStore.order.address.postalCode }} {{ orderStore.order.address.city }}
+      </v-list-item>
+
+      <v-list-subheader>
+        {{ $t('order.order') }}
+      </v-list-subheader>
+
+      <v-list-item prepend-icon="mdi-calendar">
+        {{ moment(orderStore.order.orderedAt).format("DD.MM.YYYY, HH:mm:ss") }}
+      </v-list-item>
+
+      <v-list-item prepend-icon="mdi-truck">
+        {{ orderStore.order.shipped ? 'Versendet' : 'Nicht versendet' }}
+      </v-list-item>
+
+      <v-list-item>
+        <v-table>
+          <thead>
+            <tr>
+              <th>{{ $t('concert.date') }}</th>
+              <th>{{ $t('concert.name') }}</th>
+              <th>{{ $t('band.name') }}</th>
+              <th>{{ $t('location.name') }}</th>
+              <th>{{ $t('location.seat.seatGroup') }}</th>
+              <th>{{ $t('location.seat.seatRow') }}</th>
+              <th>{{ $t('location.seat.seat') }}</th>
+            </tr>
+          </thead>
+
+          <tbody>
+            <tr v-for="ticket of orderStore.order.tickets">
+              <td>{{ moment(ticket.concert.date).format("DD.MM.YYYY") }}</td>
+              <td>{{ ticket.concert.name }}</td>
+              <td>{{ ticket.concert.band.name }}</td>
+              <td>{{ ticket.concert.location.name }}</td>
+              <td>{{ ticket.seat.seatRow.seatGroup.name }}</td>
+              <td>{{ ticket.seat.seatRow.row }}</td>
+              <td>{{ ticket.seat.seatNr }}</td>
+            </tr>
+          </tbody>
+        </v-table>
       </v-list-item>
     </v-list>
   </action-dialog>

src/pages/bands/bandDetailPage/ratingSection.vue

@@ -46,8 +46,10 @@ defineProps({
     </v-col>
 
     <v-col>
-      <v-list>
+      <v-list style="background-color: transparent;">
-        <v-list-item v-for="ratingValue in ratings">
+        <v-list-item
+          v-for="ratingValue in ratings"
+        >
           <template v-slot:prepend>
             <span>{{ ratingValue.value }}</span>
             <v-icon class="ml-3 mr-n3" icon="mdi-star" />

src/pages/concerts/concertBookingPage/index.vue

@@ -94,7 +94,7 @@ watch(() => router.currentRoute.value.params.date, () => {
 
         <v-row>
           <v-col>
-            <v-list >
+            <v-list style="background-color: transparent;">
               <v-list-item v-for="seat in basketStore.selectedSeats" >
                 <ticket-list-item
                   :concert="concertStore.concert"

src/pages/misc/basketPage/index.vue

@@ -18,7 +18,6 @@ const showOrderingDialog = ref()
       <v-col>
         <v-alert
           color="info"
-          closable
         >
           {{ $t('account.login.pleaseLoginToOrder') }}
         </v-alert>
@@ -53,7 +52,7 @@ const showOrderingDialog = ref()
               prepend-icon="mdi-basket-check"
               :disabled="basketStore.itemsInBasket.length == 0 || accountStore.userAccount.id == null"
               variant="outlined"
-              color="green"
+              color="success"
               @click="showOrderingDialog = true"
             >
               {{ $t('order.takeOrder') }}

src/pages/misc/basketPage/orderingDialog.vue

@@ -100,7 +100,7 @@ function paymentItemProps(item: PaymentModel) {
         @click="doOrder"
         :loading="orderingInProgress"
         prepend-icon="mdi-send"
-        color="green"
+        color="success"
       >
         {{ $t('order.takeOrder') }}
       </outlined-button>

src/pages/misc/basketPage/ticketsTable.vue

@@ -2,6 +2,7 @@
 import { useBasketStore } from '@/stores/basket.store';
 import { BasketItemModel } from '@/data/models/ordering/basketItemModel';
 import { calcPrice } from '@/scripts/concertScripts';
+import moment from 'moment';
 
 const basketStore = useBasketStore()
 
@@ -11,9 +12,10 @@ function removeFromBasket(basketItem: BasketItemModel) {
 </script>
 
 <template>
-  <v-table>
+  <v-table style="background-color: transparent;">
     <thead>
       <tr>
+        <th>{{ $t('concert.date') }}</th>
         <th>{{ $t('band.band') }}</th>
         <th>{{ $t('concert.concert') }}</th>
         <th class="text-center">{{ $t('misc.quantity') }}</th>
@@ -25,6 +27,11 @@ function removeFromBasket(basketItem: BasketItemModel) {
 
     <tbody>
       <tr v-for="basketItem in basketStore.itemsInBasket">
+        <!-- Concert date -->
+        <td>
+          {{ moment(basketItem.concert.date).format("DD.MM.YYYY") }}
+        </td>
+
         <!-- Band name -->
         <td>
           {{ basketItem.band.name }}
@@ -43,7 +50,7 @@ function removeFromBasket(basketItem: BasketItemModel) {
         <!-- Price per event -->
         <td class="text-right">
           <div v-if="basketItem.seats">
-            {{ basketItem.price }} €
+            {{ basketItem.price.toFixed(2) }} €
           </div>
         </td>
 
@@ -56,7 +63,7 @@ function removeFromBasket(basketItem: BasketItemModel) {
           <v-btn
             icon="mdi-delete"
             @click="removeFromBasket(basketItem)"
-            color="red"
+            color="error"
             variant="text"
             flat
           />

src/pages/misc/helpPage/index.vue

@@ -19,6 +19,25 @@ function getDotColor(exerciseGroupNr: number) {
     case 3: return "pink"
   }
 }
+
+function checksum(num: number) {
+  let cs = 0
+
+  for (; num > 0; num = Math.trunc(num / 10)) {
+      cs += num % 10;
+  }
+
+  return cs
+}
+
+function generateExerciseKey(exerciseGroup: number, exerciseNr: number) {
+  try {
+    let matrikelNr = Number(preferencesStore.registrationNumber)
+    let a = matrikelNr + exerciseGroup * 100 + exerciseNr * 12345678 + 
+      checksum(Number(preferencesStore.registrationNumber)) * 123
+    return a.toString(16).toUpperCase()
+  } catch(e) {}
+}
 </script>
 
 <template>
@@ -97,6 +116,9 @@ function getDotColor(exerciseGroupNr: number) {
                     :color="exercise.solved ? 'green' : 'primary'"
                   >
                     {{ preferencesStore.language == LanguageEnum.GERMAN ? exercise.descriptionDe : exercise.descriptionEn }}
+                    <div class="pt-2 text-h6">
+                      Solution Code: 0x{{ generateExerciseKey(exercise.exerciseGroup.groupNr, exercise.exerciseNr) }}
+                    </div>
                   </card-view>
                 </v-timeline-item>
               </template>

src/pages/misc/homePage/welcomeDialog.vue

@@ -63,7 +63,7 @@ watch(() => currentStep.value, () => {
               :title="step"
               :value="n + 1"
               complete-icon="mdi-check"
-              color="green"
+              color="success"
             />
 
             <v-divider v-if="n < steps.length - 1" />
@@ -73,6 +73,7 @@ watch(() => currentStep.value, () => {
 
         <!-- Content -->
         <v-stepper-window>
+          <!-- Step 1: Check connection to backend server -->
           <v-stepper-window-item
             :value="1"
             class="text-h4 text-center"
@@ -84,6 +85,7 @@ watch(() => currentStep.value, () => {
             <server-state-text />
           </v-stepper-window-item>
 
+          <!-- Step 2: Reset the database -->
           <v-stepper-window-item
             :value="2"
           >
@@ -100,7 +102,7 @@ watch(() => currentStep.value, () => {
             </div>
           </v-stepper-window-item>
 
-
+          <!-- Step 3: Create exercises -->
           <v-stepper-window-item
             :value="3"
           >
@@ -117,11 +119,18 @@ watch(() => currentStep.value, () => {
             </div>
           </v-stepper-window-item>
 
-
+          <!-- Step 4: Personal data -->
           <v-stepper-window-item
             :value="4"
           >
             <v-container class="px-0 py-2">
+              <v-row>
+                <v-col>
+                  <v-alert color="warning" icon="mdi-alert">
+                    {{ $t('misc.firstStartup.enterYourPersonalData') }}
+                  </v-alert>
+                </v-col>
+              </v-row>
               <v-row>
                 <v-col>
                   <v-text-field
@@ -171,7 +180,7 @@ watch(() => currentStep.value, () => {
               :disabled="preferencesStore.studentName.length == 0 || 
                 preferencesStore.registrationNumber.length == 0"
               prepend-icon="mdi-check"
-              color="green"
+              color="success"
             >
               {{ $t('misc.firstStartup.complete') }}
             </outlined-button>

src/pages/misc/imageLicensePage/index.vue

@@ -0,0 +1,12 @@
+<script setup lang="ts">
+import { useFilesStore } from '@/stores/files.store';
+
+
+const filesStore = useFilesStore()
+
+filesStore.getStaticFiles()
+</script>
+
+<template>
+  <v-img v-for="image of filesStore.staticFiles" :src="image.url"/>
+</template>

src/pages/misc/preferencesPage/index.vue

@@ -2,7 +2,6 @@
 import pageSetup from './pageSetupSection.vue';
 import systemSetup from './systemSetupSection.vue';
 import aboutSection from './aboutSection.vue';
-import userSection from './userSection.vue';
 </script>
 
 <template>
@@ -13,12 +12,6 @@ import userSection from './userSection.vue';
       </v-col>
     </v-row>
 
-    <v-row>
-      <v-col>
-        <user-section />
-      </v-col>
-    </v-row>
-
     <v-row>
       <v-col>
         <system-setup />

src/pages/misc/preferencesPage/systemSetupSection.vue

@@ -28,7 +28,7 @@ preferenceStore.getServerState()
           <outlined-button
             @click="preferenceStore.showDeleteDbDialog = true"
             prepend-icon="mdi-database-refresh"
-            color="red"
+            color="warning"
             :disabled="preferenceStore.serverState != ServerStateEnum.ONLINE || preferenceStore.fetchInProgress"
           >
             {{ $t('preferences.resetDatabase.resetDatabase') }}
@@ -39,7 +39,7 @@ preferenceStore.getServerState()
           <outlined-button
             @click="preferenceStore.showDeleteExerciseDialog = true"
             prepend-icon="mdi-progress-close"
-            color="red"
+            color="warning"
             :disabled="preferenceStore.serverState != ServerStateEnum.ONLINE || preferenceStore.fetchInProgress"
           >
             {{ $t('preferences.resetExerciseProgress.resetExerciseProgress') }}
@@ -50,7 +50,7 @@ preferenceStore.getServerState()
           <outlined-button
             @click="preferenceStore.showFactoryResetDialog = true"
             prepend-icon="mdi-factory"
-            color="red"
+            color="warning"
             :disabled="preferenceStore.serverState != ServerStateEnum.ONLINE || preferenceStore.fetchInProgress"
           >
             {{ $t('preferences.factoryReset.factoryReset') }}
@@ -67,6 +67,7 @@ preferenceStore.getServerState()
     v-model="preferenceStore.showDeleteDbDialog"
     :onConfirm="preferenceStore.resetDb"
     :loading="preferenceStore.fetchInProgress"
+    icon="mdi-database-refresh"
   />
 
   <!-- Confirm delete exercise progress -->
@@ -76,12 +77,14 @@ preferenceStore.getServerState()
     v-model="preferenceStore.showDeleteExerciseDialog"
     :onConfirm="preferenceStore.resetExerciseProg"
     :loading="preferenceStore.fetchInProgress"
+    icon="mdi-progress-close"
   />
 
   <confirm-dialog
     :title="$t('preferences.factoryReset.dialog.title')"
     :description="$t('preferences.factoryReset.dialog.description')"
     v-model="preferenceStore.showFactoryResetDialog"
+    icon="mdi-factory"
     :onConfirm="() => {
       preferenceStore.resetToFactorySettings()
       router.push('/')

src/pages/misc/preferencesPage/userSection.vue

@@ -1,32 +0,0 @@
-<script setup lang="ts">
-import cardView from '@/components/basics/cardView.vue';
-import { usePreferencesStore } from '@/stores/preferences.store';
-
-const preferencesStore = usePreferencesStore()
-</script>
-
-<template>
-  <card-view icon="mdi-account-school" :title="$t('misc.user')">
-    <v-row>
-      <v-col>
-        <v-text-field
-          variant="outlined"
-          hide-details
-          :label="$t('misc.yourFullName')"
-          v-model="preferencesStore.studentName"
-        />
-      </v-col>
-    </v-row>
-
-    <v-row>
-      <v-col>
-        <v-text-field
-          variant="outlined"
-          hide-details
-          :label="$t('misc.registrationNumber')"
-          v-model="preferencesStore.registrationNumber"
-        />
-      </v-col>
-    </v-row>
-  </card-view>
-</template>

src/pages/misc/searchPage/index.vue

@@ -23,7 +23,17 @@ const searchStore = useSearchStore()
           </v-col>
         </v-row>
 
-        <div v-if="searchStore.alreadySearched">
+        <v-row v-if="!searchStore.alreadySearched">
+          <v-col>
+            <v-empty-state
+              icon="mdi-magnify"
+              :headline="$t('misc.search.empty.headline')"
+              :title="$t('misc.enterSomeKeywords')"
+            />
+          </v-col>
+        </v-row>
+
+        <div v-else>
           <v-row>
             <v-col>
               <section-divider :title="$t('band.band', 2)" />
@@ -41,7 +51,8 @@ const searchStore = useSearchStore()
 
           <v-row 
             v-else-if="searchStore.bands.length > 0"
-            v-for="band in searchStore.bands">
+            v-for="band in searchStore.bands"
+          >
             <v-col>
               <band-list-item
                 :band="band"

src/pages/misc/searchPage/searchBar.vue

@@ -11,7 +11,7 @@ const searchStore = useSearchStore()
       variant="outlined"
       hide-details
       v-model="searchStore.searchTerm"
-      :placeholder="$t('misc.enterSomeKeywords')"
+      :label="$t('misc.search.searchterm')"
       @keyup.enter="searchStore.startSearch"
     >
       <template #append-inner>

src/plugins/vuetify.ts

@@ -18,7 +18,11 @@ const vuetify = createVuetify({
         colors: {
           primary: colors.blue.darken4,
           secondary: colors.yellow.darken3,
-          sheet: colors.grey.darken4
+          sheet: colors.grey.darken4,
+          warning: colors.amber.darken3,
+          success: colors.green.darken2,
+          error: colors.red.darken2,
+          exerciseSolved: colors.purple.darken2
         }
       },
       light: {
@@ -26,7 +30,11 @@ const vuetify = createVuetify({
         colors: {
           primary: colors.blue.darken4,
           secondary: colors.yellow.darken3,
-          sheet: colors.grey.lighten3
+          sheet: colors.grey.lighten4,
+          warning: colors.amber.darken4,
+          success: colors.green.darken2,
+          error: colors.red.darken4,
+          exerciseSolved: colors.purple.darken2
         }
       },
     }

src/router/routes.ts

@@ -15,6 +15,7 @@ import LoginPage from "@/pages/account/loginPage/index.vue"
 import PreferencesPage from "@/pages/misc/preferencesPage/index.vue";
 import HelpPage from "@/pages/misc/helpPage/index.vue"
 import ErrorPage from "@/pages/misc/errorPage/index.vue"
+import ImageLicensePage from "@/pages/misc/imageLicensePage/index.vue"
 
 const routes = [
   // Main page
@@ -52,6 +53,7 @@ const routes = [
   { path: '/basket', component: BasketPage },
   { path: '/preferences', component: PreferencesPage },
   { path: '/help', component: HelpPage },
+  { path: '/license', component: ImageLicensePage },
 
   // Error Page
   { path: "/404", component: ErrorPage }

src/scripts/concertScripts.ts

@@ -53,9 +53,12 @@ export function createDateRangeString(concerts: Array<ConcertModel>) {
 export function lowestTicketPrice(concerts: Array<ConcertModel>): string {
   const priceArray : Array<number> = []
 
-  for (let concert of concerts) {
+  try {
-    priceArray.push(concert.price)
+    for (let concert of concerts) {
-  }
+      priceArray.push(concert.price)
+    }
+  } catch (e) {}
+
 
   priceArray.sort()
 

src/scripts/imageScripts.ts

@@ -0,0 +1,14 @@
+import { load } from "exifreader"
+
+export async function loadLicense(url: string){
+  let result = ""
+
+  try {
+    await load(url)
+      .then(tags => {
+        result = tags["Copyright"]["description"] + " by " + tags["Artist"]["description"]
+      })
+  } catch {}
+
+  return result
+}

src/stores/account.store.ts

@@ -1,7 +1,7 @@
 import { useLocalStorage } from "@vueuse/core";
 import { AccountModel } from "../data/models/user/accountModel";
 import { useFeedbackStore } from "./feedback.store";
-import { deleteAccount, fetchAllAccounts, getAccount, login, registerAccount, updateAccount } from "../data/api/accountApi";
+import { deleteAccount, fetchAllAccounts, getAccount, getLogin, registerAccount, updateAccount } from "../data/api/accountApi";
 import { fetchUserOrders } from "../data/api/orderApi";
 import { BannerStateEnum } from "../data/enums/bannerStateEnum";
 import { AddressModel } from "../data/models/user/addressModel";
@@ -16,9 +16,10 @@ export const useAccountStore = defineStore("accountStore", {
     /** All accounts */
     accounts: ref<Array<AccountApiModel>>([]),
 
-    /** Useraccount which is currently logged in */
+    /** Server token of currently logged in account */
     userAccountToken: useLocalStorage("hackmycart/accountStore/userAccountToken", ""),
 
+    /** Useraccount which is currently logged in */
     userAccount: useLocalStorage("hackmycart/accountStore/userAccount", new AccountApiModel()),
 
     /** User input on login screen */
@@ -32,20 +33,28 @@ export const useAccountStore = defineStore("accountStore", {
     /** Request to server sent, waiting for data response */
     fetchInProgress: ref(false),
 
+    /** Flag to show or hide admin icon in navigation bar */
     adminPanelVisible: ref(false),
 
+    /** Flag to activate buy option on basket page */
     privilegeBuy: ref(false)
   }),
 
   actions: {
+    /**
+     * Fetch all accounts on the database
+     */
     async getAllAccounts() {
       this.fetchInProgress = true
 
-      fetchAllAccounts()
+      fetchAllAccounts(this.userAccountToken)
         .then(response => {
           this.accounts = response.data
           this.fetchInProgress = false
         })
+        .catch(onrejected => {
+          this.fetchInProgress = false
+        })
     },
 
     /**
@@ -68,7 +77,7 @@ export const useAccountStore = defineStore("accountStore", {
       }
       else
       {
-        await login(this.loginData.username, this.loginData.password)
+        await getLogin(this.loginData.username, this.loginData.password)
           .then(async result => {
             this.userAccountToken = result.data.token
 
@@ -82,8 +91,8 @@ export const useAccountStore = defineStore("accountStore", {
                 this.privilegeBuy = true
                 this.adminPanelVisible = response.data.accountRole.privilegeAdminPanel
 
-                if (response.data.accountRoleId == 3) {
+                if (response.data.accountRoleId == 2) {
-                  exerciseStore.solveExercise(2, 4)
+                  exerciseStore.solveExercise(2, 5)
                 }
               })
           })
@@ -100,6 +109,21 @@ export const useAccountStore = defineStore("accountStore", {
       }
     },
 
+    /**
+     * Reload account information about current logged in user
+     */
+    async refreshAccount() {
+      getAccount(this.userAccountToken)
+        .then(response => {
+          this.userAccount = response.data
+
+          this.fetchInProgress = false
+
+          this.privilegeBuy = true
+          this.adminPanelVisible = response.data.accountRole.privilegeAdminPanel
+        })
+    },
+
     /**
      * Register a new account to the database
      * Log in on success
@@ -111,32 +135,42 @@ export const useAccountStore = defineStore("accountStore", {
       const exerciseStore = useExerciseStore()
       this.fetchInProgress = true
 
-      await registerAccount(this.registerData)
+      if (this.registerData.username == null || this.registerData.username.length < 4) {
-        .then(async res => {
+        feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTUSERNAMETOOSHORT)
-          if (res.status == 201) {
+      } else if (this.registerData.password == null || this.registerData.password.length < 8) {
-            feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL)
+        feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTPASSWORDTOOSHORT)
-            exerciseStore.solveExercise(0, 1)
+      } else if (!this.registerData.email.match(/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|.(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/)) {
-          }
+        feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTMAILADDRESSUNVALID)
+      }
+      else {
+        await registerAccount(this.registerData)
+          .then(async res => {
+            if (res.status == 201) {
+              feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL)
+              exerciseStore.solveExercise(0, 1)
+            }
 
-          this.loginData = {
+            this.loginData = {
-            username: this.registerData.username,
+              username: this.registerData.username,
-            password: this.registerData.password
+              password: this.registerData.password
-          }
+            }
 
-          this.fetchInProgress = false
+            this.fetchInProgress = false
-        })
+          })
-        .catch((error) => {
+          .catch((error) => {
-          if (error.status == 400) {
+            if (error.status == 400) {
-            feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERERROR)
+              feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERERROR)
-          } else if (error.status == 409) {
+            } else if (error.status == 409) {
-            feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE)
+              feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERUSERNAMEORMAILINUSE)
-          }
+            }
 
-          this.fetchInProgress = false
+            this.fetchInProgress = false
-          return false
+            return false
-        })
+          })
+      }
 
-        return false
+      this.fetchInProgress = false
+      return false
     },
 
     /**
@@ -217,6 +251,11 @@ export const useAccountStore = defineStore("accountStore", {
       )
     },
 
+    /**
+     * Delete user account
+     * 
+     * @param account Account which should be deleted
+     */
     async deleteAccount(account: AccountModel) {
       this.fetchInProgress = true
 

src/stores/basket.store.ts

@@ -19,10 +19,10 @@ export const useBasketStore = defineStore('basketStore', {
     itemsInBasket: useLocalStorage<Array<BasketItemModel>>("hackmycart/basketStore/itemsInBasket", []),
 
     /** Address used in the order dialog */
-    usedAddress: ref(new AddressModel()),
+    usedAddress: ref<AddressModel>(null),
 
     /** Payment method used in the order dialog */
-    usedPayment: ref(new PaymentModel()),
+    usedPayment: ref<PaymentModel>(null),
 
     /** Selected seats in the booking page */
     selectedSeats: ref<Array<SelectedSeatModel>>([])
@@ -53,7 +53,7 @@ export const useBasketStore = defineStore('basketStore', {
      */
     removeItemFromBasket(item: BasketItemModel) {
       const feedbackStore = useFeedbackStore()
-      feedbackStore.addSnackbar(BannerStateEnum.BASKETPRODUCTREMOVED)
+      feedbackStore.addSnackbar(BannerStateEnum.BASKETTICKETREMOVED)
 
       this.itemsInBasket = this.itemsInBasket.filter((basketItemModel: BasketItemModel) => 
         basketItemModel.concert.id != item.concert.id
@@ -119,7 +119,6 @@ export const useBasketStore = defineStore('basketStore', {
             for (let item of this.itemsInBasket) {
               if (!item.concert.offered) {
                 exerciseStore.solveExercise(1, 2)
-                feedbackStore.addSnackbar(BannerStateEnum.EXERCISESOLVED12)
               }
             }
             

src/stores/exercise.store.ts

@@ -93,6 +93,7 @@ export const useExerciseStore = defineStore("exerciseStore", {
                   case 3: bannerState = BannerStateEnum.EXERCISESOLVED23; break;
                   case 4: bannerState = BannerStateEnum.EXERCISESOLVED24; break;
                   case 5: bannerState = BannerStateEnum.EXERCISESOLVED25; break;
+                  case 6: bannerState = BannerStateEnum.EXERCISESOLVED26; break;
                 }
 
                 break;

src/stores/feedback.store.ts

@@ -46,10 +46,10 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.ERROR:
           return this.i18n.t('bannerMessages.error')
 
-        case BannerStateEnum.BASKETPRODUCTADDED:
+        case BannerStateEnum.BASKETTICKETADDED:
           return this.i18n.t('bannerMessages.basketTicketAdded')
 
-        case BannerStateEnum.BASKETPRODUCTREMOVED:
+        case BannerStateEnum.BASKETTICKETREMOVED:
           return this.i18n.t("bannerMessages.basketTicketRemoved")
 
 
@@ -90,6 +90,9 @@ export const useFeedbackStore = defineStore("feedbackStore", {
 
         case BannerStateEnum.EXERCISESOLVED25: 
           return this.i18n.t("bannerMessages.exerciseSolvedNr", [2, 5])
+
+        case BannerStateEnum.EXERCISESOLVED26:
+          return this.i18n.t('bannerMessages.exerciseSolvedNr', [2, 6])
         
 
         case BannerStateEnum.EXERCISESOLVED31: 
@@ -127,8 +130,8 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.ACCOUNTREGISTERERROR:
           return this.i18n.t("bannerMessages.registerSuccessful")
 
-        case BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE: 
+        case BannerStateEnum.ACCOUNTREGISTERUSERNAMEORMAILINUSE: 
-          return this.i18n.t("bannerMessages.usernameInUse")
+          return this.i18n.t("bannerMessages.usernameOrMailInUse")
 
         case BannerStateEnum.ACCOUNTUPDATESUCCESSFUL: 
           return this.i18n.t("bannerMessages.accountUpdated")
@@ -136,6 +139,15 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.ACCOUNTLOGOUTSUCCESSFUL: 
           return this.i18n.t('bannerMessages.logoutSuccessful')
         
+        case BannerStateEnum.ACCOUNTPASSWORDTOOSHORT:
+          return this.i18n.t('bannerMessages.accountPasswordTooShort')
+
+        case BannerStateEnum.ACCOUNTUSERNAMETOOSHORT:
+          return this.i18n.t('bannerMessages.accountUsernameTooShort')
+
+        case BannerStateEnum.ACCOUNTMAILADDRESSUNVALID:
+          return this.i18n.t('bannerMessages.accountMailAddressUnvalid')
+        
 
         ////////// API Endpoint /orders //////////
 
@@ -180,14 +192,17 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.ACCOUNTLOGINERROR:
         case BannerStateEnum.ACCOUNTLOGINWRONGLOGIN:
         case BannerStateEnum.ACCOUNTREGISTERERROR:
-        case BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE:
+        case BannerStateEnum.ACCOUNTREGISTERUSERNAMEORMAILINUSE:
+        case BannerStateEnum.ACCOUNTPASSWORDTOOSHORT:
+        case BannerStateEnum.ACCOUNTUSERNAMETOOSHORT:
+        case BannerStateEnum.ACCOUNTMAILADDRESSUNVALID:
         case BannerStateEnum.BANDDELETEERROR:
         case BannerStateEnum.BANDSAVEDERROR:
         case BannerStateEnum.GENREDELETEERROR:
         case BannerStateEnum.GENRESAVEDERROR:
-          return "red"
+          return "warning"
         
-        case BannerStateEnum.BASKETPRODUCTADDED:
+        case BannerStateEnum.BASKETTICKETADDED:
         case BannerStateEnum.DATABASERESETSUCCESSFUL:
         case BannerStateEnum.ACCOUNTLOGINSUCCESSFUL:
         case BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL:
@@ -199,7 +214,8 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.EXERCISEPROGRESSRESETSUCCESSFUL:
         case BannerStateEnum.GENREDELETESUCCESSFUL:
         case BannerStateEnum.GENRESAVEDSUCCESSFUL:
-          return "green"
+        case BannerStateEnum.BASKETTICKETREMOVED:
+          return "success"
 
         case BannerStateEnum.EXERCISESOLVED01:
         case BannerStateEnum.EXERCISESOLVED02:
@@ -211,12 +227,10 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.EXERCISESOLVED23:
         case BannerStateEnum.EXERCISESOLVED24:
         case BannerStateEnum.EXERCISESOLVED25:
+        case BannerStateEnum.EXERCISESOLVED26:
         case BannerStateEnum.EXERCISESOLVED31:
         case BannerStateEnum.EXERCISESOLVED32:
-          return "purple"
+          return "exerciseSolved"
-
-        case BannerStateEnum.BASKETPRODUCTREMOVED:
-          return "blue"
       }
     },
 
@@ -229,7 +243,10 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.ACCOUNTLOGINERROR:
         case BannerStateEnum.ACCOUNTLOGINWRONGLOGIN:
         case BannerStateEnum.ACCOUNTREGISTERERROR:
-        case BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE:
+        case BannerStateEnum.ACCOUNTPASSWORDTOOSHORT:
+        case BannerStateEnum.ACCOUNTUSERNAMETOOSHORT:
+        case BannerStateEnum.ACCOUNTMAILADDRESSUNVALID:
+        case BannerStateEnum.ACCOUNTREGISTERUSERNAMEORMAILINUSE:
           return "mdi-account"
 
         case BannerStateEnum.EXERCISESOLVED01:
@@ -242,6 +259,7 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.EXERCISESOLVED23:
         case BannerStateEnum.EXERCISESOLVED24:
         case BannerStateEnum.EXERCISESOLVED25:
+        case BannerStateEnum.EXERCISESOLVED26:
         case BannerStateEnum.EXERCISESOLVED31:
         case BannerStateEnum.EXERCISESOLVED32:
           return "mdi-check-circle-outline"
@@ -250,8 +268,8 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.EXERCISEPROGRESSRESETSUCCESSFUL:
           return "mdi-database-refresh"
         
-        case BannerStateEnum.BASKETPRODUCTADDED:
+        case BannerStateEnum.BASKETTICKETADDED:
-        case BannerStateEnum.BASKETPRODUCTREMOVED:
+        case BannerStateEnum.BASKETTICKETREMOVED:
           return "mdi-basket"
 
         case BannerStateEnum.ORDERPLACESUCCESSFUL:

src/stores/files.store.ts

@@ -1,4 +1,5 @@
 import { fetchFileNames, fetchFolderNames, postFile } from "@/data/api/files.api";
+import { FilesApiModel } from "@/data/models/files/filesApiModel";
 import { defineStore } from "pinia";
 import { ref } from "vue";
 
@@ -7,14 +8,17 @@ export const useFilesStore = defineStore('filesStore', {
     /** Request to server sent, waiting for data response */
     fetchInProgress: ref(false),
 
+    /** List of all folders on the server */
     staticFolders: ref<Array<{name: string, nrOfItems: number}>>([]),
 
+    /** Current selected folder in file browsre */
     selectedFolder: ref<{name: string, nrOfItems: number}>(),
 
     /** List of files on the server */
-    staticFiles: ref<Array<{name: string, size: number, content: string, url: string}>>([]),
+    staticFiles: ref<Array<FilesApiModel>>([]),
 
-    selectedFile: ref<{name: string, size: number, content: string, url: string}>(),
+    /** Current selected file in file browser */
+    selectedFile: ref<FilesApiModel>(),
 
     showFileUploadDialog: ref(false),
 
@@ -24,6 +28,9 @@ export const useFilesStore = defineStore('filesStore', {
   }),
 
   actions: {
+    /**
+     * Fetch all static folders on the server
+     */
     async getStaticFolders() {
       this.fetchInProgress = true
 
@@ -35,7 +42,7 @@ export const useFilesStore = defineStore('filesStore', {
     },
 
     /**
-     * Request all available static files on server
+     * Request static files on server by selected folder
      */
     async getStaticFiles() {
       this.fetchInProgress = true
@@ -47,6 +54,7 @@ export const useFilesStore = defineStore('filesStore', {
         })
     },
 
+
     async uploadFile() {
       this.fetchInProgress = true
 

src/stores/location.store.ts

@@ -6,6 +6,7 @@ import { CityModel } from "../data/models/locations/cityModel";
 import { fetchAllCities } from "../data/api/cityApi";
 import { LocationDetailsApiModel } from "@/data/models/locations/locationDetailsApiModel";
 import { useFeedbackStore } from "./feedback.store";
+import { getData, getTag } from "exif-js";
 
 export const useLocationStore = defineStore("locationStore", {
   state: () => ({

src/stores/order.store.ts

@@ -1,16 +1,19 @@
-import { fetchAllOrders, fetchUserOrders } from "@/data/api/orderApi";
+import { fetchAllOrders, fetchUserOrders, patchOrder } from "@/data/api/orderApi";
 import { OrderApiModel } from "@/data/models/apiEndpoints/orderApiModel";
 import { AccountModel } from "@/data/models/user/accountModel";
 import { defineStore } from "pinia";
 import { ref } from "vue";
+import { useAccountStore } from "./account.store";
 
 export const useOrderStore = defineStore("orderStore", {
   state: () => ({
     /** All orders of one/all users */
     orders: ref<Array<OrderApiModel>>([]),
 
+    /** Current selected order */
     order: ref<OrderApiModel>(new OrderApiModel),
 
+    /** Show detail dialog on admin page */
     showDetailDialog: ref<boolean>(false),
 
     /** Request to server sent, waiting for data response */
@@ -22,9 +25,10 @@ export const useOrderStore = defineStore("orderStore", {
      * Get all orders from all accounts from server
      */
     async getAllOrders() {
+      const accountStore = useAccountStore()
       this.fetchInProgress = true
 
-      fetchAllOrders()
+      fetchAllOrders(accountStore.userAccountToken)
         .then(res => {
           this.orders = res.data
           this.fetchInProgress = false
@@ -46,13 +50,31 @@ export const useOrderStore = defineStore("orderStore", {
         })
     },
 
+    /**
+     * Open detail dialog
+     * 
+     * @param order Order to view
+     */
     openDetails(order: OrderApiModel) {
       this.order = order
       this.showDetailDialog = true
     },
 
-    async deleteOrder(order: OrderApiModel) {
+
-      // todo
+    /**
+     * 
+     * @param order 
+     * @param shipped 
+     */
+    async changeOrderShippedState(order: OrderApiModel, shipped: boolean) {
+      this.fetchInProgress = true
+
+      order.shipped = shipped
+
+      patchOrder(order)
+        .then(res => {
+          this.getAllOrders()
+        })
     }
   }
 })

src/stores/search.store.ts

@@ -5,17 +5,21 @@ import { fetchLocationsBySearchTerm } from "../data/api/locationApi";
 import { fetchConcertsBySearchTerm } from "../data/api/concertApi";
 import { ConcertApiModel } from "@/data/models/acts/concertApiModel";
 import { useExerciseStore } from "./exercise.store";
+import { BandApiModel } from "@/data/models/acts/bandApiModel";
+import { useBandStore } from "./band.store";
+import { useAccountStore } from "./account.store";
+import { LocationDetailsApiModel } from "@/data/models/locations/locationDetailsApiModel";
 
 export const useSearchStore = defineStore("searchStore", {
   state: () => ({
     /** Search term */
-    searchTerm: ref(""),
+    searchTerm: ref<string>(""),
 
     /** Band results */
-    bands: ref(),
+    bands: ref<Array<BandApiModel>>([]),
 
     /** Location results */
-    locations: ref(),
+    locations: ref<Array<LocationDetailsApiModel>>([]),
 
     /** Concert results */
     concerts: ref<Array<ConcertApiModel>>([]),
@@ -37,28 +41,74 @@ export const useSearchStore = defineStore("searchStore", {
       this.alreadySearched = true
       this.fetchInProgress = true
 
-      // Exercise solutions
+      /**
-      // todo: Rewrite to avoid easy exercise solution
+       * Fetch all bands by this.searchTerm
-      if (this.searchTerm.endsWith("'); SELECT * FROM Accounts; --")) {
+       */
-        exerciseStore.solveExercise(2, 1)
-      } else if (this.searchTerm.endsWith("'); SELECT * FROM AccountRoles; --")) {
-        exerciseStore.solveExercise(2, 2)
-      } else if (this.searchTerm.includes("'); UPDATE Accounts SET accountRoleId = 2 WHERE username = ")) {
-        exerciseStore.solveExercise(2, 3)
-      } else if (this.searchTerm.includes("'); DELETE FROM Ratings WHERE rating = 5; --")) {
-        exerciseStore.solveExercise(2, 5)
-      }
-
       await fetchBandsBySearchTerm(this.searchTerm)
-        .then(result => {
+        .then(async result => {
-          this.bands = result.data
+          
+
+          // Check for exercise solution
+          if (result.data.length != 0) {
+            // Exercise 2.1
+            if (result.data[0].type != undefined && result.data[0].type == "table") {
+              exerciseStore.solveExercise(2, 1)
+              console.log("Exercise 2.1 solved")
+            }
+            // Exercise 2.2
+            else if (result.data[0].username != undefined) {
+              exerciseStore.solveExercise(2, 2)
+              console.log("Exercise 2.2 solved")
+            }
+            // Exercise 2.3
+            else if (result.data[0].privilegeAdminPanel != undefined) {
+              exerciseStore.solveExercise(2, 3)
+              console.log("Exercise 2.3 solved")
+            }
+          }
+
+          // Exercise 2.4
+          else if (this.searchTerm.includes("UPDATE")) {
+            const accountStore = useAccountStore()
+            await accountStore.refreshAccount()
+
+            if (accountStore.userAccount.accountRole.privilegeAdminPanel == true) {
+              exerciseStore.solveExercise(2, 4)
+              console.log("Exercise 2.4 solved")
+            }
+          }
+
+          // Exercise 2.6
+          else if (this.searchTerm.includes("DELETE")) {
+            const bandStore = useBandStore()
+            await bandStore.getBand("muse")
+
+            if (bandStore.band.ratingValues.find(
+              rating => rating.value == 5).count == 0
+            ) {
+              exerciseStore.solveExercise(2, 6)
+              console.log("Exercise 2.6 solved")
+            }
+          }
+
+          else {
+            this.bands = result.data
+          }
         })
 
+
+      /**
+       * Fetch all locations by this.searchTerm
+       */
       await fetchLocationsBySearchTerm(this.searchTerm)
         .then(result => {
           this.locations = result.data
         })
 
+
+      /**
+       * Fetch all concerts by this.searchTerm
+       */
       await fetchConcertsBySearchTerm(this.searchTerm)
         .then(result => {
           this.concerts = result.data