Skip to content

Commit

Permalink
登录接口联调通过
Browse files Browse the repository at this point in the history
  • Loading branch information
baimingxuan committed Sep 21, 2020
1 parent 09ecc2f commit f85e99f
Show file tree
Hide file tree
Showing 8 changed files with 128 additions and 10 deletions.
8 changes: 8 additions & 0 deletions src/api/login.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,3 +7,11 @@ export function login(data) {
data
})
}

export function getUserInfo(params) {
return request({
url: '/user/info',
method: 'get',
params
})
}
Binary file added src/assets/img/logo-icon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/img/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions src/components/UserAvatar/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@

<script>
import Avatar from '../../assets/img/avatar.png'
import { removeToken } from '../../utils/cookie'
export default {
name: 'UserAvatar',
Expand All @@ -23,6 +24,9 @@ export default {
},
methods: {
handleCommand(command) {
if (command === 'userCenter') {
this.$router.push({ path: '/user-center' })
}
if (command === 'loginOut') {
this.loginOut()
}
Expand All @@ -33,6 +37,8 @@ export default {
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
removeToken()
location.reload()
})
}
}
Expand Down
6 changes: 4 additions & 2 deletions src/layout/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,8 @@ import HeaderBar from './components/HeaderBar/index'
import SideMenu from './components/SideMenu/index'
import TagsNav from './components/TagsView/index'
import MainView from './components/MainView/index'
import Logo from '../assets/img/logo.png'
import LogoIcon from '../assets/img/logo-icon.png'
const RESIZE_WIDTH = 1440
Expand All @@ -38,9 +40,9 @@ export default {
...mapGetters('app', ['collapsed']),
imgSrc() {
if (this.collapsed) {
return 'https://cdn.jsdelivr.net/gh/baimingxuan/media-store/images/logo-icon.png'
return LogoIcon
}
return 'https://cdn.jsdelivr.net/gh/baimingxuan/media-store/images/logo.png'
return Logo
}
},
created() {
Expand Down
15 changes: 15 additions & 0 deletions src/router/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,21 @@ export const constantRoutes = [
title: '文档',
icon: 'vue-dsn-icon-wendang'
}
},
{
path: '/',
name: 'Layout',
component: Layout,
redirect: '/user-center',
hidden: true,
children: [{
path: 'user-center',
name: 'UserCenter',
component: () => import('../views/UserCenter'),
meta: {
title: '个人中心'
}
}]
}
]

Expand Down
23 changes: 19 additions & 4 deletions src/views/Login.vue
Original file line number Diff line number Diff line change
@@ -1,7 +1,10 @@
<template>
<div class="login-wrapper" :style="'background-image:url('+ Background +')'">
<div class="form-box">
<h3 class="form-title">登录Vue-Admin-Design账号</h3>
<div class="form-title">
<img src="../assets/img/logo.png" alt="icon">
<p>账 号 登 录</p>
</div>
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" label-width="0px" class="login-form">
<el-form-item prop="username">
<el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="请输入账号" prefix-icon="el-icon-user" />
Expand All @@ -25,6 +28,7 @@

<script>
import { login } from '../api/login'
import { setToken } from '../utils/cookie'
import Background from '../assets/img/login-background.jpg'
export default {
Expand All @@ -41,7 +45,16 @@ export default {
username: [{ required: true, trigger: 'blur', message: '用户名不能为空' }],
password: [{ required: true, trigger: 'blur', message: '密码不能为空' }]
},
loading: false
loading: false,
redirect: undefined
}
},
watch: {
$route: {
handler: function(route) {
this.redirect = route.query && route.query.redirect
},
immediate: true
}
},
methods: {
Expand All @@ -55,7 +68,8 @@ export default {
this.loading = true
login(data).then(res => {
this.loading = false
console.log(res)
setToken(res.token)
this.$router.push({ path: this.redirect || '/' })
}).catch(() => {
this.loading = false
})
Expand All @@ -76,7 +90,7 @@ export default {
background-size: cover;
.form-box {
width: 320px;
padding: 30px 30px 20px;
padding: 15px 30px 20px;
background: #fff;
border-radius: 4px;
box-shadow: 0 15px 30px 0 rgba(0, 0, 1, .1);
Expand All @@ -85,6 +99,7 @@ export default {
text-align: center;
color: #707070;
font-size: 18px;
letter-spacing: 2px;
}
}
}
Expand Down
80 changes: 76 additions & 4 deletions src/views/UserCenter.vue
Original file line number Diff line number Diff line change
@@ -1,15 +1,87 @@
<template>
<div class="user-center-wrapper">
个人中心
<div class="user-center-wrapper clear-fix">
<el-card shadow="always" :body-style="{padding: '50px'}">
<div class="user-avatar">
<img src="../assets/img/avatar.png" alt="avatar">
</div>
<ul class="user-info">
<li>
<label>用户名:</label>
<span>{{ userInfo.username }}</span>
</li>
<li>
<label>角色:</label>
<span>{{ userInfo.roles }}</span>
</li>
<li>
<label>昵称:</label>
<span>{{ userInfo.nickname }}</span>
</li>
<li>
<label>电话号码:</label>
<span>{{ userInfo.phone }}</span>
</li>
<li>
<label>邮箱:</label>
<span>{{ userInfo.email }}</span>
</li>
<li>
<label>创建时间:</label>
<span>{{ userInfo.createtime }}</span>
</li>
<li>
<label>更新时间:</label>
<span>{{ userInfo.updatetime }}</span>
</li>
</ul>
</el-card>
</div>
</template>

<script>
import { getUserInfo } from '../api/login'
export default {
name: 'UserCenter'
name: 'UserCenter',
data() {
return {
userInfo: {}
}
},
created() {
getUserInfo().then(res => {
this.userInfo = res
})
}
}
</script>

<style lang="less">
.user-center-wrapper {}
.user-center-wrapper {
.user-avatar {
float: left;
width: 150px;
height: 150px;
}
.user-info {
float: left;
width: 800px;
margin-left: 50px;
margin-bottom: 50px;
li {
height: 34px;
line-height: 34px;
label,
span {
display: inline-block;
vertical-align: middle;
}
label {
width: 80px;
margin-right: 12px;
text-align: right;
}
}
}
}
</style>

0 comments on commit f85e99f

Please sign in to comment.