Fix order view

software/backend/routes/order.routes.ts

@@ -14,7 +14,7 @@ order.get("/:id", (req: Request, res: Response) => {
     ]
   })
     .then(orders => {
-      res.status(200).json(orders).send()
+      res.status(200).json(orders)
     })
 })
 

software/src/data/api/orderApi.ts

@@ -0,0 +1,7 @@
+import axios from "axios"
+
+const BASE_URL = "http://localhost:3000/orders"
+
+export async function getUserOrders(userId: number) {
+  return axios.get(BASE_URL + "/" + userId)
+}

software/src/data/models/orderModel.ts

@@ -0,0 +1,9 @@
+import { OrderedItemModel } from "./orderedItemModel"
+
+export class OrderModel {
+  accountId: number
+  totalPrice: number
+  shippingProgress: number
+  orderItem: Array<OrderedItemModel>
+  createdAt: string
+}

software/src/data/models/orderedItemModel.ts

@@ -1,6 +1,8 @@
+import { ProductModel } from "./productModel"
+
 export class OrderedItemModel {
   orderId: number = -1
-  productId: number = -1
+  product: ProductModel
   quantity: number = 1
   totalPrice: number = 0
 }

software/src/data/stores/userStore.ts

@@ -6,13 +6,16 @@ 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 { getUserOrders } from "../api/orderApi";
 
 export const useUserStore = defineStore('userStore', {
   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)
+    loggedIn: useLocalStorage<Boolean>("hackmycart/userStore/loggedIn", false),
+    orders: useLocalStorage<Array<OrderModel>>("hackmycart/userStore/orders", [])
   }),
 
   actions: {
@@ -20,11 +23,16 @@ export const useUserStore = defineStore('userStore', {
       const feedbackStore = useFeedbackStore()
 
       await loginAccount(username, password)
-        .then(result => {
+        .then(async result => {
-          this.userAccount = result.data.account
+          this.userAccount = result.data
           this.loggedIn = true
 
           feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGINSUCCESSFUL)
+
+          await getUserOrders(result.data.id)
+            .then(result => {
+              this.orders = result.data
+            })
         })
         .catch(error => {
           this.loggedIn = false

software/src/pages/loginPage/loginForm.vue

@@ -5,8 +5,8 @@ import { ref } from 'vue';
 
 const userStore = useUserStore()
 const showRegisterCard = defineModel("showRegisterCard", { type: Boolean, default: false })
-const username = ref("")
+const username = ref("duranduran")
-const password = ref("")
+const password = ref("H4nn0ver")
 
 function startLogin() {
   userStore.login(username.value, password.value)

software/src/pages/ordersPage/index.vue

@@ -1,19 +1,7 @@
 <script setup lang="ts">
 import { useUserStore } from '@/data/stores/userStore';
-import axios from 'axios';
-import { ref } from 'vue';
 
 const userStore = useUserStore()
-const orders = ref([])
-
-axios.get("http://127.0.0.1:3000/orders", { 
-  params: {
-    accountId: userStore.userAccountId
-  }
-})
-  .then(res => {
-    orders.value = res.data
-  })
 
 function getDotColor(order, step: number) {
   if (order.shippingProgress == step)
@@ -38,7 +26,7 @@ function formatDateTimeString(string: string) {
 
 <template>
   <v-container>
-    <v-row v-for="order in orders">
+    <v-row v-for="order in userStore.orders">
       <v-col>
         <v-card
           :title="$t('orders.orderFrom') + ' ' + formatDateTimeString(order.createdAt) + ' ' + $t('oclock')"