Commit 300b258f authored by jyx's avatar jyx

抖音官方播放器接入

parent 60d4dd8c
{
"version" : "1",
"prompt" : "template",
"title" : "服务协议和隐私政策",
"message" : "请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款,包括但不限于:为了更好的向你提供服务,我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>  你可阅读<a href=\"https://shimo.im/docs/dPkpKL1EVNIBbXqO\">《用户协议》</a>和<a href=\"https://shimo.im/docs/aBAYVY4mNXfgLm3j\">《隐私政策》</a>了解详细信息。如果你同意,请点击下面按钮开始接受我们的服务。",
"buttonAccept" : "同意并接受",
"buttonRefuse" : "暂不同意",
"second" : {
"title" : "确认提示",
"message" : "进入应用前,你需先同意<a href=\"https://shimo.im/docs/dPkpKL1EVNIBbXqO\">《用户协议》</a>和<a href=\"https://shimo.im/docs/aBAYVY4mNXfgLm3j\">《隐私政策》</a>,否则将退出应用。",
"buttonAccept" : "同意并继续",
"buttonRefuse" : "退出应用"
},
"styles" : {
"backgroundColor" : "#ffffff",
"borderRadius" : "5px",
"title" : {
"color" : "#008cfb"
},
"buttonAccept" : {
"color" : "#008cfb"
},
"buttonRefuse" : {
"color" : "#c0c0c0"
}
}
}
function gotoVideoPlayerPage(detail, playNext = 0) {
if (tt.canIUse('PlayletExtension')) {
if (detail.douyinAlbumIdNext && detail.douyinEpisodeIdNext) {
//跳转至绑定短剧的页面
uni.navigateTo({
url: '/pagesC/playlet/index?data=' + encodeURIComponent(JSON.stringify(detail)) +
'&tt_album_id=' + detail.douyinAlbumIdNext + '&tt_episode_id=' + detail.douyinEpisodeIdNext
})
return
}
//跳转至绑定短剧的页面
uni.navigateTo({
url: '/pagesC/playlet/index?data=' + encodeURIComponent(JSON.stringify(detail)) +
'&tt_album_id=' + detail.douyinAlbumId + '&tt_episode_id=' + detail.douyinEpisodeId
})
} else {
tt.navigateTo({
url: '/pagesC/ttvideo/ttVideoDetail?data=' + encodeURIComponent(JSON.stringify(detail)) +
'&tt_album_id=' + detail.douyinAlbumId + '&tt_episode_id=' + detail.douyinEpisodeId +
'&playNext=' + playNext
})
}
}
export {
gotoVideoPlayerPage
}
\ No newline at end of file
<template>
<view style="position: relative; ">
<view v-if="agreeFlag"
style="width: 100%;height: 100%;background-color: black;opacity: 0.8;display: flex;position: absolute;z-index: 100;color: white;flex-direction: column;align-items: center;padding:40rpx 20rpx;">
<text style="font-size: 30rpx;">
付费须知 \n
1、看点和会员属于虚拟商品,一经购买不可退换 \n
2、未满18岁的未成年人需要在监护人主导、同意下进行相关付费操作;\n
3、充值看点一般5分钟内到账,如未到账请在“我的”页面联系客服;
</text>
<image @click="agreeFlag=false" style="width: 30rpx;height: 30rpx;margin-top:150rpx;"
src="@/static/index/ic_quit_white.png"></image>
</view>
<view class="body" style="width: 100%;height: 100%;background-color: white;">
<scroll-view scroll-y style="background-color: white;">
<view style="display: flex;flex-direction: column;align-items: flex-end;">
<view style="display: flex;flex-direction: row;">
<view @click="handleAgree" style="margin-top: 8rpx;margin-right: 18rpx;">付费须知></view>
<image @click="handleClickClose"
style="width: 30rpx;height: 30rpx;display: flex;align-items: right;margin-top: 20rpx;margin-right: 20rpx;margin-bottom: 10rpx;"
src="@/static/index/ic_quit_white.png"></image>
</view>
</view>
<view style="display: flex;flex-direction: column;align-items: center;margin-bottom: 20rpx;">
<view style="font-size: 38rpx;color: black;">{{titleText}}</view>
<view class="flex">
<view v-if="point>0" style="display: flex;flex-direction: row;margin-top: 10rpx;">
<view style="font-size: 28rpx;color: #644238;margin-top: 12rpx;">解锁本集:</view>
<view style="font-size: 42rpx;color: red;font-weight: 777;">{{point}}</view>
<view style="font-size: 28rpx;color: #644238;margin-top: 12rpx;margin-left: 6rpx;">
看点
</view>
</view>
<view v-if="point>0" style="width: 60rpx;"></view>
<view style="display: flex;flex-direction: row;margin-top: 10rpx;">
<view style="font-size: 28rpx;color: #644238;margin-top: 12rpx;">账户余额:</view>
<view style="font-size: 42rpx;color: red;font-weight: 777;">{{userBean.point??0}}
</view>
<view style="font-size: 28rpx;color: #644238;margin-top: 12rpx;margin-left: 6rpx;">
看点
</view>
</view>
</view>
</view>
<view class="section">
<view class="pack-box">
<view class="pack-item"
:style="item.largeType !=='vip' ?'background: #f5f5f5;':'background: #f4c98b;'"
:class="[{active: index==selectedIndex}]" v-for='(item, index) in vipList' :key='index'
@click="choosePack(item, index)">
<view style="display: flex;flex-direction: column;align-items: center;">
<view v-if="os=='android'" class="price row">
{{item.firstPayPrice}}
</view>
<view v-else style="display: flex;align-items: center;font-size: 40rpx;
color: #f2b068;
font-weight: 700;">
<image style="width: 50rpx;height: 50rpx;display: flex;margin-right: 10rpx;"
src="@/static/ic_zuan.png">
</image>
+{{multiply(item.firstPayPrice)}}
</view>
<view class="name row" v-if="item.title!=null&&item.title!=''">
{{item.title}}
</view>
<view class="origin row" v-if="item.remarks!=null&&item.remarks!=''">
{{item.remarks}}
</view>
</view>
<view class="cut-down" v-if='item.topTitle!=null&&item.topTitle.length>0'>
{{item.topTitle}}
</view>
<view v-if="index==selectedIndex" style="position: absolute;bottom: 0;right: 0;">
<image mode="scaleToFill"
style="width: 100rpx;height: 100rpx;display: flex;align-items: right;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_loading.gif">
</image>
</view>
</view>
</view>
</view>
<view style="display: flex;flex-direction: column;align-items: center;">
<view style="font-size: 29rpx;color: gray;margin-top: 16rpx;">
客服时间工作日 9:00-18:00</view>
<button class="button2" open-type="im" data-im-id="du_movie">在线客服</button>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
import common from '@/mixins/common';
import message from '@/utils/fun';
const {
getPlayletManager
} = tt;
export default {
mixins: [common],
data() {
return {
pm: null,
vipList: [],
selectedIndex: 0,
agreeFlag: false,
userBean: {},
os: 'android',
titleText: '超多精彩好剧一键解锁',
showClone: false
};
},
async beforeCreate() {
const pm = await getPlayletManager({
is: 'charge' // 和插槽同名
});
this.pm = pm;
console.error(pm, this, "charge_pm_this_beforeCreate");
},
created() {
console.log("chargeCreated");
},
beforeMount() {
console.log("chargeBeforeMount");
this.loadData()
},
mounted() {
console.log("chargeMounted");
},
beforeUpdate() {
console.log("chargeBeforeUpdate");
},
updated() {
console.log("chargeUpdated");
},
beforeDestroy() {
console.log("chargeBeforeDestroy");
},
destroyed() {
console.log("chargeDestroyed");
},
methods: {
multiply(num) {
return parseInt(num * 10);
},
paySuccess(largeType) {
if (largeType == 'vip') {
this.vipBackPage = this.originIndex
this.getData()
} else if (largeType == 'point') {
this.unlock(this.originIndex)
this.pm.toggleCustomDialog();
} else {
this.vipBackPage = this.originIndex
this.getData()
}
// 支付完成回调
this.pm.toggleCustomDialog();
this.pm.setCurrentUnlock();
},
loadData() {
if (tt.getSystemInfoSync().platform === 'ios') {
this.os = 'ios';
}
this.post({
url: '/vip/getVipProducts/point',
data: {
vedioId: this.point <= 0 ? null : this.vedioId
},
showLoading: false,
success: ({
data
}) => {
this.vipList = data.list;
if (data.list != null) {
// this.selectedIndex = data.list[0].activityType;
for (let i = 0; i < data.list.length; i++) {
if (data.list[i].activityType == 1) {
this.selectedIndex = i;
break;
}
}
}
}
});
this.post({
url: '/user/baseMsg',
showLoading: false,
success: ({
data
}) => {
this.userBean = data;
}
});
},
handleAgree() {
this.agreeFlag = true
},
handleClickClose() {
this.pm.toggleCustomDialog();
},
handleClose() {
this.pm.toggleCustomDialog();
},
choosePack(item, index) {
this.selectedIndex = index;
this.handlePay();
},
handlePay() {
// if (this.os == 'ios') {
// message.notify('iOS暂不支持购买');
// return
// }
let that = this;
let vipBean = this.vipList[this.selectedIndex];
// 抖音支付
// #ifdef MP-TOUTIAO
this.post({
url: '/vip/getVipPayParams/douyin',
data: {
vedioId: that.point <= 0 ? null : that.vedioId,
os: that.os,
pid: vipBean.pid
},
showLoading: true,
success: ({
data
}) => {
that.ttPrePay(data, vipBean.largeType);
}
});
// #endif
},
ttPrePay(ttData, largeType) {
if (!tt.canIUse('requestOrder')) {
message.notify('请升级抖音APP版本');
return
}
let that = this;
tt.requestOrder({
data: ttData.params.data,
byteAuthorization: ttData.params.byteAuthorization,
success(res) {
that.ttPay(largeType, res.orderId, ttData);
},
fail(res) {
// message.notify(res.errMsg);
},
});
},
ttPay(largeType, oid, ttData) {
if (!tt.canIUse('getOrderPayment')) {
message.notify('请升级抖音APP版本');
return
}
let that = this;
tt.getOrderPayment({
orderId: oid,
success(res) {
that.queryOrderStatus(largeType, ttData.tidStr);
},
fail(res) {},
});
},
queryOrderStatus(largeType, tid) {
let that = this;
this.post({
data: {
tid: tid
},
url: '/vip/queryVipOrder',
showLoading: true,
success: ({
data
}) => {
that.paySuccess(largeType);
}
});
}
},
};
</script>
<style lang="scss">
.body {
padding: 10rpx 0 30rpx 0;
border-radius: 20rpx 20rpx 0 0;
background-color: white;
display: flex;
flex-direction: column;
align-items: center;
}
.section {
min-height: 400rpx;
display: flex;
flex-direction: column;
background: white;
}
.pack-box {
margin-top: 25rpx;
margin-left: 18rpx;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
.active {
border: 6rpx solid #fd5350 !important;
}
.pack-item {
margin-bottom: 25rpx;
margin-right: 22rpx;
width: calc(45%);
height: 190rpx;
display: flex;
flex-direction: column;
justify-content: space-around;
// background: #f5f5f5;
border: 6rpx solid #f5f5f5;
border-radius: 10rpx;
position: relative;
.row {
margin: 8rpx 15rpx;
marign-bottom: 0;
}
.row:last-child {
margin-bottom: 8rpx;
}
.name {
font-size: 29rpx;
color: #333;
}
.price {
font-size: 40rpx;
color: #fd5350;
font-weight: 700;
}
.origin {
color: #5A3C0F;
// background: #5a1505;
background-image: linear-gradient(90deg, #F3DEBE, #EAC180);
font-size: 22rpx;
border-radius: 20rpx;
height: 30rpx;
line-height: 30rpx;
padding-top: 4rpx;
padding-bottom: 3rpx;
padding-left: 16rpx;
padding-right: 16rpx;
}
.cut-down {
position: absolute;
top: 0;
color: #fff;
background: #ff502f;
font-size: 22rpx;
border-radius: 15rpx;
height: 30rpx;
line-height: 30rpx;
padding-top: 6rpx;
padding-bottom: 3rpx;
padding-left: 16rpx;
padding-right: 16rpx;
transform: translate(0, -50%);
}
}
}
.button2 {
width: 300rpx;
height: 50rpx;
line-height: 50rpx;
text-align: center;
margin: 10rpx 20rpx;
border-radius: 10rpx;
background-color: white;
border: 1px orange solid;
color: orange;
font-size: 26rpx;
box-shadow: 0 0 2px 0px rgba(255, 255, 255, 0.1);
}
</style>
\ No newline at end of file
...@@ -38,9 +38,14 @@ ...@@ -38,9 +38,14 @@
import common from '@/mixins/common'; import common from '@/mixins/common';
import { import {
message,
navigateTo, navigateTo,
} from '@/utils/fun.js'; } from '@/utils/fun.js';
import {
gotoVideoPlayerPage
} from "@/common/page-route.js"
const app = getApp(); const app = getApp();
export default { export default {
...@@ -95,8 +100,7 @@ ...@@ -95,8 +100,7 @@
this.$emit("goRecommend") this.$emit("goRecommend")
}, },
click(detail) { click(detail) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(detail)) + gotoVideoPlayerPage(detail)
'&tt_album_id=' + detail.douyinAlbumId + '&tt_episode_id=' + detail.douyinEpisodeId);
}, },
longClick(key) { longClick(key) {
this.isEditStyle = true this.isEditStyle = true
...@@ -141,9 +145,7 @@ ...@@ -141,9 +145,7 @@
data data
}) => { }) => {
this.isEditStyle = false this.isEditStyle = false
uni.showToast({ message.notify("删除成功")
title: "删除成功"
})
this.loadData() this.loadData()
} }
}); });
......
...@@ -239,6 +239,10 @@ ...@@ -239,6 +239,10 @@
getToLocal getToLocal
} from "@/utils/utils.js" } from "@/utils/utils.js"
import {
gotoVideoPlayerPage
} from '@/common/page-route.js'
import { import {
navigateTo, navigateTo,
message, message,
...@@ -342,20 +346,16 @@ ...@@ -342,20 +346,16 @@
}); });
}, },
handleBanner(item) { handleBanner(item) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(item)) + gotoVideoPlayerPage(item)
'&tt_album_id=' + item.douyinAlbumId + '&tt_episode_id=' + item.douyinEpisodeId);
}, },
handleInfo(item) { handleInfo(item) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(item)) + gotoVideoPlayerPage(item)
'&tt_album_id=' + item.douyinAlbumId + '&tt_episode_id=' + item.douyinEpisodeId);
}, },
handleTop(item) { handleTop(item) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(item)) + gotoVideoPlayerPage(item)
'&tt_album_id=' + item.douyinAlbumId + '&tt_episode_id=' + item.douyinEpisodeId);
}, },
handleBottomPlay(item) { handleBottomPlay(item) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(item)) + gotoVideoPlayerPage(item)
'&tt_album_id=' + item.douyinAlbumId + '&tt_episode_id=' + item.douyinEpisodeId);
}, },
handleBottomClose() { handleBottomClose() {
this.newRecordBean = null; this.newRecordBean = null;
...@@ -384,10 +384,7 @@ ...@@ -384,10 +384,7 @@
data data
}) => { }) => {
if (data.vedioMsg != null) { if (data.vedioMsg != null) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent( gotoVideoPlayerPage(data.vedioMsg)
JSON.stringify(data.vedioMsg)) +
'&tt_album_id=' + data.vedioMsg.douyinAlbumId +
'&tt_episode_id=' + data.vedioMsg.douyinEpisodeId);
// 重置短视频挂载id // 重置短视频挂载id
uni.setStorage({ uni.setStorage({
......
...@@ -11,8 +11,8 @@ ...@@ -11,8 +11,8 @@
:show-fullscreen-btn="false" @controlstoggle="controlstoggle" @ended="ended" /> :show-fullscreen-btn="false" @controlstoggle="controlstoggle" @ended="ended" />
</view> </view>
<view v-if="!isqp" class="userInfo flex"> <view v-if="!isqp" class="userInfo flex">
<!-- 点赞 --> <!-- 收藏 -->
<view class="flex" style="opacity: 0.9; margin-top: 10rpx;"> <view v-show="false" class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image @click.stop="collect(list.vedioId,index)" v-if="list.collect==0" <image @click.stop="collect(list.vedioId,index)" v-if="list.collect==0"
src="@/static/home_collect_img_0.png" /> src="@/static/home_collect_img_0.png" />
<image @click.stop="cancelCollect(list.vedioId,index)" v-if="list.collect==1" <image @click.stop="cancelCollect(list.vedioId,index)" v-if="list.collect==1"
...@@ -59,6 +59,10 @@ ...@@ -59,6 +59,10 @@
let audo = uni.createInnerAudioContext() let audo = uni.createInnerAudioContext()
import {
gotoVideoPlayerPage
} from "@/common/page-route.js"
export default { export default {
name: "recommendVideo", name: "recommendVideo",
mixins: [common], mixins: [common],
...@@ -271,9 +275,7 @@ ...@@ -271,9 +275,7 @@
this.isqp = e.detail.show this.isqp = e.detail.show
}, },
detail(detail) { detail(detail) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(detail)) + gotoVideoPlayerPage(detail, 1)
'&tt_album_id=' + detail.douyinAlbumId + '&tt_episode_id=' + detail.douyinEpisodeId +
`&playNext=1`);
}, },
collect(vedioId, index) { collect(vedioId, index) {
this.originList[index].collect = 1 this.originList[index].collect = 1
......
<template>
<view class="number-box">
<view @click="_calcValue('minus')" class="number-box-btns" :class="{ 'number-box-disabled': inputValue <= min || disabled }">
<icons icon="minus" :color="inputValue <= min || disabled ? '#868686' : '#299FEF'" size="40" />
</view>
<input :disabled="disabled" @focus="_onFocus" @blur="_onBlur" class="number-box-input" type="number" v-model="inputValue" />
<view @click="_calcValue('plus')" class="number-box-btns"><icons icon="plus" :color="inputValue >= max || disabled ? '#868686' : '#299FEF'" size="40" /></view>
</view>
</template>
<script>
/**
* NumberBox 数字输入框
* @description 带加减按钮的数字输入框
* @tutorial https://ext.dcloud.net.cn/plugin?id=31
* @property {Number} value 输入框当前值
* @property {Number} min 最小值
* @property {Number} max 最大值
* @property {Number} step 每次点击改变的间隔大小
* @property {String} color 字体颜色(前景色)
* @property {Boolean} disabled = [true|false] 是否为禁用状态
* @event {Function} change 输入框值改变时触发的事件,参数为输入框当前的 value
* @event {Function} focus 输入框聚焦时触发的事件,参数为 event 对象
* @event {Function} blur 输入框失焦时触发的事件,参数为 event 对象
*/
export default {
name: 'NumberBox',
emits: ['change', 'input', 'update:modelValue', 'blur', 'focus'],
props: {
value: {
type: [Number, String],
default: 1
},
modelValue: {
type: [Number, String],
default: 1
},
min: {
type: Number,
default: 0
},
max: {
type: Number,
default: 100
},
step: {
type: Number,
default: 1
},
disabled: {
type: Boolean,
default: false
}
},
data() {
return {
inputValue: 0
};
},
watch: {
value(val) {
this.inputValue = +val;
},
modelValue(val) {
this.inputValue = +val;
}
},
created() {
if (this.value === 1) {
this.inputValue = +this.modelValue;
}
if (this.modelValue === 1) {
this.inputValue = +this.value;
}
},
methods: {
_calcValue(type) {
if (this.disabled) {
return;
}
const scale = this._getDecimalScale();
let value = this.inputValue * scale;
let step = this.step * scale;
if (type === 'minus') {
value -= step;
if (value < this.min * scale) {
return;
}
if (value > this.max * scale) {
value = this.max * scale;
}
}
if (type === 'plus') {
value += step;
if (value > this.max * scale) {
return;
}
if (value < this.min * scale) {
value = this.min * scale;
}
}
this.inputValue = (value / scale).toFixed(String(scale).length - 1);
this.$emit('change', +this.inputValue);
// TODO vue2 兼容
this.$emit('input', +this.inputValue);
// TODO vue3 兼容
this.$emit('update:modelValue', +this.inputValue);
},
_getDecimalScale() {
let scale = 1;
// 浮点型
if (~~this.step !== this.step) {
scale = Math.pow(10, String(this.step).split('.')[1].length);
}
return scale;
},
_onBlur(event) {
this.$emit('blur', event);
let value = event.detail.value;
if (!value) {
// this.inputValue = 0;
return;
}
value = +value;
if (value > this.max) {
value = this.max;
} else if (value < this.min) {
value = this.min;
}
const scale = this._getDecimalScale();
this.inputValue = value.toFixed(String(scale).length - 1);
this.$emit('change', +this.inputValue);
this.$emit('input', +this.inputValue);
},
_onFocus(event) {
this.$emit('focus', event);
}
}
};
</script>
<style lang="scss">
.number-box {
display: inline-flex;
align-items: center;
margin-right: -16rpx;
&-btns {
line-height: 1;
vertical-align: bottom;
display: inline-block;
padding: 16rpx;
cursor: pointer;
}
&-input {
margin: 0 4rpx;
width: 50rpx;
text-align: center;
color: black;
}
}
</style>
<template>
<view class="container" v-show="showRewardAdPop">
<image @click="closeAdPop" style="width: 50rpx; height: 50rpx;margin-left:auto;margin-right: 30rpx;
margin-bottom: 30rpx;" src="https://mints-web.oss-cn-beijing.aliyuncs.com/images/ic_close_white.png"></image>
<view class="content">
<text class="title">恭喜你,获得免费看剧名额</text>
<text class="button" @click="showRewardAd">看广告免费解锁1集</text>
<text class="downtext">{{countDown}}s后自动进入广告,观看完成解锁第{{seq+1}}集剧情</text>
</view>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
message
} from '../../utils/fun';
import {
REWARD_ID
} from '../../utils/adConstant.js';
const {
getPlayletManager
} = tt;
export default {
props: ["titles"],
data() {
return {
pm: null,
count: 0,
albumId: "",
seq: 0,
episodeId: "",
countDown: 3,
showRewardAdPop: false,
showAdForServer: false
};
},
async beforeCreate() {
const pm = await getPlayletManager({
is: "playler", // 和插槽同名
});
pm.getPlayletInfo().then(res => {
this.albumId = res.albumId
this.seq = res.seq
this.episodeId = res.episodeId
});
this.pm = pm;
console.log(pm, this, "player_pm_this_beforeCreate");
pm.onPlay((e) => {
// 保存观看记录
console.error("触发开始播放onPlay回调:", e);
});
pm.onPause((e) => {
console.log("触发暂停播放onPause回调:", e);
});
pm.onEnded(async (e) => {
console.log("触发播放到末尾onEnded回调", e);
});
pm.onError((e) => {
console.error("报错了 报错了", e);
});
// 播放进度变化时
pm.onTimeUpdate((e) => {
// 播放进度变化时触发,返回当前播放时间点及视频总时长,单位:秒(s)。event.detail = { currentTime, duration }。
console.log("触发播放进度变化onTimeUpdate回调:", e);
});
pm.onWaiting((e) => {
console.log("触发视频出现缓冲onWaiting回调:", e);
});
pm.onPlayBackRateChange((e) => {
console.log("触发视频倍速改变onPlayBackRateChange回调:", e);
});
pm.onLoadedMetaData((e) => {
console.log("触发视频元数据加载完成onLoadedMetaData回调:", e);
});
pm.onSeekComplete((e) => {
console.log("触发seek完成onSeekComplete回调:", e);
});
pm.onMuteChange((e) => {
console.log("触发静音状态改变onMuteChange回调:", e);
});
pm.onControlTap((e) => {
switch (e.controlType) {
case "subscribe":
this.collect()
break
case "unsubscribe":
this.cancelCollect()
break
}
console.log("触发点击控件onControlTap回调:", e);
});
pm.onOpenCatalog((e) => {
console.log("触发点击选集onOpenCatalog回调:", e);
});
// 推荐位使用简单示例
pm.onChangeEpisode((e) => {
console.log("触发选集切换onChangeEpisode回调:", e);
this.albumId = e.albumId
this.seq = e.seq
this.episodeId = e.episodeId
if (e.status == 'lock') {
this.unlock()
} else {
this.commitVideo()
}
// pm.setRecommendConfig({
// entryType: 1,
// switchStatus: true,
// data: {
// albumId: "7349101834553786889",
// seq: 1,
// },
// });
// if (e.albumId === "7369150017635877413") {
// pm.setCatalog({
// freeList: [{
// start_episode_no: 1,
// end_episode_no: 5,
// }, ],
// unlockList: [{
// start_episode_no: 6,
// end_episode_no: 10,
// },
// {
// start_episode_no: 16,
// end_episode_no: 20,
// },
// ],
// lockList: [{
// start_episode_no: 11,
// end_episode_no: 15,
// },
// {
// start_episode_no: 21,
// end_episode_no: 76,
// },
// ],
// });
// }
// if (e.albumId === "7349101834553786889") {
// pm.setCatalog({
// freeList: [{
// start_episode_no: 1,
// end_episode_no: 10,
// }, ],
// });
// }
});
pm.onClickUnlock((e) => {
console.log("player解锁", e);
if (this.showAdForServer) {
this.showRewardAdPop = true
this.startCountdown()
} else {
this.pm.toggleCustomDialog()
}
});
pm.onTapCustomIcon((e) => {
console.log("触发点击自定义组件onTapCustomIcon回调:", e);
});
pm.onTapShare((e) => {
console.log("onTapShare", e);
return {
// 分享数据
title: `第 ${e.seq}集`,
desc: `这是默认的转发文案,用户可以直接发送,也可以在发布器内修改,分享的episodeId是 ${e.episodeId}`,
path: `pagesC/playlet/index?tt_album_id=${e.albumId}&tt_episode_id=${e.episodeId}`, // ?后面的参数会在转发页面打开时传入onLoad方法
imageUrl: "", // 支持本地或远程图片,默认是小程序 icon
templateId: "这是开发者后台设置的分享素材模板id",
};
});
pm.onShareSuccess((e) => {
console.log("分享成功onShareSuccess回调:", e);
});
pm.onShareFail((e) => {
console.log("分享失败onShareSuccess回调:", e);
});
},
created() {
console.log("playerCreated");
},
beforeMount() {
console.log("playerBeforeMount");
},
mounted() {
console.log("playerMounted");
},
beforeUpdate() {
console.log("playerBeforeUpdate");
},
updated() {
console.log("playerUpdated");
this.count % 2 == 0 ?
this.pm.setPlayStatus("play") :
this.pm.setPlayStatus("pause");
},
beforeDestroy() {
console.log("playerBeforeDestroy");
},
destroyed() {
console.log("playerDestroyed ");
},
methods: {
cliPause() {
console.error(this.$props);
this.pm.setPlayStatus("pause");
this.$emit("cliPause", 1);
},
loadAdSwitch() {
let that = this
common.methods.post({
url: '/vedio/confs',
showLoading: false,
success: ({
data
}) => {
that.showAdForServer = data.douyinAdTipOpen;
if (!that.showAdForServer) {
// 预加载广告
that.preloadAd()
}
}
});
},
preloadAd() {
let that = this
// 创建实例
this.ad = tt.createRewardedVideoAd({
adUnitId: REWARD_ID,
});
// 监听错误
this.ad.onError((err) => {
uni.hideLoading();
message.notify("网络太火爆了,请稍候重试")
switch (err.errCode) {
case 1004:
// 无合适的广告
break;
default:
// 更多请参考错误码文档
}
that.$nextTick(() => {
// 延迟渲染,否则位置错乱
that.pm.toggleCustomDialog()
})
});
// 监听视频播放完成
this.ad.onClose((data) => {
uni.hideLoading();
if (data.isEnded) {
message.notify("正在为您解锁剧集")
that.adUnlock()
} else {
message.notify("未观看完整视频")
that.$nextTick(() => {
// 延迟渲染,否则位置错乱
that.pm.toggleCustomDialog()
})
}
});
// do other thing
// 卸载 close 事件监听
// this.ad.offClose(closeHandler);
// 预加载资源
this.ad.load();
},
startCountdown() {
let that = this;
var countDownSeconds = 3
that.countDown = countDownSeconds
const timer = setInterval(() => {
if (countDownSeconds > 0) {
that.countDown = countDownSeconds
countDownSeconds--
} else {
clearInterval(timer)
if (that.showRewardAdPop) {
that.showRewardAd()
}
}
}, 1000)
},
showAdPop() {
this.showRewardAdPop = true
this.startCountdown()
},
closeAdPop() {
this.showRewardAdPop = false
},
showRewardAd() {
this.showRewardAdPop = false
// 播放激励视频
uni.showLoading({
title: '广告加载中'
});
this.ad.show();
},
collect() {
// 收藏
common.methods.post({
url: '/vedio/collect',
data: {
albumId: this.albumId
},
showLoading: false,
success: ({
data
}) => {}
});
},
cancelCollect() {
// 取消收藏
common.methods.post({
url: '/vedio/cancelCollect',
data: {
albumId: this.albumId
},
showLoading: false,
success: ({
data
}) => {}
});
},
commitVideo() {
common.methods.post({
url: '/vedio/reportIndex',
data: {
albumId: this.albumId,
vedioIndex: this.seq,
},
showLoading: false,
success: ({
data
}) => {}
});
},
unlock() {
let that = this
common.methods.post({
url: '/vedio/unlock',
data: {
albumId: this.albumId,
num: this.seq
},
showLoading: false,
success: ({
data
}) => {
message.notify(data.msg)
if (data.code == 200) {
this.pm.setCurrentUnlock()
} else if (data.code == 301) {
this.pm.setCurrentUnlock()
} else if (data.code == 302) {
this.pm.setCurrentUnlock()
} else if (data.code == 303) {
this.pm.toggleCustomDialog()
}
}
});
},
adUnlock() {
let that = this
this.post({
url: '/vedio/unlockByAd',
data: {
adSource: 'csj',
albumId: this.albumId,
num: this.seq,
ecpm: ''
},
showLoading: false,
success: ({
data
}) => {
message.notify(data.msg)
if (data.code == 200) {
that.pm.setCurrentUnlock()
} else if (data.code == 301) {
that.pm.setCurrentUnlock()
} else if (data.code == 302) {
that.pm.setCurrentUnlock()
} else if (data.code == 303) {
that.pm.toggleCustomDialog()
}
}
});
},
},
};
</script>
<style lang="scss">
.container {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -60%);
width: 600rpx;
height: 800rpx;
display: flex;
flex-direction: column;
justify-content: center;
}
.ad-view {
width: 600rpx;
border-radius: 20rpx;
margin-bottom: 10px;
}
.content {
border-radius: 20rpx;
background-color: white;
display: flex;
width: 600rpx;
padding: 30rpx 0;
flex-direction: column;
align-items: center;
.title {
color: black;
font-size: 40rpx;
font-weight: bold;
margin-bottom: 30rpx;
}
.button {
margin: 20rpx 20rpx;
border-radius: 10rpx;
background-color: orange;
color: white;
font-size: 36rpx;
}
.downtext {
color: darkgray;
font-size: 26rpx;
}
}
</style>
\ No newline at end of file
<template>
<view>
<button
class="reset-button button"
@click="onClick"
hover-class="button-hover"
:class="[shape == 'circle' ? 'round-circle' : '']"
>
<slot></slot>
</button>
</view>
</template>
<script>
/**
* m-field button 按钮组件
* @description 常用按钮组件。
* @tutorial https://ui.ymeoo.cn
* @property {String} color 按钮主题色
* @property {String} shape 设置为circle,则按钮两边为半圆形
* @event {Function} click 组件自定义点击事件
* @example <u-form-item label="姓名"><u-input v-model="form.name" /></u-form-item>
*/
export default {
name: 'q-button',
props: {
shape: {
type: String,
default: 'circle'
}
},
data() {
return {};
},
methods: {
onClick() {
this.$emit('click', '');
}
}
};
</script>
<style lang="scss" scoped>
// 去除button的所有默认样式
.reset-button {
padding: 0;
font-size: inherit;
line-height: inherit;
background-color: transparent;
color: inherit;
}
.reset-button::after {
border: none;
}
// button样式
.button {
display: block;
padding: 20rpx;
margin: 20rpx;
background-image: -moz-linear-gradient(135deg, rgb(0, 255, 255), rgb(29, 147, 251));
background-image: -webkit-linear-gradient(135deg, rgb(0, 255, 255), rgb(29, 147, 251));
background-image: linear-gradient(135deg, rgb(0, 255, 255), rgb(29, 147, 251));
color: #fff;
}
.button-hover {
background-color: #f5f5f5 !important;
}
.round-circle {
border-radius: 100rpx;
}
</style>
...@@ -27,17 +27,17 @@ export default { ...@@ -27,17 +27,17 @@ export default {
this.loadData(); this.loadData();
}, },
onHide() { onHide() {
if (this.xhrPool.size) { if (this.xhrPool && this.xhrPool.size) {
this.xhrPool.forEach((requestTask) => { this.xhrPool.forEach((requestTask) => {
requestTask.abort(); requestTask.abort();
}) })
} }
}, },
methods: { methods: {
authTo(url) {//登录校验 authTo(url) { //登录校验
}, },
authToNs(url) {//登录校验不保留当前页面 authToNs(url) { //登录校验不保留当前页面
}, },
loadData() {}, loadData() {},
...@@ -118,21 +118,21 @@ export default { ...@@ -118,21 +118,21 @@ export default {
let requestTask; let requestTask;
let uniChannel='wechat'; let uniChannel = 'wechat';
// #ifdef MP-KUAISHOU // #ifdef MP-KUAISHOU
uniChannel='kuaishou'; uniChannel = 'kuaishou';
// #endif // #endif
// #ifdef MP-TOUTIAO // #ifdef MP-TOUTIAO
uniChannel='douyin'; uniChannel = 'douyin';
// #endif // #endif
Object.assign(header, { Object.assign(header, {
token: uni.getStorageSync('token'), token: uni.getStorageSync('token'),
pkgName: app.globalData.pkgName, pkgName: app.globalData.pkgName,
version: app.globalData.versionName, version: app.globalData.versionName,
proChannel:uniChannel proChannel: uniChannel
}) })
options = Object.assign(options, { options = Object.assign(options, {
...@@ -165,12 +165,16 @@ export default { ...@@ -165,12 +165,16 @@ export default {
} }
}, },
complete: () => { complete: () => {
if (this.xhrPool) {
this.xhrPool.delete(requestTask) this.xhrPool.delete(requestTask)
} }
}
}) })
requestTask = uni.request(options); requestTask = uni.request(options);
if (this.xhrPool) {
this.xhrPool.add(requestTask) this.xhrPool.add(requestTask)
} }
} }
}
}; };
\ No newline at end of file
{ {
"uni-app": { "uni-app": {
"scripts": { "scripts": {}
"mp-dingtalk": {
"title": "钉钉小程序",
"env": {
"UNI_PLATFORM": "mp-alipay"
},
"define": {
"MP-DINGTALK": true
}
},
"mp-weixin-test": {
"title": "本地测试版本",
"env": {
"UNI_PLATFORM": "mp-weixin"
},
"define": {
"MP-APP-TEST": true
}
},
"mp-app-test": {
"title": "App 本地测试版本",
"env": {
"UNI_PLATFORM": "mp-weixin"
},
"define": {
"MP-APP-TEST": true
}
}
}
}, },
"dependencies": { "dependencies": {
"json-bignumber": "^1.1.1", "json-bignumber": "^1.1.1",
......
...@@ -10,55 +10,37 @@ ...@@ -10,55 +10,37 @@
"pages": [ "pages": [
// #ifndef APP-PLUS // #ifndef APP-PLUS
{ {
"path": "pages/loading", "path": "pages/loading"
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#F2F1FF",
"navigationBarTextStyle": "#000000"
}
}, },
// #endif // #endif
{ {
"path": "pages/home", "path": "pages/home",
"style": { "style": {
"navigationStyle": "default", "navigationBarTitleText": "巨爽短剧"
"navigationBarTitleText": "巨爽短剧",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
} }
}, },
{ {
"path": "pages/brower/brower", "path": "pages/brower/brower"
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
} }
], ],
// 分包配置 // 分包配置
"subPackages": [{ "subPackages": [{
"root": "pagesA", "root": "pagesA",
"pages": [{ "pages": [{
"path": "vipPay/vipPay", "path": "vipPay/vipPay"
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}] }]
}, { }, {
"root": "pagesC", "root": "pagesC",
"pages": [{ "pages": [{
"path": "ttvideo/ttVideoDetail", "path": "ttvideo/ttVideoDetail",
"style": { "usingComponents": {
"backgroundColor": "#000000", "tt-video-player": "ext://industry/video-player"
"navigationStyle": "default",
"navigationBarBackgroundColor": "#000000",
"navigationBarTextStyle": "#ffffff",
"usingComponents ": {
"video-player": "ext://industry/video-player"
} }
}, {
"path": "playlet/index",
"style": {
"extends": "ext://industry/playlet-plugin",
"isPageExtension": true
} }
}] }]
}, },
...@@ -67,34 +49,22 @@ ...@@ -67,34 +49,22 @@
"pages": [{ "pages": [{
"path": "watchRecord/watchRecord", "path": "watchRecord/watchRecord",
"style": { "style": {
"navigationBarTitleText": "观看记录", "navigationBarTitleText": "观看记录"
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
} }
}, { }, {
"path": "payRecord/payRecord", "path": "payRecord/payRecord",
"style": { "style": {
"navigationBarTitleText": "我的订单", "navigationBarTitleText": "我的订单"
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
} }
}, { }, {
"path": "dotRecord/dotRecord", "path": "dotRecord/dotRecord",
"style": { "style": {
"navigationBarTitleText": "看点记录", "navigationBarTitleText": "看点记录"
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
} }
}, { }, {
"path": "useDotRecord/useDotRecord", "path": "useDotRecord/useDotRecord",
"style": { "style": {
"navigationBarTitleText": "消费记录", "navigationBarTitleText": "消费记录"
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
} }
}] }]
} }
...@@ -108,8 +78,10 @@ ...@@ -108,8 +78,10 @@
} }
}, },
"globalStyle": { "globalStyle": {
"backgroundColor": "#f5f5f5",
"navigationStyle": "default", "navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"backgroundColor": "#f5f5f5",
"app-plus": { "app-plus": {
"bounce": "none", "bounce": "none",
"scrollIndicator": "none" "scrollIndicator": "none"
......
<script>
import Player from "@/components/player/player.vue";
import Charge from "@/components/charge/charge.vue";
const {
PlayletExtension,
getPlayletManager
} = tt;
PlayletExtension();
import common from '@/mixins/common';
export default {
components: {
Player,
Charge
},
//采用uniapp的生命周期函数
onLoad(option) {
let data = JSON.parse(decodeURIComponent(option.data));
this.loadData(data)
},
onReady() {
const p_m = getPlayletManager(this);
p_m.setCatalog({
freeList: [{
start_episode_no: 1,
end_episode_no: 5,
}],
lockList: [{
start_episode_no: 6,
end_episode_no: 200,
}],
});
p_m.onPlay((e) => {
console.error("可以播放了,可以播放了,可以播放了,可以播放了", e);
});
p_m.onError((e) => {
console.error("插件页onload 报错了 报错了", e);
});
p_m.onPause((e) => {
console.error("触发暂停播放onPause回调:", e);
});
},
onShow() {
console.log("show");
},
mounted() {
console.error(this, "this");
// const child = this.$refs.childRef;
// console.error(child, this.$refs, "childRef");
},
onShareAppMessage() {
console.log("share");
},
methods: {
cliPause(num) {
console.log(num, "cliPause");
},
loadData(data) {
const p_m = getPlayletManager(this);
common.methods.post({
url: '/vedio/getIndexList',
data: {
vedioId: data.vedioId
},
showLoading: false,
success: ({
data
}) => {
let _data = data.vedioMsg
p_m.setCatalog({
freeList: _data.douyinFreeList,
unlockList: _data.douyinUnlockList,
lockList: _data.douyinLockList,
});
}
});
}
},
};
</script>
\ No newline at end of file
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
<view style="font-size: 22rpx;color: gray;margin-top: 16rpx;">观看至第{{item.seeIndex}}</view> <view style="font-size: 22rpx;color: gray;margin-top: 16rpx;">观看至第{{item.seeIndex}}</view>
</view> </view>
</view> </view>
<view style="display: flex;align-items: center;margin-right: 8rpx;"> <view style="display: flex;align-items: center;margin-right: 8rpx;" v-if="false">
<view style="display: flex;flex-direction: column;"> <view style="display: flex;flex-direction: column;">
<image v-if="item.collect==0" @click="handleXing(item)" <image v-if="item.collect==0" @click="handleXing(item)"
style="width: 50rpx;height: 50rpx;display: flex;align-items: right;padding-right: 4rpx;" style="width: 50rpx;height: 50rpx;display: flex;align-items: right;padding-right: 4rpx;"
...@@ -51,6 +51,10 @@ ...@@ -51,6 +51,10 @@
openUrl openUrl
} from '@/utils/app+.js'; } from '@/utils/app+.js';
import {
gotoVideoPlayerPage
} from "@/common/page-route.js"
const app = getApp(); const app = getApp();
export default { export default {
...@@ -83,8 +87,7 @@ ...@@ -83,8 +87,7 @@
}); });
}, },
handleInfo(item) { handleInfo(item) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(item)) + gotoVideoPlayerPage(item)
'&tt_album_id=' + item.douyinAlbumId + '&tt_episode_id=' + item.douyinEpisodeId);
}, },
handleXing(item) { handleXing(item) {
var that = this; var that = this;
......
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