|
|
@@ -13,6 +13,10 @@
|
|
|
:vid="vid"
|
|
|
:showSettingBtn="true"
|
|
|
:enablePlayGesture="true"
|
|
|
+ @statechange="onStateChange"
|
|
|
+ :autoplay="autoplay"
|
|
|
+ :isAllowSeek="isAllowSeek"
|
|
|
+ :playbackRate="playbackRate"
|
|
|
></polyv-player>
|
|
|
</view>
|
|
|
<view>
|
|
|
@@ -98,10 +102,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 +118,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">
|
|
|
@@ -195,10 +199,24 @@ export default {
|
|
|
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 // 当前视频时长
|
|
|
+
|
|
|
};
|
|
|
},
|
|
|
onUnload() {},
|
|
|
- computed: { ...mapGetters(['userInfo']) },
|
|
|
+ computed: { ...mapGetters(['userInfo','playSectionId']) },
|
|
|
onLoad(option) {
|
|
|
this.courseId = option.id;
|
|
|
this.goodsId = uni.getStorageSync('courseGoodsId');
|
|
|
@@ -209,15 +227,172 @@ export default {
|
|
|
onShow() {},
|
|
|
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
|
|
|
});
|
|
|
},
|
|
|
methods: {
|
|
|
+ postStudyRecord() {
|
|
|
+ console.log("提交接口A")
|
|
|
+ let self = this;
|
|
|
+ let data = {
|
|
|
+ photo:self.ossAvatarUrl,
|
|
|
+ sectionId:self.playSectionId,
|
|
|
+ goodsId:self.goodsId,
|
|
|
+ courseId:self.courseId,
|
|
|
+ studyDuration:self.studyDuration,
|
|
|
+ status:0
|
|
|
+ }
|
|
|
+ console.log("提交接口")
|
|
|
+ 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 = parseInt(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') {
|
|
|
+
|
|
|
+ }
|
|
|
+ console.log(newstate,35)
|
|
|
+
|
|
|
+ },
|
|
|
//拍照
|
|
|
openPhoto(){
|
|
|
this.photoPopup = true
|
|
|
},
|
|
|
+ async submit(){
|
|
|
+ const waitYS = await this.imageInfos();
|
|
|
+ this.postStudyRecord()//提交记录
|
|
|
+ console.log(this.ossAvatarUrl,"拍照完成456")
|
|
|
+ },
|
|
|
//确认拍照
|
|
|
takePhoto() {
|
|
|
var self = this
|
|
|
@@ -226,6 +401,9 @@ export default {
|
|
|
quality: 'high',
|
|
|
success: res => {
|
|
|
console.log(res.tempImagePath)
|
|
|
+ self.avatarUrl = res.tempImagePath
|
|
|
+ self.submit()
|
|
|
+
|
|
|
self.photoPopup = false
|
|
|
},
|
|
|
fail: err => {
|
|
|
@@ -245,7 +423,24 @@ export default {
|
|
|
let self = this
|
|
|
this.$api.goodsDetail(this.goodsId).then(res => {
|
|
|
self.goodsData = res.data.data;
|
|
|
-
|
|
|
+ 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() {
|
he2802
