|
|
|
|
@ -2,42 +2,42 @@
|
|
|
|
|
<div class="login-container">
|
|
|
|
|
<img src="../../assets/imgs/bg_bottom.png" class="bg_bottom" />
|
|
|
|
|
<img src="../../assets/imgs/bg_left.png" class="bg_left" />
|
|
|
|
|
<img src="../../assets/imgs/footer_logo.png" class="footer_logo" />
|
|
|
|
|
<img src="../../assets/imgs/footer_logo.png" class="footer_logo" />
|
|
|
|
|
<div class="formBox" ref="formBox">
|
|
|
|
|
<el-form ref="loginForm" :model="loginForm" :style="{marginTop:marginTop+'px'}" :rules="loginRules"
|
|
|
|
|
class="login-form" auto-complete="on" label-position="left">
|
|
|
|
|
|
|
|
|
|
<div class="title-container">
|
|
|
|
|
<h3 class="title">预约管理系统</h3>
|
|
|
|
|
</div>
|
|
|
|
|
<img src="../../assets/imgs/bg_box.png" width="100%" />
|
|
|
|
|
<div class="box_middle">
|
|
|
|
|
<el-form-item prop="username">
|
|
|
|
|
<span class="svg-container">
|
|
|
|
|
<svg-icon icon-class="user" />
|
|
|
|
|
</span>
|
|
|
|
|
<el-input ref="username" v-model="loginForm.username" placeholder="请输入登录名" name="username" type="text"
|
|
|
|
|
tabindex="1" auto-complete="on" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
<el-form-item prop="password">
|
|
|
|
|
<span class="svg-container">
|
|
|
|
|
<svg-icon icon-class="password" />
|
|
|
|
|
</span>
|
|
|
|
|
<el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType"
|
|
|
|
|
placeholder="请输入密码" name="password" tabindex="2" auto-complete="on" @keyup.enter.native="handleLogin" />
|
|
|
|
|
<span class="show-pwd" @click="showPwd">
|
|
|
|
|
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
|
|
|
|
|
</span>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
<el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;"
|
|
|
|
|
@click.native.prevent="handleLogin">登录</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<img src="../../assets/imgs/bg_box_bottom.png" width="100%" />
|
|
|
|
|
</el-form>
|
|
|
|
|
</div>
|
|
|
|
|
<el-form ref="loginForm" :model="loginForm" :style="{marginTop:marginTop+'px'}" :rules="loginRules"
|
|
|
|
|
class="login-form" auto-complete="on" label-position="left">
|
|
|
|
|
|
|
|
|
|
<div class="title-container">
|
|
|
|
|
<h3 class="title">预约管理系统</h3>
|
|
|
|
|
</div>
|
|
|
|
|
<img src="../../assets/imgs/bg_box.png" width="100%" />
|
|
|
|
|
<div class="box_middle">
|
|
|
|
|
<el-form-item prop="username">
|
|
|
|
|
<span class="svg-container">
|
|
|
|
|
<svg-icon icon-class="user" />
|
|
|
|
|
</span>
|
|
|
|
|
<el-input ref="username" v-model="loginForm.username" placeholder="请输入登录名" name="username" type="text"
|
|
|
|
|
tabindex="1" auto-complete="on" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
<el-form-item prop="password">
|
|
|
|
|
<span class="svg-container">
|
|
|
|
|
<svg-icon icon-class="password" />
|
|
|
|
|
</span>
|
|
|
|
|
<el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType"
|
|
|
|
|
placeholder="请输入密码" name="password" tabindex="2" auto-complete="on" @keyup.enter.native="handleLogin" />
|
|
|
|
|
<span class="show-pwd" @click="showPwd">
|
|
|
|
|
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
|
|
|
|
|
</span>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
<el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;"
|
|
|
|
|
@click.native.prevent="handleLogin">登录</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<img src="../../assets/imgs/bg_box_bottom.png" width="100%" />
|
|
|
|
|
</el-form>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="footer">
|
|
|
|
|
2022 © 中共苏州独立支部旧址
|
|
|
|
|
</div>
|
|
|
|
|
@ -60,7 +60,7 @@
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
const validatePassword = (rule, value, callback) => {
|
|
|
|
|
if (value.length < 6) {
|
|
|
|
|
if (value.length == 0) {
|
|
|
|
|
callback(new Error('密码输入错误'))
|
|
|
|
|
} else {
|
|
|
|
|
callback()
|
|
|
|
|
@ -115,7 +115,7 @@
|
|
|
|
|
var that = this;
|
|
|
|
|
let height = this.$refs.formBox.offsetHeight; //100
|
|
|
|
|
that.formHeight = height;
|
|
|
|
|
that.marginTop = (that.windowHeight - height*1.5) / 2;
|
|
|
|
|
that.marginTop = (that.windowHeight - height * 1.5) / 2;
|
|
|
|
|
// <!--把window.onresize事件挂在到mounted函数上-->
|
|
|
|
|
window.onresize = () => {
|
|
|
|
|
return (() => {
|
|
|
|
|
|