xinwang/pages/user/shareQrCode.vue

<template>
	<view class="andr-shQ-padL30 andr-shQ-padR30 andr-shQ-Flex andr-shQ-FlexDirC">
		<view class="andr-shQ-w100B andr-shQ-Flex andr-shQ-JusCC">
			<swiper class="imgw750h375 matop"  :indicator-dots="false" :current="current" @change="currentChange" >
				<swiper-item v-for="(item, index) in rwmListArr" :key="index"><image :src="item.wap_poster" mode="aspectFit" class="imgw750h375" /></swiper-item>
			</swiper>
		</view>
		<view class="baocun" @click="comfirm(userInfo.uid+'')">复制邀请码</view>
		<!-- #ifdef H5 -->
		<!-- <view class="baocun">长按二维码保存图片</view> -->
		
		<!-- #endif -->
		<!-- #ifdef MP-WEIXIN -->
		<view class="baocun" @click="seav">保存图片并转发</view>
		<!-- <button open-type="share" class="baocun btn" v-if="scLoading == 2">分享到微信</button> -->
		<!-- #endif -->
	</view>
</template>
<script>
import weixinObj from "@/plugin/jweixin-module/index.js";
import { mapState } from 'vuex';
import { spreadBanner } from '@/api/user.js';
import { interceptor, saveUrl } from '@/utils/loginUtils';
// #ifdef H5
import { weixindata, weixinlocation,shareLoad } from '@/utils/wxAuthorized';
// #endif
export default {
	data() {
		return {
			rwmListArr: [],
			current: 0,
			imgSrc: ''
		};
	},
	async onLoad(option) {
		uni.showLoading({
			title: '邀请图生成中',
			mask: true
		});
		// 判断是否强制登录
		weixinObj.hideAllNonBaseMenuItem();
		await this.loadCodeList();
		// #ifdef MP-WEIXIN
		uni.authorize({
			scope: 'scope.writePhotosAlbum',
			complete() {}
		});
		// #endif
		// #ifdef H5
		weixinObj.showAllNonBaseMenuItem()
		// weixinObj.showAllNonBaseMenuItem();
		this.IndexShare()
		// wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
		// let path = '/#/pages/index/index' + '?';
		// console.log(obj.Path)
		// // 保存邀请人
		// path += 'spread=' + this.userInfo.uid;
		//   wx.updateAppMessageShareData({ 
		//     title: this.userInfo.nickname + '邀请您进入Xingwang鑫旺', // 分享标题
		//     desc: '欢迎加入Xingwang鑫旺', // 分享描述
		//     link: this.baseURL + path, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
		//     imgUrl: '../../static/img/logo.png', // 分享图标
		//     success: function () {
		//       // 设置成功
		//     }
		//   })
		// });
		// #endif
	},
	onShow() {
		if (this.loginInterceptor && !this.hasLogin) {
			saveUrl();
			// 登录拦截
			interceptor();
		}
	},
    //下拉刷新
    onPullDownRefresh() {
    	let obj = this;
    	//监听下拉刷新动作的执行方法，每次手动下拉刷新都会执行一次
    	setTimeout(function() {
    		obj.loadCodeList();
    		uni.stopPullDownRefresh(); //停止下拉刷新动画
    	}, 1000);
    },
	computed: {
		...mapState(['weichatObj', 'baseURL', 'urlFile']),
		...mapState('user', ['userInfo', 'orderInfo', 'hasLogin'])
	},
	methods: {
		comfirm(text) {
			// let text = this.userInfo.uid
			console.log(text);
			const result = this.uniCopy(text);
			if (result === false) {
				uni.showToast({
					title: '不支持'
				});
			} else {
				uni.showToast({
					title: '复制成功',
					icon: 'none'
				});
			}
			// this.$refs.popup.close();
		},
		uniCopy(content) {
			/**
			 * 小程序端 和 app端的复制逻辑
			 */
			//#ifndef H5
			uni.setClipboardData({
				data: content,
				success: function() {
					console.log('success');
					return true;
				}
			});
			//#endif
		
			/**
			 * H5端的复制逻辑
			 */
			// #ifdef H5
			if (!document.queryCommandSupported('copy')) {
				//为了兼容有些浏览器 queryCommandSupported 的判断
				// 不支持
				return false;
			}
			let textarea = document.createElement('textarea');
			textarea.value = content;
			textarea.readOnly = 'readOnly';
			document.body.appendChild(textarea);
			textarea.select(); // 选择对象
			textarea.setSelectionRange(0, content.length); //核心
			let result = document.execCommand('copy'); // 执行浏览器复制命令
			textarea.remove();
			return result;
			// #endif
		},
		loadCodeList() {
			let self = this;
			// 加载二维码信息
			// let andrUid = uni.getStorageSync('andrUid')||'';
			spreadBanner({
				// #ifdef H5
				type: 2,
				// #endif
				// #ifdef MP
				type: 1,
				// #endif
			}).then(e => {
				if (e.status == 200) {
					console.log(e.data)
					self.rwmListArr = e.data;
					// #ifdef H5
					self.imgSrc = self.rwmListArr[0].wap_poster;
					// #endif
					// #ifdef MP-WEIXIN
					self.imgSrc = self.rwmListArr[0].poster;
					// #endif
				}
				uni.hideLoading();
			});
		},
		currentChange(e) {
			this.current = e.detail.current;
		},
		// #ifdef H5
		IndexShare() {
			let obj = this;
			let pages = getCurrentPages();
			// 获取当前页面
			let page = pages[pages.length - 1];
			let path = '/#/pages/index/index' + '?';
			// 保存传值
			for (let i in page.options) {
				path += i + '=' + page.options[i] + '&';
			}
			console.log(obj.Path)
			// 保存邀请人
			path += 'spread=' + this.userInfo.uid;
			let data = {
				link: this.baseURL + path,
				title: this.userInfo.nickname + '邀请您进入Xingwang鑫旺',
				desc:'欢迎加入Xingwang鑫旺',
				imgUrl: 'http://xw.liuniu946.com/static/img/logo.png'
			};
			console.log(data,'分享数据');
			shareLoad(data);
		},
		// #endif
		// #ifdef MP-WEIXIN
		seav() {
			uni.getImageInfo({
				src: this.imgSrc,
				complete: function (result) {
					let path = result.path;
					uni.getSetting({
						success(res) {
							console.log(res)
							if (!res.authSetting['scope.writePhotosAlbum']) {
								uni.authorize({
									scope:'scope.writePhotosAlbum',
									success(res) {
										uni.saveImageToPhotosAlbum({
											filePath:path,
											complete(result) {
											}
										});
									},
									complete(result) {
									    uni.showToast({
									         title: '请先授权保存图片',
									         duration: 2000,
											 icon:'none'
									    });
										obj.seav();
									}
								})
							}else{
								uni.saveImageToPhotosAlbum({
									filePath:path,
									complete(result) {
									     uni.showToast({
									         title: '保存图片成功！',
									         duration: 2000,
											 icon:'none'
									     });
									}
								});
							}
						}
					});
				}
			});
		}
		// #endif
	}
};
</script>

