1
0
mirror of https://github.com/TandoorRecipes/recipes.git synced 2026-01-11 00:58:32 -05:00
This commit is contained in:
vabene1111
2021-11-01 11:37:55 +01:00
parent 4efed9a1d2
commit 355f2d30a6
4 changed files with 4 additions and 5 deletions

View File

@@ -0,0 +1,77 @@
<template>
<div v-if="recipe.nutrition !== null">
<div class="card border-success">
<div class="card-body">
<div class="row">
<div class="col-12">
<h4 class="card-title"><i class="fas fa-carrot"></i> {{ $t('Nutrition') }}</h4>
</div>
</div>
<div class="row">
<div class="col-6">
<i class="fas fa-fire fa-fw text-primary"></i> {{ $t(energy()) }}
</div>
<div class="col-6">
<span v-html="calculateEnergy(recipe.nutrition.calories)"></span>
</div>
</div>
<div class="row">
<div class="col-6">
<i class="fas fa-bread-slice fa-fw text-primary"></i> {{ $t('Carbohydrates') }}
</div>
<div class="col-6">
<span v-html="calculateAmount(recipe.nutrition.carbohydrates)"></span> g
</div>
</div>
<div class="row">
<div class="col-6">
<i class="fas fa-cheese fa-fw text-primary"></i> {{ $t('Fats') }}
</div>
<div class="col-6">
<span v-html="calculateAmount(recipe.nutrition.fats)"></span> g
</div>
</div>
<div class="row">
<div class="col-6">
<i class="fas fa-drumstick-bite fa-fw text-primary"></i> {{ $t('Proteins') }}
</div>
<div class="col-6">
<span v-html="calculateAmount(recipe.nutrition.proteins)"></span> g
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import {calculateAmount, calculateEnergy, energyHeading} from "@/utils/utils";
export default {
name: 'Nutrition',
props: {
recipe: Object,
ingredient_factor: Number,
},
methods: {
calculateAmount: function (x) {
return calculateAmount(x, this.ingredient_factor)
},
calculateEnergy: function (x) {
return calculateEnergy(x, this.ingredient_factor)
},
energy: function (x) {
return energyHeading()
}
}
}
</script>