Reactivate Admin Panel, implement exercise 2.1, add feedback if exercise solved

software/backend/data/exercises.json

@@ -33,7 +33,16 @@
       "nameDe": "Broken Access Control",
       "nameEn": "Broken Access Control",
       "groupNr": 2,
-      "exercises": []
+      "exercises": [
+        {
+          "nameDe": "Admin-Panel aufrufen",
+          "nameEn": "Access Admin Panel",
+          "exerciseNr": 1,
+          "descriptionDe": "Manipuliere die URL so, dass du das Admin-Panel erreichen kannst",
+          "descriptionEn": "Manipulate the URL and access the admin panel",
+          "solved": false
+        }
+      ]
     },
     {
       "nameDe": "Cross-Site Scripting (XSS)",

software/src/data/enums/bannerStateEnum.ts

@@ -9,6 +9,31 @@ export enum BannerStateEnum {
   BASKETPRODUCTREMOVED,
 
 
+  ////////// Exercise feedback //////////
+
+  EXERCISESOLVED01,
+
+  EXERCISESOLVED02,
+
+  EXERCISESOLVED11,
+
+  EXERCISESOLVED12,
+
+  EXERCISESOLVED13,
+
+  EXERCISESOLVED21,
+
+  EXERCISESOLVED22,
+
+  EXERCISESOLVED23,
+
+  EXERCISESOLVED31,
+
+  EXERCISESOLVED32,
+
+  EXERCISESOLVED33,
+
+
   ////////// API Endpoint /api //////////
 
   // Status: 200 OK
@@ -45,21 +70,6 @@ export enum BannerStateEnum {
   ACCOUNTLOGOUTSUCCESSFUL,
 
 
-  ////////// API Endpoint /categories //////////
-
-  // Status: 201 Created
-  CATEGORYCREATESUCCESSFUL,
-
-  // Status: 200 OK
-  CATEGORYDELETESUCESSFUL,
-
-  // Status: 400 Bad request
-  CATEGORYCREATEERROR,
-
-  // Status: 400 Bad request
-  CATEGORYDELETEERROR,
-
-
   ////////// API Endpoint /orders //////////
 
   // Status: 201 Created

software/src/locales/de.json

@@ -49,22 +49,21 @@
     "bankName": "Name der Bank",
     "iban": "IBAN"
   },
-  "account": {
-    "username": "Username",
-    "password": "Passwort",
-    "noAccountRegister": "Neuen Account erstellen!",
-    "register": "Account erstellen",
-    "backToLogin": "Zurück zum Login",
-    "delete": "Account löschen",
-    "managingAccount": "Account verwalten",
-    "address": "Adresse | Addressen",
-    "payment": "Bezahlart | Bezahlarten",
-    "masterData": "Stammdaten",
-    "noAddresses": "Keine Adressen gefunden",
-    "noPayments": "Keine Bezahlarten gefunden",
-    "newPayment": "New Payment",
-    "email": "E-Mail-Adresse"
-  },
+  "account": "Account | Accounts",
+  "username": "Username",
+  "password": "Passwort",
+  "noAccountRegister": "Neuen Account erstellen!",
+  "register": "Account erstellen",
+  "backToLogin": "Zurück zum Login",
+  "delete": "Account löschen",
+  "managingAccount": "Account verwalten",
+  "address": "Adresse | Addressen",
+  "payment": "Bezahlart | Bezahlarten",
+  "masterData": "Stammdaten",
+  "noAddresses": "Keine Adressen gefunden",
+  "noPayments": "Keine Bezahlarten gefunden",
+  "newPayment": "New Payment",
+  "email": "E-Mail-Adresse",
   "bannerMessages": {
     "loginSuccessful": "Login erfolgreich!",
     "wrongLogin": "Falscher Username oder falsches Passwort!",
@@ -84,7 +83,18 @@
     "productDeleteSuccessful": "Produkt erfolgreich entfernt",
     "productDeleteError": "Fehler beim Entfernen des Produktes",
     "basketProductAdded": "Artikel zum Warenkorb hinzugefügt",
-    "basketProductRemoved": "Artikel aus Warenkorb entfernt"
+    "basketProductRemoved": "Artikel aus Warenkorb entfernt",
+    "exerciseSolved01": "Aufgabe 0.1 gelöst!",
+    "exerciseSolved02": "Aufgabe 0.2 gelöst!",
+    "exerciseSolved11": "Aufgabe 1.1 gelöst!",
+    "exerciseSolved12": "Aufgabe 1.2 gelöst!",
+    "exerciseSolved13": "Aufgabe 1.3 gelöst!",
+    "exerciseSolved21": "Aufgabe 2.1 gelöst!",
+    "exerciseSolved22": "Aufgabe 2.2 gelöst!",
+    "exerciseSolved23": "Aufgabe 2.3 gelöst!",
+    "exerciseSolved31": "Aufgabe 3.1 gelöst!",
+    "exerciseSolved32": "Aufgabe 3.2 gelöst!",
+    "exerciseSolved33": "Aufgabe 3.3 gelöst!"
   },
   "oclock": "Uhr",
   "ordering": {

software/src/locales/en.json

@@ -49,22 +49,21 @@
     "bankName": "Bank name",
     "iban": "IBAN"
   },
-  "account": {
-    "backToLogin": "Back to Login",
-    "username": "Username",
-    "password": "Password",
-    "noAccountRegister": "Create new Account!",
-    "register": "Create Account",
-    "delete": "Delete Account",
-    "managingAccount": "Managing Account",
-    "address": "Address | Addresses",
-    "payment": "Payment | Payments",
-    "masterData": "Master data",
-    "noAddresses": "No Addresses found",
-    "noPayments": "No payments found",
-    "newPayment": "New Payment",
-    "email": "E-Mail address"
-  },
+  "account": "Account | Accounts",
+  "backToLogin": "Back to Login",
+  "username": "Username",
+  "password": "Password",
+  "noAccountRegister": "Create new Account!",
+  "register": "Create Account",
+  "delete": "Delete Account",
+  "managingAccount": "Managing Account",
+  "address": "Address | Addresses",
+  "payment": "Payment | Payments",
+  "masterData": "Master data",
+  "noAddresses": "No Addresses found",
+  "noPayments": "No payments found",
+  "newPayment": "New Payment",
+  "email": "E-Mail address",
   "bannerMessages": {
     "loginSuccessful": "Login erfolgreich!",
     "wrongLogin": "Falscher Username oder falsches Passwort!",
@@ -84,7 +83,18 @@
     "productDeleteSuccessful": "Product successfully deleted",
     "productDeleteError": "Error on product delete",
     "basketProductAdded": "Add product to basket",
-    "basketProductRemoved": "Product removed from basket"
+    "basketProductRemoved": "Product removed from basket",
+    "exerciseSolved01": "Exercise 0.1 solved!",
+    "exerciseSolved02": "Exercise 0.2 solved!",
+    "exerciseSolved11": "Exercise 1.1 solved!",
+    "exerciseSolved12": "Exercise 1.2 solved!",
+    "exerciseSolved13": "Exercise 1.3 solved!",
+    "exerciseSolved21": "Exercise 2.1 solved!",
+    "exerciseSolved22": "Exercise 2.2 solved!",
+    "exerciseSolved23": "Exercise 2.3 solved!",
+    "exerciseSolved31": "Exercise 3.1 solved!",
+    "exerciseSolved32": "Exercise 3.2 solved!",
+    "exerciseSolved33": "Exercise 3.3 solved!"
   },
   "oclock": "o'clock",
   "ordering": {

software/src/pages/admin/accountsAdminPage/index.vue

@@ -0,0 +1,6 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  Accounts Admin Page
+</template>

software/src/pages/admin/bandsAdminPage/index.vue

@@ -2,5 +2,5 @@
 </script>
 
 <template>
-  Accounts Page
+  Bands Admin Page
 </template>

software/src/pages/admin/brandsPage/index.vue

@@ -1,31 +0,0 @@
-<script setup lang="ts">
-import cardView from '@/components/basics/cardView.vue';
-// import { useProductStore } from '@/data/stores/productStore';
-
-// const productStore = useProductStore()
-
-const headers = [
-  { title: "Name", value: "name" },
-  { title: "Edit", value: "edit" },
-]
-</script>
-
-<template>
-  <!-- <v-container max-width="800">
-    <v-row>
-      <v-col>
-        <card-view
-          :title="$t('brand', 2)"
-          icon="mdi-label"
-          :subtitle="productStore.brands.length + ' ' + $t('brand', productStore.brands.length)"
-        >
-          <v-data-table
-            :items="productStore.brands"
-            :headers="headers"
-          >
-          </v-data-table>
-        </card-view>
-      </v-col>
-    </v-row>
-  </v-container> -->
-</template>

software/src/pages/admin/categoriesAdminPage/index.vue

@@ -0,0 +1,6 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  Categories Admin Page
+</template>

software/src/pages/admin/categoriesPage/index.vue

@@ -1,13 +0,0 @@
-<script setup lang="ts">
-import cardView from '@/components/basics/cardView.vue';
-
-const headers = [
-  { title: "Name", value: "name" },
-  { title: "Icon", value: "icon" },
-  { title: "Edit", value: "edit" },
-]
-</script>
-
-<template>
-  
-</template>

software/src/pages/admin/concertsAdminPage/index.vue

@@ -0,0 +1,6 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  Concerts Admin Page
+</template>

software/src/pages/admin/dashboardPage/index.vue

@@ -1,6 +1,149 @@
 <script setup lang="ts">
+import { useRouter } from 'vue-router';
+import outlinedButton from '@/components/basics/outlinedButton.vue';
+import cardView from '@/components/basics/cardView.vue';
+import { useConcertStore } from '@/stores/concert.store';
+import { useBandStore } from '@/stores/band.store';
+import { useAccountStore } from '@/stores/account.store';
+import { useLocationStore } from '@/stores/location.store';
+import { ref } from 'vue';
+import { useExerciseStore } from '@/stores/exercise.store';
+
+const router = useRouter()
+const concertStore = useConcertStore()
+const bandStore = useBandStore()
+const accountStore = useAccountStore()
+const locationStore = useLocationStore()
+const soldOutConcerts = ref(0)
+const exerciseStore = useExerciseStore()
+
+exerciseStore.solveExercise(2, 1)
+
+bandStore.getBands()
+locationStore.getLocations()
+concertStore.getConcerts()
+  .then(result => {
+    for(let concert of concertStore.concerts) {
+      concert.inStock == 0 ? soldOutConcerts.value++ : ""
+    }
+  })
 </script>
 
 <template>
-  Admin Dashboard Page
+  <v-container>
+    <v-row>
+      <v-col>
+        <card-view
+          :title="$t('band', 2)"
+          icon="mdi-guitar-electric"
+        >
+          <div class="text-h4 text-center">
+            {{ bandStore.bands.length }} {{ $t('band', 2) }}
+          </div>
+
+          <template #actions>
+            <outlined-button
+              @click="router.push('/admin/bands')"
+            >
+              {{ $t('more') }}
+            </outlined-button>
+          </template>
+        </card-view>
+      </v-col>
+
+      <v-col>
+        <card-view
+          :title="$t('concert', 2)"
+          icon="mdi-ticket"
+        >
+          <div class="text-h4 text-center">
+            {{ concertStore.concerts.length }} {{ $t('concert', 2) }}
+          </div>
+
+          <div class="text-disabled text-center">
+            {{ soldOutConcerts }} {{ $t('soldOut') }}
+          </div>
+
+          <template #actions>
+            <outlined-button
+              @click="router.push('/admin/concerts')"
+            >
+              {{ $t('more') }}
+            </outlined-button>
+          </template>
+        </card-view>
+      </v-col>
+
+
+      <v-col>
+        <card-view
+          :title="$t('location', 2)"
+          icon="mdi-city"
+        >
+          <div class="text-h4 text-center">
+            {{ locationStore.locations.length }} {{ $t('location', 2) }}
+          </div>
+
+          <template #actions>
+            <outlined-button
+              @click="router.push('/admin/locations')"
+            >
+              {{ $t('more') }}
+            </outlined-button>
+          </template>
+        </card-view>
+      </v-col>
+    </v-row>
+    
+
+
+    <v-row>
+      <v-col>
+        <card-view
+          :title="$t('account', 2)"
+          icon="mdi-account"
+        >
+        </card-view>
+      </v-col>
+
+      <v-col>
+        <card-view
+          :title="$t('category', 2)"
+          icon="mdi-account"
+        >
+          <div class="text-h4 text-center">
+            {{ bandStore.availableGenres.length }} {{ $t('genres', 2) }}
+          </div>
+
+          <template #actions>
+            <outlined-button
+              @click="router.push('/admin/genres')"
+            >
+              {{ $t('more') }}
+            </outlined-button>
+          </template>
+        </card-view>
+      </v-col>
+
+      <v-col>
+        <card-view
+          :title="$t('genres', 2)"
+          icon="mdi-guitar-electric"
+        >
+          <div class="text-h4 text-center">
+            {{ bandStore.availableGenres.length }} {{ $t('genres', 2) }}
+          </div>
+
+          <template #actions>
+            <outlined-button
+              @click="router.push('/admin/genres')"
+            >
+              {{ $t('more') }}
+            </outlined-button>
+          </template>
+        </card-view>
+      </v-col>
+    </v-row>
+      
+  </v-container>
 </template>

software/src/pages/admin/genresAdminPage/index.vue

@@ -0,0 +1,6 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  Genres Admin Page
+</template>

software/src/pages/admin/locationsAdminPage/index.vue

@@ -0,0 +1,6 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  Locations Admin Page
+</template>

software/src/pages/admin/productsPage/index.vue

@@ -1,96 +0,0 @@
-<script setup lang="ts">
-import cardView from '@/components/basics/cardView.vue';
-import productEditDialog from './productEditDialog.vue';
-import { ref } from 'vue';
-
-// const productStore = useProductStore()
-// const editProduct = ref(new ProductModel())
-const showEditProductDialog = ref(false)
-
-const headers = [
-  { title: "Category", value: "category.name" },
-  { title: "Brand", value: "brand.name" },
-  { title: "Name", value: "name" },
-  { title: "Price", value: "price" },
-  { title: "Discount", value: "discount" },
-  { title: "Rating", value: "rating" },
-  { title: "In stock", value: "inStock" },
-  { title: "Edit", value: "edit" },
-]
-
-// function openEditProductDialog(product: ProductModel) {
-//   editProduct.value = product
-//   showEditProductDialog.value = true
-// }
-</script>
-
-<template>
-  <v-container>
-    <v-row>
-      <!-- <v-col>
-        <card-view 
-          :title="$t('product.product', 2)"
-          :subtitle="productStore.products.length + ' ' + $t('product.product', productStore.products.length)"
-          icon="mdi-store"
-        >
-          <v-data-table
-            :headers="headers"
-            :items="productStore.products"
-          >
-            <template v-slot:item.price="{ item }">
-              {{ item.price }} €
-            </template>
-
-            <template v-slot:item.discount="{ item }">
-              <div v-if="item.discount > 0">
-                {{ item.discount }} %
-              </div>
-            </template>
-
-            <template v-slot:item.inStock="{ item }">
-              <div v-if="item.inStock > 5" class="text-green-lighten-1">
-                <v-icon icon="mdi-check" />
-                {{ $t("product.storedItemsAvailable", [item.inStock]) }}
-              </div>
-              <div v-else-if="item.inStock > 0" class="text-orange-lighten-1">
-                <v-icon icon="mdi-alert" />
-                {{ $t("product.storedItemsAvailable", [item.inStock]) }}
-              </div>
-              <div v-else class="text-red">
-                <v-icon icon="mdi-alert-circle" />
-                {{ $t("product.soldOut") }}
-              </div>
-            </template>
-
-            <template v-slot:item.edit="{ item }">
-              <v-btn
-                icon="mdi-pencil"
-                color="orange"
-                variant="text"
-                @click="openEditProductDialog(item)"
-              />
-
-              <v-btn
-                icon="mdi-store-off"
-                color="red"
-                variant="text"
-                v-if="item.offered"
-              />
-
-              <v-btn
-                icon="mdi-store"
-                color="green"
-                variant="text"
-                v-if="!item.offered"
-              />
-            </template>
-          </v-data-table>
-        </card-view>
-      </v-col> -->
-    </v-row>
-  </v-container>
-
-  <!-- <product-edit-dialog
-    v-model="showEditProductDialog"
-    :edit-product="editProduct" /> -->
-</template>

software/src/pages/admin/productsPage/productEditDialog.vue

@@ -1,116 +0,0 @@
-<script setup lang="ts">
-import actionDialog from '@/components/basics/actionDialog.vue';
-import { ProductModel } from '@/data/models/productModel';
-import outlinedButton from '@/components/basics/outlinedButton.vue';
-import { useProductStore } from '@/data/stores/productStore';
-import { ModelRef } from 'vue';
-
-const showDialog: ModelRef<boolean> = defineModel()
-const editProduct = defineModel("editProduct", { type: ProductModel, required: true})
-const productStore = useProductStore()
-
-function saveProduct() {
-  // todo
-  showDialog.value = false
-}
-</script>
-
-<template>
-  <action-dialog
-    :title="$t('editProduct')"
-    icon="mdi-store-edit"
-    v-model="showDialog"
-  >
-    <v-row>
-      <v-col>
-        <v-select
-          :items="productStore.categories"
-          v-model="editProduct.category"
-          :label="$t('category')"
-        >
-          <template v-slot:item="{ props, item }">
-            <v-list-item v-bind="props" :prepend-icon="item.raw.icon" :title="item.raw.name" />
-          </template>
-
-          <template v-slot:selection="{ item }">
-            <v-list-item :prepend-icon="item.raw.icon" :title="item.raw.name" />
-          </template>
-        </v-select>
-      </v-col>
-
-      <v-col>
-        <v-select
-          :items="productStore.brands"
-          v-model="editProduct.brand"
-          :label="$t('brand')"
-        >
-          <template v-slot:item="{ props, item }">
-            <v-list-item v-bind="props" :title="item.raw.name" />
-          </template>
-
-          <template v-slot:selection="{ item }">
-            <v-list-item :title="item.raw.name" />
-          </template>
-        </v-select>
-      </v-col>
-    </v-row>
-
-    <v-row>
-      <v-col>
-        <v-text-field
-          v-model="editProduct.name"
-          :label="$t('product.productName')"
-        />
-      </v-col>
-    </v-row>
-
-    <v-row>
-      <v-col>
-        <v-textarea
-          v-model="editProduct.description"
-          :label="$t('product.description')"
-        />
-      </v-col>
-    </v-row>
-
-    <v-row>
-      <v-col>
-        <v-text-field
-          v-model="editProduct.price"
-          :label="$t('product.productPrice')"
-          suffix="€"
-        />
-      </v-col>
-
-      <v-col>
-        <v-text-field
-          v-model="editProduct.discount"
-          :label="$t('product.discount')"
-        />
-      </v-col>
-    </v-row>
-
-    <v-row>
-      <v-col>
-        <v-text-field
-          v-model="editProduct.inStock"
-          :label="$t('product.inStock')"
-        />
-      </v-col>
-    </v-row>
-
-    <!-- todo -->
-    {{ editProduct.images }}
-    {{ editProduct.specs }}
-
-    <template #actions>
-      <outlined-button
-        color="green"
-        prepend-icon="mdi-content-save"
-        @click="saveProduct"
-      >
-        {{ $t('save') }}
-      </outlined-button>
-    </template>
-  </action-dialog>  
-</template>

software/src/router/admin.routes.ts

@@ -1,28 +1,38 @@
 import DashboardPage from "@/pages/admin/dashboardPage/index.vue"
-import CategoriesPage from "@/pages/admin/categoriesPage/index.vue"
-import AccountsPage from "@/pages/admin/accountsPage/index.vue"
-import ProductsPage from "@/pages/admin/productsPage/index.vue"
-import BrandsPage from "@/pages/admin/brandsPage/index.vue"
+import ConcertsAdminPage from "@/pages/admin/concertsAdminPage/index.vue"
+import BandsAdminPage from "@/pages/admin/bandsAdminPage/index.vue"
+import AccountsAdminPage from "@/pages/admin/accountsAdminPage/index.vue"
+import GenresAdminPage from "@/pages/admin/genresAdminPage/index.vue"
+import CategoriesAdminPage from "@/pages/admin/categoriesAdminPage/index.vue"
+import LocationsAdminPage from "@/pages/admin/locationsAdminPage/index.vue"
 
 export const adminRoutes = [
   {
-    path: '/admin/dashboard',
+    path: '/admin',
     component: DashboardPage
   },
   {
-    path: '/admin/categories',
-    component: CategoriesPage
+    path: '/admin/concerts',
+    component: ConcertsAdminPage
+  },
+  {
+    path: '/admin/bands',
+    component: BandsAdminPage
   },
   {
     path: '/admin/accounts',
-    component: AccountsPage
+    component: AccountsAdminPage
   },
   {
-    path: '/admin/products',
-    component: ProductsPage
+    path: '/admin/genres',
+    component: GenresAdminPage
   },
   {
-    path: '/admin/brands',
-    component: BrandsPage
-  }
+    path: '/admin/categories',
+    component: CategoriesAdminPage
+  },
+  {
+    path: '/admin/locations',
+    component: LocationsAdminPage
+  },
 ]

software/src/stores/exercise.store.ts

@@ -2,6 +2,8 @@ import { fetchAllExerciseGroups, updateExercise } from "@/data/api/exerciseApi";
 import { ExerciseGroupApiModel } from "@/data/models/exercises/exerciseGroupApiModel";
 import { defineStore } from "pinia";
 import { ref } from "vue";
+import { useFeedbackStore } from "./feedback.store";
+import { BannerStateEnum } from "@/data/enums/bannerStateEnum";
 
 export const useExerciseStore = defineStore("exerciseStore", {
   state: () => ({
@@ -23,10 +25,55 @@ export const useExerciseStore = defineStore("exerciseStore", {
     },
 
     solveExercise(exerciseGroupNr: number, exerciseNr: number) {
+      const feedbackStore = useFeedbackStore()
       this.fetchInProgress = true
       
       updateExercise(exerciseGroupNr, exerciseNr, true)
         .then(result => {
+          let bannerState = BannerStateEnum.ERROR
+
+          switch(exerciseGroupNr) {
+              case 0: {
+                switch(exerciseNr) {
+                  case 1: bannerState = BannerStateEnum.EXERCISESOLVED01; break;
+                  case 2: bannerState = BannerStateEnum.EXERCISESOLVED02; break;
+                }
+
+                break;
+              }
+
+              case 1: {
+                switch(exerciseNr) {
+                  case 1: bannerState = BannerStateEnum.EXERCISESOLVED11; break;
+                  case 2: bannerState = BannerStateEnum.EXERCISESOLVED12; break;
+                  case 3: bannerState = BannerStateEnum.EXERCISESOLVED13; break;
+                }
+
+                break;
+              }
+
+              case 2: {
+                switch(exerciseNr) {
+                  case 1: bannerState = BannerStateEnum.EXERCISESOLVED21; break;
+                  case 2: bannerState = BannerStateEnum.EXERCISESOLVED22; break;
+                  case 3: bannerState = BannerStateEnum.EXERCISESOLVED23; break;
+                }
+
+                break;
+              }
+
+              case 3: {
+                switch(exerciseNr) {
+                  case 1: bannerState = BannerStateEnum.EXERCISESOLVED31; break;
+                  case 2: bannerState = BannerStateEnum.EXERCISESOLVED32; break;
+                  case 3: bannerState = BannerStateEnum.EXERCISESOLVED33; break;
+                }
+
+                break;
+              }
+            }
+
+          feedbackStore.changeBanner(bannerState)
           this.getAllExercises()
         })
     }

software/src/stores/feedback.store.ts

@@ -41,6 +41,53 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         }
 
 
+        ////////// Exercise feedback //////////
+
+        case BannerStateEnum.EXERCISESOLVED01: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved01"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED02: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved02"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED11: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved11"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED12: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved12"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED13: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved13"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED21: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved21"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED22: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved22"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED23: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved23"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED31: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved31"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED32: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved32"); break;
+        }
+
+        case BannerStateEnum.EXERCISESOLVED33: {
+          this.title = this.i18n.t("bannerMessages.exerciseSolved33"); break;
+        }
+
+
         ////////// API Endpoint /api //////////
 
         case BannerStateEnum.DATABASERESETSUCCESSFUL: {
@@ -79,25 +126,6 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         }
 
 
-        ////////// API Endpoint /categories //////////
-
-        case BannerStateEnum.CATEGORYCREATESUCCESSFUL: {
-          this.title = this.i18n.t('bannerMessages.categoryCreateSuccessful'); break;
-        }
-
-        case BannerStateEnum.CATEGORYDELETESUCESSFUL: {
-          this.title = this.i18n.t('bannerMessages.categoryDeleteSuccessful'); break;
-        }
-
-        case BannerStateEnum.CATEGORYCREATEERROR: {
-          this.title = this.i18n.t('bannerMessages.categoryCreateError'); break;
-        }
-
-        case BannerStateEnum.CATEGORYDELETEERROR: {
-          this.title = this.i18n.t('bannerMessages.categoryDeleteError'); break;
-        }
-
-
         ////////// API Endpoint /orders //////////
 
         case BannerStateEnum.ORDERPLACESUCCESSFUL: {
@@ -133,8 +161,6 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.ACCOUNTLOGINWRONGLOGIN:
         case BannerStateEnum.ACCOUNTREGISTERERROR:
         case BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE:
-        case BannerStateEnum.CATEGORYCREATEERROR:
-        case BannerStateEnum.CATEGORYDELETEERROR:
         case BannerStateEnum.PRODUCTDELETESUCCESSFUL:
         case BannerStateEnum.PRODUCTDELETEERROR:
           this.color = "red"
@@ -146,14 +172,26 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL:
         case BannerStateEnum.ACCOUNTUPDATESUCCESSFUL:
         case BannerStateEnum.ACCOUNTLOGOUTSUCCESSFUL:
-        case BannerStateEnum.CATEGORYCREATESUCCESSFUL:
-        case BannerStateEnum.CATEGORYDELETESUCESSFUL:
         case BannerStateEnum.ORDERPLACESUCCESSFUL:
         case BannerStateEnum.PRODUCTCREATESUCCESSFUL:
         case BannerStateEnum.PRODUCTCREATEERROR:
           this.color = "green"
           break;
 
+        case BannerStateEnum.EXERCISESOLVED01:
+        case BannerStateEnum.EXERCISESOLVED02:
+        case BannerStateEnum.EXERCISESOLVED11:
+        case BannerStateEnum.EXERCISESOLVED12:
+        case BannerStateEnum.EXERCISESOLVED13:
+        case BannerStateEnum.EXERCISESOLVED21:
+        case BannerStateEnum.EXERCISESOLVED22:
+        case BannerStateEnum.EXERCISESOLVED23:
+        case BannerStateEnum.EXERCISESOLVED31:
+        case BannerStateEnum.EXERCISESOLVED32:
+        case BannerStateEnum.EXERCISESOLVED33:
+          this.color = "purple"
+          break;
+
         case BannerStateEnum.BASKETPRODUCTREMOVED:
           this.color = "blue"
       }
@@ -173,12 +211,6 @@ export const useFeedbackStore = defineStore("feedbackStore", {
           this.icon = "mdi-account"
           break;
 
-        case BannerStateEnum.CATEGORYCREATEERROR:
-        case BannerStateEnum.CATEGORYDELETEERROR:
-        case BannerStateEnum.CATEGORYCREATESUCCESSFUL:
-        case BannerStateEnum.CATEGORYDELETESUCESSFUL:
-          this.icon = "mdi-label"
-          break;
 
         case BannerStateEnum.PRODUCTDELETESUCCESSFUL:
         case BannerStateEnum.PRODUCTDELETEERROR:
@@ -186,6 +218,20 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.PRODUCTCREATEERROR:
           this.icon = "mdi-store"
           break;
+
+        case BannerStateEnum.EXERCISESOLVED01:
+        case BannerStateEnum.EXERCISESOLVED02:
+        case BannerStateEnum.EXERCISESOLVED11:
+        case BannerStateEnum.EXERCISESOLVED12:
+        case BannerStateEnum.EXERCISESOLVED13:
+        case BannerStateEnum.EXERCISESOLVED21:
+        case BannerStateEnum.EXERCISESOLVED22:
+        case BannerStateEnum.EXERCISESOLVED23:
+        case BannerStateEnum.EXERCISESOLVED31:
+        case BannerStateEnum.EXERCISESOLVED32:
+        case BannerStateEnum.EXERCISESOLVED33:
+          this.icon = "mdi-check-circle-outline"
+          break;
         
         case BannerStateEnum.DATABASERESETSUCCESSFUL:
           this.icon = "mdi-database-refresh"