auto meal plan tweaks and improvements

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

cookbook/views/api.py

@@ -678,7 +678,6 @@ class AutoPlanViewSet(viewsets.ViewSet):
             keywords = serializer.validated_data['keywords']
             start_date = serializer.validated_data['start_date']
             end_date = serializer.validated_data['end_date']
-            meal_type = MealType.objects.get(pk=serializer.validated_data['meal_type_id'])
             servings = serializer.validated_data['servings']
             shared = serializer.get_initial().get('shared', None)
             shared_pks = list()
@@ -686,8 +685,9 @@ class AutoPlanViewSet(viewsets.ViewSet):
                 for i in range(len(shared)):
                     shared_pks.append(shared[i]['id'])
 
-            days = (end_date - start_date).days + 1
+            days = min((end_date - start_date).days + 1, 14)
-            recipes = Recipe.objects.all()
+
+            recipes = Recipe.objects.values('id', 'name')
             meal_plans = list()
 
             for keyword in keywords:
@@ -695,15 +695,14 @@ class AutoPlanViewSet(viewsets.ViewSet):
 
             if len(recipes) == 0:
                 return Response(serializer.data)
-            recipes = recipes.order_by('?')[:days]
+            recipes = list(recipes.order_by('?')[:days])
-            recipes = list(recipes)
 
             for i in range(0, days):
                 day = start_date + datetime.timedelta(i)
                 recipe = recipes[i % len(recipes)]
