商品详情视屏播放

This commit is contained in:
zmj 2024-05-09 15:50:05 +08:00
parent ef7e2ed969
commit d959e67b11
5 changed files with 527 additions and 392 deletions

View File

@ -1,45 +1,43 @@
<template> <template>
<view class='product-bg'> <view class='product-bg'>
<swiper :indicator-dots="indicatorDots" indicator-active-color="#e93323" :autoplay="autoplay" :circular="circular" <swiper :indicator-dots="indicatorDots" :current='current' indicator-active-color="#e93323" :autoplay="autoplay"
:interval="interval" :duration="duration" @change="change" v-if="isPlay"> :circular="circular" :interval="interval" :duration="duration" @change="change" v-if="isPlay">
<!-- #ifndef APP-PLUS --> <!-- #ifndef APP-PLUS -->
<swiper-item v-if="videoline && videoline != '' && videoline != 'https:'">
<view class="item">
<video id="myVideo" :src='videoline && (videoline.substring(0,4) == "http" || videoline.substring(0,5) == "https") ? videoline : ("http:" + videoline)'
objectFit="cover" controls style="width:100%;height:100% " show-mute-btn="true"
auto-pause-if-navigate @ended="endedFun()"></video>
<view class="poster" v-if="controls">
<image class="image" :src="videoCoverImg"></image>
</view>
<view class="stop" v-if="controls" @tap="bindPause">
<image class="image" src="../../static/images/stop.png"></image>
</view>
</view>
</swiper-item>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<swiper-item v-if="videoline">
<view class="item">
<view class="poster" v-show="controls">
<image class="image" :src="videoCoverImg"></image>
</view>
<view class="stop" v-show="controls" @tap="bindPause">
<image class="image" src="../../static/images/stop.png"></image>
</view>
</view>
</swiper-item>
<!-- #endif -->
<block v-for="(item,index) in imgUrls" :key='index'> <block v-for="(item,index) in imgUrls" :key='index'>
<swiper-item> <swiper-item v-if="isVideoUrl(item)">
<image :src="item" class="slide-image" @click='getpreviewImage(item)' mode="widthFix" /> <video :src="isVideoUrl(item,true)" objectFit="cover" controls style="width:100%;height:100% "
show-center-play-btn show-mute-btn="true" auto-pause-if-navigate
:enable-progress-gesture="false" :poster="item+coverUrl"></video>
</swiper-item>
<swiper-item v-else>
<image :src="item" class="slide-image" @click='getpreviewImage(item)' />
</swiper-item> </swiper-item>
</block> </block>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<block v-for="(item,index) in imgUrls" :key='index'>
<swiper-item v-if="isVideoUrl(item)">
<view>
<image :src="item+coverUrl" class="slide-image" />
<image class="image-play-icon" src="../../static/images/stop.png"
@click='videoPlay(item,index)'>
</image>
</view>
</swiper-item>
<swiper-item v-else>
<image :src="item" class="slide-image" @click='getpreviewImage(item)' />
</swiper-item>
</block>
<!-- #endif -->
</swiper> </swiper>
<!-- #ifdef APP-PLUS --> <!-- #ifdef APP-PLUS -->
<view v-if="!isPlay" style="width: 100%; height: 750rpx;"> <view v-if="!isPlay" style="width: 100%; height: 750rpx;">
<video id="myVideo" :src='videoline && (videoline.substring(0,4) == "http" || videoline.substring(0,5) == "https") ? videoline : "http:" + videoline' <video id="myVideo" :src='playingUrl' objectFit="cover" controls style="width:100%;height:100% "
objectFit="cover" controls style="width:100%;height:100% " show-center-play-btn show-mute-btn="true" show-center-play-btn show-mute-btn="true" auto-pause-if-navigate :enable-progress-gesture="false"
auto-pause-if-navigate :enable-progress-gesture="false" :poster="videoCoverImg" @pause="videoPause" @ended="endedFun()"></video> :poster="playingUrl+coverUrl" @pause="videoPause" @ended="endedFun()"></video>
</view> </view>
<!-- #endif --> <!-- #endif -->
@ -50,7 +48,7 @@
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
// | CRMEB [ CRMEB ] // | CRMEB [ CRMEB ]
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
// | Copyright (c) 2016~2023 https://www.crmeb.com All rights reserved. // | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
// | Licensed CRMEBCRMEB // | Licensed CRMEBCRMEB
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
@ -74,6 +72,10 @@
}, },
data() { data() {
return { return {
coverUrl: '?spm=a2c4e.11153940.blogcont573781.6.c1032027sQ46VG&x-oss-process=video/snapshot,t_1000,m_fast',
current: '0',
videoTypeList: ['mp4', 'avi', 'mov', 'wmv', 'mkv', 'flv', 'mpeg', '3gp', 'webm'],
playingUrl: '',
indicatorDots: true, indicatorDots: true,
circular: true, circular: true,
autoplay: true, autoplay: true,
@ -97,6 +99,25 @@
// #endif // #endif
}, },
methods: { methods: {
isVideoUrl(url, getRightUrl) {
const str = url;
const lastIndex = str.lastIndexOf(".");
let extension;
if (lastIndex !== -1) {
extension = str.substring(lastIndex + 1);
} else {
extension = 'jpg'
}
if (getRightUrl) return url.replace(/\\/g, "")
return this.videoTypeList.includes(extension)
},
videoPlay(url, index) {
this.playingUrl = url
this.current = index
console.log(this.current)
this.bindPause()
},
getpreviewImage: function(item) { getpreviewImage: function(item) {
uni.previewImage({ uni.previewImage({
urls: this.imgUrls, urls: this.imgUrls,
@ -109,6 +130,7 @@
this.autoplay = true this.autoplay = true
// #endif // #endif
}, },
bindPause: function() { bindPause: function() {
// #ifndef APP-PLUS // #ifndef APP-PLUS
this.videoContext.play(); this.videoContext.play();
@ -119,7 +141,7 @@
// #ifdef APP-PLUS // #ifdef APP-PLUS
this.isPlay = false this.isPlay = false
this.videoContext = uni.createVideoContext('myVideo', this); this.videoContext = uni.createVideoContext('myVideo', this);
this.$nextTick(()=>{ this.$nextTick(() => {
this.videoContext.play(); this.videoContext.play();
}) })
// #endif // #endif
@ -140,15 +162,18 @@
height: 750rpx; height: 750rpx;
position: relative; position: relative;
} }
.product-bg swiper { .product-bg swiper {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
.product-bg .slide-image { .product-bg .slide-image {
width: 100%; width: 750rpx;
height: 100%; height: 750rpx;
} }
.product-bg .pages { .product-bg .pages {
position: absolute; position: absolute;
background-color: #fff; background-color: #fff;
@ -161,15 +186,18 @@
font-size: 24rpx; font-size: 24rpx;
color: #050505; color: #050505;
} }
#myVideo { #myVideo {
width: 100%; width: 100%;
height: 100% height: 100%
} }
.product-bg .item { .product-bg .item {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.product-bg .item .poster { .product-bg .item .poster {
position: absolute; position: absolute;
top: 0; top: 0;
@ -178,10 +206,12 @@
width: 100%; width: 100%;
z-index: 9; z-index: 9;
} }
.product-bg .item .poster .image { .product-bg .item .poster .image {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.product-bg .item .stop { .product-bg .item .stop {
position: absolute; position: absolute;
top: 50%; top: 50%;
@ -192,8 +222,18 @@
margin-left: -68rpx; margin-left: -68rpx;
z-index: 9; z-index: 9;
} }
.product-bg .item .stop .image { .product-bg .item .stop .image {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
</style>
.image-play-icon {
position: absolute;
width: 100rpx;
height: 100rpx;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
</style>

View File

@ -1,352 +1,352 @@
{ {
"name": "惠农生活", "name" : "惠农生活",
"appid": "__UNI__3A527D1", "appid" : "__UNI__3A527D1",
"description": "", "description" : "",
"versionName": "2.0.49", "versionName" : "2.0.54",
"versionCode": 2049, "versionCode" : 2054,
"transformPx": false, "transformPx" : false,
/* 5+App */ /* 5+App */
"app-plus": { "app-plus" : {
"titleNView": true, "titleNView" : true,
"usingComponents": true, "usingComponents" : true,
"nvueCompiler": "uni-app", "nvueCompiler" : "uni-app",
"nvueStyleCompiler": "uni-app", "nvueStyleCompiler" : "uni-app",
"compilerVersion": 3, "compilerVersion" : 3,
"compatible": { "compatible" : {
"ignoreVersion": true //trueHBuilderX1.9.0 "ignoreVersion" : true //trueHBuilderX1.9.0
}, },
"splashscreen": { "splashscreen" : {
"alwaysShowBeforeRender": false, "alwaysShowBeforeRender" : false,
"waiting": false, "waiting" : false,
"autoclose": true, "autoclose" : true,
"delay": 0 "delay" : 0
}, },
/* */ /* */
"modules": { "modules" : {
"VideoPlayer": {}, "VideoPlayer" : {},
"OAuth": {}, "OAuth" : {},
"Payment": {}, "Payment" : {},
"Share": {}, "Share" : {},
"iBeacon": {}, "iBeacon" : {},
"Maps": {}, "Maps" : {},
"Geolocation": {}, "Geolocation" : {},
"UniMP": { "UniMP" : {
"description": "uni小程序" "description" : "uni小程序"
}, },
"Push": {}, "Push" : {},
"Barcode": {}, "Barcode" : {},
"Camera": {} "Camera" : {}
}, },
"safearea": { "safearea" : {
"bottom": { "bottom" : {
"offset": "none" "offset" : "none"
} }
}, },
/* */ /* */
"distribute": { "distribute" : {
/* android */ /* android */
"android": { "android" : {
"permissions": [ "permissions" : [
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>", "<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>", "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_LOCATION_EXTRA_COMMANDS\"/>", "<uses-permission android:name=\"android.permission.ACCESS_LOCATION_EXTRA_COMMANDS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.BATTERY_STATS\"/>", "<uses-permission android:name=\"android.permission.BATTERY_STATS\"/>",
"<uses-permission android:name=\"android.permission.BLUETOOTH\"/>", "<uses-permission android:name=\"android.permission.BLUETOOTH\"/>",
"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>", "<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>", "<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_CONFIGURATION\"/>", "<uses-permission android:name=\"android.permission.CHANGE_CONFIGURATION\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>", "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>", "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>", "<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>", "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>", "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>", "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>", "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>", "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>", "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>",
"<uses-permission android:name=\"android.permission.BLUETOOTH_ADMIN\"/>" "<uses-permission android:name=\"android.permission.BLUETOOTH_ADMIN\"/>"
], ],
"abiFilters": ["armeabi-v7a", "arm64-v8a", "x86"], "abiFilters" : [ "armeabi-v7a", "arm64-v8a", "x86" ],
"permissionExternalStorage": { "permissionExternalStorage" : {
"request": "none", "request" : "none",
"prompt": "应用保存运行状态等信息,需要获取读写手机存储(系统提示为访问设备上的照片、媒体内容和文件)权限,请允许。" "prompt" : "应用保存运行状态等信息,需要获取读写手机存储(系统提示为访问设备上的照片、媒体内容和文件)权限,请允许。"
}, },
"permissionPhoneState": { "permissionPhoneState" : {
"request": "none" // "request" : "none" //
}, },
"minSdkVersion": 23, "minSdkVersion" : 23,
"targetSdkVersion": 30 "targetSdkVersion" : 30
}, },
/* ios */ /* ios */
"ios": { "ios" : {
"privacyDescription": { "privacyDescription" : {
"NSPhotoLibraryUsageDescription": "上传用户头像保存分享海报", "NSPhotoLibraryUsageDescription" : "上传用户头像保存分享海报",
"NSPhotoLibraryAddUsageDescription": "上传用户头像保存分享海报", "NSPhotoLibraryAddUsageDescription" : "上传用户头像保存分享海报",
"NSCameraUsageDescription": "上传用户头像保存分享海报", "NSCameraUsageDescription" : "上传用户头像保存分享海报",
"NSLocationWhenInUseUsageDescription": "根据客户地理位置推荐最近门店", "NSLocationWhenInUseUsageDescription" : "根据客户地理位置推荐最近门店",
"NSLocationAlwaysUsageDescription": "根据客户地理位置推荐最近门店" "NSLocationAlwaysUsageDescription" : "根据客户地理位置推荐最近门店"
}, },
"idfa": false, "idfa" : false,
"dSYMs": false "dSYMs" : false
}, },
/* SDK */ /* SDK */
"sdkConfigs": { "sdkConfigs" : {
"maps": { "maps" : {
"amap": { "amap" : {
"appkey_ios": "0a3202688624938fd5d2f37b52c30d5d", "appkey_ios" : "0a3202688624938fd5d2f37b52c30d5d",
"appkey_android": "0354f5ddc11e2ea76c5aac647f44d945", "appkey_android" : "0354f5ddc11e2ea76c5aac647f44d945",
"name": "amapIvoVHpJR" "name" : "amapIvoVHpJR"
} }
}, },
"payment": { "payment" : {
"weixin": { "weixin" : {
"__platform__": ["ios", "android"], "__platform__" : [ "ios", "android" ],
"appid": "wx2e8f79ff281284f5", "appid" : "wx2e8f79ff281284f5",
"UniversalLinks": "https://shop.lihaink.cn/" "UniversalLinks" : "https://shop.lihaink.cn/"
} }
}, },
"share": { "share" : {
"weixin": { "weixin" : {
"appid": "wx2e8f79ff281284f5", "appid" : "wx2e8f79ff281284f5",
"UniversalLinks": "https://shop.lihaink.cn/" "UniversalLinks" : "https://shop.lihaink.cn/"
} }
}, },
"geolocation": { "geolocation" : {
"amap": { "amap" : {
"name": "amapIvoVHpJR", "name" : "amapIvoVHpJR",
"__platform__": ["ios", "android"], "__platform__" : [ "ios", "android" ],
"appkey_ios": "0a3202688624938fd5d2f37b52c30d5d", "appkey_ios" : "0a3202688624938fd5d2f37b52c30d5d",
"appkey_android": "0354f5ddc11e2ea76c5aac647f44d945" "appkey_android" : "0354f5ddc11e2ea76c5aac647f44d945"
} }
}, },
"push": {}, "push" : {},
"oauth": { "oauth" : {
"weixin": { "weixin" : {
"appid": "wx2e8f79ff281284f5", "appid" : "wx2e8f79ff281284f5",
"UniversalLinks": "https://shop.lihaink.cn/" "UniversalLinks" : "https://shop.lihaink.cn/"
} }
}, },
"ad": {} "ad" : {}
}, },
"icons": { "icons" : {
"android": { "android" : {
"hdpi": "unpackage/res/icons/72x72.png", "hdpi" : "unpackage/res/icons/72x72.png",
"xhdpi": "unpackage/res/icons/96x96.png", "xhdpi" : "unpackage/res/icons/96x96.png",
"xxhdpi": "unpackage/res/icons/144x144.png", "xxhdpi" : "unpackage/res/icons/144x144.png",
"xxxhdpi": "unpackage/res/icons/192x192.png" "xxxhdpi" : "unpackage/res/icons/192x192.png"
}, },
"ios": { "ios" : {
"appstore": "unpackage/res/icons/1024x1024.png", "appstore" : "unpackage/res/icons/1024x1024.png",
"ipad": { "ipad" : {
"app": "unpackage/res/icons/76x76.png", "app" : "unpackage/res/icons/76x76.png",
"app@2x": "unpackage/res/icons/152x152.png", "app@2x" : "unpackage/res/icons/152x152.png",
"notification": "unpackage/res/icons/20x20.png", "notification" : "unpackage/res/icons/20x20.png",
"notification@2x": "unpackage/res/icons/40x40.png", "notification@2x" : "unpackage/res/icons/40x40.png",
"proapp@2x": "unpackage/res/icons/167x167.png", "proapp@2x" : "unpackage/res/icons/167x167.png",
"settings": "unpackage/res/icons/29x29.png", "settings" : "unpackage/res/icons/29x29.png",
"settings@2x": "unpackage/res/icons/58x58.png", "settings@2x" : "unpackage/res/icons/58x58.png",
"spotlight": "unpackage/res/icons/40x40.png", "spotlight" : "unpackage/res/icons/40x40.png",
"spotlight@2x": "unpackage/res/icons/80x80.png" "spotlight@2x" : "unpackage/res/icons/80x80.png"
}, },
"iphone": { "iphone" : {
"app@2x": "unpackage/res/icons/120x120.png", "app@2x" : "unpackage/res/icons/120x120.png",
"app@3x": "unpackage/res/icons/180x180.png", "app@3x" : "unpackage/res/icons/180x180.png",
"notification@2x": "unpackage/res/icons/40x40.png", "notification@2x" : "unpackage/res/icons/40x40.png",
"notification@3x": "unpackage/res/icons/60x60.png", "notification@3x" : "unpackage/res/icons/60x60.png",
"settings@2x": "unpackage/res/icons/58x58.png", "settings@2x" : "unpackage/res/icons/58x58.png",
"settings@3x": "unpackage/res/icons/87x87.png", "settings@3x" : "unpackage/res/icons/87x87.png",
"spotlight@2x": "unpackage/res/icons/80x80.png", "spotlight@2x" : "unpackage/res/icons/80x80.png",
"spotlight@3x": "unpackage/res/icons/120x120.png" "spotlight@3x" : "unpackage/res/icons/120x120.png"
} }
} }
}, },
"splashscreen": { "splashscreen" : {
"useOriginalMsgbox": true, "useOriginalMsgbox" : true,
"androidStyle": "common" "androidStyle" : "common"
} }
}, },
"nativePlugins": { "nativePlugins" : {
"JG-JCore": { "JG-JCore" : {
"JPUSH_APPKEY_IOS": "8a5efd65cda14fafa6e64ad3", "JPUSH_APPKEY_IOS" : "8a5efd65cda14fafa6e64ad3",
"JPUSH_CHANNEL_IOS": "8a5efd65cda14fafa6e64ad3", "JPUSH_CHANNEL_IOS" : "8a5efd65cda14fafa6e64ad3",
"JPUSH_APPKEY_ANDROID": "b5f679f4357018605ea6fd2e", "JPUSH_APPKEY_ANDROID" : "b5f679f4357018605ea6fd2e",
"JPUSH_CHANNEL_ANDROID": "", "JPUSH_CHANNEL_ANDROID" : "",
"__plugin_info__": { "__plugin_info__" : {
"name": "JG-JCore", "name" : "JG-JCore",
"description": "极光推送JCore插件", "description" : "极光推送JCore插件",
"platforms": "Android,iOS", "platforms" : "Android,iOS",
"url": "", "url" : "",
"android_package_name": "uni.UNI3A527D1", "android_package_name" : "uni.UNI3A527D1",
"ios_bundle_id": "", "ios_bundle_id" : "",
"isCloud": false, "isCloud" : false,
"bought": -1, "bought" : -1,
"pid": "", "pid" : "",
"parameters": { "parameters" : {
"JPUSH_APPKEY_IOS": { "JPUSH_APPKEY_IOS" : {
"des": "[iOS]极光portal配置应用信息时分配的AppKey", "des" : "[iOS]极光portal配置应用信息时分配的AppKey",
"key": "JCore:APP_KEY", "key" : "JCore:APP_KEY",
"value": "daebe19b547c43128796a078" "value" : "daebe19b547c43128796a078"
}, },
"JPUSH_CHANNEL_IOS": { "JPUSH_CHANNEL_IOS" : {
"des": "[iOS]用于统计分发渠道不需要可填默认值developer-default", "des" : "[iOS]用于统计分发渠道不需要可填默认值developer-default",
"key": "JCore:CHANNEL", "key" : "JCore:CHANNEL",
"value": "" "value" : ""
}, },
"JPUSH_APPKEY_ANDROID": { "JPUSH_APPKEY_ANDROID" : {
"des": "[Android]极光portal配置应用信息时分配的AppKey", "des" : "[Android]极光portal配置应用信息时分配的AppKey",
"key": "JPUSH_APPKEY", "key" : "JPUSH_APPKEY",
"value": "" "value" : ""
}, },
"JPUSH_CHANNEL_ANDROID": { "JPUSH_CHANNEL_ANDROID" : {
"des": "[Android]用于统计分发渠道不需要可填默认值developer-default", "des" : "[Android]用于统计分发渠道不需要可填默认值developer-default",
"key": "JPUSH_CHANNEL", "key" : "JPUSH_CHANNEL",
"value": "" "value" : ""
} }
} }
} }
}, },
"JG-JPush": { "JG-JPush" : {
"JPUSH_ISPRODUCTION_IOS": "true", "JPUSH_ISPRODUCTION_IOS" : "true",
"JPUSH_ADVERTISINGID_IOS": "", "JPUSH_ADVERTISINGID_IOS" : "",
"JPUSH_DEFAULTINITJPUSH_IOS": "true", "JPUSH_DEFAULTINITJPUSH_IOS" : "true",
"JPUSH_OPPO_APPKEY": "", "JPUSH_OPPO_APPKEY" : "",
"JPUSH_OPPO_APPID": "", "JPUSH_OPPO_APPID" : "",
"JPUSH_OPPO_APPSECRET": "", "JPUSH_OPPO_APPSECRET" : "",
"JPUSH_VIVO_APPKEY": "", "JPUSH_VIVO_APPKEY" : "",
"JPUSH_VIVO_APPID": "", "JPUSH_VIVO_APPID" : "",
"JPUSH_MEIZU_APPKEY": "", "JPUSH_MEIZU_APPKEY" : "",
"JPUSH_MEIZU_APPID": "", "JPUSH_MEIZU_APPID" : "",
"JPUSH_XIAOMI_APPKEY": "", "JPUSH_XIAOMI_APPKEY" : "",
"JPUSH_XIAOMI_APPID": "", "JPUSH_XIAOMI_APPID" : "",
"__plugin_info__": { "__plugin_info__" : {
"name": "JG-JPush", "name" : "JG-JPush",
"description": "极光推送Hbuilder插件", "description" : "极光推送Hbuilder插件",
"platforms": "Android,iOS", "platforms" : "Android,iOS",
"url": "", "url" : "",
"android_package_name": "uni.UNI3A527D1", "android_package_name" : "uni.UNI3A527D1",
"ios_bundle_id": "", "ios_bundle_id" : "",
"isCloud": false, "isCloud" : false,
"bought": -1, "bought" : -1,
"pid": "", "pid" : "",
"parameters": { "parameters" : {
"JPUSH_ISPRODUCTION_IOS": { "JPUSH_ISPRODUCTION_IOS" : {
"des": "[iOS]是否是生产环境是填true不是填false或者不填", "des" : "[iOS]是否是生产环境是填true不是填false或者不填",
"key": "JPush:ISPRODUCTION", "key" : "JPush:ISPRODUCTION",
"value": "" "value" : ""
}, },
"JPUSH_ADVERTISINGID_IOS": { "JPUSH_ADVERTISINGID_IOS" : {
"des": "[iOS]广告标识符IDFA如果不需要使用IDFA可不填", "des" : "[iOS]广告标识符IDFA如果不需要使用IDFA可不填",
"key": "JPush:ADVERTISINGID", "key" : "JPush:ADVERTISINGID",
"value": "" "value" : ""
}, },
"JPUSH_DEFAULTINITJPUSH_IOS": { "JPUSH_DEFAULTINITJPUSH_IOS" : {
"des": "[iOS]是否默认初始化是填true不是填false或者不填", "des" : "[iOS]是否默认初始化是填true不是填false或者不填",
"key": "JPush:DEFAULTINITJPUSH", "key" : "JPush:DEFAULTINITJPUSH",
"value": "" "value" : ""
}, },
"JPUSH_OPPO_APPKEY": { "JPUSH_OPPO_APPKEY" : {
"des": "厂商OPPO-appkey,示例OP-12345678", "des" : "厂商OPPO-appkey,示例OP-12345678",
"key": "OPPO_APPKEY", "key" : "OPPO_APPKEY",
"value": "" "value" : ""
}, },
"JPUSH_OPPO_APPID": { "JPUSH_OPPO_APPID" : {
"des": "厂商OPPO-appId,示例OP-12345678", "des" : "厂商OPPO-appId,示例OP-12345678",
"key": "OPPO_APPID", "key" : "OPPO_APPID",
"value": "" "value" : ""
}, },
"JPUSH_OPPO_APPSECRET": { "JPUSH_OPPO_APPSECRET" : {
"des": "厂商OPPO-appSecret,示例OP-12345678", "des" : "厂商OPPO-appSecret,示例OP-12345678",
"key": "OPPO_APPSECRET", "key" : "OPPO_APPSECRET",
"value": "" "value" : ""
}, },
"JPUSH_VIVO_APPKEY": { "JPUSH_VIVO_APPKEY" : {
"des": "厂商VIVO-appkey,示例12345678", "des" : "厂商VIVO-appkey,示例12345678",
"key": "com.vivo.push.api_key", "key" : "com.vivo.push.api_key",
"value": "" "value" : ""
}, },
"JPUSH_VIVO_APPID": { "JPUSH_VIVO_APPID" : {
"des": "厂商VIVO-appId,示例12345678", "des" : "厂商VIVO-appId,示例12345678",
"key": "com.vivo.push.app_id", "key" : "com.vivo.push.app_id",
"value": "" "value" : ""
}, },
"JPUSH_MEIZU_APPKEY": { "JPUSH_MEIZU_APPKEY" : {
"des": "厂商MEIZU-appKey,示例MZ-12345678", "des" : "厂商MEIZU-appKey,示例MZ-12345678",
"key": "MEIZU_APPKEY", "key" : "MEIZU_APPKEY",
"value": "" "value" : ""
}, },
"JPUSH_MEIZU_APPID": { "JPUSH_MEIZU_APPID" : {
"des": "厂商MEIZU-appId,示例MZ-12345678", "des" : "厂商MEIZU-appId,示例MZ-12345678",
"key": "MEIZU_APPID", "key" : "MEIZU_APPID",
"value": "" "value" : ""
}, },
"JPUSH_XIAOMI_APPKEY": { "JPUSH_XIAOMI_APPKEY" : {
"des": "厂商XIAOMI-appKey,示例MI-12345678", "des" : "厂商XIAOMI-appKey,示例MI-12345678",
"key": "XIAOMI_APPKEY", "key" : "XIAOMI_APPKEY",
"value": "" "value" : ""
}, },
"JPUSH_XIAOMI_APPID": { "JPUSH_XIAOMI_APPID" : {
"des": "厂商XIAOMI-appId,示例MI-12345678", "des" : "厂商XIAOMI-appId,示例MI-12345678",
"key": "XIAOMI_APPID", "key" : "XIAOMI_APPID",
"value": "" "value" : ""
} }
} }
} }
} }
} }
}, },
/* */ /* */
"quickapp": {}, "quickapp" : {},
/* */ /* */
"mp-weixin": { "mp-weixin" : {
"appid": "wx5fb1cc8edb3f8baa", "appid" : "wx5fb1cc8edb3f8baa",
"setting": { "setting" : {
"urlCheck": false, "urlCheck" : false,
"minified": true, "minified" : true,
"postcss": true, "postcss" : true,
"es6": true "es6" : true
}, },
"permission": { "permission" : {
"scope.userLocation": { "scope.userLocation" : {
"desc": "获取您的位置" "desc" : "获取您的位置"
} }
}, },
"requiredPrivateInfos": ["getLocation", "chooseAddress"], "requiredPrivateInfos" : [ "getLocation", "chooseAddress" ],
"usingComponents": true, "usingComponents" : true,
"__usePrivacyCheck__": true "__usePrivacyCheck__" : true
}, },
"mp-alipay": { "mp-alipay" : {
"usingComponents": true "usingComponents" : true
}, },
"mp-baidu": { "mp-baidu" : {
"usingComponents": true "usingComponents" : true
}, },
"mp-toutiao": { "mp-toutiao" : {
"usingComponents": true "usingComponents" : true
}, },
"h5": { "h5" : {
"devServer": { "devServer" : {
"https": false "https" : false
}, },
"router": { "router" : {
"mode": "history", "mode" : "history",
"base": "" "base" : ""
}, },
"domain": "", "domain" : "",
"sdkConfigs": { "sdkConfigs" : {
"maps": { "maps" : {
"qqmap": { "qqmap" : {
"key": "SMJBZ-WCHK4-ZPZUA-DSIXI-XDDVQ-XWFX7" "key" : "SMJBZ-WCHK4-ZPZUA-DSIXI-XDDVQ-XWFX7"
} }
} }
}, },
"title": "加载中...", "title" : "加载中...",
"template": "template.h5.html", "template" : "template.h5.html",
"optimization": { "optimization" : {
"treeShaking": { "treeShaking" : {
"enable": true "enable" : true
} }
} }
} }
} }

View File

@ -107,6 +107,13 @@
// #endif // #endif
} }
}, },
{
"path": "pages/goods_details/videoPlay",
"style": {
"navigationBarTitleText": "视屏详情"
}
},
{ {
"path": "pages/goods_cate/goods_cate", "path": "pages/goods_cate/goods_cate",
"style": { "style": {

View File

@ -319,6 +319,7 @@
</view> </view>
</view> </view>
<view class='product-intro' id="past3" style="background-color: #fff;"> <view class='product-intro' id="past3" style="background-color: #fff;">
<view class='conter' v-if="description"> <view class='conter' v-if="description">
<!-- #ifndef APP-PLUS --> <!-- #ifndef APP-PLUS -->
<jyf-parser v-if="description.type == 0" :domain='domain' <jyf-parser v-if="description.type == 0" :domain='domain'
@ -334,9 +335,26 @@
{{description.content.title}} {{description.content.title}}
</view> </view>
<view v-if="description.content && description.content.image" class="pictures"> <view v-if="description.content && description.content.image" class="pictures">
<image mode="widthFix" style="width: 100%;" <view class="" v-for="(item,index) in description.content.image" :key="index">
v-for="(item,index) in description.content.image" :key="index" :src="item"> <view style="position: relative;"
</image> v-if='videoTypeList.includes(getSuffix(item))' @click="navGoPlay(item)">
<!-- #ifdef APP-PLUS -->
<image :src="item+coverUrl" mode="widthFix"
style="background-color: #fff;width: 100vw;" />
<!-- <image class="image-play-icon" src="/static/images/stop.png"> -->
<u--image class="image-play-icon" src="/static/images/stop.png" width="100rpx" height="100rpx" ></u--image>
</image>
<!-- #endif -->
<!-- #ifndef APP-PLUS -->
<video :src="item" objectFit="cover" controls style="width:750rpx;"
show-center-play-btn show-mute-btn="true" auto-pause-if-navigate
:enable-progress-gesture="false"></video>
<!-- #endif -->
</view>
<image v-else :src="item" mode="widthFix"
style="background-color: #fff;width: 100vw;">
</image>
</view>
</view> </view>
</view> </view>
</view> </view>
@ -575,6 +593,8 @@
data() { data() {
let that = this; let that = this;
return { return {
videoTypeList: ['mp4', 'avi', 'mov', 'wmv', 'mkv', 'flv', 'mpeg', '3gp', 'webm'],
coverUrl: '?spm=a2c4e.11153940.blogcont573781.6.c1032027sQ46VG&x-oss-process=video/snapshot,t_1000,m_fast',
isNodes: 0, //, isNodes: 0, //,
sysHeight: sysHeight, // sysHeight: sysHeight, //
// //
@ -828,6 +848,22 @@
}, },
// #endif // #endif
methods: { methods: {
navGoPlay(url) {
uni.navigateTo({
url: `/pages/goods_details/videoPlay?url=${url}`
})
},
getSuffix(url) {
const str = url;
const lastIndex = str.lastIndexOf(".");
if (lastIndex !== -1) {
const extension = str.substring(lastIndex + 1);
return extension
} else {
console.log("字符串中没有找到点号。");
}
},
call: function() { call: function() {
let that = this; let that = this;
if (that.storeInfo.merchant.service_phone) { if (that.storeInfo.merchant.service_phone) {
@ -2686,4 +2722,11 @@
color: #000000; color: #000000;
// border: 1px solid #F55726; // border: 1px solid #F55726;
} }
.image-play-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
</style> </style>

View File

@ -0,0 +1,45 @@
<template>
<view class="">
<video :src="url" style="width: 750rpx;height: 1400rpx;" :autoplay='true' id="myvideo" controls></video>
</view>
</template>
<script>
export default {
data() {
return {
url: ""
}
},
methods: {
videoPlay() {
console.log("开始播放了")
},
videoShow() {
this.videoContext = uni.createVideoContext("myvideo", this); // this这个是实例对象 必传
this.videoUrl = this.url;
this.videoContext.requestFullScreen({
// direction: 90
});
this.videoContext.play();
this.videoPlay = true; // 显示播放盒子
}
},
onLoad(option) {
this.url = option.url
setTimeout(() => {
this.videoShow()
})
}
}
</script>
<style>
</style>