mirror of
https://github.com/hay-kot/mealie.git
synced 2025-08-22 06:23:34 -07:00
recipe suggestion
This commit is contained in:
parent
4bf2bae25d
commit
a917849858
1 changed files with 69 additions and 70 deletions
|
@ -14,9 +14,7 @@
|
||||||
<div v-for="(organizer, idx) in missingOrganizers" :key="idx">
|
<div v-for="(organizer, idx) in missingOrganizers" :key="idx">
|
||||||
<v-col v-if="organizer.show" cols="12">
|
<v-col v-if="organizer.show" cols="12">
|
||||||
<div class="d-flex flex-row flex-wrap align-center pt-2">
|
<div class="d-flex flex-row flex-wrap align-center pt-2">
|
||||||
<v-icon class="ma-0 pa-0">
|
<v-icon class="ma-0 pa-0" />
|
||||||
{{ organizer.icon }}
|
|
||||||
</v-icon>
|
|
||||||
<v-card-text class="mr-0 my-0 pl-1 py-0" style="width: min-content">
|
<v-card-text class="mr-0 my-0 pl-1 py-0" style="width: min-content">
|
||||||
{{ $t("recipe-finder.missing") }}:
|
{{ $t("recipe-finder.missing") }}:
|
||||||
</v-card-text>
|
</v-card-text>
|
||||||
|
@ -41,7 +39,7 @@
|
||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import RecipeCardMobile from "./RecipeCardMobile.vue";
|
import RecipeCardMobile from "./RecipeCardMobile.vue";
|
||||||
import type { IngredientFood, RecipeSummary, RecipeTool } from "~/lib/api/types/recipe";
|
import type { IngredientFood, RecipeSummary, RecipeTool } from "~/lib/api/types/recipe";
|
||||||
|
|
||||||
|
@ -51,27 +49,25 @@ interface Organizer {
|
||||||
selected: boolean;
|
selected: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default defineNuxtComponent({
|
interface Props {
|
||||||
components: { RecipeCardMobile },
|
recipe: RecipeSummary;
|
||||||
props: {
|
missingFoods?: IngredientFood[] | null;
|
||||||
recipe: {
|
missingTools?: RecipeTool[] | null;
|
||||||
type: Object as () => RecipeSummary,
|
disableCheckbox?: boolean;
|
||||||
required: true,
|
}
|
||||||
},
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
missingFoods: {
|
missingFoods: null,
|
||||||
type: Array as () => IngredientFood[] | null,
|
missingTools: null,
|
||||||
default: null,
|
disableCheckbox: false,
|
||||||
},
|
});
|
||||||
missingTools: {
|
|
||||||
type: Array as () => RecipeTool[] | null,
|
const emit = defineEmits<{
|
||||||
default: null,
|
"add-food": [food: IngredientFood];
|
||||||
},
|
"remove-food": [food: IngredientFood];
|
||||||
disableCheckbox: {
|
"add-tool": [tool: RecipeTool];
|
||||||
type: Boolean,
|
"remove-tool": [tool: RecipeTool];
|
||||||
default: false,
|
}>();
|
||||||
},
|
|
||||||
},
|
|
||||||
setup(props, context) {
|
|
||||||
const { $globals } = useNuxtApp();
|
const { $globals } = useNuxtApp();
|
||||||
const missingOrganizers = computed(() => [
|
const missingOrganizers = computed(() => [
|
||||||
{
|
{
|
||||||
|
@ -105,17 +101,20 @@ export default defineNuxtComponent({
|
||||||
|
|
||||||
organizer.selected = !organizer.selected;
|
organizer.selected = !organizer.selected;
|
||||||
if (organizer.selected) {
|
if (organizer.selected) {
|
||||||
context.emit(`add-${organizer.type}`, organizer.item);
|
if (organizer.type === "food") {
|
||||||
|
emit("add-food", organizer.item as IngredientFood);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
context.emit(`remove-${organizer.type}`, organizer.item);
|
emit("add-tool", organizer.item as RecipeTool);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
if (organizer.type === "food") {
|
||||||
|
emit("remove-food", organizer.item as IngredientFood);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
emit("remove-tool", organizer.item as RecipeTool);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
|
||||||
missingOrganizers,
|
|
||||||
handleCheckbox,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue