Matching UI with improved API

software/src/data/models/accountModel.ts

@@ -1,15 +1,14 @@
+import { AccountRole } from "./accountRole"
+import { AddressModel } from "./addressModel"
+import { PaymentModel } from "./paymentModel"
+
 export class AccountModel {
   id: number
   username: string = ""
   password: string = ""
-  street: string = ""
-  houseNumber: number = 0
-  postalCode: number = 0
-  city: string = ""
   firstName: string = ""
   lastName: string = ""
-  createdAt: string = ""
-  updatedAt: string = ""
-  bankName: string = ""
-  iban: string = ""
+  addresses: Array<AddressModel> = [ new AddressModel() ]
+  payments: Array<PaymentModel> = [ new PaymentModel() ]
+  accountRole: AccountRole = new AccountRole()
 }

software/src/data/models/accountRole.ts

@@ -0,0 +1,5 @@
+export class AccountRole {
+  name: string = ""
+  privilegeBuy: boolean = false
+  privilegeAdminPanel: boolean = false
+}

software/src/data/models/addressModel.ts

@@ -0,0 +1,6 @@
+export class AddressModel {
+  street: string = ""
+  houseNumber: number = 0
+  postalCode: number = 0
+  city: string = ""
+}

software/src/data/models/basketItemModel.ts

@@ -1,10 +1,7 @@
+import { ProductModel } from "./productModel"
+
 export class BasketItemModel {
   id: number = -1
-  brand: string = ""
-  name: string = ""
-  categoryName: string = ""
-  categoryIcon: string = ""
-  price: number = 0
-  discount: number = 0
   quantity: number = 1
+  product: ProductModel = new ProductModel()
 }

software/src/data/models/brandModel.ts

@@ -0,0 +1,4 @@
+export class BrandModel {
+  id: number = 0
+  name: string = ""
+}

software/src/data/models/categoryModel.ts

@@ -2,6 +2,4 @@ export class CategoryModel {
   id: number = -1
   name: string
   icon: string
-  createdAt: string = ""
-  updatedAt: string = ""
 }

software/src/data/models/orderModel.ts

@@ -2,8 +2,7 @@ import { OrderedItemModel } from "./orderedItemModel"
 
 export class OrderModel {
   accountId: number
-  totalPrice: number
   shippingProgress: number
-  orderItem: Array<OrderedItemModel>
-  createdAt: string
+  orderItems: Array<OrderedItemModel>
+  orderedAt: string
 }

software/src/data/models/paymentModel.ts

@@ -0,0 +1,4 @@
+export class PaymentModel {
+  bankName: string = ""
+  iban: string = ""
+}

software/src/data/models/productModel.ts

@@ -1,13 +1,16 @@
+import { BrandModel } from "./brandModel"
+import { CategoryModel } from "./categoryModel"
+
 export class ProductModel {
-  id: number = -1
-  brand: string
-  name: string
+  id: number = 0
+  category: CategoryModel = new CategoryModel()
+  brand: BrandModel = new BrandModel()
+  name: string = ""
   description: string = ""
-  specs: Array<string> = []
-  categoryId: number
   price: number = 0
   discount: number = 0
   rating: number = 1
+  inStock: number
+  specs: Array<string> = []
   images: Array<string> = [""]
-  storedItems: number
 }

software/src/data/models/productWithCategoryModel.ts

@@ -1,15 +0,0 @@
-import { CategoryModel } from "./categoryModel"
-
-export class ProductWithCategoryModel {
-  id: number = -1
-  brand: string
-  name: string
-  description: string = ""
-  specs: Array<string> = []
-  category: CategoryModel = new CategoryModel()
-  price: number = 0
-  discount: number = 0
-  rating: number = 1
-  images: Array<string> = [""]
-  storedItems: number
-}

software/src/data/stores/accountStore.ts

@@ -1,21 +1,16 @@
-import { defineStore } from "pinia";
 import { useLocalStorage } from "@vueuse/core";
-import { ThemeEnum } from "../enums/themeEnums";
-import { LanguageEnum } from "../enums/languageEnum";
+import { defineStore } from "pinia";
 import { AccountModel } from "../models/accountModel";
-import { loginAccount, registerAccount, updateAccount } from "../api/accountApi";
-import { useFeedbackStore } from "./feedbackStore";
-import { BannerStateEnum } from "../enums/bannerStateEnum";
 import { OrderModel } from "../models/orderModel";
+import { useFeedbackStore } from "./feedbackStore";
+import { loginAccount, registerAccount, updateAccount } from "../api/accountApi";
 import { getUserOrders } from "../api/orderApi";
+import { BannerStateEnum } from "../enums/bannerStateEnum";
 
