jiuyiUniapp/shop/components/share/shareByh5.vue

202 lines
4.5 KiB
Vue

<template>
<view style="width: 100%;height: 300upx;background: #FFFFFF;position: absolute;left:0;bottom: 0;">
<view class="share-pop">
<view class="share-item" @click="copyUrl()" v-show="!ifwx">
<image src="/static/share-f.png" mode=""></image>
<view class="">复制链接</view>
</view>
<view class="share-item" @click="createPoster()">
<image src="/static/poster.png" mode=""></image>
<view class="">生成海报</view>
</view>
</view>
<view class="button-bottom">
<button class="btn btn-w btn-square" @click="close()">关闭</button>
</view>
</view>
</template>
<script>
export default {
props: {
// 商品id
goodsId: {
type: Number,
default: 0
},
// 分享的图片
shareImg: {
type: String,
default: ''
},
// 分享标题
shareTitle: {
type: String,
default: ''
},
// 分享内容
shareContent: {
type: String,
default: ''
},
// 分享链接
shareHref: {
type: String,
default: ''
},
//分享类型
shareType:{
type:Number,
default:1
},
//拼团id
groupId:{
type:Number,
default:0
},
//拼团的团队id
teamId:{
type:Number,
default:0
},
ifwx:{
type: Boolean
}
},
mounted () {
/**
*
* H5端分享两种 (微信浏览器内引导用户去分享, 其他浏览器)
*
*/
},
methods: {
// 关闭弹出层
close () {
this.$emit('close')
},
// 生成海报
createPoster () {
let sysInfo = this.$db.get('sysInfo')
let data = {};
if (this.shareType == 1) {
//商品
data = {
page: 2, //商品
url: sysInfo.domain + '../../pagesU/user/jump',
params: {
goods_id: this.goodsId
},
type: 3,//海报
client: 1
}
} else if(this.shareType == 3) {
//会员
data = {
page: 3, //商品
url: sysInfo.domain + '../../pagesU/user/jump',
params: {
goods_id: this.goodsId,
group_id: this.groupId,
team_id: this.teamId
},
type: 3,//海报
client: 1
}
} else if(this.shareType == 2) {
//店铺
data = {
page: 3, //商品
url: sysInfo.domain + '../../pagesU/user/jump',
params: {
goods_id: this.goodsId,
group_id: this.groupId,
team_id: this.teamId
},
type: 3,//海报
client: 1
}
}
console.log(this.shareImg)
this.close()
this.$common.navigateTo('../../pagesU/user/share?poster=' + encodeURIComponent(this.shareImg))
},
copyUrl () {
let sysInfo = this.$db.get('sysInfo')
let data = {};
if (this.shareType == 1) {
data = {
page: 2, //商品
url: sysInfo.domain + '../../pagesU/user/jump',
params: {
goods_id: this.goodsId
},
type: 1,//URL
client: 1
}
} else if(this.shareType == 3) {
data = {
page: 3, //拼团
url: sysInfo.domain + '../../pagesU/user/jump',
params: {
goods_id: this.goodsId,
},
type: 1,//URL
client: 1
}
}
let _this = this;
uni.setClipboardData({
data: sysInfo.domain,
success:function(data){
_this.$mHelper.toast('复制成功');
},
fail:function(err){
_this.$mHelper.toast('复制分享URL失败');
}
})
},
// 分享操作
share () {
// h5分享 判断是否是微信浏览器 引导用户完成分享操作
// 其他浏览器的分享
}
}
}
</script>
<style>
.share-pop{
height: 300upx;
width: 100%;
display: flex;
}
.share-item{
flex: 1;
text-align: center;
font-size: 26upx;
color: #333;
padding: 20upx 0;
}
.share-item image{
width: 80upx;
height: 80upx;
margin: 20upx;
}
.share-item .btn{
line-height: 1;
display: block;
font-size: 26upx;
background-color: #fff;
}
</style>