cgiacofei/TandoorRecipes
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fixed and improved import ingredient edit

Browse Source
This commit is contained in:
vabene1111 2023-02-11 11:57:52 +01:00
parent 820c9b704f
commit 012dea5a0c
2 changed files with 41 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
vue/src/apps/ImportView/ImportViewStepEditor.vue
View File

@ -28,7 +28,7 @@
<b-badge variant="secondary" v-if="i.unit">{{ i.unit.name }}</b-badge>
<b-badge variant="info" v-if="i.food">{{ i.food.name }}</b-badge>
<i>{{ i.original_text }}</i>
<b-button @click="current_edit_ingredient = i" v-b-modal.ingredient_edit_modal class="float-right btn-sm"><i class="fas fa-pencil-alt"></i></b-button>
<b-button @click="prepareIngredientEditModal(s,i)" v-b-modal.ingredient_edit_modal class="float-right btn-sm"><i class="fas fa-pencil-alt"></i></b-button>
</b-list-group-item>
</draggable>
</div>
@ -62,25 +62,34 @@
</div>
</div>
<b-modal id="ingredient_edit_modal" :title="$t('Edit')" ok-only>
<b-modal id="ingredient_edit_modal" :title="$t('Edit')">
<div v-if="current_edit_ingredient !== null">
<b-form-group v-bind:label="$t('Original_Text')" class="mb-3">
<b-form-input v-model="current_edit_ingredient.original_text" type="text" disabled></b-form-input>
</b-form-group>
<b-form-group v-bind:label="$t('Amount')" class="mb-3">
<b-form-input v-model="current_edit_ingredient.amount" type="number" ></b-form-input>
<b-form-input v-model.number="current_edit_ingredient.amount" type="number"></b-form-input>
</b-form-group>
<b-form-group v-bind:label="$t('Unit')" class="mb-3">
<b-form-input v-model="current_edit_ingredient.unit.name" type="text" ></b-form-input>
<b-form-group v-bind:label="$t('Unit')" class="mb-3" v-if="current_edit_ingredient.unit !== null">
<b-form-input v-model="current_edit_ingredient.unit.name" type="text"></b-form-input>
</b-form-group>
<b-form-group v-bind:label="$t('Food')" class="mb-3">
<b-form-input v-model="current_edit_ingredient.food.name" type="text" ></b-form-input>
<b-form-input v-model="current_edit_ingredient.food.name" type="text"></b-form-input>
</b-form-group>
</div>
<template v-slot:modal-footer>
<div class="row w-100">
<div class="col-auto justify-content-end">
<b-button class="mx-1" @click="$bvModal.hide('ingredient_edit_modal'); current_edit_ingredient=null">{{ $t('Ok') }}</b-button>
<b-button class="mx-1" @click="removeIngredient(current_edit_step,current_edit_ingredient);$bvModal.hide('ingredient_edit_modal'); current_edit_ingredient=null" variant="danger">{{ $t('Delete') }}</b-button>
</div>
</div>
</template>
</b-modal>
</div>
</div>
@ -104,6 +113,7 @@ export default {
return {
recipe_json: undefined,
current_edit_ingredient: null,
current_edit_step: null,
}
},
watch: {
@ -202,7 +212,30 @@ export default {
found = true
}
})
},
/**
* Prepare variable that holds currently edited ingredient for modal to manipulate it
* add default placeholder for food/unit in case it is not present, so it can be edited as well
* @param ingredient
*/
prepareIngredientEditModal: function (step, ingredient) {
if (ingredient.unit === null) {
ingredient.unit = {
"name": ""
}
}
if (ingredient.food === null) {
ingredient.food = {
"name": ""
}
}
this.current_edit_ingredient = ingredient
this.current_edit_step = step
},
removeIngredient: function (step, ingredient) {
step.ingredients = step.ingredients.filter((i) => i !== ingredient)
}
}
}
</script>

2
vue/src/locales/en.json
View File

@ -118,7 +118,7 @@
"Image": "Image",
"Delete": "Delete",
"Open": "Open",
"Ok": "Open",
"Ok": "Ok",
"Save": "Save",
"Step": "Step",
"Search": "Search",