jacob/munch-ease-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Made stocktaking by checkbox

Browse source
This commit is contained in:
jableader 2024-05-19 22:19:51 +10:00
parent 2ceaf3d923
commit 2db2251a1b
1 changed files with 13 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/components/shopping/FullShoppingListPage.vue
View file

@ -1,13 +1,19 @@
<template> <template>
<h3>Full shopping list</h3> <h3>Full shopping list</h3>
<input type="checkbox" id="show-found" v-model="stockTaking" />
<label for="show-found">Show Stocktaking</label>
<h4>Included Meals</h4> <h4>Included Meals</h4>
<meal-selection-list @meal-selected="mealSelected" @meal-unselected="mealUnselected" :checked="includedMeals" :meals="availableMeals" /> <meal-selection-list @meal-selected="mealSelected" @meal-unselected="mealUnselected" :checked="includedMeals" :meals="availableMeals" />
<ul class="full-shopping-list"> <ul class="full-shopping-list">
<li v-for="item in listByProduct" :key="item.id" > <li v-for="item in productsToShow" :key="item.id">
<shopping-list-item :product="item.product" :sources="item.sources" :totals="item.totals" :fully-found="item.fullyFound" :found-date="item.foundDate" /> <shopping-list-item :product="item.product" :sources="item.sources" :totals="item.totals" :fully-found="item.fullyFound" :found-date="item.foundDate" />
<button v-if="item.fullyFound" @click="markNotFound(item)">Mark Not Found</button> <span v-if="stockTaking">
<button v-else @click="markFound(item)">Mark Found</button> <button v-if="item.fullyFound" @click="markNotFound(item)">Mark Not Found</button>
<button v-else @click="markFound(item)">Mark Found</button>
</span>
</li> </li>
</ul> </ul>
</template> </template>
@ -49,7 +55,7 @@ export default {
const to = new Date(); const to = new Date();
to.setDate(to.getDate() + 7); to.setDate(to.getDate() + 7);
return { from, to, availableMeals: [], shoppingList: null, includedMeals: [], listByProduct: [] } return { from, to, availableMeals: [], shoppingList: null, includedMeals: [], listByProduct: [], stockTaking: true, productsToShow: []}
}, },
async beforeMount() { async beforeMount() {
this.availableMeals = await data.getMeals(this.from, this.to); this.availableMeals = await data.getMeals(this.from, this.to);
@ -59,7 +65,8 @@ export default {
shoppingList: { shoppingList: {
handler: 'updateLists', handler: 'updateLists',
deep: true deep: true
} },
stockTaking: 'updateLists'
}, },
methods: { methods: {
async updateLists() { async updateLists() {
@ -68,6 +75,7 @@ export default {
this.includedMeals = this.shoppingList.requests.map(r => r.meal).filter(m => m); this.includedMeals = this.shoppingList.requests.map(r => r.meal).filter(m => m);
this.listByProduct = toProductsModel(this.shoppingList); this.listByProduct = toProductsModel(this.shoppingList);
this.productsToShow = this.stockTaking ? this.listByProduct : this.listByProduct.filter(p => !p.fullyFound);
}, },
async mealSelected(meal) { async mealSelected(meal) {
const request = await data.requestMeal(meal.id); const request = await data.requestMeal(meal.id);