87 lines
2.0 KiB
Vue
87 lines
2.0 KiB
Vue
<template>
|
|
<div
|
|
class="node-view-footer" :class="'node-view-footer-' + mode"
|
|
>
|
|
<div class="d-flex w-100">
|
|
<div class="tags">
|
|
<b-badge
|
|
v-for="tag in node.tags" :key="tag.id"
|
|
variant="dark" pill
|
|
>
|
|
{{ tag.name }}
|
|
</b-badge>
|
|
</div>
|
|
|
|
<div v-if="mode === 'view' && node.siblings">
|
|
<b-button :id="'siblings-' + node.id">
|
|
{{ $t('siblings') }}
|
|
</b-button>
|
|
|
|
<b-popover
|
|
:target="'siblings-' + node.id" triggers="hover" placement="top"
|
|
>
|
|
<div v-for="sibling in node.siblings" :key="sibling.id">
|
|
<h6>
|
|
<a @click.prevent="onOpen(sibling.id)" href="#">
|
|
<div class="">
|
|
{{ toCommaList(sibling.authors) }},
|
|
</div>
|
|
<div class="">
|
|
{{ sibling.title }},
|
|
</div>
|
|
<div class="">
|
|
{{ sibling.edition ? sibling.edition.name : sibling.edition }}
|
|
</div>
|
|
</a>
|
|
</h6>
|
|
</div>
|
|
</b-popover>
|
|
</div>
|
|
|
|
<div v-if="mode === 'card'">
|
|
<b-button @click="onOpen(node.id)" variant="outline-dark">
|
|
{{ $t('text.read') }}
|
|
</b-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { toCommaList } from '@/helpers/common'
|
|
|
|
|
|
export default {
|
|
name: 'NodeViewFooter',
|
|
|
|
props: {
|
|
node: { type: Object, required: true },
|
|
type: { type: String, required: true },
|
|
mode: { type: String, required: true }
|
|
},
|
|
|
|
computed: {
|
|
authors () {
|
|
const authors = this.node.authors
|
|
if (!authors) return 'Pas d\'auteur⋅rices'
|
|
return authors.map(({ name }) => name).join(', ')
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
toCommaList,
|
|
|
|
onOpen (parentId) {
|
|
this.$parent.$emit('open-node', { parentId })
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.node-view-footer {
|
|
margin-top: auto;
|
|
font-family: $font-family-base;
|
|
}
|
|
</style>
|