mirror of
https://github.com/TandoorRecipes/recipes.git
synced 2026-01-02 12:49:02 -05:00
related recipes included when adding mealplan to shopping list
This commit is contained in:
@@ -1,34 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<div style="position: static;" class=" btn-group">
|
||||
<div class="dropdown b-dropdown position-static">
|
||||
<li @click="$refs.submenu.open($event)" role="presentation" class="btn dropdown-toggle btn-link text-decoration-none text-body pr-1 dropdown-toggle-no-caret">
|
||||
<slot />
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
<ContextMenu ref="submenu">
|
||||
<template #menu="{ contextData }">
|
||||
<ContextMenuItem
|
||||
@click="
|
||||
$refs.menu.close()
|
||||
moveEntry(contextData)
|
||||
"
|
||||
>
|
||||
<a class="dropdown-item p-2" href="#"><i class="fas fa-cubes"></i> submenu item</a>
|
||||
</ContextMenuItem>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ContextMenu from "@/components/ContextMenu/ContextMenu"
|
||||
import ContextMenuItem from "@/components/ContextMenu/ContextMenuItem"
|
||||
export default {
|
||||
name: "ContextSubmenu.vue",
|
||||
components: { ContextMenu, ContextMenuItem },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
@@ -1,193 +1,189 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<div class="dropdown d-print-none">
|
||||
<a class="btn shadow-none" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="fas fa-ellipsis-v fa-lg"></i>
|
||||
</a>
|
||||
|
||||
<div class="dropdown d-print-none">
|
||||
<a class="btn shadow-none" href="javascript:void(0);" role="button" id="dropdownMenuLink"
|
||||
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="fas fa-ellipsis-v fa-lg"></i>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuLink">
|
||||
<a class="dropdown-item" :href="resolveDjangoUrl('edit_recipe', recipe.id)"><i class="fas fa-pencil-alt fa-fw"></i> {{ $t("Edit") }}</a>
|
||||
|
||||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuLink">
|
||||
<a class="dropdown-item" :href="resolveDjangoUrl('edit_convert_recipe', recipe.id)" v-if="!recipe.internal"
|
||||
><i class="fas fa-exchange-alt fa-fw"></i> {{ $t("convert_internal") }}</a
|
||||
>
|
||||
|
||||
<a class="dropdown-item" :href="resolveDjangoUrl('edit_recipe', recipe.id)"><i
|
||||
class="fas fa-pencil-alt fa-fw"></i> {{ $t('Edit') }}</a>
|
||||
<a href="#">
|
||||
<button class="dropdown-item" @click="$bvModal.show(`id_modal_add_book_${modal_id}`)"><i class="fas fa-bookmark fa-fw"></i> {{ $t("Manage_Books") }}</button>
|
||||
</a>
|
||||
|
||||
<a class="dropdown-item" :href="resolveDjangoUrl('edit_convert_recipe', recipe.id)" v-if="!recipe.internal"><i
|
||||
class="fas fa-exchange-alt fa-fw"></i> {{ $t('convert_internal') }}</a>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
:href="`${resolveDjangoUrl('view_shopping')}?r=[${recipe.id},${servings_value}]`"
|
||||
v-if="recipe.internal"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<i class="fas fa-shopping-cart fa-fw"></i> {{ $t("Add_to_Shopping") }}
|
||||
</a>
|
||||
|
||||
<a href="javascript:void(0);">
|
||||
<button class="dropdown-item" @click="$bvModal.show(`id_modal_add_book_${modal_id}`)">
|
||||
<i class="fas fa-bookmark fa-fw"></i> {{ $t('Manage_Books') }}
|
||||
</button>
|
||||
</a>
|
||||
<a class="dropdown-item" v-if="recipe.internal" @click="addToShopping" href="#"> <i class="fas fa-shopping-cart fa-fw"></i> New {{ $t("Add_to_Shopping") }} </a>
|
||||
|
||||
<a class="dropdown-item" :href="`${resolveDjangoUrl('view_shopping') }?r=[${recipe.id},${servings_value}]`"
|
||||
v-if="recipe.internal" target="_blank" rel="noopener noreferrer">
|
||||
<i class="fas fa-shopping-cart fa-fw"></i> {{ $t('Add_to_Shopping') }}
|
||||
</a>
|
||||
<a class="dropdown-item" @click="createMealPlan" href="#"><i class="fas fa-calendar fa-fw"></i> {{ $t("Add_to_Plan") }} </a>
|
||||
|
||||
<a class="dropdown-item" v-if="recipe.internal" @click="addToShopping" href="#">
|
||||
<i class="fas fa-shopping-cart fa-fw"></i> New {{ $t('Add_to_Shopping') }}
|
||||
</a>
|
||||
<a href="#">
|
||||
<button class="dropdown-item" @click="$bvModal.show(`id_modal_cook_log_${modal_id}`)">
|
||||
<i class="fas fa-clipboard-list fa-fw"></i> {{ $t("Log_Cooking") }}
|
||||
</button>
|
||||
</a>
|
||||
|
||||
<a class="dropdown-item" @click="createMealPlan" href="#"><i
|
||||
class="fas fa-calendar fa-fw"></i> {{ $t('Add_to_Plan') }}
|
||||
</a>
|
||||
<a href="#">
|
||||
<button class="dropdown-item" onclick="window.print()"><i class="fas fa-print fa-fw"></i> {{ $t("Print") }}</button>
|
||||
</a>
|
||||
|
||||
<a href="javascript:void(0);">
|
||||
<button class="dropdown-item" @click="$bvModal.show(`id_modal_cook_log_${modal_id}`)"><i
|
||||
class="fas fa-clipboard-list fa-fw"></i> {{ $t('Log_Cooking') }}
|
||||
</button>
|
||||
</a>
|
||||
<a class="dropdown-item" :href="resolveDjangoUrl('view_export') + '?r=' + recipe.id" target="_blank" rel="noopener noreferrer"
|
||||
><i class="fas fa-file-export fa-fw"></i> {{ $t("Export") }}</a
|
||||
>
|
||||
|
||||
<a href="javascript:void(0);">
|
||||
<button class="dropdown-item" onclick="window.print()"><i
|
||||
class="fas fa-print fa-fw"></i> {{ $t('Print') }}
|
||||
</button>
|
||||
</a>
|
||||
|
||||
<a class="dropdown-item" :href="resolveDjangoUrl('view_export') + '?r=' + recipe.id" target="_blank"
|
||||
rel="noopener noreferrer"><i class="fas fa-file-export fa-fw"></i> {{ $t('Export') }}</a>
|
||||
|
||||
<a href="javascript:void(0);">
|
||||
<button class="dropdown-item" @click="createShareLink()" v-if="recipe.internal"><i
|
||||
class="fas fa-share-alt fa-fw"></i> {{ $t('Share') }}
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<cook-log :recipe="recipe" :modal_id="modal_id"></cook-log>
|
||||
<add-recipe-to-book :recipe="recipe" :modal_id="modal_id"></add-recipe-to-book>
|
||||
|
||||
<b-modal :id="`modal-share-link_${modal_id}`" v-bind:title="$t('Share')" hide-footer>
|
||||
<div class="row">
|
||||
<div class="col col-md-12">
|
||||
<label v-if="recipe_share_link !== undefined">{{ $t('Public share link') }}</label>
|
||||
<input ref="share_link_ref" class="form-control" v-model="recipe_share_link"/>
|
||||
<b-button class="mt-2 mb-3 d-none d-md-inline" variant="secondary"
|
||||
@click="$bvModal.hide(`modal-share-link_${modal_id}`)">{{ $t('Close') }}
|
||||
</b-button>
|
||||
<b-button class="mt-2 mb-3 ml-md-2" variant="primary" @click="copyShareLink()">{{ $t('Copy') }}</b-button>
|
||||
<b-button class="mt-2 mb-3 ml-2 float-right" variant="success" @click="shareIntend()">{{ $t('Share') }} <i
|
||||
class="fa fa-share-alt"></i></b-button>
|
||||
<a href="#">
|
||||
<button class="dropdown-item" @click="createShareLink()" v-if="recipe.internal"><i class="fas fa-share-alt fa-fw"></i> {{ $t("Share") }}</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</b-modal>
|
||||
|
||||
<meal-plan-edit-modal :entry="entryEditing" :entryEditing_initial_recipe="[recipe]"
|
||||
:entry-editing_initial_meal_type="[]" @save-entry="saveMealPlan"
|
||||
:modal_id="`modal-meal-plan_${modal_id}`" :allow_delete="false" :modal_title="$t('Create_Meal_Plan_Entry')"></meal-plan-edit-modal>
|
||||
<shopping-modal :recipe="recipe" :servings="servings_value" :modal_id="modal_id"/>
|
||||
</div>
|
||||
<cook-log :recipe="recipe" :modal_id="modal_id"></cook-log>
|
||||
<add-recipe-to-book :recipe="recipe" :modal_id="modal_id"></add-recipe-to-book>
|
||||
|
||||
<b-modal :id="`modal-share-link_${modal_id}`" v-bind:title="$t('Share')" hide-footer>
|
||||
<div class="row">
|
||||
<div class="col col-md-12">
|
||||
<label v-if="recipe_share_link !== undefined">{{ $t("Public share link") }}</label>
|
||||
<input ref="share_link_ref" class="form-control" v-model="recipe_share_link" />
|
||||
<b-button class="mt-2 mb-3 d-none d-md-inline" variant="secondary" @click="$bvModal.hide(`modal-share-link_${modal_id}`)">{{ $t("Close") }} </b-button>
|
||||
<b-button class="mt-2 mb-3 ml-md-2" variant="primary" @click="copyShareLink()">{{ $t("Copy") }}</b-button>
|
||||
<b-button class="mt-2 mb-3 ml-2 float-right" variant="success" @click="shareIntend()">{{ $t("Share") }} <i class="fa fa-share-alt"></i></b-button>
|
||||
</div>
|
||||
</div>
|
||||
</b-modal>
|
||||
|
||||
<meal-plan-edit-modal
|
||||
:entry="entryEditing"
|
||||
:entryEditing_initial_recipe="[recipe]"
|
||||
:entryEditing_inital_servings="recipe.servings"
|
||||
:entry-editing_initial_meal_type="[]"
|
||||
@save-entry="saveMealPlan"
|
||||
:modal_id="`modal-meal-plan_${modal_id}`"
|
||||
:allow_delete="false"
|
||||
:modal_title="$t('Create_Meal_Plan_Entry')"
|
||||
></meal-plan-edit-modal>
|
||||
<shopping-modal :recipe="recipe" :servings="servings_value" :modal_id="modal_id" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import {makeToast, resolveDjangoUrl, ResolveUrlMixin, StandardToasts} from "@/utils/utils";
|
||||
import CookLog from "@/components/CookLog";
|
||||
import axios from "axios";
|
||||
import AddRecipeToBook from "@/components/Modals/AddRecipeToBook";
|
||||
import MealPlanEditModal from "@/components/Modals/MealPlanEditModal";
|
||||
import ShoppingModal from "@/components/Modals/ShoppingModal";
|
||||
import moment from "moment";
|
||||
import Vue from "vue";
|
||||
import {ApiApiFactory} from "@/utils/openapi/api";
|
||||
import { makeToast, resolveDjangoUrl, ResolveUrlMixin, StandardToasts } from "@/utils/utils"
|
||||
import CookLog from "@/components/CookLog"
|
||||
import axios from "axios"
|
||||
import AddRecipeToBook from "@/components/Modals/AddRecipeToBook"
|
||||
import MealPlanEditModal from "@/components/Modals/MealPlanEditModal"
|
||||
import ShoppingModal from "@/components/Modals/ShoppingModal"
|
||||
import moment from "moment"
|
||||
import Vue from "vue"
|
||||
import { ApiApiFactory } from "@/utils/openapi/api"
|
||||
|
||||
Vue.prototype.moment = moment
|
||||
|
||||
export default {
|
||||
name: 'RecipeContextMenu',
|
||||
mixins: [
|
||||
ResolveUrlMixin
|
||||
],
|
||||
components: {
|
||||
AddRecipeToBook,
|
||||
CookLog,
|
||||
MealPlanEditModal,
|
||||
ShoppingModal
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
servings_value: 0,
|
||||
recipe_share_link: undefined,
|
||||
modal_id: this.recipe.id + Math.round(Math.random() * 100000),
|
||||
options: {
|
||||
entryEditing: {
|
||||
date: null,
|
||||
id: -1,
|
||||
meal_type: null,
|
||||
note: "",
|
||||
note_markdown: "",
|
||||
recipe: null,
|
||||
servings: 1,
|
||||
shared: [],
|
||||
title: '',
|
||||
title_placeholder: this.$t('Title'),
|
||||
name: "RecipeContextMenu",
|
||||
mixins: [ResolveUrlMixin],
|
||||
components: {
|
||||
AddRecipeToBook,
|
||||
CookLog,
|
||||
MealPlanEditModal,
|
||||
ShoppingModal,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
servings_value: 0,
|
||||
recipe_share_link: undefined,
|
||||
modal_id: this.recipe.id + Math.round(Math.random() * 100000),
|
||||
options: {
|
||||
entryEditing: {
|
||||
date: null,
|
||||
id: -1,
|
||||
meal_type: null,
|
||||
note: "",
|
||||
note_markdown: "",
|
||||
recipe: null,
|
||||
servings: 1,
|
||||
shared: [],
|
||||
title: "",
|
||||
title_placeholder: this.$t("Title"),
|
||||
},
|
||||
},
|
||||
entryEditing: {},
|
||||
}
|
||||
},
|
||||
entryEditing: {},
|
||||
}
|
||||
},
|
||||
props: {
|
||||
recipe: Object,
|
||||
servings: {
|
||||
type: Number,
|
||||
default: -1
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.servings_value = ((this.servings === -1) ? this.recipe.servings : this.servings)
|
||||
},
|
||||
methods: {
|
||||
saveMealPlan: function (entry) {
|
||||
entry.date = moment(entry.date).format("YYYY-MM-DD")
|
||||
},
|
||||
props: {
|
||||
recipe: Object,
|
||||
servings: {
|
||||
type: Number,
|
||||
default: -1,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.servings_value = this.servings === -1 ? this.recipe.servings : this.servings
|
||||
},
|
||||
methods: {
|
||||
saveMealPlan: function(entry) {
|
||||
entry.date = moment(entry.date).format("YYYY-MM-DD")
|
||||
|
||||
let apiClient = new ApiApiFactory()
|
||||
let apiClient = new ApiApiFactory()
|
||||
|
||||
apiClient.createMealPlan(entry).then(result => {
|
||||
this.$bvModal.hide(`modal-meal-plan_${this.modal_id}`)
|
||||
StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
|
||||
}).catch(error => {
|
||||
StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
|
||||
})
|
||||
apiClient
|
||||
.createMealPlan(entry)
|
||||
.then((result) => {
|
||||
this.$bvModal.hide(`modal-meal-plan_${this.modal_id}`)
|
||||
StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
|
||||
})
|
||||
.catch((error) => {
|
||||
StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
|
||||
})
|
||||
},
|
||||
createMealPlan(data) {
|
||||
this.entryEditing = this.options.entryEditing
|
||||
this.entryEditing.recipe = this.recipe
|
||||
this.entryEditing.date = moment(new Date()).format("YYYY-MM-DD")
|
||||
this.$bvModal.show(`modal-meal-plan_${this.modal_id}`)
|
||||
},
|
||||
createShareLink: function() {
|
||||
axios
|
||||
.get(resolveDjangoUrl("api_share_link", this.recipe.id))
|
||||
.then((result) => {
|
||||
this.$bvModal.show(`modal-share-link_${this.modal_id}`)
|
||||
this.recipe_share_link = result.data.link
|
||||
})
|
||||
.catch((err) => {
|
||||
if (err.response.status === 403) {
|
||||
makeToast(this.$t("Share"), this.$t("Sharing is not enabled for this space."), "danger")
|
||||
}
|
||||
})
|
||||
},
|
||||
copyShareLink: function() {
|
||||
let share_input = this.$refs.share_link_ref
|
||||
share_input.select()
|
||||
document.execCommand("copy")
|
||||
},
|
||||
shareIntend: function() {
|
||||
let shareData = {
|
||||
title: this.recipe.name,
|
||||
text: `${this.$t("Check out this recipe: ")} ${this.recipe.name}`,
|
||||
url: this.recipe_share_link,
|
||||
}
|
||||
navigator.share(shareData)
|
||||
},
|
||||
addToShopping() {
|
||||
this.$bvModal.show(`shopping_${this.modal_id}`)
|
||||
},
|
||||
},
|
||||
createMealPlan(data) {
|
||||
this.entryEditing = this.options.entryEditing
|
||||
this.entryEditing.recipe = this.recipe
|
||||
this.entryEditing.date = moment(new Date()).format('YYYY-MM-DD')
|
||||
this.$bvModal.show(`modal-meal-plan_${this.modal_id}`)
|
||||
},
|
||||
createShareLink: function () {
|
||||
axios.get(resolveDjangoUrl('api_share_link', this.recipe.id)).then(result => {
|
||||
this.$bvModal.show(`modal-share-link_${this.modal_id}`)
|
||||
this.recipe_share_link = result.data.link
|
||||
}).catch(err => {
|
||||
|
||||
if (err.response.status === 403) {
|
||||
makeToast(this.$t('Share'), this.$t('Sharing is not enabled for this space.'), 'danger')
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
copyShareLink: function () {
|
||||
let share_input = this.$refs.share_link_ref;
|
||||
share_input.select();
|
||||
document.execCommand("copy");
|
||||
},
|
||||
shareIntend: function () {
|
||||
let shareData = {
|
||||
title: this.recipe.name,
|
||||
text: `${this.$t('Check out this recipe: ')} ${this.recipe.name}`,
|
||||
url: this.recipe_share_link
|
||||
}
|
||||
navigator.share(shareData)
|
||||
},
|
||||
addToShopping() {
|
||||
this.$bvModal.show(`shopping_${this.modal_id}`)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -12,15 +12,11 @@
|
||||
@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">{{ $t("Title_or_Recipe_Required") }}</span>
|
||||
<small tabindex="-1" class="form-text text-muted" v-if="!missing_recipe">{{
|
||||
$t("Title")
|
||||
}}</small>
|
||||
<small tabindex="-1" class="form-text text-muted" v-if="!missing_recipe">{{ $t("Title") }}</small>
|
||||
</div>
|
||||
<div class="col-6 col-lg-3">
|
||||
<input type="date" id="DateInput" class="form-control" v-model="entryEditing.date" />
|
||||
@@ -58,24 +54,13 @@
|
||||
@new="createMealType"
|
||||
></generic-multiselect>
|
||||
<span class="text-danger" v-if="missing_meal_type">{{ $t("Meal_Type_Required") }}</span>
|
||||
<small tabindex="-1" class="form-text text-muted" v-if="!missing_meal_type">{{
|
||||
$t("Meal_Type")
|
||||
}}</small>
|
||||
<small tabindex="-1" class="form-text text-muted" v-if="!missing_meal_type">{{ $t("Meal_Type") }}</small>
|
||||
</b-form-group>
|
||||
<b-form-group label-for="NoteInput" :description="$t('Note')" class="mt-3">
|
||||
<textarea
|
||||
class="form-control"
|
||||
id="NoteInput"
|
||||
v-model="entryEditing.note"
|
||||
:placeholder="$t('Note')"
|
||||
></textarea>
|
||||
<textarea class="form-control" id="NoteInput" v-model="entryEditing.note" :placeholder="$t('Note')"></textarea>
|
||||
</b-form-group>
|
||||
<b-input-group>
|
||||
<b-form-input
|
||||
id="ServingsInput"
|
||||
v-model="entryEditing.servings"
|
||||
:placeholder="$t('Servings')"
|
||||
></b-form-input>
|
||||
<b-form-input id="ServingsInput" v-model="entryEditing.servings" :placeholder="$t('Servings')"></b-form-input>
|
||||
</b-input-group>
|
||||
<small tabindex="-1" class="form-text text-muted">{{ $t("Servings") }}</small>
|
||||
<!-- TODO: hide this checkbox if autoadding menuplans, but allow editing on-hand -->
|
||||
@@ -90,9 +75,7 @@
|
||||
</div>
|
||||
<div class="row mt-3 mb-3">
|
||||
<div class="col-12">
|
||||
<b-button variant="danger" @click="deleteEntry" v-if="allow_delete"
|
||||
>{{ $t("Delete") }}
|
||||
</b-button>
|
||||
<b-button variant="danger" @click="deleteEntry" v-if="allow_delete">{{ $t("Delete") }} </b-button>
|
||||
<b-button class="float-right" variant="primary" @click="editEntry">{{ $t("Save") }}</b-button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -119,6 +102,7 @@ export default {
|
||||
entry: Object,
|
||||
entryEditing_initial_recipe: Array,
|
||||
entryEditing_initial_meal_type: Array,
|
||||
entryEditing_inital_servings: Number,
|
||||
modal_title: String,
|
||||
modal_id: {
|
||||
type: String,
|
||||
@@ -145,6 +129,9 @@ export default {
|
||||
entry: {
|
||||
handler() {
|
||||
this.entryEditing = Object.assign({}, this.entry)
|
||||
if (this.entryEditing_inital_servings) {
|
||||
this.entryEditing.servings = this.entryEditing_inital_servings
|
||||
}
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user