Skip to content

C
CFFP-HB
Commit 3299aa2b by kyle
Options

课程详情

parent 81ee5fd2
Showing with 157 additions and 44 deletions
components/login/login.vue
...@@ -154,7 +154,8 @@ ...@@ -154,7 +154,8 @@
if(res['success']){ if(res['success']){
this.userId = String(res['data']['userId']); this.userId = String(res['data']['userId']);
uni.setStorageSync('isLogin','1') uni.setStorageSync('isLogin','1')
uni.setStorageSync('cffp_userId',this.userId) uni.setStorageSync('cffp_userId',this.userId);
uni.setStorageSync('loginType',this.loginType)
uni.navigateTo({ uni.navigateTo({
url:'/pages/index/index' url:'/pages/index/index'
}) })
......
pages/certifyDetail/certifyDetail.vue
...@@ -82,7 +82,8 @@ ...@@ -82,7 +82,8 @@
export default { export default {
data() { data() {
return { return {
certificateInfo:{} certificateInfo:{},
userId:'1'
}; };
}, },
onLoad(options) { onLoad(options) {
...@@ -102,9 +103,26 @@ ...@@ -102,9 +103,26 @@
}) })
}, },
registerNow(){ registerNow(){
uni.navigateTo({ const param = {
url: '/pages/orderConfirm/orderConfirm' productType:this.certificateInfo.fileType,
}); productId:this.certificateInfo.fileId,
userId:this.userId,
dataSource:1
}
api.saveOrder(param).then(res=>{
if(res['success']){
this.orderId = res['data']['id'];
uni.navigateTo({
url:`/pages/orderConfirm/orderConfirm?fileId=${this.certificateInfo.fileId}&orderId=${this.orderId}`
})
}else{
uni.showToast({
title: res['message'],
duration: 2000
});
return;
}
})
}, },
dateFormat(val){ dateFormat(val){
return dataHandling.dateFormat(val,'yyyy-MM-dd') return dataHandling.dateFormat(val,'yyyy-MM-dd')
......
pages/courseDetail/courseDetail.vue
...@@ -2,7 +2,16 @@ ...@@ -2,7 +2,16 @@
<view class="container"> <view class="container">
<!-- 课程banner图 --> <!-- 课程banner图 -->
<view class="courseBannerBox"> <view class="courseBannerBox">
<video :src="courseInfo.filePathOss" :initial-time="0" duration="180" object-fit="contain" class="videoBox" :poster="courseInfo.fileFirstImage" :title="courseInfo.fileTitle"></video> <video id="myVideo" :src="courseInfo.filePathOss"
:initial-time="videoPlaybackInfo.maxViewTime"
object-fit="contain" class="videoBox"
:poster="courseInfo.fileFirstImage" :title="courseInfo.fileTitle"
@loadedmetadata="loadedmetadata"
@play="playVideo"
@pause="pause"
@ended="ended"
@timeupdate="timeupdate"
></video>
</view> </view>
<!-- 课程详情图 --> <!-- 课程详情图 -->
<view class="courseTitleContent"> <view class="courseTitleContent">
...@@ -14,7 +23,8 @@ ...@@ -14,7 +23,8 @@
</view> </view>
</view> </view>
<view class="dataBox"> <view class="dataBox">
<strong>￥{{courseInfo.coursePrice}}</strong> <strong v-if="courseInfo.status==1">￥{{courseInfo.coursePrice}}</strong>
<text v-if="courseInfo.status==2" style="color: #F15A1F;margin-right: 20rpx;"><i class="iconfont icon-yifukuan"></i>已购</text>
<text>{{courseInfo.salesNumber}}人购买</text> <text>{{courseInfo.salesNumber}}人购买</text>
</view> </view>
</view> </view>
...@@ -71,7 +81,7 @@ ...@@ -71,7 +81,7 @@
</view> </view>
<!-- 购买按钮 --> <!-- 购买按钮 -->
<view class="buyBox" @click="saveOrder()" v-if="courseInfo.status == 1"> <view class="buyBox" @click="saveOrder()" v-if="courseInfo.status == 1">
<text>购买</text> <text>{{loginType=='visitor' ? '登录/注册' : '购买'}}</text>
</view> </view>
</view> </view>
</view> </view>
...@@ -99,34 +109,47 @@ ...@@ -99,34 +109,47 @@
requiredCount:0, requiredCount:0,
nonRequiredCount:0, nonRequiredCount:0,
videoPlaybackInfo:{}, videoPlaybackInfo:{},
playbackId:'',
totalTime:0,
auditionTime:0,
viewTime:0,
timer:null,
loginType:''
}; };
}, },
methods:{ methods:{
// 订单保存 // 订单保存
saveOrder(){ saveOrder(){
const param = { if(this.loginType==='visitor'){
productType:this.courseInfo.fileType, uni.navigateTo({
productId:this.courseInfo.fileId, url:'/components/login/login'
userId:this.userId, })
shareUserId:this.shareUserId, }else{
shareReadId:this.shareReadId, const param = {
shareCode:this.shareCode, productType:this.courseInfo.fileType,
dataSource:this.dataSource productId:this.courseInfo.fileId,
} userId:this.userId,
api.saveOrder(param).then(res=>{ shareUserId:this.shareUserId,
if(res['success']){ shareReadId:this.shareReadId,
this.orderId = res['data']['id']; shareCode:this.shareCode,
uni.navigateTo({ dataSource:this.dataSource
url:`/pages/orderConfirm/orderConfirm?fileId=${this.fileId}&orderId=${this.orderId}`
})
}else{
uni.showToast({
title: res['message'],
duration: 2000
});
return;
} }
}) api.saveOrder(param).then(res=>{
if(res['success']){
this.orderId = res['data']['id'];
uni.navigateTo({
url:`/pages/orderConfirm/orderConfirm?fileId=${this.fileId}&orderId=${this.orderId}`
})
}else{
uni.showToast({
title: res['message'],
duration: 2000
});
return;
}
})
}
}, },
// 切换tab // 切换tab
switchTab(type) { switchTab(type) {
...@@ -162,6 +185,9 @@ ...@@ -162,6 +185,9 @@
this.courseInfo = res['data']['data']; this.courseInfo = res['data']['data'];
this.lecturerId = res['data']['data']['fileLecturerId']; this.lecturerId = res['data']['data']['fileLecturerId'];
this.lecturerQuery(); this.lecturerQuery();
if(this.courseInfo.status === 2){
this.findVideoPlayback()
}
} }
}) })
}, },
...@@ -173,7 +199,6 @@ ...@@ -173,7 +199,6 @@
this.relatedCoursesLists = res['data']['data']['relatedCourseList']; this.relatedCoursesLists = res['data']['data']['relatedCourseList'];
this.nonRequiredCount = res['data']['data']['nonRequiredCount']; this.nonRequiredCount = res['data']['data']['nonRequiredCount'];
this.requiredCount = res['data']['data']['requiredCount']; this.requiredCount = res['data']['data']['requiredCount'];
console.log(this.relatedCoursesLists)
} }
}) })
}, },
...@@ -198,17 +223,18 @@ ...@@ -198,17 +223,18 @@
saveVideoPlayback(){ saveVideoPlayback(){
// 视频播放轨迹保存 // 视频播放轨迹保存
const param = { const param = {
id:this.playbackId ? this.playbackId : null,
systemType:1, systemType:1,
userId:this.userId, userId:this.userId,
fileId:this.fileId, fileId:this.fileId,
packFileId:this.courseInfo.packFileId, packFileId:this.courseInfo.packFileId,
totalTime:this.courseInfo.totalTime, totalTime:Math.floor(this.totalTime * 100) / 100,
viewTime:this.courseInfo.viewTime, viewTime:Math.floor(this.viewTime * 100) / 100,
playbackStatus:this.courseInfo.viewTime >= this.courseInfo.totalTime ? '2' : '1' playbackStatus:this.viewTime >= this.totalTime ? '2' : '1'
} }
api.findVideoPlayback(param).then(res=>{ api.saveVideoPlayback(param).then(res=>{
if(res['success']){ if(res['success']){
this.videoPlaybackInfo = res['data'] this.playbackId = res['data']['id'];
} }
}) })
}, },
...@@ -225,16 +251,79 @@ ...@@ -225,16 +251,79 @@
this.videoPlaybackInfo = res['data'] this.videoPlaybackInfo = res['data']
} }
}) })
},
loadedmetadata(e){
this.totalTime = e.detail.duration;
},
playVideo(e){
// 开始/继续播放
if(this.courseInfo.status === 2){
if(this.timer){
clearInterval(this.timer)
}
this.saveVideoPlayback();
this.timer = setInterval(()=>{
this.saveVideoPlayback()
},20*1000)
}
},
pause(){
// 暂停播放
if(this.timer){
clearInterval(this.timer)
}
if(this.viewTime >= this.totalTime){
// 当播放完成的时候这里不触发
return;
}else{
this.saveVideoPlayback();
}
},
ended(){
// 播放到末尾
if(this.timer){
clearInterval(this.timer)
}
this.saveVideoPlayback();
},
timeupdate(e){
// 播放进度变化
this.viewTime = e.detail.currentTime > this.totalTime ? this.totalTime : e.detail.currentTime;
if(this.courseInfo.status === 1){
// 如果是试听，那么当观看时间大于等于试听时间的时候，强制暂停，并出弹窗
if(this.viewTime >= this.courseInfo.auditionTime){
this.videoContext.pause();
// // 不可播放
uni.showModal({
content: '购买之后才可继续播放哦~',
showCancel:false,
success: function (res) {
if (res.confirm) {
console.log('用户点击确定');
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
this.videoContext.seek(0);
}
}
} }
}, },
mounted(){ mounted(){
this.switchTab(1); this.switchTab(1);
this.findVideoPlayback() this.loginType = uni.getStorageSync('loginType')
}, },
onLoad(option){ onLoad(option){
this.fileId = option.fileId; this.fileId = option.fileId;
},
onReady(){
this.videoContext = uni.createVideoContext('myVideo');
},
destroyed() {
if(this.timer){
clearInterval(this.timer)
}
} }
} }
</script> </script>
......
pages/index/index.vue
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
{ key: '03', name: '学习认证', icon: 'learningCertify', link: '/pages/learnCertify/learnCertify', isOpen: true }, { key: '03', name: '学习认证', icon: 'learningCertify', link: '/pages/learnCertify/learnCertify', isOpen: true },
{ key: '04', name: '邀请加盟', icon: 'shareJoin', link: '/pages/inviteJoin/inviteJoin', isOpen: true }, { key: '04', name: '邀请加盟', icon: 'shareJoin', link: '/pages/inviteJoin/inviteJoin', isOpen: true },
{ key: '05', name: '我的分享', icon: 'share', link: '/pages/myShare/myShare', isOpen: true }, { key: '05', name: '我的分享', icon: 'share', link: '/pages/myShare/myShare', isOpen: true },
{ key: '06', name: '我的团队', icon: 'team', link: '', isOpen: false }, { key: '06', name: '我的团队', icon: 'team', link: '/pages/personalCenter/myTeam', isOpen: true },
{ key: '07', name: '更多功能', icon: 'more', link: '/pages/personalCenter/personalCenter', isOpen: true } { key: '07', name: '更多功能', icon: 'more', link: '/pages/personalCenter/personalCenter', isOpen: true }
], ],
cffpUserInfo:{ cffpUserInfo:{
......
pages/myLearning/myLearning.vue
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<view class="learningRecordItem" v-for="item in userStudyLists"> <view class="learningRecordItem" v-for="item in userStudyLists">
<view class="dateBox">{{item.studyTime}}</view> <view class="dateBox">{{item.studyTime}}</view>
<!-- 课程详情 --> <!-- 课程详情 -->
<view class="courseInfoContent" v-for="subItem in item.userStudyInfos" :key="subItem.fileId"> <view class="courseInfoContent" v-for="subItem in item.userStudyInfos" :key="subItem.fileId" @click="viewDetail(subItem)">
<view class="thumbnailBox"> <view class="thumbnailBox">
<image :src="subItem.displayImage" alt="" mode="widthFix"></image> <image :src="subItem.displayImage" alt="" mode="widthFix"></image>
</view> </view>
...@@ -71,6 +71,11 @@ ...@@ -71,6 +71,11 @@
}, },
dateFormat(val){ dateFormat(val){
return dataHandling.dateFormat(val); return dataHandling.dateFormat(val);
},
viewDetail(item){
uni.navigateTo({
url:`/pages/courseDetail/courseDetail?fileId=${item.fileId}`
})
} }
}, },
onLoad() { onLoad() {
......
pages/orderConfirm/orderConfirm.vue
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<view><text>现价</text><text>￥{{courseInfoItem.coursePrice}}</text></view> <view><text>现价</text><text>￥{{courseInfoItem.coursePrice}}</text></view>
<view> <view>
<text @click="toggle(1,'bottom')">积分抵扣<i class="iconfont icon-31tishi"></i></text> <text @click="toggle(1,'bottom')">积分抵扣<i class="iconfont icon-31tishi"></i></text>
<text class="integralBox" @click="toggle(2,'bottom')">未选积分，可抵扣{{deductionCore}}<i class="iconfont icon-youjiantou"></i></text> <text class="integralBox" @click="toggle(2,'bottom')">{{!isDeduction ? '未选' : '已选'}}积分，可抵扣{{deductionCore}}<i class="iconfont icon-youjiantou"></i></text>
</view> </view>
<view><text>合计</text><text>￥{{totalPrice}}</text></view> <view><text>合计</text><text>￥{{totalPrice}}</text></view>
</view> </view>
...@@ -102,7 +102,7 @@ ...@@ -102,7 +102,7 @@
</view> </view>
<view class="intergralItem"> <view class="intergralItem">
<text>剩余可兑换积分:</text> <text>剩余可兑换积分:</text>
<text>{{intergralInfo.yesExchangeFortune - deductionCore}}积分</text> <text>{{(intergralInfo.yesExchangeFortune - deductionCore).toFixed(2)}}积分</text>
</view> </view>
<view class="confirmBtn" @click="closePopup(2)"> <view class="confirmBtn" @click="closePopup(2)">
确认兑换 确认兑换
...@@ -128,7 +128,7 @@ ...@@ -128,7 +128,7 @@
paymentMethod:2, paymentMethod:2,
popupTitle:'积分抵扣规则', popupTitle:'积分抵扣规则',
popupType:1, popupType:1,
isDeduction:true, isDeduction:false,
userId:'1', userId:'1',
intergralInfo:{}, intergralInfo:{},
orderId:'1' orderId:'1'
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment