mirror of
https://github.com/TandoorRecipes/recipes.git
synced 2026-01-01 04:10:06 -05:00
improved meal plan editor shopping integration
This commit is contained in:
@@ -27,10 +27,10 @@
|
||||
</v-expansion-panel-text>
|
||||
</v-expansion-panel>
|
||||
</v-expansion-panels>
|
||||
<v-number-input v-model="servings" class="mt-3" control-variant="split" :label="$t('Servings')" :precision="2"></v-number-input>
|
||||
<v-number-input v-model="servings" class="mt-3" control-variant="split" :label="$t('Servings')" :precision="2" :disabled="loading"></v-number-input>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-btn class="float-right" prepend-icon="$create" color="create" @click="createShoppingListRecipe()">{{ $t('Add_to_Shopping') }}</v-btn>
|
||||
<v-btn class="float-right" prepend-icon="$create" color="create" @click="createShoppingListRecipe()" :disabled="loading">{{ $t('Add_to_Shopping') }}</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
@@ -40,7 +40,7 @@
|
||||
|
||||
import {computed, onMounted, PropType, ref} from "vue";
|
||||
import VClosableCardTitle from "@/components/dialogs/VClosableCardTitle.vue";
|
||||
import {ApiApi, Recipe, RecipeFlat, RecipeOverview, type ShoppingListEntryBulkCreate, ShoppingListRecipe} from "@/openapi";
|
||||
import {ApiApi, MealPlan, Recipe, RecipeFlat, RecipeOverview, type ShoppingListEntryBulkCreate, ShoppingListRecipe} from "@/openapi";
|
||||
import {ErrorMessageType, PreparedMessage, useMessageStore} from "@/stores/MessageStore";
|
||||
import {ShoppingDialogRecipe, ShoppingDialogRecipeEntry} from "@/types/Shopping";
|
||||
import {calculateFoodAmount} from "@/utils/number_utils";
|
||||
@@ -51,6 +51,7 @@ const emit = defineEmits(['created'])
|
||||
|
||||
const props = defineProps({
|
||||
recipe: {type: Object as PropType<Recipe | RecipeFlat | RecipeOverview>, required: true},
|
||||
mealPlan: {type: Object as PropType<MealPlan>, required: false},
|
||||
})
|
||||
|
||||
const dialog = ref(false)
|
||||
@@ -77,6 +78,7 @@ onMounted(() => {
|
||||
function loadRecipeData() {
|
||||
let api = new ApiApi()
|
||||
let promises: Promise<any>[] = []
|
||||
loading.value = true
|
||||
|
||||
let recipeRequest = api.apiRecipeRetrieve({id: props.recipe.id!}).then(r => {
|
||||
recipe.value = r
|
||||
@@ -108,7 +110,7 @@ function loadRecipeData() {
|
||||
|
||||
recipe.steps.forEach(step => {
|
||||
step.ingredients.forEach(ingredient => {
|
||||
if(!ingredient.isHeader){
|
||||
if (!ingredient.isHeader) {
|
||||
dialogRecipe.entries.push({
|
||||
amount: ingredient.amount,
|
||||
food: ingredient.food,
|
||||
@@ -138,6 +140,10 @@ function createShoppingListRecipe() {
|
||||
servings: servings.value,
|
||||
} as ShoppingListRecipe
|
||||
|
||||
if (props.mealPlan && props.mealPlan.id) {
|
||||
shoppingListRecipe.mealplan = props.mealPlan.id!
|
||||
}
|
||||
|
||||
let shoppingListEntries = {
|
||||
entries: []
|
||||
} as ShoppingListEntryBulkCreate
|
||||
|
||||
@@ -82,7 +82,7 @@ const planItems = computed(() => {
|
||||
startDate.setHours(hour, minutes, seconds)
|
||||
endDate.setHours(hour, minutes, seconds)
|
||||
}
|
||||
console.log(startDate, endDate)
|
||||
|
||||
items.push({
|
||||
startDate: startDate,
|
||||
endDate: endDate,
|
||||
|
||||
@@ -29,10 +29,6 @@ const image = computed(() => {
|
||||
}
|
||||
})
|
||||
|
||||
watch(() => props.recipe, () => {
|
||||
console.log('changed')
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -23,6 +23,19 @@
|
||||
<v-form :disabled="loading">
|
||||
|
||||
<v-row>
|
||||
<v-col cols="12" md="6">
|
||||
<ModelSelect model="Recipe" v-model="editingObj.recipe"
|
||||
@update:modelValue="editingObj.servings = editingObj.recipe ? editingObj.recipe.servings : 1"></ModelSelect>
|
||||
<!-- <v-number-input label="Days" control-variant="split" :min="1"></v-number-input>-->
|
||||
<!--TODO create days input with +/- synced to date -->
|
||||
<recipe-card :recipe="editingObj.recipe" v-if="editingObj && editingObj.recipe"></recipe-card>
|
||||
<v-btn prepend-icon="$shopping" color="create" class="mt-1" v-if="!editingObj.shopping && editingObj.recipe && isUpdate()">
|
||||
{{$t('Add')}}
|
||||
<add-to-shopping-dialog :recipe="editingObj.recipe" :meal-plan="editingObj" @created="loadShoppingListEntries(); editingObj.shopping = true;"></add-to-shopping-dialog>
|
||||
</v-btn>
|
||||
|
||||
<v-checkbox :label="$t('AddToShopping')" v-model="editingObj.addshopping" hide-details v-if="editingObj.recipe && !isUpdate()"></v-checkbox>
|
||||
</v-col>
|
||||
<v-col cols="12" md="6">
|
||||
<v-text-field :label="$t('Title')" v-model="editingObj.title"></v-text-field>
|
||||
<v-date-input
|
||||
@@ -51,16 +64,7 @@
|
||||
<v-number-input control-variant="split" :min="0" v-model="editingObj.servings" :label="$t('Servings')" :precision="2"></v-number-input>
|
||||
<ModelSelect model="User" :allow-create="false" v-model="editingObj.shared" item-label="displayName" mode="tags"></ModelSelect>
|
||||
</v-col>
|
||||
<v-col cols="12" md="6">
|
||||
<ModelSelect model="Recipe" v-model="editingObj.recipe"
|
||||
@update:modelValue="editingObj.servings = editingObj.recipe ? editingObj.recipe.servings : 1"></ModelSelect>
|
||||
<!-- <v-number-input label="Days" control-variant="split" :min="1"></v-number-input>-->
|
||||
<!--TODO create days input with +/- synced to date -->
|
||||
<recipe-card :recipe="editingObj.recipe" v-if="editingObj && editingObj.recipe"></recipe-card>
|
||||
|
||||
<v-checkbox :label="$t('AddToShopping')" v-model="editingObj.addshopping" hide-details v-if="editingObj.recipe && !isUpdate()"></v-checkbox>
|
||||
<!-- TODO review shopping before add -->
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row dense>
|
||||
<v-col cols="12">
|
||||
@@ -112,6 +116,7 @@ import {useShoppingStore} from "@/stores/ShoppingStore";
|
||||
import ShoppingListEntryInput from "@/components/inputs/ShoppingListEntryInput.vue";
|
||||
import ClosableHelpAlert from "@/components/display/ClosableHelpAlert.vue";
|
||||
import {useMealPlanStore} from "@/stores/MealPlanStore";
|
||||
import AddToShoppingDialog from "@/components/dialogs/AddToShoppingDialog.vue";
|
||||
|
||||
const props = defineProps({
|
||||
item: {type: {} as PropType<MealPlan>, required: false, default: null},
|
||||
|
||||
Reference in New Issue
Block a user