mec-cloud_-intelligent-manufacturing_crm/zkqy-ui/pages/index/login.vue

<template>
	<view>
		<view class="login-background">
			<!-- 背景图-->
			<view class="login-background-img">
				<!-- 背景图样 -->
				<!-- <image class="logo" src="/static/loginBGimg.png"></image> -->
				<!-- icon -->
				<!-- <image class="logo" src="/static/loginIcon.png"></image> -->
			</view>
			<!-- 文字和按钮 -->
			<view class="login-text-and-buttons">
				<view class="login-text">
					
				</view>
				<button class="login-buttons" open-type="getPhoneNumber" @getphonenumber="login">获取手机号</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		onLoad() {
			// 检查是否已经登录
			this.checkLoginStatus();
		},
		methods: {
			// 检查登录状态
			checkLoginStatus() {
				const token = uni.getStorageSync('token');
				if (token) {
					// 已登录，跳转到首页
					uni.switchTab({
						url: '/pages/index/index'
					});
				}
			},
			// 登录方法
			login(e) {
				console.log('[getPhoneNumber]', e);
				if (e.detail.errMsg === 'getPhoneNumber:ok') {
					// 用户同意授权
					console.log('用户同意授权', e.detail);
					// 获取code
					uni.login({
						provider: 'weixin',
						success: (loginRes) => {
							// 获取到code后，发送到后端
							const params = {
								code: loginRes.code,
								encryptedData: e.detail.encryptedData,
								iv: e.detail.iv
							};
							// 调用后端接口解密手机号
							uni.request({
								url: 'YOUR_API_URL/api/login/phone', // 替换为您的实际接口地址
								method: 'POST',
								data: params,
								success: (res) => {
									if (res.data.code === 200) {
										// 登录成功，保存token
										uni.setStorageSync('token', res.data.data.token);
										// 跳转到首页
										uni.switchTab({
											url: '/pages/index/index'
										});
									} else {
										uni.showToast({
											title: res.data.msg || '登录失败',
											icon: 'none'
										});
									}
								},
								fail: (err) => {
									console.error('登录请求失败', err);
									uni.showToast({
										title: '网络错误，请重试',
										icon: 'none'
									});
								}
							});
						},
						fail: (err) => {
							console.error('获取code失败', err);
							uni.showToast({
								title: '登录失败，请重试',
								icon: 'none'
							});
						}
					});
				} else {
					// 用户拒绝授权
					console.log('用户拒绝授权', e.detail);
					uni.showToast({
						title: '需要授权手机号才能使用',
						icon: 'none'
					});
				}
			}
		}
	}
</script>

<style>
	.login-buttons {
		margin-top: 500px;
		background: red;
		width: 249rpx;
		height: 57rpx;
		line-height: 57rpx;
		text-align: center;
		color: #fff;
		font-size: 28rpx;
	}
</style>