weixin_52219567 3 týždňov pred
rodič
commit
0f0ac4b09f
1 zmenil súbory, kde vykonal 245 pridanie a 221 odobranie
  1. 245 221
      src/app/pages/auth/login.vue

+ 245 - 221
src/app/pages/auth/login.vue

@@ -45,6 +45,9 @@
 						open-type="getPhoneNumber" @getphonenumber="getphonenumber">
 						授权手机号登录
 					</button>
+					<button
+						class="w-full h-[80rpx] !bg-[var(--primary-color)] text-[26rpx] rounded-[40rpx] leading-[80rpx] font-500 !text-[#fff] !mx-[0]"
+						 @click="getOpenid">授权手机号登录</button>
 				</template>
 				<!-- #endif -->
 				<template v-if="type == 'mobile'">
@@ -95,246 +98,267 @@
 	</view>
 </template>
 <script setup lang="ts">
-import { ref, reactive, computed, onMounted } from "vue";
-import { usernameLogin, mobileLogin, clientLogin } from "@/app/api/auth";
-import useMemberStore from "@/stores/member";
-import useConfigStore from "@/stores/config";
-import { useLogin } from "@/hooks/useLogin";
-import { t } from "@/locale";
-import { redirect, getToken, pxToRpx, isWeixinBrowser } from "@/utils/common";
-import { onLoad } from "@dcloudio/uni-app";
-import { topTabar } from "@/utils/topTabbar";
-import useSystemStore from "@/stores/system";
-
-const systemStore = useSystemStore();
-/********* 自定义头部 - start ***********/
-const topTabarObj = topTabar();
-const param = topTabarObj.setTopTabbarParam({
-	title: "",
-	topStatusBar: { bgColor: "#fff", textColor: "#333" },
-});
-/********* 自定义头部 - end ***********/
-const headerHeight = computed(() => {
-	return Object.keys(systemStore.menuButtonInfo).length
-		? pxToRpx(Number(systemStore.menuButtonInfo.height)) +
-		pxToRpx(systemStore.menuButtonInfo.top) +
-		pxToRpx(8) +
-		"rpx"
-		: "auto";
-});
-const real_name_input = ref(true);
-const memberStore = useMemberStore();
-const configStore = useConfigStore();
-const type = ref("");
-const isAgree = ref(false);
-const isShowQuickLogin = ref(false); // 是否显示快捷登录
-const popupRef = ref();
-const isPassword = ref(true);
-
-const changePassword = () => {
-	isPassword.value = !isPassword.value;
-};
-
-const dialogClose = () => {
-	popupRef.value.close();
-};
-
-const dialogConfirm = () => {
-	isAgree.value = true;
-	popupRef.value.close();
-	handleLogin();
-};
-
-onLoad(async (option: any) => {
-	// #ifdef H5
-	uni.getStorageSync("openid") &&
-		Object.assign(formData, { wx_openid: uni.getStorageSync("openid") });
-	// #endif
-
-	// #ifdef MP-WEIXIN
-	uni.getStorageSync("openid") &&
-		Object.assign(formData, { weapp_openid: uni.getStorageSync("openid") });
-	// #endif
-
-	type.value = option.type ? option.type : "username";
-
-	// if (option.type) {
-	// 	if (option.type == 'mobile') {
-	// 		if (configStore.login.is_mobile) {
-	// 			type.value = option.type
-	// 			uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
-	// 		}
-	// 	} else if (option.type == 'username' && configStore.login.is_username) {
-	// 		type.value = option.type
-	// 	}
-	// } else {
-	// 	if (configStore.login.is_username) {
-	// 		type.value = 'username'
-	// 	} else if (configStore.login.is_mobile) {
-	// 		type.value = 'mobile'
-	// 	}
-
-	// }
-
-	// // 如果只开启了账号密码登录,那么就不需要跳转到登录中间页了
-
-	// // #ifdef MP-WEIXIN
-	// if (!configStore.login.is_auth_register) {
-	// 	isShowQuickLogin.value = false;
-	// } else {
-	// 	isShowQuickLogin.value = true;
-	// }
-	// // #endif
-
-	// // #ifdef H5
-	// if (isWeixinBrowser()) {
-	// 	// 微信浏览器
-	// 	if (!configStore.login.is_auth_register) {
-	// 		isShowQuickLogin.value = false;
-	// 	} else {
-	// 		isShowQuickLogin.value = true;
-	// 	}
-	// } else {
-	// 	// 普通浏览器
-	// 	isShowQuickLogin.value = false;
-	// }
-	// // #endif
-});
-
-const formData = reactive({
-	username: "",
-	password: "",
-	code: "",
-	mobile_key: "",
-});
-
-const getphonenumber = async (res: any) => {
-	console.log(res, "?????????????");
-};
-
-onMounted(() => {
-	// 防止浏览器自动填充
-	setTimeout(() => {
-		real_name_input.value = false;
-	}, 800);
-});
-
-const agreeChange = () => {
-	isAgree.value = !isAgree.value;
-};
-
-const setType = () => {
-	if (type.value == "username") {
-		// #ifndef MP-WEIXIN
-		type.value = "mobile";
+	import { ref, reactive, computed, onMounted } from "vue";
+	import { usernameLogin, mobileLogin, clientLogin ,wxLogin} from "@/app/api/auth";
+	import useMemberStore from "@/stores/member";
+	import useConfigStore from "@/stores/config";
+	import { useLogin } from "@/hooks/useLogin";
+	import { t } from "@/locale";
+	import { redirect, getToken, pxToRpx, isWeixinBrowser } from "@/utils/common";
+	import { onLoad } from "@dcloudio/uni-app";
+	import { topTabar } from "@/utils/topTabbar";
+	import useSystemStore from "@/stores/system";
+
+	const systemStore = useSystemStore();
+	/********* 自定义头部 - start ***********/
+	const topTabarObj = topTabar();
+	const param = topTabarObj.setTopTabbarParam({
+		title: "",
+		topStatusBar: { bgColor: "#fff", textColor: "#333" },
+	});
+	/********* 自定义头部 - end ***********/
+	const headerHeight = computed(() => {
+		return Object.keys(systemStore.menuButtonInfo).length
+			? pxToRpx(Number(systemStore.menuButtonInfo.height)) +
+			pxToRpx(systemStore.menuButtonInfo.top) +
+			pxToRpx(8) +
+			"rpx"
+			: "auto";
+	});
+	const real_name_input = ref(true);
+	const memberStore = useMemberStore();
+	const configStore = useConfigStore();
+	const type = ref("");
+	const isAgree = ref(false);
+	const isShowQuickLogin = ref(false); // 是否显示快捷登录
+	const popupRef = ref();
+	const isPassword = ref(true);
+
+	const changePassword = () => {
+		isPassword.value = !isPassword.value;
+	};
+
+	const dialogClose = () => {
+		popupRef.value.close();
+	};
+
+	const dialogConfirm = () => {
+		isAgree.value = true;
+		popupRef.value.close();
+		handleLogin();
+	};
+
+	const getOpenid = () => {
+		uni.login({
+			provider: 'weixin',
+			success: function (loginRes) {
+				wxLogin({code:loginRes.code})
+				.then((res : any) => {
+				}).catch((res : any) => {
+					if(res.code == 601){
+						redirect({ url: '/app/pages/auth/register', param: { openId: res.data.openId } })
+					}
+				});
+
+			},
+			fail: function (err) {
+				console.error('uni.login 失败:', err);
+			}
+		});
+	}
+
+	onLoad(async (option : any) => {
+
+
+		// #ifdef H5
+		uni.getStorageSync("openid") &&
+			Object.assign(formData, { wx_openid: uni.getStorageSync("openid") });
 		// #endif
 
 		// #ifdef MP-WEIXIN
-		type.value = "wx";
+		uni.getStorageSync("openid") &&
+			Object.assign(formData, { weapp_openid: uni.getStorageSync("openid") });
 		// #endif
-	} else if ((type.value == "wx")) {
-		type.value = "mobile";
-	} else {
-		type.value = "username";
-	}
-};
 
-const loading = ref(false);
+		type.value = option.type ? option.type : "username";
 
-const rules = computed(() => {
-	return {
-		username: [
-			{
-				type: "string",
-				required: true,
-				message: "请输入账号",
-				trigger: ["blur", "change"],
-			},
-			{
-				validator(rule: any, value: any) {
-					return uni.$u.test.mobile(value);
-				},
-				message: "请输入正确的手机号",
-				trigger: ["change", "blur"],
-			},
-		],
-		password: {
-			type: "string",
-			required: true,
-			message: "请输入密码",
-			trigger: ["blur", "change"],
-		},
+		// if (option.type) {
+		// 	if (option.type == 'mobile') {
+		// 		if (configStore.login.is_mobile) {
+		// 			type.value = option.type
+		// 			uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
+		// 		}
+		// 	} else if (option.type == 'username' && configStore.login.is_username) {
+		// 		type.value = option.type
+		// 	}
+		// } else {
+		// 	if (configStore.login.is_username) {
+		// 		type.value = 'username'
+		// 	} else if (configStore.login.is_mobile) {
+		// 		type.value = 'mobile'
+		// 	}
+
+		// }
+
+		// // 如果只开启了账号密码登录,那么就不需要跳转到登录中间页了
+
+		// // #ifdef MP-WEIXIN
+		// if (!configStore.login.is_auth_register) {
+		// 	isShowQuickLogin.value = false;
+		// } else {
+		// 	isShowQuickLogin.value = true;
+		// }
+		// // #endif
+
+		// // #ifdef H5
+		// if (isWeixinBrowser()) {
+		// 	// 微信浏览器
+		// 	if (!configStore.login.is_auth_register) {
+		// 		isShowQuickLogin.value = false;
+		// 	} else {
+		// 		isShowQuickLogin.value = true;
+		// 	}
+		// } else {
+		// 	// 普通浏览器
+		// 	isShowQuickLogin.value = false;
+		// }
+		// // #endif
+	});
+
+	const formData = reactive({
+		username: "",
+		password: "",
+		code: "",
+		mobile_key: "",
+	});
+
+	const getphonenumber = async (res : any) => {
+		console.log(res, "?????????????");
 	};
-});
 
-const formRef: any = ref(null);
+	onMounted(() => {
+		// 防止浏览器自动填充
+		setTimeout(() => {
+			real_name_input.value = false;
+		}, 800);
+	});
+
+	const agreeChange = () => {
+		isAgree.value = !isAgree.value;
+	};
 
-const handleLogin = () => {
-	formRef.value.validate().then(() => {
-		if (loading.value) return;
-		let datas: any = {}
+	const setType = () => {
 		if (type.value == "username") {
-			datas.username = formData.username
-			datas.password = formData.password
+			// #ifndef MP-WEIXIN
+			type.value = "mobile";
+			// #endif
+
+			// #ifdef MP-WEIXIN
+			type.value = "wx";
+			// #endif
+		} else if ((type.value == "wx")) {
+			type.value = "mobile";
+		} else {
+			type.value = "username";
 		}
-		loading.value = true;
-		clientLogin(datas)
-			.then((res: any) => {
-				memberStore.setToken(res.data.access_token);
-				useLogin().handleLoginBack();
-			})
-			.catch(() => {
-				loading.value = false;
-			});
+	};
+
+	const loading = ref(false);
+
+	const rules = computed(() => {
+		return {
+			username: [
+				{
+					type: "string",
+					required: true,
+					message: "请输入账号",
+					trigger: ["blur", "change"],
+				},
+				{
+					validator(rule : any, value : any) {
+						return uni.$u.test.mobile(value);
+					},
+					message: "请输入正确的手机号",
+					trigger: ["change", "blur"],
+				},
+			],
+			password: {
+				type: "string",
+				required: true,
+				message: "请输入密码",
+				trigger: ["blur", "change"],
+			},
+		};
 	});
-};
-
-const toLink = () => {
-	const pages = getCurrentPages(); // 获取页面栈
-	if (pages.length > 1) {
-		const currentPage = pages[pages.length - 2].route;
-		if (currentPage == "app/pages/auth/index") {
-			// 返回上一页
-			uni.navigateBack({
-				delta: 1, // 默认值是1,表示返回的页面层数
-			});
+
+	const formRef : any = ref(null);
+
+	const handleLogin = () => {
+		formRef.value.validate().then(() => {
+			if (loading.value) return;
+			let datas : any = {}
+			if (type.value == "username") {
+				datas.username = formData.username
+				datas.password = formData.password
+			}
+			loading.value = true;
+			clientLogin(datas)
+				.then((res : any) => {
+					memberStore.setToken(res.data.access_token);
+					useLogin().handleLoginBack();
+				})
+				.catch(() => {
+					loading.value = false;
+				});
+		});
+	};
+
+	const toLink = () => {
+		const pages = getCurrentPages(); // 获取页面栈
+		if (pages.length > 1) {
+			const currentPage = pages[pages.length - 2].route;
+			if (currentPage == "app/pages/auth/index") {
+				// 返回上一页
+				uni.navigateBack({
+					delta: 1, // 默认值是1,表示返回的页面层数
+				});
+			} else {
+				redirect({ url: "/app/pages/auth/index", mode: "redirectTo" });
+			}
 		} else {
 			redirect({ url: "/app/pages/auth/index", mode: "redirectTo" });
 		}
-	} else {
-		redirect({ url: "/app/pages/auth/index", mode: "redirectTo" });
-	}
-};
+	};
 
-const toResetpwd = () => {
-	uni.showToast({ title: "请联系管理员重置密码", icon: "none" });
-};
+	const toResetpwd = () => {
+		uni.showToast({ title: "请联系管理员重置密码", icon: "none" });
+	};
 </script>
 <style lang="scss" scoped>
-:deep(.u-input) {
-	background-color: transparent !important;
-}
+	:deep(.u-input) {
+		background-color: transparent !important;
+	}
 
-:deep(.u-checkbox) {
-	margin: 0 !important;
-}
+	:deep(.u-checkbox) {
+		margin: 0 !important;
+	}
 
-:deep(.u-form-item) {
-	flex: 1;
+	:deep(.u-form-item) {
+		flex: 1;
+
+		.u-line {
+			display: none;
+		}
+	}
 
-	.u-line {
-		display: none;
+	.footer {
+		// position: absolute;
+		// position: fixed;
+		margin-top: 200rpx;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		padding-bottom: calc(151rpx + constant(safe-area-inset-bottom));
+		padding-bottom: calc(151rpx + env(safe-area-inset-bottom));
 	}
-}
-
-.footer {
-	// position: absolute;
-	// position: fixed;
-	margin-top: 200rpx;
-	bottom: 0;
-	left: 0;
-	right: 0;
-	padding-bottom: calc(151rpx + constant(safe-area-inset-bottom));
-	padding-bottom: calc(151rpx + env(safe-area-inset-bottom));
-}
-</style>
+</style>