| | |
| | | <el-form-item prop="verifyCode" label="验证码"> |
| | | <el-input v-model="state.loginPhoneForm.verifyCode" placeholder="请输入四位验证码" maxlength="6" clearable> |
| | | <template #append> |
| | | <el-button type="primary" @click="handleSendVerifyCode" :disabled="countdown > 0">{{ |
| | | countdown > 0 ? `${countdown}秒后重试` : '获取验证码' |
| | | }}</el-button> |
| | | <el-button type="primary" @click="handleSendVerifyCode" :disabled="hasSended">{{ sendCodeMsg }}</el-button> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | |
| | | import { accessSessionKey, userNameKey } from '/@/utils/request'; |
| | | import { gotoRoute } from '/@/utils/route'; |
| | | import { Local, LoginInfo } from '/@/utils/storage'; |
| | | import { isSharePage } from '/@/stores/chatRoom'; |
| | | const loginFormRef = ref<FormInstance>(null); //账户密码登录 |
| | | const formPhoneRef = ref(); //手机号登录 |
| | | const isLoginStatus = ref(!!Local.get(accessSessionKey)); |
| | | const userName = ref(''); |
| | | const countdown = ref(0); |
| | | const countdown = ref(null); |
| | | const firstUserCharacter = computed(() => userName.value?.[0]?.toUpperCase()); |
| | | watchEffect(() => { |
| | | if (!isLoginStatus.value) return; |
| | |
| | | verifyCode: [{ required: true, message: '请输入验证码', trigger: 'blur' }], |
| | | }; |
| | | const handleClick = (item) => { |
| | | if(!item.routerName) return; |
| | | if (!item.routerName) return; |
| | | gotoRoute({ name: item.routerName }); |
| | | }; |
| | | const LOGIN_CLIENT = 'Web端'; |
| | | |
| | | //登录 |
| | | const openLoginDlg = async () => { |
| | | // 分享页不需要 |
| | | if (isSharePage.value) return; |
| | | state.isShowLogin = true; |
| | | }; |
| | | const handleClose = () => { |
| | | state.isShowLogin = false; |
| | | }; |
| | | const hasSended = computed(() => { |
| | | return countdown.value !== null; |
| | | }); |
| | | const sendCodeMsg = computed(() => { |
| | | return !hasSended.value ? '获取验证码' : `${countdown.value} 秒后重试`; |
| | | }); |
| | | //登录 |
| | | const onSubmit = async () => { |
| | | if (state.activeLoginName === 'accountUser') { |
| | |
| | | user: state.loginForm.account, |
| | | pass: state.loginForm.pwd, |
| | | client: LOGIN_CLIENT, |
| | | |
| | | }); |
| | | if (!res.json_ok) { |
| | | return ElMessage.error(res.json_msg); |
| | |
| | | phone: state.loginPhoneForm.phoneUser, |
| | | code: state.loginPhoneForm.verifyCode, |
| | | client: LOGIN_CLIENT, |
| | | |
| | | }); |
| | | if (!res.json_ok) { |
| | | return ElMessage.error(res.json_msg); |