<template>
    <div class="literacy-detail-container">
        <div class="literacy-mgt-top" @click="backList">
            <Icon type="md-arrow-round-back" size="20" />
            <span style="margin-left:10px">返回领导力课程</span>
        </div>
        <vuescroll>
            <div class="literacy-block-box">
                <div class="video-info-wrap">
                    <h1 class="video-title">{{videoInfo.title}}</h1>
                    <video :src="videoInfo.link" class="video-box" controls="controls" autoplay="autoplay"></video>
                </div>
                <div class="more-link-wrap">
                    <p class="more-title">
                        更多课程
                        <Icon custom="iconfont icon-handle-down" size="20" />
                    </p>
                    <div class="video-list-box">
                        <vuescroll>
                            <div class="video-item" v-for="(item,index) in leaderArr" :key="index" @click="chooseCus(index)">
                                <img :src="item.poster" class="video-poster">
                                <div style="margin-left:15px">
                                    <p class="video-attr-item">
                                        <span>{{item.title}}</span>
                                    </p>
                                </div>
                            </div>
                        </vuescroll>
                    </div>
                </div>
            </div>
        </vuescroll>
    </div>
</template>
<script>
const courseData = require('@/static/course.json')
export default {
    data() {
        return {
            keyword: '',
            videoInfo: {},
            videoList: [],
			leaderArr:[
				{
				  "reporter": "李文昊",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%886%EF%BC%89%E3%80%8A%E5%AD%A6%E4%B9%A0%E8%B5%84%E6%BA%90%E4%B8%8E%E6%95%99%E5%AD%A6%E6%B4%BB%E5%8A%A8%E8%AE%BE%E8%AE%A1%E4%B9%8B%E5%AD%A6%E8%8B%B1%E6%96%87%E5%8D%95%E8%AF%8D%E3%80%8B-%E5%8D%8E%E4%B8%AD%E5%B8%88%E8%8C%83%E5%A4%A7%E5%AD%A6%E6%9D%8E%E6%96%87%E6%98%8A%E6%95%99%E6%8E%88.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/1.png",
				  "title": "领导力与指导力课程1"
				},
				{
				  "reporter": "李文昊",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%887%EF%BC%89%E3%80%8A%E5%AD%A6%E4%B9%A0%E8%B5%84%E6%BA%90%E4%B8%8E%E6%95%99%E5%AD%A6%E6%B4%BB%E5%8A%A8%E8%AE%BE%E8%AE%A1%E4%B9%8B%E5%8F%A4%E8%AF%97%E6%96%87%E3%80%8B-%E5%8D%8E%E4%B8%AD%E5%B8%88%E8%8C%83%E5%A4%A7%E5%AD%A6%E6%9D%8E%E6%96%87%E6%98%8A%E6%95%99%E6%8E%88.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/2.png",
				  "title": "领导力与指导力课程2"
				},
				{
				  "reporter": "李文昊",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%888%EF%BC%89%E3%80%8A%E5%AD%A6%E4%B9%A0%E8%B5%84%E6%BA%90%E4%B8%8E%E6%95%99%E5%AD%A6%E6%B4%BB%E5%8A%A8%E8%AE%BE%E8%AE%A1%E4%B9%8B%E5%85%89%E5%90%88%E4%BD%9C%E7%94%A8%E3%80%8B-%E5%8D%8E%E4%B8%AD%E5%B8%88%E8%8C%83%E5%A4%A7%E5%AD%A6%E6%9D%8E%E6%96%87%E6%98%8A%E6%95%99%E6%8E%88.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/3.png",
				  "title": "领导力与指导力课程3"
				},
				{
				  "reporter": "黄丽霞",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%8810%EF%BC%89%E3%80%8A%E6%8A%80%E6%9C%AF%E8%B5%8B%E8%83%BD%E7%9A%84%E6%A0%A1%E6%9C%AC%E6%95%99%E7%A0%94%E8%AF%BE%E5%A0%82%E5%BB%BA%E6%A8%A1%E7%AF%87%E3%80%8B-%E6%88%90%E9%83%BD%E5%B8%88%E8%8C%83%E9%93%B6%E9%83%BD%E7%B4%AB%E8%97%A4%E5%B0%8F%E5%AD%A6%E9%BB%84%E4%B8%BD%E9%9C%9E%E4%B8%BB%E4%BB%BB.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/4.png",
				  "title": "领导力与指导力课程4"
				},
				{
				  "reporter": "黄丽霞",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%8810%EF%BC%89%E3%80%8A%E6%8A%80%E6%9C%AF%E8%B5%8B%E8%83%BD%E7%9A%84%E6%A0%A1%E6%9C%AC%E6%95%99%E7%A0%94%E8%AF%BE%E5%A0%82%E5%BB%BA%E6%A8%A1%E7%AF%87%E3%80%8B-%E6%88%90%E9%83%BD%E5%B8%88%E8%8C%83%E9%93%B6%E9%83%BD%E7%B4%AB%E8%97%A4%E5%B0%8F%E5%AD%A6%E9%BB%84%E4%B8%BD%E9%9C%9E%E4%B8%BB%E4%BB%BB.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/5.png",
				  "title": "领导力与指导力课程5"
				},
				{
				  "reporter": "黄丽霞",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%8811%EF%BC%89%E3%80%8A%E6%8A%80%E6%9C%AF%E8%B5%8B%E8%83%BD%E7%9A%84%E6%A0%A1%E6%9C%AC%E6%95%99%E7%A0%94%E8%B7%AF%E5%BE%84%E7%AF%87%E3%80%8B-%E6%88%90%E9%83%BD%E5%B8%88%E8%8C%83%E9%93%B6%E9%83%BD%E7%B4%AB%E8%97%A4%E5%B0%8F%E5%AD%A6%E9%BB%84%E4%B8%BD%E9%9C%9E%E4%B8%BB%E4%BB%BB.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/6.png",
				  "title": "领导力与指导力课程6"
				},
				{
				  "reporter": "刘革平",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%884%EF%BC%89%E3%80%8A%E6%99%BA%E6%85%A7%E6%95%99%E5%AD%A6%E6%A8%A1%E5%BC%8F%E3%80%8B-%E8%A5%BF%E5%8D%97%E5%A4%A7%E5%AD%A6%E5%88%98%E9%9D%A9%E5%B9%B3%E6%95%99%E6%8E%88.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/7.png",
				  "title": "领导力与指导力课程7"
				},
				{
				  "reporter": "刘革平",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%885%EF%BC%89%E3%80%8A%E4%B8%AA%E6%80%A7%E5%8C%96%E5%AD%A6%E4%B9%A0%E6%A8%A1%E5%BC%8F%E3%80%8B-%E8%A5%BF%E5%8D%97%E5%A4%A7%E5%AD%A6%E5%88%98%E9%9D%A9%E5%B9%B3%E6%95%99%E6%8E%88.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/8.png",
				  "title": "领导力与指导力课程8"
				},
				{
				  "reporter": "刘革平",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B/%E6%95%99%E5%B8%88%E4%BF%A1%E6%81%AF%E7%B4%A0%E5%85%BB%E8%AF%BE%E7%A8%8B%EF%BC%883%EF%BC%89%E3%80%8A%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD%E6%8A%80%E6%9C%AF%E5%88%86%E7%B1%BB%E5%8F%8A%E5%BA%94%E7%94%A8%E3%80%8B-%E8%A5%BF%E5%8D%97%E5%A4%A7%E5%AD%A6%E5%88%98%E9%9D%A9%E5%B9%B3%E6%95%99%E6%8E%88.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/9.png",
				  "title": "领导力与指导力课程9"
				},
				{
				  "reporter": "刘革平",
				  "unit": "新优教育集团",
				  "content": "展示新优教育集团校本课程。着重讲述了学校如何在机制创新，政府支持的环境下，通过专业管理把学校高质量发展起来。“我们期待教师们能通过一次次对自己教学观念的重构，把学生放在课堂的中央，让孩子们的学习真实地发生，在愉悦、倾听、互动的课堂中，积累知识、发展能力、培育情感、理解文化多样性，认同身份，逐步形成着眼未来的语文学科核心素养。”",
				  "link": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E4%B8%93%E5%AE%B6/%E9%95%BF%E6%98%A5%E6%96%B0%E4%BC%98%E6%95%99%E8%82%B2%E9%9B%86%E5%9B%A2%E5%A7%94%E6%89%98%E7%AE%A1%E7%90%86%E5%AD%A6%E6%A0%A1%E6%80%BB%E6%A0%A1%E9%95%BF%E6%9D%8E%E6%A1%A2.mp4",
				  "poster": "https://teammodelstorage.blob.core.chinacloudapi.cn/0-public/video/%E9%A2%86%E5%AF%BC%E5%8A%9B%E8%AF%BE%E7%A8%8B/10.png",
				  "title": "领导力与指导力课程10"
				},
			]
        }
    },
    methods: {
        search() {

        },
        backList() {
            this.$router.push({
                name: 'leadership'
            })
        },
        chooseCus(index){
            this.videoInfo = this.leaderArr[index]
        }
    },
    created() {
        this.videoList = require('@/static/diagnosis.json')
        this.videoInfo = this.$route.params.videoInfo || this.videoList[0]
        this.course = []
        this.course = this._.cloneDeep(courseData)
        let sas = this.$store.state.user.schoolProfile.blob_sas
        let blobUrl = JSON.parse(decodeURIComponent(localStorage.school_profile, "utf-8")).blob_uri
        this.course.forEach(item => {
            let url = `${blobUrl}${item.link}?${sas}`
            item.link = url
        })
        this.videoList.push(...this.course)
    }
}
</script>
<style lang="less" scoped>
.info-label{
    color: #808695;
    display: block;
}
.video-list-box {
    height: 620px;
}
.video-attr-item {
    font-size: 12px;
}
.video-item {
    padding: 10px;
    border-bottom: 1px solid #eee;
    display: flex;
    cursor: pointer;
    &:hover{
        background: #f0f0f0;
    }
}
.video-poster {
    width: 120px;
}
.more-title {
    height: 35px;
    line-height: 35px;
    font-size: 12px;
    border-bottom: 1px solid #eee;
    padding-left: 10px;
}
.video-title {
    margin-bottom: 15px;
}
.info-item {
    margin: 10px 0px;
    font-size: 16px;
}
.video-box {
    // height: 600px;
    width: 66%;
}
.literacy-detail-container {
    width: 100%;
    height: 100%;
    padding: 15px;
}
.literacy-block-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.video-info-wrap {
    width: 78%;
    min-height: 600px;
    background: white;
    padding: 15px;
}
.more-link-wrap {
    width: 20%;
    min-height: 600px;
    background: white;
}
.literacy-mgt-top {
    width: 100%;
    height: 40px;
    background: white;
    box-shadow: 0px 2px 5px #e9e9e9;
    padding-left: 10px;
    padding-right: 20px;
    margin-bottom: 10px;
    line-height: 40px;
    cursor: pointer;
}
</style>