merge ignore shopping with onhand

vue/src/apps/ModelListView/ModelListView.vue

@@ -19,8 +19,10 @@
                                 <!-- <span><b-button variant="link" size="sm" class="text-dark shadow-none"><i class="fas fa-chevron-down"></i></b-button></span> -->
                                 <model-menu />
                                 <span>{{ this.this_model.name }}</span>
-                                <span v-if="this_model.name !== 'Step'"
-                                    ><b-button variant="link" @click="startAction({ action: 'new' })"><i class="fas fa-plus-circle fa-2x"></i></b-button></span
+                                <span v-if="apiName !== 'Step'">
+                                    <b-button variant="link" @click="startAction({ action: 'new' })">
+                                        <i class="fas fa-plus-circle fa-2x"></i>
+                                    </b-button> </span
                                 ><!-- TODO add proper field to model config to determine if create should be available or not -->
                             </h3>
                         </div>
@@ -112,6 +114,9 @@ export default {
             // TODO this is not necessarily bad but maybe there are better options to do this
             return () => import(/* webpackChunkName: "header-component" */ `@/components/${this.header_component_name}`)
         },
+        apiName() {
+            return this.this_model?.apiName
+        },
     },
     mounted() {
         // value is passed from lists.py
@@ -291,11 +296,6 @@ export default {
                 this.refreshCard({ ...food }, this.items_right)
             })
         },
-        addOnhand: function (item) {
-            item.on_hand = true
-            this.saveThis(item)
-        },
-
         updateThis: function (item) {
             this.refreshThis(item.id)
         },

vue/src/apps/ShoppingListView/ShoppingListView.vue

@@ -493,15 +493,6 @@
                     </b-form-group>
                 </ContextMenuItem>
 
-                <ContextMenuItem
-                    @click="
-                        $refs.menu.close()
-                        ignoreThis(contextData)
-                    "
-                >
-                    <a class="dropdown-item p-2" href="#"><i class="fas fa-ban"></i> {{ $t("IgnoreThis", { food: foodName(contextData) }) }}</a>
-                </ContextMenuItem>
-
                 <ContextMenuItem
                     @click="
                         $refs.menu.close()
