h5
fanfan
3 months ago
parent
15fa91af50
commit
2170a39cec
@ -0,0 +1,138 @@ |
||||
<template> |
||||
<view class="park"> |
||||
<!-- <view class="park-navbar"> |
||||
<u-navbar title="观看视频" :border-bottom="false" :background="background"></u-navbar> |
||||
</view> --> |
||||
<u-mask :show="show"> |
||||
<view class="warp" @click.stop="pauseVideo"> |
||||
<video @tap.stop style="width: 100%;" :loop='true' id="myVideo" :src="video_url"></video> |
||||
<view class="share"> |
||||
<button @click.stop="lookVideo" class="buttons"> 复制视频链接</button> |
||||
</view> |
||||
</view> |
||||
</u-mask> |
||||
</view> |
||||
</template> |
||||
<script> |
||||
import * as api from '@/api/tutorial' |
||||
export default { |
||||
data() { |
||||
return { |
||||
background: { |
||||
background: 'none' |
||||
}, |
||||
video_url: '' |
||||
|
||||
} |
||||
}, |
||||
onLoad(options) { |
||||
this.show = true; |
||||
let videoContext = wx.createVideoContext('myVideo') |
||||
videoContext.seek(0); |
||||
this.video_url = options.url |
||||
}, |
||||
onShow() { |
||||
|
||||
}, |
||||
onShareAppMessage(res) { |
||||
let that = this |
||||
return { |
||||
path: "/pages/merchantTutorial/lookVideo?url=" + that.video_url, |
||||
imageUrl: that.video_url, |
||||
success: function(res) { |
||||
// 转发成功之后的回调 |
||||
if (res.errMsg == 'shareAppMessage:ok') { |
||||
that.$toast('分享成功') |
||||
} |
||||
}, |
||||
fail: function() { |
||||
// 转发失败之后的回调 |
||||
if (res.errMsg == 'shareAppMessage:fail cancel') { |
||||
that.$toast('取消分享') |
||||
} else if (res.errMsg == 'shareAppMessage:fail') { |
||||
that.$toast('分享失败') |
||||
} |
||||
} |
||||
} |
||||
}, |
||||
methods: { |
||||
lookVideo() { |
||||
let str = |
||||
`【App内视频教程】：如何用易创相机开启抖音直播\n【点开学习】\n${this.video_url}(温馨提示：App教程内可以搜索你想要的内容，让你学习更加方便)` |
||||
uni.setClipboardData({ |
||||
data: str, // 这里是个坑接受字符串类型 value转化为字符串 |
||||
success: function() { |
||||
//调用方法成功 |
||||
uni.showToast({ |
||||
title: '复制成功', |
||||
icon: 'none', |
||||
duration: 2000 |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
pauseVideo() { |
||||
uni.createSelectorQuery().select('#myVideo').boundingClientRect(function(rect) { |
||||
uni.createVideoContext('myVideo', this).pause(); |
||||
}).exec(); |
||||
uni.navigateBack({ |
||||
delta: 1 |
||||
}) |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
<style> |
||||
page { |
||||
background: #fff; |
||||
} |
||||
</style> |
||||
<style> |
||||
.park { |
||||
height: 100%; |
||||
width: 100%; |
||||
background: rgba(255, 255, 255, 1); |
||||
} |
||||
|
||||
.warp { |
||||
width: 100%; |
||||
height: 100%; |
||||
background: #fff; |
||||
/* padding-top: 170rpx; */ |
||||
/* height: calc(100% - 170rpx); |
||||
*/ |
||||
|
||||
} |
||||
|
||||
.share { |
||||
width: 100%; |
||||
height: 150rpx; |
||||
color: white; |
||||
text-align: center; |
||||
vertical-align: top; |
||||
margin-top: 30rpx; |
||||
} |
||||
|
||||
.buttons { |
||||
margin-top: 30rpx; |
||||
border-radius: 42rpx; |
||||
text-align: center; |
||||
width: 300rpx; |
||||
background: linear-gradient(125.45deg, #ff8a66 0%, #f34a40 100%); |
||||
margin: 0 auto; |
||||
border: none !important; |
||||
padding: 0; |
||||
line-height: 80rpx; |
||||
height: 80rpx; |
||||
font-size: 34rpx; |
||||
font-family: PingFang SC, |
||||
PingFang SC; |
||||
font-weight: 700; |
||||
color: white; |
||||
} |
||||
|
||||
#myVideo { |
||||
background-color: #fff !important; |
||||
height: calc(100% - 150rpx); |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue