mirrors/recipes
1
0
Fork 0
mirror of https://github.com/TandoorRecipes/recipes.git synced 2026-01-01 04:10:06 -05:00
Code Issues Packages Projects Releases Wiki Activity

basics completly working

Browse Source
This commit is contained in:
vabene1111
2020-06-09 20:15:06 +02:00
parent ffa7513f9e
commit a743a4e202
1 changed files with 53 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
cookbook/templates/meal_plan.html
View File

@@ -46,7 +46,7 @@
</h3> </h3>
<div id="app"> <div id="app">
<table class="table table-sm table-striped"> <table class="table table-sm table-striped table-responsive">
<thead class="thead-dark"> <thead class="thead-dark">
<tr> <tr>
<th v-for="d in days" style="width: 14.2%; text-align: center">[[d]]</th> <th v-for="d in days" style="width: 14.2%; text-align: center">[[d]]</th>
@@ -61,14 +61,19 @@
<tr> <tr>
<td v-for="d in mp.days"> <td v-for="d in mp.days">
<draggable class="list-group" :list="d.items" group="plan" style="min-height: 40px" <draggable class="list-group" :list="d.items" group="plan" style="min-height: 40px"
@change="log(d.date, mp.meal_type, $event)" @change="dragChanged(d.date, mp.meal_type, $event)"
:empty-insert-threshold="10"> :empty-insert-threshold="10">
<div class="list-group-item" v-for="(element, index) in d.items" :key="element.id"> <div class="list-group-item" v-for="(element, index) in d.items" :key="element.id">
<a href="#" v-if="element.title !== ''" @click="plan_detail = element">[[element.title]]</a> <div class="row">
<a href="#" v-if="element.recipe_name !== ''" @click="plan_detail = element">[[element.recipe_name]]</a> <div class="col-md-12">
<a href="#" v-if="element.name !== ''" @click="plan_detail = element">[[element.name]]</a> <a href="#" v-if="element.title !== ''"
@click="plan_detail = element" data-toggle="modal" data-target="#exampleModal">[[element.title]]</a>
<button class="btn btn-sm" @click="deleteEntry(element)">Delete</button> <a href="#" v-if="element.recipe_name !== ''" @click="plan_detail = element"
data-toggle="modal" data-target="#exampleModal">[[element.recipe_name]]</a>
<a href="#" v-if="element.name !== ''"
@click="plan_detail = element" data-toggle="modal" data-target="#exampleModal">[[element.name]]</a>
</div>
</div>
</div> </div>
</draggable> </draggable>
</td> </td>
@@ -101,8 +106,7 @@
</div> </div>
</div> </div>
<div class="col-6"> <div class="col-md-6">
<!-- new note type entry -->
<div :key="-1"> <div :key="-1">
<div class="card"> <div class="card">
<div class="card-header"> <div class="card-header">
@@ -116,7 +120,8 @@
<draggable :list="pseudo_note_list" <draggable :list="pseudo_note_list"
:group="{ name: 'plan', pull: 'clone', put: false }" :clone="cloneNote"> :group="{ name: 'plan', pull: 'clone', put: false }" :clone="cloneNote">
<div class="list-group-item" v-for="(element, index) in pseudo_note_list" :key="element.id"> <div class="list-group-item" v-for="(element, index) in pseudo_note_list"
:key="element.id">
<button class="btn">{% trans 'Drag me' %}</button> <button class="btn">{% trans 'Drag me' %}</button>
</div> </div>
</draggable> </draggable>
@@ -131,6 +136,27 @@
<br/> <br/>
[[meal_plan]] [[meal_plan]]
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" >[[ plan_detail.title ]] [[ plan_detail.recipe_name ]]</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
[[ plan_detail.note ]]
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger" @click="deleteEntry(plan_detail)">{% trans 'Delete' %}</button>
</div>
</div>
</div>
</div>
</div> </div>
@@ -149,7 +175,7 @@
plan_entries: [], plan_entries: [],
meal_types: [], meal_types: [],
meal_plan: {}, meal_plan: {},
plan_detail: undefined, plan_detail: {},
recipes: [], recipes: [],
recipe_query: '', recipe_query: '',
pseudo_note_list: [ pseudo_note_list: [
@@ -167,20 +193,18 @@
this.$http.get("{% url 'api:mealplan-list' %}?week=" + week).then((response) => { this.$http.get("{% url 'api:mealplan-list' %}?week=" + week).then((response) => {
this.plan_entries = response.data; this.plan_entries = response.data;
this.getPlanTypes(); this.getPlanTypes();
}).catch((err) => {
this.loading = false;
console.log(err);
}) })
.catch((err) => {
this.loading = false;
console.log(err);
})
}, },
getPlanTypes: function () { getPlanTypes: function () {
this.$http.get("{% url 'api:mealtype-list' %}").then((response) => { this.$http.get("{% url 'api:mealtype-list' %}").then((response) => {
this.meal_types = response.data; this.meal_types = response.data;
this.buildGrid(); this.buildGrid();
}).catch((err) => {
console.log(err);
}) })
.catch((err) => {
console.log(err);
})
}, },
buildGrid: function () { buildGrid: function () {
console.log("BUILD GRID EXECUTED") console.log("BUILD GRID EXECUTED")
@@ -216,7 +240,7 @@
console.log(err); console.log(err);
}) })
}, },
log: function (date, meal_type, evt) { dragChanged: function (date, meal_type, evt) {
console.log("log") console.log("log")
if (evt.added !== undefined) { if (evt.added !== undefined) {
console.log("added") console.log("added")
@@ -231,10 +255,12 @@
plan_entry.created_by = {{ request.user.id }}; plan_entry.created_by = {{ request.user.id }};
this.$http.post(`{% url 'api:mealplan-list' %}`, plan_entry).then((response) => { this.$http.post(`{% url 'api:mealplan-list' %}`, plan_entry).then((response) => {
console.log("Update success", response) console.log("create success", response)
// TODO update meal plan array with id let entry = response.data
this.meal_plan[entry.meal_type].days[entry.date].items = this.meal_plan[entry.meal_type].days[entry.date].items.filter(item => item.id === undefined)
this.meal_plan[entry.meal_type].days[entry.date].items.push(entry)
}).catch((err) => { }).catch((err) => {
console.log("update error", err); console.log("create error", err);
}) })
} else { } else {
this.$http.put(`{% url 'api:mealplan-list' %}${plan_entry.id}/`, plan_entry).then((response) => { this.$http.put(`{% url 'api:mealplan-list' %}${plan_entry.id}/`, plan_entry).then((response) => {
@@ -246,11 +272,14 @@
} }
}, },
deleteEntry: function (entry) { deleteEntry: function (entry) {
console.log("delete click")
$('#exampleModal').modal('hide')
this.plan_detail = {}
this.$http.delete(`{% url 'api:mealplan-list' %}${entry.id}/`, entry).then((response) => { this.$http.delete(`{% url 'api:mealplan-list' %}${entry.id}/`, entry).then((response) => {
console.log("delete success", response) console.log("delete success", response)
this.meal_plan[entry.meal_type].days[entry.date].items = this.meal_plan[entry.meal_type].days[entry.date].items.filter(item => item !== entry) this.meal_plan[entry.meal_type].days[entry.date].items = this.meal_plan[entry.meal_type].days[entry.date].items.filter(item => item !== entry)
}).catch((err) => { }).catch((err) => {
console.log("update error", err); console.log("delete error", err);
}) })
}, },
cloneRecipe: function (recipe) { cloneRecipe: function (recipe) {
@@ -274,7 +303,7 @@
if (new_entry.title === '') { if (new_entry.title === '') {
new_entry.title = '{% trans 'Title' %}' new_entry.title = '{% trans 'Title' %}'
} }
this.new_note_title = '' this.new_note_title = ''
this.new_note_text = '' this.new_note_text = ''
return new_entry return new_entry