-export const useUserStore = defineStore('userStore', {
+export const useAccountStore = defineStore("accountStore", {
   state: () => ({
-    theme: useLocalStorage<ThemeEnum>("hackmycart/userStore/theme", ThemeEnum.DARKRED),
-    language: useLocalStorage<LanguageEnum>("hackmycart/userStore/language", LanguageEnum.GERMAN),
-    userAccount: useLocalStorage<AccountModel>("hackmycart/userStore/userAccount", new AccountModel()),
-    loggedIn: useLocalStorage<Boolean>("hackmycart/userStore/loggedIn", false),
-    orders: useLocalStorage<Array<OrderModel>>("hackmycart/userStore/orders", [])
+    userAccount: useLocalStorage("hackmycart/accountStore/userAccount", new AccountModel()),
+    orders: useLocalStorage<Array<OrderModel>>("hackmycart/accountStore/orders", [ new OrderModel() ])
   }),
 
   actions: {

software/src/data/stores/basketStore.ts

@@ -4,11 +4,10 @@ import { calcProductPrice } from "@/scripts/productScripts";
 import { BasketItemModel } from "../models/basketItemModel";
 import { useFeedbackStore } from "./feedbackStore";
 import { BannerStateEnum } from "../enums/bannerStateEnum";
-import { OrderModel } from "../models/orderModel";
-import { useUserStore } from "./userStore";
 import { addOrder } from "../api/orderApi";
+import { useAccountStore } from "./accountStore";
 
-export const useBasketStore = defineStore('basket', {
+export const useBasketStore = defineStore('basketStore', {
   state: () => ({
     itemsInBasket: useLocalStorage<Array<BasketItemModel>>("hackmycart/basketStore/productsInBasket", [])
   }),
@@ -31,7 +30,7 @@ export const useBasketStore = defineStore('basket', {
       feedbackStore.changeBanner(BannerStateEnum.BASKETPRODUCTREMOVED)
 
       this.itemsInBasket = this.itemsInBasket.filter((basketItemModel: BasketItemModel) => 
-        basketItemModel.productId != item.productId
+        basketItemModel.product.id != item.product.id
       )
     },
 
@@ -40,15 +39,16 @@ export const useBasketStore = defineStore('basket', {
       feedbackStore.changeBanner(BannerStateEnum.BASKETPRODUCTADDED)
 
       // Product is already in the basket, increase number of items
-      if (this.itemsInBasket.find((basketItem) => basketItem.productId == item.productId)) {
-        this.itemsInBasket.find((basketItem) => basketItem.productId == item.productId).quantity += item.quantity
+      if (this.itemsInBasket.find((basketItem) => basketItem.productId == item.product.id)) {
+        this.itemsInBasket.find((basketItem) => 
+          basketItem.productId == item.product.id).quantity += item.quantity
       } else {
         this.itemsInBasket.push(item)
       }
     },
 
     takeOrder() {
-      const userStore = useUserStore()
+      const accountStore = useAccountStore()
 // 
       // const order = new OrderModel()
       // order.accountId = userStore.userAccount.id
@@ -56,7 +56,7 @@ export const useBasketStore = defineStore('basket', {
 // 
       // console.log(order)
 
-      addOrder(userStore.userAccount.id, this.itemsInBasket)
+      addOrder(accountStore.userAccount.id, this.itemsInBasket)
     }
   }
 })

software/src/data/stores/preferencesStore.ts

@@ -0,0 +1,11 @@
+import { defineStore } from "pinia";
+import { useLocalStorage } from "@vueuse/core";
+import { ThemeEnum } from "../enums/themeEnums";
+import { LanguageEnum } from "../enums/languageEnum";
+
+export const usePreferencesStore = defineStore('preferencesStore', {
+  state: () => ({
+    theme: useLocalStorage<ThemeEnum>("hackmycart/preferencesStore/theme", ThemeEnum.DARKRED),
+    language: useLocalStorage<LanguageEnum>("hackmycart/preferencesStore/language", LanguageEnum.GERMAN)
+  }),
+})

software/src/data/stores/productStore.ts

@@ -3,13 +3,13 @@ import { defineStore } from "pinia";
 import { getAllProducts } from "../api/productApi";
 import { SortOrder } from "../enums/sortOrderEnum";
 import { CategoryModel } from "../models/categoryModel";
-import { ProductWithCategoryModel } from "../models/productWithCategoryModel";
+import { ProductModel } from "../models/productModel";
 
 
 export const useProductStore = defineStore("productStore", {
   state: () => ({
-    products: useLocalStorage<Array<ProductWithCategoryModel>>("hackmycart/productStore/products", []),
-    filteredProducts: useLocalStorage<Array<ProductWithCategoryModel>>("hackmycart/productStore/filteredProducts", []),
+    products: useLocalStorage<Array<ProductModel>>("hackmycart/productStore/products", []),
+    filteredProducts: useLocalStorage<Array<ProductModel>>("hackmycart/productStore/filteredProducts", []),
     sortOrder: useLocalStorage<SortOrder>("hackmycart/productStore/sortOrder", SortOrder.NAMEATOZ),
     filteredCategory: useLocalStorage<CategoryModel>("hackmycart/productStore/filteredCategory", new CategoryModel()),
     onlyDiscounts: useLocalStorage<Boolean>("hackmycart/productStore/onlyDiscounts", false)
@@ -28,20 +28,20 @@ export const useProductStore = defineStore("productStore", {
       if (this.filteredCategory.id == -1 || this.filteredCategory.id == 0) {
         this.filteredProducts = this.products
       } else {
-        this.filteredProducts = this.products.filter((product: ProductWithCategoryModel) => 
+        this.filteredProducts = this.products.filter((product: ProductModel) => 
           product.category.id == this.filteredCategory.id
         )
       }
 
       if (this.onlyDiscounts) {
-        this.filteredProducts = this.filteredProducts.filter((product: ProductWithCategoryModel) => 
+        this.filteredProducts = this.filteredProducts.filter((product: ProductModel) => 
           product.discount > 0
         )
       }
     },
 
     sortProducts() {
-      this.filteredProducts.sort((a: ProductWithCategoryModel, b: ProductWithCategoryModel) => {
+      this.filteredProducts.sort((a: ProductModel, b: ProductModel) => {
         switch (this.sortOrder)
         {
           case SortOrder.PRICELOWTOHIGH: {