<template>
  <component :is="currentCompoent" :chapter="chapter" v-bind="$attrs" v-on="$listeners" v-if="chapter" :key="pid" />
</template>

<script>
// components
import ChapterPlayer from './player/chapterPlayer.vue' // 章节视频
import ChapterWork from './work/index.vue' // 章节作业
import ChapterExam from './work/chapterExam.vue' // 章节考试
import ChapterRead from './read/chapterRead.vue' // 章节资料
import ChapterLive from './live/chapterLive.vue' // 章节直播
import CourseWork from './work/courseWork.vue' // 课程大作业
import CourseRead from './read/courseRead.vue' // 课程资料
import CourseExam from './work/courseExam.vue' // 课程考试

export default {
  name: 'ViewerLayout',
  components: {
    ChapterPlayer,
    ChapterWork,
    ChapterRead,
    ChapterExam,
    ChapterLive,
    CourseWork,
    CourseRead,
    CourseExam
  },
  props: {
    chapter: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  computed: {
    currentCompoent() {
      const componentNames = {
        2: 'ChapterPlayer', // 视频
        3: 'ChapterWork', // 作业
        4: 'ChapterRead', // 资料
        5: 'ChapterLive', // CC直播
        8: 'ChapterLive', // CC直播
        9: 'ChapterExam', // 考试
        99: 'CourseWork', // 课程大作业
        100: 'CourseRead', // 课程资料
        101: 'CourseExam' // 课程考试
      }
      return this.chapter ? componentNames[this.chapter.type] || '' : ''
    },
    pid() {
      return this.$route.params.id
    }
  }
}
</script>
