From d4eb5f07dbd90fed3aca8d0b2e01725065978300 Mon Sep 17 00:00:00 2001 From: Bernd Bestel Date: Sun, 3 Apr 2022 17:03:23 +0200 Subject: [PATCH] Make the meal plan entry day editable (closes #775) --- changelog/67_UNRELEASED_xxxx-xx-xx.md | 1 + localization/strings.pot | 18 ++++ public/viewjs/components/datetimepicker.js | 10 ++- public/viewjs/components/datetimepicker2.js | 14 +-- public/viewjs/mealplan.js | 98 +++++++++------------ views/mealplan.blade.php | 16 +++- 6 files changed, 90 insertions(+), 67 deletions(-) diff --git a/changelog/67_UNRELEASED_xxxx-xx-xx.md b/changelog/67_UNRELEASED_xxxx-xx-xx.md index afa110fc..3a244ffc 100644 --- a/changelog/67_UNRELEASED_xxxx-xx-xx.md +++ b/changelog/67_UNRELEASED_xxxx-xx-xx.md @@ -55,6 +55,7 @@ ### Meal plan +- The day is now editable in the edit dialog of any meal plan entry, which makes it possible to move entries to a different day - Fixed that it was not possible to print the meal plan (and other pages) in landscape (thanks @miguelangel-nubla) ### Chores diff --git a/localization/strings.pot b/localization/strings.pot index c9ba1411..55f79279 100644 --- a/localization/strings.pot +++ b/localization/strings.pot @@ -2362,3 +2362,21 @@ msgstr "" msgid "Now / today" msgstr "" + +msgid "Add recipe meal plan entry" +msgstr "" + +msgid "Add note meal plan entry" +msgstr "" + +msgid "Add product meal plan entry" +msgstr "" + +msgid "Edit note meal plan entry" +msgstr "" + +msgid "Edit product meal plan entry" +msgstr "" + +msgid "Edit recipe meal plan entry" +msgstr "" diff --git a/public/viewjs/components/datetimepicker.js b/public/viewjs/components/datetimepicker.js index 32c51d90..7c73f3af 100644 --- a/public/viewjs/components/datetimepicker.js +++ b/public/viewjs/components/datetimepicker.js @@ -25,8 +25,7 @@ Grocy.Components.DateTimePicker.SetValue = function(value, inputElement = Grocy. Grocy.Components.DateTimePicker.Clear = function() { - $(".datetimepicker").datetimepicker("destroy"); - Grocy.Components.DateTimePicker.Init(); + Grocy.Components.DateTimePicker.Init(true); Grocy.Components.DateTimePicker.GetInputElement().val(""); @@ -74,8 +73,13 @@ if (Grocy.Components.DateTimePicker.GetInputElement().data('limit-end-to-now') = limitDate = moment(); } -Grocy.Components.DateTimePicker.Init = function() +Grocy.Components.DateTimePicker.Init = function(reInit = false) { + if (reInit) + { + $(".datetimepicker").datetimepicker("destroy"); + } + $(".datetimepicker").each(function() { $(this).datetimepicker( diff --git a/public/viewjs/components/datetimepicker2.js b/public/viewjs/components/datetimepicker2.js index a99714ee..ed2fcb26 100644 --- a/public/viewjs/components/datetimepicker2.js +++ b/public/viewjs/components/datetimepicker2.js @@ -25,8 +25,7 @@ Grocy.Components.DateTimePicker2.SetValue = function(value, inputElement = Grocy Grocy.Components.DateTimePicker2.Clear = function() { - $(".datetimepicker2").datetimepicker("destroy"); - Grocy.Components.DateTimePicker2.Init(); + Grocy.Components.DateTimePicker2.Init(true); Grocy.Components.DateTimePicker2.GetInputElement().val(""); @@ -50,11 +49,11 @@ Grocy.Components.DateTimePicker2.ChangeFormat = function(format) if (format == "YYYY-MM-DD") { - Grocy.Components.DateTimePicker2.GetInputElement().addClass("date-only-datetimepicker"); + Grocy.Components.DateTimePicker2.GetInputElement().addClass("date-only-datetimepicker2"); } else { - Grocy.Components.DateTimePicker2.GetInputElement().removeClass("date-only-datetimepicker"); + Grocy.Components.DateTimePicker2.GetInputElement().removeClass("date-only-datetimepicker2"); } } @@ -74,8 +73,13 @@ if (Grocy.Components.DateTimePicker2.GetInputElement().data('limit-end-to-now') limitDate = moment(); } -Grocy.Components.DateTimePicker2.Init = function() +Grocy.Components.DateTimePicker2.Init = function(reInit = false) { + if (reInit) + { + $(".datetimepicker2").datetimepicker("destroy"); + } + $(".datetimepicker2").each(function() { $(this).datetimepicker( diff --git a/public/viewjs/mealplan.js b/public/viewjs/mealplan.js index 9f4be9ea..a425a41a 100644 --- a/public/viewjs/mealplan.js +++ b/public/viewjs/mealplan.js @@ -363,8 +363,11 @@ $(document).on("click", ".add-recipe-button", function(e) { var day = $(this).parent().parent().data("date"); - $("#add-recipe-modal-title").text(__t("Add recipe on %s", day.toString())); - $("#day").val(day.toString()); + $("#add-recipe-modal-title").text(__t("Add recipe meal plan entry")); + $(".datetimepicker-wrapper").detach().prependTo("#add-recipe-form"); + $("input#day").detach().appendTo("#add-recipe-form"); + Grocy.Components.DateTimePicker.Init(true); + Grocy.Components.DateTimePicker.SetValue(day); Grocy.Components.RecipePicker.Clear(); $("#section_id_note").val(-1); $("#add-recipe-modal").modal("show"); @@ -376,8 +379,11 @@ $(document).on("click", ".add-note-button", function(e) { var day = $(this).parent().parent().parent().data("date"); - $("#add-note-modal-title").text(__t("Add note on %s", day.toString())); - $("#day").val(day.toString()); + $("#add-note-modal-title").text(__t("Add note meal plan entry")); + $(".datetimepicker-wrapper").detach().prependTo("#add-note-form"); + $("input#day").detach().appendTo("#add-note-form") + Grocy.Components.DateTimePicker.Init(true); + Grocy.Components.DateTimePicker.SetValue(day); $("#note").val(""); $("#section_id_note").val(-1); $("#add-note-modal").modal("show"); @@ -389,8 +395,11 @@ $(document).on("click", ".add-product-button", function(e) { var day = $(this).parent().parent().parent().data("date"); - $("#add-product-modal-title").text(__t("Add product on %s", day.toString())); - $("#day").val(day.toString()); + $("#add-product-modal-title").text(__t("Add product meal plan entry")); + $(".datetimepicker-wrapper").detach().prependTo("#add-product-form"); + $("input#day").detach().appendTo("#add-product-form") + Grocy.Components.DateTimePicker.Init(true); + Grocy.Components.DateTimePicker.SetValue(day); Grocy.Components.ProductPicker.Clear(); $("#section_id_note").val(-1); $("#add-product-modal").modal("show"); @@ -404,8 +413,11 @@ $(document).on("click", ".edit-meal-plan-entry-button", function(e) if (mealPlanEntry.type == "recipe") { - $("#add-recipe-modal-title").text(__t("Edit recipe on %s", mealPlanEntry.day.toString())); - $("#day").val(mealPlanEntry.day.toString()); + $(".datetimepicker-wrapper").detach().prependTo("#add-recipe-form"); + $("input#day").detach().appendTo("#add-recipe-form") + Grocy.Components.DateTimePicker.Init(true); + Grocy.Components.DateTimePicker.SetValue(mealPlanEntry.day); + $("#add-recipe-modal-title").text(__t("Edit recipe meal plan entry")); $("#recipe_servings").val(mealPlanEntry.recipe_servings); Grocy.Components.RecipePicker.SetId(mealPlanEntry.recipe_id); $("#add-recipe-modal").modal("show"); @@ -414,8 +426,11 @@ $(document).on("click", ".edit-meal-plan-entry-button", function(e) } else if (mealPlanEntry.type == "product") { - $("#add-product-modal-title").text(__t("Edit product on %s", mealPlanEntry.day.toString())); - $("#day").val(mealPlanEntry.day.toString()); + $(".datetimepicker-wrapper").detach().prependTo("#add-product-form"); + $("input#day").detach().appendTo("#add-product-form") + Grocy.Components.DateTimePicker.Init(true); + Grocy.Components.DateTimePicker.SetValue(mealPlanEntry.day); + $("#add-product-modal-title").text(__t("Edit product meal plan entry")); Grocy.Components.ProductPicker.SetId(mealPlanEntry.product_id); $("#add-product-modal").modal("show"); $("#section_id_product").val(mealPlanEntry.section_id); @@ -424,8 +439,11 @@ $(document).on("click", ".edit-meal-plan-entry-button", function(e) } else if (mealPlanEntry.type == "note") { - $("#add-note-modal-title").text(__t("Edit note on %s", mealPlanEntry.day.toString())); - $("#day").val(mealPlanEntry.day.toString()); + $(".datetimepicker-wrapper").detach().prependTo("#add-note-form"); + $("input#day").detach().appendTo("#add-note-form"); + Grocy.Components.DateTimePicker.Init(true); + Grocy.Components.DateTimePicker.SetValue(mealPlanEntry.day); + $("#add-note-modal-title").text(__t("Edit note meal plan entry")); $("#note").val(mealPlanEntry.note); $("#add-note-modal").modal("show"); $("#section_id_note").val(mealPlanEntry.section_id); @@ -440,8 +458,8 @@ $(document).on("click", ".copy-day-button", function(e) var day = $(this).parent().parent().parent().data("date"); $("#copy-day-modal-title").text(__t("Copy all meal plan entries of %s", day.toString())); - $("#day").val(day.toString()); - Grocy.Components.DateTimePicker.Clear(); + Grocy.Components.DateTimePicker.SetValue(day); + Grocy.Components.DateTimePicker2.Clear(); $("#copy-day-modal").modal("show"); Grocy.FrontendHelpers.ValidateForm("copy-day-form"); Grocy.IsMealPlanEntryEditAction = false; @@ -474,7 +492,7 @@ $("#add-product-modal").on("shown.bs.modal", function(e) $("#copy-day-modal").on("shown.bs.modal", function(e) { - Grocy.Components.DateTimePicker.GetInputElement().focus(); + Grocy.Components.DateTimePicker2.GetInputElement().focus(); }) $(document).on("click", ".remove-recipe-button, .remove-note-button, .remove-product-button", function(e) @@ -497,17 +515,7 @@ $('#save-add-recipe-button').on('click', function(e) { e.preventDefault(); - if (!Grocy.FrontendHelpers.ValidateForm("add-recipe-form", true)) - { - return; - } - - if ($(".combobox-menu-visible").length) - { - return; - } - - if (!Grocy.FrontendHelpers.ValidateForm('add-recipe-form')) + if (!Grocy.FrontendHelpers.ValidateForm("add-recipe-form", true) || $(".combobox-menu-visible").length) { return false; } @@ -515,6 +523,7 @@ $('#save-add-recipe-button').on('click', function(e) var formData = $('#add-recipe-form').serializeJSON(); formData.section_id = formData.section_id_recipe; delete formData.section_id_recipe; + formData.day = Grocy.Components.DateTimePicker.GetValue(); if (Grocy.IsMealPlanEntryEditAction) { @@ -548,23 +557,13 @@ $('#save-add-note-button').on('click', function(e) { e.preventDefault(); - if (!Grocy.FrontendHelpers.ValidateForm("add-note-form", true)) - { - return; - } - - if ($(".combobox-menu-visible").length) - { - return; - } - - if (!Grocy.FrontendHelpers.ValidateForm('add-note-form')) + if (!Grocy.FrontendHelpers.ValidateForm("add-note-form", true) || $(".combobox-menu-visible").length) { return false; } var jsonData = $('#add-note-form').serializeJSON(); - jsonData.day = $("#day").val(); + jsonData.day = Grocy.Components.DateTimePicker.GetValue(); jsonData.section_id = jsonData.section_id_note; delete jsonData.section_id_note; @@ -601,23 +600,13 @@ $('#save-add-product-button').on('click', function(e) { e.preventDefault(); - if (!Grocy.FrontendHelpers.ValidateForm("add-product-form", true)) - { - return; - } - - if ($(".combobox-menu-visible").length) - { - return; - } - - if (!Grocy.FrontendHelpers.ValidateForm('add-product-form')) + if (!Grocy.FrontendHelpers.ValidateForm("add-product-form", true) || $(".combobox-menu-visible").length) { return false; } var jsonData = $('#add-product-form').serializeJSON(); - jsonData.day = $("#day").val(); + jsonData.day = Grocy.Components.DateTimePicker.GetValue();; delete jsonData.display_amount; jsonData.product_amount = jsonData.amount; delete jsonData.amount; @@ -661,17 +650,12 @@ $('#save-copy-day-button').on('click', function(e) e.preventDefault(); if (!Grocy.FrontendHelpers.ValidateForm("copy-day-form", true)) - { - return; - } - - if (!Grocy.FrontendHelpers.ValidateForm('copy-day-form')) { return false; } - var dayFrom = $("#day").val(); - var dayTo = Grocy.Components.DateTimePicker.GetValue(); + var dayFrom = Grocy.Components.DateTimePicker.GetValue(); + var dayTo = Grocy.Components.DateTimePicker2.GetValue(); Grocy.Api.Get('objects/meal_plan?query[]=day=' + dayFrom, function(sourceMealPlanEntries) diff --git a/views/mealplan.blade.php b/views/mealplan.blade.php index e0b49ef8..987a59d1 100644 --- a/views/mealplan.blade.php +++ b/views/mealplan.blade.php @@ -158,6 +158,18 @@
+ @include('components.datetimepicker', array( + 'id' => 'day', + 'label' => 'Day', + 'format' => 'YYYY-MM-DD', + 'initWithNow' => false, + 'limitEndToNow' => false, + 'limitStartToNow' => false, + 'isRequired' => true, + 'additionalCssClasses' => 'date-only-datetimepicker', + 'invalidFeedback' => $__t('A date is required') + )) + @include('components.recipepicker', array( 'recipes' => $recipes, 'isRequired' => true, @@ -321,7 +333,7 @@ - @include('components.datetimepicker', array( + @include('components.datetimepicker2', array( 'id' => 'copy_to_date', 'label' => 'Day', 'format' => 'YYYY-MM-DD', @@ -329,7 +341,7 @@ 'limitEndToNow' => false, 'limitStartToNow' => false, 'isRequired' => true, - 'additionalCssClasses' => 'date-only-datetimepicker', + 'additionalCssClasses' => 'date-only-datetimepicker2', 'invalidFeedback' => $__t('A date is required') ))