|
|
@@ -13,6 +13,10 @@
|
|
|
:vid="vid"
|
|
|
:showSettingBtn="true"
|
|
|
:enablePlayGesture="true"
|
|
|
+ @statechange="onStateChange"
|
|
|
+ :autoplay="autoplay"
|
|
|
+ :isAllowSeek="isAllowSeek"
|
|
|
+ :playbackRate="playbackRate"
|
|
|
></polyv-player>
|
|
|
</view>
|
|
|
<view>
|
|
|
@@ -29,9 +33,9 @@
|
|
|
</u-row>
|
|
|
</view>
|
|
|
<u-line color="#D6D6DB" />
|
|
|
- <view>
|
|
|
- <view style="width: 240px;margin: 0 auto;">
|
|
|
- <u-tabs :list="list" item-width="150" font-size="24" bar-width="80" :current="current" @change="change" active-color="#007AFF"></u-tabs>
|
|
|
+ <view style="display: flex;justify-content: center;">
|
|
|
+ <view style="width: 280px;">
|
|
|
+ <u-tabs :list="list" font-size="24" bar-width="80" :current="current" @change="change" active-color="#007AFF"></u-tabs>
|
|
|
</view>
|
|
|
</view>
|
|
|
<u-line color="#D6D6DB" />
|
|
|
@@ -39,17 +43,28 @@
|
|
|
<view class="box">
|
|
|
<!--目录 -->
|
|
|
<view v-show="current == 0">
|
|
|
+ <view class="menuBox" v-for="(item, index) in reMenuList">
|
|
|
+ <!--模块 -->
|
|
|
+ <view v-if="item.type == 1"><courseModule :isRebuild="true" :isBuy="true" :menuItem="item" :levelId="item.menuId"></courseModule></view>
|
|
|
+ <!--章 -->
|
|
|
+ <view v-if="item.type == 2"><courseChapter :isRebuild="true" :isBuy="true" :menuItem="item" :levelId="'0-'+item.menuId"></courseChapter></view>
|
|
|
+ <!--节 -->
|
|
|
+ <view v-if="item.type == 3"><courseSection :isRebuild="true" :isBuy="true" :menuItem="item" :levelId="'0-0-'+item.menuId"></courseSection></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!--目录 -->
|
|
|
+ <view v-show="current == 1">
|
|
|
<view class="menuBox" v-for="(item, index) in menuList">
|
|
|
<!--模块 -->
|
|
|
- <view v-if="item.type == 1"><courseModule :isBuy="true" :menuItem="item"></courseModule></view>
|
|
|
+ <view v-if="item.type == 1"><courseModule :isBuy="true" :menuItem="item" :levelId="item.menuId"></courseModule></view>
|
|
|
<!--章 -->
|
|
|
- <view v-if="item.type == 2"><courseChapter :isBuy="true" :menuItem="item"></courseChapter></view>
|
|
|
+ <view v-if="item.type == 2"><courseChapter :isBuy="true" :menuItem="item" :levelId="'0-'+item.menuId"></courseChapter></view>
|
|
|
<!--节 -->
|
|
|
- <view v-if="item.type == 3"><courseSection :isBuy="true" :menuItem="item"></courseSection></view>
|
|
|
+ <view v-if="item.type == 3"><courseSection :isBuy="true" :menuItem="item" :levelId="'0-0-'+item.menuId"></courseSection></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!--笔记 -->
|
|
|
- <view v-show="current == 1">
|
|
|
+ <view v-show="current == 2">
|
|
|
<view class="inputBottom">
|
|
|
<view style="width: 10%;"><image src="/static/icon/note3.png" style="width: 39rpx;height: 39rpx;margin:0 29rpx;"></image></view>
|
|
|
<view style="width: 73%;height: 88rpx;margin-bottom: 15rpx;">
|
|
|
@@ -77,7 +92,7 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<!--答疑 -->
|
|
|
- <view v-show="current == 2">
|
|
|
+ <view v-show="current == 3">
|
|
|
<view class="inputBottom">
|
|
|
<view style="width: 73%;height: 88rpx;margin-bottom: 15rpx;margin-left: 10% ;">
|
|
|
<u-input height="78" fixed="true" placeholder="您可以在这里输入答疑内容" type="textarea" :custom-style="inputStyle" v-model="value" />
|
|
|
@@ -98,10 +113,10 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 播放前拍照start -->
|
|
|
- <u-popup v-model="photoPopup" mode="bottom" border-radius="32">
|
|
|
+ <u-popup v-model="photoPopup" mode="bottom" border-radius="32" :mask-close-able="false">
|
|
|
<view class="photoBox">
|
|
|
<view class="photoTop">
|
|
|
- <view class="sqzz">
|
|
|
+ <view class="sqzz" v-if="true">
|
|
|
<u-icon name="close" color="#333333" size="30" @click="closePhoto"></u-icon>
|
|
|
</view>
|
|
|
<view class="centersq">
|
|
|
@@ -114,7 +129,7 @@
|
|
|
<view class="photoCenter">
|
|
|
<camera device-position="front" flash="off" @error="error" style="width: 100%; height: 100%" v-if="photoPopup"></camera>
|
|
|
<view class="custom">
|
|
|
- <image src="@/static/zhezhao@2x.png" mode=""></image>
|
|
|
+ <image src="@/pages2/static/zhezhao.png" mode=""></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="btnResult" @click="takePhoto">
|
|
|
@@ -152,6 +167,9 @@ export default {
|
|
|
},
|
|
|
playbackRate: [0.5, 0.8, 1.0],
|
|
|
list: [
|
|
|
+ {
|
|
|
+ name: '重修目录'
|
|
|
+ },
|
|
|
{
|
|
|
name: '目录'
|
|
|
},
|
|
|
@@ -163,61 +181,243 @@ export default {
|
|
|
}
|
|
|
],
|
|
|
menuList: [
|
|
|
- {
|
|
|
- list: [
|
|
|
- {
|
|
|
- showChildren: false,
|
|
|
- children: [1, 2, 3]
|
|
|
- },
|
|
|
- {
|
|
|
- showChildren: false,
|
|
|
- children: [1]
|
|
|
- },
|
|
|
- {
|
|
|
- showChildren: false,
|
|
|
- children: [1, 2]
|
|
|
- }
|
|
|
- ],
|
|
|
- type: 1
|
|
|
- },
|
|
|
- {
|
|
|
- type: 2,
|
|
|
- showChildren: false,
|
|
|
- list: [{}, {}, {}]
|
|
|
- },
|
|
|
- {
|
|
|
- type: 3,
|
|
|
- list: [{}, {}]
|
|
|
- }
|
|
|
],
|
|
|
- current: 0,
|
|
|
+ current: 1,
|
|
|
vid:'',
|
|
|
goodsId:0,
|
|
|
goodsData:{},
|
|
|
photoPopup:false,
|
|
|
+ goodsPlayConfig:null,
|
|
|
+ autoplay:false,
|
|
|
+ isAllowSeek:'no',
|
|
|
+ playbackRate: [1.0],
|
|
|
+ timer:null,
|
|
|
+ goodsPhotographConfig:null,
|
|
|
+ intervalTimeList:[],// 间隔拍照时长
|
|
|
+ intervalTimeIndex:0 ,//当前处于哪个时间段拍照
|
|
|
+ playTime:0 ,//页面播放时长，不含暂停
|
|
|
+ currentTime:0,
|
|
|
+ avatarUrl:'',
|
|
|
+ ossAvatarUrl:'',
|
|
|
+ studyDuration:0, // 当前视频时长
|
|
|
+ gradeId:0,
|
|
|
+ chapterId:0,
|
|
|
+ moduleId:0,
|
|
|
+ reMenuList: [
|
|
|
+ ],
|
|
|
+
|
|
|
};
|
|
|
},
|
|
|
onUnload() {},
|
|
|
- computed: { ...mapGetters(['userInfo']) },
|
|
|
+ computed: { ...mapGetters(['userInfo','playSectionId']) },
|
|
|
onLoad(option) {
|
|
|
this.courseId = option.id;
|
|
|
this.goodsId = uni.getStorageSync('courseGoodsId');
|
|
|
this.courseDetail();
|
|
|
this.getMenuList();
|
|
|
this.getGoodsDetail()
|
|
|
+
|
|
|
},
|
|
|
onShow() {},
|
|
|
+ onUnload() {
|
|
|
+ if(this.playSectionId>0){
|
|
|
+ //退出提交记录
|
|
|
+ this.ossAvatarUrl = ""
|
|
|
+ this.postStudyRecord()
|
|
|
+ //清除正在播放的节ID
|
|
|
+ this.$store.commit('setPlaySectionId', {playSectionId :0});
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
mounted() {
|
|
|
eventHub.$on('getSection', item => {
|
|
|
- this.vid = item.recordingUrl
|
|
|
+ if(this.timer){
|
|
|
+ clearInterval(this.timer);
|
|
|
+ }
|
|
|
+ if(this.vid){
|
|
|
+ //切换视频
|
|
|
+ var polyvPlayerContext = this.selectComponent('#playerVideo');
|
|
|
+ polyvPlayerContext.changeVid(item.recordingUrl)
|
|
|
+ }else{
|
|
|
+ this.vid = item.recordingUrl
|
|
|
+ }
|
|
|
this.startStatus = true
|
|
|
+ this.startTime = 0
|
|
|
+ });
|
|
|
+ eventHub.$on('levelId', item => {
|
|
|
+ let arr = item.split('-')
|
|
|
+ //点击节获取的各层级ID
|
|
|
+ this.moduleId = arr[0]
|
|
|
+ this.chapterId = arr[1]
|
|
|
+ console.log(item,99)
|
|
|
});
|
|
|
},
|
|
|
methods: {
|
|
|
+ postStudyRecord(status=0) {
|
|
|
+ let self = this;
|
|
|
+ let data = {
|
|
|
+ photo:self.ossAvatarUrl,
|
|
|
+ sectionId:parseInt(self.playSectionId),
|
|
|
+ goodsId:parseInt(self.goodsId),
|
|
|
+ courseId:parseInt(self.courseId),
|
|
|
+ studyDuration:parseInt(self.studyDuration),
|
|
|
+ gradeId:parseInt(self.gradeId),
|
|
|
+ chapterId:parseInt(self.chapterId),
|
|
|
+ moduleId:parseInt(self.moduleId)
|
|
|
+ }
|
|
|
+ if(status>0){
|
|
|
+ data.status = status
|
|
|
+ }
|
|
|
+ console.log("提交接口",data)
|
|
|
+ this.$api.studyRecord(data).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ });
|
|
|
+ },
|
|
|
+ uploadFile(options, int) {
|
|
|
+ var self = this;
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ var data = {
|
|
|
+ imageStatus: int
|
|
|
+ };
|
|
|
+ self.$api.aliyunpolicy(data).then(res => {
|
|
|
+
|
|
|
+ if(res.data.code!=200){
|
|
|
+ self.$method.showToast('签名错误'+JSON.stringify(res.data))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ var ossToken = res.data.data.resultContent;
|
|
|
+ if(ossToken.host==null||ossToken.host==undefined){
|
|
|
+ self.$method.showToast('上传路径报错'+JSON.stringify(res.data))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ uni.uploadFile({
|
|
|
+ url: ossToken.host,
|
|
|
+ name: 'file',
|
|
|
+ filePath: options,
|
|
|
+ fileType: 'image',
|
|
|
+ header: {
|
|
|
+ AuthorizationToken: 'WX ' + uni.getStorageSync('token')
|
|
|
+ },
|
|
|
+ formData: {
|
|
|
+ key: ossToken.dir,
|
|
|
+ OSSAccessKeyId: ossToken.accessid,
|
|
|
+ policy: ossToken.policy,
|
|
|
+ Signature: ossToken.signature,
|
|
|
+ callback: ossToken.callback,
|
|
|
+ success_action_status: 200
|
|
|
+ },
|
|
|
+ success: result => {
|
|
|
+ if (result.statusCode === 200) {
|
|
|
+ self.ossAvatarUrl = ossToken.dir;
|
|
|
+ resolve();
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: '上传失败',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: '上传接口报错'+error,
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ imageInfos(){
|
|
|
+ var self = this
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ uni.getImageInfo({
|
|
|
+ src: self.avatarUrl,
|
|
|
+ success: async res => {
|
|
|
+ let canvasWidth = res.width; //图片原始长宽
|
|
|
+ let canvasHeight = res.height;
|
|
|
+ if (canvasWidth > 1000 || canvasHeight > 1000) {
|
|
|
+ uni.compressImage({
|
|
|
+ src: self.avatarUrl,
|
|
|
+ quality: 75,
|
|
|
+ width: '50%',
|
|
|
+ height: '50%',
|
|
|
+ success: async rest => {
|
|
|
+ const waitUpload = await self.uploadFile(rest.tempFilePath, 0);
|
|
|
+ resolve()
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ console.log('无需压缩');
|
|
|
+ const waitUpload = await self.uploadFile(self.avatarUrl, 0);
|
|
|
+ resolve()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ timeEvent() {
|
|
|
+ let self = this
|
|
|
+ var polyvPlayerContext = this.selectComponent('#playerVideo');
|
|
|
+ if (polyvPlayerContext != null) {
|
|
|
+ let PlayCurrentTime = polyvPlayerContext.getCurrentTime();
|
|
|
+ this.studyDuration = PlayCurrentTime
|
|
|
+ if(this.currentTime<PlayCurrentTime){
|
|
|
+ this.playTime+=(PlayCurrentTime-this.currentTime)
|
|
|
+ this.currentTime = PlayCurrentTime
|
|
|
+ }else{
|
|
|
+ this.currentTime = PlayCurrentTime
|
|
|
+ }
|
|
|
+ //判断是否需要拍照
|
|
|
+ if(this.intervalTimeList.length>this.intervalTimeIndex){
|
|
|
+ let photoTime = Number(this.intervalTimeList[this.intervalTimeIndex]) * 60 //获取拍照秒数
|
|
|
+ if(photoTime<this.playTime){
|
|
|
+ //启动拍照
|
|
|
+ //暂停
|
|
|
+ polyvPlayerContext.exitFullScreen()
|
|
|
+ polyvPlayerContext.pause()
|
|
|
+ this.openPhoto();
|
|
|
+ this.intervalTimeIndex++
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onStateChange(newstate, oldstate) {
|
|
|
+ if (newstate.detail.newstate == 'playing') {
|
|
|
+ //开始播放
|
|
|
+ if(this.timer){
|
|
|
+ clearInterval(this.timer);
|
|
|
+ }
|
|
|
+ this.timer = setInterval(this.timeEvent, 1500);//定时器
|
|
|
+ }
|
|
|
+ if (newstate.detail.newstate == 'pause') {
|
|
|
+ //暂停提交记录
|
|
|
+ /* this.ossAvatarUrl = ""
|
|
|
+ this.postStudyRecord() */
|
|
|
+ }
|
|
|
+ if (newstate.detail.newstate == 'ended') {
|
|
|
+ this.ossAvatarUrl = ""
|
|
|
+ this.postStudyRecord(1)
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
//拍照
|
|
|
openPhoto(){
|
|
|
this.photoPopup = true
|
|
|
},
|
|
|
+ async submit(){
|
|
|
+ const waitYS = await this.imageInfos();
|
|
|
+ this.postStudyRecord()//提交记录
|
|
|
+ //恢复播放
|
|
|
+ var polyvPlayerContext = this.selectComponent('#playerVideo');
|
|
|
+ if (polyvPlayerContext != null) {
|
|
|
+ polyvPlayerContext.play();
|
|
|
+ }
|
|
|
+ console.log(this.ossAvatarUrl,"拍照完成456")
|
|
|
+ },
|
|
|
//确认拍照
|
|
|
takePhoto() {
|
|
|
var self = this
|
|
|
@@ -226,6 +426,9 @@ export default {
|
|
|
quality: 'high',
|
|
|
success: res => {
|
|
|
console.log(res.tempImagePath)
|
|
|
+ self.avatarUrl = res.tempImagePath
|
|
|
+ self.submit()
|
|
|
+
|
|
|
self.photoPopup = false
|
|
|
},
|
|
|
fail: err => {
|
|
|
@@ -245,12 +448,45 @@ export default {
|
|
|
let self = this
|
|
|
this.$api.goodsDetail(this.goodsId).then(res => {
|
|
|
self.goodsData = res.data.data;
|
|
|
-
|
|
|
+ self.gradeId = self.goodsData.gradeId
|
|
|
+ self.getReMenuList() //获取重修目录
|
|
|
+ if(self.goodsData.goodsPlayConfig){
|
|
|
+ self.goodsPlayConfig = JSON.parse(self.goodsData.goodsPlayConfig);
|
|
|
+ if(self.goodsPlayConfig.autoPlay>0){
|
|
|
+ self.autoplay = true
|
|
|
+ }
|
|
|
+ if(self.goodsPlayConfig.drag>0){
|
|
|
+ self.isAllowSeek = "yes"
|
|
|
+ }
|
|
|
+ if(self.goodsPlayConfig.speed>0){
|
|
|
+ self.playbackRate = [0.5,0.8,1.0,1.25,1.5,2.0]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(self.goodsData.goodsPhotographConfig){
|
|
|
+ self.goodsPhotographConfig = JSON.parse(self.goodsData.goodsPhotographConfig);
|
|
|
+ if(self.goodsPhotographConfig.intervalTime){
|
|
|
+ self.intervalTimeList = self.goodsPhotographConfig.intervalTime.split(',')
|
|
|
+ }
|
|
|
+ }
|
|
|
})
|
|
|
},
|
|
|
startVideo() {
|
|
|
this.startStatus = true;
|
|
|
},
|
|
|
+ getReMenuList() {
|
|
|
+ let self = this;
|
|
|
+ this.$api.menuList({ courseId: this.courseId,rebuild:1,gradeId:this.gradeId }).then(res => {
|
|
|
+ if (res.data.code == 200) {
|
|
|
+ for (let i = 0; i < res.data.rows.length; i++) {
|
|
|
+ let item = res.data.rows[i];
|
|
|
+ item.down = true;
|
|
|
+ item.id = item.menuId;
|
|
|
+ item.name = item.menuName;
|
|
|
+ }
|
|
|
+ self.reMenuList = res.data.rows;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
getMenuList() {
|
|
|
let self = this;
|
|
|
this.$api.menuList({ courseId: this.courseId }).then(res => {
|
|
|
@@ -270,6 +506,7 @@ export default {
|
|
|
this.$api.courseDetail(this.courseId).then(res => {
|
|
|
if (res.data.code == 200) {
|
|
|
self.detail = res.data.data;
|
|
|
+ self.gradeId = self.detail.gradeId
|
|
|
}
|
|
|
});
|
|
|
},
|
