Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-08-04 21:15:22 +02:00
Code Issues Releases Activity

fix: Missing Yield Text (#5827)

Browse source
This commit is contained in:
Michael Genson 2025-07-29 15:33:44 -05:00 • committed by GitHub
parent 3b74ddd9ad
commit d6d247f1f8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 19 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageInfoCard.vue
View file

@ -35,7 +35,7 @@
> >
<RecipeYield <RecipeYield
:yield-quantity="recipe.recipeYieldQuantity" :yield-quantity="recipe.recipeYieldQuantity"
:yield="recipe.recipeYield" :yield-text="recipe.recipeYield"
:scale="recipeScale" :scale="recipeScale"
class="mb-4" class="mb-4"
/> />

2
frontend/components/Domain/Recipe/RecipePrintView.vue
View file

@ -222,7 +222,7 @@ export default defineNuxtComponent({
const servingsDisplay = computed(() => { const servingsDisplay = computed(() => {
const { scaledAmountDisplay } = useScaledAmount(props.recipe.recipeYieldQuantity, props.scale); const { scaledAmountDisplay } = useScaledAmount(props.recipe.recipeYieldQuantity, props.scale);
return scaledAmountDisplay return scaledAmountDisplay || props.recipe.recipeYield
? i18n.t("recipe.yields-amount-with-text", { ? i18n.t("recipe.yields-amount-with-text", {
amount: scaledAmountDisplay, amount: scaledAmountDisplay,
text: props.recipe.recipeYield, text: props.recipe.recipeYield,

25
frontend/components/Domain/Recipe/RecipeYield.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div <div
v-if="scaledAmount" v-if="yieldDisplay"
class="d-flex align-center" class="d-flex align-center"
> >
<v-row <v-row
@ -18,7 +18,7 @@
<p class="my-0 opacity-80"> <p class="my-0 opacity-80">
<span class="font-weight-bold">{{ $t("recipe.yield") }}</span><br> <span class="font-weight-bold">{{ $t("recipe.yield") }}</span><br>
<!-- eslint-disable-next-line vue/no-v-html --> <!-- eslint-disable-next-line vue/no-v-html -->
<span v-html="scaledAmount" /> {{ text }} <span v-html="yieldDisplay" />
</p> </p>
</v-row> </v-row>
</div> </div>
@ -34,7 +34,7 @@ export default defineNuxtComponent({
type: Number, type: Number,
default: 0, default: 0,
}, },
yield: { yieldText: {
type: String, type: String,
default: "", default: "",
}, },
@ -55,15 +55,24 @@ export default defineNuxtComponent({
}); });
} }
const scaledAmount = computed(() => { const yieldDisplay = computed<string>(() => {
const components: string[] = [];
const { scaledAmountDisplay } = useScaledAmount(props.yieldQuantity, props.scale); const { scaledAmountDisplay } = useScaledAmount(props.yieldQuantity, props.scale);
return scaledAmountDisplay; if (scaledAmountDisplay) {
components.push(scaledAmountDisplay);
}
const text = props.yieldText;
if (text) {
components.push(text);
}
return sanitizeHTML(components.join(" "));
}); });
const text = sanitizeHTML(props.yield);
return { return {
scaledAmount, yieldDisplay,
text,
}; };
}, },
}); });