mirror of
https://github.com/mealie-recipes/mealie.git
synced 2025-08-02 20:15:24 +02:00
Merge branch 'mealie-next' into mealie-next
This commit is contained in:
Jack Bailey
GitHub
commit
8a2d640922
87 changed files with 3072 additions and 930 deletions
|
|
@ -44,6 +44,9 @@ export default defineComponent({
|
|||
foods: i18n.tc("general.foods"),
|
||||
units: i18n.tc("general.units"),
|
||||
labels: i18n.tc("data-pages.labels.labels"),
|
||||
categories: i18n.tc("category.categories"),
|
||||
tags: i18n.tc("tag.tags"),
|
||||
tools: i18n.tc("tool.tools"),
|
||||
};
|
||||
|
||||
const route = useRoute();
|
||||
|
|
@ -53,6 +56,7 @@ export default defineComponent({
|
|||
text: i18n.t("general.recipes"),
|
||||
value: "new",
|
||||
to: "/group/data/recipes",
|
||||
divider: true,
|
||||
},
|
||||
{
|
||||
text: i18n.t("general.foods"),
|
||||
|
|
@ -68,7 +72,23 @@ export default defineComponent({
|
|||
text: i18n.t("data-pages.labels.labels"),
|
||||
value: "new",
|
||||
to: "/group/data/labels",
|
||||
divider: true,
|
||||
},
|
||||
{
|
||||
text: i18n.t("category.categories"),
|
||||
value: "new",
|
||||
to: "/group/data/categories",
|
||||
},
|
||||
{
|
||||
text: i18n.t("tag.tags"),
|
||||
value: "new",
|
||||
to: "/group/data/tags",
|
||||
},
|
||||
{
|
||||
text: i18n.t("tool.tools"),
|
||||
value: "new",
|
||||
to: "/group/data/tools",
|
||||
}
|
||||
]);
|
||||
|
||||
const buttonText = computed(() => {
|
||||
|
|
|
|||
174
frontend/pages/group/data/categories.vue
Normal file
174
frontend/pages/group/data/categories.vue
Normal file
|
|
@ -0,0 +1,174 @@
|
|||
<template>
|
||||
<div>
|
||||
<!-- Create Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.createDialog"
|
||||
:title="$t('data-pages.categories.new-category')"
|
||||
:icon="$globals.icons.categories"
|
||||
@submit="createCategory"
|
||||
>
|
||||
<v-card-text>
|
||||
<v-form ref="domNewCategoryForm">
|
||||
<v-text-field
|
||||
v-model="createTarget.name"
|
||||
autofocus
|
||||
:label="$t('general.name')"
|
||||
:rules="[validators.required]"
|
||||
></v-text-field>
|
||||
</v-form>
|
||||
</v-card-text>
|
||||
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Edit Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.editDialog"
|
||||
:icon="$globals.icons.categories"
|
||||
:title="$t('data-pages.categories.edit-category')"
|
||||
:submit-text="$tc('general.save')"
|
||||
@submit="editSaveCategory"
|
||||
>
|
||||
<v-card-text v-if="editTarget">
|
||||
<div class="mt-4">
|
||||
<v-text-field v-model="editTarget.name" :label="$t('general.name')"> </v-text-field>
|
||||
</div>
|
||||
</v-card-text>
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Delete Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.deleteDialog"
|
||||
:title="$tc('general.confirm')"
|
||||
:icon="$globals.icons.alertCircle"
|
||||
color="error"
|
||||
@confirm="deleteCategory"
|
||||
>
|
||||
<v-card-text>
|
||||
{{ $t("general.confirm-delete-generic") }}
|
||||
</v-card-text>
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Recipe Data Table -->
|
||||
<BaseCardSectionTitle :icon="$globals.icons.categories" section :title="$tc('data-pages.categories.category-data')"> </BaseCardSectionTitle>
|
||||
<CrudTable
|
||||
:table-config="tableConfig"
|
||||
:headers.sync="tableHeaders"
|
||||
:data="categories || []"
|
||||
:bulk-actions="[]"
|
||||
@delete-one="deleteEventHandler"
|
||||
@edit-one="editEventHandler"
|
||||
>
|
||||
<template #button-row>
|
||||
<BaseButton create @click="state.createDialog = true">{{ $t("general.create") }}</BaseButton>
|
||||
</template>
|
||||
</CrudTable>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, reactive, ref, useContext } from "@nuxtjs/composition-api";
|
||||
import { validators } from "~/composables/use-validators";
|
||||
import { useCategoryStore, useCategoryData } from "~/composables/store";
|
||||
import { RecipeCategory } from "~/lib/api/types/admin";
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const { i18n } = useContext();
|
||||
const tableConfig = {
|
||||
hideColumns: true,
|
||||
canExport: true,
|
||||
};
|
||||
const tableHeaders = [
|
||||
{
|
||||
text: i18n.t("general.id"),
|
||||
value: "id",
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
text: i18n.t("general.name"),
|
||||
value: "name",
|
||||
show: true,
|
||||
},
|
||||
];
|
||||
|
||||
const state = reactive({
|
||||
createDialog: false,
|
||||
editDialog: false,
|
||||
deleteDialog: false,
|
||||
});
|
||||
const categoryData = useCategoryData();
|
||||
const categoryStore = useCategoryStore();
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Create Category
|
||||
|
||||
async function createCategory() {
|
||||
// @ts-ignore - only property really required is the name (RecipeOrganizerPage)
|
||||
await categoryStore.actions.createOne({ name: categoryData.data.name });
|
||||
categoryData.reset();
|
||||
state.createDialog = false;
|
||||
}
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Edit Category
|
||||
|
||||
const editTarget = ref<RecipeCategory | null>(null);
|
||||
|
||||
function editEventHandler(item: RecipeCategory) {
|
||||
state.editDialog = true;
|
||||
editTarget.value = item;
|
||||
}
|
||||
|
||||
async function editSaveCategory() {
|
||||
if (!editTarget.value) {
|
||||
return;
|
||||
}
|
||||
await categoryStore.actions.updateOne(editTarget.value);
|
||||
state.editDialog = false;
|
||||
}
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Delete Category
|
||||
|
||||
const deleteTarget = ref<RecipeCategory | null>(null);
|
||||
|
||||
function deleteEventHandler(item: RecipeCategory) {
|
||||
state.deleteDialog = true;
|
||||
deleteTarget.value = item;
|
||||
}
|
||||
|
||||
async function deleteCategory() {
|
||||
if (!deleteTarget.value || deleteTarget.value.id === undefined) {
|
||||
return;
|
||||
}
|
||||
await categoryStore.actions.deleteOne(deleteTarget.value.id);
|
||||
state.deleteDialog = false;
|
||||
}
|
||||
|
||||
return {
|
||||
state,
|
||||
tableConfig,
|
||||
tableHeaders,
|
||||
categories: categoryStore.items,
|
||||
validators,
|
||||
|
||||
// create
|
||||
createTarget: categoryData.data,
|
||||
createCategory,
|
||||
|
||||
// edit
|
||||
editTarget,
|
||||
editEventHandler,
|
||||
editSaveCategory,
|
||||
|
||||
// delete
|
||||
deleteTarget,
|
||||
deleteEventHandler,
|
||||
deleteCategory
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
@ -168,7 +168,7 @@
|
|||
<template #button-row>
|
||||
<BaseButton create @click="createDialog = true" />
|
||||
<BaseButton @click="mergeDialog = true">
|
||||
<template #icon> {{ $globals.icons.foods }} </template>
|
||||
<template #icon> {{ $globals.icons.externalLink }} </template>
|
||||
{{ $t('data-pages.combine') }}
|
||||
</BaseButton>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -90,10 +90,7 @@
|
|||
@edit-one="editEventHandler"
|
||||
>
|
||||
<template #button-row>
|
||||
<BaseButton create @click="state.createDialog = true">
|
||||
<template #icon> {{ $globals.icons.tags }} </template>
|
||||
{{ $t("general.create") }}
|
||||
</BaseButton>
|
||||
<BaseButton create @click="state.createDialog = true">{{ $t("general.create") }}</BaseButton>
|
||||
</template>
|
||||
<template #item.name="{ item }">
|
||||
<MultiPurposeLabel v-if="item" :label="item">
|
||||
|
|
|
|||
175
frontend/pages/group/data/tags.vue
Normal file
175
frontend/pages/group/data/tags.vue
Normal file
|
|
@ -0,0 +1,175 @@
|
|||
<template>
|
||||
<div>
|
||||
<!-- Create Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.createDialog"
|
||||
:title="$t('data-pages.tags.new-tag')"
|
||||
:icon="$globals.icons.tags"
|
||||
@submit="createTag"
|
||||
>
|
||||
<v-card-text>
|
||||
<v-form ref="domNewTagForm">
|
||||
<v-text-field
|
||||
v-model="createTarget.name"
|
||||
autofocus
|
||||
:label="$t('general.name')"
|
||||
:rules="[validators.required]"
|
||||
></v-text-field>
|
||||
</v-form>
|
||||
</v-card-text>
|
||||
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Edit Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.editDialog"
|
||||
:icon="$globals.icons.tags"
|
||||
:title="$t('data-pages.tags.edit-tag')"
|
||||
:submit-text="$tc('general.save')"
|
||||
@submit="editSaveTag"
|
||||
>
|
||||
<v-card-text v-if="editTarget">
|
||||
<div class="mt-4">
|
||||
<v-text-field v-model="editTarget.name" :label="$t('general.name')"> </v-text-field>
|
||||
</div>
|
||||
</v-card-text>
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Delete Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.deleteDialog"
|
||||
:title="$tc('general.confirm')"
|
||||
:icon="$globals.icons.alertCircle"
|
||||
color="error"
|
||||
@confirm="deleteTag"
|
||||
>
|
||||
<v-card-text>
|
||||
{{ $t("general.confirm-delete-generic") }}
|
||||
</v-card-text>
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Recipe Data Table -->
|
||||
<BaseCardSectionTitle :icon="$globals.icons.tags" section :title="$tc('data-pages.tags.tag-data')"> </BaseCardSectionTitle>
|
||||
<CrudTable
|
||||
:table-config="tableConfig"
|
||||
:headers.sync="tableHeaders"
|
||||
:data="tags || []"
|
||||
:bulk-actions="[]"
|
||||
@delete-one="deleteEventHandler"
|
||||
@edit-one="editEventHandler"
|
||||
>
|
||||
<template #button-row>
|
||||
<BaseButton create @click="state.createDialog = true">{{ $t("general.create") }}</BaseButton>
|
||||
</template>
|
||||
</CrudTable>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, reactive, ref, useContext } from "@nuxtjs/composition-api";
|
||||
import { validators } from "~/composables/use-validators";
|
||||
import { useTagStore, useTagData } from "~/composables/store";
|
||||
import { RecipeTag } from "~/lib/api/types/admin";
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const { i18n } = useContext();
|
||||
const tableConfig = {
|
||||
hideColumns: true,
|
||||
canExport: true,
|
||||
};
|
||||
const tableHeaders = [
|
||||
{
|
||||
text: i18n.t("general.id"),
|
||||
value: "id",
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
text: i18n.t("general.name"),
|
||||
value: "name",
|
||||
show: true,
|
||||
},
|
||||
];
|
||||
|
||||
const state = reactive({
|
||||
createDialog: false,
|
||||
editDialog: false,
|
||||
deleteDialog: false,
|
||||
});
|
||||
|
||||
const tagData = useTagData();
|
||||
const tagStore = useTagStore();
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Create Tag
|
||||
|
||||
async function createTag() {
|
||||
// @ts-ignore - only property really required is the name (RecipeOrganizerPage)
|
||||
await tagStore.actions.createOne({ name: tagData.data.name });
|
||||
tagData.reset();
|
||||
state.createDialog = false;
|
||||
}
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Edit Tag
|
||||
|
||||
const editTarget = ref<RecipeTag | null>(null);
|
||||
|
||||
function editEventHandler(item: RecipeTag) {
|
||||
state.editDialog = true;
|
||||
editTarget.value = item;
|
||||
}
|
||||
|
||||
async function editSaveTag() {
|
||||
if (!editTarget.value) {
|
||||
return;
|
||||
}
|
||||
await tagStore.actions.updateOne(editTarget.value);
|
||||
state.editDialog = false;
|
||||
}
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Delete Tag
|
||||
|
||||
const deleteTarget = ref<RecipeTag | null>(null);
|
||||
|
||||
function deleteEventHandler(item: RecipeTag) {
|
||||
state.deleteDialog = true;
|
||||
deleteTarget.value = item;
|
||||
}
|
||||
|
||||
async function deleteTag() {
|
||||
if (!deleteTarget.value || deleteTarget.value.id === undefined) {
|
||||
return;
|
||||
}
|
||||
await tagStore.actions.deleteOne(deleteTarget.value.id);
|
||||
state.deleteDialog = false;
|
||||
}
|
||||
|
||||
return {
|
||||
state,
|
||||
tableConfig,
|
||||
tableHeaders,
|
||||
tags: tagStore.items,
|
||||
validators,
|
||||
|
||||
// create
|
||||
createTarget: tagData.data,
|
||||
createTag,
|
||||
|
||||
// edit
|
||||
editTarget,
|
||||
editEventHandler,
|
||||
editSaveTag,
|
||||
|
||||
// delete
|
||||
deleteTarget,
|
||||
deleteEventHandler,
|
||||
deleteTag
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
187
frontend/pages/group/data/tools.vue
Normal file
187
frontend/pages/group/data/tools.vue
Normal file
|
|
@ -0,0 +1,187 @@
|
|||
<template>
|
||||
<div>
|
||||
<!-- Create Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.createDialog"
|
||||
:title="$t('data-pages.tools.new-tool')"
|
||||
:icon="$globals.icons.potSteam"
|
||||
@submit="createTool"
|
||||
>
|
||||
<v-card-text>
|
||||
<v-form ref="domNewToolForm">
|
||||
<v-text-field
|
||||
v-model="createTarget.name"
|
||||
autofocus
|
||||
:label="$t('general.name')"
|
||||
:rules="[validators.required]"
|
||||
></v-text-field>
|
||||
<v-checkbox v-model="createTarget.onHand" :label="$t('tool.on-hand')">
|
||||
</v-checkbox>
|
||||
</v-form>
|
||||
</v-card-text>
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Edit Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.editDialog"
|
||||
:icon="$globals.icons.potSteam"
|
||||
:title="$t('data-pages.tools.edit-tool')"
|
||||
:submit-text="$tc('general.save')"
|
||||
@submit="editSaveTool"
|
||||
>
|
||||
<v-card-text v-if="editTarget">
|
||||
<div class="mt-4">
|
||||
<v-text-field v-model="editTarget.name" :label="$t('general.name')"> </v-text-field>
|
||||
<v-checkbox v-model="editTarget.onHand" :label="$t('tool.on-hand')"> </v-checkbox>
|
||||
</div>
|
||||
</v-card-text>
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Delete Dialog -->
|
||||
<BaseDialog
|
||||
v-model="state.deleteDialog"
|
||||
:title="$tc('general.confirm')"
|
||||
:icon="$globals.icons.alertCircle"
|
||||
color="error"
|
||||
@confirm="deleteTool"
|
||||
>
|
||||
<v-card-text>
|
||||
{{ $t("general.confirm-delete-generic") }}
|
||||
</v-card-text>
|
||||
</BaseDialog>
|
||||
|
||||
<!-- Tool Data Table -->
|
||||
<BaseCardSectionTitle :icon="$globals.icons.potSteam" section :title="$tc('data-pages.tools.tool-data')"> </BaseCardSectionTitle>
|
||||
<CrudTable
|
||||
:table-config="tableConfig"
|
||||
:headers.sync="tableHeaders"
|
||||
:data="tools || []"
|
||||
:bulk-actions="[]"
|
||||
@delete-one="deleteEventHandler"
|
||||
@edit-one="editEventHandler"
|
||||
>
|
||||
<template #button-row>
|
||||
<BaseButton create @click="state.createDialog = true">{{ $t("general.create") }}</BaseButton>
|
||||
</template>
|
||||
<template #item.onHand="{ item }">
|
||||
<v-icon :color="item.onHand ? 'success' : undefined">
|
||||
{{ item.onHand ? $globals.icons.check : $globals.icons.close }}
|
||||
</v-icon>
|
||||
</template>
|
||||
</CrudTable>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, reactive, ref, useContext } from "@nuxtjs/composition-api";
|
||||
import { validators } from "~/composables/use-validators";
|
||||
import { useToolStore, useToolData } from "~/composables/store";
|
||||
import { RecipeTool } from "~/lib/api/types/admin";
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const { i18n } = useContext();
|
||||
const tableConfig = {
|
||||
hideColumns: true,
|
||||
canExport: true,
|
||||
};
|
||||
const tableHeaders = [
|
||||
{
|
||||
text: i18n.t("general.id"),
|
||||
value: "id",
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
text: i18n.t("general.name"),
|
||||
value: "name",
|
||||
show: true,
|
||||
},
|
||||
{
|
||||
text: i18n.t("tool.on-hand"),
|
||||
value: "onHand",
|
||||
show: true,
|
||||
},
|
||||
];
|
||||
|
||||
const state = reactive({
|
||||
createDialog: false,
|
||||
editDialog: false,
|
||||
deleteDialog: false,
|
||||
});
|
||||
|
||||
const toolData = useToolData();
|
||||
const toolStore = useToolStore();
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Create Tag
|
||||
|
||||
async function createTool() {
|
||||
// @ts-ignore - only property really required is the name and onHand (RecipeOrganizerPage)
|
||||
await toolStore.actions.createOne({ name: toolData.data.name, onHand: toolData.data.onHand });
|
||||
toolData.reset();
|
||||
state.createDialog = false;
|
||||
}
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Edit Tag
|
||||
|
||||
const editTarget = ref<RecipeTool | null>(null);
|
||||
|
||||
function editEventHandler(item: RecipeTool) {
|
||||
state.editDialog = true;
|
||||
editTarget.value = item;
|
||||
}
|
||||
|
||||
async function editSaveTool() {
|
||||
if (!editTarget.value) {
|
||||
return;
|
||||
}
|
||||
await toolStore.actions.updateOne(editTarget.value);
|
||||
state.editDialog = false;
|
||||
}
|
||||
|
||||
|
||||
// ============================================================
|
||||
// Delete Tag
|
||||
|
||||
const deleteTarget = ref<RecipeTool | null>(null);
|
||||
|
||||
function deleteEventHandler(item: RecipeTool) {
|
||||
state.deleteDialog = true;
|
||||
deleteTarget.value = item;
|
||||
}
|
||||
|
||||
async function deleteTool() {
|
||||
if (!deleteTarget.value || deleteTarget.value.id === undefined) {
|
||||
return;
|
||||
}
|
||||
await toolStore.actions.deleteOne(deleteTarget.value.id);
|
||||
state.deleteDialog = false;
|
||||
}
|
||||
|
||||
return {
|
||||
state,
|
||||
tableConfig,
|
||||
tableHeaders,
|
||||
tools: toolStore.items,
|
||||
validators,
|
||||
|
||||
// create
|
||||
createTarget: toolData.data,
|
||||
createTool,
|
||||
|
||||
// edit
|
||||
editTarget,
|
||||
editEventHandler,
|
||||
editSaveTool,
|
||||
|
||||
// delete
|
||||
deleteTarget,
|
||||
deleteEventHandler,
|
||||
deleteTool
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
@ -180,7 +180,7 @@
|
|||
<BaseButton create @click="createDialog = true" />
|
||||
|
||||
<BaseButton @click="mergeDialog = true">
|
||||
<template #icon> {{ $globals.icons.units }} </template>
|
||||
<template #icon> {{ $globals.icons.externalLink }} </template>
|
||||
{{ $t('data-pages.combine') }}
|
||||
</BaseButton>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,51 +1,65 @@
|
|||
<template>
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="(day, index) in plan"
|
||||
:key="index"
|
||||
cols="12"
|
||||
sm="12"
|
||||
md="4"
|
||||
lg="4"
|
||||
xl="2"
|
||||
class="col-borders my-1 d-flex flex-column"
|
||||
>
|
||||
<v-card class="mb-2 border-left-primary rounded-sm pa-2">
|
||||
<p class="pl-2 mb-1">
|
||||
{{ $d(day.date, "short") }}
|
||||
</p>
|
||||
</v-card>
|
||||
<div v-for="section in day.sections" :key="section.title">
|
||||
<div class="py-2 d-flex flex-column">
|
||||
<div class="primary" style="width: 50px; height: 2.5px"></div>
|
||||
<p class="text-overline my-0">
|
||||
{{ section.title }}
|
||||
</p>
|
||||
</div>
|
||||
<v-container class="mx-0 my-3 pa">
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="(day, index) in plan"
|
||||
:key="index"
|
||||
cols="12"
|
||||
sm="12"
|
||||
md="4"
|
||||
lg="4"
|
||||
xl="2"
|
||||
class="col-borders my-1 d-flex flex-column"
|
||||
>
|
||||
<v-card class="mb-2 border-left-primary rounded-sm px-2">
|
||||
<v-container class="px-0">
|
||||
<v-row no-gutters style="width: 100%;">
|
||||
<v-col cols="10">
|
||||
<p class="pl-2 my-1">
|
||||
{{ $d(day.date, "short") }}
|
||||
</p>
|
||||
</v-col>
|
||||
<v-col class="d-flex justify-top" cols="2">
|
||||
<GroupMealPlanDayContextMenu v-if="day.recipes.length" :recipes="day.recipes" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-card>
|
||||
<div v-for="section in day.sections" :key="section.title">
|
||||
<div class="py-2 d-flex flex-column">
|
||||
<div class="primary" style="width: 50px; height: 2.5px"></div>
|
||||
<p class="text-overline my-0">
|
||||
{{ section.title }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<RecipeCardMobile
|
||||
v-for="mealplan in section.meals"
|
||||
:key="mealplan.id"
|
||||
:recipe-id="mealplan.recipe ? mealplan.recipe.id : ''"
|
||||
class="mb-2"
|
||||
:route="mealplan.recipe ? true : false"
|
||||
:slug="mealplan.recipe ? mealplan.recipe.slug : mealplan.title"
|
||||
:description="mealplan.recipe ? mealplan.recipe.description : mealplan.text"
|
||||
:name="mealplan.recipe ? mealplan.recipe.name : mealplan.title"
|
||||
/>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<RecipeCardMobile
|
||||
v-for="mealplan in section.meals"
|
||||
:key="mealplan.id"
|
||||
:recipe-id="mealplan.recipe ? mealplan.recipe.id : ''"
|
||||
class="mb-2"
|
||||
:route="mealplan.recipe ? true : false"
|
||||
:slug="mealplan.recipe ? mealplan.recipe.slug : mealplan.title"
|
||||
:description="mealplan.recipe ? mealplan.recipe.description : mealplan.text"
|
||||
:name="mealplan.recipe ? mealplan.recipe.name : mealplan.title"
|
||||
/>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, useContext } from "@nuxtjs/composition-api";
|
||||
import { MealsByDate } from "./types";
|
||||
import { ReadPlanEntry } from "~/lib/api/types/meal-plan";
|
||||
import GroupMealPlanDayContextMenu from "~/components/Domain/Group/GroupMealPlanDayContextMenu.vue";
|
||||
import RecipeCardMobile from "~/components/Domain/Recipe/RecipeCardMobile.vue";
|
||||
import { RecipeSummary } from "~/lib/api/types/recipe";
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
GroupMealPlanDayContextMenu,
|
||||
RecipeCardMobile,
|
||||
},
|
||||
props: {
|
||||
|
|
@ -63,6 +77,7 @@ export default defineComponent({
|
|||
type Days = {
|
||||
date: Date;
|
||||
sections: DaySection[];
|
||||
recipes: RecipeSummary[];
|
||||
};
|
||||
|
||||
const { i18n } = useContext();
|
||||
|
|
@ -77,6 +92,7 @@ export default defineComponent({
|
|||
{ title: i18n.tc("meal-plan.dinner"), meals: [] },
|
||||
{ title: i18n.tc("meal-plan.side"), meals: [] },
|
||||
],
|
||||
recipes: [],
|
||||
};
|
||||
|
||||
for (const meal of day.meals) {
|
||||
|
|
@ -89,6 +105,10 @@ export default defineComponent({
|
|||
} else if (meal.entryType === "side") {
|
||||
out.sections[3].meals.push(meal);
|
||||
}
|
||||
|
||||
if (meal.recipe) {
|
||||
out.recipes.push(meal.recipe);
|
||||
}
|
||||
}
|
||||
|
||||
// Drop empty sections
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue