newXLSC/pages/shop/shareF.vue

<template>
	<view class="content">
		<image src="http://xxl.liuniu946.com/static/image/share-bg.png" mode="" class="bg"></image>
		<view class="">

		</view>
		<view class="share-user-logo">
			<image :src="userlogo" mode=""></image>
		</view>
		<view class="good">
			<image src="http://xxl.liuniu946.com/static/image/good.png" mode=""></image>
		</view>
		<view class="good-tit">
			{{goodname}}
		</view>
		<!-- #ifdef MP-WEIXIN -->
		<button class="share-btn" open-type="share" v-if="couldshare == 1">
			立即分享
		</button>
		<!-- #endif -->
		<!-- #ifdef H5 -->
		<button class="share-btn" open-type="share" v-if="couldshare == 1" @click="imgShare = true">
			立即分享
		</button>
		<!-- #endif -->
		<view class="share-btn" v-if="couldshare == 2" @click="getGift">
			{{jsspan}}
		</view>
		<image src="../../static/img/shareimg.png" mode="widthFix" style="position: fixed;top:0;width: 750rpx;"
			v-if="imgShare" @click="imgShare = !imgShare">
		</image>
	</view>
</template>

<script>
	// #ifdef H5
	import {
		weixindata,
		shareLoad
	} from '@/utils/wxAuthorized';
	// #endif
	import {
		getGift
	} from '@/api/shop.js'
	export default {
		data() {
			return {
				code: '',
				imgShare: false,
				userlogo: '',
				shareId: '',
				nickname: '',
				goodimg: '',
				couldshare: 0,
				jsspan: '立即领取',
				goodname: ''
			}
		},
		onLoad(opt) {
			this.code = opt.code
			this.userlogo = opt.logo
			this.shareId = opt.shareid
			this.nickname = decodeURI(opt.nickname)
			this.couldshare = opt.type
			this.goodname = decodeURI(opt.goodname)
			// #ifdef MP
			if (opt.type == 2) {
				if (opt.scene) {
					// 存储小程序邀请人
					uni.setStorage({
						key: 'spread_code',
						data: opt.scene
					});
				}
			}
			// #endif
			// #ifdef H5
			this.IndexShare()
			// #endif

		},
		// 分享
		onShareAppMessage(options) {
			let obj = this
			// 设置菜单中的转发按钮触发转发事件时的转发内容
			let pages = getCurrentPages(); //获取加载的页面
			let currentPage = pages[pages.length - 1]; //获取当前页面的对象
			let url = currentPage.route; //当前页面url
			let item = currentPage.options; //如果要获取url中所带的参数可以查看options
			// let name = this.goodsObjact.store_name || this.goodsObjact.title;
			let shareObj = {
				title: obj.nickname + '分享您一张子臣鸭汤兑换券', // 默认是小程序的名称(可以写slogan等)
				path: url + '?code=' + obj.code + '&type=2' +
					'&logo=' + obj.userlogo +
					'&nickname=' + encodeURI(obj.nickname) + '&goodname=' + encodeURI(obj
						.goodname), // 默认是当前页面，必须是以‘/’开头的完整路径
				imageUrl: 'http://xxl.liuniu946.com/static/image/good.png',
				success: function(res) {
					console.log(shareObj.path, 'path+++++++++++++++++++');
					// 转发成功之后的回调
					if (res.errMsg == 'shareAppMessage:ok') {}
				},
				fail: function() {
					// 转发失败之后的回调
					if (res.errMsg == 'shareAppMessage:fail cancel') {
						// 用户取消转发
					} else if (res.errMsg == 'shareAppMessage:fail') {
						// 转发失败，其中 detail message 为详细失败信息
					}
				}
			};

			return shareObj;
		},
		methods: {

			// #ifdef H5
			IndexShare() {
				let obj = this;
				console.log(obj.Path);
				// 保存邀请人
				let data = {
					link: obj.$store.state.baseURL + '/index/#/pages/shop/shareF?code=' + obj.code + '&type=2' +
						'&logo=' + obj.userlogo +
						'&nickname=' + encodeURI(obj.nickname) + '&goodname=' + encodeURI(obj.goodname),
					title: obj.nickname + '向您分享' + obj.goodname,
					desc: '欢迎加入想亮',
					imgUrl: 'http://xxl.liuniu946.com/static/image/good.png'
				};
				console.log(data, '分享数据');
				shareLoad(data);
			},
			// #endif
			getGift() {
				let obj = this
				console.log('ddd')
				getGift({
					code: obj.code
				}).then(res => {
					console.log(res)
					uni.showToast({
						title: '领取成功',
						duration: 2000
					});
					obj.jsspan = '已领取'
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/index/index'
						})
					}, 1500)

				}).catch(err => {
					console.log(err)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #901b21;
		width: 100%;
		height: 100%
	}

	.content {
		position: relative;
		background-color: #901b21;
		min-height: 100%;

		.bg {
			// position: absolute;
			width: 750rpx;
			height: 1334rpx;
		}

		.share-btn {
			width: 492rpx;
			height: 86rpx;
			background-color: #ebd49e;
			border-radius: 43rpx;
			text-align: center;
			line-height: 86rpx;
			color: #901b21;
			font-weight: bold;
			font-size: 36rpx;
			position: absolute;
			top: 1159rpx;
			left: 130rpx;
		}

		.share-user-logo {
			position: absolute;
			top: 400rpx;
			left: 0;
			right: 0;
			margin: auto;
			width: 118rpx;
			height: 118rpx;
			border-radius: 50%;

			image {
				width: 118rpx;
				height: 118rpx;
				border-radius: 50%;
			}
		}

		.good {
			width: 290rpx;
			height: 290rpx;
			border-radius: 20rpx;
			position: absolute;
			top: 560rpx;
			left: 0;
			right: 0;
			margin: auto;

			image {
				width: 290rpx;
				height: 290rpx;
				border-radius: 20rpx;
			}
		}

		.good-tit {
			position: absolute;
			font-size: 32rpx;
			color: #901b21;
			text-align: center;
			width: 750rpx;
			top: 880rpx;
		}
	}
</style>