Show random recipes in meal planner

This commit is contained in:
tourn
2020-11-03 16:44:26 +01:00
parent 0ac23b4e3a
commit 69a6edee99
4 changed files with 27 additions and 4 deletions

View File

@@ -103,8 +103,15 @@
<div class="card-body">
<div class="row">
<div class="col-md-12">
<input type="text" class="form-control" v-model="recipe_query" @keyup="getRecipes"
placeholder="{% trans 'Search Recipe' %}" style="margin-bottom: 8px">
<div class="input-group mb-3">
<input type="text" class="form-control" v-model="recipe_query" @keyup="getRecipes"
placeholder="{% trans 'Search Recipe' %}">
<div class="input-group-append">
<button class="btn btn-outline-secondary" type="button" @click="getRandomRecipes">
<i class="fas fa-dice"></i>
</button>
</div>
</div>
</div>
</div>
<draggable class="list-group" :list="recipes"
@@ -445,10 +452,16 @@
this.updateUserNames()
},
getRandomRecipes: function () {
this.$set(this, 'recipe_query', '');
this.getRecipes();
},
getRecipes: function () {
let url = "{% url 'api:recipe-list' %}?limit=5"
if (this.recipe_query !== '') {
url += '&query=' + this.recipe_query;
} else {
url += '&random=True'
}
this.$http.get(url).then((response) => {