Store products in a basket, display list of products in basket

software/src/data/models/productModel.ts

@@ -7,6 +7,7 @@ export class ProductModel {
   price: number = 0
   discount: number = 0
   rating: number = 1
+  nrOfArticles: number = 2
   imageUrl: string = ""
   createdAt: string = ""
   updatedAt: string = ""

software/src/data/stores/basketStore.ts

@@ -0,0 +1,30 @@
+import { defineStore } from "pinia";
+import { useLocalStorage } from "@vueuse/core";
+import { ProductModel } from "../models/productModel";
+import { calcProductPrice } from "@/scripts/productScripts";
+
+export const useBasketStore = defineStore('basket', {
+  state: () => ({
+    productsInBasket: useLocalStorage<Array<ProductModel>>("hackmycart/basketStore/productsInBasket", [])
+  }),
+
+  getters: {
+    getTotalPrice() {
+      let result = 0
+
+      for (let product of this.productsInBasket) {
+        result += calcProductPrice(product)
+      }
+
+      return result
+    }
+  },
+
+  actions: {
+    removeProductFromBasket(product: ProductModel) {
+      this.productsInBasket = this.productsInBasket.filter((p: ProductModel) => 
+        p.id != product.id
+      )
+    }
+  }
+})