-                args = {'recipe': recipe, 'servings': servings, 'title': recipe.name,
+                args = {'recipe_id': recipe['id'], 'servings': servings,
                         'created_by': request.user,
-                        'meal_type': meal_type,
+                        'meal_type_id': serializer.validated_data['meal_type_id'],
                         'note': '', 'date': day, 'space': request.space}
 
                 m = MealPlan(**args)

vue/src/apps/MealPlanView/MealPlanView.vue

@@ -83,7 +83,7 @@
                                         </div>
 
                                     </b-list-group-item>
-                                    <b-list-group-item v-for="plan in day.plan_entries" v-bind:key="plan.entry.id" >
+                                    <b-list-group-item v-for="plan in day.plan_entries" v-bind:key="plan.entry.id">
                                         <div class="d-flex flex-row align-items-center">
                                             <div>
                                                 <b-img style="height: 50px; width: 50px; object-fit: cover"
@@ -279,11 +279,10 @@
             :create_date="mealplan_default_date"
             @reload-meal-types="refreshMealTypes"
         ></meal-plan-edit-modal>
-      <auto-meal-plan-modal
+        <auto-meal-plan-modal
-        :modal_title="'Auto create meal plan'"
+            :modal_title="'Auto create meal plan'"
-        :current_period="current_period"
+            :current_period="current_period"
-        @create-plan="doAutoPlan"
+        ></auto-meal-plan-modal>
-      ></auto-meal-plan-modal>
 
         <div class="row d-none d-lg-block">
             <div class="col-12 float-right">
@@ -293,12 +292,6 @@
                 <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>
@@ -307,7 +300,7 @@
 
         <bottom-navigation-bar :create_links="[{label:$t('Export_To_ICal'), url: iCalUrl, icon:'fas fa-download'}]">
             <template #custom_create_functions>
-                <h6 class="dropdown-header">{{ $t('Meal_Plan')}}</h6>
+                <h6 class="dropdown-header">{{ $t('Meal_Plan') }}</h6>
                 <a class="dropdown-item" @click="createEntryClick(new Date())"><i
                     class="fas fa-calendar-plus fa-fw"></i> {{ $t("Create") }}</a>
             </template>
@@ -351,7 +344,7 @@ let SETTINGS_COOKIE_NAME = "mealplan_settings"
 export default {
     name: "MealPlanView",
     components: {
-      AutoMealPlanModal,
+        AutoMealPlanModal,
         MealPlanEditModal,
         MealPlanCard,
         CalendarView,
@@ -365,16 +358,16 @@ export default {
     mixins: [CalendarMathMixin, ApiMixin, ResolveUrlMixin],
     data: function () {
         return {
-          AutoPlan: {
+            AutoPlan: {
-            meal_types: [],
+                meal_types: [],
-            keywords: [[]],
+                keywords: [[]],
-            servings: 1,
+                servings: 1,
-            date: Date.now(),
+                date: Date.now(),
-            startDay: null,
+                startDay: null,
-            endDay: null,
+                endDay: null,
-            shared: [],
+                shared: [],
-            addshopping: false
+                addshopping: false
-          },
+            },
             showDate: new Date(),
             plan_entries: [],
             recipe_viewed: {},
@@ -688,36 +681,7 @@ export default {
         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: {
         hover: {

vue/src/components/AutoMealPlanModal.vue

@@ -1,79 +1,82 @@
 <template>
     <b-modal :id="modal_id" size="lg" :title="modal_title" hide-footer aria-label="" @show="showModal">
-      <h5>{{ $t("Meal_Types") }}</h5>
+        <h5>{{ $t("Meal_Types") }}</h5>
-                        <div>
+        <div>
-                            <div>
+            <div>
-                                <b-card no-body class="mt-1 p-2"
+                <b-card no-body class="mt-1 p-2"
-                                        v-for="(meal_type, k) in AutoPlan.meal_types" :key="meal_type.id">
+                        v-for="(meal_type, k) in AutoPlan.meal_types" :key="meal_type.id">
-                                    <b-card-header class="p-2 border-0">
+                    <b-card-header class="p-2 border-0">
-                                        <div class="row">
+                        <div class="row">
-                                            <div class="col-10">
+                            <div class="col-10">
-                                                <h5 class="mt-1 mb-1">
+                                <h5 class="mt-1 mb-1">
-                                                    {{ meal_type.icon }} {{
+                                    {{ meal_type.icon }} {{
-                                                        meal_type.name
+                                        meal_type.name
-                                                    }}
+                                    }}
-                                                </h5>
+                                </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="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" :type="'number'" v-model="AutoPlan.servings"></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="row mt-3 mb-3">
+            <div class="">
-        <div class="col-12">
+                <div class="row m-3 mb-0">
-          <b-button class="float-right" variant="primary" @click="createPlan">{{ $t("Create Meal Plan") }}</b-button>
+                    <b-form-datepicker class="col" :value-as-date="true" v-model="AutoPlan.startDay"></b-form-datepicker>
-        <b-button class="" variant="danger" @click="exitPlan">{{ $t("Exit") }}</b-button>
+                    <div class="col"></div>
+                    <b-form-datepicker class="col" :value-as-date="true" v-model="AutoPlan.endDay"></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" :disabled="loading">
+                    <b-spinner small v-if="loading"></b-spinner>
+                    {{ $t("Create Meal Plan") }}
+                </b-button>
+                <b-button class="" variant="danger" @click="exitPlan">{{ $t("Exit") }}</b-button>
+            </div>
         </div>
-      </div>
     </b-modal>
 </template>
 
@@ -84,9 +87,11 @@ import GenericMultiselect from "@/components/GenericMultiselect"
 import {ApiMixin} from "@/utils/utils"
 import {useUserPreferenceStore} from "@/stores/UserPreferenceStore";
 import VueCookies from "vue-cookies";
+import moment from "moment/moment";
+import {useMealPlanStore} from "@/stores/MealPlanStore";
 
-const { ApiApiFactory } = require("@/utils/openapi/api")
+const {ApiApiFactory} = require("@/utils/openapi/api")
-const { StandardToasts } = require("@/utils/utils")
+const {StandardToasts} = require("@/utils/utils")
 
 Vue.use(BootstrapVue)
 Vue.use(VueCookies)
@@ -94,8 +99,8 @@ let MEALPLAN_COOKIE_NAME = "mealplan_settings"
 
 export default {
     name: "AutoMealPlanModal",
-  components: {
+    components: {
-    GenericMultiselect
+        GenericMultiselect
     },
     props: {
         modal_title: String,
@@ -108,22 +113,23 @@ export default {
     mixins: [ApiMixin],
     data() {
         return {
-          AutoPlan: {
+            AutoPlan: {
-            meal_types: [],
+                meal_types: [],
-            keywords: [[]],
+                keywords: [[]],
-            servings: 1,
+                servings: 1,
-            date: Date.now(),
+                date: Date.now(),
-            startDay: null,
+                startDay: null,
-            endDay: null,
+                endDay: null,
-            shared: [],
+                shared: [],
-            addshopping: false
+                addshopping: false
-          },
+            },
-          mealplan_settings: {
+            mealplan_settings: {
                 addshopping: false,
-            }
+            },
+            loading: false,
         }
     },
-  watch: {
+    watch: {
         mealplan_settings: {
             handler(newVal) {
                 this.$cookies.set(MEALPLAN_COOKIE_NAME, this.mealplan_settings)
@@ -141,22 +147,25 @@ export default {
     },
     methods: {
         genericSelectChanged: function (obj) {
-          this.AutoPlan.keywords[obj.var] = obj.val
+            this.AutoPlan.keywords[obj.var] = obj.val
         },
         showModal() {
-          if (this.$cookies.isKey(MEALPLAN_COOKIE_NAME)) {
+            if (this.$cookies.isKey(MEALPLAN_COOKIE_NAME)) {
                 this.mealplan_settings = Object.assign({}, this.mealplan_settings, this.$cookies.get(MEALPLAN_COOKIE_NAME))
-          }
+            }
-          this.refreshMealTypes()
+            this.refreshMealTypes()
 
-          this.AutoPlan.servings = 1
+            this.AutoPlan.servings = 1
-          this.AutoPlan.startDay = new Date()
+            this.AutoPlan.startDay = new Date()
-          this.AutoPlan.endDay = this.current_period.periodEnd
+            this.AutoPlan.endDay = this.current_period.periodEnd
-          useUserPreferenceStore().getData().then(userPreference => {
+            useUserPreferenceStore().getData().then(userPreference => {
-                    this.AutoPlan.shared = userPreference.plan_share
+                this.AutoPlan.shared = userPreference.plan_share
             })
+            this.AutoPlan.addshopping = this.mealplan_settings.addshopping
+
+            this.loading = false
         },
-       sortMealTypes() {
+        sortMealTypes() {
             this.meal_types.forEach(function (element, index) {
                 element.order = index
             })
@@ -178,7 +187,7 @@ export default {
                     })
             })
         },
-      refreshMealTypes() {
+        refreshMealTypes() {
             let apiClient = new ApiApiFactory()
 
             Promise.resolve(apiClient.listMealTypes().then((result) => {
@@ -186,30 +195,57 @@ export default {
                     meal_type.editing = false
                 })
                 this.AutoPlan.meal_types = result.data
-            })).then( () => {
+            })).then(() => {
-              let mealArray = this.AutoPlan.meal_types
+                    let mealArray = this.AutoPlan.meal_types
-              for (let i = 0; i < mealArray.length; i++) {
+                    for (let i = 0; i < mealArray.length; i++) {
-                 this.AutoPlan.keywords[i] = [];
+                        this.AutoPlan.keywords[i] = [];
-              }}
+                    }
+                }
             )
         },
-      createPlan() {
+        createPlan() {
-            this.$bvModal.hide(`autoplan-modal`)
+            if (!this.loading) {
-            this.AutoPlan.addshopping = this.mealplan_settings.addshopping
+                this.loading = true
-            this.$emit("create-plan", this.AutoPlan)
+
+                let requests = []
+                for (let i = 0; i < this.AutoPlan.meal_types.length; i++) {
+                    if (this.AutoPlan.keywords[i].length === 0) continue
+                    requests.push(this.autoPlanThread(this.AutoPlan, i))
+                }
+
+                Promise.allSettled(requests).then(r => {
+                    this.refreshEntries()
+                    this.loading = false
+                    this.$bvModal.hide(`autoplan-modal`)
+                }).catch(err => {
+                    StandardToasts.makeStandardToast(this, StandardToasts.FAIL_CREATE, err)
+                    this.loading = false
+                })
+            }
+
         },
-      updateStartDay(date){
+
-          this.AutoPlan.startDay = date
+        async autoPlanThread(autoPlan, mealTypeIndex) {
-      },
+            let apiClient = new ApiApiFactory()
-      updateEndDay(date){
+            let data = {
-          this.AutoPlan.endDay = date
+                "start_date": moment(autoPlan.startDay).format("YYYY-MM-DD"),
-      },
+                "end_date": moment(autoPlan.endDay).format("YYYY-MM-DD"),
-      updateServings(numberOfServings) {
+                "meal_type_id": autoPlan.meal_types[mealTypeIndex].id,
-          this.AutoPlan.servings = numberOfServings
+                "keywords": autoPlan.keywords[mealTypeIndex],
-      },
+                "servings": autoPlan.servings,
-      exitPlan() {
+                "shared": autoPlan.shared,
-          this.$bvModal.hide(`autoplan-modal`)
+                "addshopping": autoPlan.addshopping
-      }
+            }
+            return apiClient.createAutoPlanViewSet(data)
+
+        },
+        refreshEntries() { //TODO move properly to MealPLanStore (save period for default refresh)
+            let date = this.current_period
+            useMealPlanStore().refreshFromAPI(moment(date.periodStart).format("YYYY-MM-DD"), moment(date.periodEnd).format("YYYY-MM-DD"))
+        },
+        exitPlan() {
+            this.$bvModal.hide(`autoplan-modal`)
+        }
     },