jzhw_uni/pages/auth/login/login.vue

<template>
	<view class="container">
		<view class="login-box">
			<text style="color: #838383; font-size: 25rpx;">您还没有登录</text>
			<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="wx-login-btn" v-if="checked">
				点击授权注册登录
			</button>
			<button   class="wx-login-btn" v-if="!checked" @tap="showNotice=true">
				点击授权注册登录
			</button>
			<view class="" @click="changeState">
				<image src="https://mall.zhaijieshi.cc/file/wx-huawang/dian1.png" mode="" v-if="!checked" class="icon-img"></image>
				<image src="https://mall.zhaijieshi.cc/file/wx-huawang/dian2.png" mode="" v-else  class="icon-img"></image>
				<text>我已阅读并同意</text>
				<text 	@tap="showProtocal" style="margin: 10rpx;color:#d77958 ;">《隐私协议》</text>
			</view>
		</view>
		<view class="notice" v-if="showNotice">
			请阅读并勾选上方协议
		</view>
	</view>
</template>

<script>
	var api = require('../../../config/api.js');
	var util = require('../../../utils/util.js');
	var user = require('../../../utils/user.js');
	var app = getApp();
	export default {
		data() {
			return {
				username: '',
				mobile: '',
				code: '',
				type: '',
				checked: false,
				showNotice:false
			};
		},
		onLoad: function(options) {
			// 页面初始化 options为页面跳转所带来的参数
			// 页面渲染完成
			if (options.reg != null) {
				uni.showModal({
					title: '提示',
					content: '授权过期，请重新授权',
					showCancel: false
				});
			}
			if (options.type && options.type != null && options.type != '') {
				this.setData({
					type: options.type
				});
			}
		},
		onReady: function() {},
		onShow: async function() {
			// 页面显示
			let that = this;
			await that.wxloginCode();
			if (this.type == 1) {
				//切换账号不自动登录
				return;
			}
			// uni.showLoading({
			// 	title: '授权中'
			// });
			let r_userid = uni.getStorageSync('r_userid');
			if (r_userid == null || r_userid == '') {
				r_userid = 0;
			}
			util.request(api.AuthRegister, {
					code: that.code,
					r_userid: r_userid
				})
				.then(function(res) {
					if (res.errno === 0) {
						//存储用户信息
						app.globalData.hasLogin = true;
						app.globalData.userInfo = res.data.userInfo;
						uni.setStorageSync('userInfo', res.data.userInfo);
						uni.setStorageSync('token', res.data.token);
						that.getdefalutUserAddress();
						uni.showToast({
							title: '授权成功',
							icon: 'none'
						});
						uni.navigateBack({
							delta: 1
						});
					}
					uni.hideLoading();
					that.wxloginCode();
				})
				.catch(function(err) {
					uni.hideLoading();
					that.wxloginCode();
				});
		},
		onHide: function() {
			// 页面隐藏
		},
		onUnload: function() {
			// 页面关闭
		},
		methods: {
			changeState(){
				this.setData({
					checked:!this.checked
				});
				if(this.checked==true){
					this.showNotice=false
				}	
			},
			//点击查看隐私协议
			showProtocal() {
				uni.navigateTo({
					url: "/pages/auth/login/protocol/protocol"
				})
			},
			async wxloginCode() {
				let that = this;
				await user.login().then((res) => {
					console.info(res);
					that.setData({
						code: res.code
					});
				});
			},

			getdefalutUserAddress() {
				//登陆拿用户默认地址，如果没有就拿系统默认地址
				//如果有默认地址，但是不在门店服务区域里
				util.request(api.OrderBookDefaultAddress, {}, 'get').then((res) => {
					if (res.errno === 0) {
						let address = res.data;
						if(address.length>0){
								var city = address.city.indexOf('市辖') != -1 ? address.province : address.city;
						//通过jz_shop的shop_no关联服务力分配的门店id，拿实际的jz_shop的门店id
						var addresInfo = {
							city: city,
							lng: address.lng,
							lat: address.lat,
							shopId: address.shopId,
							address: address.addressDetail,
							shopName: address.shopName
						};
						uni.setStorageSync('addressInfo', addresInfo);
						}else{
							return 
						}
					
					} else {
						//无默认地址时 拿系统的
						this.getdefaultCityShop();
					}
				});
			},

			getdefaultCityShop() {
				let that = this;
				util.request(api.getDefaultCityShop, {}, 'get').then((res) => {
					if (res.errno === 0) {
						uni.setStorageSync('addressInfo', res.data);	
					}
					
				});
			},

			getPhoneNumber: function(e) {
				if(this.checked){	
					this.setData({
						showNotice:false
					})
				var ivObj = e.detail.iv;
				var telObj = e.detail.encryptedData;
				var that = this;
				let r_userid = uni.getStorageSync('r_userid');
				if (r_userid == null || r_userid == '') {
					r_userid = 0;
				}
				console.log('请求授权登录：code:' + that.code + 'encryptedData,' + telObj + 'iv,' + ivObj + 'r_userid,' +
					r_userid);
				//------执行Login---------
				util.request(api.AuthRegister, {
					code: that.code,
					encryptedData: telObj,
					iv: ivObj,
					r_userid: r_userid
				}).then(function(res) {
					if (res.errno === 0) {
						//存储用户信息
						app.globalData.hasLogin = true;
						app.globalData.userInfo = res.data.userInfo;
						uni.setStorageSync('userInfo', res.data.userInfo);
						uni.setStorageSync('token', res.data.token);
						that.getdefalutUserAddress();
						uni.showToast({
							title: '授权注册成功',
							icon: 'success',
							duration: 2000,
							complete: function() {
								setTimeout(function() {
									uni.navigateBack({
										delta: 1
									});
								}, 2000);
							}
						});
					} else {
						console.info(res);
						uni.showToast({
							title: '授权失败请重试',
							icon: 'error',
							duration: 3000
						});
					}
				});

				//-----------------是否授权，授权通过进入主页面，授权拒绝则停留在登陆界面
				if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
					//用户点击拒绝
					uni.showModal({
						title: '警告',
						content: '您点击了拒绝授权，部分功能无法使用!!!',
						showCancel: false,
						confirmText: '确定',
						success: function(res) {
							// 用户没有授权成功，不需要改变 isHide 的值
							if (res.confirm) {
								uni.switchTab({
									url: '/pages/index/index'
								});
							}
						}
					});
				}
				}else{
					this.setData({
						showNotice:true
					})
				}
			},

			wxLogin: function(e) {
				//console.log(e);
				if (e.detail.userInfo == null) {
					app.globalData.hasLogin = false;
					return;
				}
				app.globalData.hasLogin = false;
				uni.setStorageSync('userInfo', null);
				user.checkLogin().catch(() => {
					user.loginByWeixin(e.detail.userInfo)
						.then((res) => {
							console.log(res);
							app.globalData.hasLogin = true;
							uni.navigateBack({
								delta: 1
							});
						})
						.catch((err) => {
							app.globalData.hasLogin = false;
							console.log(err);
							uni.switchTab({
								url: '/pages/index/index'
							});
						});
				});
			}
		}
	};
