more basics working

vue/src/components/ShoppingLineItem.vue

@@ -18,7 +18,7 @@
 
 
             </b-button>
-            <b-button variant="success"><i class="fas fa-check"></i></b-button>
+            <b-button variant="success" @click="useShoppingListStore().toggleFoodCheckedState(food)"><i class="fas fa-check"></i></b-button>
         </b-button-group>
 
 
@@ -33,11 +33,11 @@
                 <h6 class="mt-2">Actions</h6> <!-- TODO localize -->
                 <b-input :placeholder="$t('Category')" class="mb-2"></b-input>  <!-- TODO implement -->
 
-                <b-button variant="success" block>already available</b-button>  <!-- TODO localize -->
+                <b-button variant="success" block @click="detail_modal_visible = false;"> {{ $t("Edit_Food") }}</b-button>  <!-- TODO implement -->
 
-                <b-button variant="info" block>Later</b-button> <!-- TODO localize -->
+                <b-button variant="info" block @click="detail_modal_visible = false;useShoppingListStore().delayFood(food)">{{$t('Delay')}}</b-button>
 
-                <b-button variant="danger" block>{{ $t('Delete') }}</b-button>
+                <b-button variant="danger" block @click="detail_modal_visible = false;useShoppingListStore().deleteFood(food)">{{ $t('Delete') }}</b-button>
 
                 <h6 class="mt-2">Details</h6> <!-- TODO localize -->
                 <b-row v-for="e in entries" v-bind:key="e.id">
@@ -80,6 +80,8 @@ import Vue from "vue"
 import {BootstrapVue} from "bootstrap-vue"
 import "bootstrap-vue/dist/bootstrap-vue.css"
 import {ApiMixin, resolveDjangoUrl} from "@/utils/utils"
+import {useMealPlanStore} from "@/stores/MealPlanStore";
+import {useShoppingListStore} from "@/stores/ShoppingListStore";
 
 
 Vue.use(BootstrapVue)
@@ -174,6 +176,8 @@ export default {
 
     },
     methods: {
+        useShoppingListStore,
+        useMealPlanStore,
         resolveDjangoUrl,
 
         formatDate: function (datetime) {

vue/src/locales/en.json

@@ -342,6 +342,7 @@
     "copy_markdown_table": "Copy as Markdown Table",
     "in_shopping": "In Shopping List",
     "DelayUntil": "Delay Until",
+    "Delay": "Delay",
     "Pin": "Pin",
     "Unpin": "Unpin",
     "PinnedConfirmation": "{recipe} has been pinned.",

vue/src/stores/ShoppingListStore.js

@@ -73,7 +73,11 @@ export const useShoppingListStore = defineStore(_STORE_ID, {
         deleteObject(object) {
             let apiClient = new ApiApiFactory()
             return apiClient.destroyShoppingListEntry(object.id).then((r) => {
-                Vue.delete(this.category_food_entries[this.getFoodCategory(object.food)]['foods'][object.food.id], object.id)
+
+                Vue.delete(this.category_food_entries[this.getFoodCategory(object.food)]['foods'][object.food.id]['entries'], object.id)
+                if (Object.keys(this.category_food_entries[this.getFoodCategory(object.food)]['foods'][object.food.id]['entries']).length === 0) {
+                    Vue.delete(this.category_food_entries[this.getFoodCategory(object.food)]['foods'], object.food.id)
+                }
             }).catch((err) => {
                 StandardToasts.makeStandardToast(this, StandardToasts.FAIL_DELETE, err)
             })
@@ -111,10 +115,11 @@ export const useShoppingListStore = defineStore(_STORE_ID, {
              * function to handle user checking or unchecking a food
              */
 
-            this.category_food_entries[this.getFoodCategory(food)]['foods'][food.id]['entries'].forEach(e => {
-                e.checked = !e.checked
-                this.updateObject(e)
-            })
+            let entries = this.category_food_entries[this.getFoodCategory(food)]['foods'][food.id]['entries']
+            for (let i in entries) {
+                entries[i].checked = !entries[i].checked
+                this.updateObject(entries[i])
+            }
         },
         delayFood(food) {
             /**
@@ -124,10 +129,21 @@ export const useShoppingListStore = defineStore(_STORE_ID, {
             let delay = 4 //TODO get delay from settings
             let delay_date = new Date(Date.now() + delay * (60 * 60 * 1000))
 
-            this.category_food_entries[this.getFoodCategory(food)]['foods'][food.id]['entries'].forEach(e => {
-                e.delayed_until = delay_date
-                this.updateObject(e)
-            })
+            let entries = this.category_food_entries[this.getFoodCategory(food)]['foods'][food.id]['entries']
+            for (let i in entries) {
+                entries[i].delayed_until = delay_date
+                this.updateObject(entries[i])
+            }
+
+        },
+        deleteFood(food) {
+            /**
+             * function to handle user deleting all entries of a certain food
+             */
+            let entries = this.category_food_entries[this.getFoodCategory(food)]['foods'][food.id]['entries']
+            for (let i in entries) {
+                this.deleteObject(entries[i])
+            }
         },
     },
 })