username 改为mobile

This commit is contained in:
jqtmviyu@gmail.com 2021-01-13 16:41:21 +08:00
parent 940cc302a8
commit aa82a9d8ac

View File

@ -3,17 +3,19 @@
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
<div class="title-container">
<h3 class="title">Login Form</h3>
<h3 class="title">
<img src="@/assets/common/login-logo.png" alt="">
</h3>
</div>
<el-form-item prop="username">
<el-form-item prop="mobile">
<span class="svg-container">
<svg-icon icon-class="user" />
</span>
<el-input
ref="username"
v-model="loginForm.username"
placeholder="Username"
v-model="loginForm.mobile"
placeholder="用户名"
name="username"
type="text"
tabindex="1"
@ -30,7 +32,7 @@
ref="password"
v-model="loginForm.password"
:type="passwordType"
placeholder="Password"
placeholder="密码"
name="password"
tabindex="2"
auto-complete="on"
@ -41,11 +43,12 @@
</span>
</el-form-item>
<el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">Login</el-button>
<el-button class="loginBtn" :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">登录</el-button>
<!-- .native监听原生事件 -->
<div class="tips">
<span style="margin-right:20px;">username: admin</span>
<span> password: any</span>
<span style="margin-right:20px;">账号: 13800000002</span>
<span> 密码: 123456</span>
</div>
</el-form>
@ -74,11 +77,11 @@ export default {
}
return {
loginForm: {
username: 'admin',
password: '111111'
mobile: '13800000002',
password: '123456'
},
loginRules: {
username: [{ required: true, trigger: 'blur', validator: validateUsername }],
mobile: [{ required: true, trigger: 'blur', validator: validateUsername }],
password: [{ required: true, trigger: 'blur', validator: validatePassword }]
},
loading: false,
@ -130,7 +133,7 @@ export default {
/* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
$bg:#283443;
$light_gray:#fff;
$light_gray:#68b0fe;
$cursor: #fff;
@supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
@ -165,10 +168,21 @@ $cursor: #fff;
.el-form-item {
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.1);
background: rgba(255, 255, 255, 0.7); //
border-radius: 5px;
color: #454545;
}
.loginBtn {
background: #407ffe;
height: 64px;
line-height: 32px;
font-size: 24px;
}
.el-form-item__error {
color: #fff
}
}
</style>
@ -178,6 +192,8 @@ $dark_gray:#889aa4;
$light_gray:#eee;
.login-container {
background-image: url('~@/assets/common/login.jpg');
background-position: center;
min-height: 100%;
width: 100%;
background-color: $bg;