mirrors/recipes
1
0
Fork 0
mirror of https://github.com/TandoorRecipes/recipes.git synced 2026-01-11 17:16:59 -05:00
Code Packages Releases Activity

moved many compoents to composition API

Browse Source
This commit is contained in:
vabene1111
2024-04-21 15:58:31 +02:00
parent ce6c43fb62
commit e040a10096
13 changed files with 342 additions and 347 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
vue3/src/components/display/RecipeImage.vue
View File

@@ -1,28 +1,37 @@
<template>
<v-img :cover="cover" :style="{'height': height, 'width': width,}" :src="image" alt="Recipe Image"/>
<v-img :cover="cover" :style="{'height': height, 'width': width,}" :src="image" alt="Recipe Image">
<slot name="overlay">
</slot>
</v-img>
</template>
<script setup lang="ts">
import {computed, PropType} from "vue";
import {computed, PropType, watch} from "vue";
import {Recipe, RecipeOverview} from "@/openapi";
import recipeDefaultImage from '../../assets/recipe_no_image.svg'
const props = defineProps({
recipe: {type: {} as PropType<Recipe|RecipeOverview|undefined>, required: false, default: undefined},
recipe: {type: {} as PropType<Recipe | RecipeOverview | undefined>, required: false, default: undefined},
height: {type: String},
width: {type: String},
cover: {type: Boolean, default: true}
})
const image = computed(() => {
if(props.recipe != undefined && props.recipe.image != undefined){
if (props.recipe != undefined && props.recipe.image != undefined) {
return props.recipe.image
} else {
return recipeDefaultImage
}
})
watch(() => props.recipe, () => {
console.log('changed')
})
</script>
<style scoped>