pages/sub_basic/login.vue

<template>
	<view class="login" @touchmove.stop.prevent="moveHandle">
		<!-- #ifndef MP-WEIXIN -->
		<u-navbar title="登录" :border-bottom="false" :is-back="false"></u-navbar>
		<!-- #endif -->
		<view class="login-con">
			<view class="login-con-logo">
				<!-- #ifdef MP-WEIXIN -->
				<u-image src="/pages/sub_basic/images/login/logo.png" width="300rpx" mode="widthFix"></u-image>
				<!-- #endif -->
				<!-- #ifndef MP-WEIXIN -->
				<u-image src="./images/login/logo.png" width="300rpx" mode="widthFix"></u-image>
				<!-- #endif -->
			</view>
			<view class="login-con-form">
				<u-field v-model="tel" placeholder="请输入手机号" label-width="50" maxlength="11" type="number" clear-size="40">
					<u-icon slot="icon" name="shouji" custom-prefix="custom-icon" color="#999999"></u-icon>
				</u-field>
				<u-field v-model="pwd" icon="lock-fill" placeholder="请输入密码" label-width="50" icon-color="#999999" maxlength="12"
				 :password="true" type="text" clear-size="40"></u-field>
				<view class="login-con-form-forget"><text @click="toUrl('/pages/sub_basic/forgetPwd')">忘记密码?</text></view>
			</view>
			<u-button @click="login" :custom-style="loginConBtn">登录</u-button>
			<u-button @click="toUrl('/pages/sub_basic/register')" :custom-style="loginConBtnr">注册</u-button>
			<view class="login-con-youke" @click="toIndex"><text>游客登陆</text></view>
			<view class="login-con-footer">
				<view class="login-con-footer-title"><text style="color: #CCCCCC;margin-right: 30rpx;">————</text> 其他登陆方式 <text
					 style="color: #CCCCCC;margin-left: 30rpx;">————</text></view>
				<view class="login-con-footer-icon">
					<!-- #ifdef MP-WEIXIN -->
					<u-image src="/pages/sub_basic/images/login/finge.png" width="50rpx" height="50rpx" mode="aspectFit" @click="fingerIn"></u-image>
					<!-- <u-image src="/pages/sub_basic/images/login/face.png" width="50rpx" height="50rpx" mode="aspectFit" @click="faceIn"></u-image> -->
					<u-image src="/pages/sub_basic/images/login/hands.png" width="50rpx" height="50rpx" mode="aspectFit" @click="handsIn"></u-image>
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<u-image src="./images/login/finge.png" width="50rpx" height="50rpx" mode="aspectFit" @click="fingerIn"></u-image>
					<!-- <u-image src="./images/login/face.png" width="50rpx" height="50rpx" mode="aspectFit" @click="faceIn"></u-image> -->
					<u-image src="./images/login/hands.png" width="50rpx" height="50rpx" mode="aspectFit" @click="handsIn"></u-image>
					<!-- #endif -->
					
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp()
	export default {
		data() {
			return {
				pwd: "",
				tel: "",
				loginConBtn: {
					backgroundColor: ' #2FA8E1',
					padding: '50rpx 0',
					color: '#FFFFFF',
					width: ' 600rpx',
					fontSize: '30rpx',
					border: '1px solid #2FA8E1',
				},
				loginConBtnr: {
					padding: '50rpx 0',
					color: '#2FA8E1',
					width: ' 600rpx',
					fontSize: '30rpx',
					border: '1px solid #2FA8E1',
					marginTop: '30rpx'
				}
			}
		},
		onLoad() {
			let routes = getCurrentPages();
			let tel = uni.getStorageSync("phone")
			if (tel) {
				this.tel = tel
			}
			
		},
		methods: {
			moveHandle() {
				return
			},
			toIndex() {
				uni.clearStorageSync()
				uni.switchTab({
					url: "/pages/sub_tabbar/index"
				})
			},
			login() {
				let that = this
				let {
					tel,
					pwd
				} = that
				// console.log(tel,pwd)
				if (tel == "") {
					uni.showToast({
						title: "请填写正确手机号",
						duration: 800,
						mask: true,
						icon: "none"
					})
					return false
				}
				if (pwd == "") {
					uni.showToast({
						title: "请填写登录密码",
						duration: 800,
						mask: true,
						icon: "none"
					})
					return false
				}
				
				// #ifdef H5
				let platform = 'H5'
				let uuid = ''
				// #endif
				
				// #ifdef APP-PLUS
				let uuid = app.globalData.clientid ? app.globalData.clientid:''
				let platform = uni.getStorageSync('platform') ? 'App-' + uni.getStorageSync('platform') : ''
				// #endif
				
				// #ifdef MP-WEIXIN
				let platform = uni.getStorageSync('platform') ? 'Wechat-' + uni.getStorageSync('platform') : ''
				let uuid = ''
				// #endif
				
				let params = {
					username: tel,
					password: pwd,
					deviceid: uuid,
					platform: platform
				}
				that.$u.post('/login',params).then(res => {
					uni.setStorageSync("token", res.token)
					uni.setStorageSync("uid", res.uid)
					uni.setStorageSync("userid", res.userid)
					uni.setStorageSync("tenantid", res.tenantid)
					uni.setStorageSync("tokenexpire", res.expire)
					uni.setStorageSync("tokentime", res.now)
					uni.setStorageSync("signed", res.signed)
					uni.setStorageSync("paypwdset", res.paypwdset)
					uni.setStorageSync("name", res.name)
					uni.setStorageSync("localpwd", res.localpwd)
					uni.setStorageSync("phone", tel)
					uni.setStorageSync("phoneX", res.phone)
					uni.setStorageSync("imageurl", res.imageurl)
					uni.setStorageSync("idno", res.idno)
					uni.setStorageSync("cardno", res.citizenCardNo)
					uni.setStorageSync("bankcardno", res.bankCardNo)
					uni.setStorageSync("email", res.email)
					let ranNum = Math.ceil(Math.random() * 25)
					let c = String.fromCharCode(65 + ranNum)
					// #ifndef MP-WEIXIN
					let b = c + btoa(pwd)
					// #endif
					// #ifdef MP-WEIXIN
					let b = c + pwd
					// #endif
					uni.setStorageSync("pwd", b)
					if(res.needcheck){
						uni.navigateTo({
							url:'/pages/sub_basic/verification?data=' + JSON.stringify(params)
						})
						return false
					}
					uni.showToast({
						title: "登录成功",
						icon: "none",
						mask: true,
						duration: 800,
						complete(res) {
							setTimeout(() => {
								uni.switchTab({
									url: "/pages/sub_tabbar/index"
								})
							}, 1500)
						}
					})
				})
			},
			fingerLogin() {
				let that = this
				let tel = uni.getStorageSync('phone')
				let pwd = uni.getStorageSync('pwd')
				// #ifdef APP-PLUS
				let uuid = app.globalData.clientid ? app.globalData.clientid : ''
				let platform = uni.getStorageSync('platform') ? 'App-' + uni.getStorageSync('platform') : ''
				let a = atob(pwd.substr(1))
				// #endif
				
				// #ifdef MP-WEIXIN
				let a = pwd.substr(1)
				let uuid = ''
				let platform = uni.getStorageSync('platform') ? 'Wechat-' + uni.getStorageSync('platform') : ''
				// #endif
				
				// #ifdef H5
				let platform = 'H5'
				let uuid = ''
				let a= atob(pwd.substr(1))
				// #endif
				
				let params = {
					username: tel,
					password: a,
					deviceid: uuid,
					platform: platform
				}
				that.$u.post('/login',params).then(res => {
					uni.setStorageSync("token", res.token)
					uni.setStorageSync("uid", res.uid)
					uni.setStorageSync("userid", res.userid)
					uni.setStorageSync("tenantid", res.tenantid)
					uni.setStorageSync("tokenexpire", res.expire)
					uni.setStorageSync("tokentime", res.now)
					uni.setStorageSync("signed", res.signed)
					uni.setStorageSync("paypwdset", res.paypwdset)
					uni.setStorageSync("name", res.name)
					uni.setStorageSync("localpwd", res.localpwd)
					uni.setStorageSync("phoneX", res.phone)
					uni.setStorageSync("imgurl", res.imgurl)
					uni.setStorageSync("idno", res.idno)
					uni.setStorageSync("cardno", res.citizenCardNo)
					uni.setStorageSync("bankcardno", res.bankCardNo)
					uni.setStorageSync("email", res.email)
					if(res.needcheck){
						uni.navigateTo({
							url:'/pages/sub_basic/verification?data=' + JSON.stringify(params)
						})
						return false
					}
					uni.showToast({
						title: "指纹识别成功",
						icon: "none",
						mask: true,
						complete(res) {
							setTimeout(() => {
								uni.switchTab({
									url: "/pages/sub_tabbar/index"
								})
							}, 1500)
						}
					})
				})
			},
			fingerIn() {
				let that = this
				let fingerprint = uni.getStorageSync("fingerprint")
				if (fingerprint) {
					uni.checkIsSoterEnrolledInDevice({
						checkAuthMode: 'fingerPrint',
						success(res) {
							if (res.isEnrolled) {
								uni.startSoterAuthentication({
									requestAuthModes: ['fingerPrint'],
									authContent: '指纹解锁',
									success(res) {
										that.fingerLogin()
									},
									fail(res) {
										console.log(res)
										if (res.errCode == "90010") {
											uni.showToast({
												title: "错误次数过多,功能被冻结,请尝试其他登陆方式",
												duration: 1500,
												icon: "none",
												mask: true,
											})
										} else {
											uni.showToast({
												title: res.errCode,
												duration: 1500,
												icon: "none",
												mask: true,
											})
										}
									}
								})
							} else {
								uni.showToast({
									title: "没有录入指纹",
									duration: 1500,
									icon: "none",
									mask: true,
								})
							}
						},
					})

				} else {
					uni.showToast({
						title: "未开启指纹登录,请使用其他方式登录",
						duration: 1500,
						icon: "none",
						mask: true,
					})
				}
			},
			faceIn() {
				let face = uni.getStorageSync("face")
				if (face) {
					uni.showToast({
						title: "暂不支持面容登录,请使用其他方式登录",
						duration: 1500,
						icon: "none",
						mask: true,
					})
				} else {
					uni.showToast({
						title: "未开启面容登录,请使用其他方式登录",
						duration: 1500,
						icon: "none",
						mask: true,
					})
				}
			},
			handsIn() {
				let hands = uni.getStorageSync("hands")
				if (hands) {
					uni.setStorageSync("login", 1)
					uni.navigateTo({
						url: "/pages/sub_mine/lock"
					})
				} else {
					uni.showToast({
						title: "未开启手势登录,请使用其他方式登录",
						duration: 1500,
						icon: "none",
						mask: true,
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.login {
		width: 100vw;
		font-family: "PingFang-SC-Medium";
		background-color: #FFFFFF;
		height: 100vh;
		position: relative;

		&-con {
			padding: 30rpx;

			&-title {
				display: flex;
				justify-content: space-between;
				align-items: center;

				text {
					font-family: "PingFang-SC-Medium";
					font-size: 32rpx;
					color: #333333;
				}
			}

			&-logo {
				display: flex;
				justify-content: center;
				padding: 30rpx 0;
				text-align: center;
				align-items: center;
			}

			&-form {
				width: 650rpx;
				margin: 0 auto 50rpx;

				&-forget {
					color: #999999;
					font-size: 28rpx;
					display: flex;
					justify-content: flex-end;
					margin-top: 30rpx;
				}
			}

			&-btn {
				background-color: #2FA8E1;
				padding: 50rpx 0;
				color: #FFFFFF;
				width: 600rpx;
				font-size: 30rpx;
				border: 1px solid #2FA8E1;
			}

			&-btnr {
				border: 1px solid #2FA8E1;
				padding: 50rpx 0;
				color: #2FA8E1;
				width: 600rpx;
				font-size: 30rpx;
				margin-top: 30rpx;
			}

			&-youke {
				display: flex;
				justify-content: center;
				color: #999999;
				font-size: 28rpx;
				margin-top: 30rpx;
			}

			&-footer {
				position: absolute;
				bottom: 30rpx;
				width: 500rpx;
				left: 50%;
				transform: translateX(-50%);
				// width: 100vw;
				display: flex;
				justify-content: center;
				flex-direction: column;
				align-items: center;
				&-title {
					display: flex;
					justify-content: center;
					font-size: 28rpx;
					color: #999999;
				}

				&-icon {
					width: 50%;
					display: flex;
					justify-content: space-around;
					margin-top: 30rpx;
				}
			}
		}

	}
</style>