mirror of
https://github.com/GiriNeko/YesPlayMusic.git
synced 2025-12-15 20:58:01 +00:00
* feat: add copy track link * fix: various visual defects * feat: add track low res fallback * chore: remove redundant locale strings * chore: separate playbackState for a new PR * build: fix netlify failing to build site
53 lines
1.1 KiB
Vue
53 lines
1.1 KiB
Vue
<template>
|
|
<span class="artist-in-line">
|
|
{{ computedPrefix }}
|
|
<span v-for="(ar, index) in filteredArtists" :key="index">
|
|
<router-link v-if="ar.id !== 0" :to="`/artist/${ar.id}`">{{
|
|
ar.name
|
|
}}</router-link>
|
|
<span v-else>{{ ar.name }}</span>
|
|
<span v-if="index !== filteredArtists.length - 1" class="separator"
|
|
>,</span
|
|
>
|
|
</span>
|
|
</span>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'ArtistInLine',
|
|
props: {
|
|
artists: {
|
|
type: Array,
|
|
required: true,
|
|
},
|
|
exclude: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
prefix: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
},
|
|
computed: {
|
|
filteredArtists() {
|
|
return this.artists.filter(a => a.name !== this.exclude);
|
|
},
|
|
computedPrefix() {
|
|
if (this.filteredArtists.length !== 0) return this.prefix;
|
|
else return '';
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.separator {
|
|
/* make separator distinct enough in long list */
|
|
margin-left: 1px;
|
|
margin-right: 4px;
|
|
position: relative;
|
|
top: 0.5px;
|
|
}
|
|
</style>
|