@@ -908,13 +899,6 @@ export default {
         getThis: function (id) {
             return this.genericAPI(this.Models.SHOPPING_CATEGORY, this.Actions.FETCH, { id: id })
         },
-        ignoreThis: function (item) {
-            let food = {
-                id: item?.[0]?.food.id ?? item.food.id,
-                ignore_shopping: true,
-            }
-            this.updateFood(food, "ignore_shopping")
-        },
         mergeShoppingList: function (data) {
             this.items.map((x) =>
                 data.map((y) => {
@@ -941,10 +925,10 @@ export default {
             let api = new ApiApiFactory()
             let food = {
                 id: item?.[0]?.food.id ?? item?.food?.id,
-                on_hand: true,
+                food_onhand: true,
             }
 
-            this.updateFood(food)
+            this.updateFood(food, "food_onhand")
                 .then((result) => {
                     let entries = this.items.filter((x) => x.food.id == food.id).map((x) => x.id)
                     this.items = this.items.filter((x) => x.food.id !== food.id)

vue/src/components/Badges.vue

@@ -1,52 +1,44 @@
 <template>
     <span>
-        <linked-recipe v-if="linkedRecipe"
-            :item="item"/>
-        <icon-badge v-if="Icon"
-            :item="item"/>
-        <on-hand-badge v-if="OnHand"
-            :item="item"/>
-        <shopping-badge v-if="Shopping"
-            :item="item"/>
+        <linked-recipe v-if="linkedRecipe" :item="item" />
+        <icon-badge v-if="Icon" :item="item" />
+        <on-hand-badge v-if="OnHand" :item="item" />
+        <shopping-badge v-if="Shopping" :item="item" />
     </span>
 </template>
 
 <script>
-import LinkedRecipe from "@/components/Badges/LinkedRecipe";
-import IconBadge from "@/components/Badges/Icon";
-import OnHandBadge from "@/components/Badges/OnHand";
-import ShoppingBadge from "@/components/Badges/Shopping";
+import LinkedRecipe from "@/components/Badges/LinkedRecipe"
+import IconBadge from "@/components/Badges/Icon"
+import OnHandBadge from "@/components/Badges/OnHand"
+import ShoppingBadge from "@/components/Badges/Shopping"
 
 export default {
-  name: 'CardBadges',
-  components: {LinkedRecipe, IconBadge, OnHandBadge, ShoppingBadge},
-  props: {
-    item: {type: Object},
-    model: {type: Object}
-  },
-  data() {
-    return {
-    }
-  },
-  mounted() {
-  },
-  computed: {
-    linkedRecipe: function () {
-        return this.model?.badges?.linked_recipe ?? false
+    name: "CardBadges",
+    components: { LinkedRecipe, IconBadge, OnHandBadge, ShoppingBadge },
+    props: {
+        item: { type: Object },
+        model: { type: Object },
     },
-    Icon: function () {
-        return this.model?.badges?.icon ?? false
+    data() {
+        return {}
     },
-    OnHand: function () {
-        return this.model?.badges?.on_hand ?? false
+    mounted() {},
+    computed: {
+        linkedRecipe: function () {
+            return this.model?.badges?.linked_recipe ?? false
+        },
+        Icon: function () {
+            return this.model?.badges?.icon ?? false
+        },
+        OnHand: function () {
+            return this.model?.badges?.food_onhand ?? false
+        },
+        Shopping: function () {
+            return this.model?.badges?.shopping ?? false
+        },
     },
-    Shopping: function () {
-        return this.model?.badges?.shopping ?? false
-    }
-  },
-  watch: {
-  },
-  methods: {
-  }
+    watch: {},
+    methods: {},
 }
-</script>
+</script>

vue/src/components/Badges/OnHand.vue

@@ -1,7 +1,7 @@
 <template>
     <span>
         <b-button
-            class="btn text-decoration-none fas px-1 py-0  border-0"
+            class="btn text-decoration-none fas px-1 py-0 border-0"
             variant="link"
             v-b-popover.hover.html
             :title="[onhand ? $t('FoodOnHand', { food: item.name }) : $t('FoodNotOnHand', { food: item.name })]"
@@ -26,16 +26,16 @@ export default {
         }
     },
     mounted() {
-        this.onhand = this.item.on_hand
+        this.onhand = this.item.food_onhand
     },
     watch: {
-        "item.on_hand": function(newVal, oldVal) {
+        "item.food_onhand": function (newVal, oldVal) {
             this.onhand = newVal
         },
     },
     methods: {
         toggleOnHand() {
-            let params = { id: this.item.id, on_hand: !this.onhand }
+            let params = { id: this.item.id, food_onhand: !this.onhand }
             this.genericAPI(this.Models.FOOD, this.Actions.UPDATE, params).then(() => {
                 this.onhand = !this.onhand
             })

vue/src/components/Badges/Shopping.vue

@@ -1,6 +1,6 @@
 <template>
     <span>
-        <b-button class="btn text-decoration-none px-1 border-0" variant="link" v-if="ShowBadge" :id="`shopping${item.id}`" @click="addShopping()">
+        <b-button class="btn text-decoration-none px-1 border-0" variant="link" :id="`shopping${item.id}`" @click="addShopping()">
             <i
                 class="fas"
                 v-b-popover.hover.html
@@ -27,7 +27,6 @@ export default {
     name: "ShoppingBadge",
     props: {
         item: { type: Object },
-        override_ignore: { type: Boolean, default: false },
     },
     mixins: [ApiMixin],
     data() {
@@ -40,13 +39,6 @@ export default {
         this.shopping = this.item?.shopping //?? random[Math.floor(Math.random() * random.length)]
     },
     computed: {
-        ShowBadge() {
-            if (this.override_ignore) {
-                return true
-            } else {
-                return !this.item.ignore_shopping
-            }
-        },
         DeleteConfirmation() {
             return this.$t("DeleteShoppingConfirm", { food: this.item.name })
         },
@@ -59,7 +51,7 @@ export default {
         },
     },
     watch: {
-        "item.shopping": function(newVal, oldVal) {
+        "item.shopping": function (newVal, oldVal) {
             this.shopping = newVal
         },
     },

vue/src/components/ContextMenu/ModelMenu.vue

@@ -1,74 +1,52 @@
 <template>
-  <!-- <b-button variant="link" size="sm" class="text-dark shadow-none"><i class="fas fa-chevron-down"></i></b-button> -->
-  <span>
-        <b-dropdown variant="link" toggle-class="text-decoration-none text-dark shadow-none" no-caret
-                    style="boundary:window">
-        <template #button-content>
-          <i class="fas fa-chevron-down"></i>
-        </template>
-        <b-dropdown-item :href="resolveDjangoUrl('list_food')">
-            <i class="fas fa-leaf fa-fw"></i> {{ Models['FOOD'].name }}
-        </b-dropdown-item>
-        
-        <b-dropdown-item :href="resolveDjangoUrl('list_keyword')">
-            <i class="fas fa-tags fa-fw"></i> {{ Models['KEYWORD'].name }}
-        </b-dropdown-item>
+    <!-- <b-button variant="link" size="sm" class="text-dark shadow-none"><i class="fas fa-chevron-down"></i></b-button> -->
+    <span>
+        <b-dropdown variant="link" toggle-class="text-decoration-none text-dark shadow-none" no-caret style="boundary: window">
+            <template #button-content>
+                <i class="fas fa-chevron-down"></i>
+            </template>
+            <b-dropdown-item :href="resolveDjangoUrl('list_food')"> <i class="fas fa-leaf fa-fw"></i> {{ Models["FOOD"].name }} </b-dropdown-item>
 
-        <b-dropdown-item :href="resolveDjangoUrl('list_unit')">
-            <i class="fas fa-balance-scale fa-fw"></i> {{ Models['UNIT'].name }}
-        </b-dropdown-item>
-        
-        <b-dropdown-item :href="resolveDjangoUrl('list_supermarket')">
-            <i class="fas fa-store-alt fa-fw"></i> {{ Models['SUPERMARKET'].name }}
-        </b-dropdown-item>
+            <b-dropdown-item :href="resolveDjangoUrl('list_keyword')"> <i class="fas fa-tags fa-fw"></i> {{ Models["KEYWORD"].name }} </b-dropdown-item>
 
-        <b-dropdown-item :href="resolveDjangoUrl('list_supermarket_category')">
-            <i class="fas fa-cubes fa-fw"></i> {{ Models['SHOPPING_CATEGORY'].name }}
-        </b-dropdown-item>
+            <b-dropdown-item :href="resolveDjangoUrl('list_unit')"> <i class="fas fa-balance-scale fa-fw"></i> {{ Models["UNIT"].name }} </b-dropdown-item>
 
-          <b-dropdown-item :href="resolveDjangoUrl('list_automation')">
-            <i class="fas fa-robot fa-fw"></i> {{ Models['AUTOMATION'].name }}
-          </b-dropdown-item>
+            <b-dropdown-item :href="resolveDjangoUrl('list_supermarket')"> <i class="fas fa-store-alt fa-fw"></i> {{ Models["SUPERMARKET"].name }} </b-dropdown-item>
 
-          <b-dropdown-item :href="resolveDjangoUrl('list_user_file')">
-            <i class="fas fa-file fa-fw"></i> {{ Models['USERFILE'].name }}
-          </b-dropdown-item>
+            <b-dropdown-item :href="resolveDjangoUrl('list_supermarket_category')"> <i class="fas fa-cubes fa-fw"></i> {{ Models["SHOPPING_CATEGORY"].name }} </b-dropdown-item>
 
-          <b-dropdown-item :href="resolveDjangoUrl('list_step')">
-            <i class="fas fa-puzzle-piece fa-fw"></i>{{ Models['STEP'].name }}
-          </b-dropdown-item>
+            <b-dropdown-item :href="resolveDjangoUrl('list_automation')"> <i class="fas fa-robot fa-fw"></i> {{ Models["AUTOMATION"].name }} </b-dropdown-item>
 
+            <b-dropdown-item :href="resolveDjangoUrl('list_user_file')"> <i class="fas fa-file fa-fw"></i> {{ Models["USERFILE"].name }} </b-dropdown-item>
+
+            <b-dropdown-item :href="resolveDjangoUrl('list_step')"> <i class="fas fa-puzzle-piece fa-fw"></i>{{ Models["STEP"].name }} </b-dropdown-item>
         </b-dropdown>
     </span>
 </template>
 
 <script>
+import Vue from "vue"
+import { BootstrapVue } from "bootstrap-vue"
+import "bootstrap-vue/dist/bootstrap-vue.css"
 
-import Vue from 'vue'
-import {BootstrapVue} from 'bootstrap-vue'
-import 'bootstrap-vue/dist/bootstrap-vue.css'
-
-import {Models} from "@/utils/models";
-import {ResolveUrlMixin} from "@/utils/utils";
-
+import { Models } from "@/utils/models"
+import { ResolveUrlMixin } from "@/utils/utils"
 
 Vue.use(BootstrapVue)
 
 export default {
-  name: 'ModelMenu',
-  mixins: [ResolveUrlMixin],
-  data() {
-    return {
-      Models: Models
-    }
-  },
-  mounted() {
-  },
-  methods: {
-    gotoURL: function (model) {
-      return
-    }
-  }
+    name: "ModelMenu",
+    mixins: [ResolveUrlMixin],
+    data() {
+        return {
+            Models: Models,
+        }
+    },
+    mounted() {},
+    methods: {
+        gotoURL: function (model) {
+            return
+        },
+    },
 }
-
-</script>
+</script>

vue/src/components/GenericHorizontalCard.vue

@@ -191,7 +191,7 @@ export default {
             return this.model?.ordered_tags ?? []
         },
         getFullname: function () {
-            if (!this.item?.full_name.includes(">")) {
+            if (!this.item?.full_name?.includes(">")) {
                 return undefined
             }
             return this.item?.full_name

vue/src/components/GenericPill.vue

@@ -10,12 +10,7 @@
 export default {
     name: "GenericPill",
     props: {
-        item_list: {
-            type: Array,
-            default() {
-                return []
-            },
-        },
+        item_list: { type: Object },
         label: { type: String, default: "name" },
         color: { type: String, default: "light" },
     },

vue/src/components/IngredientComponent.vue

@@ -33,31 +33,20 @@
                 </div>
             </td>
             <td v-else-if="show_shopping" class="text-right text-nowrap">
-                <!-- in shopping mode and ingredient is not ignored -->
-                <div v-if="!ingredient.food.ignore_shopping">
-                    <b-button
-                        class="btn text-decoration-none fas fa-shopping-cart px-2 user-select-none"
-                        variant="link"
-                        v-b-popover.hover.click.blur.html.top="{ title: ShoppingPopover, variant: 'outline-dark' }"
-                        :class="{
-                            'text-success': shopping_status === true,
-                            'text-muted': shopping_status === false,
-                            'text-warning': shopping_status === null,
-                        }"
-                    />
-                    <span class="px-2">
-                        <input type="checkbox" class="align-middle" v-model="shop" @change="changeShopping" />
-                    </span>
-                    <on-hand-badge :item="ingredient.food" />
-                </div>
-                <div v-else>
-                    <!-- or in shopping mode and food is ignored: Shopping Badge bypasses linking ingredient to Recipe which would get ignored -->
-                    <shopping-badge :item="ingredient.food" :override_ignore="true" class="px-1" />
-                    <span class="px-2">
-                        <input type="checkbox" class="align-middle" disabled v-b-popover.hover.click.blur :title="$t('IgnoredFood', { food: ingredient.food.name })" />
-                    </span>
-                    <on-hand-badge :item="ingredient.food" />
-                </div>
+                <b-button
+                    class="btn text-decoration-none fas fa-shopping-cart px-2 user-select-none"
+                    variant="link"
+                    v-b-popover.hover.click.blur.html.top="{ title: ShoppingPopover, variant: 'outline-dark' }"
+                    :class="{
+                        'text-success': shopping_status === true,
+                        'text-muted': shopping_status === false,
+                        'text-warning': shopping_status === null,
+                    }"
+                />
+                <span class="px-2">
+                    <input type="checkbox" class="align-middle" v-model="shop" @change="changeShopping" />
+                </span>
+                <on-hand-badge :item="ingredient.food" />
             </td>
         </template>
     </tr>
@@ -66,11 +55,10 @@
 <script>
 import { calculateAmount, ResolveUrlMixin, ApiMixin } from "@/utils/utils"
 import OnHandBadge from "@/components/Badges/OnHand"
-import ShoppingBadge from "@/components/Badges/Shopping"
 
 export default {
     name: "IngredientComponent",
-    components: { OnHandBadge, ShoppingBadge },
+    components: { OnHandBadge },
     props: {
         ingredient: Object,
         ingredient_factor: { type: Number, default: 1 },
@@ -129,7 +117,7 @@ export default {
                 } else {
                     // there are not recipes in the shopping list
                     // set default value
-                    this.shop = !this.ingredient?.food?.on_hand && !this.ingredient?.food?.ignore_shopping && !this.ingredient?.food?.recipe
+                    this.shop = !this.ingredient?.food?.food_onhand && !this.ingredient?.food?.recipe
                     this.$emit("add-to-shopping", { item: this.ingredient, add: this.shop })
                     // mark checked if the food is in the shopping list for this ingredient/recipe
                     if (count_shopping_ingredient >= 1) {
@@ -146,8 +134,8 @@ export default {
 
                 if (this.add_shopping_mode) {
                     // if we are in add shopping mode (e.g. recipe_shopping_modal) start with all checks marked
-                    // except if on_hand and ignore_shopping (could be if recipe too?)
-                    this.shop = !this.ingredient?.food?.on_hand && !this.ingredient?.food?.ignore_shopping && !this.ingredient?.food?.recipe
+                    // except if on_hand (could be if recipe too?)
+                    this.shop = !this.ingredient?.food?.food_onhand && !this.ingredient?.food?.recipe
                 }
             },
         },

vue/src/components/Modals/ShoppingModal.vue

@@ -106,7 +106,7 @@ export default {
                         ...this.steps
                             .map((x) => x.ingredients)
                             .flat()
-                            .filter((x) => !x?.food?.on_hand && !x?.food?.ignore_shopping)
+                            .filter((x) => !x?.food?.food_onhand)
                             .map((x) => x.id),
                     ]
                     this.recipe_servings = result.data?.servings
@@ -141,7 +141,7 @@ export default {
                                     .flat()
                                     .map((x) => x.ingredients)
                                     .flat()
-                                    .filter((x) => !x.food.on_hand && !x.food.ignore_shopping)
+                                    .filter((x) => !x.food.override_ignore)
                                     .map((x) => x.id),
                             ]
                         })

vue/src/locales/en.json

@@ -179,7 +179,7 @@
     "AddToShopping": "Add to shopping list",
     "IngredientInShopping": "This ingredient is in your shopping list.",
     "NotInShopping": "{food} is not in your shopping list.",
-    "OnHand": "Have On Hand",
+    "OnHand": "Currently On Hand",
     "FoodOnHand": "You have {food} on hand.",
     "FoodNotOnHand": "You do not have {food} on hand.",
     "Undefined": "Undefined",
@@ -240,13 +240,13 @@
     "shopping_share": "Share Shopping List",
     "shopping_auto_sync": "Autosync",
     "mealplan_autoadd_shopping": "Auto Add Meal Plan",
-    "mealplan_autoexclude_onhand": "Exclude On Hand",
+    "mealplan_autoexclude_onhand": "Exclude Food On Hand",
     "mealplan_autoinclude_related": "Add Related Recipes",
     "default_delay": "Default Delay Hours",
     "shopping_share_desc": "Users will see all items you add to your shopping list.  They must add you to see items on their list.",
     "shopping_auto_sync_desc": "Setting to 0 will disable auto sync. When viewing a shopping list the list is updated every set seconds to sync changes someone else might have made. Useful when shopping with multiple people but will use mobile data.",
     "mealplan_autoadd_shopping_desc": "Automatically add meal plan ingredients to shopping list.",
-    "mealplan_autoexclude_onhand_desc": "When adding a meal plan to the shopping list (manually or automatically), exclude ingredients that are on hand.",
+    "mealplan_autoexclude_onhand_desc": "When adding a meal plan to the shopping list (manually or automatically), exclude ingredients that are currently on hand.",
     "mealplan_autoinclude_related_desc": "When adding a meal plan to the shopping list (manually or automatically), include all related recipes.",
     "default_delay_desc": "Default number of hours to delay a shopping list entry.",
     "filter_to_supermarket": "Filter to Supermarket",

vue/src/utils/models.js

@@ -69,14 +69,14 @@ export class Models {
         onhand: true,
         badges: {
             linked_recipe: true,
-            on_hand: true,
+            food_onhand: true,
             shopping: true,
         },
         tags: [{ field: "supermarket_category", label: "name", color: "info" }],
         // REQUIRED: unordered array of fields that can be set during create
         create: {
             // if not defined partialUpdate will use the same parameters, prepending 'id'
-            params: [["name", "description", "recipe", "ignore_shopping", "supermarket_category", "on_hand", "inherit", "ignore_inherit"]],
+            params: [["name", "description", "recipe", "food_onhand", "supermarket_category", "inherit", "ignore_inherit"]],
 
             form: {
                 name: {
@@ -103,13 +103,7 @@ export class Models {
                 shopping: {
                     form_field: true,
                     type: "checkbox",
-                    field: "ignore_shopping",
-                    label: i18n.t("Ignore_Shopping"),
-                },
-                onhand: {
-                    form_field: true,
-                    type: "checkbox",
-                    field: "on_hand",
+                    field: "food_onhand",
                     label: i18n.t("OnHand"),
                 },
                 shopping_category: {
@@ -507,6 +501,14 @@ export class Models {
         apiName: "User",
         paginated: false,
     }
+
+    static STEP = {
+        name: i18n.t("Step"),
+        apiName: "Step",
+        list: {
+            params: ["recipe", "query", "page", "pageSize", "options"],
+        },
+    }
 }
 
 export class Actions {