hotelHomestayWx/pages/login/index.vue

<template>
	<view class="page" :style="{'min-height':h+'px'}">
		<view class="box">
			<image src="https://i.ringzle.com/file/20240109/d6c4691423cf40c2bdf9210d389cdd1e.png"></image>
			<view class="text">您好！欢迎使用<br>游嵊泗商家服务平台</view>
			<view class="login">
				<button open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">登录</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		onLoad() {
			uni.clearStorageSync();
		},
		methods: {
			//获取手机号进行登录
			decryptPhoneNumber(e){
				if(e.detail.code) this.wxLogin(e.detail.code);
			},
			//登录
			wxLogin(code){
				uni.showLoading({ title:'登录中' });
				let that = this;
				wx.login({
					success(res){
						that.$api.post('/auth/oauth/token',{
							code:res.code,
							phoneCode:code,
							grant_type:'merchantWeChat',
							captcha:'aaa'
						},false).then(result=>{
							if(result.data.code===0){
								uni.setStorageSync('authorization',result.data.token_type+' '+result.data.access_token);
								uni.setStorageSync('access_token',result.data.access_token);
								that.$api.get('/sys/user/info').then(resu=>{
									if(resu.data.code===0){
										that.$showToast('登录成功');
										setTimeout(()=>{
											uni.reLaunch({
												url:'/pages/login/select?userInfo='+encodeURIComponent(JSON.stringify(resu.data.data))
											})
										},1500)
									}else that.$showToast(resu.data.msg)
								})
							}else that.$showToast(result.data.msg)
						})
					}
				})
			}
		}
	}
</script>

<style scoped lang="less">
	.page{
		background: url(https://i.ringzle.com/file/20240109/472b6b7b9ea44652b85e73c796876378.png) no-repeat;
		background-size: 100% 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		.box{
			width: calc(100% - 180rpx);
			display: flex;
			flex-direction: column;
			align-items: center;
			image{
				width: 480rpx;
				height: 520rpx;
			}
			.text{
				text-align: center;
				font-size: 56rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 800;
				color: #FFFFFF;
				line-height: 96rpx;
			}
			.login{
				margin-top: 80rpx;
				width: 100%;
				height: 96rpx;
				button{
					width: 100%;
					height: 100%;
					background: #FFFFFF;
					border-radius: 48rpx 48rpx 48rpx 48rpx;
					line-height: 96rpx;
					text-align: center;
					font-size: 34rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #145EE6;
				}
			}
		}
	}
</style>