fix: display defaultCover when processing empty cover image (#1815)

Thanks!
This commit is contained in:
PBK Bin 2024-08-30 19:39:24 +08:00 committed by GitHub
parent c1e0c177e4
commit 618929e9bf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 8 additions and 5 deletions

View file

@ -43,7 +43,7 @@ const artistOrPodcastName = computed(() => {
return getPlayableProp(song.value, 'artist_name', 'podcast_title')
})
const coverBackgroundImage = computed(() => `url(${cover.value})`)
const coverBackgroundImage = computed(() => `url(${cover.value ?? defaultCover})`)
const draggable = computed(() => Boolean(song.value))
const onDragStart = (event: DragEvent) => {

View file

@ -1,3 +1,3 @@
// Vitest Snapshot v1
exports[`renders 1`] = `<a class="view-profile rounded-full" data-testid="view-profile-link" href="/#/profile" title="Profile and preferences"><img alt="Avatar of John Doe" src="https://example.com/avatar.jpg" title="John Doe" class="rounded-full aspect-square bg-k-bg-primary object-cover p-0.5 border border-solid border-white/10 transition duration-200 ease-in-out hover:border-white/30 active:scale-95" width="40"></a>`;
exports[`renders 1`] = `<a class="view-profile rounded-full" data-testid="view-profile-link" href="/#/profile" title="Profile and preferences"><img alt="Avatar of John Doe" src="https://example.com/avatar.jpg" title="John Doe" class="object-cover rounded-full aspect-square bg-k-bg-primary p-0.5 border border-solid border-white/10 transition duration-200 ease-in-out hover:border-white/30 active:scale-95" width="40"></a>`;

View file

@ -1,15 +1,18 @@
<template>
<img
:alt="`Avatar of ${user.name}`"
:src="user.avatar"
:src="avatar"
:title="user.name"
class="rounded-full aspect-square bg-k-bg-primary object-cover"
@error="avatar = defaultCover"
class="object-cover rounded-full aspect-square bg-k-bg-primary"
>
</template>
<script lang="ts" setup>
import { toRefs } from 'vue'
import { toRefs, ref } from 'vue'
import { defaultCover } from '@/utils'
const props = defineProps<{ user: Pick<User, 'name' | 'avatar'> }>()
const { user } = toRefs(props)
const avatar = ref(user.value.avatar)
</script>