@ -279,12 +279,26 @@
|
||||
:create_date="mealplan_default_date"
|
||||
@reload-meal-types="refreshMealTypes"
|
||||
></meal-plan-edit-modal>
|
||||
<auto-meal-plan-modal
|
||||
:modal_title="'Auto create meal plan'"
|
||||
:current_period="current_period"
|
||||
@create-plan="doAutoPlan"
|
||||
></auto-meal-plan-modal>
|
||||
|
||||
<div class="row d-none d-lg-block">
|
||||
<div class="col-12 float-right">
|
||||
<button class="btn btn-success shadow-none" @click="createEntryClick(new Date())"><i
|
||||
class="fas fa-calendar-plus"></i> {{ $t("Create") }}
|
||||
</button>
|
||||
<button class="btn btn-primary shadow-none" @click="createAutoPlan(new Date())"><i
|
||||
class="fas fa-calendar-plus"></i> {{ $t("Auto_Planner") }}
|
||||
</button>
|
||||
<button class="btn btn-primary shadow-none" @click="deleteAll()"><i
|
||||
class="fas fa-calendar-plus"></i> {{ "DEBUG:deleteAll" }}
|
||||
</button>
|
||||
<button class="btn btn-primary shadow-none" @click="refreshEntries()"><i
|
||||
class="fas fa-calendar-plus"></i> {{ "DEBUG:RefreshMeals" }}
|
||||
</button>
|
||||
<a class="btn btn-primary shadow-none" :href="iCalUrl"><i class="fas fa-download"></i>
|
||||
{{ $t("Export_To_ICal") }}
|
||||
</a>
|
||||
@ -297,6 +311,7 @@
|
||||
<a class="dropdown-item" @click="createEntryClick(new Date())"><i
|
||||
class="fas fa-calendar-plus fa-fw"></i> {{ $t("Create") }}</a>
|
||||
</template>
|
||||
|
||||
</bottom-navigation-bar>
|
||||
</div>
|
||||
</template>
|
||||
@ -322,6 +337,8 @@ import {CalendarView, CalendarMathMixin} from "vue-simple-calendar/src/component
|
||||
import {ApiApiFactory} from "@/utils/openapi/api"
|
||||
import BottomNavigationBar from "@/components/BottomNavigationBar.vue";
|
||||
import {useMealPlanStore} from "@/stores/MealPlanStore";
|
||||
import axios from "axios";
|
||||
import AutoMealPlanModal from "@/components/AutoMealPlanModal";
|
||||
|
||||
const {makeToast} = require("@/utils/utils")
|
||||
|
||||
@ -334,6 +351,7 @@ let SETTINGS_COOKIE_NAME = "mealplan_settings"
|
||||
export default {
|
||||
name: "MealPlanView",
|
||||
components: {
|
||||
AutoMealPlanModal,
|
||||
MealPlanEditModal,
|
||||
MealPlanCard,
|
||||
CalendarView,
|
||||
@ -347,6 +365,16 @@ export default {
|
||||
mixins: [CalendarMathMixin, ApiMixin, ResolveUrlMixin],
|
||||
data: function () {
|
||||
return {
|
||||
AutoPlan: {
|
||||
meal_types: [],
|
||||
keywords: [[]],
|
||||
servings: 1,
|
||||
date: Date.now(),
|
||||
startDay: null,
|
||||
endDay: null,
|
||||
shared: [],
|
||||
addshopping: false
|
||||
},
|
||||
showDate: new Date(),
|
||||
plan_entries: [],
|
||||
recipe_viewed: {},
|
||||
@ -656,6 +684,39 @@ export default {
|
||||
this.$bvModal.show(`id_meal_plan_edit_modal`)
|
||||
})
|
||||
|
||||
},
|
||||
createAutoPlan() {
|
||||
this.$bvModal.show(`autoplan-modal`)
|
||||
},
|
||||
async autoPlanThread(autoPlan, mealTypeIndex) {
|
||||
let apiClient = new ApiApiFactory()
|
||||
let data = {
|
||||
"start_date" : moment(autoPlan.startDay).format("YYYY-MM-DD"),
|
||||
"end_date" : moment(autoPlan.endDay).format("YYYY-MM-DD"),
|
||||
"meal_type_id" : autoPlan.meal_types[mealTypeIndex].id,
|
||||
"keywords" : autoPlan.keywords[mealTypeIndex],
|
||||
"servings" : autoPlan.servings,
|
||||
"shared" : autoPlan.shared,
|
||||
"addshopping": autoPlan.addshopping
|
||||
}
|
||||
await apiClient.createAutoPlanViewSet(data)
|
||||
|
||||
},
|
||||
async doAutoPlan(autoPlan) {
|
||||
for (let i = 0; i < autoPlan.meal_types.length; i++) {
|
||||
if (autoPlan.keywords[i].length === 0) continue
|
||||
await this.autoPlanThread(autoPlan, i)
|
||||
}
|
||||
this.refreshEntries()
|
||||
},
|
||||
refreshEntries(){//todo Remove method
|
||||
let date = this.current_period
|
||||
useMealPlanStore().refreshFromAPI(moment(date.periodStart).format("YYYY-MM-DD"), moment(date.periodEnd).format("YYYY-MM-DD"))
|
||||
},
|
||||
deleteAll(){//todo Remove method, only used in debugging
|
||||
for (let i = 0; i < useMealPlanStore().plan_list.length; i++) {
|
||||
useMealPlanStore().deleteObject(useMealPlanStore().plan_list[i])
|
||||
}
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
|
219
vue/src/components/AutoMealPlanModal.vue
Normal file
219
vue/src/components/AutoMealPlanModal.vue
Normal file
@ -0,0 +1,219 @@
|
||||
<template>
|
||||
<b-modal :id="modal_id" size="lg" :title="modal_title" hide-footer aria-label="" @show="showModal">
|
||||
<h5>{{ $t("Meal_Types") }}</h5>
|
||||
<div>
|
||||
<div>
|
||||
<b-card no-body class="mt-1 p-2"
|
||||
v-for="(meal_type, k) in AutoPlan.meal_types" :key="meal_type.id">
|
||||
<b-card-header class="p-2 border-0">
|
||||
<div class="row">
|
||||
<div class="col-10">
|
||||
<h5 class="mt-1 mb-1">
|
||||
{{ meal_type.icon }} {{
|
||||
meal_type.name
|
||||
}}
|
||||
</h5>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<generic-multiselect
|
||||
@change="genericSelectChanged"
|
||||
:initial_selection="AutoPlan.keywords[meal_type]"
|
||||
:parent_variable="`${k}`"
|
||||
:model="Models.KEYWORD"
|
||||
:placeholder="$t('Keywords, leave blank to exclude meal type')"
|
||||
:limit="50"
|
||||
/>
|
||||
</div>
|
||||
</b-card-header>
|
||||
</b-card>
|
||||
</div>
|
||||
<div class="row-cols-1 m-3">
|
||||
<b-form-input class="w-25 m-2 mb-0" :value = "AutoPlan.servings" :type="'number'" @input="updateServings"></b-form-input>
|
||||
<small tabindex="-1" class="m-2 mt-0 form-text text-muted">{{ $t("Servings") }}</small>
|
||||
</div>
|
||||
<b-form-group class="mt-3">
|
||||
<generic-multiselect
|
||||
required
|
||||
@change="AutoPlan.shared = $event.val"
|
||||
parent_variable="entryEditing.shared"
|
||||
:label="'display_name'"
|
||||
:model="Models.USER_NAME"
|
||||
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
|
||||
v-bind:placeholder="$t('Share')"
|
||||
:limit="10"
|
||||
:multiple="true"
|
||||
:initial_selection="AutoPlan.shared"
|
||||
></generic-multiselect>
|
||||
<small tabindex="-1" class="form-text text-muted">{{ $t("Share") }}</small>
|
||||
</b-form-group>
|
||||
<b-input-group v-if="!autoMealPlan">
|
||||
<b-form-checkbox id="AddToShopping" v-model="mealplan_settings.addshopping"/>
|
||||
<small tabindex="-1" class="form-text text-muted">{{
|
||||
$t("AddToShopping")
|
||||
}}</small>
|
||||
</b-input-group>
|
||||
|
||||
<div class="">
|
||||
<div class="row m-3 mb-0">
|
||||
<b-form-datepicker class="col" :value-as-date="true" :value="AutoPlan.startDay" @input="updateStartDay"></b-form-datepicker>
|
||||
<div class="col"></div>
|
||||
<b-form-datepicker class="col" :value-as-date="true" :value="AutoPlan.endDay" @input="updateEndDay"></b-form-datepicker>
|
||||
</div>
|
||||
<div class="row align-top m-3 mt-0">
|
||||
<small tabindex="-1" class="col align-text-top text-muted">{{ $t("Start Day") }}</small>
|
||||
<div class="col"></div>
|
||||
<small tabindex="-1" class="col align-self-end text-muted">{{ $t("End Day") }}</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-3 mb-3">
|
||||
<div class="col-12">
|
||||
<b-button class="float-right" variant="primary" @click="createPlan">{{ $t("Create Meal Plan") }}</b-button>
|
||||
<b-button class="" variant="danger" @click="exitPlan">{{ $t("Exit") }}</b-button>
|
||||
</div>
|
||||
</div>
|
||||
</b-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from "vue"
|
||||
import {BootstrapVue} from "bootstrap-vue"
|
||||
import GenericMultiselect from "@/components/GenericMultiselect"
|
||||
import {ApiMixin} from "@/utils/utils"
|
||||
import {useUserPreferenceStore} from "@/stores/UserPreferenceStore";
|
||||
import VueCookies from "vue-cookies";
|
||||
|
||||
const { ApiApiFactory } = require("@/utils/openapi/api")
|
||||
const { StandardToasts } = require("@/utils/utils")
|
||||
|
||||
Vue.use(BootstrapVue)
|
||||
Vue.use(VueCookies)
|
||||
let MEALPLAN_COOKIE_NAME = "mealplan_settings"
|
||||
|
||||
export default {
|
||||
name: "AutoMealPlanModal",
|
||||
components: {
|
||||
GenericMultiselect
|
||||
},
|
||||
props: {
|
||||
modal_title: String,
|
||||
modal_id: {
|
||||
type: String,
|
||||
default: "autoplan-modal",
|
||||
},
|
||||
current_period: Object
|
||||
},
|
||||
mixins: [ApiMixin],
|
||||
data() {
|
||||
return {
|
||||
AutoPlan: {
|
||||
meal_types: [],
|
||||
keywords: [[]],
|
||||
servings: 1,
|
||||
date: Date.now(),
|
||||
startDay: null,
|
||||
endDay: null,
|
||||
shared: [],
|
||||
addshopping: false
|
||||
},
|
||||
mealplan_settings: {
|
||||
addshopping: false,
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
mealplan_settings: {
|
||||
handler(newVal) {
|
||||
this.$cookies.set(MEALPLAN_COOKIE_NAME, this.mealplan_settings)
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
mounted: function () {
|
||||
useUserPreferenceStore().updateIfStaleOrEmpty()
|
||||
},
|
||||
computed: {
|
||||
autoMealPlan: function () {
|
||||
return useUserPreferenceStore().getStaleData()?.mealplan_autoadd_shopping
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
genericSelectChanged: function (obj) {
|
||||
this.AutoPlan.keywords[obj.var] = obj.val
|
||||
},
|
||||
showModal() {
|
||||
if (this.$cookies.isKey(MEALPLAN_COOKIE_NAME)) {
|
||||
this.mealplan_settings = Object.assign({}, this.mealplan_settings, this.$cookies.get(MEALPLAN_COOKIE_NAME))
|
||||
}
|
||||
this.refreshMealTypes()
|
||||
|
||||
this.AutoPlan.servings = 1
|
||||
this.AutoPlan.startDay = new Date()
|
||||
this.AutoPlan.endDay = this.current_period.periodEnd
|
||||
useUserPreferenceStore().getData().then(userPreference => {
|
||||
this.AutoPlan.shared = userPreference.plan_share
|
||||
})
|
||||
},
|
||||
sortMealTypes() {
|
||||
this.meal_types.forEach(function (element, index) {
|
||||
element.order = index
|
||||
})
|
||||
let updated = 0
|
||||
this.meal_types.forEach((meal_type) => {
|
||||
let apiClient = new ApiApiFactory()
|
||||
|
||||
apiClient
|
||||
.updateMealType(this.AutoPlan.meal_type, meal_type)
|
||||
.then((e) => {
|
||||
if (updated === this.meal_types.length - 1) {
|
||||
this.periodChangedCallback(this.current_period)
|
||||
} else {
|
||||
updated++
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
StandardToasts.makeStandardToast(this, StandardToasts.FAIL_UPDATE, err)
|
||||
})
|
||||
})
|
||||
},
|
||||
refreshMealTypes() {
|
||||
let apiClient = new ApiApiFactory()
|
||||
|
||||
Promise.resolve(apiClient.listMealTypes().then((result) => {
|
||||
result.data.forEach((meal_type) => {
|
||||
meal_type.editing = false
|
||||
})
|
||||
this.AutoPlan.meal_types = result.data
|
||||
})).then( () => {
|
||||
let mealArray = this.AutoPlan.meal_types
|
||||
for (let i = 0; i < mealArray.length; i++) {
|
||||
this.AutoPlan.keywords[i] = [];
|
||||
}}
|
||||
)
|
||||
},
|
||||
createPlan() {
|
||||
this.$bvModal.hide(`autoplan-modal`)
|
||||
this.AutoPlan.addshopping = this.mealplan_settings.addshopping
|
||||
this.$emit("create-plan", this.AutoPlan)
|
||||
},
|
||||
updateStartDay(date){
|
||||
this.AutoPlan.startDay = date
|
||||
},
|
||||
updateEndDay(date){
|
||||
this.AutoPlan.endDay = date
|
||||
},
|
||||
updateServings(numberOfServings) {
|
||||
this.AutoPlan.servings = numberOfServings
|
||||
},
|
||||
exitPlan() {
|
||||
this.$bvModal.hide(`autoplan-modal`)
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
@ -5356,6 +5356,39 @@ export const ApiApiAxiosParamCreator = function (configuration?: Configuration)
|
||||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {any} [body]
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
createAutoPlanViewSet: async (body?: any, options: any = {}): Promise<RequestArgs> => {
|
||||
const localVarPath = `/api/auto-plan/`;
|
||||
// use dummy base URL string because the URL constructor only accepts absolute URLs.
|
||||
const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
|
||||
let baseOptions;
|
||||
if (configuration) {
|
||||
baseOptions = configuration.baseOptions;
|
||||
}
|
||||
|
||||
const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
|
||||
const localVarHeaderParameter = {} as any;
|
||||
const localVarQueryParameter = {} as any;
|
||||
|
||||
|
||||
|
||||
localVarHeaderParameter['Content-Type'] = 'application/json';
|
||||
|
||||
setSearchParams(localVarUrlObj, localVarQueryParameter, options.query);
|
||||
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
|
||||
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
|
||||
localVarRequestOptions.data = serializeDataIfNeeded(body, localVarRequestOptions, configuration)
|
||||
|
||||
return {
|
||||
url: toPathString(localVarUrlObj),
|
||||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {Automation} [automation]
|
||||
@ -14686,6 +14719,16 @@ export const ApiApiFp = function(configuration?: Configuration) {
|
||||
const localVarAxiosArgs = await localVarAxiosParamCreator.createAccessToken(accessToken, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {any} [body]
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
async createAutoPlanViewSet(body?: any, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<any>> {
|
||||
const localVarAxiosArgs = await localVarAxiosParamCreator.createAutoPlanViewSet(body, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {Automation} [automation]
|
||||
@ -17464,6 +17507,15 @@ export const ApiApiFactory = function (configuration?: Configuration, basePath?:
|
||||
createAccessToken(accessToken?: AccessToken, options?: any): AxiosPromise<AccessToken> {
|
||||
return localVarFp.createAccessToken(accessToken, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {any} [body]
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
createAutoPlanViewSet(body?: any, options?: any): AxiosPromise<any> {
|
||||
return localVarFp.createAutoPlanViewSet(body, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {Automation} [automation]
|
||||
@ -19981,6 +20033,17 @@ export class ApiApi extends BaseAPI {
|
||||
return ApiApiFp(this.configuration).createAccessToken(accessToken, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {any} [body]
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
* @memberof ApiApi
|
||||
*/
|
||||
public createAutoPlanViewSet(body?: any, options?: any) {
|
||||
return ApiApiFp(this.configuration).createAutoPlanViewSet(body, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {Automation} [automation]
|
||||
|
Reference in New Issue
Block a user