|
|
|
|
@ -43,7 +43,8 @@ |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="catalog"> |
|
|
|
|
<a class="entry" @click="entry"></a> |
|
|
|
|
<el-button v-if="!overdue" class="renew" type="primary" size="small" @click="showBuy">续费</el-button> |
|
|
|
|
<a v-else class="entry" @click="entry"></a> |
|
|
|
|
<div class="list"> |
|
|
|
|
<h4 class="title">{{ courseName }}</h4> |
|
|
|
|
<div class="chapters"> |
|
|
|
|
@ -97,6 +98,14 @@ |
|
|
|
|
<el-button size="small" type="primary" @click="toSub">确 定</el-button> |
|
|
|
|
</span> |
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
<!-- 购买弹框 --> |
|
|
|
|
<el-dialog title="温馨提示" :visible.sync="buyVisible" width="420px" center :close-on-click-modal="false"> |
|
|
|
|
<div class="buy"> |
|
|
|
|
<p class="tips">该课程订阅期限已到期，若需要续费请扫码添加客服咨询“</p> |
|
|
|
|
<img src="@/assets/img/wechat-code.jpeg" alt=""> |
|
|
|
|
</div> |
|
|
|
|
</el-dialog> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
@ -148,7 +157,9 @@ export default { |
|
|
|
|
projectVisible: false, |
|
|
|
|
projects: [], |
|
|
|
|
loading: false, |
|
|
|
|
curProject: '' |
|
|
|
|
curProject: '', |
|
|
|
|
overdue: 0, //是否过期 |
|
|
|
|
buyVisible: false |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
computed: { |
|
|
|
|
@ -159,7 +170,7 @@ export default { |
|
|
|
|
mounted() { |
|
|
|
|
this.insertScript(); |
|
|
|
|
this.getData(); |
|
|
|
|
this.getChapter(); |
|
|
|
|
this.getStatus() |
|
|
|
|
}, |
|
|
|
|
destroyed() { |
|
|
|
|
// 记录播放时长 |
|
|
|
|
@ -182,10 +193,20 @@ export default { |
|
|
|
|
this.assessmentList = data.assessmentConfig; |
|
|
|
|
this.systemIds = data.systemIds |
|
|
|
|
}, |
|
|
|
|
// 查询是否过期 |
|
|
|
|
getStatus() { |
|
|
|
|
this.$get(this.api.whetherToRenewTheFee, { |
|
|
|
|
cid: this.courseId |
|
|
|
|
}).then(({ isRenew }) => { |
|
|
|
|
// 1正常显示资源，0显示续费 |
|
|
|
|
this.overdue = isRenew |
|
|
|
|
this.getChapter() |
|
|
|
|
}).catch(res => {}) |
|
|
|
|
}, |
|
|
|
|
async getChapter() { |
|
|
|
|
let res = await this.$get(`${this.api.curriculumChapter}/${this.courseId}`); |
|
|
|
|
this.chapterList = res.chapterList; |
|
|
|
|
if (this.chapterList.length && this.chapterList[0].subsectionList && this.chapterList[0].subsectionList.length) { |
|
|
|
|
if (this.overdue && this.chapterList.length && this.chapterList[0].subsectionList && this.chapterList[0].subsectionList.length) { |
|
|
|
|
this.preview(this.chapterList[0].subsectionList[0], this.chapterList[0].name); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
@ -207,6 +228,10 @@ export default { |
|
|
|
|
document.body.removeChild(document.querySelector("#aliplayerScript")); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
// 显示咨询弹框 |
|
|
|
|
showBuy() { |
|
|
|
|
this.buyVisible = true |
|
|
|
|
}, |
|
|
|
|
transferType(ext) { |
|
|
|
|
const suf = ext.toLowerCase() |
|
|
|
|
if('jpg,jpeg,png,gif,svg,psd'.includes(suf)) return '图片' |
|
|
|
|
@ -214,6 +239,8 @@ export default { |
|
|
|
|
return suf |
|
|
|
|
}, |
|
|
|
|
preview(row, chapterName) { |
|
|
|
|
// 如果没过期，则正常预览，否则显示购买弹框 |
|
|
|
|
if (this.overdue) { |
|
|
|
|
this.curLink = `${chapterName}${row.name}`; // 章节名称+小节名称，小节名称有重复的情况，如果只用小节名称判断，会有同时选中多个的情况 |
|
|
|
|
this.playauth = ""; |
|
|
|
|
this.coverUrl = ""; |
|
|
|
|
@ -290,6 +317,9 @@ export default { |
|
|
|
|
this.iframeSrc = res.previewUrl; |
|
|
|
|
}).catch(err => {}); |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
this.showBuy() |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
closeIframe() { |
|
|
|
|
this.iframeSrc = ""; |
|
|
|
|
@ -447,6 +477,10 @@ $height: 700px; |
|
|
|
|
padding: 16px; |
|
|
|
|
margin-left: 12px; |
|
|
|
|
background-color: #252528; |
|
|
|
|
.renew { |
|
|
|
|
width: 100%; |
|
|
|
|
margin-bottom: 16px; |
|
|
|
|
} |
|
|
|
|
.entry { |
|
|
|
|
display: block; |
|
|
|
|
width: 100%; |
|
|
|
|
@ -536,6 +570,16 @@ $height: 700px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.buy { |
|
|
|
|
text-align: center; |
|
|
|
|
.tips { |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
} |
|
|
|
|
img { |
|
|
|
|
width: 85%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.el-image-viewer__wrapper{ |
|
|
|
|
transform: translateY(-10px); |
|
|
|
|
transition: transform .5s; |
|
|
|
|
|
