mealie/frontend/components/Domain/Group/GroupMealPlanRuleForm.vue
Hayden d1024e272d
Feature/automated meal planner (#939)
* cleanup oversized buttons

* add get all by category function to reciep repos

* fix shopping-list can_merge logic

* use randomized data for testing

* add random getter to repository for meal-planner

* add stub route for random meals

* cleanup global namespace

* add rules database type

* fix type

* add plan rules schema

* test plan rules methods

* add mealplan rules controller

* add new repository

* update frontend types

* formatting

* fix regression

* update autogenerated types

* add api class for mealplan rules

* add tests and fix bugs

* fix data returns

* proof of concept rules editor

* add tag support

* remove old group categories

* add tag support

* implement random by rules api

* change snack to sides

* remove incorrect typing

* split repo for custom methods

* fix query and use and_ clause

* use repo function

* remove old test

* update changelog
2022-02-07 19:03:11 -09:00

112 lines
2.7 KiB
Vue

<template>
<div>
<div class="d-md-flex" style="gap: 10px">
<v-select v-model="inputDay" :items="MEAL_DAY_OPTIONS" label="Rule Day"></v-select>
<v-select v-model="inputEntryType" :items="MEAL_TYPE_OPTIONS" label="Meal Type"></v-select>
</div>
<RecipeCategoryTagSelector v-model="inputCategories" />
<RecipeCategoryTagSelector v-model="inputTags" :tag-selector="true" />
{{ inputDay === "unset" ? "This rule will apply to all days" : `This rule applies on ${inputDay}s` }}
{{ inputEntryType === "unset" ? "for all meal types" : ` and for ${inputEntryType} meal types` }}
</div>
</template>
<script lang="ts">
import { defineComponent, computed } from "@nuxtjs/composition-api";
import RecipeCategoryTagSelector from "~/components/Domain/Recipe/RecipeCategoryTagSelector.vue";
const MEAL_TYPE_OPTIONS = [
{ text: "Breakfast", value: "breakfast" },
{ text: "Lunch", value: "lunch" },
{ text: "Dinner", value: "dinner" },
{ text: "Side", value: "side" },
{ text: "Any", value: "unset" },
];
const MEAL_DAY_OPTIONS = [
{ text: "Monday", value: "monday" },
{ text: "Tuesday", value: "tuesday" },
{ text: "Wednesday", value: "wednesday" },
{ text: "Thursday", value: "thursday" },
{ text: "Friday", value: "friday" },
{ text: "Sunday", value: "saturday" },
{ text: "Sunday", value: "sunday" },
{ text: "Any", value: "unset" },
];
export default defineComponent({
components: {
RecipeCategoryTagSelector,
},
props: {
day: {
type: String,
default: "unset",
},
entryType: {
type: String,
default: "unset",
},
categories: {
type: Array,
default: () => [],
},
tags: {
type: Array,
default: () => [],
},
showHelp: {
type: Boolean,
default: false,
},
},
setup(props, context) {
const inputDay = computed({
get: () => {
return props.day;
},
set: (val) => {
context.emit("update:day", val);
},
});
const inputEntryType = computed({
get: () => {
return props.entryType;
},
set: (val) => {
context.emit("update:entry-type", val);
},
});
const inputCategories = computed({
get: () => {
return props.categories;
},
set: (val) => {
context.emit("update:categories", val);
},
});
const inputTags = computed({
get: () => {
return props.tags;
},
set: (val) => {
context.emit("update:tags", val);
},
});
return {
MEAL_TYPE_OPTIONS,
MEAL_DAY_OPTIONS,
inputDay,
inputEntryType,
inputCategories,
inputTags,
};
},
});
</script>