Finish editing of nutritional information

This commit is contained in:
Sebastian Markgraf
2020-11-14 17:07:38 +01:00
parent 2f038edf8c
commit 422113a745
6 changed files with 58 additions and 28 deletions

View File

@@ -81,6 +81,34 @@
</div>
</div>
<div class="row" v-if="recipe.nutrition" style="margin-top: 1vh">
<div class="col-md-12">
<div class="card border-grey">
<div class="card-body">
<h4 class="card-title">{% trans 'Nutrition' %}</h4>
<div class="dropdown-menu dropdown-menu-right"
aria-labelledby="dropdownMenuLink">
<button class="dropdown-item" @click="removeStep(step)"><i
class="fa fa-trash fa-fw"></i> {% trans 'Delete Step' %}</button>
</div>
<label for="id_name"> {% trans 'Calories' %}</label>
<input class="form-control" id="id_calories" v-model="recipe.nutrition.calories">
<label for="id_name"> {% trans 'Carbohydrates' %}</label>
<input class="form-control" id="id_carbohydrates" v-model="recipe.nutrition.carbohydrates">
<label for="id_name"> {% trans 'Fats' %}</label>
<input class="form-control" id="id_fats" v-model="recipe.nutrition.fats">
<label for="id_name"> {% trans 'Proteins' %}</label>
<input class="form-control" id="id_proteins" v-model="recipe.nutrition.proteins">
<br/>
</div>
</div>
</div>
</div>
<draggable :list="recipe.steps" group="steps"
:empty-insert-threshold="10" handle=".handle" @sort="sortSteps()">
@@ -335,6 +363,8 @@
class="btn btn-info shadow-none">{% trans 'Save' %}</button>
<button type="button" @click="addStep()"
class="btn btn-primary shadow-none">{% trans 'Add Step' %}</button>
<button type="button" @click="addNutrition()"
class="btn btn-primary shadow-none">{% trans 'Add Nutrition' %}</button>
<a href="{% url 'view_recipe' recipe.pk %}" @click="addStep()"
class="btn btn-secondary shadow-none">{% trans 'View Recipe' %}</a>
<a href="{% url 'delete_recipe' recipe.pk %}"
@@ -361,6 +391,9 @@
<button type="button" @click="addStep()"
class="btn btn-primary btn-block shadow-none">{% trans 'Add Step' %}</button>
<button type="button" @click="addNutrition()"
class="btn btn-primary btn-block shadow-none">{% trans 'Add Nutrition' %}</button>
<a href="{% url 'view_recipe' recipe.pk %}"
class="btn btn-secondary btn-block shadow-none">{% trans 'View Recipe' %}</a>
<a href="{% url 'delete_recipe' recipe.pk %}"
@@ -649,6 +682,12 @@
scrollToStep: function (step_index) {
document.getElementById('id_step_' + step_index).scrollIntoView({behavior: 'smooth'});
},
addNutrition: function () {
this.recipe.nutrition = {}
},
removeNutrition: function() {
this.recipe.nutrition = undefined
}
}
});
</script>