uniProject/pages/Login/AliyunCaptcha copy.vue

<template>
	<view class="phone-login-page">
		<view class="login-wrap-box">
			<view class="bjcx-head-box">
				<icon class="bjcx-logo-box"></icon>
				<view class="bjcx-logo-title">家政学</view>
			</view>
			<view v-if="fromAppShare" class="wechat-auth-box">
				<view class="auth-tips">欢迎使用小程序</view>
				<button class="wechat-auth-btn" open-type="getPhoneNumber"@getphonenumber="onWechatAuth">
					微信一键登录
				</button>
			</view>
		</view>
	</view>
</template>

<script setup>
	import cacheManager from '@/utils/cacheManager.js'
	import * as httpApi from "@/api/login.js"
	import {
		ref,
		onMounted
	} from "vue"
	import {
		toast
	} from "@/utils/common";
	import {
		useIsCanBack
	} from "@/store/isCanBack.js"
	import {
		onLoad
	} from "@dcloudio/uni-app";

	// 原有变量
	const userName = ref('')
	const password = ref('')
	const showPassword = ref(true)
	const clearTelIcon = ref(false)
	const clearPwIcon = ref(false)
	const isAgreed = ref(false)
	const id = ref('')
	const code = ref('')

	const fromPage = ref('');

	// 新增变量
	const fromAppShare = ref(true) // 是否来自APP分享

	const store = useIsCanBack();

	onLoad((options) => {
		
		// uni.showLoading({
		// 	title: '登录中'
		// })
		const loginRes =  uni.login().then(res=>{
			console.log('loginRes', loginRes);
			code.value = loginRes.code
			const result =  httpApi.loginApplet({
				code: loginRes.code,
			}).then(res=>{
				console.log('result', result);
				console.log('result', result);
			})
		})

		// 调用后端微信登录接口

	
		
		
		// // 判断是否来自APP分享
		// if (options.from === 'appcx') {
		// 	fromAppShare.value = true
		// 	id.value = options.id
		// 	// APP分享过来直接显示微信授权界面，不需要自动弹窗
		// 	fromPage.value = options.from;
		// }
		getAllImg();
	})

	// 切换到普通登录
	function switchToNormalLogin() {
		fromAppShare.value = false
	}

	function phoneBind() {
		uni.navigateTo({
			url: '/pages/Login/AliyunCaptcha?code='+code.value,
			events: {
				getCaptchaVerifyParam: (captchaVerifyParam) => {
					// 接收到验证码返回结果
					console.log('验证码返回结果：', captchaVerifyParam)
				}
			},
			success: () => {
				console.log('跳转到验证码页面成功')
			},
			fail: (err) => {
				console.error('跳转到验证码页面失败:', err)
				toast('验证码加载失败，请重试')
			}
		})
	}

	// 微信授权登录
	async function onWechatAuth(e) {
		if (e.detail.errMsg.includes('fail')) {
			toast('授权失败')
			return
		}

		uni.showLoading({
			title: '登录中'
		})
		console.log('e123123123', e);
		try {
			// 获取微信code
			// const loginRes = await uni.login()
			// console.log('loginRes', loginRes);
			// code.value = loginRes.code
			// // 调用后端微信登录接口
			// const result = await httpApi.loginApplet({
			// 	code: loginRes.code,
			// 	userInfo: e.detail.userInfo
			// })
			// console.log('result', result);
			// console.log('result', result);
				//phoneBind()
			// if (result.data.bind) {
			// 	// 保存用户信息
			// 	if (result.data.loginVo.type == 4) {
			// 		cacheManager.set('auth', result.data.loginVo)
			// 		store.setIsCanBack(false)
			// 		gotoPage();
			// 	} else if (result.data.loginVo.type == 6) {
			// 		cacheManager.set('auth', result.data.loginVo)
			// 		store.setIsCanBack(false)
			// 		gotoPage2();
			// 	} else {
			// 		toast('登录失败，您的身份有误，请联系管理员。')
			// 	}
			// } else {
			// 	//  bind 为 false 未绑定

			// 	phoneBind()
			// }
		} catch (error) {
			toast('微信登录失败')
		} finally {
			uni.hideLoading()
		}
	}

	// 你原有的所有方法都不变
	function handleChange() {
		isAgreed.value = !isAgreed.value
	}

	function agreeBtn(code) {
		if (code === 'yhxy') {
			uni.navigateTo({
				url: "/pages/client/my/xieyi"
			})
		} else {
			uni.navigateTo({
				url: "/pages/client/my/zhengce"
			})
		}
	}

	function userInputChange(event) {
		if (event.detail.value.length > 0) {
			clearTelIcon.value = true;
		} else {
			clearTelIcon.value = false;
		}
	}

	function passwordInputChange(event) {
		if (event.detail.value.length > 0) {
			clearPwIcon.value = true;
		} else {
			clearPwIcon.value = false;
		}
	}

	function clearTel() {
		userName.value = '';
		clearTelIcon.value = false;
	}

	function clearPw() {
		password.value = '';
		clearPwIcon.value = false;
	}

	function changePassword() {
		showPassword.value = !showPassword.value;
	}

	function handleLogin() {
		if (userName.value.length === 0) {
			toast('请输入手机号！')
			return
		}

		if (password.value.length === 0) {
			toast('请输入密码！')
			return
		}

		const trimmedUserName = userName.value;
		const trimmedPassword = password.value;

		uni.showLoading({
			title: '登录中'
		})

		httpApi.loginTemp({
			type: 2,
			userName: trimmedUserName,
			password: trimmedPassword,
		}).then(res => {
			if (res.data.type === 4) {
				cacheManager.set('auth', res.data)
				store.setIsCanBack(false)
				gotoPage();
			} else if (res.data.type === 6) {
				cacheManager.set('auth', res.data)
				store.setIsCanBack(false)
				gotoPage2();
			} else {
				toast('登录失败，您的身份有误，请联系管理员。')
			}
		}).catch(err => {
			store.setIsCanBack(true)
		}).finally(err => {
			uni.hideLoading()
		})
	}

	function gotoPage() {
			console.log('ididid',id.value);
		if (id.value) {
			uni.navigateTo({
				url: `/pages/client/hetong/hetongInfo?id=` + id.value + `&from=${fromPage.value}`
			})
		} else {
			uni.navigateTo({
				url: `/pages/client/ShouYe/shouye`
			})
		}
	}

	function gotoPage2() {
			console.log('ididid222222',id.value);
		if (id.value) {
			uni.navigateTo({
				url: `/pages/kehu/hetong/hetongInfo?id=` + id.value + `&from=${fromPage.value}`
			})
		} else {
			uni.navigateTo({
				url: `/pages/kehu/shouYe/shouye`
			})
		}
	}

	function getAllImg() {
		httpApi.getAllImgList({}).then(res => {
			cacheManager.set('projectImg', res.data)
		});
	}
</script>

<style scoped>
	/* 新增样式 */
	.wechat-auth-box {
		text-align: center;
		padding: 40rpx 0;
	}

	.auth-tips {
		font-size: 32rpx;
		color: #333;
		margin-bottom: 60rpx;
	}

	.wechat-auth-btn {
		background-color: #07C160;
		color: white;
		border-radius: 50rpx;
		margin-bottom: 30rpx;
	}

	.switch-login {
		color: #007AFF;
		font-size: 28rpx;
	}

	/* 你原有的所有样式都保持不变 */
</style>