mirror of
https://github.com/mealie-recipes/mealie.git
synced 2025-10-31 10:13:32 -04:00
ea7c4771ee
* add default assets for user profile * add recipe avatar * change user_id to UUID * add profile image upload * setup image cache keys * cleanup tests and add image tests * purge user data on delete * new user repository tests * add user_id validator for int -> UUID conversion * delete depreciated route * force set content type * refactor tests to use temp directory * validate parent exists before createing * set user_id to correct type * update instruction id * reset primary key on migration
46 lines
1.0 KiB
Vue
46 lines
1.0 KiB
Vue
<template>
|
|
<v-list-item-avatar v-if="list && userId">
|
|
<v-img :src="imageURL" :alt="userId" @load="error = false" @error="error = true"> </v-img>
|
|
</v-list-item-avatar>
|
|
<v-avatar v-else-if="userId" :size="size">
|
|
<v-img :src="imageURL" :alt="userId" @load="error = false" @error="error = true"> </v-img>
|
|
</v-avatar>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent, toRefs, reactive, useContext, computed } from "@nuxtjs/composition-api";
|
|
|
|
export default defineComponent({
|
|
props: {
|
|
userId: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
list: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
size: {
|
|
type: String,
|
|
default: "42",
|
|
},
|
|
},
|
|
setup(props) {
|
|
const state = reactive({
|
|
error: false,
|
|
});
|
|
|
|
const { $auth } = useContext();
|
|
|
|
const imageURL = computed(() => {
|
|
const key = $auth?.user?.cacheKey || "";
|
|
return `/api/media/users/${props.userId}/profile.webp?cacheKey=${key}`;
|
|
});
|
|
|
|
return {
|
|
imageURL,
|
|
...toRefs(state),
|
|
};
|
|
},
|
|
});
|
|
</script> |