added multi day meal planning
This commit is contained in:
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class=" d-none d-lg-block">
|
||||
<div class="row">
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row ">
|
||||
<div class="col col-2">
|
||||
<h4>{{ $t('Meal_Types') }}</h4>
|
||||
|
||||
@ -79,9 +79,11 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row d-block d-lg-none">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row d-block d-lg-none">
|
||||
<div class="">
|
||||
<div>
|
||||
<div class="col-12">
|
||||
<div class="col-12 d-flex justify-content-center mt-2">
|
||||
@ -370,7 +372,7 @@ export default {
|
||||
date: moment_date,
|
||||
create_default_date: moment_date.format("YYYY-MM-DD"), // improve meal plan edit modal to do formatting itself and accept dates
|
||||
date_label: moment_date.format('ddd DD.MM'),
|
||||
plan_entries: this.plan_items.filter((m) => moment(m.startDate).isSame(moment_date, 'day'))
|
||||
plan_entries: this.plan_items.filter((m) => moment_date.isBetween(moment(m.startDate), moment(m.endDate), 'day', '[]'))
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -496,12 +498,16 @@ export default {
|
||||
moveEntry(null_object, target_date, drag_event) {
|
||||
useMealPlanStore().plan_list.forEach((entry) => {
|
||||
if (entry.id === this.dragged_item.id) {
|
||||
let fromToDiff = Math.abs(moment(entry.to_date).diff(moment(entry.from_date), 'days'))
|
||||
|
||||
if (drag_event.ctrlKey) {
|
||||
let new_entry = Object.assign({}, entry)
|
||||
new_entry.date = target_date
|
||||
new_entry.from_date = target_date
|
||||
new_entry.to_date = moment(target_date).add(fromToDiff, 'd')
|
||||
this.createEntry(new_entry)
|
||||
} else {
|
||||
entry.date = target_date
|
||||
entry.from_date = target_date
|
||||
entry.to_date = moment(target_date).add(fromToDiff, 'd')
|
||||
this.saveEntry(entry)
|
||||
}
|
||||
}
|
||||
@ -510,7 +516,8 @@ export default {
|
||||
moveEntryLeft(data) {
|
||||
useMealPlanStore().plan_list.forEach((entry) => {
|
||||
if (entry.id === data.id) {
|
||||
entry.date = moment(entry.date).subtract(1, "d")
|
||||
entry.from_date = moment(entry.from_date).subtract(1, "d")
|
||||
entry.to_date = moment(entry.to_date).subtract(1, "d")
|
||||
this.saveEntry(entry)
|
||||
}
|
||||
})
|
||||
@ -518,7 +525,8 @@ export default {
|
||||
moveEntryRight(data) {
|
||||
useMealPlanStore().plan_list.forEach((entry) => {
|
||||
if (entry.id === data.id) {
|
||||
entry.date = moment(entry.date).add(1, "d")
|
||||
entry.from_date = moment(entry.from_date).add(1, "d")
|
||||
entry.to_date = moment(entry.to_date).add(1, "d")
|
||||
this.saveEntry(entry)
|
||||
}
|
||||
})
|
||||
@ -536,7 +544,8 @@ export default {
|
||||
openEntryEdit(entry) {
|
||||
this.$bvModal.show(`id_meal_plan_edit_modal`)
|
||||
this.entryEditing = entry
|
||||
this.entryEditing.date = moment(entry.date).format("YYYY-MM-DD")
|
||||
this.entryEditing.from_date = moment(entry.from_date).format("YYYY-MM-DD")
|
||||
this.entryEditing.to_date = moment(entry.to_date).format("YYYY-MM-DD")
|
||||
if (this.entryEditing.recipe != null) {
|
||||
this.entryEditing.title_placeholder = this.entryEditing.recipe.name
|
||||
}
|
||||
@ -559,21 +568,32 @@ export default {
|
||||
})
|
||||
},
|
||||
saveEntry(entry) {
|
||||
entry.date = moment(entry.date).format("YYYY-MM-DD")
|
||||
entry.from_date = moment(entry.from_date).format("YYYY-MM-DD")
|
||||
entry.to_date = moment(entry.to_date).format("YYYY-MM-DD")
|
||||
|
||||
if (entry.from_date > entry.to_date) {
|
||||
StandardToasts.makeStandardToast(this, StandardToasts.FAIL_UPDATE)
|
||||
entry.to_date = entry.from_date
|
||||
} else {
|
||||
useMealPlanStore().updateObject(entry)
|
||||
}
|
||||
|
||||
|
||||
useMealPlanStore().updateObject(entry)
|
||||
},
|
||||
createEntry(entry) {
|
||||
entry.date = moment(entry.date).format("YYYY-MM-DD")
|
||||
entry.from_date = moment(entry.from_date).format("YYYY-MM-DD")
|
||||
entry.to_date = moment(entry.to_date).format("YYYY-MM-DD")
|
||||
|
||||
useMealPlanStore().createObject(entry)
|
||||
},
|
||||
buildItem(plan_entry) {
|
||||
//dirty hack to order items within a day
|
||||
let date = moment(plan_entry.date).add(plan_entry.meal_type.order, "m")
|
||||
let from_date = moment(plan_entry.from_date).add(plan_entry.meal_type.order, "m")
|
||||
let to_date = moment(plan_entry.to_date).add(plan_entry.meal_type.order, "m")
|
||||
return {
|
||||
id: plan_entry.id,
|
||||
startDate: date,
|
||||
endDate: date,
|
||||
startDate: from_date,
|
||||
endDate: to_date,
|
||||
entry: plan_entry,
|
||||
}
|
||||
},
|
||||
|
@ -1102,7 +1102,7 @@ export default {
|
||||
date: moment_date,
|
||||
create_default_date: moment_date.format("YYYY-MM-DD"), // improve meal plan edit modal to do formatting itself and accept dates
|
||||
date_label: moment_date.format('ddd DD.MM'),
|
||||
plan_entries: this.meal_plan_store.plan_list.filter((m) => moment(m.date).isSame(moment_date, 'day'))
|
||||
plan_entries: this.meal_plan_store.plan_list.filter((m) => moment_date.isBetween(moment(m.from_date), moment(m.to_date), 'day', '[]'))
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -1358,22 +1358,6 @@ export default {
|
||||
this.meal_plan_store = useMealPlanStore()
|
||||
this.meal_plan_store.refreshFromAPI(moment().format("YYYY-MM-DD"), moment().add(this.ui.meal_plan_days, "days").format("YYYY-MM-DD"))
|
||||
|
||||
|
||||
// if (this.ui.show_meal_plan) {
|
||||
// let params = {
|
||||
// options: {
|
||||
// query: {
|
||||
// from_date: moment().format("YYYY-MM-DD"),
|
||||
// to_date: moment().add(this.ui.meal_plan_days, "days").format("YYYY-MM-DD"),
|
||||
// },
|
||||
// },
|
||||
// }
|
||||
// this.genericAPI(this.Models.MEAL_PLAN, this.Actions.LIST, params).then((result) => {
|
||||
// this.meal_plans = result.data
|
||||
// })
|
||||
// } else {
|
||||
// this.meal_plans = []
|
||||
// }
|
||||
},
|
||||
genericSelectChanged: function (obj) {
|
||||
if (obj.var.includes("::")) {
|
||||
|
@ -6,14 +6,13 @@
|
||||
<div class="row">
|
||||
<div class="col col-md-12">
|
||||
<div class="row">
|
||||
<div class="col-6 col-lg-9">
|
||||
<div class="col-12">
|
||||
<b-input-group>
|
||||
<b-form-input id="TitleInput" v-model="entryEditing.title"
|
||||
:placeholder="entryEditing.title_placeholder"
|
||||
@change="missing_recipe = false"></b-form-input>
|
||||
<b-input-group-append class="d-none d-lg-block">
|
||||
<b-button variant="primary" @click="entryEditing.title = ''"><i
|
||||
class="fa fa-eraser"></i></b-button>
|
||||
<b-button variant="primary" @click="entryEditing.title = ''"><i class="fa fa-eraser"></i></b-button>
|
||||
</b-input-group-append>
|
||||
</b-input-group>
|
||||
<span class="text-danger" v-if="missing_recipe">{{
|
||||
@ -23,13 +22,30 @@
|
||||
$t("Title")
|
||||
}}</small>
|
||||
</div>
|
||||
<div class="col-6 col-lg-3">
|
||||
<input type="date" id="DateInput" class="form-control" v-model="entryEditing.date"/>
|
||||
<small tabindex="-1" class="form-text text-muted">{{ $t("Date") }}</small>
|
||||
<div class="col-12 col-lg-6">
|
||||
<b-input-group>
|
||||
<b-form-input type="date" v-model="entryEditing.from_date"></b-form-input>
|
||||
<b-input-group-append>
|
||||
<b-button variant="secondary" @click="entryEditing.from_date = changeDate(entryEditing.from_date, -1)"><i class="fas fa-minus"></i></b-button>
|
||||
<b-button variant="primary" @click="entryEditing.from_date = changeDate(entryEditing.from_date, 1)"><i class="fas fa-plus"></i></b-button>
|
||||
</b-input-group-append>
|
||||
</b-input-group>
|
||||
|
||||
<small tabindex="-1" class="form-text text-muted">{{ $t("StartDate") }}</small>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<b-input-group>
|
||||
<b-form-input type="date" v-model="entryEditing.to_date"></b-form-input>
|
||||
<b-input-group-append>
|
||||
<b-button variant="secondary" @click="entryEditing.to_date = changeDate(entryEditing.to_date, -1)"><i class="fas fa-minus"></i></b-button>
|
||||
<b-button variant="primary" @click="entryEditing.to_date = changeDate(entryEditing.to_date, 1)"><i class="fas fa-plus"></i></b-button>
|
||||
</b-input-group-append>
|
||||
</b-input-group>
|
||||
<small tabindex="-1" class="form-text text-muted">{{ $t("EndDate") }}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-3">
|
||||
<div class="col-12 col-lg-6 col-xl-6">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<b-form-group>
|
||||
<generic-multiselect
|
||||
@change="selectRecipe"
|
||||
@ -43,7 +59,11 @@
|
||||
></generic-multiselect>
|
||||
<small tabindex="-1" class="form-text text-muted">{{ $t("Recipe") }}</small>
|
||||
</b-form-group>
|
||||
<b-form-group class="mt-3">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12 col-lg-6 col-xl-6">
|
||||
<b-form-group class="">
|
||||
<generic-multiselect
|
||||
required
|
||||
@change="selectMealType"
|
||||
@ -142,6 +162,7 @@ const {ApiApiFactory} = require("@/utils/openapi/api")
|
||||
import {useUserPreferenceStore} from "@/stores/UserPreferenceStore";
|
||||
import {useMealPlanStore} from "@/stores/MealPlanStore";
|
||||
import ShoppingModal from "@/components/Modals/ShoppingModal.vue";
|
||||
import moment from "moment";
|
||||
|
||||
Vue.use(BootstrapVue)
|
||||
Vue.use(VueCookies)
|
||||
@ -221,7 +242,8 @@ export default {
|
||||
}
|
||||
|
||||
if (this.create_date) {
|
||||
this.entryEditing.date = this.create_date
|
||||
this.entryEditing.from_date = this.create_date
|
||||
this.entryEditing.to_date = this.create_date
|
||||
}
|
||||
|
||||
useUserPreferenceStore().getData().then(userPreference => {
|
||||
@ -290,6 +312,9 @@ export default {
|
||||
this.entryEditing.servings = 1
|
||||
}
|
||||
},
|
||||
changeDate(date, change){
|
||||
return moment(date).add(change, 'd').format("YYYY-MM-DD")
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
@ -184,7 +184,7 @@ export default {
|
||||
localStorage.setItem("pinned_recipes", JSON.stringify(pinnedRecipes))
|
||||
},
|
||||
saveMealPlan: function (entry) {
|
||||
entry.date = moment(entry.date).format("YYYY-MM-DD")
|
||||
entry.from_date = moment(entry.from_date).format("YYYY-MM-DD")
|
||||
let reviewshopping = entry.addshopping && entry.reviewshopping
|
||||
entry.addshopping = entry.addshopping && !entry.reviewshopping
|
||||
|
||||
@ -208,7 +208,7 @@ export default {
|
||||
createMealPlan(data) {
|
||||
this.entryEditing = this.options.entryEditing
|
||||
this.entryEditing.recipe = this.recipe
|
||||
this.entryEditing.date = moment(new Date()).format("YYYY-MM-DD")
|
||||
this.entryEditing.from_date = moment(new Date()).format("YYYY-MM-DD")
|
||||
this.$nextTick(function () {
|
||||
this.$bvModal.show(`modal-meal-plan_${this.modal_id}`)
|
||||
})
|
||||
|
@ -101,6 +101,8 @@
|
||||
"Energy": "Energy",
|
||||
"Nutrition": "Nutrition",
|
||||
"Date": "Date",
|
||||
"StartDate": "Start Date",
|
||||
"EndDate": "End Date",
|
||||
"Share": "Share",
|
||||
"Automation": "Automation",
|
||||
"Parameter": "Parameter",
|
||||
|
@ -29,7 +29,8 @@ export const useMealPlanStore = defineStore(_STORE_ID, {
|
||||
},
|
||||
empty_meal_plan: function () {
|
||||
return {
|
||||
date: null,
|
||||
from_date: null,
|
||||
to_date: null,
|
||||
id: -1,
|
||||
meal_type: null,
|
||||
note: "",
|
||||
|
@ -1812,7 +1812,13 @@ export interface MealPlan {
|
||||
* @type {string}
|
||||
* @memberof MealPlan
|
||||
*/
|
||||
date: string;
|
||||
from_date: string;
|
||||
/**
|
||||
*
|
||||
* @type {string}
|
||||
* @memberof MealPlan
|
||||
*/
|
||||
to_date?: string | null;
|
||||
/**
|
||||
*
|
||||
* @type {MealPlanMealType}
|
||||
|
Reference in New Issue
Block a user