github/mealie
1
0
Fork 0
mirror of https://github.com/hay-kot/mealie.git synced 2025-08-23 06:45:22 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 12

RecipePageFooter use v-model instead of prop and turn into script setup

Browse source
This commit is contained in:
Kuchenpirat 2025-06-19 09:37:39 +00:00
commit 27d8109a6e
1 changed files with 29 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

46
frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageFooter.vue
View file

@ -81,61 +81,39 @@
</div> </div>
</template> </template>
<script lang="ts"> <script setup lang="ts">
import { usePageState } from "~/composables/recipe-page/shared-state"; import { usePageState } from "~/composables/recipe-page/shared-state";
import type { NoUndefinedField } from "~/lib/api/types/non-generated"; import type { NoUndefinedField } from "~/lib/api/types/non-generated";
import type { Recipe } from "~/lib/api/types/recipe"; import type { Recipe } from "~/lib/api/types/recipe";
export default defineNuxtComponent({ const recipe = defineModel<NoUndefinedField<Recipe>>({ required: true });
props: { const { isEditForm, isCookMode } = usePageState(recipe.value.slug);
recipe: {
type: Object as () => NoUndefinedField<Recipe>,
required: true,
},
},
setup(props) {
const { isEditForm, isCookMode } = usePageState(props.recipe.slug);
const apiNewKey = ref(""); const apiNewKey = ref("");
function createApiExtra() { function createApiExtra() {
if (!props.recipe) { if (!recipe.value) {
return; return;
} }
if (!recipe.value.extras) {
if (!props.recipe.extras) { recipe.value.extras = {};
props.recipe.extras = {};
} }
// check for duplicate keys // check for duplicate keys
if (Object.keys(props.recipe.extras).includes(apiNewKey.value)) { if (Object.keys(recipe.value.extras).includes(apiNewKey.value)) {
return; return;
} }
recipe.value.extras[apiNewKey.value] = "";
props.recipe.extras[apiNewKey.value] = "";
apiNewKey.value = ""; apiNewKey.value = "";
} }
function removeApiExtra(key: string | number) { function removeApiExtra(key: string | number) {
if (!props.recipe) { if (!recipe.value) {
return; return;
} }
if (!recipe.value.extras) {
if (!props.recipe.extras) {
return; return;
} }
// eslint-disable-next-line @typescript-eslint/no-dynamic-delete // eslint-disable-next-line @typescript-eslint/no-dynamic-delete
delete props.recipe.extras[key]; delete recipe.value.extras[key];
props.recipe.extras = { ...props.recipe.extras }; recipe.value.extras = { ...recipe.value.extras };
} }
return {
removeApiExtra,
createApiExtra,
apiNewKey,
isEditForm,
isCookMode,
};
},
});
</script> </script>