Fix after rebase
This commit is contained in:
smilerz
parent
c5c76cadea
commit
4377505b14
@ -34,8 +34,7 @@ class ExtendedRecipeMixin(serializers.ModelSerializer):
|
|||||||
except KeyError:
|
except KeyError:
|
||||||
api_serializer = None
|
api_serializer = None
|
||||||
# extended values are computationally expensive and not needed in normal circumstances
|
# extended values are computationally expensive and not needed in normal circumstances
|
||||||
# another choice is to only return the fields when self.__class__ = serializer and not worry about 'extended'
|
if self.context.get('request', False) and bool(int(self.context['request'].query_params.get('extended', False))) and self.__class__ == api_serializer:
|
||||||
if self.context['request'] and bool(int(self.context['request'].query_params.get('extended', False))) and self.__class__ == api_serializer:
|
|
||||||
return fields
|
return fields
|
||||||
else:
|
else:
|
||||||
del fields['image']
|
del fields['image']
|
||||||
|
|||||||
255
vue/src/apps/ChecklistView/ChecklistView.vue
Normal file
255
vue/src/apps/ChecklistView/ChecklistView.vue
Normal file
@ -0,0 +1,255 @@
|
|||||||
|
<template>
|
||||||
|
<div id="app" style="margin-bottom: 4vh" v-if="this_model">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-2 d-none d-md-block">
|
||||||
|
</div>
|
||||||
|
<div class="col-xl-8 col-12">
|
||||||
|
<div class="container-fluid d-flex flex-column flex-grow-1">
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-6" style="margin-top: 1vh">
|
||||||
|
<h3>
|
||||||
|
<!-- <model-menu/> Replace with a List Menu or a Checklist Menu? -->
|
||||||
|
<span>{{ this.this_model.name }}</span>
|
||||||
|
<span><b-button variant="link" @click="startAction({'action':'new'})"><i
|
||||||
|
class="fas fa-plus-circle fa-2x"></i></b-button></span>
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col col-md-12">
|
||||||
|
<b-table small :items="items" :fields="fields" :busy="loading">
|
||||||
|
<template #cell(checked)="data">
|
||||||
|
<b-form-checkbox
|
||||||
|
v-model="data.item.checked"
|
||||||
|
@change="checkboxChanged(data.item)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template #cell(all_notes)="data">
|
||||||
|
{{ formatNotes(data.item) }}
|
||||||
|
</template>
|
||||||
|
</b-table>
|
||||||
|
<!-- <div v-for="i in items" v-bind:key="i.id">
|
||||||
|
{{i.supermarket_category}} --- {{i.food && i.food.name || 'null'}} --- {{i.id}} --- {{i.checked}} --- {{i.amount}} --- {{i.unit && i.unit.name || 'null'}} --- {{i.list_recipe && i.list_recipe.recipe_name || 'null'}} --- {{allNotes(i)}}
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
import Vue from 'vue'
|
||||||
|
import {BootstrapVue} from 'bootstrap-vue'
|
||||||
|
|
||||||
|
import 'bootstrap-vue/dist/bootstrap-vue.css'
|
||||||
|
|
||||||
|
import {ApiMixin} from "@/utils/utils";
|
||||||
|
import {StandardToasts} from "@/utils/utils";
|
||||||
|
|
||||||
|
Vue.use(BootstrapVue)
|
||||||
|
|
||||||
|
export default {
|
||||||
|
// TODO ApiGenerator doesn't capture and share error information - would be nice to share error details when available
|
||||||
|
// or i'm capturing it incorrectly
|
||||||
|
name: 'ChecklistView',
|
||||||
|
mixins: [ApiMixin],
|
||||||
|
components: { },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// this.Models and this.Actions inherited from ApiMixin
|
||||||
|
items: [],
|
||||||
|
this_model: undefined,
|
||||||
|
model_menu: undefined,
|
||||||
|
this_action: undefined,
|
||||||
|
this_item: {},
|
||||||
|
show_modal: false,
|
||||||
|
fields: [
|
||||||
|
{
|
||||||
|
'key': 'checked',
|
||||||
|
'label': '',
|
||||||
|
class: 'text-center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'key': 'food.supermarket_category.name',
|
||||||
|
'label': this.$t('Category'),
|
||||||
|
'formatter': 'formatCategory',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'key': 'amount',
|
||||||
|
class: 'text-center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'key': 'unit.name',
|
||||||
|
'label': this.$t('Unit')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'key': 'food.name',
|
||||||
|
'label': this.$t('Food')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'key': 'recipe_mealplan.name',
|
||||||
|
'label': this.$t('Recipe'),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'key': 'all_notes',
|
||||||
|
'label': this.$t('Notes'),
|
||||||
|
'formatter': 'formatNotes',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'key': 'created_by.username',
|
||||||
|
'label': this.$t('Added_by'),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'key': 'created_at',
|
||||||
|
'label': this.$t('Added_on'),
|
||||||
|
'formatter': 'formatDate',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
loading: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// value is passed from lists.py
|
||||||
|
let model_config = JSON.parse(document.getElementById('model_config').textContent)
|
||||||
|
this.this_model = this.Models[model_config?.model]
|
||||||
|
this.getItems()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// this.genericAPI inherited from ApiMixin
|
||||||
|
startAction: function (e, param) {
|
||||||
|
let source = e?.source ?? {}
|
||||||
|
this.this_item = source
|
||||||
|
// remove recipe from shopping list
|
||||||
|
// mark on-hand
|
||||||
|
// mark puchased
|
||||||
|
// edit shopping category on food
|
||||||
|
// delete food from shopping list
|
||||||
|
// add food to shopping list
|
||||||
|
// add other to shopping list
|
||||||
|
// edit unit conversion
|
||||||
|
// edit purchaseable unit
|
||||||
|
switch (e.action) {
|
||||||
|
case 'delete':
|
||||||
|
this.this_action = this.Actions.DELETE
|
||||||
|
this.show_modal = true
|
||||||
|
break;
|
||||||
|
case 'new':
|
||||||
|
this.this_action = this.Actions.CREATE
|
||||||
|
this.show_modal = true
|
||||||
|
break;
|
||||||
|
case 'edit':
|
||||||
|
this.this_item = e.source
|
||||||
|
this.this_action = this.Actions.UPDATE
|
||||||
|
this.show_modal = true
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
finishAction: function (e) {
|
||||||
|
let update = undefined
|
||||||
|
switch (e?.action) {
|
||||||
|
case 'save':
|
||||||
|
this.saveThis(e.form_data)
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
if (e !== 'cancel') {
|
||||||
|
switch (this.this_action) {
|
||||||
|
case this.Actions.DELETE:
|
||||||
|
this.deleteThis(this.this_item.id)
|
||||||
|
break;
|
||||||
|
case this.Actions.CREATE:
|
||||||
|
this.saveThis(e.form_data)
|
||||||
|
break;
|
||||||
|
case this.Actions.UPDATE:
|
||||||
|
update = e.form_data
|
||||||
|
update.id = this.this_item.id
|
||||||
|
this.saveThis(update)
|
||||||
|
break;
|
||||||
|
case this.Actions.MERGE:
|
||||||
|
this.mergeThis(this.this_item, e.form_data.target, false)
|
||||||
|
break;
|
||||||
|
case this.Actions.MOVE:
|
||||||
|
this.moveThis(this.this_item.id, e.form_data.target.id)
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.clearState()
|
||||||
|
},
|
||||||
|
getItems: function (params={}) {
|
||||||
|
params.options = {'query':{'extended': 1}} // returns extended values in API response
|
||||||
|
this.genericAPI(this.this_model, this.Actions.LIST, params).then((results) => {
|
||||||
|
console.log('generic', results, results.data?.length)
|
||||||
|
if (results.data?.length) {
|
||||||
|
this.items = results.data
|
||||||
|
} else {
|
||||||
|
console.log('no data returned')
|
||||||
|
}
|
||||||
|
}).catch((err) => {
|
||||||
|
console.log(err)
|
||||||
|
StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getThis: function (id) {
|
||||||
|
return this.genericAPI(this.this_model, this.Actions.FETCH, {'id': id})
|
||||||
|
},
|
||||||
|
saveThis: function (thisItem, toast=true) {
|
||||||
|
if (!thisItem?.id) { // if there is no item id assume it's a new item
|
||||||
|
this.genericAPI(this.this_model, this.Actions.CREATE, thisItem).then((result) => {
|
||||||
|
// this.items = result.data - refresh the list here
|
||||||
|
if (toast) { StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE) }
|
||||||
|
}).catch((err) => {
|
||||||
|
console.log(err)
|
||||||
|
if (toast) { StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE) }
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.genericAPI(this.this_model, this.Actions.UPDATE, thisItem).then((result) => {
|
||||||
|
// this.refreshThis(thisItem.id) refresh the list here
|
||||||
|
if (toast) { StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE) }
|
||||||
|
}).catch((err) => {
|
||||||
|
console.log(err, err.response)
|
||||||
|
if (toast) { StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE) }
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getRecipe: function (item) {
|
||||||
|
// change to get pop up card? maybe same for unit and food?
|
||||||
|
},
|
||||||
|
deleteThis: function (id) {
|
||||||
|
this.genericAPI(this.this_model, this.Actions.DELETE, {'id': id}).then((result) => {
|
||||||
|
StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
|
||||||
|
}).catch((err) => {
|
||||||
|
console.log(err)
|
||||||
|
StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
clearState: function () {
|
||||||
|
this.show_modal = false
|
||||||
|
this.this_action = undefined
|
||||||
|
this.this_item = undefined
|
||||||
|
},
|
||||||
|
formatCategory: function(value) {
|
||||||
|
return value || this.$t('Undefined')
|
||||||
|
},
|
||||||
|
formatNotes: function (item) {
|
||||||
|
return [item?.recipe_mealplan?.mealplan_note, item?.ingredient_note,].filter(String).join("\n")
|
||||||
|
},
|
||||||
|
formatDate: function (datetime) {
|
||||||
|
return Intl.DateTimeFormat(window.navigator.language, { dateStyle: 'short', timeStyle: 'short' }).format(Date.parse(datetime))
|
||||||
|
},
|
||||||
|
checkboxChanged: function(item) {
|
||||||
|
this.saveThis(item, false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!--style src="vue-multiselect/dist/vue-multiselect.min.css"></style-->
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -64,7 +64,7 @@ import { BootstrapVue } from "bootstrap-vue"
|
|||||||
|
|
||||||
import "bootstrap-vue/dist/bootstrap-vue.css"
|
import "bootstrap-vue/dist/bootstrap-vue.css"
|
||||||
|
|
||||||
import { CardMixin, ApiMixin, getConfig, StandardToasts, getUserPreference, makeToast } from "@/utils/utils"
|
import { CardMixin, ApiMixin, getConfig, StandardToasts } from "@/utils/utils"
|
||||||
|
|
||||||
import GenericInfiniteCards from "@/components/GenericInfiniteCards"
|
import GenericInfiniteCards from "@/components/GenericInfiniteCards"
|
||||||
import GenericHorizontalCard from "@/components/GenericHorizontalCard"
|
import GenericHorizontalCard from "@/components/GenericHorizontalCard"
|
||||||
|
|||||||
236
vue/src/components/Ingredient.vue
Normal file
236
vue/src/components/Ingredient.vue
Normal file
@ -0,0 +1,236 @@
|
|||||||
|
<template>
|
||||||
|
<tr>
|
||||||
|
<template v-if="ingredient.is_header">
|
||||||
|
<td colspan="5" @click="done">
|
||||||
|
<b>{{ ingredient.note }}</b>
|
||||||
|
</td>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template v-else>
|
||||||
|
<td class="d-print-non" v-if="detailed && !add_shopping_mode" @click="done">
|
||||||
|
<i class="far fa-check-circle text-success" v-if="ingredient.checked"></i>
|
||||||
|
<i class="far fa-check-circle text-primary" v-if="!ingredient.checked"></i>
|
||||||
|
</td>
|
||||||
|
<td class="text-nowrap" @click="done">
|
||||||
|
<span v-if="ingredient.amount !== 0" v-html="calculateAmount(ingredient.amount)"></span>
|
||||||
|
</td>
|
||||||
|
<td @click="done">
|
||||||
|
<span v-if="ingredient.unit !== null && !ingredient.no_amount">{{ ingredient.unit.name }}</span>
|
||||||
|
</td>
|
||||||
|
<td @click="done">
|
||||||
|
<template v-if="ingredient.food !== null">
|
||||||
|
<i
|
||||||
|
v-if="show_shopping && !add_shopping_mode"
|
||||||
|
class="far fa-edit fa-sm px-1"
|
||||||
|
@click="editFood()"
|
||||||
|
></i>
|
||||||
|
<a
|
||||||
|
:href="resolveDjangoUrl('view_recipe', ingredient.food.recipe.id)"
|
||||||
|
v-if="ingredient.food.recipe !== null"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
>{{ ingredient.food.name }}</a
|
||||||
|
>
|
||||||
|
<span v-if="ingredient.food.recipe === null">{{ ingredient.food.name }}</span>
|
||||||
|
</template>
|
||||||
|
</td>
|
||||||
|
<td v-if="detailed && !show_shopping">
|
||||||
|
<div v-if="ingredient.note">
|
||||||
|
<span v-b-popover.hover="ingredient.note" class="d-print-none touchable">
|
||||||
|
<i class="far fa-comment"></i>
|
||||||
|
</span>
|
||||||
|
<!-- v-if="ingredient.note.length > 15" -->
|
||||||
|
<!-- <span v-else>-->
|
||||||
|
<!-- {{ ingredient.note }}-->
|
||||||
|
<!-- </span>-->
|
||||||
|
|
||||||
|
<div class="d-none d-print-block">
|
||||||
|
<i class="far fa-comment-alt d-print-none"></i> {{ ingredient.note }}
|
||||||
|
</div>
|
||||||
|
</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>
|
||||||
|
</td>
|
||||||
|
</template>
|
||||||
|
</tr>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { calculateAmount, ResolveUrlMixin, ApiMixin } from "@/utils/utils"
|
||||||
|
import OnHandBadge from "@/components/Badges/OnHand"
|
||||||
|
import ShoppingBadge from "@/components/Badges/Shopping"
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "Ingredient",
|
||||||
|
components: { OnHandBadge, ShoppingBadge },
|
||||||
|
props: {
|
||||||
|
ingredient: Object,
|
||||||
|
ingredient_factor: { type: Number, default: 1 },
|
||||||
|
detailed: { type: Boolean, default: true },
|
||||||
|
recipe_list: { type: Number }, // ShoppingListRecipe ID, to filter ShoppingStatus
|
||||||
|
show_shopping: { type: Boolean, default: false },
|
||||||
|
add_shopping_mode: { type: Boolean, default: false },
|
||||||
|
shopping_list: {
|
||||||
|
type: Array,
|
||||||
|
default() {
|
||||||
|
return []
|
||||||
|
},
|
||||||
|
}, // list of unchecked ingredients in shopping list
|
||||||
|
},
|
||||||
|
mixins: [ResolveUrlMixin, ApiMixin],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
checked: false,
|
||||||
|
shopping_status: null,
|
||||||
|
shopping_items: [],
|
||||||
|
shop: false,
|
||||||
|
dirty: undefined,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
ShoppingListAndFilter: {
|
||||||
|
immediate: true,
|
||||||
|
handler(newVal, oldVal) {
|
||||||
|
let filtered_list = this.shopping_list
|
||||||
|
// if a recipe list is provided, filter the shopping list
|
||||||
|
if (this.recipe_list) {
|
||||||
|
filtered_list = filtered_list.filter((x) => x.list_recipe == this.recipe_list)
|
||||||
|
}
|
||||||
|
// how many ShoppingListRecipes are there for this recipe?
|
||||||
|
let count_shopping_recipes = [...new Set(filtered_list.map((x) => x.list_recipe))].length
|
||||||
|
let count_shopping_ingredient = filtered_list.filter((x) => x.ingredient == this.ingredient.id).length
|
||||||
|
|
||||||
|
if (count_shopping_recipes > 1) {
|
||||||
|
this.shop = false // don't check any boxes until user selects a shopping list to edit
|
||||||
|
if (count_shopping_ingredient >= 1) {
|
||||||
|
this.shopping_status = true
|
||||||
|
} else if (this.ingredient.food.shopping) {
|
||||||
|
this.shopping_status = null // food is in the shopping list, just not for this ingredient/recipe
|
||||||
|
} else {
|
||||||
|
this.shopping_status = false // food is not in any shopping list
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// mark checked if the food is in the shopping list for this ingredient/recipe
|
||||||
|
if (count_shopping_ingredient >= 1) {
|
||||||
|
// ingredient is in this shopping list
|
||||||
|
this.shop = true
|
||||||
|
this.shopping_status = true
|
||||||
|
} else if (count_shopping_ingredient == 0 && this.ingredient.food.shopping) {
|
||||||
|
// food is in the shopping list, just not for this ingredient/recipe
|
||||||
|
this.shop = false
|
||||||
|
this.shopping_status = null
|
||||||
|
} else {
|
||||||
|
// the food is not in any shopping list
|
||||||
|
this.shop = false
|
||||||
|
this.shopping_status = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// if we are in add shopping mode start with all checks marked
|
||||||
|
if (this.add_shopping_mode) {
|
||||||
|
this.shop =
|
||||||
|
!this.ingredient.food.on_hand &&
|
||||||
|
!this.ingredient.food.ignore_shopping &&
|
||||||
|
!this.ingredient.food.recipe
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {},
|
||||||
|
computed: {
|
||||||
|
ShoppingListAndFilter() {
|
||||||
|
// hack to watch the shopping list and the recipe list at the same time
|
||||||
|
return this.shopping_list.map((x) => x.id).join(this.recipe_list)
|
||||||
|
},
|
||||||
|
ShoppingPopover() {
|
||||||
|
if (this.shopping_status == false) {
|
||||||
|
return this.$t("NotInShopping", { food: this.ingredient.food.name })
|
||||||
|
} else {
|
||||||
|
let list = this.shopping_list.filter((x) => x.food.id == this.ingredient.food.id)
|
||||||
|
let category =
|
||||||
|
this.$t("Category") + ": " + this.ingredient?.food?.supermarket_category?.name ??
|
||||||
|
this.$t("Undefined")
|
||||||
|
let popover = []
|
||||||
|
|
||||||
|
list.forEach((x) => {
|
||||||
|
popover.push(
|
||||||
|
[
|
||||||
|
"<tr style='border-bottom: 1px solid #ccc'>",
|
||||||
|
"<td style='padding: 3px;'><em>",
|
||||||
|
x?.recipe_mealplan?.name ?? "",
|
||||||
|
"</em></td>",
|
||||||
|
"<td style='padding: 3px;'>",
|
||||||
|
x?.amount ?? "",
|
||||||
|
"</td>",
|
||||||
|
"<td style='padding: 3px;'>",
|
||||||
|
x?.unit?.name ?? "" + "</td>",
|
||||||
|
"<td style='padding: 3px;'>",
|
||||||
|
x?.food?.name ?? "",
|
||||||
|
"</td></tr>",
|
||||||
|
].join("")
|
||||||
|
)
|
||||||
|
})
|
||||||
|
return (
|
||||||
|
"<table class='table-small'><th colspan='4'>" + category + "</th>" + popover.join("") + "</table>"
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
calculateAmount: function(x) {
|
||||||
|
return calculateAmount(x, this.ingredient_factor)
|
||||||
|
},
|
||||||
|
// sends parent recipe ingredient to notify complete has been toggled
|
||||||
|
done: function() {
|
||||||
|
this.$emit("checked-state-changed", this.ingredient)
|
||||||
|
},
|
||||||
|
// sends true/false to parent to save all ingredient shopping updates as a batch
|
||||||
|
changeShopping: function() {
|
||||||
|
this.$emit("add-to-shopping", { item: this.ingredient, add: this.shop })
|
||||||
|
},
|
||||||
|
editFood: function() {
|
||||||
|
console.log("edit the food")
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
/* increase size of hover/touchable space without changing spacing */
|
||||||
|
.touchable {
|
||||||
|
padding-right: 2em;
|
||||||
|
padding-left: 2em;
|
||||||
|
margin-right: -2em;
|
||||||
|
margin-left: -2em;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -91,9 +91,9 @@ module.exports = {
|
|||||||
},
|
},
|
||||||
// TODO make this conditional on .env DEBUG = FALSE
|
// TODO make this conditional on .env DEBUG = FALSE
|
||||||
config.optimization.minimize(false)
|
config.optimization.minimize(false)
|
||||||
)
|
);
|
||||||
|
|
||||||
config.plugin("BundleTracker").use(BundleTracker, [{ relativePath: true, path: "../vue/" }])
|
config.plugin('BundleTracker').use(BundleTracker, [{relativePath: true, path: '../vue/'}]);
|
||||||
|
|
||||||
config.resolve.alias.set("__STATIC__", "static")
|
config.resolve.alias.set("__STATIC__", "static")
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user