From a6b5f8141d4ea586b71a0b09f78853f696f2096a Mon Sep 17 00:00:00 2001 From: Ingrid <ingridmegge@gmail.com> Date: Wed, 26 Apr 2023 19:17:50 +0200 Subject: [PATCH] =?UTF-8?q?la=20inn=20noen=20kj=C3=B8leskapsapimetoder?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/stores/fridgeStore.js | 29 +++++++++++++++++++ src/util/API.js | 61 ++++++++++++++++++++++++++++++++++----- src/views/FridgeView.vue | 8 +++++ 3 files changed, 91 insertions(+), 7 deletions(-) create mode 100644 src/stores/fridgeStore.js diff --git a/src/stores/fridgeStore.js b/src/stores/fridgeStore.js new file mode 100644 index 0000000..cf82e01 --- /dev/null +++ b/src/stores/fridgeStore.js @@ -0,0 +1,29 @@ +import { defineStore } from "pinia"; + +export const useFridgeStore = defineStore("fridge", { + state: () => { + return { + items: [] + }; + }, + persist: { + storage: localStorage + }, + getters: { + getItems() { + return this.items; + }, + getItem(state){ + return(id) => state.items.filter(item => + item.id === id) + } + }, + actions: { + reset() { + this.$reset(); + }, + addToFridge(item){ + this.items.push(item); + } + } +}); \ No newline at end of file diff --git a/src/util/API.js b/src/util/API.js index 54c11f9..fff00f3 100644 --- a/src/util/API.js +++ b/src/util/API.js @@ -115,19 +115,66 @@ export const API = { .catch(err => {console.log(err)}) }) .catch(() => {throw new Error()}) - } -} -export const API = { + }, + + /** - * Fetches all fridgeItems + * fetches all fridge items belonging to user + * @returns {Promise<*>} */ - getFridgeItems(){ - return axios.get(`${import.meta.env.VITE_BACKEND_URL}/fridge`) + getFridgeItems: async () =>{ + const authStore = useAuthStore(); + + return axios.get(`${import.meta.env.VITE_BACKEND_URL}/fridge`, { + headers: { Authorization: `Bearer ${authStore.token}` }, + }) .then((response) => { return response.data; }).catch(() => { - throw new Error(); + throw new Error("Could not fetch fridge items"); + }); + }, + + //returns fridgeItem of specific id + getFridgeItem: async (id) =>{ + const authStore = useAuthStore(); + + return axios.get(`${import.meta.env.VITE_BACKEND_URL}/fridge/${id}`, { + headers: { Authorization: `Bearer ${authStore.token}` }, + }) + .then((response) => { + return response.data; + }) + .catch(() => { + throw new Error("Could not fetch fridge item"); }); + }, + + /** + * Adds item(s) to the fridge + * @param request List<Ingredient> listOfIngredients + * @returns {Promise<void>} + */ + addToFridge: async(request) =>{ + const authStore = useAuthStore(); + return axios.post(`${import.meta.env.VITE_BACKEND_URL}/fridge`, { + headers: { Authorization: `Bearer ${authStore.token}` }, + }).then((response) => { + return response.data; + }).catch(()=> { + throw new Error("Could not add item to fridge: "); + }) + +}, + + /** + * Removes x amount of item from fridge + * @param id id of fridgeItem + * @param request ... amount + */ + removeFromFridge(id, request){ + //TODO } + } diff --git a/src/views/FridgeView.vue b/src/views/FridgeView.vue index 499e0e1..360348e 100644 --- a/src/views/FridgeView.vue +++ b/src/views/FridgeView.vue @@ -3,6 +3,7 @@ <h1>Kjøleskap</h1><br><br> <eat-fridge-item-modal @closeModal="hideModal" v-if="visible" :fridge-item="selectedItem"></eat-fridge-item-modal> <div id = "itemContainer"> + <FridgeItem v-for="item in fridgeStore.items"></FridgeItem> <!--<FridgeItem v-for="item in fridgeItems" :key="item.id" fridgeItem="item"></FridgeItem>--> <FridgeItem @appleBtnPressed="showModal" item-name="Melk" quantity="5" quantity-unit="dl" expiration="21.04.23"></FridgeItem> <FridgeItem @appleBtnPressed="showModal" item-name="Melk" quantity="5" quantity-unit="dl" expiration="22.04.23"></FridgeItem> @@ -29,10 +30,17 @@ import FridgeItem from "@/components/FridgeItem.vue"; import EatFridgeItemModal from "@/components/EatFridgeItemModal.vue"; import {API} from "@/util/API"; +import {mapState, mapStores} from "pinia"; +import {useAuthStore} from "@/stores/authStore"; +import {useFridgeStore} from "@/stores/fridgeStore"; export default { name: "FridgeView", components: {EatFridgeItemModal, FridgeItem}, + computed:{ + ...mapState(useAuthStore, ['account']), + ...mapStores(useFridgeStore), + }, data() { return { visible: false, -- GitLab