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

ordering of ingredients and steps

Browse Source
This commit is contained in:
vabene1111 2020-06-26 14:50:33 +02:00
parent c178aea363
commit 3d4aebcd9d
3 changed files with 86 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
cookbook/migrations/0065_auto_20200626_1444.py Normal file
View File

@ -0,0 +1,23 @@
# Generated by Django 3.0.7 on 2020-06-26 12:44
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
('cookbook', '0064_auto_20200625_2329'),
]
operations = [
migrations.AddField(
model_name='ingredient',
name='order',
field=models.IntegerField(default=0),
),
migrations.AddField(
model_name='step',
name='order',
field=models.IntegerField(default=0),
),
]

8
cookbook/models.py
View File

@ -150,10 +150,14 @@ class Ingredient(models.Model):
unit = models.ForeignKey(Unit, on_delete=models.PROTECT) unit = models.ForeignKey(Unit, on_delete=models.PROTECT)
amount = models.DecimalField(default=0, decimal_places=16, max_digits=32) amount = models.DecimalField(default=0, decimal_places=16, max_digits=32)
note = models.CharField(max_length=64, null=True, blank=True) note = models.CharField(max_length=64, null=True, blank=True)
order = models.IntegerField(default=0)
def __str__(self): def __str__(self):
return str(self.amount) + ' ' + str(self.unit) + ' ' + str(self.food) return str(self.amount) + ' ' + str(self.unit) + ' ' + str(self.food)
class Meta:
ordering = ['order', 'pk']
class Step(models.Model): class Step(models.Model):
TEXT = 'TEXT' TEXT = 'TEXT'
@ -161,6 +165,10 @@ class Step(models.Model):
kind = models.CharField(choices=((TEXT, _('Text')),), default=TEXT, max_length=16) kind = models.CharField(choices=((TEXT, _('Text')),), default=TEXT, max_length=16)
instruction = models.TextField(blank=True) instruction = models.TextField(blank=True)
ingredients = models.ManyToManyField(Ingredient, blank=True) ingredients = models.ManyToManyField(Ingredient, blank=True)
order = models.IntegerField(default=0)
class Meta:
ordering = ['order', 'pk']
class Recipe(models.Model): class Recipe(models.Model):

98
cookbook/templates/forms/edit_internal_recipe.html
View File

@ -13,6 +13,9 @@
<script src="{% static 'js/vue-multiselect.min.js' %}"></script> <script src="{% static 'js/vue-multiselect.min.js' %}"></script>
<link rel="stylesheet" href="{% static 'css/vue-multiselect.min.css' %}"> <link rel="stylesheet" href="{% static 'css/vue-multiselect.min.css' %}">
<script src="{% static 'js/Sortable.min.js' %}"></script>
<script src="{% static 'js/vuedraggable.umd.min.js' %}"></script>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
@ -20,7 +23,7 @@
<h3>{% trans 'Edit Recipe' %}</h3> <h3>{% trans 'Edit Recipe' %}</h3>
<div id="app"> <div id="app">
<template v-if="recipe"> <div v-if="recipe">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
@ -61,69 +64,71 @@
</div> </div>
</div> </div>
<template v-for="step, index in recipe.steps"> <div v-for="step in recipe.steps">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<h3>Step [[index + 1]]</h3> <h3>Step</h3>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<template v-for="ingredient, index in step.ingredients"> <draggable :list="step.ingredients" group="ingredients"
<div class="card"> :empty-insert-threshold="10" handle=".handle" @sort="sortStep(step)">
<div class="card" v-for="ingredient, index in step.ingredients" :key="ingredient.id">
<div class="card-body" style="padding: 12px"> <div class="card-body" style="padding: 12px">
<div class="row"> <div class="row">
<div class="col-md-3"> <div class="col-md-1">
<i class="fas fa-arrows-alt-v handle"></i>
</div>
<div class="col-md-2">
<input class="form-control" v-model="ingredient.amount"> <input class="form-control" v-model="ingredient.amount">
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<multiselect v-tabindex <multiselect
ref="unit" v-tabindex
v-model="ingredient.unit" ref="unit"
:options="units" v-model="ingredient.unit"
:close-on-select="true" :options="units"
:clear-on-select="true" :close-on-select="true"
:allow-empty="true" :clear-on-select="true"
:preserve-search="true" :allow-empty="true"
placeholder="{% trans 'Select one' %}" :preserve-search="true"
tag-placeholder="{% trans 'Select' %}" placeholder="{% trans 'Select one' %}"
label="name" tag-placeholder="{% trans 'Select' %}"
:id="'unit_' + index" label="name"
track-by="id" track-by="id"
:multiple="false" :multiple="false"
:loading="units_loading" :loading="units_loading"
@search-change="searchUnits"> @search-change="searchUnits">
</multiselect> </multiselect>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<multiselect v-tabindex <multiselect
ref="food" v-tabindex
v-model="ingredient.food" ref="food"
:options="foods" v-model="ingredient.food"
:close-on-select="true" :options="foods"
:clear-on-select="true" :close-on-select="true"
:allow-empty="true" :clear-on-select="true"
:preserve-search="true" :allow-empty="true"
placeholder="{% trans 'Select one' %}" :preserve-search="true"
tag-placeholder="{% trans 'Select' %}" placeholder="{% trans 'Select one' %}"
label="name" tag-placeholder="{% trans 'Select' %}"
:id="'food_' + index" label="name"
track-by="id" track-by="id"
:multiple="false" :multiple="false"
:loading="foods_loading" :loading="foods_loading"
@search-change="searchFoods"> @search-change="searchFoods">
</multiselect> </multiselect>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<input class="form-control" v-model="ingredient.note"> <input class="form-control" v-model="ingredient.note">
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </draggable>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
@ -133,11 +138,11 @@
</div> </div>
</div> </div>
<br/> <br/>
</template> </div>
<button type="button" @click="updateRecipe()" class="btn">Save</button> <button type="button" @click="updateRecipe()" class="btn">Save</button>
<button type="button" @click="addStep()" class="btn">Add Step</button> <button type="button" @click="addStep()" class="btn">Add Step</button>
</template> </div>
</div> </div>
<script type="application/javascript"> <script type="application/javascript">
@ -197,6 +202,13 @@
{'instruction': '', ingredients: []} {'instruction': '', ingredients: []}
) )
}, },
sortStep: function (step) {
console.log(step)
step.ingredients.forEach(function (element, index) {
element.order = index
});
},
searchKeywords: function (query) { searchKeywords: function (query) {
this.keywords_loading = true this.keywords_loading = true
this.$http.get("{% url 'api:keyword-list' %}" + '?query=' + query + '&limit=10').then((response) => { this.$http.get("{% url 'api:keyword-list' %}" + '?query=' + query + '&limit=10').then((response) => {