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

added drag and drop to ingredients

Browse Source
This commit is contained in:
smilerz 2021-03-18 12:09:53 -05:00
parent 44dee16e0a
commit 647c1678f1
2 changed files with 47 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
cookbook/templates/url_import.html
View File

@ -135,9 +135,12 @@
</div> </div>
<div class="card mb-2"> <div class="card mb-2">
<div class="card-header" style="display:flex; justify-content:space-between;"> <div class="card-header">
{% trans 'Keywords' %} <div class="row" style="display:flex; justify-content:space-between;">
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('keywords')" title="{% trans 'Clear Contents'%}"></i> {% trans 'Keywords' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('keywords')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="small text-muted">{% trans 'Keywords dragged here will be appended to current list'%}</div>
</div> </div>
<div class="card-body drop-zone" @drop="replacePreview('keywords', $event)" @dragover.prevent @dragenter.prevent> <div class="card-body drop-zone" @drop="replacePreview('keywords', $event)" @dragover.prevent @dragenter.prevent>
<div v-for="kw in recipe_json.keywords"> <div v-for="kw in recipe_json.keywords">
@ -193,14 +196,24 @@
</div> </div>
<div class="card mb-2"> <div class="card mb-2">
<div class="card-header" style="display:flex; justify-content:space-between;"> <div class="card-header">
{% trans 'Ingredients' %} <div class="row" style="display:flex; justify-content:space-between;">
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('ingredients')" title="{% trans 'Clear Contents'%}"></i> {% trans 'Ingredients' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('ingredients')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="small text-muted">{% trans 'Ingredients dragged here will be appended to current list.'%}</div>
</div> </div>
<div class="card-body drop-zone" @drop="replacePreview('ingredients', $event)" @dragover.prevent @dragenter.prevent> <div class="card-body drop-zone" @drop="replacePreview('ingredients', $event)" @dragover.prevent @dragenter.prevent>
<div v-for="i in recipe_json.recipeIngredient"> <ul class="list-group list-group">
<div class="card-text">[[i.amount]] [[i.unit.text]] [[i.ingredient.text]] [[i.note]]</div> <div v-for="i in recipe_json.recipeIngredient">
</div> <li class="row border" style="border:1px">
<div class="col-sm-1 border">[[i.amount]]</div>
<div class="col-sm border">[[i.unit.text]]</div>
<div class="col-sm border">[[i.ingredient.text]]</div>
<div class="col-sm border">[[i.note]]</div>
</li>
</div>
</ul>
</div> </div>
</div> </div>
@ -643,6 +656,7 @@
}) })
}, },
loadRecipeHTML: function () { loadRecipeHTML: function () {
// TODO this needs refactored to get HTML elements
this.error = undefined this.error = undefined
this.loading = true this.loading = true
this.parsed = false this.parsed = false
@ -840,17 +854,35 @@
this.recipe_json.cookTime=v this.recipe_json.cookTime=v
break; break;
case 'ingredients': case 'ingredients':
let new_ingredient={ this.$http.post('{% url 'api_ingredient_from_string' %}', {text: v}, {emulateJSON: true}).then((response) => {
unit: {id: Math.random() * 1000, text: ""}, console.log(response)
amount: "", let new_ingredient={
ingredient: {id: Math.random() * 1000, text: v} unit: {id: Math.random() * 1000, text: response.body.unit},
amount: response.body.amount,
ingredient: {id: Math.random() * 1000, text: response.body.food},
note: response.body.note
} }
this.recipe_json.recipeIngredient=[new_ingredient] this.recipe_json.recipeIngredient.push(new_ingredient)
}).catch((err) => {
console.log(err)
this.makeToast(gettext('Error'), gettext('Something went wrong.'), 'danger')
})
break; break;
case 'instructions': case 'instructions':
this.recipe_json.recipeInstructions=this.recipe_json.recipeInstructions.concat(v) this.recipe_json.recipeInstructions=this.recipe_json.recipeInstructions.concat(v)
break; break;
} }
},
parseIngredient: function(txt) {
this.$http.post('{% url 'api_ingredient_from_string' %}', {text: txt}, {emulateJSON: true}).then((response) => {
console.log(response)
let ing = [response.body.amount, response.body.unit, response.body.food, response.body.note]
return ing
}).catch((err) => {
console.log(err)
this.makeToast(gettext('Error'), gettext('Something went wrong.'), 'danger')
})
} }
} }
}); });

1
cookbook/views/api.py
View File

@ -662,6 +662,7 @@ def ingredient_from_string(request):
'amount': amount, 'amount': amount,
'unit': unit, 'unit': unit,
'food': food, 'food': food,
'note': note
}, },
status=200 status=200
) )