From 81a132f7b5d022e8d55dc1fefe2a7357f5bcbafa Mon Sep 17 00:00:00 2001 From: 杨磊 <505174330@qq.com> Date: 星期一, 25 八月 2025 15:22:27 +0800 Subject: [PATCH] 首页 --- src/layout/components/login.vue | 270 ++++++++++++++++++++++++----------------------------- 1 files changed, 122 insertions(+), 148 deletions(-) diff --git a/src/layout/components/login.vue b/src/layout/components/login.vue index a0cfba5..c4b29fd 100644 --- a/src/layout/components/login.vue +++ b/src/layout/components/login.vue @@ -1,13 +1,13 @@ <template> <el-dialog - align-center append-to-body v-model="dialogFormVisible" @close="closeDialog" @open="openDialog" class="fansdialog" + style="padding: 0; padding-bottom: 0px" > - <div style="display: flex; justify-content: space-around"> + <div style="display: flex; justify-content: space-between"> <el-image :src="dialogLeftImg" class="leftImg" /> <div class="logIn"> @@ -16,15 +16,17 @@ <li @click="signUpWay = 'authSignUp'" :style="{ - color: signUpWay == 'authSignUp' ? '#144941' : '#545C63', + color: signUpWay == 'authSignUp' ? '#019E58' : '#545C63', }" + style="font-weight: 700" > 鎵嬫満鍙风櫥褰� </li> <li>|</li> <li @click="wechatLoginOpen" - :style="{ color: signUpWay == 'wechat' ? '#144941' : '#545C63' }" + :style="{ color: signUpWay == 'wechat' ? '#019E58' : '#545C63' }" + style="font-weight: 700" > 寰俊鐧诲綍 </li> @@ -50,23 +52,19 @@ validator: (_, value, callback) => { if ( !/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/.test( - value + value, ) ) { - callback('璇疯緭鍏�11浣嶇數璇濆彿鐮�'); + callback('璇疯緭鍏�11浣嶇數璇濆彿鐮�') } else { - callback(); + callback() } }, }, ]" prop="telNumber" > - <el-input - v-model="passFormData.telNumber" - placeholder="璇疯緭鍏ユ墜鏈哄彿" - size="large" - > + <el-input v-model="passFormData.telNumber" placeholder="璇疯緭鍏ユ墜鏈哄彿" size="large"> <template #prepend> <el-select v-model="select" @@ -80,9 +78,7 @@ </el-input> </el-form-item> <el-form-item> - <el-button class="yanzhengBtn" @click="sliderImgDialogVisable = true" - >楠岃瘉</el-button - > + <el-button class="yanzhengBtn" @click="sliderImgDialogVisable = true">楠岃瘉</el-button> </el-form-item> <el-form-item v-if="signUpWay === 'authSignUp'" @@ -93,19 +89,13 @@ ]" prop="telCode" > - <el-input - v-model="passFormData.telCode" - placeholder="璇疯緭鍏ラ獙璇佺爜" - size="large" - /> + <el-input v-model="passFormData.telCode" placeholder="璇疯緭鍏ラ獙璇佺爜" size="large" /> <el-button type="primary" class="codeBtn" :disabled="countDown != 0" @click="getCode(passFormRef)" - >{{ - countDown == 0 ? "鑾峰彇楠岃瘉鐮�" : "楠岃瘉鐮�(" + countDown + "s)" - }}</el-button + >{{ countDown == 0 ? '鑾峰彇楠岃瘉鐮�' : '楠岃瘉鐮�(' + countDown + 's)' }}</el-button > </el-form-item> <el-form-item @@ -116,9 +106,9 @@ { validator: (rule, value, callback) => { if (!/\d/.test(value) || /^\d+$/.test(value)) { - callback('瀵嗙爜涓嶈兘涓虹函鏁板瓧鎴栧瓧姣�'); + callback('瀵嗙爜涓嶈兘涓虹函鏁板瓧鎴栧瓧姣�') } else { - callback(); + callback() } }, }, @@ -174,49 +164,49 @@ </template> <script setup> -import { ref, inject, watchEffect, reactive, nextTick } from "vue"; -import dialogLeftImg from "@/assets/images/header/dialogLeftImg.png"; -import verify from "@/components/sliderImg/component/verify.vue"; -import "@/components/sliderImg/sliderImg.js"; -import "@/components/sliderImg/sliderImg.css"; -import { ElMessage } from "element-plus"; -import { useUserStore } from "@/store"; -import { useRouter } from "vue-router"; -const router = useRouter(); +import { ref, inject, watchEffect, reactive, nextTick } from 'vue' +import dialogLeftImg from '@/assets/images/header/dialogLeftImg.png' +import verify from '@/components/sliderImg/component/verify.vue' +import '@/components/sliderImg/sliderImg.js' +import '@/components/sliderImg/sliderImg.css' +import { ElMessage } from 'element-plus' +import { useUserStore } from '@/store' +import { useRouter } from 'vue-router' +const router = useRouter() -const userStore = useUserStore(); +const userStore = useUserStore() -const MG = inject("MG"); -const config = inject("config"); -const dialogFormVisible = ref(false); -const sliderImgDialogVisable = ref(false); -const flag = ref("logIn"); // 鐧诲綍鎴栨敞鍐� +const MG = inject('MG') +const config = inject('config') +const dialogFormVisible = ref(false) +const sliderImgDialogVisable = ref(false) +const flag = ref('logIn') // 鐧诲綍鎴栨敞鍐� -const signUpWay = ref("authSignUp"); // 鐧诲綍鏂瑰紡 -const select = ref("涓浗+86"); -const countDown = ref(0); // 鍊掕鏃舵椂闂� -let timer = null; // 鍊掕鏃跺疄渚� -const passFormRef = ref(); +const signUpWay = ref('authSignUp') // 鐧诲綍鏂瑰紡 +const select = ref('涓浗+86') +const countDown = ref(0) // 鍊掕鏃舵椂闂� +let timer = null // 鍊掕鏃跺疄渚� +const passFormRef = ref() const passFormData = ref({ - telNumber: "", - password: "", - telCode: "", - password: "", - confirmPassword: "", -}); + telNumber: '', + password: '', + telCode: '', + password: '', + confirmPassword: '', +}) const closeDialog = () => { - countDown.value = 0; - clearInterval(timer); + countDown.value = 0 + clearInterval(timer) if (passFormRef.value) { - passFormRef.value.resetFields(); + passFormRef.value.resetFields() } - dialogFormVisible.value = false; -}; + dialogFormVisible.value = false +} // 寮圭獥鎵撳紑浜嬩欢 -const openDialog = () => {}; +const openDialog = () => {} const loginImgVerify = (code) => { - sliderImgDialogVisable.value = false; + sliderImgDialogVisable.value = false MG.identity .getPhoneCode({ phoneNumber: passFormData.value.telNumber, @@ -224,19 +214,14 @@ appRefCode: config.appRefCode, }) .then((res) => { - if (res == "楠岃瘉鐮佸彂閫佹垚鍔�") { - getSecond(60); - ElMessage.success(res); + if (res == '楠岃瘉鐮佸彂閫佹垚鍔�') { + getSecond(60) + ElMessage.success(res) } else { - ElMessage.error(res); + ElMessage.error(res) } - }); -}; - -watchEffect(() => { - if (dialogFormVisible.value) { - } -}); + }) +} //鐧诲綍 @@ -245,39 +230,38 @@ phoneNumber: passFormData.value.telNumber, phoneCaptcha: passFormData.value.telCode, appRefCode: config.appRefCode, - platform: "string", - }; + platform: 'string', + } MG.identity.loginByMobilePhone(query).then((res) => { - console.log("res", res); - userStore.setToken(res.data.accessToken); + console.log('res', res) + userStore.setToken(res.data.accessToken) - getUserInfo(); - }); -}; + getUserInfo() + }) +} const getUserInfo = () => { MG.identity.getCurrentAppUser().then((res) => { - console.log("res", res); + console.log('res', res) if (res) { - let userInfo = res.infoList.find((item) => item.type == "userInfo"); - let userTypeObj = res.infoList.find((item) => item.type == "userType"); + let userInfo = res.infoList.find((item) => item.type == 'userInfo') + let userTypeObj = res.infoList.find((item) => item.type == 'userType') const userData = { - userName: userInfo && userInfo.data ? JSON.parse(userInfo.data).name : "", - school: userInfo && userInfo.data ? JSON.parse(userInfo.data).school : "", - city: userInfo && userInfo.data ? JSON.parse(userInfo.data).city : "", - cityCode: userInfo && userInfo.data ? JSON.parse(userInfo.data).cityCode : "", - address: userInfo && userInfo.data ? JSON.parse(userInfo.data).address : "", - userType: - userTypeObj && userTypeObj.data ? JSON.parse(userTypeObj.data).userType : "", - }; - localStorage.setItem("xiehe-isUserInfo", userData?.userType == "" ? "-1" : "1"); - let teacherRole = res.roleLinks.find((item) => item.role.refCode == "teacher"); - let teacherInfos = res.infoList.find((item) => item.type == "teacherInfo"); - let wechatInfo = res.infoList.find((item) => item.type == "WeChat"); - let studentInfo = res.infoList.find((item) => item.type == "Default"); - let phoneInfo = res.secretList.find((item) => item.type == "MobilePhone"); + userName: userInfo && userInfo.data ? JSON.parse(userInfo.data).name : '', + school: userInfo && userInfo.data ? JSON.parse(userInfo.data).school : '', + city: userInfo && userInfo.data ? JSON.parse(userInfo.data).city : '', + cityCode: userInfo && userInfo.data ? JSON.parse(userInfo.data).cityCode : '', + address: userInfo && userInfo.data ? JSON.parse(userInfo.data).address : '', + userType: userTypeObj && userTypeObj.data ? JSON.parse(userTypeObj.data).userType : '', + } + localStorage.setItem('xiehe-isUserInfo', userData?.userType == '' ? '-1' : '1') + let teacherRole = res.roleLinks.find((item) => item.role.refCode == 'teacher') + let teacherInfos = res.infoList.find((item) => item.type == 'teacherInfo') + let wechatInfo = res.infoList.find((item) => item.type == 'WeChat') + let studentInfo = res.infoList.find((item) => item.type == 'Default') + let phoneInfo = res.secretList.find((item) => item.type == 'MobilePhone') // let nameAndPassword = res.secretList.find((item) => item.type == 'LoginNameAndPassword') - let emailInfo = res.secretList.find((item) => item.type == "EMail"); + let emailInfo = res.secretList.find((item) => item.type == 'EMail') if (teacherRole && teacherInfos) { userStore.setUserInfo({ ...userData, @@ -285,19 +269,19 @@ phoneNumber: phoneInfo?.credential, Email: emailInfo ? emailInfo.credential : JSON.parse(teacherInfos.data).email, icon: wechatInfo?.icon, - role: "Teacher", + role: 'Teacher', roleId: teacherRole.role.id, userId: res.userId, - }); + }) } else if (wechatInfo) { userStore.setUserInfo({ ...userData, ...wechatInfo, phoneNumber: phoneInfo?.credential, Email: emailInfo?.credential, - role: "Student", + role: 'Student', userId: res.userId, - }); + }) } else if (studentInfo) { userStore.setUserInfo({ ...userData, @@ -305,9 +289,9 @@ icon: wechatInfo?.icon, phoneNumber: phoneInfo?.credential, Email: emailInfo?.credential, - role: "Student", + role: 'Student', userId: res.userId, - }); + }) } else if (phoneInfo) { userStore.setUserInfo({ ...userData, @@ -315,32 +299,39 @@ name: phoneInfo?.credential, icon: phoneInfo?.icon, phoneNumber: phoneInfo?.credential, - role: "Student", + role: 'Student', userId: res.userId, - }); + }) } } - router.go(0); - }); -}; + if (localStorage.getItem('loginBack')) { + console.log(localStorage.getItem('loginBack')) + debugger + window.location.href = localStorage.getItem('loginBack') + localStorage.removeItem('loginBack') + } else { + router.go(0) + } + }) +} // 鍊掕鏃� const getSecond = (time) => { if (!timer) { - countDown.value = time; + countDown.value = time timer = setInterval(() => { - countDown.value--; + countDown.value-- if (countDown.value == 0) { - clearInterval(timer); - timer = null; + clearInterval(timer) + timer = null } - }, 1000); + }, 1000) } -}; +} // 鐧诲綍鍜岄噸缃瘑鐮佹寜閽寜閽� const signInSystem = async (formEl) => { - if (!formEl) return; + if (!formEl) return formEl.validate((valid) => { if (valid) { // if (signUpWay.value === 'phone') { @@ -354,27 +345,27 @@ // changePassword() // } } - }); -}; + }) +} const logIn = () => { - dialogFormVisible.value = true; - flag.value = "logIn"; -}; + dialogFormVisible.value = true + flag.value = 'logIn' +} // 鎵撳紑娉ㄥ唽寮圭獥 const signUp = () => { - dialogFormVisible.value = true; - flag.value = "signUp"; -}; + dialogFormVisible.value = true + flag.value = 'signUp' +} const wechatLoginOpen = () => { - signUpWay.value = "wechat"; -}; + signUpWay.value = 'wechat' +} defineExpose({ logIn, signUp, -}); +}) </script> <style lang="less" scoped> @@ -391,14 +382,16 @@ } .fansdialog { width: 806px; - + padding: 0 !important; + margin: 0 !important; .leftImg { box-sizing: border-box; width: 403px; } - .el-dialog__header { - padding: 0; + ::v-deep(.el-dialog__header) { + padding: 0 !important; + padding-bottom: 0 !important; } .el-dialog__body { @@ -406,6 +399,7 @@ height: 575px; display: flex; padding: 0 !important; + margin: 0 !important; } .leftImg { @@ -416,6 +410,7 @@ .el-dialog__header { padding: 0; + padding-bottom: 0 !important; } .el-dialog__body { @@ -431,11 +426,6 @@ p span { line-height: 24px; - } - - .el-dialog__header { - font-size: 18px; - color: #333; } .el-dialog__body { @@ -480,7 +470,7 @@ padding-top: 48px; display: flex; flex-direction: column; - justify-content: space-around; + justify-content: space-between; .signUpTitle { width: 100%; @@ -826,20 +816,4 @@ .selectPhone { background: #fff; } - -// .el-select { -// width: 100px; -// height: 30px; -// color: red; -// border: none !important; - -// /deep/ .select-trigger { -// height: 100%; - -// .el-input--suffix { -// height: 100%; -// background-color: #fff; -// } -// } -// } </style> -- Gitblit v1.9.1