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

javascript toasts

Browse Source
This commit is contained in:
vabene1111 2020-07-08 21:01:01 +02:00
parent 5f2320a3e7
commit b490673866
4 changed files with 52 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
cookbook/static/css/bootstrap-vue.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

11
cookbook/static/js/bootstrap-vue.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

10
cookbook/static/js/portal-vue.umd.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

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

@ -10,13 +10,17 @@
{% include 'include/vue_base.html' %} {% include 'include/vue_base.html' %}
<script src="{% static 'js/vue-multiselect.min.js' %}"></script> <link rel="stylesheet" href="{% static 'css/bootstrap-vue.min.css' %}">
<script src="{% static 'js/bootstrap-vue.min.js' %}"></script>
<link rel="stylesheet" href="{% static 'css/vue-multiselect-bs4.min.css' %}"> <link rel="stylesheet" href="{% static 'css/vue-multiselect-bs4.min.css' %}">
<script src="{% static 'js/vue-multiselect.min.js' %}"></script>
<script src="{% static 'js/Sortable.min.js' %}"></script> <script src="{% static 'js/Sortable.min.js' %}"></script>
<script src="{% static 'js/vuedraggable.umd.min.js' %}"></script> <script src="{% static 'js/vuedraggable.umd.min.js' %}"></script>
<script src="{% static 'js/vue-scrollto.js' %}"></script> <script src="{% static 'js/vue-scrollto.js' %}"></script>
<script src="{% static 'js/portal-vue.umd.min.js' %}"></script>
<style> <style>
.small-padding { .small-padding {
@ -207,7 +211,8 @@
:allow-empty="true" :allow-empty="true"
:preserve-search="true" :preserve-search="true"
placeholder="{% trans 'Select Unit' %}" placeholder="{% trans 'Select Unit' %}"
tag-placeholder="{% trans 'Select' %}" tag-placeholder="{% trans 'Create' %}"
select-label="{% trans 'Select' %}"
:taggable="true" :taggable="true"
@tag="addUnitType" @tag="addUnitType"
:id="`unit_${step_index}_${index}`" :id="`unit_${step_index}_${index}`"
@ -230,7 +235,8 @@
:allow-empty="true" :allow-empty="true"
:preserve-search="true" :preserve-search="true"
placeholder="{% trans 'Select Food' %}" placeholder="{% trans 'Select Food' %}"
tag-placeholder="{% trans 'Select' %}" tag-placeholder="{% trans 'Create' %}"
select-label="{% trans 'Select' %}"
:taggable="true" :taggable="true"
@tag="addFoodType" @tag="addFoodType"
:id="`ingredient_${step_index}_${index}`" :id="`ingredient_${step_index}_${index}`"
@ -387,6 +393,7 @@
</div> </div>
</div> </div>
</div> </div>
{% endblock %} {% endblock %}
{% block script %} {% block script %}
@ -428,11 +435,7 @@
recipe: { recipe: {
deep: true, deep: true,
handler() { handler() {
if (this.recipe_changed === undefined) { this.recipe_changed = this.recipe_changed !== undefined;
this.recipe_changed = false
} else {
this.recipe_changed = true
}
} }
} }
}, },
@ -446,6 +449,14 @@
this.searchKeywords('') this.searchKeywords('')
}, },
methods: { methods: {
makeToast: function(title, message, variant=null) {
this.$bvToast.toast(message, {
title: title,
variant: variant,
toaster: 'b-toaster-top-center',
solid: true
})
},
warnPageLeave: function (event) { warnPageLeave: function (event) {
if (this.recipe_changed) { if (this.recipe_changed) {
event.returnValue = '' event.returnValue = ''
@ -459,6 +470,7 @@
}).catch((err) => { }).catch((err) => {
this.loading = false this.loading = false
console.log(err) console.log(err)
this.makeToast('{% trans 'Error' %}','{% trans 'There was an error loading the recipe!' %}' + err.bodyText, 'danger')
}) })
}, },
updateRecipe: function (view_after) { updateRecipe: function (view_after) {
@ -468,14 +480,15 @@
} }
this.$http.put("{% url 'api:recipe-detail' recipe.pk %}", this.recipe, this.$http.put("{% url 'api:recipe-detail' recipe.pk %}", this.recipe,
{}).then((response) => { {}).then((response) => {
console.log(view_after)
console.log(response) console.log(response)
this.makeToast('{% trans 'Updated' %}','{% trans 'Changes saved successfully!' %}', 'success')
this.recipe_changed = false this.recipe_changed = false
if (view_after) { if (view_after) {
location.href = "{% url 'view_recipe' 12345 %}".replace(/12345/, this.recipe.id); location.href = "{% url 'view_recipe' 12345 %}".replace(/12345/, this.recipe.id);
} }
}).catch((err) => { }).catch((err) => {
console.log(err) console.log(err)
this.makeToast('{% trans 'Error' %}','{% trans 'There was an error updating the recipe!' %}' + err.bodyText, 'danger')
}) })
}, },
imageChanged: function (event) { imageChanged: function (event) {
@ -485,12 +498,13 @@
this.$http.put("{% url 'api:recipe-detail' recipe.pk %}" + 'image/', fd, this.$http.put("{% url 'api:recipe-detail' recipe.pk %}" + 'image/', fd,
{headers: {'Content-Type': 'multipart/form-data'}}).then((response) => { {headers: {'Content-Type': 'multipart/form-data'}}).then((response) => {
console.log(response) console.log(response)
this.makeToast('{% trans 'Updated' %}','{% trans 'Changes saved successfully!' %}', 'success')
}).catch((err) => { }).catch((err) => {
console.log(err) console.log(err)
this.makeToast('{% trans 'Error' %}','{% trans 'There was an error updating the recipe!' %}' + err.body.image, 'danger')
}) })
let reader = new FileReader(); let reader = new FileReader();
reader.onload = function (e) { reader.onload = function (e) {
$('#id_image').attr('src', e.target.result); $('#id_image').attr('src', e.target.result);
@ -506,7 +520,6 @@
) )
}, },
sortSteps: function () { sortSteps: function () {
console.log('sort')
this.recipe.steps.forEach(function (element, index) { this.recipe.steps.forEach(function (element, index) {
element.order = index element.order = index
}); });
@ -568,6 +581,7 @@
this.keywords_loading = false this.keywords_loading = false
}).catch((err) => { }).catch((err) => {
console.log(err) console.log(err)
this.makeToast('{% trans 'Error' %}','{% trans 'There was an error loading a resource!' %}' + err.bodyText, 'danger')
}) })
}, },
searchUnits: function (query) { searchUnits: function (query) {
@ -586,7 +600,7 @@
} }
this.units_loading = false this.units_loading = false
}).catch((err) => { }).catch((err) => {
console.log(err) this.makeToast('{% trans 'Error' %}','{% trans 'There was an error loading a resource!' %}' + err.bodyText, 'danger')
}) })
}, },
searchFoods: function (query) { searchFoods: function (query) {
@ -606,11 +620,10 @@
this.foods_loading = false this.foods_loading = false
}).catch((err) => { }).catch((err) => {
console.log(err) this.makeToast('{% trans 'Error' %}','{% trans 'There was an error loading a resource!' %}' + err.bodyText, 'danger')
}) })
}, },
scrollToStep: function (step_index) { scrollToStep: function (step_index) {
console.log(step_index)
document.getElementById('id_step_' + step_index).scrollIntoView({behavior: 'smooth'}); document.getElementById('id_step_' + step_index).scrollIntoView({behavior: 'smooth'});
}, },
} }