src/components/ingredients/EditableIngredientsPanel.vue

@@ -74,7 +74,6 @@ li > div {
 </style>
 
 <script>
-
 import data from '@/data.js'
 import IngredientLine from './IngredientLine.vue'
 import CompactParsedIngredient from './CompactParsedIngredient.vue'

src/components/meals/EditMealPage.vue

@@ -29,7 +29,7 @@
         </div>
         <div class="ingredients">
             <h2>Sides & Additional Ingredients</h2>
-            <editable-ingredients-panel :ingredients="meal.extra_ingredients" @on-add="addIngredient" @on-delete="deleteIngredient" @on-update-ingredient="updateIngredient" @on-editing="onEditAdditionalIngredients" />
+            <editable-ingredients-panel :ingredients="meal.extra_ingredients" @on-add="addIngredient" @on-delete="deleteIngredient" @on-update-ingredient="updateIngredient" />
         </div>
         <button @click="saveMeal" v-if="!meal.purchase_date">Save</button>
     </div>
@@ -69,10 +69,6 @@ export default {
         if (this.id >= 0) {
             this.meal = await data.getMeal(this.id);
         }
-        else {
-            const self = await data.currentUser();
-            this.meal = {...this.meal, chefs: [self], consumers: [self], cleanup: [self], };
-        }
     },
     methods: {
         async selectRecipe(recipe) {
@@ -119,14 +115,6 @@ export default {
             }
 
             alert('Failed to save meal');
-        },
-        onEditAdditionalIngredients(editing) {
-            if (editing && this.meal.extra_ingredients.length === 0) {
-                this.addIngredient();
-            }
-            else {
-                this.meal.extra_ingredients = this.meal.extra_ingredients.filter(i => i.line);
-            }
         }
     }
 }

src/components/meals/MealPlanPage.vue

@@ -14,9 +14,9 @@
                 </ul>
             </li>
         </ul>
-        <div v-if="!meals.length">
+        <ul v-if="!meals.length">
-            <em>No meals planned</em>
+            <li>No meals planned</li>
-        </div>
+        </ul>
         <action-item title="Plan Meal" :image="require('@/assets/plan-meal.svg')" @click="() => this.$router.push('/meals/add')" />
     </div>
 </template>
@@ -60,6 +60,7 @@ ul.actions {
 .actions li {
     display: block;
     border: 1px solid #ccc;
+    padding: 2ex;
 }
 
 .actions li:hover {
@@ -72,8 +73,6 @@ ul.actions {
     color: #000;
     width: 100%;
     cursor: pointer;
-    padding-top: 2ex;
-    padding-bottom: 2ex;
 }
 
 </style>

src/components/shopping/CurrentShoppingListPage.vue

@@ -1,7 +1,7 @@
 <template>
     <h3>Full shopping list</h3>
     
-    <input type="checkbox" id="show-found" @change="onCheckboxChange" :checked="stockTaking" />
+    <input type="checkbox" id="show-found" v-model="stockTaking" />
     <label for="show-found">Show Stocktaking</label>
     
     <h4>Included Meals</h4>
@@ -47,12 +47,6 @@ import ShoppingListItem from './ShoppingListItem.vue'
 export default {
     name: 'FullShoppingListPage',
     components: { MealSelectionList, ShoppingListItem },
-    props: {
-        stockTaking: {
-            type: Boolean,
-            default: false
-        },
-    },
     data() {
         const from = new Date();
         from.setTime(0);
@@ -60,7 +54,7 @@ export default {
         const to = new Date();
         to.setDate(to.getDate() + 7);
 
-        return { from, to, availableMeals: [], shoppingList: null, includedMeals: [], listByProduct: [], productsToShow: []}
+        return { from, to, availableMeals: [], shoppingList: null, includedMeals: [], listByProduct: [], stockTaking: false, productsToShow: []}
     },
     async beforeMount() {
         const allMeals = await data.getUpcomingMeals(this.from, this.to);
@@ -105,9 +99,6 @@ export default {
         async markPurchased() {
             const result = await data.markCurrentShoppingListPurchased();
             this.$router.push({ name: 'PurchasedShoppingListPage', params: { id: result.id } });
-        },
-        onCheckboxChange(event) {
-            this.$router.push({ query: { stockTaking: event.target.checked ? 'true' : undefined } });
         }
     }
 }

src/main.js

@@ -22,7 +22,7 @@ const routes = [
     { path: '/mealplan', component: MealPlanPage },
     { path: '/login', component: LoginPage },
     { path: '/shopping', component: MyShoppingPage },
-    { path: '/shopping/current', component: CurrentShoppingListPage, props: route => ({ stockTaking: !!route.query.stockTaking }) },
+    { path: '/shopping/current', component: CurrentShoppingListPage },
     { path: '/shopping/:id', component: PurchasedShoppingListPage, props : true },
     { path: '/recipes', component: RecipesPage },
     { path: '/recipes/add', component: EditRecipePage },