stx2.0/pages/public/wxLogin.vue

<template>
	<view class="content">
		<!-- #ifndef H5 -->
		<!-- <image class="bg-img" :src="baseURL+urlFile+'/img/img09.png'" mode=" scaleToFill"></image> -->
		<view class="logo-img-box">
			<image class="logo-img" src="../../static/img/login.png" mode=" aspectFit"></image>
			<button class="userInfo" type="warn" :class="{'nocaction': isclick}" open-type="getPhoneNumber"
				@getphonenumber="getphonenumber">
				<text>
					手机号快捷登录
				</text>
			</button>
		</view>
		<!-- #endif -->

		<editUserModal :isShow="isShow" @closeEdit="closeEdit" @editSuccess="editSuccess">
		</editUserModal>
	</view>
</template>

<script>
	import {
		getUserInfo
	} from '@/api/login.js';
	// #ifdef H5
	import {
		loginWinxin
	} from '@/utils/wxAuthorized';
	// #endif
	// #ifdef MP-WEIXIN
	import {
		loginWinxinMp
	} from '@/utils/wxMinProgram';
	import {
		wechatMpAuth
	} from '@/api/wx';
	// #endif
	import {
		mapMutations,
		mapState
	} from 'vuex';
	import editUserModal from '@/components/eidtUserModal/index.vue'
	export default {
		data() {
			return {
				userInfo: {}, //授权用户信息
				code: '', //授权code
				isclick: false, //是否点击了
				isShow:false,
			};
		},
		onLoad(option) {
			this.loadData();
		},
		components: {
			editUserModal
		},
		methods: {
			// ...mapMutations(['login', 'setUserInfo']),
			...mapMutations('user', ['login', 'setUserInfo']),
			loadData() {
				let obj = this;
				// #ifdef H5
				loginWinxin();
				// #endif
				// #ifdef MP-WEIXIN
				loginWinxinMp().then(() => {
					wx.login({
						success(e) {
							console.log(e, 'loginWinxinMp');
							obj.code = e.code;
						},
						fill: function(e) {
							console.log(e)
						}
					})
				});
				// #endif
			},
			lodingTrue(){
					let ur = uni.getStorageSync('present') || '/pages/index/index';
					uni.switchTab({
						url: ur,
						fail(e) {
							uni.navigateTo({
								url: ur,
								fail(e) {
									uni.navigateTo({
										url: '/pages/index/index',
									});
								}
							});
						}
					});
				
			},
			// #ifdef MP-WEIXIN
			closeEdit() {
				this.isShow = false
				uni.showToast({
					title: '登录成功',
					icon:"success"
				});
				this.lodingTrue();
			},
			editSuccess() {
				this.isShow = false;
				this.lodingTrue();
			},
			getphonenumber(e) {
				console.log(e);
				if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
					return false
				}
				uni.showLoading({
					title: '正在登录中'
				});
				this.getCode()
					.then(code => {
						this.getUserPhoneNumber(e.detail.encryptedData, e.detail.iv, code);
					})
					.catch(error => {
						console.log(error);
						uni.hideLoading();
					});
			},
			getUserPhoneNumber(encryptedData, iv, code) {
				const that =this;
				wechatMpAuth({
						encryptedData: encryptedData,
						iv: iv,
						code: code,
						spread_spid: uni.getStorageSync('spread') || '',
						spread_code: uni.getStorageSync('spread_code') || '',
						// key: this.authKey
					})
					.then(res => {
						uni.setStorageSync('token', res.data.token);
						console.log('cg');
						that.getUserInfo(res.data.store_user_avatar)
					})
					.catch(res => {
						uni.showToast({
							title: res,
							icon: "error"
						})
						uni.hideLoading();
					});
			},
			async getCode() {
				let provider = await this.getProvider();
				return new Promise((resolve, reject) => {
					uni.login({
						provider: provider,
						success(res) {
							return resolve(res.code);
						},
						fail() {
							return reject(null);
						}
					})
				})
			},
			getProvider() {
				return new Promise((resolve, reject) => {
					uni.getProvider({
						service: 'oauth',
						success(res) {
							resolve(res.provider);
						},
						fail() {
							resolve(false);
						}
					});
				});
			},
			getUserInfo: function(new_user, back_url) {
				let that = this;
				getUserInfo().then(res => {
					console.log(res,'res');
					that.login();
					uni.hideLoading();
					// 保存返回用户数据
					that.setUserInfo(res.data);
					console.log(res.data.avatar,'res.data.avatar');
					if (res.data.avatar ==
						"https://thirdwx.qlogo.cn/mmopen/vi_32/POgEwh4mIHO4nibH0KlMECNjjGxQUq24ZEaGT4poC6icRiccVGKSyXwibcPq4BWmiaIGuG1icwxaQX6grC9VemZoJ8rg/132"
					) {
						console.log('xx');
						that.isShow = true
					} else {
						console.log('xx2');
						that.lodingTrue();
					}
				}).catch(err => {
					console.log(err,'err');
					uni.hideLoading();
					uni.showToast({
						title: err.msg,
						icon: 'none',
						duration: 2000
					});
				});
			},
			// #endif
			// 用户确认授权
			// userInfoData(){
			// 	let that = this
			// 	if(that.isclick) {
			// 		return 
			// 	}
			// 	that.isclick = true
			// 	wx.getUserProfile({
			// 		desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
			// 		success: res => {
			// 			console.log(res,'that.userInfo+++++++++++++++++++')
			// 			that.userInfo = res;
			// 			uni.showLoading({
			// 				title: '授权中',
			// 				mask: true
			// 			});
			// 			that.loadMp();
			// 		},
			// 		fail: err => {
			// 			that.isclick = false
			// 			uni.showToast({
			// 				title: '您拒绝了请求,不能正常使用小程序',
			// 				icon: 'error',
			// 				duration: 2000
			// 			});
			// 			return;
			// 		}
			// 	});
			// 	// this.userInfo = e;
			// 	// console.log(e,'用户确认授权')
			// 	// this.loadMp()

			// },
			// #ifdef MP-WEIXIN
			// loadMp() {
			// 	let obj = this;
			// 	// 获取登录授权页数据
			// 	let user = obj.userInfo;
			// 	console.log(user)
			// 	// 获取推广人id
			// 	let spread_spid = uni.getStorageSync('spread') || '';
			// 	// #ifdef MP
			// 	let spread_code = uni.getStorageSync('spread_code') || '';
			// 	// #endif

			// 	wechatMpAuth({
			// 		code: obj.code,
			// 		iv: user.iv,
			// 		encryptedData: user.encryptedData,
			// 		spread_spid: spread_spid,
			// 		// #ifdef MP
			// 		spread_code: spread_code,
			// 		// #endif
			// 	}).then(({ data }) => {
			// 		obj.wchatAuth(data);
			// 		console.log(data,'wechatMpAuth++++++++++++++++++++++++++')

			// 	}).catch( err => {
			// 		// obj.loding = false;
			// 		// uni.hideLoading();
			// 	});
			// },
			// #endif
			// wchatAuth(data) {
			// 	let obj = this;
			// 	// 保存token
			// 	uni.setStorageSync('token', data.token);
			// 	// 获取用户基础信息
			// 	getUserInfo({}).then(e => {
			// 		console.log('userInfo+++++++++++',e)
			// 		obj.login();
			// 		uni.hideLoading();
			// 		// 保存返回用户数据
			// 		obj.setUserInfo(e.data);
			// 		let ur = uni.getStorageSync('present') || '/pages/index/index';
			// 		// 用于处理缓存bug
			// 		if (ur=='pages/shop/product') {
			// 			ur = '/pages/index/index'
			// 		}
			// 		uni.switchTab({
			// 			url: ur,
			// 			fail(e) {
			// 				uni.navigateTo({
			// 					url: ur,
			// 					fail(e) {
			// 						uni.navigateTo({
			// 							url: '/pages/index/index',
			// 						});
			// 					}
			// 				});
			// 			}
			// 		});
			// 	});
			// }
		}
	};
</script>

<style lang="scss">
	page,
	.content {
		height: 100%;
		background-color: #fff;
	}

	.bg-img,
	.logo-img-box {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	.logo-img {
		margin-top: 20vh;
		margin-left: 176rpx;
		width: 385rpx;
		height: 394rpx;
	}

	.userInfo {
		margin: 0 100rpx;
		margin-top: 50rpx;
		color: #FFFFFF;
		border-radius: 99rpx;
		background-color: $base-color !important;
	}

	.nocaction {
		background-color: #999;
	}
</style>