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

<script>
// components
import ChapterPlayer from '../src/player/ChapterPlayer.vue' // 章节视频
import ChapterWork from '../src/work/index.vue' // 章节作业
import ChapterRead from '../src/read/chapterRead.vue' // 章节资料
import CourseWork from '../src/work/courseWork.vue' // 课程大作业
import CourseRead from '../src/read/courseRead.vue' // 课程资料
import CourseExam from '../src/work/courseExam.vue' // 课程资料

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