qzw_xcx/pages/myCenter/logion.vue

<template>
	<view>
		<view style="text-align: center;margin-top: 60upx;"><image src="../../static/logo.png" style="width: 150upx;height: 150upx;" /></view>
		<view v-if="!isLogin">
			<view style="text-align: center;margin: 50upx 0 10upx 0;font-size: 36upx;">圈在网申请获取您的以下权限</view>
			<view style="text-align: center;margin: 0 0 50upx 0;font-size: 24upx;color: #666666;">获取您的公开信息(昵称，头像等)</view>
			<view style="width: 50%;margin: 0 auto;"><button @getuserinfo="wxlogion" type="warn" open-type="getUserInfo">授权登录</button></view>
		</view>
		<view v-if="isLogin && !successlogion">
			<view style="text-align: center;margin: 100upx;font-size: 36upx;">登录即注册立即成为圈在网会员</view>
			<view style="width: 50%;margin: 0 auto;"><button type="warn" open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">微信手机号登录</button></view>
		</view>
		<view @click="closesure" style="width: 50%;margin: 30upx auto;text-align:center;font-szie: 30upx;">暂不授权</view>
		<view style="position: fixed; bottom: 30upx;width: 100%;">
			<view style="text-align: center;padding-bottom: 20upx;">请仔细阅读以下协议，若不同意相关内容，您应停止授权</view>
			<view style="text-align: center;">
				<span style="color: #D9332E;padding-right: 20upx;" @click="gouser">《用户协议》</span>
				<span style="color: #D9332E;" @click="goforate">《隐私政策》</span>
			</view>
		</view>
	</view>
</template>

<script>
import { mapMutations, mapState } from 'vuex';
export default {
	props: {
		showdialog: {
			default: false,
			type: Boolean
		},
		ishow: {
			default: true,
			type: Boolean
		}
	},
	data() {
		return {
			show: false,
			isLogin:false,
		};
	},
	computed: {
		...mapState([
			'hasLogin', // 用户是否同意授权
			'userInfo', // 同意授权用户头像
			'successlogion', // 同意手机号授权 登录成功
			'sessionId', // 登录成功的token
			'getcode' // logion时候获取的code session_key oppen_id
		])
	},
	onLoad() {
	},
	methods: {
		...mapMutations(['login', 'showDialog', 'setOpenid', 'setcode', 'islogionsuccess']),
		closesure() {
			uni.navigateBack();
		},
		// 隐私政策
		goforate() {
			uni.navigateTo({
				url: './goforate'
			});
		},

		// 用户协议
		gouser() {
			uni.navigateTo({
				url: './gouser'
			});
		},
		// 授权用户信息头像
		wxlogion(e) {
			let userInfo = e.detail.userInfo;
			if(userInfo){
				this.login(userInfo);
				this.$msg('授权成功');
				if (this.successlogion) {
					this.showDialog(true); 
					uni.navigateBack();
				}else{
					this.isLogin=true;
				}
			}else{
				this.showDialog(false);
				this.$msg('授权失败');
			}

		},
		// 获取手机号码
		decryptPhoneNumber(e) {
			if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
				
			} else {
				let encryptedData = e.detail.encryptedData;
				let iv = e.detail.iv;
				console.log("1");
				console.log(this.getcode);
				// 调取注册账号
				this.request({
					url: '/v1/entry/mp_account',
					method: 'POST',
					data: {
						code: this.getcode.code,
						encryptedData: encryptedData,
						iv: iv,
						name: this.userInfo.nickName,
						avatar: this.userInfo.avatarUrl
					},
					success: res => {
						console.log(res);
						let token = res.data.data.token;
						this.setOpenid(token);
						this.islogionsuccess(true);
						this.showDialog(true); // 改变haslogion的值
						uni.navigateBack();
					},
					fail: res => {
						console.log("2");
						console.log(res);
						this.islogionsuccess(false);
						this.setOpenid('');
						this.$msg('获取失败');
					}
				});
			}
		}
	}
};
</script>

<style></style>