brotherton-erpnext/erpnext/public/js/education/lms/pages/ContentPage.vue
2019-02-19 13:06:32 +05:30

90 lines
1.7 KiB
Vue

<template>
<div>
<component v-bind:is="currentComponent" :content="content" :type="type">
<ContentNavigation :nextContent="nextContent" :nextContentType="nextContentType"/>
</component>
</div>
</template>
<script>
import Article from "../components/Article.vue"
import Quiz from "../components/Quiz.vue"
import Video from "../components/Video.vue"
import ContentNavigation from "../components/ContentNavigation.vue"
export default {
props:['program_name', 'course', 'type', 'content'],
name: "ContentPage",
data() {
return{
nextContent: '',
nextContentType: '',
}
},
computed: {
currentComponent: function() {
if(this.type === "Article") {
return 'Article'
}
else if(this.type === "Quiz") {
return 'Quiz'
}
else if(this.type === "Video") {
return 'Video'
}
},
},
mounted() {
this.getNextContent().then(data => {
this.nextContent = data.content,
this.nextContentType = data.content_type
});
},
methods: {
getNextContent(){
window.t = this
return lms.call("get_next_content",
{
content: this.content,
content_type: this.type,
course: this.course
}
);
}
},
components: {
Article,
Video,
Quiz,
ContentNavigation
}
};
</script>
<style>
.footer-message {
display: none;
}
.video-top-section {
padding-top: 3rem !important;
padding-bottom: 1rem !important;
}
.video-description-section {
padding-top: 0em !important;
}
.article-top-section {
padding-top: 0.5em !important;
padding-bottom: 0rem !important;
}
.article-content-section {
padding-top: 0em !important;
}
.quiz-section {
padding-top: 0.5em !important;
padding-bottom: 0rem !important;
}
</style>