Files
enfrancais-app/src/components/nodes/NodeViewTitle.vue
T

75 lines
1.4 KiB
Vue

<template>
<component
:is="tag"
class="node-view-title"
:class="{ block }"
>
<component
:is="link ? 'a' : 'div'"
@click="onTitleClick(node)"
class="node-view-title-container"
>
<slot name="default" />
<span><strong>{{ toCommaList(node.authors) }}</strong>,</span>
<span>
<span v-if="node.preTitle" v-html="' ' + trim(node.preTitle) + ','" />
<em v-html="' ' + trim(node.title) || 'pas de titre ital'" />
<span v-if="edition && node.edition">, </span>
</span>
<div v-if="edition && node.edition" class="edition">
{{ node.edition.map(ed => ed.name).join(' ') }}
</div>
</component>
</component>
</template>
<script>
import { trim, toCommaList } from '@/helpers/common'
export default {
name: 'NodeViewTitle',
props: {
node: { type: Object, required: true },
tag: { type: String, default: 'h6' },
link: { type: Boolean, default: false },
block: { type: Boolean, default: false },
edition: { type: Boolean, default: false }
},
data () {
return {
}
},
methods: {
trim,
toCommaList,
onTitleClick (node) {
if (this.link) {
this.$emit('open-node')
}
}
}
}
</script>
<style lang="scss" scoped>
.node-view-title {
font-weight: $font-weight-normal;
a {
text-decoration: none;
cursor: pointer;
}
&.block &-container {
> * {
display: block;
}
}
}
</style>