<style lang="scss">
.imgw750h375 {
	width: 700rpx;
	height: 958rpx;
}
.matop{
	margin-top: 40rpx;
}
.andr-shQ-padL30 {
	padding-left: 30rpx;
}
.andr-shQ-padR30 {
	padding-right: 30rpx;
}
.andr-shQ-Flex {
	display: flex;
}
.andr-shQ-FlexDirC {
	flex-direction: column;
}
.andr-shQ-w100B {
	width: 100%;
}
.andr-shQ-JusCC {
	justify-content: center;
}
.andr-shQ-marginT30 {
	margin-top: 30rpx;
}
.andr-shQ-bgc06B163 {
	background-color: $base-color;
}
.andr-shQ-cFFF {
	color: #ffffff;
}
.andr-shQ-bdR50 {
	border-radius: 50rpx;
}
.andr-shQ-h86 {
	height: 86rpx;
}
.andr-shQ-AIC {
	align-items: center;
}
.baocun {
	color: #ffffff;
	background: $base-color;
	text-align: center;
	width: 80%;
	margin: 50rpx auto;
	font-size: 28rpx;
	padding: 25rpx 0rpx;
	border-radius: 50rpx;
}
.btn{
	padding: 0rpx 0rpx !important;
	margin: 0rpx auto;
	margin-bottom: 100rpx;
}
/* #ifdef H5 */
.cbnagan {
	width: 80%;
	background: $base-color;
	margin: 50rpx auto;
	font-size: 28rpx;
	text-align: center;
}
/* #endif */
</style>