2107 lines
51 KiB
Plaintext
2107 lines
51 KiB
Plaintext
<template>
|
||
<view class="detail">
|
||
<list :bounce="false" :loadmoreoffset="wHeight*3" :show-scrollbar="false" ref="listBox" :pagingEnabled="true"
|
||
:scrollable="true">
|
||
<cell v-for="(item,i) in videoList" :key="i" :ref="'list'+item.courseDetailsId">
|
||
<view class="swipers-items" @longpress="openBs()" @disappear="disappear(item.courseDetailsId,i)"
|
||
@appear="appear(item.courseDetailsId,i)" :style="boxStyle">
|
||
<!-- 视频 -->
|
||
<video :show-fullscreen-btn="false" @controlstoggle="controlstoggles" object-fit="contain"
|
||
v-if="isShowVideo == item.courseDetailsId && item.videoUrl" :play-strategy="2"
|
||
:show-loading="true" codec="software" :muted="false" :show-center-play-btn="true" :loop="true"
|
||
@timeupdate="timeupdate" @play="videoPlay('myVideo'+item.courseDetailsId, item.courseDetailsId)"
|
||
@ended="ended" :enable-progress-gesture="false" :poster="item.titleImg"
|
||
:ref="'myVideo'+item.courseDetailsId" :id="'myVideo'+item.courseDetailsId" :src="item.videoUrl"
|
||
:autoplay="item.autoPlay" class="swipers-items-video"></video>
|
||
<image v-else @click="!item.videoUrl?openPay():''" :src="item.titleImg" class="swipers-items-imgsbg"
|
||
mode="aspectFill">
|
||
</image>
|
||
<!-- 返回图标 -->
|
||
<image v-if="showBack" src="../static/nvueIcon/backs.png" @click="goBack()"
|
||
class="swipers-items-back" mode="">
|
||
</image>
|
||
<!-- 右边操作 -->
|
||
<view class="swipers-items-right" :style="rightTop" v-if="showControls">
|
||
<view class="swipers-items-right-item">
|
||
<view class="swipers-items-right-item-img" @click.stop="dianzan(item)">
|
||
<image v-if="item.isGood!=0" class="swipers-items-right-item-imgs"
|
||
src="../static/nvueIcon/myLove_.png" mode=""></image>
|
||
<image v-else class="swipers-items-right-item-imgs" src="../static/nvueIcon/myLove.png"
|
||
mode=""></image>
|
||
</view>
|
||
<view class="swipers-items-right-item-txt">
|
||
<text class="swipers-items-right-item-txts">
|
||
{{item.goodNum}}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
<view class="swipers-items-right-item" @click="share()">
|
||
<view class="swipers-items-right-item-img">
|
||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/share.png"
|
||
mode=""></image>
|
||
</view>
|
||
<view class="swipers-items-right-item-txt">
|
||
<text class="swipers-items-right-item-txts">
|
||
分享
|
||
</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="swipers-items-right-item" v-if="isCollect">
|
||
<view class="swipers-items-right-item-img" @click.stop="shoucang()">
|
||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/shuqian_s.png"
|
||
mode=""></image>
|
||
</view>
|
||
<view class="swipers-items-right-item-txt">
|
||
<text class="swipers-items-right-item-txts">
|
||
已追
|
||
</text>
|
||
</view>
|
||
</view>
|
||
<view class="swipers-items-right-item" v-else>
|
||
<view class="swipers-items-right-item-img" @click.stop="shoucang()">
|
||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/shuqian.png"
|
||
mode=""></image>
|
||
</view>
|
||
<view class="swipers-items-right-item-txt">
|
||
<text class="swipers-items-right-item-txts">
|
||
追剧
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 底部视频信息 -->
|
||
<view class="swipers-items-btom" v-if="showControls">
|
||
<view class="swipers-items-btom-box">
|
||
<!-- 标题 -->
|
||
<view class="swipers-items-btom-box-title">
|
||
<text class="swipers-items-btom-box-titles">
|
||
{{item.courseDetailsName}}
|
||
</text>
|
||
</view>
|
||
<!-- 介绍 -->
|
||
<view v-if="item.content" class="swipers-items-btom-box-content">
|
||
<text class="swipers-items-btom-box-contents">{{item.content}}</text>
|
||
</view>
|
||
<!-- 集数 -->
|
||
<view @click="openShow()" class="swipers-items-btom-box-num">
|
||
<text class="swipers-items-btom-box-nums">
|
||
第{{item.num}}集（共{{meunList.length}}集）选集 >
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</cell>
|
||
</list>
|
||
<!-- 选集弹窗 -->
|
||
<uni-popup @change="changeXj" ref="popup" :safe-area="false">
|
||
<view class="list">
|
||
<view class="list-title">
|
||
<view class="list-title-l">
|
||
<text class="list-title-ls">
|
||
{{title}}
|
||
</text>
|
||
<text class="list-title-lsn">共{{meunList.length}}集</text>
|
||
</view>
|
||
<view class="list-title-r" @click="closeList()">
|
||
<image class="list-title-rs" src="../../static/images/me/closeIconss.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<view class="list-content">
|
||
<scroll-view :scroll-into-view="scrollIntoViews" :show-scrollbar="true" scroll-y="true" class="
|
||
">
|
||
<view class="list-contentss">
|
||
<view :id="item.viewInfo" @click="selectPlay(item)"
|
||
:class="('video'+index) == scrollIntoView?'videoListCurr':''" class="list-content-item"
|
||
v-for="(item,index) in meunList" :key="index">
|
||
<text class="list-content-items">第{{index+1}}集</text>
|
||
<image v-if="('video'+index) == scrollIntoView" class="list-box-item-playing"
|
||
src="../../static/images/me/playIng.png" mode=""></image>
|
||
<view v-if="!item.videoUrl" class="list-box-item-lock">
|
||
<image class="list-box-item-lockI" src="../../static/images/me/lockWite.png"
|
||
mode=""></image>
|
||
</view>
|
||
</view>
|
||
<view class="list-content-item" style="height: 0;">
|
||
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
<!-- 购买弹窗 -->
|
||
<uni-popup ref="popupPya" :safe-area="false">
|
||
<view class="pay">
|
||
<view class="list-title">
|
||
<view class="list-title-l">
|
||
<text class="list-title-lss">
|
||
当前视频 没有播放权限
|
||
</text>
|
||
</view>
|
||
<view class="list-title-r" @click="closePay()">
|
||
<image class="list-title-rs" src="../../static/images/me/closeIconss.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<text class=""
|
||
style="font-size: 24rpx;color: #999;padding: 0 34rpx;margin: 20rpx 0; auto;text-align: left;width: 100%;">
|
||
{{getRedEnvelopeTips}}
|
||
</text>
|
||
<view class="pay-content">
|
||
<view class="pay-content-item" @click="payVideo(1)">
|
||
<image class="pay-content-item-icon" src="../../static/images/me/rmIcon.png" mode=""></image>
|
||
<text class="pay-content-items">
|
||
{{countPrice*scale}}金币解锁单集视频
|
||
</text>
|
||
</view>
|
||
<view class="pay-content-item" @click="payVideo(2)">
|
||
<text class="pay-content-items">
|
||
{{countPrice}}元解锁单集视频
|
||
</text>
|
||
</view>
|
||
<!-- <view class="pay-content-item" @click="goNav('/pages/me/vip/index')" v-if="isVips == '是'">
|
||
<image class="pay-content-item-icon" src="../../static/images/me/rmIcon.png" mode=""></image>
|
||
<text class="pay-content-items">
|
||
开通会员
|
||
</text>
|
||
</view> -->
|
||
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
<uni-popup ref="popupBs" :safe-area="true" background-color="#ffffff">
|
||
<view class="bs">
|
||
<text class="bs-title">倍速：</text>
|
||
<view class="bs-se">
|
||
<view class="bs-se-i" @click="BsChange(index)" :class="nowBs==index?'bsActive':''"
|
||
v-for="(item,index) in subList" :key="index">
|
||
<text class="bs-se-it">{{item.name}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
|
||
|
||
<!-- 支付弹窗 -->
|
||
<uni-popup ref="popuppay" :safe-area="false">
|
||
<view class="popuppay">
|
||
<!-- 标题 -->
|
||
<view class="popuppay-title">
|
||
<text class="popuppay-title-l">
|
||
购买后继续观看
|
||
</text>
|
||
<image @click="closePopusPay()" class="popuppay-title-r"
|
||
src="../../static/images/me/closeIconss.png" mode=""></image>
|
||
</view>
|
||
<!-- 余额 -->
|
||
<!-- <view class="popuppay-money">
|
||
<view class="popuppay-money-l">
|
||
<text class="popuppay-money-l-ye">
|
||
账号余额:
|
||
</text>
|
||
<text class="popuppay-money-l-jd">
|
||
{{moneyNum}}金币
|
||
</text>
|
||
<text class="popuppay-money-l-mx" @click="goWallet('/me/wallet/wallet')">
|
||
查看明细
|
||
</text>
|
||
</view>
|
||
<view class="popuppay-money-r">
|
||
<text class="popuppay-money-ye">
|
||
解锁价格:
|
||
</text>
|
||
<text class="popuppay-money-jd">
|
||
{{payPrice}}金币
|
||
</text>
|
||
</view>
|
||
</view> -->
|
||
<!-- 充值类型列表 -->
|
||
<!-- <scroll-view scroll-y="true" class="payLists">
|
||
<view class="popuppay-payList">
|
||
<view class="payList-item" @click="wallCurr = index" :class="wallCurr == index?'activePrice':''"
|
||
v-for="(item,index) in wallet" :key="index">
|
||
<view class="payList-item-price">
|
||
<text class="payList-item-prices">
|
||
￥{{item.price}}
|
||
</text>
|
||
|
||
</view>
|
||
<view class="payList-item-dou">
|
||
<text class="payList-item-dous">
|
||
{{item.money}}金币
|
||
</text>
|
||
</view>
|
||
<view class="payList-item-duo" v-if="item.giveMoney>0">
|
||
<text class="payList-item-duos">
|
||
多送{{item.giveMoney}}金币
|
||
</text>
|
||
</view>
|
||
<view class="payList-item-hui" v-if="item.remarks">
|
||
<text class="payList-item-huis">
|
||
{{item.remarks}}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view> -->
|
||
<!-- 支付类型 -->
|
||
<view class="payType">
|
||
<view class="payType-item" @tap='selectWay(item)' v-for="(item,index) in openLists" :key="index">
|
||
<view class="payType-item-l">
|
||
<image class="payType-item-l-icon" :src="item.image" mode=""></image>
|
||
<text class="payType-item-l-txt">
|
||
{{item.text}}
|
||
</text>
|
||
|
||
</view>
|
||
<view class="payType-item-r">
|
||
<radio-group name="openWay" style="margin-left: 20upx;">
|
||
<label class="tui-radio">
|
||
<radio color="#ff7581" :checked="openWay === item.id ? true : false" />
|
||
</label>
|
||
</radio-group>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 温馨提示 -->
|
||
<view v-if="moneyTips" class="tips">
|
||
<view class="tips-title">
|
||
<text class="tips-titles">温馨提示</text>
|
||
</view>
|
||
<view class="tips-contont">
|
||
<text class="tips-contonts">
|
||
{{moneyTips}}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
<!-- 协议 -->
|
||
<view class="illustrate">
|
||
<checkbox-group @change="checked = !checked">
|
||
<label>
|
||
<checkbox color="#ff7581" style="transform:scale(0.7)" value="cb" :checked="checked" />
|
||
</label>
|
||
</checkbox-group>
|
||
<text class="illustrate-txt" @click="checked = !checked">
|
||
我已经阅读并同意
|
||
</text>
|
||
<text class="illustrate-txts" @click="goWallet('/me/setting/payXieYi')">
|
||
《付费须知说明》
|
||
</text>
|
||
</view>
|
||
<!-- 支付按钮 -->
|
||
<view class="popuppay-btn" @click="pay()">
|
||
<text class="popuppay-btn-txt">
|
||
立即支付
|
||
</text>
|
||
</view>
|
||
|
||
</view>
|
||
</uni-popup>
|
||
|
||
<!-- 抽奖弹窗 -->
|
||
<!-- <uni-popup ref="refPopupZhuanPan" :safe-area="true" background-color="#ffffff">
|
||
<view case="">
|
||
111
|
||
<l-dialer :prizeList="prizeList" @click="onClick" @done="onDone" ref="dialer" />
|
||
</view>
|
||
</uni-popup> -->
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
const listDom = uni.requireNativePlugin('dom')
|
||
import config from '../../common/config.js'
|
||
import httpsRequest from '../../common/httpRequest.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
//可抽奖次数
|
||
freeNum: 0,
|
||
showBack: true,
|
||
noBuyVideoIndex: null,
|
||
// 奖品列表，
|
||
showMoney: true,
|
||
nowBs: 1, //当前倍速
|
||
subList: [{
|
||
name: '0.5x',
|
||
num: 0.5
|
||
}, {
|
||
name: '1x',
|
||
num: 1
|
||
}, {
|
||
name: '1.25x',
|
||
num: 1.25
|
||
}, {
|
||
name: '1.5x',
|
||
num: 1.5
|
||
}],
|
||
isStart: false, //是否开始生成二维码
|
||
erweima: '',
|
||
qrCodeData: '',
|
||
haibaoImg: '',
|
||
showImg: false,
|
||
haibaoShow: false,
|
||
title: '',
|
||
imgSrc: '',
|
||
current: 2,
|
||
maskCustomStyle: {
|
||
background: 'rgba(0, 0, 0, 0.5)'
|
||
},
|
||
show: false,
|
||
videoList: [],
|
||
videoContext: null, //记录当前视频的上下文
|
||
isVIP: false, //是否是vip
|
||
courseId: '',
|
||
meunList: [], //菜单
|
||
meunTop: 37, //返回图标距离顶部的距离
|
||
num: 1, //当前播放的集数
|
||
showPay: false, //购买视频的弹窗
|
||
info: {}, //整部的信息
|
||
courseDetailsId: '', //详情id
|
||
scrollIntoView: '', //当前播放视频的位置
|
||
scrollIntoViews: 'video0', //当前播放视频的位置
|
||
isVips: '否', //是否显示会员
|
||
zhengbu: '否',
|
||
danbu: '否',
|
||
rightTop: {
|
||
top: '0rpx'
|
||
},
|
||
showControls: true, //是否显示控制中心
|
||
zongPrice: 0, //整部价格
|
||
countPrice: 0, //单集价格
|
||
wallCurr: 0,
|
||
wallet: [],
|
||
productId: '', //默认苹果内购商品ID
|
||
productIds: ['sixzuan', 'shierzuan'], //苹果内购商品
|
||
openLists: [],
|
||
openWay: 1,
|
||
moneyTips: '',
|
||
checked: false, //是否同意协议
|
||
moneyNum: 0, //余额
|
||
payPrice: 0, //解锁价格
|
||
iosPayId: '',
|
||
isCollect: false,
|
||
wHeight: 0,
|
||
boxStyle: {
|
||
'height': 0,
|
||
'width': '750rpx',
|
||
},
|
||
isShowVideo: '',
|
||
noBuyVideoIndex: null,
|
||
playFlag: false,
|
||
getRedEnvelopeTips: '',
|
||
scale: 1,
|
||
// 防抖使用的变量
|
||
appearTimeout: null
|
||
};
|
||
},
|
||
onUnload() {
|
||
if (this.videoContext) {
|
||
this.videoContext.stop()
|
||
this.videoContext = null
|
||
}
|
||
},
|
||
onShow() {
|
||
// console.log('onSHow video');
|
||
//当应用从后台进入前台时自动播放
|
||
if (this.videoContext) {
|
||
this.videoContext.play()
|
||
}
|
||
const noBuyVideoIndex = uni.getStorageSync('noBuyVideoIndex')
|
||
if (noBuyVideoIndex !== null && noBuyVideoIndex !== undefined) {
|
||
this.noBuyVideoIndex = noBuyVideoIndex
|
||
}
|
||
this.isVips = uni.getStorageSync('isVips') ? uni.getStorageSync('isVips') : '否'
|
||
let that = this
|
||
uni.$on('back', (data) => {
|
||
if (data.flag == true) {
|
||
that.showPay = false
|
||
that.getDataList(that.courseId, that.courseDetailsId, true);
|
||
that.getMyLoveStatus()
|
||
that.getMoneyList()
|
||
that.getMyMoney()
|
||
}
|
||
})
|
||
this.moneyTips = uni.getStorageSync('moneyTips')
|
||
// #ifdef APP-PLUS
|
||
if (plus.os.name.toLowerCase() === 'android') {
|
||
this.openLists = [
|
||
// {
|
||
// image: '/static/images/pay/weixin.png',
|
||
// text: '微信',
|
||
// id: 2
|
||
// },
|
||
{
|
||
image: '/static/images/pay/zhifubao.png',
|
||
text: '支付宝',
|
||
id: 1
|
||
},
|
||
];
|
||
this.openWay = 1;
|
||
let syPaySel = uni.getStorageSync('syPaySel')
|
||
// if (syPaySel === '是') {
|
||
// let openListsItem = {
|
||
// image: '/static/images/pay/shouyi.png',
|
||
// text: '收益余额',
|
||
// id: 4
|
||
// };
|
||
// this.openLists.push(openListsItem)
|
||
// }
|
||
} else {
|
||
let checkIosPay = uni.getStorageSync('checkIosPay');
|
||
if (checkIosPay === '是') {
|
||
this.openLists = [{
|
||
image: '/static/images/pay/weixin.png',
|
||
text: '苹果',
|
||
id: 3
|
||
}];
|
||
this.openWay = 3;
|
||
} else {
|
||
this.openLists = [
|
||
// {
|
||
// image: '/static/images/pay/weixin.png',
|
||
// text: '微信',
|
||
// id: 2
|
||
// },
|
||
{
|
||
image: '/static/images/pay/zhifubao.png',
|
||
text: '支付宝',
|
||
id: 1
|
||
},
|
||
];
|
||
this.openWay = 1;
|
||
let syPaySel = uni.getStorageSync('syPaySel')
|
||
// if (syPaySel === '是') {
|
||
// let openListsItem = {
|
||
// image: '/static/images/pay/shouyi.png',
|
||
// text: '收益余额',
|
||
// id: 4
|
||
// };
|
||
// this.openLists.push(openListsItem)
|
||
// }
|
||
}
|
||
}
|
||
|
||
// #endif
|
||
this.$nextTick(() => {
|
||
this.closePopusPay()
|
||
})
|
||
if (this.courseId) {
|
||
|
||
this.getDataList(this.courseId, this.courseDetailsId);
|
||
}
|
||
httpsRequest.getT('app/course/getRedEnvelopeTips').then(res => {
|
||
if (res.code == 0) {
|
||
this.getRedEnvelopeTips = res.data
|
||
}
|
||
})
|
||
this.getScale()
|
||
},
|
||
onLoad(e) {
|
||
//是开启整部购买
|
||
this.zhengbu = uni.getStorageSync('zhengbu') ? uni.getStorageSync('zhengbu') : '否'
|
||
//是否开启单集购买
|
||
this.danbu = uni.getStorageSync('danbu') ? uni.getStorageSync('danbu') : '否'
|
||
let that = this
|
||
//获取设备的高度
|
||
uni.getSystemInfo({
|
||
success(res) {
|
||
//计算右侧操作拦的位置
|
||
that.rightTop.top = res.screenHeight - (440 / 2) + 'rpx'
|
||
},
|
||
fail() {
|
||
//如果获取屏幕的高度失败，那么位置默认设置为通用高度630rpx
|
||
that.rightTop.top = '630rpx'
|
||
}
|
||
})
|
||
const sysInfo = uni.getSystemInfoSync()
|
||
this.wHeight = sysInfo.screenHeight
|
||
this.boxStyle.height = this.wHeight + 5;
|
||
// 记录跳转过来的视频总id跟单集id
|
||
console.log(e)
|
||
if (e.id) {
|
||
this.courseId = e.id;
|
||
if (e.courseDetailsId && e.courseDetailsId != 'null') {
|
||
this.courseDetailsId = e.courseDetailsId
|
||
}
|
||
console.log(this.courseDetailsId)
|
||
this.getMyLoveStatus()
|
||
this.getMoneyList()
|
||
this.getMyMoney()
|
||
} else {
|
||
console.log("allId====="+e.allId)
|
||
if (e.allId) {
|
||
const arr = e.allId.split('-')
|
||
this.courseId = arr[0];
|
||
if (arr[1] && arr[1] != 'null') {
|
||
this.courseDetailsId = arr[1]
|
||
}
|
||
this.getMyLoveStatus()
|
||
this.getMoneyList()
|
||
this.getMyMoney()
|
||
}
|
||
}
|
||
|
||
if (document.documentElement.scrollHeight <= document.documentElement.clientHeight) {
|
||
bodyTag = document.getElementsByTagName('body')[0];
|
||
bodyTag.style.height = document.documentElement.clientWidth / screen.width * screen.height + 'px';
|
||
}
|
||
|
||
},
|
||
methods: {
|
||
/**
|
||
* 获取金币比例
|
||
*/
|
||
getScale() {
|
||
httpsRequest.getT("app/common/type/914", {}).then(res => {
|
||
if (res.code == 0) {
|
||
this.scale = Number(res.data.value)
|
||
}
|
||
});
|
||
},
|
||
//播放时的回掉
|
||
videoPlay(videoId, courseDetailsId) {
|
||
console.log(courseDetailsId)
|
||
// this.courseDetailsId = courseDetailsId
|
||
if (!this.playFlag) {
|
||
this.playFlag = true
|
||
httpsRequest.getT('app/course/viewCourse', {
|
||
courseId: this.courseId,
|
||
courseDetailsId: courseDetailsId,
|
||
type: 'start'
|
||
}).then(res => {
|
||
console.log('播放开始')
|
||
})
|
||
}
|
||
|
||
},
|
||
//播放进度变化回掉
|
||
timeupdate(e) {
|
||
// console.log(this.courseDetailsId)
|
||
if (e.detail.currentTime > e.detail.duration * 0.9) {
|
||
if (this.playFlag) {
|
||
this.playFlag = false
|
||
httpsRequest.getT('app/course/viewCourse', {
|
||
courseId: this.courseId,
|
||
courseDetailsId: this.courseDetailsId,
|
||
type: 'end'
|
||
}).then(res => {
|
||
console.log('播放结束')
|
||
})
|
||
}
|
||
}
|
||
|
||
},
|
||
appear(e, index) {
|
||
// 清除已经设置的定时器
|
||
clearTimeout(this.appearTimeout);
|
||
|
||
// 设置一个新的延迟执行的定时器
|
||
this.appearTimeout = setTimeout(() => {
|
||
// 实际要执行的操作
|
||
console.log('页面出现在视图中');
|
||
// 这里可以加入你需要执行的代码
|
||
console.log("appear==="+e)
|
||
console.log("appear==="+index)
|
||
// this.courseDetailsId = e
|
||
this.current = index
|
||
this.showControls = true
|
||
this.isShowVideo = e
|
||
this.scrollIntoViews = 'video' + index
|
||
this.scrollIntoView = 'video' + index
|
||
console.log(this.scrollIntoViews, '当前位置')
|
||
//播放并更新video的上下文
|
||
this.startPlay(index)
|
||
//插入历史记录
|
||
this.setHistor(this.videoList[index].courseId, this.videoList[index].courseDetailsId);
|
||
this.$forceUpdate()
|
||
}, 500); // 延迟500毫秒执行
|
||
|
||
},
|
||
disappear(e, index) {
|
||
|
||
// if (this.videoContext) { //判断之前是否有视频的上下文
|
||
// this.videoContext.stop();
|
||
// this.videoContext = null;
|
||
// }
|
||
// console.log("disappear==="+index)
|
||
// if (this.current > index) {
|
||
// index = index + 1
|
||
// } else {
|
||
// index = index - 1
|
||
// }
|
||
// let numIdCurr = this.videoList[index].courseDetailsId;
|
||
// if (this.videoList[index].videoUrl) { //已经购买可直接播放
|
||
// // 播放时记录当前播放的id
|
||
// this.appear(numIdCurr, index)
|
||
// this.videoContextId = 'myVideo' + numIdCurr;
|
||
// this.videoContext = uni.createVideoContext(this.videoContextId, this);
|
||
// console.log('走更新了')
|
||
|
||
// this.$nextTick(() => {
|
||
// //播放当前的
|
||
// this.videoContext.play();
|
||
// })
|
||
// }
|
||
// this.$forceUpdate();
|
||
},
|
||
//选集弹窗的回调
|
||
changeXj(e) {
|
||
if (e.show == false) {
|
||
//关闭弹窗的时候重置scrollIntoViews，防止关闭后第二次点就不能自动滑动到当前集的位置
|
||
this.scrollIntoViews = 'video0'
|
||
}
|
||
},
|
||
//充值成功后关闭弹窗，并购买播放
|
||
paySuccess() {
|
||
//获取一下最新余额
|
||
this.getMyMoney()
|
||
//购买视频
|
||
this.payOrder(this.ordersId, this.payMoney)
|
||
|
||
},
|
||
setPayment(name, order) {
|
||
console.log('*-*-*')
|
||
let that = this
|
||
uni.requestPayment({
|
||
provider: name,
|
||
orderInfo: order, //微信、支付宝订单数据
|
||
success: function(res) {
|
||
console.log(res)
|
||
uni.hideLoading();
|
||
uni.showLoading({
|
||
title: '支付成功'
|
||
});
|
||
//支付成功
|
||
that.paySuccess()
|
||
},
|
||
fail: function(err) {
|
||
uni.hideLoading();
|
||
uni.showToast({
|
||
title: '支付失败',
|
||
icon: 'none'
|
||
})
|
||
},
|
||
complete() {
|
||
uni.hideLoading();
|
||
}
|
||
});
|
||
},
|
||
isCheckPay(status, name, order) {
|
||
if (status == 0) {
|
||
this.setPayment(name, order);
|
||
} else {
|
||
uni.hideLoading();
|
||
uni.showToast({
|
||
title: '支付信息有误',
|
||
icon: 'none'
|
||
});
|
||
}
|
||
},
|
||
iphonepay() {
|
||
let that = this
|
||
plus.payment.getChannels((res) => {
|
||
let channel = res.find(i => i.id === 'appleiap')
|
||
that.iapChannel = channel ? channel : null
|
||
that.requestOrder()
|
||
})
|
||
},
|
||
requestOrder() {
|
||
let that = this
|
||
console.log(that.productIds)
|
||
// ['xxxxx'] 是平台申请拿到的内购商品的id
|
||
that.iapChannel.requestOrder(that.productIds, function(event) {
|
||
uni.hideLoading()
|
||
console.log(event)
|
||
}, function(erroemsg) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: "获取支付通道失败：" + errormsg.message,
|
||
icon: 'none'
|
||
})
|
||
})
|
||
},
|
||
async topay() {
|
||
let that = this
|
||
uni.showLoading({
|
||
title: '充值中，请勿离开！',
|
||
mask: true
|
||
})
|
||
let productId = that.wallet[that.wallCurr].productId ? that.wallet[that.wallCurr].productId : '';
|
||
plus.payment.request(that.iapChannel, {
|
||
productid: productId,
|
||
optimize: true // 支付时设置 optimize: true
|
||
}, result => {
|
||
that.getIosSaveMessage(JSON.stringify(result));
|
||
// 支付成功回调
|
||
// console.log("plus.payment.request-success--------------------",JSON.stringify(results));
|
||
uni.showLoading({
|
||
title: '查询结果中，请勿离开！',
|
||
mask: true
|
||
})
|
||
|
||
}, e => {
|
||
uni.hideLoading();
|
||
uni.showToast({
|
||
title: '支付失败',
|
||
icon: 'none'
|
||
})
|
||
});
|
||
},
|
||
|
||
async getIosSaveMessage(receipt) {
|
||
let that = this;
|
||
httpsRequest.postT('/app/ios/isoPayApp?receipt=' + receipt + '&ordersId=' + that.iosPayId).then(
|
||
res => {
|
||
uni.hideLoading();
|
||
if (res.status == 0) {
|
||
uni.showToast({
|
||
title: '支付成功',
|
||
duration: 2000,
|
||
})
|
||
//支付成功
|
||
that.paySuccess()
|
||
}
|
||
});
|
||
},
|
||
// 充值
|
||
pay() {
|
||
if (this.checked == false) {
|
||
uni.showToast({
|
||
title: '请阅读并同意《付费须知说明》',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
let that = this
|
||
uni.showLoading({
|
||
title: '支付中...'
|
||
})
|
||
if (this.openWay == 2) {
|
||
// 微信APP支付 根据订单id获取支付信息
|
||
httpsRequest.postT("/app/wxPay/payMoney", {
|
||
classify: 1,
|
||
payClassifyId: this.wallet[this.wallCurr].payClassifyId,
|
||
}).then(ret => {
|
||
this.isCheckPay(ret.code, 'wxpay', JSON.stringify(ret.data));
|
||
})
|
||
} else if (this.openWay == 1) {
|
||
let paytype = 'h5'
|
||
// #ifdef APP
|
||
paytype = 'app'
|
||
// #endif
|
||
// APP支付宝支付
|
||
console.log('nvue payType=' + paytype);
|
||
httpsRequest.getT("/app/wuyou/payOrder/" + this.ordersId + '?payType=' + paytype, {}).then(ret => {
|
||
// plus.runtime.openURL(ret.data.h5Url)
|
||
|
||
uni.navigateTo({
|
||
url: '/pages/pays/pays?ordersId=' + this.ordersId + '&url=' + ret.data.h5Url
|
||
});
|
||
|
||
// uni.navigateTo({
|
||
// url: '/pages/index/webView?ordersId='+this.ordersId+'url=' + ret.data.h5Url
|
||
// });
|
||
|
||
// this.isCheckPay(ret.code, 'wxpay', JSON.stringify(ret.data));
|
||
});
|
||
} else if (this.openWay == 3) {
|
||
let userId = uni.getStorageSync('userId');
|
||
let data = {
|
||
payClassifyId: this.wallet[this.wallCurr].payClassifyId,
|
||
userId: userId
|
||
}
|
||
httpsRequest.postT("/app/ios/insertPayMoneyOrders", data).then(res => {
|
||
if (res.code === 0) {
|
||
this.iosPayId = res.data.orderId;
|
||
this.iphonepay();
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '支付失败!'
|
||
});
|
||
}
|
||
});
|
||
} else if (this.openWay == 4) {
|
||
let userId = uni.getStorageSync('userId');
|
||
let data = {
|
||
// money: this.wallet[this.current].price
|
||
payClassifyId: this.wallet[this.wallCurr].payClassifyId,
|
||
userId: userId
|
||
}
|
||
httpsRequest.postT("/app/invite/inviteMoneyConvertUserMoney", data).then(res => {
|
||
if (res.code === 0) {
|
||
uni.hideLoading();
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '支付成功'
|
||
})
|
||
//支付成功
|
||
that.paySuccess()
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: res.msg
|
||
});
|
||
}
|
||
});
|
||
}
|
||
|
||
},
|
||
//获取余额
|
||
getMyMoney() {
|
||
if (uni.getStorageSync('getMyMoney')) {
|
||
httpsRequest.getT('/app/moneyDetails/selectUserMoney').then(res => {
|
||
if (res.code == 0) {
|
||
this.moneyNum = res.data.money
|
||
}
|
||
})
|
||
}
|
||
|
||
},
|
||
goWallet(url) {
|
||
uni.navigateTo({
|
||
url: url
|
||
})
|
||
},
|
||
//选择支付类型
|
||
selectWay(item) {
|
||
this.openWay = item.id;
|
||
},
|
||
findMinMaxPricesWithIndexes(array) {
|
||
// 初始化最小和最大价格为无穷大和小于无穷大的值
|
||
// 同时初始化对应的索引为-1，表示还未找到
|
||
let minPrice = Infinity;
|
||
let maxPrice = -Infinity;
|
||
let minPriceIndex = -1;
|
||
let maxPriceIndex = -1;
|
||
|
||
// 遍历数组中的每个元素
|
||
for (let i = 0; i < array.length; i++) {
|
||
const currentPrice = array[i].price;
|
||
|
||
// 检查当前价格是否比已知的最小价格更小
|
||
if (currentPrice < minPrice) {
|
||
minPrice = currentPrice;
|
||
minPriceIndex = i;
|
||
}
|
||
|
||
// 检查当前价格是否比已知的最大价格更大
|
||
if (currentPrice > maxPrice) {
|
||
maxPrice = currentPrice;
|
||
maxPriceIndex = i;
|
||
}
|
||
}
|
||
|
||
// 返回一个包含最小和最大价格及其索引的对象
|
||
return {
|
||
minPrice: minPrice,
|
||
minPriceIndex: minPriceIndex,
|
||
maxPrice: maxPrice,
|
||
maxPriceIndex: maxPriceIndex
|
||
};
|
||
},
|
||
/**
|
||
* 获取充值列表
|
||
*/
|
||
getMoneyList() {
|
||
httpsRequest.getT('/app/payClassify/selectPayClassifyList').then(res => {
|
||
if (res.code == 0) {
|
||
let priceObj = this.findMinMaxPricesWithIndexes(res.data)
|
||
this.wallet = res.data
|
||
this.wallet[priceObj.minPriceIndex].remarks = '特惠'
|
||
this.wallet[priceObj.maxPriceIndex].remarks = '80%用户选择'
|
||
this.productIds = [];
|
||
res.data.forEach(d => {
|
||
this.productIds.push(d.productId);
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
}
|
||
})
|
||
},
|
||
//关闭支付弹窗
|
||
closePopusPay() {
|
||
this.$refs.popuppay.close()
|
||
},
|
||
//打开支付弹窗
|
||
openPopusPay() {
|
||
this.$refs.popuppay.open('bottom')
|
||
return
|
||
// 通过 id 获取 nvue 子窗体
|
||
// const subNVue = uni.getSubNVueById('pay')
|
||
// subNVue.setStyle({
|
||
// height: '350rpx',
|
||
// })
|
||
// // 打开 nvue 子窗体
|
||
// subNVue.show('slide-in-bottom', 300, function() {
|
||
// // 打开后进行一些操作...
|
||
// //
|
||
// console.log('subnvue open')
|
||
// });
|
||
// 关闭 nvue 子窗体
|
||
// subNVue.hide('fade-out', 300)
|
||
|
||
// this.$refs.refPopupZhuanPan.open('bottom')
|
||
},
|
||
// 获取收藏状态
|
||
getMyLoveStatus() {
|
||
let data = {
|
||
id: this.courseId,
|
||
token: uni.getStorageSync('token')
|
||
}
|
||
httpsRequest.getT('/app/course/selectCourseDetailsById', data).then(res => {
|
||
if (res.code == 0) {
|
||
if (res.data && res.data.isCollect && res.data.isCollect > 0) {
|
||
this.isCollect = true
|
||
} else {
|
||
this.isCollect = false
|
||
}
|
||
}
|
||
})
|
||
},
|
||
//显示/隐藏适配控制器的回调
|
||
controlstoggles(e) {
|
||
this.showControls = e.detail.show
|
||
this.showBack = this.showControls
|
||
// console.log(e.detail.show, '显示/隐藏控制栏')
|
||
},
|
||
//打开倍速弹框
|
||
openBs() {
|
||
this.$refs.popupBs.open('bottom')
|
||
},
|
||
//切换倍速
|
||
BsChange(index) {
|
||
this.nowBs = index
|
||
this.videoContext.playbackRate(this.subList[index].num)
|
||
this.$refs.popupBs.close()
|
||
uni.showToast({
|
||
title: '已切换' + this.subList[index].num + '倍播放',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
},
|
||
//分享-复制app下载连接
|
||
share() {
|
||
let invitationCode = ''
|
||
let qdCode = ''
|
||
if (uni.getStorageSync('invitationCode')) {
|
||
invitationCode = uni.getStorageSync('invitationCode')
|
||
}
|
||
if (uni.getStorageSync('qdCode')) {
|
||
qdCode = uni.getStorageSync('qdCode')
|
||
}
|
||
let url = config.APIHOST2 + '/pages/login/registerApp?invitation=' + invitationCode + '&qdCode=' + qdCode
|
||
// this.setShareNum()
|
||
uni.setClipboardData({
|
||
data: url,
|
||
success(res) {
|
||
uni.showToast({
|
||
title: '已复制链接'
|
||
})
|
||
}
|
||
})
|
||
},
|
||
//去开通会员
|
||
goNav(url) {
|
||
if (uni.getStorageSync('token')) {
|
||
uni.navigateTo({
|
||
url: url
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: '/pages/login/login'
|
||
})
|
||
}
|
||
|
||
},
|
||
/**
|
||
* @param {Object} type 类型
|
||
* 1:购买整部视频
|
||
* 2:购买单集视频
|
||
*/
|
||
payVideo(type) {
|
||
if (uni.getStorageSync('token')) {
|
||
this.submitPay(type)
|
||
} else {
|
||
uni.navigateTo({
|
||
url: "/pages/login/login"
|
||
})
|
||
}
|
||
},
|
||
//使用金币购买
|
||
submitPay(type) {
|
||
let data = {
|
||
courseId: this.courseId
|
||
}
|
||
|
||
data.courseDetailsId = this.videoList[this.current].courseDetailsId
|
||
httpsRequest.getT('/app/order/insertCourseOrders', data).then(res => {
|
||
if (res.code == 0) {
|
||
this.ordersId = res.data.orders.ordersId //记录订单id
|
||
this.payMoney = res.data.orders.payMoney //记录订单价格
|
||
|
||
if (type == 1) { //金币
|
||
this.payOrder(res.data.orders.ordersId, res.data.orders.payMoney)
|
||
} else if (type == 2) { //支付宝
|
||
this.closePay() //关闭购买选择弹窗
|
||
this.payPrice = res.data.orders.payMoney //需要支付的价格
|
||
this.openPopusPay() //显示充值弹窗
|
||
}
|
||
|
||
// this.payOrder(res.data.orders.ordersId, res.data.orders.payMoney)
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
}
|
||
})
|
||
},
|
||
payOrder(orderId, payMoney) {
|
||
let that = this
|
||
console.log("orderId==" + orderId)
|
||
httpsRequest.postT("/app/order/payOrders", {
|
||
orderId: orderId,
|
||
}).then(res => {
|
||
if (res.code == 0) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: '已成功解锁',
|
||
icon: 'none'
|
||
})
|
||
this.closePopusPay()
|
||
this.closePay()
|
||
that.showPay = false
|
||
that.showMoney = false
|
||
that.noBuyVideoIndex = null
|
||
setTimeout(() => {
|
||
that.getDataList(that.courseId, that.videoList[that.current].courseDetailsId,
|
||
true);
|
||
}, 1000)
|
||
|
||
} else { //支付失败（余额不足）
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
that.showPay = true
|
||
that.showMoney = false
|
||
// that.closePay() //关闭购买选择弹窗
|
||
// this.payPrice = payMoney //需要支付的价格
|
||
// this.openPopusPay() //显示充值弹窗
|
||
}
|
||
});
|
||
},
|
||
//打开购买弹窗
|
||
openPay() {
|
||
|
||
this.zongPrice = this.info.price
|
||
this.countPrice = this.videoList[this.current].price
|
||
this.$refs.popupPya.open('bottom')
|
||
this.noBuyVideoIndex = this.current
|
||
uni.setStorageSync('noBuyVideoIndex', this.current)
|
||
},
|
||
//关闭购买弹窗
|
||
closePay() {
|
||
this.$refs.popupPya.close()
|
||
},
|
||
//选择播放
|
||
selectPlay(item,type) {
|
||
if ( this.videoList[this.current].videoUrl == '' && this.videoList[this.current].price <= 0 && !type ) {
|
||
this.getDataList(this.courseId, this.courseDetailsId, true, 'select')
|
||
return;
|
||
}
|
||
//重新计算一下当前观看的是哪个视频
|
||
this.comNumVideo()
|
||
//滚动到选择的位置
|
||
this.goListPosition(item.courseDetailsId)
|
||
//关闭选择弹窗
|
||
this.closeList()
|
||
|
||
},
|
||
//选集
|
||
openShow() {
|
||
this.scrollIntoViews = 'video0'
|
||
this.comNumVideo()
|
||
this.openList()
|
||
this.$nextTick(() => {
|
||
this.scrollIntoViews = this.scrollIntoView
|
||
})
|
||
|
||
},
|
||
//打开选集弹窗
|
||
openList() {
|
||
this.$refs.popup.open('bottom')
|
||
},
|
||
//关闭选集弹窗
|
||
closeList() {
|
||
this.$refs.popup.close()
|
||
},
|
||
//收藏
|
||
shoucang() {
|
||
if (uni.getStorageSync('token')) {
|
||
let data = {
|
||
courseId: this.courseId,
|
||
classify: 1,
|
||
type: this.isCollect == false ? 1 : 0
|
||
}
|
||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {
|
||
if (res.code == 0) {
|
||
this.getMyLoveStatus()
|
||
}
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: "/pages/login/login"
|
||
})
|
||
}
|
||
|
||
},
|
||
//点赞
|
||
dianzan(item) {
|
||
if (uni.getStorageSync('token')) {
|
||
let data = {
|
||
courseId: item.courseId,
|
||
courseDetailsId: item.courseDetailsId,
|
||
classify: 2,
|
||
type: item.isGood == 0 ? 1 : 0
|
||
};
|
||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {
|
||
if (res.code == 0) {
|
||
if (data.type == 1) {
|
||
item.isGood = 1;
|
||
item.goodNum += 1;
|
||
} else {
|
||
item.isGood = 0;
|
||
item.goodNum -= 1;
|
||
}
|
||
}
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: "/pages/login/login"
|
||
})
|
||
}
|
||
|
||
},
|
||
//播放结束后播放下一集
|
||
ended() {
|
||
if (this.current < this.videoList.length - 1) {
|
||
// this.current += 1
|
||
this.$nextTick(() => {
|
||
let courseDetailsId = this.videoList[this.current + 1].courseDetailsId
|
||
console.log(courseDetailsId, '开始移动了')
|
||
const el = this.$refs['list' + courseDetailsId][0]
|
||
listDom.scrollToElement(el, {})
|
||
this.$forceUpdate()
|
||
console.log(el, '移动结束')
|
||
})
|
||
}
|
||
},
|
||
//控制播放
|
||
startPlay(current) {
|
||
if (this.videoContext) { //判断之前是否有视频的上下文
|
||
this.videoContext.stop();
|
||
this.videoContext = null;
|
||
}
|
||
let numIdCurr = this.videoList[current].courseDetailsId;
|
||
if (this.videoList[current].videoUrl) { //已经购买可直接播放
|
||
// 播放时记录当前播放的id
|
||
this.videoContextId = 'myVideo' + numIdCurr;
|
||
this.videoContext = uni.createVideoContext(this.videoContextId, this);
|
||
console.log('走更新了')
|
||
this.$nextTick(() => {
|
||
//播放当前的
|
||
this.videoContext.play();
|
||
this.videoContext.playbackRate(this.subList[this.nowBs].num)
|
||
})
|
||
} else { //没有视频链接则表示没有权限，需要购买 弹出购买弹窗
|
||
this.openPay()
|
||
}
|
||
this.$forceUpdate();
|
||
},
|
||
//返回
|
||
goBack() {
|
||
uni.navigateBack();
|
||
},
|
||
//滚动到指定位置
|
||
goListPosition(courseDetailsId) {
|
||
let _this = this;
|
||
// this.scrollIntoViews = 'video0'
|
||
this.$nextTick(() => {
|
||
// setTimeout(()=>{
|
||
console.log(courseDetailsId, '开始移动了')
|
||
const el = _this.$refs['list' + courseDetailsId][0]
|
||
listDom.scrollToElement(el, {
|
||
animated: false
|
||
})
|
||
_this.$forceUpdate()
|
||
console.log('移动结束', el)
|
||
// },1000)
|
||
})
|
||
},
|
||
async getCount() {
|
||
console.log('getCount')
|
||
const res = await this.$Request.getT('app/discSpinning/drawCount')
|
||
if (res.code == 0) {
|
||
this.freeNum = res.count || 0
|
||
}
|
||
console.log(res);
|
||
return res
|
||
},
|
||
/**
|
||
* @param {Number} courseId 总id
|
||
* @param {Number} courseDetailsId 当前视频id
|
||
* @param {boolean} type 是购买后返回的还是直接进来的
|
||
*/
|
||
getDataList(courseId, courseDetailsId, type, t) {
|
||
let data = {
|
||
id: courseId,
|
||
token: uni.getStorageSync('token') ? uni.getStorageSync('token') : ''
|
||
};
|
||
httpsRequest.getT('/app/course/selectCourseDetailsById', data).then(res => {
|
||
if (res.code == 0) {
|
||
if (res.data.listsDetail) {
|
||
this.info = res.data;
|
||
this.title = this.info.title;
|
||
let arr = JSON.parse(JSON.stringify(res.data.listsDetail));
|
||
const indexs = arr.findIndex(menu => menu.courseDetailsId ===
|
||
Number(courseDetailsId));
|
||
this.current = indexs
|
||
this.scrollIntoViews = 'video' + indexs
|
||
this.scrollIntoView = 'video' + indexs
|
||
console.log(this.current)
|
||
// this.scrollIntoView = 'video' + indexs
|
||
arr.map((item, index) => {
|
||
item.num = index + 1;
|
||
if (item.videoUrl) {
|
||
item.autoPlay = true;
|
||
} else {
|
||
item.autoPlay = false;
|
||
}
|
||
item.viewInfo = 'video' + index;
|
||
});
|
||
//菜单数组
|
||
this.meunList = arr;
|
||
if (type == true) { //购买视频后返回的
|
||
console.log('购买视频后返回的')
|
||
let courseDetailsIds = this.videoList[this.current].courseDetailsId;
|
||
this.meunList.some((item) => {
|
||
if (item.courseDetailsId == courseDetailsIds) {
|
||
this.videoList[this.current].videoUrl = item.videoUrl;
|
||
return true;
|
||
}
|
||
})
|
||
this.videoList.map(item => {
|
||
this.meunList.map(ite => {
|
||
if (item.courseDetailsId == ite.courseDetailsId && item
|
||
.courseDetailsId != courseDetailsId) {
|
||
item.videoUrl = ite.videoUrl
|
||
}
|
||
})
|
||
})
|
||
|
||
if (this.noBuyVideoIndex !== null && this.videoList[this
|
||
.noBuyVideoIndex].videoUrl) {
|
||
this.noBuyVideoIndex = null
|
||
uni.removeStorageSync('noBuyVideoIndex')
|
||
this.videoContext.stop()
|
||
httpsRequest.getT('app/discSpinning/drawCount').then(res => {
|
||
console.log('转盘抽奖次数')
|
||
console.log(res)
|
||
if (res.count >= 1) {
|
||
uni.navigateTo({
|
||
url: '/me/choujiang/choujiang'
|
||
})
|
||
} else {
|
||
this.videoContext.play();
|
||
}
|
||
})
|
||
}
|
||
// console.log('this.noBuyVideoIndex', this.noBuyVideoIndex)
|
||
|
||
} else { //直接跳转进来的
|
||
this.videoList = this.meunList
|
||
this.$nextTick(() => {
|
||
let indexss = indexs > 0 ? indexs : 0
|
||
//滚动到记录视频的位置(如果有记录)
|
||
if (indexs > 0) {
|
||
console.log(indexs, '有记录吗？')
|
||
this.goListPosition(this.videoList[indexs].courseDetailsId)
|
||
}
|
||
// console.log('this.noBuyVideoIndex', this.noBuyVideoIndex)
|
||
|
||
if (this.videoList[indexss].videoUrl) { //有播放权限
|
||
console.log('有播放权限进入是否抽取转盘判断')
|
||
let numIdCurr = this.videoList[indexss].courseDetailsId;
|
||
this.videoContextId = 'myVideo' + numIdCurr;
|
||
this.videoContext = uni.createVideoContext(this
|
||
.videoContextId,
|
||
this);
|
||
if (this.noBuyVideoIndex != null && this.videoList[this
|
||
.noBuyVideoIndex].videoUrl) {
|
||
this.videoContext.stop();
|
||
httpsRequest.getT('app/discSpinning/drawCount').then(res => {
|
||
console.log('转盘抽奖次数')
|
||
if (res.count >= 1) {
|
||
uni.navigateTo({
|
||
url: '/me/choujiang/choujiang'
|
||
})
|
||
} else {
|
||
this.videoContext.play();
|
||
}
|
||
})
|
||
uni.removeStorageSync('noBuyVideoIndex')
|
||
this.noBuyVideoIndex = null
|
||
} else {
|
||
this.videoContext.play();
|
||
}
|
||
} else { //没有播放权限打开购买弹窗
|
||
this.openPay()
|
||
}
|
||
this.$forceUpdate();
|
||
})
|
||
}
|
||
if ( t == 'select') {
|
||
this.selectPlay(this.videoList[this.current],true)
|
||
}
|
||
this.$forceUpdate();
|
||
}
|
||
|
||
} else {
|
||
uni.showToast({
|
||
title: '加载失败',
|
||
icon: 'none'
|
||
})
|
||
setTimeout(() => {
|
||
uni.navigateBack();
|
||
}, 1000)
|
||
}
|
||
})
|
||
},
|
||
//计算正在观看哪个视频
|
||
comNumVideo() {
|
||
let courseDetailsId = this.videoList[this.current].courseDetailsId;
|
||
this.meunList.map((item, index) => {
|
||
if (item.courseDetailsId == courseDetailsId) { //找到了
|
||
this.num = item.num;
|
||
}
|
||
})
|
||
},
|
||
//插入观看记录
|
||
setHistor(courseId, courseDetailsId) {
|
||
if (uni.getStorageSync('token')) {
|
||
let data = {
|
||
courseId: courseId,
|
||
courseDetailsId: courseDetailsId,
|
||
classify: 3,
|
||
type: 1
|
||
};
|
||
console.log(data, '记录了')
|
||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {})
|
||
}
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.popupTjVideo-contont {
|
||
width: 600rpx;
|
||
background-image: linear-gradient(to bottom right, #FCDDDC, #ffffff);
|
||
border-radius: 50rpx;
|
||
padding: 40rpx 0;
|
||
}
|
||
|
||
.popupTjVideo-contont-title {
|
||
width: 600rpx;
|
||
text-align: center;
|
||
color: #682515;
|
||
font-size: 38rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.popupTjVideo-contont-txt {
|
||
width: 600rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.popupTjVideo-contont-text {
|
||
font-size: 28rpx;
|
||
color: #BB5E4E;
|
||
}
|
||
|
||
.popupTjVideo-contont-texts {
|
||
font-size: 28rpx;
|
||
color: #FF034E;
|
||
}
|
||
|
||
.popupTjVideo-contont-titles {
|
||
color: #161616;
|
||
font-size: 28rpx;
|
||
font-weight: bold;
|
||
margin-left: 30rpx;
|
||
margin-top: 40rpx;
|
||
}
|
||
|
||
.popupTjVideo-contont-list {
|
||
width: 540rpx;
|
||
margin: 20rpx 30rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.popupTjVideo-contont-list-item {
|
||
width: 168rpx;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.popupTjVideo-contont-list-item-img {
|
||
width: 168rpx;
|
||
height: 212rpx;
|
||
border-radius: 16rpx;
|
||
}
|
||
|
||
.popupTjVideo-contont-list-item-title {
|
||
width: 168rpx;
|
||
color: #333333;
|
||
font-size: 22rpx;
|
||
font-weight: 500;
|
||
margin-top: 4rpx;
|
||
|
||
}
|
||
|
||
.popupTjVideo-contont-btn {
|
||
width: 540rpx;
|
||
height: 70rpx;
|
||
margin: 0 30rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.popupTjVideo-contont-btn-l {
|
||
width: 250rpx;
|
||
height: 70rpx;
|
||
border-radius: 35rpx;
|
||
background-color: #FFD1DF;
|
||
color: #FF054D;
|
||
font-size: 24rpx;
|
||
margin-left: 10rpx;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
line-height: 70rpx;
|
||
}
|
||
|
||
.popupTjVideo-contont-btn-r {
|
||
width: 250rpx;
|
||
height: 70rpx;
|
||
border-radius: 35rpx;
|
||
background-image: linear-gradient(to bottom, #FF024E, #FF5133);
|
||
color: #ffffff;
|
||
font-size: 24rpx;
|
||
margin-left: 10rpx;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
line-height: 70rpx;
|
||
}
|
||
|
||
.popupTjVideo-close {
|
||
width: 600rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-top: 30rpx;
|
||
}
|
||
|
||
.popupTjVideo-close-img {
|
||
width: 52rpx;
|
||
height: 52rpx;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
.popuppay {
|
||
width: 750rpx;
|
||
background-color: #ffffff;
|
||
border-radius: 32rpx 32rpx 0 0;
|
||
padding: 30rpx;
|
||
}
|
||
|
||
.popuppay-title {
|
||
width: 690rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.popuppay-title-l {
|
||
color: #333333;
|
||
font-size: 32rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.popuppay-title-r {
|
||
width: 26rpx;
|
||
height: 26rpx;
|
||
}
|
||
|
||
.popuppay-money {
|
||
width: 690rpx;
|
||
margin-top: 30rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.popuppay-money-l {
|
||
flex-direction: row;
|
||
align-items: center;
|
||
}
|
||
|
||
.popuppay-money-r {
|
||
flex-direction: row;
|
||
align-items: center;
|
||
}
|
||
|
||
.popuppay-money-l-ye {
|
||
color: #353535;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.popuppay-money-l-jd {
|
||
color: #353535;
|
||
font-size: 26rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.popuppay-money-l-mx {
|
||
font-size: 26rpx;
|
||
color: #FF1930;
|
||
margin-left: 10rpx;
|
||
}
|
||
|
||
.popuppay-money {
|
||
flex-direction: row;
|
||
align-items: center;
|
||
}
|
||
|
||
.popuppay-money-ye {
|
||
color: #353535;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.popuppay-money-jd {
|
||
color: #ff7581;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.payLists {
|
||
width: 690rpx;
|
||
height: 400rpx;
|
||
/* padding-top: 30rpx; */
|
||
margin-top: 30rpx;
|
||
}
|
||
|
||
.popuppay-payList {
|
||
width: 690rpx;
|
||
flex-direction: row;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
padding: 30rpx 0;
|
||
|
||
|
||
}
|
||
|
||
.payList-item {
|
||
width: 330rpx;
|
||
height: 194rpx;
|
||
background: #F5F7FF;
|
||
border-radius: 24rpx;
|
||
margin-bottom: 20rpx;
|
||
position: relative;
|
||
justify-content: center;
|
||
}
|
||
|
||
.payList-item-price {
|
||
width: 330rpx;
|
||
}
|
||
|
||
.payList-item-prices {
|
||
text-align: center;
|
||
color: #191919;
|
||
font-size: 40rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.payList-item-dou {
|
||
width: 330rpx;
|
||
}
|
||
|
||
.payList-item-dous {
|
||
text-align: center;
|
||
color: #666666;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.payList-item-duo {
|
||
width: 330rpx;
|
||
}
|
||
|
||
.payList-item-duos {
|
||
text-align: center;
|
||
color: #FF1930;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.payList-item-hui {
|
||
position: absolute;
|
||
top: 0rpx;
|
||
left: 0;
|
||
background-color: #F6495A;
|
||
border-radius: 16rpx 16rpx 16rpx 0rpx;
|
||
padding: 4rpx 10rpx;
|
||
}
|
||
|
||
.payList-item-huis {
|
||
color: #ffffff;
|
||
font-size: 20rpx;
|
||
}
|
||
|
||
.activePrice {
|
||
background: #F7D98D !important;
|
||
|
||
}
|
||
|
||
.activePrice .payList-item-price .payList-item-dou {
|
||
color: #744A0A !important;
|
||
}
|
||
|
||
.payType {
|
||
width: 690rpx;
|
||
|
||
}
|
||
|
||
.payType-item {
|
||
width: 690rpx;
|
||
margin-top: 30rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.payType-item-l {
|
||
flex-direction: row;
|
||
align-items: center;
|
||
}
|
||
|
||
.payType-item-l-icon {
|
||
width: 56rpx;
|
||
height: 56rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.payType-item-l-txt {
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.tips {
|
||
width: 690rpx;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.tips-title {
|
||
width: 690rpx;
|
||
}
|
||
|
||
.tips-titles {
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.tips-contont {
|
||
width: 686rpx;
|
||
}
|
||
|
||
.tips-contonts {
|
||
font-size: 26rpx;
|
||
color: gray;
|
||
margin-top: 10rpx;
|
||
}
|
||
|
||
.illustrate {
|
||
width: 690rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.illustrate-txt {
|
||
color: #303133;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.illustrate-txts {
|
||
color: #ff7581;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.popuppay-btn {
|
||
width: 690rpx;
|
||
height: 98rpx;
|
||
border-radius: 50rpx;
|
||
background-color: #ff7581;
|
||
margin-top: 20rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.popuppay-btn-txt {
|
||
color: #ffffff;
|
||
font-size: 32rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
.bs {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 20rpx;
|
||
|
||
}
|
||
|
||
.bs-title {
|
||
font-size: 24rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.bs-se {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
background-color: #eeeeef;
|
||
padding: 10rpx 20rpx;
|
||
border-radius: 10rpx;
|
||
}
|
||
|
||
.bs-se-it {
|
||
font-size: 24rpx;
|
||
width: 100rpx;
|
||
padding: 16rpx 0;
|
||
text-align: center;
|
||
}
|
||
|
||
.bsActive {
|
||
background-color: #ffffff;
|
||
border-radius: 6rpx;
|
||
}
|
||
|
||
.detail {
|
||
width: 750rpx;
|
||
flex: 1;
|
||
background-color: #000;
|
||
}
|
||
|
||
.swipers {
|
||
width: 750rpx;
|
||
flex: 1;
|
||
}
|
||
|
||
.swipers-item {
|
||
width: 750rpx;
|
||
flex: 1;
|
||
}
|
||
|
||
.swipers-items {
|
||
width: 750rpx;
|
||
flex: 1;
|
||
position: relative;
|
||
background-color: #000;
|
||
}
|
||
|
||
.swipers-items-video {
|
||
width: 750rpx;
|
||
flex: 1;
|
||
}
|
||
|
||
.swipers-items-imgsbg {
|
||
width: 750rpx;
|
||
flex: 1;
|
||
}
|
||
|
||
.swipers-items-back {
|
||
position: absolute;
|
||
left: 40rpx;
|
||
top: 120rpx;
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
z-index: 999;
|
||
}
|
||
|
||
.swipers-items-right {
|
||
position: absolute;
|
||
width: 60rpx;
|
||
top: 100rpx;
|
||
right: 20rpx;
|
||
}
|
||
|
||
.swipers-items-right-item {
|
||
width: 60rpx;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
.swipers-items-right-item-img {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
}
|
||
|
||
.swipers-items-right-item-imgs {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
}
|
||
|
||
.swipers-items-right-item-txt {
|
||
width: 60rpx;
|
||
}
|
||
|
||
.swipers-items-right-item-txts {
|
||
width: 60rpx;
|
||
color: #ffffff;
|
||
font-size: 24rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.swipers-items-btom {
|
||
width: 750rpx;
|
||
let: 0;
|
||
position: absolute;
|
||
bottom: 100rpx;
|
||
align-items: center;
|
||
/* transition-duration: 1s, */
|
||
}
|
||
|
||
.swipers-items-btom-box {
|
||
width: 710rpx;
|
||
}
|
||
|
||
.swipers-items-btom-box-title {
|
||
width: 710rpx;
|
||
}
|
||
|
||
.swipers-items-btom-box-titles {
|
||
width: 710rpx;
|
||
color: #ffffff;
|
||
font-size: 30rpx;
|
||
}
|
||
|
||
.swipers-items-btom-box-content {
|
||
width: 710rpx;
|
||
margin-top: 10rpx;
|
||
}
|
||
|
||
.swipers-items-btom-box-contents {
|
||
width: 710rpx;
|
||
color: #ffffff;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.swipers-items-btom-box-num {
|
||
width: 710rpx;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.swipers-items-btom-box-nums {
|
||
color: #ffffff;
|
||
font-size: 30rpx;
|
||
}
|
||
|
||
/* 选集弹窗 */
|
||
.list {
|
||
width: 750rpx;
|
||
align-items: center;
|
||
border-radius: 32rpx 32rpx 0 0;
|
||
background-color: #ffffff;
|
||
/* background-color: #202020; */
|
||
}
|
||
|
||
.list-title {
|
||
width: 710rpx;
|
||
margin-top: 30rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.list-title-l {
|
||
flex-direction: row;
|
||
align-items: center;
|
||
}
|
||
|
||
.list-title-lIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
|
||
.list-title-ls {
|
||
color: #333333;
|
||
font-size: 32rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.list-title-lsn {
|
||
color: #999999;
|
||
font-size: 24rpx;
|
||
margin-left: 20rpx;
|
||
}
|
||
|
||
.list-title-r {
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
}
|
||
|
||
.list-title-rs {
|
||
width: 26rpx;
|
||
height: 26rpx;
|
||
}
|
||
|
||
.list-content {
|
||
width: 710rpx;
|
||
height: 600rpx;
|
||
margin-bottom: 40rpx;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.list-contents {
|
||
width: 710rpx;
|
||
height: 600rpx;
|
||
}
|
||
|
||
.list-contentss {
|
||
width: 710rpx;
|
||
flex-direction: row;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.list-content-item {
|
||
width: 205rpx;
|
||
height: 88rpx;
|
||
margin-bottom: 20rpx;
|
||
flex-direction: row;
|
||
justify-content: center;
|
||
align-items: center;
|
||
background-color: #F5F7FF;
|
||
border-radius: 12rpx;
|
||
position: relative;
|
||
}
|
||
|
||
.list-content-items {
|
||
color: #333333;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.list-box-item-playing {
|
||
position: absolute;
|
||
width: 32rpx;
|
||
height: 24rpx;
|
||
bottom: 10rpx;
|
||
right: 15rpx;
|
||
}
|
||
|
||
.videoListCurr {
|
||
background-color: #ff7581 !important;
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.videoListCurr>.list-content-items {
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.list-box-item-lock {
|
||
width: 38rpx;
|
||
height: 34rpx;
|
||
border-radius: 0rpx 12rpx 0rpx 12rpx;
|
||
background-color: #CCCCCC;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
flex-direction: row;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
.list-box-item-lockI {
|
||
width: 18rpx;
|
||
height: 22rpx;
|
||
}
|
||
|
||
|
||
|
||
.pay {
|
||
width: 750rpx;
|
||
align-items: center;
|
||
border-radius: 32rpx 32rpx 0 0;
|
||
/* background-color: red; */
|
||
background-color: #ffffff;
|
||
}
|
||
|
||
.list-title-lss {
|
||
color: #333333;
|
||
font-size: 32rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.pay-content {
|
||
width: 710rpx;
|
||
margin-top: 40rpx;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
.pay-content-item {
|
||
width: 710rpx;
|
||
height: 92rpx;
|
||
border-radius: 20rpx;
|
||
background-color: #F2F2F2;
|
||
margin-bottom: 40rpx;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.pay-content-item-icon {
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
margin-right: 10rpx;
|
||
}
|
||
|
||
.pay-content-items {
|
||
color: #333333;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
}
|
||
</style> |