</script>
<style>
	page {
		height: 100%;
		width: 100%;
		background-color: #f7f7f7;
	}

	.login-box {
		width: 100%;
		height: auto;
		overflow: hidden;
		padding: 0 40rpx;
		margin-top: 200rpx;
		align-items: center;
		text-align: center;
	}

	.login-box text {
		text-align: center;
	}

	.img {
		width: 50rpx;
		height: 50rpx;
	}

	.wx-login-btn {
		margin: 60rpx 0 40rpx 0;
		height: 96rpx;
		line-height: 96rpx;
		font-size: 30rpx;
		border-radius: 6rpx;
		width: 90%;
		color: #fff;
		right: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		position: flex;
		bottom: 0;
		left: 0;
		padding: 0;
		margin-left: 5%;
		text-align: center;
		/* padding-left: -5rpx; */
		border-radius: 10rpx;
		letter-spacing: 3rpx;
		/*background-color: #242a48;*/
		background-color: #d77958;
	}

	.account-login-btn {
		width: 90%;
		margin: 0 auto;
		color: #fff;
		font-size: 30rpx;
		height: 96rpx;
		line-height: 96rpx;
		right: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		position: flex;
		bottom: 0;
		left: 0;
		border-radius: 0;
		padding: 0;
		margin-left: 5%;
		text-align: center;
		border-top-left-radius: 50rpx;
		border-bottom-left-radius: 50rpx;
		border-top-right-radius: 50rpx;
		border-bottom-right-radius: 50rpx;
		letter-spacing: 3rpx;
		background-image: linear-gradient(to right, #9a9ba1 0%, #9a9ba1 100%);
	}

	.wechat {
		width: 80rpx;
		height: 80rpx;
		margin-right: 15rpx;
	}

	.form-text {
		margin-top: 100rpx;
		text-align: center;
	}

	.form-item {
		position: relative;
		height: 96rpx;
		border-bottom: 1px solid #d9d9d9;
	}

	.form-item .username,
	.form-item .password,
	.form-item .mobile,
	.form-item .code {
		position: absolute;
		top: 26rpx;
		left: 0;
		display: block;
		width: 100%;
		height: 44rpx;
		color: #333;
		font-size: 30rpx;
	}

	.form-item-code {
		margin-top: 32rpx;
		height: auto;
		overflow: hidden;
		width: 100%;
		float: left;
		width: 350rpx;
	}

	.form-item-code .form-item {
		float: left;
		width: 350rpx;
	}

	.form-item-getPhone {
		margin-top: 18rpx;
		height: auto;
		float: right;
		/*border: 1px solid #242a48;*/
		border-radius: 6rpx;
		color: #242a48;
		/*background: green;*/
		font-size: 30rpx;
	}
	.van-checkbox__label{
		margin-left: 18rpx!important;
		 margin-top: 60rpx!important;
	}
	.van-checkbox__icon-wrap{
		    line-height: 20rpx!important;
		    margin-top: 72rpx!important;
		    margin-left: 150rpx!important;
		}
		.notice{
			width: 415rpx;
			height: 82rpx;
			background: #4C4C4C;
			border-radius: 22rpx;
			font-weight: 400;
			font-family: PingFangSC, PingFang SC;
			font-size: 31rpx;
			color: rgba(255,255,255,0.9);
			line-height: 82rpx;
			text-align: center;
			font-style: normal;
			margin-left: 168rpx;
			margin-top: 150rpx;
		}
		.icon-img{
			width: 22rpx;
			height: 22rpx;
			display: inline-block;
			margin-right: 10rpx;
			
		}
</style>