Skip to content

U
uniapp_vedio
Commit a9580391 authored by mengcuiguang's avatar mengcuiguang
Browse files
Options

代码优化

parent 2b7150a6
Hide whitespace changes
Inline Side-by-side
Showing with 2451 additions and 2450 deletions
vedio/components/ad-popup/ad-popup.vue
View file @ a9580391
<template>
<view>
<uni-popup type="center" ref="adPop" :maskClick="false" :isMaskClick="false">
<view class="container">
<!-- <view class="ad-view">
<ad :unit-id="adUnitId" @load="onload" @close="onclose" @error="onerror"></ad>
</view> -->
<view class="content">
<text class="title">恭喜你,获得免费看剧名额</text>
<text class="button" @click="handleClose">看视频免费解锁1集</text>
<text class="downtext">{{countDown}}s后自动进入广告,观看完成解锁第{{vedioIndex+1}}集剧情</text>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import {
EXPRESS_ID
} from "@/utils/adConstant.js"
export default {
name: 'adPopup',
props: {
show: {
type: Boolean,
default: false,
<template>
<view>
<uni-popup type="center" ref="adPop" :maskClick="false" :isMaskClick="false">
<view class="container">
<!-- <view class="ad-view">
<ad :unit-id="adUnitId" @load="onload" @close="onclose" @error="onerror"></ad>
</view> -->
<view class="content">
<text class="title">恭喜你,获得免费看剧名额</text>
<text class="button" @click="handleClose">看视频免费解锁1集</text>
<text class="downtext">{{countDown}}s后自动进入广告,阅读完成解锁第{{vedioIndex+1}}集剧情</text>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import {
EXPRESS_ID
} from "@/utils/adConstant.js"
export default {
name: 'adPopup',
props: {
show: {
type: Boolean,
default: false,
},
vedioIndex: {
type: [Number, String],
default: 0
}
},
data() {
return {
adUnitId: EXPRESS_ID,
countDown: 3,
};
},
methods: {
handleShow() {
this.$refs.adPop.open('center');
this.startCountdown()
},
startCountdown() {
let that = this;
var countDownSeconds = 3
that.countDown = countDownSeconds
const timer = setInterval(() => {
if (countDownSeconds > 0) {
that.countDown = countDownSeconds
countDownSeconds--
} else {
clearInterval(timer)
that.handleClose()
}
}, 1000)
},
handleClose() {
this.$refs.adPop.close('center');
this.$emit('close');
},
onload(e) {
console.log("onload");
},
onclose(e) {
console.log("onclose: " + e.detail);
},
onerror(e) {
console.log("onerror: " + e.detail.errCode + " message:: " + e.detail.errMsg);
}
},
watch: {
show: {
handler: function(newVal, oldVal) {
if (newVal) {
this.handleShow();
}
},
immediate: true
}
}
};
</script>
<style lang="scss">
.container {
width: 600rpx;
height: 800rpx;
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
}
.ad-view {
width: 600rpx;
border-radius: 20rpx;
// background-color: white;
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;
}
},
data() {
return {
adUnitId: EXPRESS_ID,
countDown: 3,
};
},
methods: {
handleShow() {
this.$refs.adPop.open('center');
this.startCountdown()
},
startCountdown() {
let that = this;
var countDownSeconds = 3
that.countDown = countDownSeconds
const timer = setInterval(() => {
if (countDownSeconds > 0) {
that.countDown = countDownSeconds
countDownSeconds--
} else {
clearInterval(timer)
that.handleClose()
}
}, 1000)
},
handleClose() {
this.$refs.adPop.close('center');
this.$emit('close');
},
onload(e) {
console.log("onload");
},
onclose(e) {
console.log("onclose: " + e.detail);
},
onerror(e) {
console.log("onerror: " + e.detail.errCode + " message:: " + e.detail.errMsg);
}
},
watch: {
show: {
handler: function(newVal, oldVal) {
if (newVal) {
this.handleShow();
}
},
immediate: true
}
}
};
</script>
<style lang="scss">
.container {
width: 600rpx;
height: 800rpx;
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
}
.ad-view {
width: 600rpx;
border-radius: 20rpx;
// background-color: white;
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
vedio/components/coin-popup/coin-popup.vue
View file @ a9580391
<template>
<view>
<uni-popup type="bottom" ref="coinPop" :maskClick="false" :isMaskClick="false">
<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 0;">
<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%;">
<scroll-view scroll-y>
<view style="display: flex;flex-direction: column;align-items: flex-end;">
<view style="display: flex;flex-direction: row;">
<view @click="handleAgree" style="margin-top: 12rpx;margin-right: 10rpx;">付费须知></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}}
</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 class="price row">
{{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: 24rpx;color: gray;margin-top: 16rpx;margin-bottom: 18rpx;">
订单中如有疑问，请在个人中心联系客服</view>
</view>
</scroll-view>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
message
} from '@/utils/fun';
export default {
name: 'coinPopup',
mixins: [common],
props: {
show: {
type: Boolean,
default: false
},
point: {
type: [Number, String],
default: 0
},
vedioId: {
type: [Number, String],
default: 0
}
},
data() {
return {
vipList: [],
selectedIndex: 0,
agreeFlag: false,
userBean: {},
os: 'android',
titleText: '超多精彩好剧一键解锁',
showClone: false
};
},
methods: {
// 支付完成回调
paySuccess(largeType) {
this.$emit('paySuccess', largeType);
this.handleClose();
},
handleShow() {
let that = this;
this.$refs.coinPop.open('bottom');
if (tt.getSystemInfoSync().platform === 'ios') {
this.os = 'ios';
}
this.post({
url: '/vip/getVipProducts/point',
data: {
vedioId: that.point <= 0 ? null : that.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
<template>
<view>
<uni-popup type="bottom" ref="coinPop" :maskClick="false" :isMaskClick="false">
<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 0;">
<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%;">
<scroll-view scroll-y>
<view style="display: flex;flex-direction: column;align-items: flex-end;">
<view style="display: flex;flex-direction: row;">
<view @click="handleAgree" style="margin-top: 12rpx;margin-right: 10rpx;">付费须知></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}}
</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 class="price row">
{{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: 24rpx;color: gray;margin-top: 16rpx;margin-bottom: 18rpx;">
订单中如有疑问，请在个人中心联系客服</view>
</view>
</scroll-view>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
message
} from '@/utils/fun';
export default {
name: 'coinPopup',
mixins: [common],
props: {
show: {
type: Boolean,
default: false
},
point: {
type: [Number, String],
default: 0
},
vedioId: {
type: [Number, String],
default: 0
}
},
data() {
return {
vipList: [],
selectedIndex: 0,
agreeFlag: false,
userBean: {},
os: 'android',
titleText: '超多精彩小说一键解锁',
showClone: false
};
},
methods: {
// 支付完成回调
paySuccess(largeType) {
this.$emit('paySuccess', largeType);
this.handleClose();
},
handleShow() {
let that = this;
this.$refs.coinPop.open('bottom');
if (tt.getSystemInfoSync().platform === 'ios') {
this.os = 'ios';
}
this.post({
url: '/vip/getVipProducts',
data: {
vedioId: that.point <= 0 ? null : that.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.$refs.coinPop.close('bottom');
this.$emit('clickClose');
this.$emit('close');
},
handleClose() {
this.$refs.coinPop.close('bottom');
this.$emit('close');
},
choosePack(item, index) {
this.selectedIndex = index;
this.handlePay();
},
handlePay() {
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;
if (this.os == 'ios') {
if (!tt.canIUse('getOrderPayment.object.imId')) {
message.notify('请升级抖音APP版本');
return
},
handleClose() {
this.$refs.coinPop.close('bottom');
this.$emit('close');
},
choosePack(item, index) {
this.selectedIndex = index;
this.handlePay();
},
handlePay() {
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;
if (this.os == 'ios') {
if (!tt.canIUse('getOrderPayment.object.imId')) {
message.notify('请升级抖音APP版本');
return
}
tt.getOrderPayment({
......@@ -252,138 +252,138 @@
fail(res) {
message.notify(res.errMsg);
},
});
} else {
tt.getOrderPayment({
orderId: oid,
success(res) {
that.queryOrderStatus(largeType, ttData.tidStr);
},
fail(res) {
message.notify(res.errMsg);
},
});
}
},
queryOrderStatus(largeType, tid) {
let that = this;
this.post({
data: {
tid: tid
},
url: '/vip/queryVipOrder',
showLoading: true,
success: ({
data
}) => {
that.paySuccess(largeType);
}
});
}
},
watch: {
show: {
handler: function(newVal, oldVal) {
if (newVal) {
this.handleShow();
}
},
immediate: true
}
}
};
</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 {
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%);
}
}
}
});
} else {
tt.getOrderPayment({
orderId: oid,
success(res) {
that.queryOrderStatus(largeType, ttData.tidStr);
},
fail(res) {
message.notify(res.errMsg);
},
});
}
},
queryOrderStatus(largeType, tid) {
let that = this;
this.post({
data: {
tid: tid
},
url: '/vip/queryVipOrder',
showLoading: true,
success: ({
data
}) => {
that.paySuccess(largeType);
}
});
}
},
watch: {
show: {
handler: function(newVal, oldVal) {
if (newVal) {
this.handleShow();
}
},
immediate: true
}
}
};
</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 {
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%);
}
}
}
</style>
\ No newline at end of file
vedio/components/home/index.vue
View file @ a9580391
......@@ -175,7 +175,7 @@
:src="newRecordBean.coverImage" mode="aspectFill"></image>
<view style="margin: 20rpx;">
<view style="font-size: 30rpx; color: white;">{{newRecordBean.title}}</view>
<view style="font-size: 24rpx;margin-top: 6rpx;color: white;">上次观看至第{{newRecordBean.seeIndex}}集
<view style="font-size: 24rpx;margin-top: 6rpx;color: white;">上次阅读至第{{newRecordBean.seeIndex}}集
</view>
<view style="font-size: 22rpx;"
v-if="newRecordBean.orderTags!=null&&newRecordBean.orderTags.length>0">
......@@ -202,7 +202,7 @@
color: white;
font-size: 24rpx;
margin-right: 20rpx;">
继续观看
继续阅读
</view>
</view>
......@@ -306,7 +306,7 @@
this.topList = data.list;
}
});
// 最近观看剧
// 最近阅读剧
this.post({
url: '/vedio/newest',
data: {},
......
vedio/components/home/my.vue
View file @ a9580391
<template>
<view class="body">
<!-- <scroll-view :scroll-y="true"> -->
<z-paging style="height: 100%;">
<view
:style="'display: flex;flex-direction: row;align-items: center;margin: 20rpx;padding-left: 10rpx;margin-top:'+10+'px;'">
<image class="avatar" src="@/static/logo-about.png"></image>
<view>
<view style="font-size: 32rpx;color: black;margin-left: 20rpx;">用户ID：{{userBean.idcode}}</view>
</view>
<!-- <button text="微信用户一键登录" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">123123</button> -->
</view>
<view v-if="userBean.showVipInner && os === 'android' "
style="display: flex;flex-direction: row;background: #f5ca86;margin: 20rpx;padding: 40rpx;border-radius:20rpx;align-items: center;justify-content:space-between;">
<view style="display: flex;flex-direction: column;justify-content: center;">
<view style="font-size: 36rpx;color: #5b1500;font-weight: 777;">
{{userBean.expireTime<=0 ? '开通VIP会员' : 'VIP会员'}}
</view>
<view v-if="userBean.expireTime<=0" style="font-size: 30rpx;color: #5b1500;margin-top: 12rpx;">
解锁全部短剧
</view>
<view v-else style="font-size: 30rpx;color: #5b1500;margin-top: 12rpx;">
到期时间:{{userBean.expireTime*1000 | formatDate('yyyy-MM-dd')}}
</view>
<view v-if="userBean.expireTime<=0" @click="handleCoinPay"
style="width: 210rpx;height: 60rpx;background-color: #5b1500;border-radius:30rpx;color: white;font-size: 26rpx;justify-content: center;align-items: center;display: flex;padding-bottom: 4rpx;margin-top: 30rpx;">
立即开通
</view>
<view v-else style="width: 210rpx;height: 60rpx;padding-bottom: 4rpx;margin-top: 30rpx;">
</view>
</view>
<image style="border-radius:10rpx; width: 130rpx;height: 100rpx;margin-right: 20rpx;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/bg_my_vip.png" mode="scaleToFill"></image>
</view>
<view v-if="os === 'android' "
style="display: flex;height: 200rpx;margin: 20rpx;background: #f5ca86;border-radius: 20rpx;">
<view style="flex-grow: 2; margin-left: 20rpx;">
<view
style="width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;">
<view style="display: flex;align-items: center;">
<image
style="width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_my_coin.png"></image>
<view style="font-size: 36rpx;font-weight: 777;">看点充值</view>
</view>
<view style="font-size: 28rpx;color: #5b1500;margin-top: 20rpx;">海量看点狂洒中,好剧等你来解锁</view>
</view>
</view>
<view style="width: 220rpx;">
<view
style="width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;">
<view style="font-size: 30rpx;color: #5b1500;margin-bottom: 20rpx;">{{userBean.point}}</view>
<view @click="handleCoinPay"
style="width: 160rpx;height: 60rpx;background-color: #5b1500;border-radius:30rpx;color: white;font-size: 26rpx;justify-content: center;align-items: center;display: flex;padding-bottom: 4rpx;">
去充值
</view>
</view>
</view>
</view>
<view class="infobg" style="margin: 20rpx;">
<view v-if="userBean.showVipInner && os === 'android' " class="item arrow" @click="handlePayRecord">
我的订单
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view v-if="os === 'android' " class="item arrow" @click="handleDotRecord">
看点记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view v-if="os === 'android' " class="item arrow" @click="handleUseDotRecord">
消费记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view class="item arrow" @click="handleWatchRecord">
观看记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view class="item arrow" @click="handlePhone">
联系客服
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
</view>
<view style="display: flex;justify-content: center;margin-top: 20rpx;font-size: 26rpx;color: gray;">
{{ versionName }}
</view>
</z-paging>
<!-- </scroll-view> -->
<coin-popup :show="showAnimate" @close="showAnimate = false" @paySuccess="paySuccess">
</coin-popup>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
getToLocal
} from "@/utils/utils.js"
import {
navigateTo,
message,
alert,
loading
} from '@/utils/fun.js';
import {
openUrl
} from '@/utils/app+.js';
const app = getApp();
export default {
name: 'index',
mixins: [common],
data() {
return {
statusBarHeight: app.globalData.statusBarHeight,
userBean: {},
showAnimate: false,
windowHeight: 0,
os: 'android',
versionName: app.globalData.versionName,
corpid: '', // 企业ID
curl: '', // 客服链接
};
},
methods: {
show() {
// this.os = wx.getSystemInfoSync().platform;
this.windowHeight = uni.getSystemInfoSync().windowHeight
// loadData() {
this.post({
url: '/user/baseMsg',
showLoading: false,
success: ({
data
}) => {
this.userBean = data;
}
});
},
hide() {
},
handleDotRecord() {
// 看点记录
navigateTo(`/pagesD/dotRecord/dotRecord`)
},
handleUseDotRecord() {
// 看点消费记录
navigateTo(`/pagesD/useDotRecord/useDotRecord`)
},
handleWatchRecord() {
navigateTo(`/pagesD/watchRecord/watchRecord`)
},
handleCoinPay() {
this.showAnimate = true;
},
handlePayRecord() {
navigateTo(`/pagesD/payRecord/payRecord`)
},
handleVipPay() {
navigateTo(`/pagesA/vipPay/vipPay`)
},
handlePhone() {
// if (this.corpid != '' && this.curl != '') {
// wx.openCustomerServiceChat({
// extInfo: {
// url: this.curl
// },
// corpId: this.corpid,
// success(res) {},
// fail(e) {
// console.log(e)
// }
// })
// } else {
// let that = this
// // 联系我们
// this.post({
// url: '/vedio/customerServiceNumbers',
// showLoading: false,
// success: ({
// data
// }) => {
// let datas = data.customerServiceNumbers.split(',')
// that.corpid = datas[0]
// that.curl = datas[1]
// wx.openCustomerServiceChat({
// extInfo: {
// url: that.curl
// },
// corpId: that.corpid,
// success(res) {},
// fail(e) {
// console.log(e)
// }
// })
// }
// });
// }
wx.makePhoneCall({
phoneNumber: '4000969950',
success: function(res) {
console.log('拨打电话成功！');
},
fail: function(res) {
console.log('拨打电话失败！');
}
})
},
paySuccess(largeType) {
// largeType=vip 开通vip
// largeType=point 购买看点
<template>
<view class="body">
<!-- <scroll-view :scroll-y="true"> -->
<z-paging style="height: 100%;">
<view
:style="'display: flex;flex-direction: row;align-items: center;margin: 20rpx;padding-left: 10rpx;margin-top:'+10+'px;'">
<image class="avatar" src="@/static/logo-about.png"></image>
<view>
<view style="font-size: 32rpx;color: black;margin-left: 20rpx;">用户ID：{{userBean.idcode}}</view>
</view>
<!-- <button text="微信用户一键登录" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">123123</button> -->
</view>
<view v-if="userBean.showVipInner && os === 'android' "
style="display: flex;flex-direction: row;background: #f5ca86;margin: 20rpx;padding: 40rpx;border-radius:20rpx;align-items: center;justify-content:space-between;">
<view style="display: flex;flex-direction: column;justify-content: center;">
<view style="font-size: 36rpx;color: #5b1500;font-weight: 777;">
{{userBean.expireTime<=0 ? '开通VIP会员' : 'VIP会员'}}
</view>
<view v-if="userBean.expireTime<=0" style="font-size: 30rpx;color: #5b1500;margin-top: 12rpx;">
解锁全部小说
</view>
<view v-else style="font-size: 30rpx;color: #5b1500;margin-top: 12rpx;">
到期时间:{{userBean.expireTime*1000 | formatDate('yyyy-MM-dd')}}
</view>
<view v-if="userBean.expireTime<=0" @click="handleCoinPay"
style="width: 210rpx;height: 60rpx;background-color: #5b1500;border-radius:30rpx;color: white;font-size: 26rpx;justify-content: center;align-items: center;display: flex;padding-bottom: 4rpx;margin-top: 30rpx;">
立即开通
</view>
<view v-else style="width: 210rpx;height: 60rpx;padding-bottom: 4rpx;margin-top: 30rpx;">
</view>
</view>
<image style="border-radius:10rpx; width: 130rpx;height: 100rpx;margin-right: 20rpx;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/bg_my_vip.png" mode="scaleToFill"></image>
</view>
<view v-if="os === 'android' "
style="display: flex;height: 200rpx;margin: 20rpx;background: #f5ca86;border-radius: 20rpx;">
<view style="flex-grow: 2; margin-left: 20rpx;">
<view
style="width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;">
<view style="display: flex;align-items: center;">
<image
style="width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_my_coin.png"></image>
<view style="font-size: 36rpx;font-weight: 777;">书豆充值</view>
</view>
<view style="font-size: 28rpx;color: #5b1500;margin-top: 20rpx;">海量书豆狂洒中,小说等你来解锁</view>
</view>
</view>
<view style="width: 220rpx;">
<view
style="width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;">
<view style="font-size: 30rpx;color: #5b1500;margin-bottom: 20rpx;">{{userBean.point}}</view>
<view @click="handleCoinPay"
style="width: 160rpx;height: 60rpx;background-color: #5b1500;border-radius:30rpx;color: white;font-size: 26rpx;justify-content: center;align-items: center;display: flex;padding-bottom: 4rpx;">
去充值
</view>
</view>
</view>
</view>
<view class="infobg" style="margin: 20rpx;">
<view v-if="userBean.showVipInner && os === 'android' " class="item arrow" @click="handlePayRecord">
我的订单
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view v-if="os === 'android' " class="item arrow" @click="handleDotRecord">
书豆记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view v-if="os === 'android' " class="item arrow" @click="handleUseDotRecord">
消费记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view class="item arrow" @click="handleWatchRecord">
阅读记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view class="item arrow" @click="handlePhone">
联系客服
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
</view>
<view style="display: flex;justify-content: center;margin-top: 20rpx;font-size: 26rpx;color: gray;">
{{ versionName }}
</view>
</z-paging>
<!-- </scroll-view> -->
<coin-popup :show="showAnimate" @close="showAnimate = false" @paySuccess="paySuccess">
</coin-popup>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
getToLocal
} from "@/utils/utils.js"
import {
navigateTo,
message,
alert,
loading
} from '@/utils/fun.js';
import {
openUrl
} from '@/utils/app+.js';
const app = getApp();
export default {
name: 'index',
mixins: [common],
data() {
return {
statusBarHeight: app.globalData.statusBarHeight,
userBean: {},
showAnimate: false,
windowHeight: 0,
os: 'android',
versionName: app.globalData.versionName,
corpid: '', // 企业ID
curl: '', // 客服链接
};
},
methods: {
show() {
// this.os = wx.getSystemInfoSync().platform;
this.windowHeight = uni.getSystemInfoSync().windowHeight
// loadData() {
this.post({
url: '/user/baseMsg',
showLoading: false,
success: ({
data
}) => {
this.userBean = data;
}
});
},
hide() {
},
handleDotRecord() {
// 书豆记录
navigateTo(`/pagesD/dotRecord/dotRecord`)
},
handleUseDotRecord() {
// 书豆消费记录
navigateTo(`/pagesD/useDotRecord/useDotRecord`)
},
handleWatchRecord() {
navigateTo(`/pagesD/watchRecord/watchRecord`)
},
handleCoinPay() {
this.showAnimate = true;
},
handlePayRecord() {
navigateTo(`/pagesD/payRecord/payRecord`)
},
handleVipPay() {
navigateTo(`/pagesA/vipPay/vipPay`)
},
handlePhone() {
// if (this.corpid != '' && this.curl != '') {
// wx.openCustomerServiceChat({
// extInfo: {
// url: this.curl
// },
// corpId: this.corpid,
// success(res) {},
// fail(e) {
// console.log(e)
// }
// })
// } else {
// let that = this
// // 联系我们
// this.post({
// url: '/vedio/customerServiceNumbers',
// showLoading: false,
// success: ({
// data
// }) => {
// let datas = data.customerServiceNumbers.split(',')
// that.corpid = datas[0]
// that.curl = datas[1]
// wx.openCustomerServiceChat({
// extInfo: {
// url: that.curl
// },
// corpId: that.corpid,
// success(res) {},
// fail(e) {
// console.log(e)
// }
// })
// }
// });
// }
wx.makePhoneCall({
phoneNumber: '4000969950',
success: function(res) {
console.log('拨打电话成功！');
},
fail: function(res) {
console.log('拨打电话失败！');
}
})
},
paySuccess(largeType) {
// largeType=vip 开通vip
// largeType=point 购买书豆
if(wx.getSystemInfoSync().platform=='ios'){
message.notify('支付成功');
}
this.post({
url: '/user/baseMsg',
showLoading: false,
success: ({
data
}) => {
this.userBean = data;
}
});
},
getPhoneNumber(e) {
console.log(e.detail.code) // 动态令牌
console.log(e.detail.errMsg) // 回调信息（成功失败都会返回）
console.log(e.detail.errno) // 错误码（失败时返回）
}
}
};
</script>
<style lang="scss">
@import '@/scss/uni.scss';
.body {
background-color: whitesmoke;
}
.avatar {
background-color: #d8d8d8;
width: 100rpx;
height: 100rpx;
border-radius: 50%;
overflow: hidden;
//box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)
}
}
this.post({
url: '/user/baseMsg',
showLoading: false,
success: ({
data
}) => {
this.userBean = data;
}
});
},
getPhoneNumber(e) {
console.log(e.detail.code) // 动态令牌
console.log(e.detail.errMsg) // 回调信息（成功失败都会返回）
console.log(e.detail.errno) // 错误码（失败时返回）
}
}
};
</script>
<style lang="scss">
@import '@/scss/uni.scss';
.body {
background-color: whitesmoke;
}
.avatar {
background-color: #d8d8d8;
width: 100rpx;
height: 100rpx;
border-radius: 50%;
overflow: hidden;
//box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)
}
</style>
\ No newline at end of file
vedio/manifest.json
View file @ a9580391
......@@ -177,7 +177,7 @@
"enable" : true
}
},
"title" : "短剧",
"title" : "小说",
"router" : {
"base" : "./"
},
......
vedio/mixins/share.js
View file @ a9580391
export default {
data() {
return {
share: {
title: '更多好剧，等你来看',
imageUrl: 'https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_movie.png',
path: '/pages/loading?shareId='
}
}
},
onShareAppMessage(res) { //发送给朋友
return {
title: this.share.title,
imageUrl: this.share.imageUrl,
path: this.share.path,
}
},
onShareTimeline(res) { //分享到朋友圈
return {
title: this.share.title,
imageUrl: this.share.imageUrl,
path: this.share.path,
}
},
export default {
data() {
return {
share: {
title: '更多小说，等你来看',
imageUrl: 'https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_movie.png',
path: '/pages/loading?shareId='
}
}
},
onShareAppMessage(res) { //发送给朋友
return {
title: this.share.title,
imageUrl: this.share.imageUrl,
path: this.share.path,
}
},
onShareTimeline(res) { //分享到朋友圈
return {
title: this.share.title,
imageUrl: this.share.imageUrl,
path: this.share.path,
}
},
}
\ No newline at end of file
vedio/pages.json
View file @ a9580391
{
"easycom": {
"^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue",
"autoscan": true,
"custom": {
"^n-(.*)": "@/nPro/$1/$1.vue", // 匹配nPro内的vue文件
"^nx-(.*)": "@/nProX/$1/$1.vue" // 匹配nProX内的vue文件
}
},
"pages": [
// #ifndef APP-PLUS
{
"path": "pages/loading",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#F2F1FF",
"navigationBarTextStyle": "#000000"
}
},
// #endif
{
"path": "pages/home",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "#000000"
}
}, {
"path": "pages/index/index",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "#000000"
}
},
{
"path": "pages/my/my",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "#000000"
}
}, {
"path": "pages/brower/brower",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}, {
"path": "pages/recommend/recommend",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#000000",
"navigationBarTextStyle": "#ffffff"
}
}, {
"path": "pages/recommend/follow",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "#000000"
}
}, {
"path": "pages/recommend/recommendVideo",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#000000",
"navigationBarTextStyle": "#ffffff"
}
}
],
// 分包配置
"subPackages": [{
"root": "pagesA",
"pages": [{
"path": "vipPay/vipPay",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}]
}, {
"root": "pagesC",
"pages": [{
"path": "ttvideo/ttVideoDetail",
{
"easycom": {
"^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue",
"autoscan": true,
"custom": {
"^n-(.*)": "@/nPro/$1/$1.vue", // 匹配nPro内的vue文件
"^nx-(.*)": "@/nProX/$1/$1.vue" // 匹配nProX内的vue文件
}
},
"pages": [
// #ifndef APP-PLUS
{
"path": "pages/loading",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#F2F1FF",
"navigationBarTextStyle": "#000000"
}
},
// #endif
{
"path": "pages/home",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "#000000"
}
}, {
"path": "pages/index/index",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "#000000"
}
},
{
"path": "pages/my/my",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "#000000"
}
}, {
"path": "pages/brower/brower",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}, {
"path": "pages/recommend/recommend",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#000000",
"navigationBarTextStyle": "#ffffff"
}
}, {
"path": "pages/recommend/follow",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "#000000"
}
}, {
"path": "pages/recommend/recommendVideo",
"style": {
"navigationStyle": "default",
"navigationBarBackgroundColor": "#000000",
"navigationBarTextStyle": "#ffffff"
}
}
],
// 分包配置
"subPackages": [{
"root": "pagesA",
"pages": [{
"path": "vipPay/vipPay",
"style": {
"backgroundColor": "#000000",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#000000",
"navigationBarTextStyle": "#ffffff",
"usingComponents ": {
"video-player": "ext://industry/video-player"
}
}
}]
},
{
"root": "pagesD",
"pages": [{
"path": "watchRecord/watchRecord",
"style": {
"navigationBarTitleText": "观看记录",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}, {
"path": "payRecord/payRecord",
"style": {
"navigationBarTitleText": "我的订单",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}, {
"path": "dotRecord/dotRecord",
"style": {
"navigationBarTitleText": "看点记录",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}, {
"path": "useDotRecord/useDotRecord",
"style": {
"navigationBarTitleText": "消费记录",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}]
}
],
// 分包预载配置
"preloadRule": {
// 当我们进入了pages/home页面以后就会预下载pagesA分包
"pages/home": {
"network": "all", //在指定网络下预下载，可选值为：all（不限网络）、wifi（仅wifi下预下载）
"packages": ["pagesA", "pagesC", "pagesD"] //进入页面后预下载分包
},
"pages/recommend/recommend": {
"network": "all", //在指定网络下预下载，可选值为：all（不限网络）、wifi（仅wifi下预下载）
"packages": ["pagesC"] //进入页面后预下载分包
},
"pages/my/my": {
"network": "all", //在指定网络下预下载，可选值为：all（不限网络）、wifi（仅wifi下预下载）
"packages": ["pagesD"] //进入页面后预下载分包
}
},
"globalStyle": {
"backgroundColor": "#f5f5f5",
"navigationStyle": "default",
"app-plus": {
"bounce": "none",
"scrollIndicator": "none"
}
},
"condition": { //模式配置，仅开发期间生效
"current": 0, //当前激活的模式(list 的索引项)
"list": [{
"name": "", //模式名称
"path": "", //启动页面，必选
"query": "" //启动参数，在页面的onLoad函数里面得到
}]
}
"navigationStyle": "default",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}]
}, {
"root": "pagesC",
"pages": [{
"path": "ttvideo/ttVideoDetail",
"style": {
"backgroundColor": "#000000",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#000000",
"navigationBarTextStyle": "#ffffff",
"usingComponents ": {
"video-player": "ext://industry/video-player"
}
}
}]
},
{
"root": "pagesD",
"pages": [{
"path": "watchRecord/watchRecord",
"style": {
"navigationBarTitleText": "阅读记录",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}, {
"path": "payRecord/payRecord",
"style": {
"navigationBarTitleText": "我的订单",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}, {
"path": "dotRecord/dotRecord",
"style": {
"navigationBarTitleText": "书豆记录",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}, {
"path": "useDotRecord/useDotRecord",
"style": {
"navigationBarTitleText": "消费记录",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}]
}
],
// 分包预载配置
"preloadRule": {
// 当我们进入了pages/home页面以后就会预下载pagesA分包
"pages/home": {
"network": "all", //在指定网络下预下载，可选值为：all（不限网络）、wifi（仅wifi下预下载）
"packages": ["pagesA", "pagesC", "pagesD"] //进入页面后预下载分包
},
"pages/recommend/recommend": {
"network": "all", //在指定网络下预下载，可选值为：all（不限网络）、wifi（仅wifi下预下载）
"packages": ["pagesC"] //进入页面后预下载分包
},
"pages/my/my": {
"network": "all", //在指定网络下预下载，可选值为：all（不限网络）、wifi（仅wifi下预下载）
"packages": ["pagesD"] //进入页面后预下载分包
}
},
"globalStyle": {
"backgroundColor": "#f5f5f5",
"navigationStyle": "default",
"app-plus": {
"bounce": "none",
"scrollIndicator": "none"
}
},
"condition": { //模式配置，仅开发期间生效
"current": 0, //当前激活的模式(list 的索引项)
"list": [{
"name": "", //模式名称
"path": "", //启动页面，必选
"query": "" //启动参数，在页面的onLoad函数里面得到
}]
}
}
\ No newline at end of file
vedio/pages/loading.vue
View file @ a9580391
......@@ -5,7 +5,7 @@
<view style="color: #A231EF;margin-top: 10rpx;font-size: 40rpx;font-size: 40rpx;">欢迎使用</view>
<view style="bottom: 0;position: absolute;">
<image style="width: 540rpx;height: 644rpx;display: flex;align-items: center;margin-bottom: 30%;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_splash.png" mode="scaleToFill">
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/book_bg_splash.png" mode="scaleToFill">
</image>
</view>
......@@ -40,6 +40,7 @@
},
onLoad(options) {
this.tips1 = options.tips1
this.appName = '幻墨小说阁'
},
onShow(options) {
......
vedio/pages/recommend/recommendVideo.vue
View file @ a9580391
<template>
<view class="body">
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true" duration="300">
<swiper-item v-for="(list, index) in displaySwiperList" :key="index">
<view v-if="Math.abs(displayIndex-index)==0" style="height: 100%;" @click="tapVideoHover()">
<!-- <video v-if="Math.abs(displayIndex-index)==0" :id="''+list.vedioId" :controls="controls"
:autoplay="true" :isplay="true" play-btn-position="center" :loop="!isplay" @ended="ended"
@controlstoggle="controlstoggle" :show-fullscreen-btn="false" :poster="list.coverImage"
:show-loading="true" @click="tapVideoHover()" :enable-progress-gesture="false" class="tsvideo"
:src="list.recommendUrl" object-fit="cover" /> -->
<tt-video-player v-if="Math.abs(displayIndex-index)==0" :id="list.vedioId"
:album-id="list.douyinAlbumId" :episode-id="list.douyinEpisodeId" :cloud-type="1" version="1"
object-fit="contain" :controls="controls" :poster="data.coverImage" :loop="!isplay"
:autoplay="true" :enable-progress-gesture="false" :show-loading="true" @play="startPlay"
:show-fullscreen-btn="false" @controlstoggle="controlstoggle" @ended="ended" />
</view>
<view v-if="!isqp" class="userInfo flex">
<!-- 点赞 -->
<view class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image @click.stop="collect(list.vedioId,index)" v-if="list.collect==0"
src="@/static/home_collect_img_0.png" />
<image @click.stop="cancelCollect(list.vedioId,index)" v-if="list.collect==1"
src="@/static/home_collect_img_1.png" />
<text
style="margin-top: 110rpx;color: #FFFFFF;font-size: 26rpx; text-align: center;font-weight: bold;"
:class="{'likeNumActive':list.collect!=0}">{{list.hot}}</text>
</view>
<!-- 分享 -->
<view v-show="false" class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image src="@/static/video/share-fill.png" />
<text
style="margin-top: 110rpx; color: #FFFFFF;font-size: 26rpx; text-align: center; font-weight: bold;">分享</text>
<button open-type="share"
style="position: absolute;;background: none; width: 80rpx; height: 80rpx; right: 10rpx;"
@click.stop="reShare"></button>
</view>
</view>
<!-- 最底下的文字部分 -->
<view v-if="!isqp" class="contentcd flex" @click.stop="detail(list)">
<text class="userName">{{list.title}}</text>
<text class="words">{{'第'+list.recommendIndex+'集'}}</text>
<view class="wordss2">
<image src="@/static/video/layers.png" />
<text
class="wordss">{{'共'+list.vedioTotal+'集' + ((list.completeStatus==0)?' 已完结':' 更新中')}}</text>
<text class="wordsss">{{(list.completeStatus==0)?'下一集':'看全部'}}</text>
</view>
</view>
</swiper-item>
</swiper>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
navigateTo,
} from '@/utils/fun.js';
let audo = uni.createInnerAudioContext()
export default {
name: "recommendVideo",
mixins: [common],
data() {
return {
controls: false, // 控制按钮
originList: [], // 源数据
displaySwiperList: [], // swiper需要的数据
displayIndex: 0, // 用于显示swiper的真正的下标数值只有：0，1，2。
originIndex: 0, // 记录源数据的下标
windowWidth: 0,
windowHeight: 0,
current: 0,
oid: 0,
isplay: true, // 是否自动播放下一个视频
playCount: 2, // 剩余多少视频加载视频列表
isqp: false, // 是否全屏
urls: "https://xjc.demo.hongcd.com/api/video/videoRecommend?page=1&uid=0",
isFirstLoad: true,
videoContext: null
}
},
onLoad(e) {
this.windowWidth = uni.getSystemInfoSync().windowWidth
this.windowHeight = uni.getSystemInfoSync().windowHeight
},
methods: {
reShare() {
var href = ''
// #ifdef H5
uni.setClipboardData({
data: href,
complete() {
uni.showToast({
title: "分享连接已复制到剪贴板"
})
}
})
// #endif
// #ifdef MP-WEIXIN
// #endif
// #ifdef APP-PLUS
uni.share({
provider: "weixin",
scene: "WXSenceTimeline",
type: 0,
href: href,
title: '分享标题',
summary: '分享总结',
imageUrl: '',
success: function(res) {
console.log("success:" + JSON.stringify(res));
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
},
})
// #endif
},
show() {
if (this.isFirstLoad) {
this.isFirstLoad = false
this.queryList()
} else {
this.videoContext?.play()
}
},
stop() {
// audo.pause()
this.videoContext?.pause()
},
queryList() {
// 推荐
this.post({
url: '/vedio/autoList',
showLoading: false,
success: ({
data
}) => {
var msg = data.list
for (let i = 0; i < msg.length; i++) {
this.originList.push(msg[i])
}
this.initSwiperData();
}
});
},
tapVideoHover() {
if (this.controls) return
this.isqp = true
this.controls = true
<template>
<view class="body">
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true" duration="300">
<swiper-item v-for="(list, index) in displaySwiperList" :key="index">
<view v-if="Math.abs(displayIndex-index)==0" style="height: 100%;" @click="tapVideoHover()">
<!-- <video v-if="Math.abs(displayIndex-index)==0" :id="''+list.vedioId" :controls="controls"
:autoplay="true" :isplay="true" play-btn-position="center" :loop="!isplay" @ended="ended"
@controlstoggle="controlstoggle" :show-fullscreen-btn="false" :poster="list.coverImage"
:show-loading="true" @click="tapVideoHover()" :enable-progress-gesture="false" class="tsvideo"
:src="list.recommendUrl" object-fit="cover" /> -->
<tt-video-player v-if="Math.abs(displayIndex-index)==0" :id="list.vedioId"
:album-id="list.douyinAlbumId" :episode-id="list.douyinEpisodeId" :cloud-type="1" version="1"
object-fit="contain" :controls="controls" :poster="data.coverImage" :loop="!isplay"
:autoplay="true" :enable-progress-gesture="false" :show-loading="true" @play="startPlay"
:show-fullscreen-btn="false" @controlstoggle="controlstoggle" @ended="ended" />
</view>
<view v-if="!isqp" class="userInfo flex">
<!-- 点赞 -->
<view class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image @click.stop="collect(list.vedioId,index)" v-if="list.collect==0"
src="@/static/home_collect_img_0.png" />
<image @click.stop="cancelCollect(list.vedioId,index)" v-if="list.collect==1"
src="@/static/home_collect_img_1.png" />
<text
style="margin-top: 110rpx;color: #FFFFFF;font-size: 26rpx; text-align: center;font-weight: bold;"
:class="{'likeNumActive':list.collect!=0}">{{list.hot}}</text>
</view>
<!-- 分享 -->
<view v-show="false" class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image src="@/static/video/share-fill.png" />
<text
style="margin-top: 110rpx; color: #FFFFFF;font-size: 26rpx; text-align: center; font-weight: bold;">分享</text>
<button open-type="share"
style="position: absolute;;background: none; width: 80rpx; height: 80rpx; right: 10rpx;"
@click.stop="reShare"></button>
</view>
</view>
<!-- 最底下的文字部分 -->
<view v-if="!isqp" class="contentcd flex" @click.stop="detail(list)">
<text class="userName">{{list.title}}</text>
<text class="words">{{'第'+list.recommendIndex+'集'}}</text>
<view class="wordss2">
<image src="@/static/video/layers.png" />
<text
class="wordss">{{'共'+list.vedioTotal+'集' + ((list.completeStatus==0)?' 已完结':' 更新中')}}</text>
<text class="wordsss">{{(list.completeStatus==0)?'下一集':'看全部'}}</text>
</view>
</view>
</swiper-item>
</swiper>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
navigateTo,
} from '@/utils/fun.js';
let audo = uni.createInnerAudioContext()
export default {
name: "recommendVideo",
mixins: [common],
data() {
return {
controls: false, // 控制按钮
originList: [], // 源数据
displaySwiperList: [], // swiper需要的数据
displayIndex: 0, // 用于显示swiper的真正的下标数值只有：0，1，2。
originIndex: 0, // 记录源数据的下标
windowWidth: 0,
windowHeight: 0,
current: 0,
oid: 0,
isplay: true, // 是否自动播放下一个视频
playCount: 2, // 剩余多少视频加载视频列表
isqp: false, // 是否全屏
urls: "https://xjc.demo.hongcd.com/api/video/videoRecommend?page=1&uid=0",
isFirstLoad: true,
videoContext: null
}
},
onLoad(e) {
this.windowWidth = uni.getSystemInfoSync().windowWidth
this.windowHeight = uni.getSystemInfoSync().windowHeight
},
methods: {
reShare() {
var href = ''
// #ifdef H5
uni.setClipboardData({
data: href,
complete() {
uni.showToast({
title: "分享连接已复制到剪贴板"
})
}
})
// #endif
// #ifdef MP-WEIXIN
// #endif
// #ifdef APP-PLUS
uni.share({
provider: "weixin",
scene: "WXSenceTimeline",
type: 0,
href: href,
title: '分享标题',
summary: '分享总结',
imageUrl: '',
success: function(res) {
console.log("success:" + JSON.stringify(res));
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
},
})
// #endif
},
show() {
if (this.isFirstLoad) {
this.isFirstLoad = false
this.queryList()
} else {
this.videoContext?.play()
}
},
stop() {
// audo.pause()
this.videoContext?.pause()
},
queryList() {
// 推荐
this.post({
url: '/vedio/autoList',
showLoading: false,
success: ({
data
}) => {
var msg = data.list
for (let i = 0; i < msg.length; i++) {
this.originList.push(msg[i])
}
this.initSwiperData();
}
});
},
tapVideoHover() {
if (this.controls) return
this.isqp = true
this.controls = true
},
startPlay() {
if (tt.canIUse('preloadResourceVideo')) {
......@@ -176,271 +176,271 @@
cloudType: 1,
version: 1,
success: () => {
console.log("短剧预加载成功" + this.displaySwiperList[preIndex].douyinEpisodeId);
console.log("小说预加载成功" + this.displaySwiperList[preIndex].douyinEpisodeId);
},
fail: (error) => {
console.log("短剧预加载失败", error);
console.log("小说预加载失败", error);
},
});
},
ended() {
// 1.播放当前视频结束时触发，自动切换下一个视频
if (this.isplay) {
if (this.displayIndex < 2) {
this.current = this.displayIndex + 1
} else {
this.current = 0
}
console.log('显示swiper Index:', this.displayIndex)
}
},
/**
* 初始一个显示的swiper数据
* @originIndex 从源数据的哪个开始显示默认0，如从其他页面跳转进来，要显示第n个，这个参数就是他的下标
*/
initSwiperData(originIndex = this.originIndex) {
console.log('--------当前数据 Index:', originIndex)
const originListLength = this.originList.length; // 源数据长度
const displayList = [];
displayList[this.displayIndex] = this.originList[originIndex];
displayList[this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1] =
this.originList[
originIndex - 1 == -1 ? originListLength - 1 : originIndex - 1
];
displayList[this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1] =
this.originList[
originIndex + 1 == originListLength ? 0 : originIndex + 1
];
this.displaySwiperList = displayList;
if (this.oid >= this.originList.length) {
this.oid = 0
}
if (this.oid < 0) {
this.oid = this.originList.length - 1
}
console.log('++++++++++++上一条播放数据 Index:', this.oid)
// audo.pause()
this.videoContext = uni.createVideoContext("" + this.originList[this.oid].vedioId, this)
this.videoContext.pause()
this.videoContext.stop()
setTimeout(() => {
console.log('qqqqqq:', this.originList[originIndex].vedioId)
this.videoContext = uni.createVideoContext("" + this.originList[originIndex].vedioId, this)
this.videoContext.play()
}, 500)
var pCount = this.originList.length - this.playCount
if (originIndex == pCount) {
this.queryList()
}
},
/**
* swiper滑动时候
*/
swiperChange(event) {
const {
current
} = event.detail;
const originListLength = this.originList.length; // 源数据长度
// =============向后==========
if (this.displayIndex - current == 2 || this.displayIndex - current == -1) {
this.originIndex =
this.originIndex + 1 == originListLength ? 0 : this.originIndex + 1;
this.displayIndex = this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1;
//console.log('+++',this.originIndex)
this.oid = this.originIndex - 1
this.initSwiperData(this.originIndex);
}
// ======如果两者的差为-2或者1则是向前滑动============
else if (this.displayIndex - current == -2 || this.displayIndex - current == 1) {
this.originIndex = this.originIndex - 1 == -1 ? originListLength - 1 : this.originIndex - 1;
this.displayIndex = this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1;
//console.log('---',this.originIndex)
this.oid = this.originIndex + 1
this.initSwiperData(this.originIndex);
}
this.controls = false
this.isqp = false
},
controlstoggle(e) {
if (!this.controls) return
this.isqp = e.detail.show
},
detail(detail) {
navigateTo(`/pagesC/video/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(detail)) +
`&playNext=1`)
},
collect(vedioId, index) {
this.originList[index].collect = 1
// 收藏
this.post({
url: '/vedio/collect',
data: {
vedioId
},
showLoading: false,
success: ({
data
}) => {
uni.showToast({
title: "收藏成功"
})
}
});
},
cancelCollect(vedioId, index) {
this.originList[index].collect = 0
// 取消收藏
this.post({
url: '/vedio/cancelCollect',
data: {
vedioId
},
showLoading: false,
success: ({
data
}) => {
uni.showToast({
title: "取消收藏"
})
}
});
},
loginTips() {
uni.showModal({
title: '温馨提示',
content: '请先登录',
showCancel: true,
confirmText: "登录",
success: function(res) {
if (res.confirm) {
} else if (res.cancel) {
}
}
});
},
}
}
</script>
<style lang="scss" scoped>
.body {
background: #000000;
width: 100%;
height: 100%;
}
.swiper {
height: 100%;
}
.userInfo {
position: absolute;
z-index: 99;
bottom: 30%;
right: 10px;
width: 90rpx;
flex-direction: column;
image {
width: 70rpx;
height: 70rpx;
position: absolute;
right: 10rpx;
}
}
.likeIco,
.shareIco {
width: 60rpx;
height: 60rpx;
margin-top: 15px;
}
.likeNum,
.shareTex {
color: #ffffff;
font-size: 30rpx;
text-align: center;
margin: 5px;
}
.likeNumActive {
color: red;
}
.contentcd {
z-index: 99;
width: 100%;
position: absolute;
bottom: 0;
color: #ffffff;
flex-direction: column;
align-items: flex-start;
}
.userName {
font-size: 36rpx;
color: #ffffff;
margin-left: 10rpx;
}
.wordss {
font-size: 30rpx;
color: #ffffff;
margin-left: 10rpx;
}
.wordss2 {
width: 100%;
height: 80rpx;
opacity: 0.6;
background: black;
display: flex;
flex-direction: row;
align-items: center;
margin-top: 20rpx;
image {
margin-left: 10rpx;
width: 30rpx;
height: 30rpx;
}
.wordsss {
margin-right: 10rpx;
margin-left: auto;
font-size: 26rpx;
color: #ffffff;
padding: 4rpx 12rpx;
border-radius: 30rpx;
background: darkgrey;
}
}
.words {
margin-top: 20rpx;
margin-left: 10rpx;
font-size: 30rpx;
color: #ffffff;
}
.tsvideo {
width: 100%;
height: 100%;
animation: showDivAni 1s 1;
}
@keyframes showDivAni {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
},
ended() {
// 1.播放当前视频结束时触发，自动切换下一个视频
if (this.isplay) {
if (this.displayIndex < 2) {
this.current = this.displayIndex + 1
} else {
this.current = 0
}
console.log('显示swiper Index:', this.displayIndex)
}
},
/**
* 初始一个显示的swiper数据
* @originIndex 从源数据的哪个开始显示默认0，如从其他页面跳转进来，要显示第n个，这个参数就是他的下标
*/
initSwiperData(originIndex = this.originIndex) {
console.log('--------当前数据 Index:', originIndex)
const originListLength = this.originList.length; // 源数据长度
const displayList = [];
displayList[this.displayIndex] = this.originList[originIndex];
displayList[this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1] =
this.originList[
originIndex - 1 == -1 ? originListLength - 1 : originIndex - 1
];
displayList[this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1] =
this.originList[
originIndex + 1 == originListLength ? 0 : originIndex + 1
];
this.displaySwiperList = displayList;
if (this.oid >= this.originList.length) {
this.oid = 0
}
if (this.oid < 0) {
this.oid = this.originList.length - 1
}
console.log('++++++++++++上一条播放数据 Index:', this.oid)
// audo.pause()
this.videoContext = uni.createVideoContext("" + this.originList[this.oid].vedioId, this)
this.videoContext.pause()
this.videoContext.stop()
setTimeout(() => {
console.log('qqqqqq:', this.originList[originIndex].vedioId)
this.videoContext = uni.createVideoContext("" + this.originList[originIndex].vedioId, this)
this.videoContext.play()
}, 500)
var pCount = this.originList.length - this.playCount
if (originIndex == pCount) {
this.queryList()
}
},
/**
* swiper滑动时候
*/
swiperChange(event) {
const {
current
} = event.detail;
const originListLength = this.originList.length; // 源数据长度
// =============向后==========
if (this.displayIndex - current == 2 || this.displayIndex - current == -1) {
this.originIndex =
this.originIndex + 1 == originListLength ? 0 : this.originIndex + 1;
this.displayIndex = this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1;
//console.log('+++',this.originIndex)
this.oid = this.originIndex - 1
this.initSwiperData(this.originIndex);
}
// ======如果两者的差为-2或者1则是向前滑动============
else if (this.displayIndex - current == -2 || this.displayIndex - current == 1) {
this.originIndex = this.originIndex - 1 == -1 ? originListLength - 1 : this.originIndex - 1;
this.displayIndex = this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1;
//console.log('---',this.originIndex)
this.oid = this.originIndex + 1
this.initSwiperData(this.originIndex);
}
this.controls = false
this.isqp = false
},
controlstoggle(e) {
if (!this.controls) return
this.isqp = e.detail.show
},
detail(detail) {
navigateTo(`/pagesC/video/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(detail)) +
`&playNext=1`)
},
collect(vedioId, index) {
this.originList[index].collect = 1
// 收藏
this.post({
url: '/vedio/collect',
data: {
vedioId
},
showLoading: false,
success: ({
data
}) => {
uni.showToast({
title: "收藏成功"
})
}
});
},
cancelCollect(vedioId, index) {
this.originList[index].collect = 0
// 取消收藏
this.post({
url: '/vedio/cancelCollect',
data: {
vedioId
},
showLoading: false,
success: ({
data
}) => {
uni.showToast({
title: "取消收藏"
})
}
});
},
loginTips() {
uni.showModal({
title: '温馨提示',
content: '请先登录',
showCancel: true,
confirmText: "登录",
success: function(res) {
if (res.confirm) {
} else if (res.cancel) {
}
}
});
},
}
}
</script>
<style lang="scss" scoped>
.body {
background: #000000;
width: 100%;
height: 100%;
}
.swiper {
height: 100%;
}
.userInfo {
position: absolute;
z-index: 99;
bottom: 30%;
right: 10px;
width: 90rpx;
flex-direction: column;
image {
width: 70rpx;
height: 70rpx;
position: absolute;
right: 10rpx;
}
}
.likeIco,
.shareIco {
width: 60rpx;
height: 60rpx;
margin-top: 15px;
}
.likeNum,
.shareTex {
color: #ffffff;
font-size: 30rpx;
text-align: center;
margin: 5px;
}
.likeNumActive {
color: red;
}
.contentcd {
z-index: 99;
width: 100%;
position: absolute;
bottom: 0;
color: #ffffff;
flex-direction: column;
align-items: flex-start;
}
.userName {
font-size: 36rpx;
color: #ffffff;
margin-left: 10rpx;
}
.wordss {
font-size: 30rpx;
color: #ffffff;
margin-left: 10rpx;
}
.wordss2 {
width: 100%;
height: 80rpx;
opacity: 0.6;
background: black;
display: flex;
flex-direction: row;
align-items: center;
margin-top: 20rpx;
image {
margin-left: 10rpx;
width: 30rpx;
height: 30rpx;
}
.wordsss {
margin-right: 10rpx;
margin-left: auto;
font-size: 26rpx;
color: #ffffff;
padding: 4rpx 12rpx;
border-radius: 30rpx;
background: darkgrey;
}
}
.words {
margin-top: 20rpx;
margin-left: 10rpx;
font-size: 30rpx;
color: #ffffff;
}
.tsvideo {
width: 100%;
height: 100%;
animation: showDivAni 1s 1;
}
@keyframes showDivAni {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
</style>
\ No newline at end of file
vedio/pagesC/ttvideo/ttVideoDetail.vue
View file @ a9580391
<template>
<view style="width: 100%;height: 100%;background-color: #000000;">
<!-- <status-title style="position: absolute;" iconColor="white" :showBack="true" /> -->
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true" :duration="duration">
<swiper-item style="background-color: #000;" v-for="(list, index) in displaySwiperList" :key="index"
@click="tapVides()">
<block>
<tt-video-player v-if="Math.abs(displayIndex-index)==0" :id="list.vedioIndex"
:album-id="list.douyinAlbumId" :episode-id="list.douyinEpisodeId" :cloud-type="1" version="1"
object-fit="contain" :controls="controls" :poster="data.coverImage" :loop="!isplay"
:autoplay="!list.lock" :enable-progress-gesture="false" :show-loading="true" @play="startPlay"
:show-fullscreen-btn="false" @controlstoggle="controlstoggle" @timeupdate="timeUpdate"
@ended="ended" />
<!-- <video v-if="!canUseTTPlayer && Math.abs(displayIndex-index)==0" :id="list.vedioIndex"
@ended="ended" :controls="controls" :loop="!isplay" :enable-progress-gesture="false"
:show-loading="true" :show-fullscreen-btn="false" @controlstoggle="controlstoggle"
:poster="data.coverImage" @timeupdate="timeupdate" :autoplay="!list.lock" :src="list.vedioUrl"
class="tsvideo" play-btn-position="center" object-fit="contain" /> -->
<view v-if="originList[originIndex].lock || !list.vedioUrl" class="videoHover tsimg"
@click.stop="tapVideoHover(index,list.pays)"
:style="'width: '+ windowWidth +'px; height:'+100+'%;'">
<image :src="data.coverImage"
:style="'width: 100%; height:'+100+'%; background-color: #000; position: absolute;'"
mode="aspectFit" />
<image class="playState" src="@/static/video/play.png" />
</view>
</block>
</swiper-item>
</swiper>
<view v-if="!isqp" class="userInfo">
<!-- 点赞 -->
<view class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image @click.stop="collect(data.vedioId,index)" v-if="data.collect==0"
src="@/static/home_collect_img_0.png" />
<image @click.stop="cancelCollect(data.vedioId,index)" v-if="data.collect==1"
src="@/static/home_collect_img_1.png" />
<text style="margin: 0 auto;margin-top: 120rpx;color: #FFFFFF;font-size: 26rpx;font-weight: bold;"
:class="{'likeNumActive':data.collect!=0}">{{data.hot}}</text>
</view>
<!-- 分享 -->
<view v-show="false" class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image src="@/static/video/share-fill.png" />
<text
style="margin: 0 auto;margin-top: 110rpx; color: #FFFFFF;font-size: 26rpx; font-weight: bold;">分享</text>
<button open-type="share"
style="position: absolute;;background: none; width: 80rpx; height: 80rpx; right: 10rpx;"
@click.stop="reShare" />
</view>
</view>
<!-- 最底下的文字部分 -->
<view v-if="!isqp" class="contentcd flex">
<text class="userName">{{data.title}}</text>
<text class="words">{{'第'+Number(originIndex+1)+'集'}}</text>
<view class="wordss2" @click.stop="sellxj()">
<image src="@/static/video/layers.png" />
<text class="wordss">{{'共'+data.vedioTotal+'集' + ((data.completeStatus==0)?' 已完结':' 更新中')}}</text>
<image class="wordsss" src="@/static/up.png" />
</view>
</view>
<episodePopup ref="episodePopup" @selectVideo="selectThisVideo" :windowWidth="windowWidth"
:windowHeight="windowHeight" :tabIndex="tabIndex" :tabs="tabs" :subList="subList" :originList="originList"
:originIndex="originIndex" />
<coin-popup :show="showCoinPop" :point="data.point" :vedioId="data.vedioId" @close="showCoinPop = false"
@clickClose="coinPopupClose" @paySuccess="paySuccess" />
<ad-popup :show="showAdPop" @close="adPopupClose" :vedioIndex="originIndex" />
</view>
</template>
<script>
import {
REWARD_ID
} from "@/utils/adConstant.js"
import common from '@/mixins/common';
import {
getSubList
} from "@/utils/utils.js"
import adPopup from '@/components/ad-popup/ad-popup.vue';
import coinPopup from '@/components/coin-popup/coin-popup.vue';
import episodePopup from '@/components/episode-popup/episode-popup.vue';
import ttVideoPlayer from '@/ttcomponents/tt-video-player'
import {
navigateTo,
} from '@/utils/fun.js';
import {
data
} from '../../uni_modules/uview-ui/libs/mixin/mixin';
export default {
name: "ttVideoDetail",
mixins: [common],
components: {
coinPopup,
episodePopup,
adPopup,
ttVideoPlayer
},
data() {
return {
controls: false,
originList: [], // 源数据
displaySwiperList: [], // swiper需要的数据
displayIndex: 0, // 用于显示swiper的真正的下标数值只有：0，1，2。
originIndex: 0, // 记录源数据的下标
windowWidth: 0,
windowHeight: 0,
current: 0, // swiper 下标
oid: 0,
isplay: true, //是否自动播放下一个视频
duration: 500,
isqp: false,
safeArea: 0,
ttuop: 0,
data: {},
isPlayNext: 0,
tabIndex: 0,
tabs: [],
subList: [],
showTap: false,
showCoinPop: false,
showAdPop: false,
showAdForServer: false,
vipBackPage: '',
canUseTTPlayer: true,
};
},
onLoad(options) {
this.data = JSON.parse(decodeURIComponent(options.data));
if (decodeURIComponent(options.isPlayNext) != undefined) {
this.isPlayNext = decodeURIComponent(options.isPlayNext);
}
uni.getSystemInfo({
success: res => {
this.safeArea = res.safeAreaInsets.bottom;
}
})
// #ifdef MP-TOUTIAO
this.canUseTTPlayer = tt.canIUse('video-player')
this.ttuop = 64
// #endif
this.getData()
this.preloadAd()
},
onShow() {
// 从VIP页面返回关闭弹框
// this.$refs.episodePopup.down();
this.windowWidth = uni.getSystemInfoSync().windowWidth
this.windowHeight = uni.getSystemInfoSync().windowHeight - this.safeArea - this.ttuop
let showFollowMask = uni.getStorageSync('show-follow-mask') || '';
if (showFollowMask != '1' && showFollowMask != '2') {
uni.setStorage({
key: 'show-follow-mask',
data: '1'
});
}
this.post({
url: '/vedio/confs',
showLoading: false,
success: ({
data
}) => {
this.showAdForServer = data.douyinAdTipOpen;
}
});
},
// 分享
// onShareAppMessage() {
// let result = {
// title: this.data.title,
// imageUrl: this.data.coverImage,
// path: `/pageC/ttvideo/ttVideoDetail?bookId=${this.bookData.id}`
// }
// return result;
// },
methods: {
startPlay() {
if (tt.canIUse('preloadResourceVideo')) {
this.preloadplaylet()
}
},
preloadplaylet() {
var preIndex = 0
if (this.displayIndex < 2) {
preIndex = this.displayIndex + 1
} else {
preIndex = 0
}
// 抖音预加载
tt.preloadResourceVideo({
albumId: this.displaySwiperList[preIndex].douyinAlbumId,
episodeId: this.displaySwiperList[preIndex].douyinEpisodeId,
cloudType: 1,
version: 1,
success: () => {
console.log("短剧预加载成功" + this.displaySwiperList[preIndex].douyinEpisodeId);
},
fail: (error) => {
console.log("短剧预加载失败", error);
},
});
},
paySuccess(largeType) {
// largeType=vip 开通vip
// largeType=point 购买看点
// largeType=curVedio 解锁当前剧所有集
if (largeType == 'vip') {
this.vipBackPage = this.originIndex
this.getData()
} else if (largeType == 'point') {
this.unlock(this.originIndex)
} else {
this.vipBackPage = this.originIndex
this.getData()
}
},
showPayDialog() {
// let isIOS = wx.getSystemInfoSync().platform;
// if (isIOS === 'ios') {
// uni.showToast({
// title: '暂不支持IOS系统',
// icon: 'none'
// })
// return
// }
this.$nextTick(() => {
// 延迟渲染，否则位置错乱
this.showCoinPop = true
})
},
govip() {
navigateTo(`/pagesA/vipPay/vipPay`)
},
timeupdate(event) {},
selectThisVideo(index) {
if (this.originIndex == index) {
return
}
this.oid = this.originIndex
this.duration = 20;
this.originIndex = index
this.initSwiperData(this.originIndex);
setTimeout(() => {
this.duration = 500;
}, 500)
},
sellxj() {
this.$refs.episodePopup.show();
this.$nextTick(() => {
this.tabIndex = parseInt(this.originIndex / 30)
// 延迟渲染，否则位置错乱
})
},
tapVideoHover(index, pays) {
if (this.originList[this.originIndex].lock) {
this.unlock(this.originIndex)
}
},
tapVides() {
if (this.controls) return
this.isqp = true
this.controls = true
},
unlock(num) {
let that = this
this.post({
url: '/vedio/unlock',
data: {
vedioId: this.data.vedioId,
num: (num + 1)
},
showLoading: false,
success: ({
data
}) => {
uni.showToast({
title: data.msg,
icon: 'none'
})
if (data.code == 200) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 301) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 302) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 303) {
that.showPayDialog()
}
}
});
},
getData() {
let that = this
this.originList = []
this.post({
url: '/vedio/getIndexList',
data: {
vedioId: this.data.vedioId
},
showLoading: false,
success: ({
data
}) => {
that.originList = data.list
if (that.vipBackPage != '') {
that.originIndex = that.vipBackPage
that.vipBackPage = ''
} else {
if (that.isPlayNext == 1) {
that.originIndex = that.data.recommendIndex - 1
} else {
that.originIndex = that.data.seeIndex - 1
}
if (that.originIndex >= that.data.vedioTotal || that.originIndex < 0) {
that.originIndex = 0
}
}
that.data = data.vedioMsg
that.initSwiperData(that.originIndex);
that.initEpisode()
}
});
},
ended() {
// 1.播放当前视频结束时触发，自动切换下一个视频
if (this.isplay) {
if (this.displayIndex < 2) {
this.current = this.displayIndex + 1
} else {
this.current = 0
}
console.log('显示swiper Index:', this.displayIndex)
}
},
/**
* 初始一个显示的swiper数据
* @originIndex 从源数据的哪个开始显示默认0，如从其他页面跳转进来，要显示第n个，这个参数就是他的下标
*/
initSwiperData(originIndex = this.originIndex) {
console.log('--------当前数据 Index:', originIndex)
const originListLength = this.originList.length; // 源数据长度
const displayList = [];
displayList[this.displayIndex] = this.originList[originIndex];
displayList[this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1] =
this.originList[
originIndex - 1 == -1 ? originListLength - 1 : originIndex - 1
];
displayList[this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1] =
this.originList[
originIndex + 1 == originListLength ? 0 : originIndex + 1
];
this.displaySwiperList = displayList;
console.log(this.displaySwiperList)
if (this.oid >= this.originList.length) {
this.oid = 0
}
if (this.oid < 0) {
this.oid = this.originList.length - 1
}
console.log('++++++++++++上一条播放数据 Index:', this.oid)
tt.createVideoContext('' + this.originList[this.oid].vedioIndex, this).pause();
if (this.originList[originIndex].lock) {
this.unlock(this.originIndex)
} else {
setTimeout(() => {
tt.createVideoContext('' + this.originList[originIndex].vedioIndex, this).play();
this.commitVideo()
}, 500)
}
},
/**
* swiper滑动时候
*/
swiperChange(event) {
const {
current
} = event.detail;
const originListLength = this.originList.length; // 源数据长度
// =============向后==========
if (this.displayIndex - current == 2 || this.displayIndex - current == -1) {
this.originIndex =
this.originIndex + 1 == originListLength ? 0 : this.originIndex + 1;
this.displayIndex = this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1;
console.log('+++', this.originIndex)
this.oid = this.originIndex - 1
this.initSwiperData(this.originIndex);
}
// ======如果两者的差为-2或者1则是向前滑动============
else if (this.displayIndex - current == -2 || this.displayIndex - current == 1) {
this.originIndex = this.originIndex - 1 == -1 ? originListLength - 1 : this.originIndex - 1;
this.displayIndex = this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1;
console.log('---', this.originIndex)
this.oid = this.originIndex + 1
this.initSwiperData(this.originIndex);
}
this.controls = false
this.isqp = false
},
initEpisode() {
this.subList = []
this.tabs = []
this.subList = getSubList(30, this.originList)
for (let i = 0; i < this.subList.length; i++) {
this.tabs.push({
name: Number(1 + (i % 30 * 30)) + "-" + Number(this.subList[i].length + (i % 30 *
30)),
})
}
},
controlstoggle(e) {
if (!this.controls) return
this.isqp = e.detail.show
},
collect(vedioId, index) {
this.data.collect = 1
// 收藏
this.post({
url: '/vedio/collect',
data: {
vedioId
},
showLoading: false,
success: ({
data
}) => {}
});
},
cancelCollect(vedioId, index) {
this.data.collect = 0
// 取消收藏
this.post({
url: '/vedio/cancelCollect',
data: {
vedioId
},
showLoading: false,
success: ({
data
}) => {}
});
},
commitVideo() {
// 提交后台
let that = this
this.post({
url: '/vedio/reportIndex',
data: {
vedioIndex: this.originList[this.originIndex].vedioIndex,
vedioId: this.data.vedioId
},
showLoading: false,
success: ({
data
}) => {}
});
},
preloadAd() {
let that = this
// 创建实例
this.ad = tt.createRewardedVideoAd({
adUnitId: REWARD_ID,
});
// 监听错误
this.ad.onError((err) => {
uni.hideLoading();
uni.showToast({
title: "网络太火爆了，请稍候重试"
})
switch (err.errCode) {
case 1004:
// 无合适的广告
break;
default:
// 更多请参考错误码文档
}
that.$nextTick(() => {
// 延迟渲染，否则位置错乱
that.showCoinPop = true
})
});
// 监听视频播放完成
this.ad.onClose((data) => {
uni.hideLoading();
if (data.isEnded) {
uni.showToast({
title: "正在为您解锁剧集"
})
that.adUnlock(that.originIndex, '')
} else {
uni.showToast({
title: "未观看完整视频"
})
that.$nextTick(() => {
// 延迟渲染，否则位置错乱
that.showCoinPop = true
})
}
});
// do other thing
// 卸载 close 事件监听
// this.ad.offClose(closeHandler);
// 预加载资源
this.ad.load();
},
coinPopupClose() {
if (this.showAdForServer) {
this.showAdPop = true
} else {
this.showCoinPop = false
}
},
adPopupClose() {
this.showAdPop = false
this.playRewardVideo()
},
playRewardVideo() {
// 播放激励视频
uni.showLoading({
title: '广告加载中'
});
this.ad.show();
},
adUnlock(num, ecpm) {
let that = this
this.post({
url: '/vedio/unlockByAd',
data: {
adSource: 'csj',
vedioId: this.data.vedioId,
num: (num + 1),
ecpm: ecpm
},
showLoading: false,
success: ({
data
}) => {
uni.showToast({
title: data.msg,
icon: 'none'
})
if (data.code == 200) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 301) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 302) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 303) {
that.showPayDialog()
}
}
});
},
},
};
</script>
<style lang="scss" scoped>
page {
background: #000000;
}
.title {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 60rpx;
}
.swiper {
width: 100%;
height: 94%;
background-color: #000;
}
.videoHover {
position: absolute;
top: 0;
left: 0;
display: flex;
background-color: rgba(0, 0, 0, 0.1);
justify-content: center;
align-items: center;
.tsimg {}
}
.playState {
width: 160rpx;
height: 160rpx;
opacity: 0.2;
}
.userInfo {
position: absolute;
z-index: 99;
bottom: 30%;
right: 10px;
width: 100rpx;
display: flex;
flex-direction: column;
image {
width: 76rpx;
height: 76rpx;
position: absolute;
right: 10rpx;
}
}
.shareIco {
width: 60rpx;
height: 60rpx;
margin-top: 15px;
}
.shareTex {
color: #ffffff;
font-size: 30rpx;
text-align: center;
margin: 5px;
}
.likeNumActive {
color: red;
}
.gdfgjh {
font-size: 30rpx;
font-weight: 600;
line-height: 90rpx;
background: #fff;
border-radius: 18rpx;
padding: 0 20rpx;
text-align: center;
margin-bottom: 50rpx;
margin-left: 50rpx;
margin-right: 50rpx;
}
.tsvideo {
width: 100%;
height: 100%;
animation: showDivAni 1s 1;
}
@keyframes showDivAni {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.tsimg {
// animation: fadenum12 10s 1;
}
.contentcd {
z-index: 99;
left: 4%;
width: 92%;
position: absolute;
bottom: 30rpx;
color: #ffffff;
flex-direction: column;
align-items: flex-start;
}
.userName {
font-size: 36rpx;
color: #ffffff;
margin-left: 10rpx;
}
.wordss {
font-size: 30rpx;
color: #ffffff;
margin-left: 10rpx;
}
.wordss2 {
width: 100%;
height: 6%;
// opacity: 0.8;
// background: black;
display: flex;
flex-direction: row;
align-items: center;
// border-radius: 60rpx;
margin-top: 20rpx;
image {
margin-left: 20rpx;
width: 40rpx;
height: 40rpx;
}
.wordsss {
margin-right: 20rpx;
margin-left: auto;
width: 50rpx;
height: 50rpx;
}
}
.words {
margin-top: 20rpx;
margin-left: 10rpx;
font-size: 30rpx;
color: #ffffff;
}
@keyframes fadenum12 {
0% {
opacity: 1;
}
10% {
opacity: 0.8;
}
100% {
opacity: 0;
}
}
<template>
<view style="width: 100%;height: 100%;background-color: #000000;">
<!-- <status-title style="position: absolute;" iconColor="white" :showBack="true" /> -->
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true" :duration="duration">
<swiper-item style="background-color: #000;" v-for="(list, index) in displaySwiperList" :key="index"
@click="tapVides()">
<block>
<tt-video-player v-if="Math.abs(displayIndex-index)==0" :id="list.vedioIndex"
:album-id="list.douyinAlbumId" :episode-id="list.douyinEpisodeId" :cloud-type="1" version="1"
object-fit="contain" :controls="controls" :poster="data.coverImage" :loop="!isplay"
:autoplay="!list.lock" :enable-progress-gesture="false" :show-loading="true" @play="startPlay"
:show-fullscreen-btn="false" @controlstoggle="controlstoggle" @timeupdate="timeUpdate"
@ended="ended" />
<!-- <video v-if="!canUseTTPlayer && Math.abs(displayIndex-index)==0" :id="list.vedioIndex"
@ended="ended" :controls="controls" :loop="!isplay" :enable-progress-gesture="false"
:show-loading="true" :show-fullscreen-btn="false" @controlstoggle="controlstoggle"
:poster="data.coverImage" @timeupdate="timeupdate" :autoplay="!list.lock" :src="list.vedioUrl"
class="tsvideo" play-btn-position="center" object-fit="contain" /> -->
<view v-if="originList[originIndex].lock || !list.vedioUrl" class="videoHover tsimg"
@click.stop="tapVideoHover(index,list.pays)"
:style="'width: '+ windowWidth +'px; height:'+100+'%;'">
<image :src="data.coverImage"
:style="'width: 100%; height:'+100+'%; background-color: #000; position: absolute;'"
mode="aspectFit" />
<image class="playState" src="@/static/video/play.png" />
</view>
</block>
</swiper-item>
</swiper>
<view v-if="!isqp" class="userInfo">
<!-- 点赞 -->
<view class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image @click.stop="collect(data.vedioId,index)" v-if="data.collect==0"
src="@/static/home_collect_img_0.png" />
<image @click.stop="cancelCollect(data.vedioId,index)" v-if="data.collect==1"
src="@/static/home_collect_img_1.png" />
<text style="margin: 0 auto;margin-top: 120rpx;color: #FFFFFF;font-size: 26rpx;font-weight: bold;"
:class="{'likeNumActive':data.collect!=0}">{{data.hot}}</text>
</view>
<!-- 分享 -->
<view v-show="false" class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image src="@/static/video/share-fill.png" />
<text
style="margin: 0 auto;margin-top: 110rpx; color: #FFFFFF;font-size: 26rpx; font-weight: bold;">分享</text>
<button open-type="share"
style="position: absolute;;background: none; width: 80rpx; height: 80rpx; right: 10rpx;"
@click.stop="reShare" />
</view>
</view>
<!-- 最底下的文字部分 -->
<view v-if="!isqp" class="contentcd flex">
<text class="userName">{{data.title}}</text>
<text class="words">{{'第'+Number(originIndex+1)+'集'}}</text>
<view class="wordss2" @click.stop="sellxj()">
<image src="@/static/video/layers.png" />
<text class="wordss">{{'共'+data.vedioTotal+'集' + ((data.completeStatus==0)?' 已完结':' 更新中')}}</text>
<image class="wordsss" src="@/static/up.png" />
</view>
</view>
<episodePopup ref="episodePopup" @selectVideo="selectThisVideo" :windowWidth="windowWidth"
:windowHeight="windowHeight" :tabIndex="tabIndex" :tabs="tabs" :subList="subList" :originList="originList"
:originIndex="originIndex" />
<coin-popup :show="showCoinPop" :point="data.point" :vedioId="data.vedioId" @close="showCoinPop = false"
@clickClose="coinPopupClose" @paySuccess="paySuccess" />
<ad-popup :show="showAdPop" @close="adPopupClose" :vedioIndex="originIndex" />
</view>
</template>
<script>
import {
REWARD_ID
} from "@/utils/adConstant.js"
import common from '@/mixins/common';
import {
getSubList
} from "@/utils/utils.js"
import adPopup from '@/components/ad-popup/ad-popup.vue';
import coinPopup from '@/components/coin-popup/coin-popup.vue';
import episodePopup from '@/components/episode-popup/episode-popup.vue';
import ttVideoPlayer from '@/ttcomponents/tt-video-player'
import {
navigateTo,
} from '@/utils/fun.js';
import {
data
} from '../../uni_modules/uview-ui/libs/mixin/mixin';
export default {
name: "ttVideoDetail",
mixins: [common],
components: {
coinPopup,
episodePopup,
adPopup,
ttVideoPlayer
},
data() {
return {
controls: false,
originList: [], // 源数据
displaySwiperList: [], // swiper需要的数据
displayIndex: 0, // 用于显示swiper的真正的下标数值只有：0，1，2。
originIndex: 0, // 记录源数据的下标
windowWidth: 0,
windowHeight: 0,
current: 0, // swiper 下标
oid: 0,
isplay: true, //是否自动播放下一个视频
duration: 500,
isqp: false,
safeArea: 0,
ttuop: 0,
data: {},
isPlayNext: 0,
tabIndex: 0,
tabs: [],
subList: [],
showTap: false,
showCoinPop: false,
showAdPop: false,
showAdForServer: false,
vipBackPage: '',
canUseTTPlayer: true,
};
},
onLoad(options) {
this.data = JSON.parse(decodeURIComponent(options.data));
if (decodeURIComponent(options.isPlayNext) != undefined) {
this.isPlayNext = decodeURIComponent(options.isPlayNext);
}
uni.getSystemInfo({
success: res => {
this.safeArea = res.safeAreaInsets.bottom;
}
})
// #ifdef MP-TOUTIAO
this.canUseTTPlayer = tt.canIUse('video-player')
this.ttuop = 64
// #endif
this.getData()
this.preloadAd()
},
onShow() {
// 从VIP页面返回关闭弹框
// this.$refs.episodePopup.down();
this.windowWidth = uni.getSystemInfoSync().windowWidth
this.windowHeight = uni.getSystemInfoSync().windowHeight - this.safeArea - this.ttuop
let showFollowMask = uni.getStorageSync('show-follow-mask') || '';
if (showFollowMask != '1' && showFollowMask != '2') {
uni.setStorage({
key: 'show-follow-mask',
data: '1'
});
}
this.post({
url: '/vedio/confs',
showLoading: false,
success: ({
data
}) => {
this.showAdForServer = data.douyinAdTipOpen;
}
});
},
// 分享
// onShareAppMessage() {
// let result = {
// title: this.data.title,
// imageUrl: this.data.coverImage,
// path: `/pageC/ttvideo/ttVideoDetail?bookId=${this.bookData.id}`
// }
// return result;
// },
methods: {
startPlay() {
if (tt.canIUse('preloadResourceVideo')) {
this.preloadplaylet()
}
},
preloadplaylet() {
var preIndex = 0
if (this.displayIndex < 2) {
preIndex = this.displayIndex + 1
} else {
preIndex = 0
}
// 抖音预加载
tt.preloadResourceVideo({
albumId: this.displaySwiperList[preIndex].douyinAlbumId,
episodeId: this.displaySwiperList[preIndex].douyinEpisodeId,
cloudType: 1,
version: 1,
success: () => {
console.log("小说预加载成功" + this.displaySwiperList[preIndex].douyinEpisodeId);
},
fail: (error) => {
console.log("小说预加载失败", error);
},
});
},
paySuccess(largeType) {
// largeType=vip 开通vip
// largeType=point 购买书豆
// largeType=curVedio 解锁当前剧所有集
if (largeType == 'vip') {
this.vipBackPage = this.originIndex
this.getData()
} else if (largeType == 'point') {
this.unlock(this.originIndex)
} else {
this.vipBackPage = this.originIndex
this.getData()
}
},
showPayDialog() {
// let isIOS = wx.getSystemInfoSync().platform;
// if (isIOS === 'ios') {
// uni.showToast({
// title: '暂不支持IOS系统',
// icon: 'none'
// })
// return
// }
this.$nextTick(() => {
// 延迟渲染，否则位置错乱
this.showCoinPop = true
})
},
govip() {
navigateTo(`/pagesA/vipPay/vipPay`)
},
timeupdate(event) {},
selectThisVideo(index) {
if (this.originIndex == index) {
return
}
this.oid = this.originIndex
this.duration = 20;
this.originIndex = index
this.initSwiperData(this.originIndex);
setTimeout(() => {
this.duration = 500;
}, 500)
},
sellxj() {
this.$refs.episodePopup.show();
this.$nextTick(() => {
this.tabIndex = parseInt(this.originIndex / 30)
// 延迟渲染，否则位置错乱
})
},
tapVideoHover(index, pays) {
if (this.originList[this.originIndex].lock) {
this.unlock(this.originIndex)
}
},
tapVides() {
if (this.controls) return
this.isqp = true
this.controls = true
},
unlock(num) {
let that = this
this.post({
url: '/vedio/unlock',
data: {
vedioId: this.data.vedioId,
num: (num + 1)
},
showLoading: false,
success: ({
data
}) => {
uni.showToast({
title: data.msg,
icon: 'none'
})
if (data.code == 200) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 301) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 302) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 303) {
that.showPayDialog()
}
}
});
},
getData() {
let that = this
this.originList = []
this.post({
url: '/vedio/getIndexList',
data: {
vedioId: this.data.vedioId
},
showLoading: false,
success: ({
data
}) => {
that.originList = data.list
if (that.vipBackPage != '') {
that.originIndex = that.vipBackPage
that.vipBackPage = ''
} else {
if (that.isPlayNext == 1) {
that.originIndex = that.data.recommendIndex - 1
} else {
that.originIndex = that.data.seeIndex - 1
}
if (that.originIndex >= that.data.vedioTotal || that.originIndex < 0) {
that.originIndex = 0
}
}
that.data = data.vedioMsg
that.initSwiperData(that.originIndex);
that.initEpisode()
}
});
},
ended() {
// 1.播放当前视频结束时触发，自动切换下一个视频
if (this.isplay) {
if (this.displayIndex < 2) {
this.current = this.displayIndex + 1
} else {
this.current = 0
}
console.log('显示swiper Index:', this.displayIndex)
}
},
/**
* 初始一个显示的swiper数据
* @originIndex 从源数据的哪个开始显示默认0，如从其他页面跳转进来，要显示第n个，这个参数就是他的下标
*/
initSwiperData(originIndex = this.originIndex) {
console.log('--------当前数据 Index:', originIndex)
const originListLength = this.originList.length; // 源数据长度
const displayList = [];
displayList[this.displayIndex] = this.originList[originIndex];
displayList[this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1] =
this.originList[
originIndex - 1 == -1 ? originListLength - 1 : originIndex - 1
];
displayList[this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1] =
this.originList[
originIndex + 1 == originListLength ? 0 : originIndex + 1
];
this.displaySwiperList = displayList;
console.log(this.displaySwiperList)
if (this.oid >= this.originList.length) {
this.oid = 0
}
if (this.oid < 0) {
this.oid = this.originList.length - 1
}
console.log('++++++++++++上一条播放数据 Index:', this.oid)
tt.createVideoContext('' + this.originList[this.oid].vedioIndex, this).pause();
if (this.originList[originIndex].lock) {
this.unlock(this.originIndex)
} else {
setTimeout(() => {
tt.createVideoContext('' + this.originList[originIndex].vedioIndex, this).play();
this.commitVideo()
}, 500)
}
},
/**
* swiper滑动时候
*/
swiperChange(event) {
const {
current
} = event.detail;
const originListLength = this.originList.length; // 源数据长度
// =============向后==========
if (this.displayIndex - current == 2 || this.displayIndex - current == -1) {
this.originIndex =
this.originIndex + 1 == originListLength ? 0 : this.originIndex + 1;
this.displayIndex = this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1;
console.log('+++', this.originIndex)
this.oid = this.originIndex - 1
this.initSwiperData(this.originIndex);
}
// ======如果两者的差为-2或者1则是向前滑动============
else if (this.displayIndex - current == -2 || this.displayIndex - current == 1) {
this.originIndex = this.originIndex - 1 == -1 ? originListLength - 1 : this.originIndex - 1;
this.displayIndex = this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1;
console.log('---', this.originIndex)
this.oid = this.originIndex + 1
this.initSwiperData(this.originIndex);
}
this.controls = false
this.isqp = false
},
initEpisode() {
this.subList = []
this.tabs = []
this.subList = getSubList(30, this.originList)
for (let i = 0; i < this.subList.length; i++) {
this.tabs.push({
name: Number(1 + (i % 30 * 30)) + "-" + Number(this.subList[i].length + (i % 30 *
30)),
})
}
},
controlstoggle(e) {
if (!this.controls) return
this.isqp = e.detail.show
},
collect(vedioId, index) {
this.data.collect = 1
// 收藏
this.post({
url: '/vedio/collect',
data: {
vedioId
},
showLoading: false,
success: ({
data
}) => {}
});
},
cancelCollect(vedioId, index) {
this.data.collect = 0
// 取消收藏
this.post({
url: '/vedio/cancelCollect',
data: {
vedioId
},
showLoading: false,
success: ({
data
}) => {}
});
},
commitVideo() {
// 提交后台
let that = this
this.post({
url: '/vedio/reportIndex',
data: {
vedioIndex: this.originList[this.originIndex].vedioIndex,
vedioId: this.data.vedioId
},
showLoading: false,
success: ({
data
}) => {}
});
},
preloadAd() {
let that = this
// 创建实例
this.ad = tt.createRewardedVideoAd({
adUnitId: REWARD_ID,
});
// 监听错误
this.ad.onError((err) => {
uni.hideLoading();
uni.showToast({
title: "网络太火爆了，请稍候重试"
})
switch (err.errCode) {
case 1004:
// 无合适的广告
break;
default:
// 更多请参考错误码文档
}
that.$nextTick(() => {
// 延迟渲染，否则位置错乱
that.showCoinPop = true
})
});
// 监听视频播放完成
this.ad.onClose((data) => {
uni.hideLoading();
if (data.isEnded) {
uni.showToast({
title: "正在为您解锁剧集"
})
that.adUnlock(that.originIndex, '')
} else {
uni.showToast({
title: "未阅读完整视频"
})
that.$nextTick(() => {
// 延迟渲染，否则位置错乱
that.showCoinPop = true
})
}
});
// do other thing
// 卸载 close 事件监听
// this.ad.offClose(closeHandler);
// 预加载资源
this.ad.load();
},
coinPopupClose() {
if (this.showAdForServer) {
this.showAdPop = true
} else {
this.showCoinPop = false
}
},
adPopupClose() {
this.showAdPop = false
this.playRewardVideo()
},
playRewardVideo() {
// 播放激励视频
uni.showLoading({
title: '广告加载中'
});
this.ad.show();
},
adUnlock(num, ecpm) {
let that = this
this.post({
url: '/vedio/unlockByAd',
data: {
adSource: 'csj',
vedioId: this.data.vedioId,
num: (num + 1),
ecpm: ecpm
},
showLoading: false,
success: ({
data
}) => {
uni.showToast({
title: data.msg,
icon: 'none'
})
if (data.code == 200) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 301) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 302) {
that.originList[that.originIndex].lock = false
setTimeout(() => {
tt.createVideoContext('' + that.originList[that.originIndex]
.vedioIndex,
that)
.play();
that.commitVideo()
}, 500)
} else if (data.code == 303) {
that.showPayDialog()
}
}
});
},
},
};
</script>
<style lang="scss" scoped>
page {
background: #000000;
}
.title {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 60rpx;
}
.swiper {
width: 100%;
height: 94%;
background-color: #000;
}
.videoHover {
position: absolute;
top: 0;
left: 0;
display: flex;
background-color: rgba(0, 0, 0, 0.1);
justify-content: center;
align-items: center;
.tsimg {}
}
.playState {
width: 160rpx;
height: 160rpx;
opacity: 0.2;
}
.userInfo {
position: absolute;
z-index: 99;
bottom: 30%;
right: 10px;
width: 100rpx;
display: flex;
flex-direction: column;
image {
width: 76rpx;
height: 76rpx;
position: absolute;
right: 10rpx;
}
}
.shareIco {
width: 60rpx;
height: 60rpx;
margin-top: 15px;
}
.shareTex {
color: #ffffff;
font-size: 30rpx;
text-align: center;
margin: 5px;
}
.likeNumActive {
color: red;
}
.gdfgjh {
font-size: 30rpx;
font-weight: 600;
line-height: 90rpx;
background: #fff;
border-radius: 18rpx;
padding: 0 20rpx;
text-align: center;
margin-bottom: 50rpx;
margin-left: 50rpx;
margin-right: 50rpx;
}
.tsvideo {
width: 100%;
height: 100%;
animation: showDivAni 1s 1;
}
@keyframes showDivAni {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.tsimg {
// animation: fadenum12 10s 1;
}
.contentcd {
z-index: 99;
left: 4%;
width: 92%;
position: absolute;
bottom: 30rpx;
color: #ffffff;
flex-direction: column;
align-items: flex-start;
}
.userName {
font-size: 36rpx;
color: #ffffff;
margin-left: 10rpx;
}
.wordss {
font-size: 30rpx;
color: #ffffff;
margin-left: 10rpx;
}
.wordss2 {
width: 100%;
height: 6%;
// opacity: 0.8;
// background: black;
display: flex;
flex-direction: row;
align-items: center;
// border-radius: 60rpx;
margin-top: 20rpx;
image {
margin-left: 20rpx;
width: 40rpx;
height: 40rpx;
}
.wordsss {
margin-right: 20rpx;
margin-left: auto;
width: 50rpx;
height: 50rpx;
}
}
.words {
margin-top: 20rpx;
margin-left: 10rpx;
font-size: 30rpx;
color: #ffffff;
}
@keyframes fadenum12 {
0% {
opacity: 1;
}
10% {
opacity: 0.8;
}
100% {
opacity: 0;
}
}
</style>
\ No newline at end of file
vedio/pagesD/dotRecord/dotRecord.vue
View file @ a9580391
<template>
<view class="body">
<!-- <status-title :showBack="true">看点记录</status-title> -->
<z-paging class="flex-1" ref="paging" v-model="dataList" @query="queryList">
<view v-for="(item, i) in dataList" :key="i">
<view class="flex m-20 pd-20" style="background-color:white;border-radius:10rpx;">
<image style="margin: auto 10rpx;width: 60rpx;height: 60rpx;" src="../../static/ic_coin.png">
</image>
<view class="flex1 ml-10">
<view class="mt-10" style="font-size: 28rpx;color: black;">{{item.remark}}</view>
<view class="mt-10" style="font-size: 26rpx;color: darkgray;">
{{item.time}}
</view>
</view>
<view style="margin:auto 10rpx auto auto;font-size: 36rpx;color: steelblue;">
{{ '+'+ item.subValue + '看点'}}
</view>
</view>
</view>
</z-paging>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
formateTime
} from "@/utils/utils.js"
export default {
name: 'dotRecord',
mixins: [common],
data() {
return {
dataList: []
};
},
methods: {
show() {
if (this.$refs.paging != null) {
this.$refs.paging.refresh();
}
},
myFormateTime(time) {
return formateTime(time, 'yyyy-MM-dd hh:mm:ss')
},
queryList(page, size) {
this.post({
url: '/vedio/assetsRecords/add',
data: {
page,
size
},
showLoading: false,
success: ({
data
}) => {
this.$refs.paging.complete(data.list);
}
});
}
}
};
</script>
<style lang="scss">
.body {
background-color: whitesmoke;
}
<template>
<view class="body">
<!-- <status-title :showBack="true">书豆记录</status-title> -->
<z-paging class="flex-1" ref="paging" v-model="dataList" @query="queryList">
<view v-for="(item, i) in dataList" :key="i">
<view class="flex m-20 pd-20" style="background-color:white;border-radius:10rpx;">
<image style="margin: auto 10rpx;width: 60rpx;height: 60rpx;" src="../../static/ic_coin.png">
</image>
<view class="flex1 ml-10">
<view class="mt-10" style="font-size: 28rpx;color: black;">{{item.remark}}</view>
<view class="mt-10" style="font-size: 26rpx;color: darkgray;">
{{item.time}}
</view>
</view>
<view style="margin:auto 10rpx auto auto;font-size: 36rpx;color: steelblue;">
{{ '+'+ item.subValue + '书豆'}}
</view>
</view>
</view>
</z-paging>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
formateTime
} from "@/utils/utils.js"
export default {
name: 'dotRecord',
mixins: [common],
data() {
return {
dataList: []
};
},
methods: {
show() {
if (this.$refs.paging != null) {
this.$refs.paging.refresh();
}
},
myFormateTime(time) {
return formateTime(time, 'yyyy-MM-dd hh:mm:ss')
},
queryList(page, size) {
this.post({
url: '/vedio/assetsRecords/add',
data: {
page,
size
},
showLoading: false,
success: ({
data
}) => {
this.$refs.paging.complete(data.list);
}
});
}
}
};
</script>
<style lang="scss">
.body {
background-color: whitesmoke;
}
</style>
\ No newline at end of file
vedio/pagesD/useDotRecord/useDotRecord.vue
View file @ a9580391
<template>
<view class="body">
<!-- <status-title :showBack="true">消费记录</status-title> -->
<z-paging class="flex-1" ref="paging" v-model="dataList" @query="queryList">
<view v-for="(item, i) in dataList" :key="i">
<view class="flex m-20 pd-20" style="background-color:white;border-radius:10rpx;">
<image style="margin: auto 10rpx;width: 60rpx;height: 60rpx;" src="../../static/ic_shop.png">
</image>
<view class="flex1 ml-10">
<view class="mt-10" style="font-size: 28rpx;color: black;">{{item.remark}}
</view>
<view class="mt-10" style="font-size: 26rpx;color: darkgray;">
{{item.time}}
</view>
</view>
<view style="margin:auto 10rpx auto auto;font-size: 36rpx;color: steelblue;">
{{ '-'+ item.subValue + '看点'}}
</view>
</view>
</view>
</z-paging>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
formateTime
} from "@/utils/utils.js"
export default {
name: 'useDotRecord',
mixins: [common],
data() {
return {
dataList: []
};
},
methods: {
show() {
if (this.$refs.paging != null) {
this.$refs.paging.refresh();
}
},
myFormateTime(time) {
return formateTime(time, 'yyyy-MM-dd hh:mm:ss')
},
queryList(page, size) {
this.post({
url: '/vedio/assetsRecords/sub',
data: {
page,
size
},
showLoading: false,
success: ({
data
}) => {
this.$refs.paging.complete(data.list);
}
});
}
}
};
</script>
<style lang="scss">
.body {
background-color: whitesmoke;
}
<template>
<view class="body">
<!-- <status-title :showBack="true">消费记录</status-title> -->
<z-paging class="flex-1" ref="paging" v-model="dataList" @query="queryList">
<view v-for="(item, i) in dataList" :key="i">
<view class="flex m-20 pd-20" style="background-color:white;border-radius:10rpx;">
<image style="margin: auto 10rpx;width: 60rpx;height: 60rpx;" src="../../static/ic_shop.png">
</image>
<view class="flex1 ml-10">
<view class="mt-10" style="font-size: 28rpx;color: black;">{{item.remark}}
</view>
<view class="mt-10" style="font-size: 26rpx;color: darkgray;">
{{item.time}}
</view>
</view>
<view style="margin:auto 10rpx auto auto;font-size: 36rpx;color: steelblue;">
{{ '-'+ item.subValue + '书豆'}}
</view>
</view>
</view>
</z-paging>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
formateTime
} from "@/utils/utils.js"
export default {
name: 'useDotRecord',
mixins: [common],
data() {
return {
dataList: []
};
},
methods: {
show() {
if (this.$refs.paging != null) {
this.$refs.paging.refresh();
}
},
myFormateTime(time) {
return formateTime(time, 'yyyy-MM-dd hh:mm:ss')
},
queryList(page, size) {
this.post({
url: '/vedio/assetsRecords/sub',
data: {
page,
size
},
showLoading: false,
success: ({
data
}) => {
this.$refs.paging.complete(data.list);
}
});
}
}
};
</script>
<style lang="scss">
.body {
background-color: whitesmoke;
}
</style>
\ No newline at end of file
vedio/pagesD/watchRecord/watchRecord.vue
View file @ a9580391
<template>
<view class="body">
<!-- <status-title :showBack="true">观看记录</status-title> -->
<z-paging class="flex-1" ref="paging" v-model="dataList" @query="queryList" :defaultPageNo="1"
:defaultPageSize="500">
<view style="font-size: 30rpx;font-weight: 777;margin-left: 12rpx;margin-top: 10rpx;">最近观看</view>
<view v-for="(item, i) in dataList" :key="i">
<view style="display: flex;flex-direction: row;justify-content:space-between;margin: 20rpx;">
<view style="display: flex;align-items: center;" @click="handleInfo(item)">
<image class="img" :src="item.coverImage" mode="aspectFill"></image>
<view style="display: flex;flex-direction: column;margin-left: 20rpx;">
<view style="font-size: 30rpx;color: black;">{{item.title}}</view>
<view style="font-size: 22rpx;color: gray;margin-top: 16rpx;">观看至第{{item.seeIndex}}集</view>
</view>
</view>
<view style="display: flex;align-items: center;margin-right: 8rpx;">
<view style="display: flex;flex-direction: column;">
<image v-if="item.collect==0" @click="handleXing(item)"
style="width: 50rpx;height: 50rpx;display: flex;align-items: right;padding-right: 4rpx;"
src="../../static/home_collect_img_0.png"></image>
<image v-else @click="handleXing(item)"
style="width: 50rpx;height: 50rpx;display: flex;align-items: right;padding-right: 4rpx;"
src="../../static/home_collect_img_1.png"></image>
<view
style="font-size: 22rpx;color: gray;margin-top: 10rpx;display: flex;justify-content: center;">
追剧</view>
</view>
</view>
</view>
</view>
</z-paging>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
getToLocal
} from "@/utils/utils.js"
import {
navigateTo,
message,
alert,
loading
} from '@/utils/fun.js';
import {
openUrl
} from '@/utils/app+.js';
const app = getApp();
export default {
name: 'index',
mixins: [common],
data() {
return {
dataList: []
};
},
methods: {
show() {
if (this.$refs.paging != null) {
this.$refs.paging.refresh();
}
},
queryList(page, size) {
this.post({
<template>
<view class="body">
<!-- <status-title :showBack="true">阅读记录</status-title> -->
<z-paging class="flex-1" ref="paging" v-model="dataList" @query="queryList" :defaultPageNo="1"
:defaultPageSize="500">
<view style="font-size: 30rpx;font-weight: 777;margin-left: 12rpx;margin-top: 10rpx;">最近阅读</view>
<view v-for="(item, i) in dataList" :key="i">
<view style="display: flex;flex-direction: row;justify-content:space-between;margin: 20rpx;">
<view style="display: flex;align-items: center;" @click="handleInfo(item)">
<image class="img" :src="item.coverImage" mode="aspectFill"></image>
<view style="display: flex;flex-direction: column;margin-left: 20rpx;">
<view style="font-size: 30rpx;color: black;">{{item.title}}</view>
<view style="font-size: 22rpx;color: gray;margin-top: 16rpx;">阅读至第{{item.seeIndex}}集</view>
</view>
</view>
<view style="display: flex;align-items: center;margin-right: 8rpx;">
<view style="display: flex;flex-direction: column;">
<image v-if="item.collect==0" @click="handleXing(item)"
style="width: 50rpx;height: 50rpx;display: flex;align-items: right;padding-right: 4rpx;"
src="../../static/home_collect_img_0.png"></image>
<image v-else @click="handleXing(item)"
style="width: 50rpx;height: 50rpx;display: flex;align-items: right;padding-right: 4rpx;"
src="../../static/home_collect_img_1.png"></image>
<view
style="font-size: 22rpx;color: gray;margin-top: 10rpx;display: flex;justify-content: center;">
追剧</view>
</view>
</view>
</view>
</view>
</z-paging>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
getToLocal
} from "@/utils/utils.js"
import {
navigateTo,
message,
alert,
loading
} from '@/utils/fun.js';
import {
openUrl
} from '@/utils/app+.js';
const app = getApp();
export default {
name: 'index',
mixins: [common],
data() {
return {
dataList: []
};
},
methods: {
show() {
if (this.$refs.paging != null) {
this.$refs.paging.refresh();
}
},
queryList(page, size) {
this.post({
url: '/vedio/history',
data: {
page,
size
},
showLoading: false,
success: ({
data
}) => {
this.$refs.paging.complete(data.list);
}
});
},
handleInfo(item) {
},
showLoading: false,
success: ({
data
}) => {
this.$refs.paging.complete(data.list);
}
});
},
handleInfo(item) {
navigateTo(`/pagesC/ttvideo/ttVideoDetail?data=` + encodeURIComponent(JSON.stringify(item)) +
'&tt_album_id=' + item.douyinAlbumId + '&tt_episode_id=' + item.douyinEpisodeId);
},
handleXing(item) {
var that = this;
//0未收藏，1收藏
if (item.collect == 0) {
this.post({
url: '/vedio/collect',
data: {
vedioId: item.vedioId,
},
showLoading: false,
success: ({
data
}) => {
that.show();
}
});
} else {
this.post({
url: '/vedio/cancelCollect',
data: {
vedioId: item.vedioId,
},
showLoading: false,
success: ({
data
}) => {
that.show();
}
});
}
}
}
};
</script>
<style lang="scss">
@import '@/scss/uni.scss';
.body {
background-color: whitesmoke;
}
.img {
position: relative;
border-radius: 10rpx;
width: 180rpx;
height: 240rpx;
}
'&tt_album_id=' + item.douyinAlbumId + '&tt_episode_id=' + item.douyinEpisodeId);
},
handleXing(item) {
var that = this;
//0未收藏，1收藏
if (item.collect == 0) {
this.post({
url: '/vedio/collect',
data: {
vedioId: item.vedioId,
},
showLoading: false,
success: ({
data
}) => {
that.show();
}
});
} else {
this.post({
url: '/vedio/cancelCollect',
data: {
vedioId: item.vedioId,
},
showLoading: false,
success: ({
data
}) => {
that.show();
}
});
}
}
}
};
</script>
<style lang="scss">
@import '@/scss/uni.scss';
.body {
background-color: whitesmoke;
}
.img {
position: relative;
border-radius: 10rpx;
width: 180rpx;
height: 240rpx;
}
</style>
\ No newline at end of file
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