lsc 3 maanden geleden
bovenliggende
commit
75b37bc0cf
1 gewijzigde bestanden met toevoegingen van 50 en 5 verwijderingen
  1. 50 5
      src/views/login/loginPage.vue

+ 50 - 5
src/views/login/loginPage.vue

@@ -77,7 +77,8 @@
 						</div>
 					</div>
 					<div class="fa_weChat" v-if="['weChat'].includes(loginType)">
-						<div id="QRcode" @click="loginType = 'bind'" class="QRcode"></div>
+						<div id="QRcode" class="QRcode" ref="QRcode"></div>
+						<!-- @click="loginType = 'bind'" -->
 					</div>
 				</div>
 
@@ -113,7 +114,7 @@
 				</div>
 				<div class="lp_r_b_iconBtn">
 					<div
-						@click="loginType = 'weChat'"
+						@click="wechatLogin"
 						v-if="['default', 'weChat'].includes(loginType)"
 					>
 						<el-tooltip effect="dark" content="微信登录" placement="bottom">
@@ -287,6 +288,47 @@ export default {
 					console.error("请求失败,错误信息:", err);
 				});
 		},
+		wechatLogin(){
+			this.loginType = 'weChat'
+			setTimeout(() => {
+				const randomState = Math.random().toString(36).substring(2); // 生成随机状态
+				// eslint-disable-next-line no-undef
+				new WxLogin({
+					self_redirect:true,
+					id: "QRcode", 
+					appid: "wxe9d7fff3c659445f", 
+					scope: "snsapi_login", 
+					redirect_uri: encodeURIComponent("https://cocorobo.cn"),//https://liyuan.cocorobo.cn/#/wxTest
+					state: randomState,
+					style: "black",
+					href: "data:text/css;base64,LmltcG93ZXJCb3gge2Rpc3BsYXk6IGZsZXg7fQouaW1wb3dlckJveCAucXJjb2RlIHt3aWR0aDogMjMycHg7IGhlaWdodDogMjMycHh9Ci5pbXBvd2VyQm94IC50aXRsZSB7ZGlzcGxheTogbm9uZTt9Ci5pbXBvd2VyQm94IC5pbmZvIHtkaXNwbGF5OiBub25lO30KLmxvZ2luUGFuZWx7d2lkdGg6MTAwJTtoZWlnaHQ6MTAwJTtkaXNwbGF5OmZsZXg7ZmxleC1kaXJlY3Rpb246Y29sdW1uO2FsaWduLWl0ZW1zOmNlbnRlcjtqdXN0aWZ5LWNvbnRlbnQ6Y2VudGVyO30KLnN0YXR1c19pY29uIHtkaXNwbGF5OiBub25lfQoud2ViX3FyY29kZV9wYW5lbF9hcmVhe2hlaWdodDoxMDAlO3dpZHRoOjEwMCU7ZGlzcGxheTpmbGV4O2FsaWduLWl0ZW1zOmNlbnRlcjtqdXN0aWZ5LWNvbnRlbnQ6Y2VudGVyO30K",
+					onReady: function(isReady){
+						console.log(isReady);
+					}
+				});
+				setTimeout(() => {
+					let iframe = this.$refs.QRcode.querySelector('iframe')
+					iframe.style.width = '100%'
+					iframe.style.height = '100%'
+					
+				}, 0);
+				let timer = setInterval(() => {
+					let iframe = this.$refs.QRcode && this.$refs.QRcode.querySelector('iframe')
+					try {
+						if(iframe.contentWindow.location.search.includes('code')){
+							this.loginType = 'bind'
+							console.log(iframe.contentWindow.location.search);
+							
+							clearInterval(timer)
+						}
+					} catch (error) {
+						// console.log(error);
+						
+					}
+
+				}, 50);
+			},0);
+		}
 	},
 	mounted() {
 		// this.getLoading();
@@ -447,9 +489,12 @@ export default {
 }
 
 .fa_weChat > .QRcode {
-	width: 80%;
-	height: 80%;
-	background-color: black;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+	/* background-color: black; */
 }
 
 .lp_r_b_btn {