|
|
@ -27,19 +27,6 @@ const form_box = ref<HTMLElement | null>(null);
|
|
|
|
//保证界面切换后不出现非对应的错误提示——可优化!!!!!
|
|
|
|
//保证界面切换后不出现非对应的错误提示——可优化!!!!!
|
|
|
|
const switchLoginEvent = () =>{
|
|
|
|
const switchLoginEvent = () =>{
|
|
|
|
password.value = vericode.value = verifyPassword.value = "";
|
|
|
|
password.value = vericode.value = verifyPassword.value = "";
|
|
|
|
if(switchLogin.value)//注册切换登录
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
if(switchLoginMethod.value)//邮箱登录切换密码登录
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
password.value = verifyPassword.value = 123456;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
else
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
vericode.value = 1;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
switchLogin.value = !switchLogin.value;
|
|
|
|
switchLogin.value = !switchLogin.value;
|
|
|
|
switchLogin.value ? transRate.value = '0' : transRate.value = '90';
|
|
|
|
switchLogin.value ? transRate.value = '0' : transRate.value = '90';
|
|
|
|
if(form_box.value)
|
|
|
|
if(form_box.value)
|
|
|
@ -199,13 +186,17 @@ async function login(){
|
|
|
|
|
|
|
|
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<title>登录</title>
|
|
|
|
<title>登录</title>
|
|
|
|
|
|
|
|
<!-- 错误信息显示,但是有bug无法显示 -->
|
|
|
|
<el-alert
|
|
|
|
<el-alert
|
|
|
|
|
|
|
|
class = "error-msg"
|
|
|
|
v-if="showErrors"
|
|
|
|
v-if="showErrors"
|
|
|
|
title={{ ErrorsMessage }}
|
|
|
|
:title=ErrorsMessage
|
|
|
|
type="error"
|
|
|
|
type="error"
|
|
|
|
:closable="true"
|
|
|
|
:closable="true"
|
|
|
|
@close="showErrors = false"
|
|
|
|
@close="showErrors = false"
|
|
|
|
|
|
|
|
show-icon = "true"
|
|
|
|
center/>
|
|
|
|
center/>
|
|
|
|
|
|
|
|
<!-- 登录注册表单 -->
|
|
|
|
<div class = "container">
|
|
|
|
<div class = "container">
|
|
|
|
<div ref = "form_box" class = "form-box">
|
|
|
|
<div ref = "form_box" class = "form-box">
|
|
|
|
<!-- 注册表单 -->
|
|
|
|
<!-- 注册表单 -->
|
|
|
@ -218,7 +209,7 @@ async function login(){
|
|
|
|
<input type="password" placeholder="密码" v-model="password">
|
|
|
|
<input type="password" placeholder="密码" v-model="password">
|
|
|
|
<input type ="password" placeholder = "确认密码" v-model = "verifyPassword">
|
|
|
|
<input type ="password" placeholder = "确认密码" v-model = "verifyPassword">
|
|
|
|
<input type="text" placeholder="验证码" v-model="vericode">
|
|
|
|
<input type="text" placeholder="验证码" v-model="vericode">
|
|
|
|
<button @click = "onRegisterSubmit;checkErrors">注册</button>
|
|
|
|
<button @click = "onRegisterSubmit(),checkErrors()">注册</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- 登录表单 -->
|
|
|
|
<!-- 登录表单 -->
|
|
|
|
<div class = "login-box" :class ="{hidden: switchLogin}">
|
|
|
|
<div class = "login-box" :class ="{hidden: switchLogin}">
|
|
|
@ -237,7 +228,7 @@ async function login(){
|
|
|
|
<input type="text" placeholder="验证码" v-model="vericode">
|
|
|
|
<input type="text" placeholder="验证码" v-model="vericode">
|
|
|
|
<button class = "switch-btn" @click="switchLoginMethodEvent">密码登录</button>
|
|
|
|
<button class = "switch-btn" @click="switchLoginMethodEvent">密码登录</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<button @click="chooseLogin;checkErrors">登录</button>
|
|
|
|
<button @click="chooseLogin(),checkErrors()">登录</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
@ -288,14 +279,11 @@ async function login(){
|
|
|
|
position: relative;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.error-msg p{
|
|
|
|
.error-msg{
|
|
|
|
align-items: center;
|
|
|
|
width:500px;
|
|
|
|
position:absolute;
|
|
|
|
position: absolute;
|
|
|
|
flex-direction: column;
|
|
|
|
top:5%;
|
|
|
|
color:#fff;
|
|
|
|
left:30%;
|
|
|
|
font-size:20px;
|
|
|
|
|
|
|
|
top:12%;
|
|
|
|
|
|
|
|
left:37%;
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.form-box{
|
|
|
|
.form-box{
|
|
|
|