Skip to content

U
uniapp_vedio
Commit 1184ae28 authored by jyx's avatar jyx
Browse files
Options

代码优化

parent 02933f38
Show whitespace changes
Inline Side-by-side
Showing with 406 additions and 1302 deletions
vedio/App.vue
View file @ 1184ae28
<script>
import checkUpdate from './utils/update.js';
// #ifdef MP-WEIXIN
const playletPlugin = requirePlugin('playlet-plugin')
const PlayerManager = require('@/common/util/playManager.js')
// #endif
export default {
onLoad() {
// #ifdef MP-WEIXIN
playletPlugin.onPageLoad(this._onPlayerLoad.bind(this))
playletPlugin.getShareParams().then(res => {
//关于extParam的处理，需要先做decodeURIComponent之后才能得到原值
const extParam = decodeURIComponent(res.extParam)
// 如果设置了withShareTicket为true，可通过文档的方法获取更多信息
// https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share.html
const enterOptions = wx.getEnterOptionsSync()
}).catch(err => {
console.log('getLaunch options query err-app-vue', err)
})
// #endif
},
onLaunch: function(options) {
// #ifdef APP-PLUS
//设置2.4秒后主动关闭，最多设置6秒
......@@ -42,21 +62,12 @@
}
// checkUpdate(this);
// #ifdef H5
if (window.location.host === 'www.baosheji.cn') {
var icp = document.createElement('div');
icp.innerText = '京ICP备18032652号';
icp.style.color = 'white';
icp.style.textAlign = 'center';
icp.style.position = 'fixed';
icp.style.bottom = '0';
icp.style.left = '0';
icp.style.right = '0';
icp.style.zIndex = '100';
document.body.appendChild(icp);
}
},
_onPlayerLoad(info) {
console.log('App-onPlayerLoad', info.playerId, info)
// #ifdef MP-WEIXIN
const playerManager = new PlayerManager()
playerManager._onPlayerLoad(info)
// #endif
},
onShow: function(options) {
......@@ -77,8 +88,6 @@
bottomSafePadding: 12,
h5Url: 'https://api.mints-id.com/index.html',
baseUrl: 'https://api.mints-tech.cn/camera-api/miniApi',
// baseUrl: 'http://test.mints-id.com/camera-api/miniApi',
// baseUrl: 'http://192.168.110.71:8301/miniApi',
titleButtonWidth: 38,
token: '',
userId: 0,
......
vedio/androidPrivacy.json deleted 100644 → 0
View file @ 02933f38
{
"version" : "1",
"prompt" : "template",
"title" : "服务协议和隐私政策",
"message" : "请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款，包括但不限于：为了更好的向你提供服务，我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>　　你可阅读<a href=\"https://shimo.im/docs/dPkpKL1EVNIBbXqO\">《用户协议》</a>和<a href=\"https://shimo.im/docs/aBAYVY4mNXfgLm3j\">《隐私政策》</a>了解详细信息。如果你同意，请点击下面按钮开始接受我们的服务。",
"buttonAccept" : "同意并接受",
"buttonRefuse" : "暂不同意",
"second" : {
"title" : "确认提示",
"message" : "进入应用前，你需先同意<a href=\"https://shimo.im/docs/dPkpKL1EVNIBbXqO\">《用户协议》</a>和<a href=\"https://shimo.im/docs/aBAYVY4mNXfgLm3j\">《隐私政策》</a>，否则将退出应用。",
"buttonAccept" : "同意并继续",
"buttonRefuse" : "退出应用"
},
"styles" : {
"backgroundColor" : "#ffffff",
"borderRadius" : "5px",
"title" : {
"color" : "#008cfb"
},
"buttonAccept" : {
"color" : "#008cfb"
},
"buttonRefuse" : {
"color" : "#c0c0c0"
}
}
}
vedio/common/playerManager.js 0 → 100644
View file @ 1184ae28
var plugin = requirePlugin("playlet-plugin");
// 点击按钮触发此函数跳转到播放器页面
function navigateToPlayer(obj) {
// 下面的${dramaId}变量,需要替换成小程序管理后台的媒资管理上传的剧目的dramaId，变量${srcAppid}是提审方appid，变量${serialNo}是某一集，变量${extParam}是扩展字段，可通过
const {
extParam,
dramaId,
srcAppid,
serialNo
} = obj
wx.navigateTo({
url: `plugin-private://wx94a6522b1d640c3b/pages/playlet/playlet?dramaId=${dramaId}&srcAppid=${srcAppid}&serialNo=${serialNo}&extParam=${extParam || ''}`
})
}
const proto = {
_onPlayerLoad(info) {
const pm = plugin.PlayletManager.getPageManager(info.playerId)
this.pm = pm
// encryptedData是经过开发者后台加密后(不要在前端加密)的数据，具体实现见下面的加密章节
this.getEncryptData({
serialNo: info.serialNo
}).then(res => {
// encryptedData是后台加密后的数据，具体实现见下面的加密章节
pm.setCanPlaySerialList({
data: res.encryptedData,
freeList: [{
start_serial_no: 1,
end_serial_no: 10
}], // 1~10集是免费剧集
})
})
pm.onCheckIsCanPlay(this.onCheckIsCanPlay)
// 关于分享的处理
// 开启分享以及withShareTicket
pm.setDramaFlag({
share: true,
withShareTicket: true
})
// 获取分享参数,页面栈只有短剧播放器一个页面的时候可获取到此参数
// 例如从分享卡片进入、从投流广告直接跳转到播放器页面，从二维码直接进入播放器页面等情况
plugin.getShareParams().then(res => {
console.log('getLaunch options query res', res)
// 关于extParam的处理，需要先做decodeURIComponent之后才能得到原值
const extParam = decodeURIComponent(res.extParam)
console.log('getLaunch options extParam', extParam)
// 如果设置了withShareTicket为true，可通过文档的方法获取更多信息
// https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share.html
const enterOptions = wx.getEnterOptionsSync()
console.log('getLaunch options shareTicket', enterOptions.shareTicket)
}).catch(err => {
console.log('getLaunch options query err', err)
})
// extParam除了可以通过在path传参，还可以通过下面的接口设置
pm.setExtParam('hellotest')
// 分享部分end
},
onCheckIsCanPlay(param) {
// TODO: 碰到不可以解锁的剧集，会触发此事件，这里可以进行扣币解锁逻辑，如果用户无足够的币，可调用下面的this.isCanPlay设置
console.log('onCheckIsCanPlay param', param)
var serialNo = param.serialNo
this.getEncryptData({
serialNo: serialNo
}).then(res => {
// encryptedData是后台加密后的数据，具体实现见下面的加密章节
this.pm.isCanPlay({
data: res.encryptedData,
serialNo: serialNo,
})
})
},
getEncryptData(obj) {
const {
serialNo
} = obj
// TODO: 此接口请求后台，返回下面的setCanPlaySerialList接口需要的加密参数
const {
srcAppid,
dramaId
} = this.pm.getInfo()
console.log('getEncryptData start', srcAppid, dramaId, serialNo)
return new Promise((resolve, reject) => {
resolve({
encryptedData: '' // TODO: 此参数需从后台接口获取到
})
})
},
}
function PlayerManager() {
var newProto = Object.assign({}, proto)
for (const k in newProto) {
if (typeof newProto[k] === 'function') {
this[k] = newProto[k].bind(this)
}
}
}
PlayerManager.navigateToPlayer = navigateToPlayer
module.exports = PlayerManager
\ No newline at end of file
vedio/components/divider/divider.vue deleted 100644 → 0
View file @ 02933f38
<template>
<view class="divider flex"><slot></slot></view>
</template>
<script>
export default {
name: 'Divider'
};
</script>
<style lang="scss">
@import '@/scss/uni.scss';
.divider {
font-size: 24rpx;
color: #868686;
&::before,
&::after {
content: '';
background-color: #868686;
height: 1rpx;
flex: 1;
}
&::before {
margin-right: 28rpx;
}
&::after {
margin-left: 28rpx;
}
}
</style>
vedio/components/number-box/number-box.vue deleted 100644 → 0
View file @ 02933f38
<template>
<view class="number-box">
<view @click="_calcValue('minus')" class="number-box-btns" :class="{ 'number-box-disabled': inputValue <= min || disabled }">
<icons icon="minus" :color="inputValue <= min || disabled ? '#868686' : '#299FEF'" size="40" />
</view>
<input :disabled="disabled" @focus="_onFocus" @blur="_onBlur" class="number-box-input" type="number" v-model="inputValue" />
<view @click="_calcValue('plus')" class="number-box-btns"><icons icon="plus" :color="inputValue >= max || disabled ? '#868686' : '#299FEF'" size="40" /></view>
</view>
</template>
<script>
/**
* NumberBox 数字输入框
* @description 带加减按钮的数字输入框
* @tutorial https://ext.dcloud.net.cn/plugin?id=31
* @property {Number} value 输入框当前值
* @property {Number} min 最小值
* @property {Number} max 最大值
* @property {Number} step 每次点击改变的间隔大小
* @property {String} color 字体颜色（前景色）
* @property {Boolean} disabled = [true|false] 是否为禁用状态
* @event {Function} change 输入框值改变时触发的事件，参数为输入框当前的 value
* @event {Function} focus 输入框聚焦时触发的事件，参数为 event 对象
* @event {Function} blur 输入框失焦时触发的事件，参数为 event 对象
*/
export default {
name: 'NumberBox',
emits: ['change', 'input', 'update:modelValue', 'blur', 'focus'],
props: {
value: {
type: [Number, String],
default: 1
},
modelValue: {
type: [Number, String],
default: 1
},
min: {
type: Number,
default: 0
},
max: {
type: Number,
default: 100
},
step: {
type: Number,
default: 1
},
disabled: {
type: Boolean,
default: false
}
},
data() {
return {
inputValue: 0
};
},
watch: {
value(val) {
this.inputValue = +val;
},
modelValue(val) {
this.inputValue = +val;
}
},
created() {
if (this.value === 1) {
this.inputValue = +this.modelValue;
}
if (this.modelValue === 1) {
this.inputValue = +this.value;
}
},
methods: {
_calcValue(type) {
if (this.disabled) {
return;
}
const scale = this._getDecimalScale();
let value = this.inputValue * scale;
let step = this.step * scale;
if (type === 'minus') {
value -= step;
if (value < this.min * scale) {
return;
}
if (value > this.max * scale) {
value = this.max * scale;
}
}
if (type === 'plus') {
value += step;
if (value > this.max * scale) {
return;
}
if (value < this.min * scale) {
value = this.min * scale;
}
}
this.inputValue = (value / scale).toFixed(String(scale).length - 1);
this.$emit('change', +this.inputValue);
// TODO vue2 兼容
this.$emit('input', +this.inputValue);
// TODO vue3 兼容
this.$emit('update:modelValue', +this.inputValue);
},
_getDecimalScale() {
let scale = 1;
// 浮点型
if (~~this.step !== this.step) {
scale = Math.pow(10, String(this.step).split('.')[1].length);
}
return scale;
},
_onBlur(event) {
this.$emit('blur', event);
let value = event.detail.value;
if (!value) {
// this.inputValue = 0;
return;
}
value = +value;
if (value > this.max) {
value = this.max;
} else if (value < this.min) {
value = this.min;
}
const scale = this._getDecimalScale();
this.inputValue = value.toFixed(String(scale).length - 1);
this.$emit('change', +this.inputValue);
this.$emit('input', +this.inputValue);
},
_onFocus(event) {
this.$emit('focus', event);
}
}
};
</script>
<style lang="scss">
.number-box {
display: inline-flex;
align-items: center;
margin-right: -16rpx;
&-btns {
line-height: 1;
vertical-align: bottom;
display: inline-block;
padding: 16rpx;
cursor: pointer;
}
&-input {
margin: 0 4rpx;
width: 50rpx;
text-align: center;
color: black;
}
}
</style>
vedio/components/q-button/q-button.vue deleted 100644 → 0
View file @ 02933f38
<template>
<view>
<button
class="reset-button button"
@click="onClick"
hover-class="button-hover"
:class="[shape == 'circle' ? 'round-circle' : '']"
>
<slot></slot>
</button>
</view>
</template>
<script>
/**
* m-field button 按钮组件
* @description 常用按钮组件。
* @tutorial https://ui.ymeoo.cn
* @property {String} color 按钮主题色
* @property {String} shape 设置为circle，则按钮两边为半圆形
* @event {Function} click 组件自定义点击事件
* @example <u-form-item label="姓名"><u-input v-model="form.name" /></u-form-item>
*/
export default {
name: 'q-button',
props: {
shape: {
type: String,
default: 'circle'
}
},
data() {
return {};
},
methods: {
onClick() {
this.$emit('click', '');
}
}
};
</script>
<style lang="scss" scoped>
// 去除button的所有默认样式
.reset-button {
padding: 0;
font-size: inherit;
line-height: inherit;
background-color: transparent;
color: inherit;
}
.reset-button::after {
border: none;
}
// button样式
.button {
display: block;
padding: 20rpx;
margin: 20rpx;
background-image: -moz-linear-gradient(135deg, rgb(0, 255, 255), rgb(29, 147, 251));
background-image: -webkit-linear-gradient(135deg, rgb(0, 255, 255), rgb(29, 147, 251));
background-image: linear-gradient(135deg, rgb(0, 255, 255), rgb(29, 147, 251));
color: #fff;
}
.button-hover {
background-color: #f5f5f5 !important;
}
.round-circle {
border-radius: 100rpx;
}
</style>
vedio/manifest.json
View file @ 1184ae28
{
"name" : "短剧",
"appid" : "__UNI__D23E760",
"description" : "",
"versionName" : "1.0.0",
"versionCode" : 1000,
"transformPx" : false,
"name": "短剧",
"appid": "__UNI__D23E760",
"description": "",
"versionName": "1.0.0",
"versionCode": 1000,
"transformPx": false,
/* 5+App特有相关 */
"app-plus" : {
"compatible" : {
"ignoreVersion" : true //true表示忽略版本检查提示框，HBuilderX1.9.0及以上版本支持
},
"usingComponents" : true,
"nvueStyleCompiler" : "uni-app",
"compilerVersion" : 3,
"splashscreen" : {
"alwaysShowBeforeRender" : true,
"waiting" : false,
"autoclose" : true,
"delay" : 0
"app-plus": {
"compatible": {
"ignoreVersion": true //true表示忽略版本检查提示框，HBuilderX1.9.0及以上版本支持
},
"usingComponents": true,
"nvueStyleCompiler": "uni-app",
"compilerVersion": 3,
"splashscreen": {
"alwaysShowBeforeRender": true,
"waiting": false,
"autoclose": true,
"delay": 0
},
/* 模块配置 */
"modules" : {
"Payment" : {}
"modules": {
"Payment": {}
},
/* 应用发布信息 */
"distribute" : {
"distribute": {
/* android打包配置 */
"android" : {
"permissions" : [
"android": {
"permissions": [
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
......@@ -36,182 +36,195 @@
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\"/>"
],
"permissionExternalStorage" : {
"request" : "none",
"prompt" : "应用保存运行状态等信息，需要获取读写手机存储（系统提示为访问设备上的照片、媒体内容和文件）权限，请允许。"
"permissionExternalStorage": {
"request": "none",
"prompt": "应用保存运行状态等信息，需要获取读写手机存储（系统提示为访问设备上的照片、媒体内容和文件）权限，请允许。"
},
"abiFilters" : [ "armeabi-v7a", "arm64-v8a", "x86" ],
"autoSdkPermissions" : true,
"schemes" : ""
"abiFilters": ["armeabi-v7a", "arm64-v8a", "x86"],
"autoSdkPermissions": true,
"schemes": ""
},
/* ios打包配置 */
"ios" : {
"idfa" : false,
"privacyDescription" : {
"NSPhotoLibraryUsageDescription" : "您在完成实名认证的过程中需要上传相关证件照片，故需获取您的相册读取权限。",
"NSCameraUsageDescription" : "您在完成实名认证的过程中需要上传相关证件照片，故需获取您的拍照权限。",
"NSPhotoLibraryAddUsageDescription" : "用于APP日常运行过程中文件存储与读取，包括但不限于上传下载、日志文件等。"
"ios": {
"idfa": false,
"privacyDescription": {
"NSPhotoLibraryUsageDescription": "您在完成实名认证的过程中需要上传相关证件照片，故需获取您的相册读取权限。",
"NSCameraUsageDescription": "您在完成实名认证的过程中需要上传相关证件照片，故需获取您的拍照权限。",
"NSPhotoLibraryAddUsageDescription": "用于APP日常运行过程中文件存储与读取，包括但不限于上传下载、日志文件等。"
},
"urltypes" : "twofiveone"
"urltypes": "twofiveone"
},
/* SDK配置 */
"sdkConfigs" : {
"share" : {
"weixin" : {
"appid" : "",
"UniversalLinks" : ""
}
},
"oauth" : {},
"ad" : {},
"payment" : {
"weixin" : {
"__platform__" : [ "ios", "android" ],
"appid" : "wxaa277a94b5a33c63",
"UniversalLinks" : ""
}
},
"speech" : {}
},
"icons" : {
"android" : {
"hdpi" : "",
"xhdpi" : "",
"xxhdpi" : "",
"xxxhdpi" : ""
},
"ios" : {
"appstore" : "",
"ipad" : {
"app" : "",
"app@2x" : "",
"notification" : "",
"notification@2x" : "",
"proapp@2x" : "",
"settings" : "",
"settings@2x" : "",
"spotlight" : "",
"spotlight@2x" : ""
},
"iphone" : {
"app@2x" : "",
"app@3x" : "",
"notification@2x" : "",
"notification@3x" : "",
"settings@2x" : "",
"settings@3x" : "",
"spotlight@2x" : "",
"spotlight@3x" : ""
}
}
},
"splashscreen" : {
"androidStyle" : "default",
"useOriginalMsgbox" : true,
"alwaysShowBeforeRender" : false,
"autoclose" : false,
"waiting" : false,
"delay" : 0,
"iosStyle" : "common",
"android" : {
"hdpi" : "",
"xhdpi" : "",
"xxhdpi" : ""
},
"ios" : {
"storyboard" : "unpackage/res/splash/LaunchScreen.storyboard_.zip"
}
}
},
"uniStatistics" : {
"enable" : true
"sdkConfigs": {
"share": {
"weixin": {
"appid": "",
"UniversalLinks": ""
}
},
"oauth": {},
"ad": {},
"payment": {
"weixin": {
"__platform__": ["ios", "android"],
"appid": "wxaa277a94b5a33c63",
"UniversalLinks": ""
}
},
"speech": {}
},
"icons": {
"android": {
"hdpi": "",
"xhdpi": "",
"xxhdpi": "",
"xxxhdpi": ""
},
"ios": {
"appstore": "",
"ipad": {
"app": "",
"app@2x": "",
"notification": "",
"notification@2x": "",
"proapp@2x": "",
"settings": "",
"settings@2x": "",
"spotlight": "",
"spotlight@2x": ""
},
"iphone": {
"app@2x": "",
"app@3x": "",
"notification@2x": "",
"notification@3x": "",
"settings@2x": "",
"settings@3x": "",
"spotlight@2x": "",
"spotlight@3x": ""
}
}
},
"splashscreen": {
"androidStyle": "default",
"useOriginalMsgbox": true,
"alwaysShowBeforeRender": false,
"autoclose": false,
"waiting": false,
"delay": 0,
"iosStyle": "common",
"android": {
"hdpi": "",
"xhdpi": "",
"xxhdpi": ""
},
"ios": {
"storyboard": "unpackage/res/splash/LaunchScreen.storyboard_.zip"
}
}
},
"uniStatistics": {
"enable": true
}
},
/* 快应用特有相关 */
"quickapp" : {},
"quickapp": {},
/* 小程序特有相关 */
"mp-weixin" : {
"appid" : "wx5407709f87db948b",
"setting" : {
"urlCheck" : false,
"es6" : false,
"postcss" : true,
"minified" : true
"mp-weixin": {
"appid": "wx5407709f87db948b",
"setting": {
"urlCheck": false,
"es6": false,
"postcss": true,
"minified": true
},
"usingComponents" : true,
"uniStatistics" : {
"enable" : true
"usingComponents": true,
"uniStatistics": {
"enable": true
},
"optimization" : {
"subPackages" : true
"optimization": {
"subPackages": true
},
"lazyCodeLoading" : "requiredComponents" // 依赖按需注入
{
"plugins": {
"playlet-plugin": {
"version": "latest",
"provider": "wx94a6522b1d640c3b",
"genericsImplementation": {
"playlet": {
"charge-dialog": "/components/"
}
}
}
}
}
// "lazyCodeLoading" : "requiredComponents" // 依赖按需注入
},
"mp-alipay" : {
"usingComponents" : true,
"uniStatistics" : {
"enable" : false
"mp-alipay": {
"usingComponents": true,
"uniStatistics": {
"enable": false
}
},
"mp-baidu" : {
"usingComponents" : true,
"uniStatistics" : {
"enable" : false
"mp-baidu": {
"usingComponents": true,
"uniStatistics": {
"enable": false
}
},
"mp-toutiao" : {
"usingComponents" : true,
"uniStatistics" : {
"enable" : false
"mp-toutiao": {
"usingComponents": true,
"uniStatistics": {
"enable": false
}
},
"uniStatistics" : {
"enable" : false,
"version" : "2"
"uniStatistics": {
"enable": false,
"version": "2"
},
"vueVersion" : "2",
"h5" : {
"optimization" : {
"treeShaking" : {
"enable" : true
"vueVersion": "2",
"h5": {
"optimization": {
"treeShaking": {
"enable": true
}
},
"title" : "短剧",
"router" : {
"base" : "./"
"title": "短剧",
"router": {
"base": "./"
},
"uniStatistics" : {
"enable" : true
"uniStatistics": {
"enable": true
}
},
"mp-jd" : {
"uniStatistics" : {
"enable" : false
"mp-jd": {
"uniStatistics": {
"enable": false
}
},
"mp-kuaishou" : {
"uniStatistics" : {
"enable" : false
"mp-kuaishou": {
"uniStatistics": {
"enable": false
}
},
"mp-lark" : {
"uniStatistics" : {
"enable" : false
"mp-lark": {
"uniStatistics": {
"enable": false
}
},
"mp-qq" : {
"uniStatistics" : {
"enable" : false
"mp-qq": {
"uniStatistics": {
"enable": false
}
},
"quickapp-webview-huawei" : {
"uniStatistics" : {
"enable" : false
"quickapp-webview-huawei": {
"uniStatistics": {
"enable": false
}
},
"quickapp-webview-union" : {
"uniStatistics" : {
"enable" : false
"quickapp-webview-union": {
"uniStatistics": {
"enable": false
}
}
}
......@@ -229,4 +242,3 @@
// },
// "https" : true
// }
\ No newline at end of file
vedio/package.json
View file @ 1184ae28
{
"uni-app": {
"scripts": {
"mp-dingtalk": {
"title": "钉钉小程序",
"env": {
"UNI_PLATFORM": "mp-alipay"
},
"define": {
"MP-DINGTALK": true
}
},
"mp-weixin-test": {
"title": "本地测试版本",
"env": {
"UNI_PLATFORM": "mp-weixin"
},
"define": {
"MP-APP-TEST": true
}
},
"mp-app-test": {
"title": "App 本地测试版本",
"env": {
"UNI_PLATFORM": "mp-weixin"
},
"define": {
"MP-APP-TEST": true
}
}
}
"scripts": {}
},
"dependencies": {
"uview": "^0.1.0"
......
vedio/pages.json
View file @ 1184ae28
......@@ -10,124 +10,53 @@
"pages": [
// #ifndef APP-PLUS
{
"path": "pages/loading",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black" //用于配置状态栏的字体颜色
}
"path": "pages/loading"
},
// #endif
{
"path": "pages/home",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "pages/home"
}, {
"path": "pages/index/index",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/my/my",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black" //用于配置状态栏的字体颜色
}
"path": "pages/index/index"
}, {
"path": "pages/brower/brower",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "pages/my/my"
}, {
"path": "pages/recommend/recommend",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "pages/brower/brower"
}, {
"path": "pages/recommend/follow",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "pages/recommend/recommend"
}, {
"path": "pages/recommend/recommendVideo",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "pages/recommend/follow"
}, {
"path": "pages/recommend/recommendVideo"
}
],
// 分包配置
"subPackages": [{
"root": "pagesA",
"pages": [{
"path": "vipPay/vipPay",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "vipPay/vipPay"
}]
}, {
"root": "pagesC",
"pages": [{
"path": "video/videoDetail",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}, {
"path": "video/newVideoDetail",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
"path": "video/newVideoDetail"
},
{
"path" : "playlet/playlet",
"style" :
{
"navigationBarTitleText" : ""
}
}]
}, {
"root": "pagesD",
"pages": [{
"path": "watchRecord/watchRecord",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black" //用于配置状态栏的字体颜色
}
"path": "watchRecord/watchRecord"
}, {
"path": "payRecord/payRecord",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "payRecord/payRecord"
}, {
"path": "dotRecord/dotRecord",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "dotRecord/dotRecord"
}, {
"path": "useDotRecord/useDotRecord",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
"path": "useDotRecord/useDotRecord"
}]
}],
// 分包预载配置
......@@ -149,6 +78,9 @@
"globalStyle": {
"backgroundColor": "#232325",
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black", //用于配置状态栏的字体颜色
"navigationStyle": "custom",
"app-plus": {
"bounce": "none",
"scrollIndicator": "none"
......
vedio/pagesC/video/videoDetail.vue deleted 100644 → 0
View file @ 02933f38
<template>
<view style="width: 100%;height: 100%;">
<status-title style="position: absolute;" iconColor="white" :showBack="true"></status-title>
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true">
<swiper-item v-for="(list, index) in displaySwiperList" :key="index" :style="'width:100%; height:100%;'">
<view :style="'width:100%; height:100%;'">
<video v-if="Math.abs(displayIndex-index)==0 && list.vedioUrl" :id="list.vedioId"
:controls="controls" :loop="!isplay" :enable-progress-gesture="false" :show-loading="true"
:show-fullscreen-btn="false" @ended="ended" @controlstoggle="controlstoggle" @click="tapVides()"
@timeupdate="timeupdate" style="width:100%; height:100%;background: #f56c6c;"
:src="list.vedioUrl" :poster="data.coverImage" class="tsvideo" play-btn-position="center"
object-fit="contain" />
<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: 110rpx;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">{{list.title}}</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>
<view v-if="originIndex>=data.unlockIndex || !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>
</view>
</swiper-item>
</swiper>
<uni-popup type="bottom" ref="select">
<view v-if="fenji==1"
:style="'width: '+ windowWidth +'px; height: 860rpx; background-color: #202020; border-top-left-radius: 20rpx; border-top-right-radius: 20rpx;'">
<view style="height: 70rpx;display: flex; flex-direction: row;align-items: center;">
<image src="@/static/video/layers.png" style="width: 40rpx; height: 40rpx; margin-left: 20rpx;" />
<view
:style="'font-size: 30rpx; font-weight: bold; color: #FFFFFF; margin-left: 20rpx; overflow: hidden;'">
当前播放第{{ Number(originIndex+1) }}集
</view>
<image @click="down" src="@/static/video/down.png"
style="width: 50rpx; height: 50rpx; margin:0 20rpx 0 auto; ">
</image>
</view>
<u-tabs v-if="showTap" :current="tabIndex" :list="tabs" @change="popHandleChange" lineWidth="30"
lineColor="#f56c6c" :activeStyle="{
color: '#f56c6c',
fontWeight: 'bold',
transform: 'scale(1.05)'
}" :inactiveStyle="{
color: '#ffffff',
transform: 'scale(1)'
}"></u-tabs>
<swiper class="swiper mt-20" @change="popSwiperChange" :current="tabIndex" :vertical="false" circular>
<swiper-item v-for="(list, index1) in subList" :key="index1">
<scroll-view :style="'width: '+ (windowWidth) +'px; height: '+ ((windowHeight/1.6)*0.85) +'px;'"
:scroll-y="true">
<view class="flex space" style="display:flex; flex-wrap:wrap;">
<block v-for="(list,index2) in subList[index1]">
<view @click.stop="selectThisVideo(index2 + (index1%30*30))"
style="position: relative;width:16%;height: 120rpx; background: gray;border-radius: 10rpx;margin-left: 5rpx;margin-bottom: 5rpx;">
<image v-if="(index2+1 + (index1%30*30))>data.unlockIndex"
src="@/static/video/lock.png"
style="width:30rpx;height:30rpx;position:absolute;right:5rpx;top:5rpx;" />
<view class="flex"
style="width:100%;height:100%;align-items:center;justify-content:center;">
<text v-if="(originIndex+1)==list.vedioIndex"
style="font-size: 36rpx;color: #f56c6c;">{{list.vedioIndex}}</text>
<text v-else
style="font-size: 36rpx;color: #FFFFFF;">{{list.vedioIndex}}</text>
</view>
<image v-if="(originIndex+1)==list.vedioIndex" src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_playing.gif"
style="width:30rpx;height:30rpx;position:absolute;left:5rpx;bottom:5rpx;" />
</view>
</block>
</view>
</scroll-view>
</swiper-item>
</swiper>
</view>
<view v-if="fenji==2"
:style="'width: '+ windowWidth +'px; background-color: #202020; border-top-left-radius: 10px; border-top-right-radius: 10px;'">
<view style="height: 70rpx;display: flex; flex-direction: row;align-items: center;">
<image src="@/static/video/layers.png" style="width: 40rpx; height: 40rpx; margin-left: 20rpx;">
</image>
<view
:style="'font-size: 30rpx; font-weight: bold; color: #FFFFFF; margin-left: 20rpx; overflow: hidden;'">
当前视频 没有权限播放
</view>
<image @click="downbuy" src="@/static/video/down.png"
style="width: 50rpx; height: 50rpx; margin:0 20rpx 0 auto; ">
</image>
</view>
<view style="color: white;text-align: center;margin-top: 20rpx;">
{{'解锁 '+data.title+' 全集'}}
</view>
<view @click="govip()" class="button" style="margin:30rpx auto 50rpx auto;color: white;">开通VIP</view>
</view>
</uni-popup>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
getSubList
} from "@/utils/utils.js"
import uniPopup from '@/components/uni-popup/uni-popup.vue';
import {
navigateTo,
} from '@/utils/fun.js';
import {
data
} from '../../uni_modules/uview-ui/libs/mixin/mixin';
import {
ref
} from "vue";
let audo = uni.createInnerAudioContext()
export default {
name: "videoDetail",
mixins: [common],
components: {
uniPopup
},
data() {
return {
sharedata: {
type: 2,
strShareUrl: "",
strShareTitle: "分享标题",
strShareSummary: "分享总结",
strShareImageUrl: ""
},
fenji: 1,
controls: false,
originList: [], // 源数据
displaySwiperList: [], // swiper需要的数据
displayIndex: 0, // 用于显示swiper的真正的下标数值只有：0，1，2。
originIndex: 0, // 记录源数据的下标
windowWidth: 0,
windowHeight: 0,
current: 0,
oid: 0,
isplay: true, //是否自动播放下一个视频
duration: 500,
isqp: false,
mid: 0,
safeArea: 0,
ttuop: 0,
heightxw: 100,
userinfo: [],
moneyList: [],
data: {},
isPlayNext: 0,
tabIndex: 0,
tabs: [],
subList: [],
showTap: false,
};
},
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;
if (this.safeArea > 0) {
this.heightxw = 97
}
}
})
// #ifdef MP-TOUTIAO
this.ttuop = 64
// #endif
this.windowWidth = uni.getSystemInfoSync().windowWidth
this.windowHeight = uni.getSystemInfoSync().windowHeight - this.safeArea - this.ttuop
console.log(this.windowHeight)
},
onShow() {
// 从VIP页面返回关闭弹框
this.down()
this.downbuy()
this.getData()
},
methods: {
govip() {
navigateTo(`/pagesA/vipPay/vipPay`)
},
timeupdate(event) {
if (event.detail.currentTime > 0 && this.originList[this.originIndex].vedioIndex > this.data.unlockIndex) {
uni.createVideoContext(this.originList[this.originIndex].vedioId, this).seek(0);
uni.createVideoContext(this.originList[this.originIndex].vedioId, this).pause();
this.fenji = 2
this.$refs.select.open('bottom');
}
},
selectThisVideo(index) {
this.down();
if (this.originList[this.originIndex].vedioIndex > this.data.unlockIndex) {
this.fenji = 2
this.$refs.select.open('bottom');
} else {
console.log("AAAAAAA" + index)
this.duration = 20;
this.originIndex = index
this.initSwiperData(this.originIndex);
setTimeout(() => {
this.duration = 500;
}, 500)
}
},
down() {
this.$refs.select.close();
},
downbuy() {
this.$refs.select.close();
},
sellxj() {
this.fenji = 1
this.$refs.select.open('bottom');
this.$nextTick(() => {
this.tabIndex = parseInt(this.originIndex / 30)
// 延迟渲染，否则位置错乱
this.showTap = true
})
},
tapVideoHover(index, pays) {
this.fenji = 2
this.$refs.select.open('bottom');
},
tapVides() {
if (this.controls) return
this.isqp = true
this.controls = true
},
getData() {
this.originList = []
this.post({
url: '/vedio/getIndexList',
data: {
vedioId: this.data.vedioId
},
showLoading: false,
success: ({
data
}) => {
this.originList = data.list
if (this.isPlayNext == 1) {
this.originIndex = this.data.recommendIndex - 1
if (this.originIndex >= this.data.unlockIndex - 1) {
this.originIndex = this.data.unlockIndex - 1
}
} else {
this.originIndex = this.data.seeIndex - 1
}
if (this.originIndex >= this.data.vedioTotal || this.originIndex < 0) {
this.originIndex = 0
}
this.data = data.vedioMsg
this.initSwiperData(this.originIndex);
this.initEpisode()
}
});
},
ended() {
//console.log('isplay----',this.isplay)
// 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;
audo.pause()
if (this.oid >= this.originList.length) {
this.oid = 0
}
if (this.oid < 0) {
this.oid = this.originList.length - 1
}
console.log('++++++++++++上一条播放数据 Index:', this.oid)
uni.createVideoContext("" + this.originList[this.oid].vedioId, this).stop();
if (this.originList[originIndex].vedioIndex > this.data.unlockIndex) {
this.fenji = 2
this.$refs.select.open('bottom');
} else {
setTimeout(() => {
console.log('qqqqqq:', this.originList[originIndex].vedioId)
// audo.play()
uni.createVideoContext("" + this.originList[originIndex].vedioId, 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)),
})
}
},
popSwiperChange(event) {
const {
current
} = event.detail;
this.tabIndex = current
},
popHandleChange(event) {
this.tabIndex = event.index;
},
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
}) => {}
});
},
},
};
</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: 100%;
}
.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: 90rpx;
display: flex;
flex-direction: column;
image {
width: 70rpx;
height: 70rpx;
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 {
/* 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: 36px;
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: 80rpx;
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
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