no message

Former-commit-id: 7aa8f366ef880ea13096cbef9b91d049dcdb20a0
Former-commit-id: 14bbcaa524412baed2e9ae04c7dbf42cd1c0b228
Former-commit-id: 7c9aa33bd00c573e4d9a2b19ed2917dba41a484e
This commit is contained in:
李杨
2018-01-22 00:04:39 +08:00
parent e153bc2d37
commit da24caf4c4
3 changed files with 88 additions and 4 deletions

View File

@@ -1 +0,0 @@
183e2862510cac25d289c2d00765144d685eb6fa

View File

@@ -0,0 +1 @@
a6df8e4324acd50c885bf16a4eddfe9895775dc7

View File

@@ -1,8 +1,41 @@
<template>
<div class="login-page">
<div class="layer bg" id="login"></div>
<div class="layer">
<el-card class="form-group"></el-card>
<div class="layer flex-center">
<div class="logo-group">
<img src="@/assets/image/logo/w500.png" alt="logo">
</div>
<div class="form-group">
<el-card>
<el-form
ref="loginForm"
label-position="top"
:rules="rules"
:model="formLogin">
<el-form-item prop="username">
<el-input
type="text"
v-model="formLogin.username"
placeholder="用户名">
<i slot="prepend" class="fa fa-user-circle-o"></i>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
type="password"
v-model="formLogin.password"
placeholder="密码">
<i slot="prepend" class="fa fa-keyboard-o"></i>
</el-input>
</el-form-item>
<el-button @click="submit" type="primary" class="button-login">登陆</el-button>
</el-form>
</el-card>
<el-button type="info" class="button-help">
需要帮助
<i class="fa fa-question-circle"></i>
</el-button>
</div>
</div>
</div>
</template>
@@ -14,8 +47,36 @@ require('particles.js')
// https://vincentgarreau.com/particles.js/#default
import config from './config/default'
export default {
data () {
return {
formLogin: {
username: '',
password: ''
},
rules: {
username: [
{ required: true, message: '请输入用户名', trigger: 'blur' }
],
password: [
{ required: true, message: '请输入密码', trigger: 'blur' }
]
}
}
},
mounted () {
particlesJS('login', config)
},
methods: {
submit () {
this.$refs.loginForm.validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
})
}
}
}
</script>
@@ -30,10 +91,33 @@ export default {
position: absolute;
height: 100%;
width: 100%;
&.flex-center {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
}
// logo
.logo-group {
margin-top: -100px;
img {
width: 100px;
}
}
// 登陆表单
.form-group {
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
width: 300px;
.el-card {
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
}
.button-login {
width: 100%;
}
}
.button-help {
width: calc(100% - 40px);
margin: 20px;
}
// 背景
.bg {