skillbox/client/src/components/profile/ContentBookmark.vue

53 lines
1.4 KiB
Vue

<template>
<div class="content-bookmark module-activity-entry">
<!-- eslint-disable vue/no-v-html -->
<div
v-if="content.type === 'text_block'"
v-html="text"
/>
<div v-else-if="content.type === 'link_block'">
<link-block
:value="content.value"
:no-margin="true"
/>
</div>
<p v-else>
{{ type }}
</p>
</div>
</template>
<script>
import {defineAsyncComponent} from 'vue';
const LinkBlock = defineAsyncComponent(() => import(/* webpackChunkName: "content-components" */'@/components/content-blocks/LinkBlock'));
export default {
props: ['bookmark'],
components: {LinkBlock},
computed: {
content() {
return this.bookmark.contentBlock
? this.bookmark.contentBlock.contents.find(e => e.id === this.bookmark.uuid)
: this.bookmark.instrument.contents.find(e => e.id === this.bookmark.uuid);
},
text() {
return this.content.value.text ? this.content.value.text : 'TO BE DEFINED';
},
type() {
switch (this.content.type) {
case 'assignment':
return 'Aufgabe & Ergebnis';
case 'link_block':
return this.content;
case 'survey':
return 'Übung';
case 'image_url_block':
return 'Bild';
default:
return this.content.type;
}
}
}
};
</script>