h5
fanfan
7 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