67 lines
1.3 KiB
Vue
67 lines
1.3 KiB
Vue
<template>
|
|
<router-link
|
|
:to="to"
|
|
class="sub-navigation-item back-link">
|
|
<chevron-left class="back-link__icon sub-navigation-item__icon"/>
|
|
{{ fullTitle }}
|
|
</router-link>
|
|
</template>
|
|
|
|
<script>
|
|
import ChevronLeft from '@/components/icons/ChevronLeft';
|
|
import {MODULE_PAGE} from '@/router/module.names';
|
|
import {ROOMS_PAGE} from '@/router/room.names';
|
|
|
|
export default {
|
|
props: {
|
|
title: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
type: {
|
|
type: String,
|
|
default: 'topic',
|
|
},
|
|
slug: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
},
|
|
|
|
components: {
|
|
ChevronLeft,
|
|
},
|
|
|
|
computed: {
|
|
to() {
|
|
switch (this.type) {
|
|
case 'topic':
|
|
return {name: 'topic', params: {topicSlug: this.slug}};
|
|
case 'module':
|
|
return {name: MODULE_PAGE};
|
|
default:
|
|
return {name: ROOMS_PAGE};
|
|
}
|
|
},
|
|
fullTitle() {
|
|
switch (this.type) {
|
|
case 'topic':
|
|
return `Thema: ${this.title}`;
|
|
case 'module':
|
|
return `Modul: ${this.title}`;
|
|
default:
|
|
return this.title;
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import '~styles/helpers';
|
|
|
|
.back-link {
|
|
@include regular-text;
|
|
}
|
|
</style>
|