no message

Former-commit-id: e286a71eca33b0cbd8d114906701f8c37ed2ce41
Former-commit-id: fac7c3582b5ce793db8c86579156b15dfee4faf5
Former-commit-id: 3abdc7ccbc4fed3d45949b9cc921beced6de46e0
This commit is contained in:
李杨
2018-01-25 20:03:59 +08:00
parent 526eef827e
commit d4db050cce
3 changed files with 83 additions and 81 deletions

View File

@@ -3,19 +3,18 @@ import Mock from 'mockjs'
const userDB = [
{
username: 'admin',
password: 'admin'
},
{
username: 'FairyEver',
password: '000000'
password: 'admin',
avatar: 'http://fairyever.qiniudn.com/d2-admin-user.jpg'
},
{
username: 'user1',
password: '111111'
password: '111111',
avatar: 'http://fairyever.qiniudn.com/d2-admin-user-2.jpg'
},
{
username: 'user2',
password: '222222'
password: '222222',
avatar: ''
}
]
@@ -25,7 +24,10 @@ Mock.mock('/login', 'post', ({url, type, body}) => {
if (user) {
return {
code: 0,
msg: '登陆成功'
msg: '登陆成功',
data: {
...user
}
}
} else {
return {

View File

@@ -2,9 +2,11 @@
<div class="login-page">
<div class="layer bg" id="login"></div>
<div class="layer flex-center">
<!-- logo部分 -->
<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">
@@ -21,11 +23,12 @@
<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>
<!-- 帮助按钮 -->
<el-button type="info" class="button-help">
需要帮助
<i class="fa fa-question-circle"></i>
</el-button>
</div>
</div>
</template>
@@ -40,8 +43,8 @@ export default {
data () {
return {
formLogin: {
username: '',
password: ''
username: 'admin',
password: 'admin'
},
rules: {
username: [
@@ -62,6 +65,7 @@ export default {
submit () {
this.$refs.loginForm.validate((valid) => {
if (valid) {
// 开始请求登录接口
this.$http({
method: 'post',
url: '/login',
@@ -71,14 +75,9 @@ export default {
}
})
.then (res => {
if (res.data.code === 0) {
this.$message.success(res.data.msg)
setTimeout(() => {
this.$router.push('index')
}, 300);
} else {
this.$message.error(res.data.msg)
}
console.group('登录')
console.log(res)
console.groupEnd()
})
} else {
return false
@@ -90,64 +89,6 @@ export default {
</script>
<style lang="scss">
@import '~@/assets/style/public.scss';
.login-page {
background-color: #EDF4FA;
height: 100%;
position: relative;
// 层
.layer {
position: absolute;
height: 100%;
width: 100%;
&.flex-center {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
}
// logo
.logo-group {
margin-top: -75px - 70px;
position: relative;
top: 75px;
img {
height: 140px;
}
}
// 登陆表单
.form-group {
width: 300px;
// 重新设置卡片阴影
.el-card {
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
.el-card__body {
padding-top: 70px;
}
}
// 登陆按钮
.button-login {
width: 100%;
}
// 输入框左边的图表区域缩窄
.el-input-group__prepend {
padding: 0px 14px;
}
}
// 帮助按钮
.button-help {
width: 100%;
margin-top: $margin;
}
// 背景
.bg {
canvas {
display: block;
margin: 0px;
padding: 0px;
}
}
}
@import './style.scss';
</style>

View File

@@ -0,0 +1,59 @@
@import '~@/assets/style/public.scss';
.login-page {
background-color: #EDF4FA;
height: 100%;
position: relative;
// 层
.layer {
position: absolute;
height: 100%;
width: 100%;
&.flex-center {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
}
// 背景
.bg {
canvas {
display: block;
margin: 0px;
padding: 0px;
}
}
// logo
.logo-group {
margin-top: -75px - 70px;
position: relative;
top: 75px;
img {
height: 140px;
}
}
// 登陆表单
.form-group {
width: 300px;
// 重新设置卡片阴影
.el-card {
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
.el-card__body {
padding-top: 70px;
}
}
// 登陆按钮
.button-login {
width: 100%;
}
// 输入框左边的图表区域缩窄
.el-input-group__prepend {
padding: 0px 14px;
}
}
// 帮助按钮
.button-help {
width: 300px;
margin-top: $margin;
}
}