mirror of
https://github.com/mealie-recipes/mealie.git
synced 2025-07-09 03:04:54 -04:00
made parsed ingredient reactive (#2520)
This commit is contained in:
parent
693608d59f
commit
30717e50d3
@ -1,16 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="ma-0 pa-0 text-subtitle-1 dense-markdown ingredient-item">
|
<div class="ma-0 pa-0 text-subtitle-1 dense-markdown ingredient-item">
|
||||||
<SafeMarkdown v-if="quantity" class="d-inline" :source="quantity" />
|
<SafeMarkdown v-if="parsedIng.quantity" class="d-inline" :source="parsedIng.quantity" />
|
||||||
<template v-if="unit">{{ unit }} </template>
|
<template v-if="parsedIng.unit">{{ parsedIng.unit }} </template>
|
||||||
<SafeMarkdown v-if="note && !name" class="text-bold d-inline" :source="note" />
|
<SafeMarkdown v-if="parsedIng.note && !parsedIng.name" class="text-bold d-inline" :source="parsedIng.note" />
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<SafeMarkdown v-if="name" class="text-bold d-inline" :source="name" />
|
<SafeMarkdown v-if="parsedIng.name" class="text-bold d-inline" :source="parsedIng.name" />
|
||||||
<SafeMarkdown v-if="note" class="note" :source="note" />
|
<SafeMarkdown v-if="parsedIng.note" class="note" :source="parsedIng.note" />
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from "@nuxtjs/composition-api";
|
import { computed, defineComponent, toRefs } from "@nuxtjs/composition-api";
|
||||||
import { RecipeIngredient } from "~/lib/api/types/group";
|
import { RecipeIngredient } from "~/lib/api/types/group";
|
||||||
import { useParsedIngredientText } from "~/composables/recipes";
|
import { useParsedIngredientText } from "~/composables/recipes";
|
||||||
|
|
||||||
@ -30,9 +30,12 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
setup(props) {
|
setup(props) {
|
||||||
const parsed = useParsedIngredientText(props.ingredient, props.disableAmount, props.scale);
|
const parsedIng = computed(() => {
|
||||||
|
return useParsedIngredientText(props.ingredient, props.disableAmount, props.scale);
|
||||||
|
});
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...parsed,
|
parsedIng,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
Loading…
x
Reference in New Issue
Block a user