修改登录添加头像

This commit is contained in:
熊丽君
2021-08-03 14:35:04 +08:00
parent 3410256837
commit 3d0e882d1b
4 changed files with 57 additions and 34 deletions

View File

@ -10,34 +10,36 @@ const whiteList = ['/login', '/auth-redirect', '/bind', '/register'];
router.beforeEach((to, from, next) => {
NProgress.start();
if (getToken()) {
// if (to.path === '/login') {
// next({ path: '/' });
// NProgress.done(); // if current page is dashboard will not trigger afterEach hook, so manually handle it
// } else {
// if (store.getters.roles.length === 0) {
// store
// .dispatch('GetInfo')
// .then(res => {
// // 拉取用户信息
// let menus = res.data.menus;
// let username = res.data.username;
// store.dispatch('GenerateRoutes', { menus, username }).then(() => {
// // 生成可访问的路由表
// router.addRoutes(store.getters.addRoutes); // 动态添加可访问路由表
// next({ ...to, replace: true });
// });
// })
// .catch(err => {
// store.dispatch('FedLogOut').then(() => {
// Message.error(err || 'Verification failed, please login again');
// next({ path: '/' });
// });
// });
// } else {
// next();
// }
// }
if (to.path === '/login') {
next({ path: '/' });
NProgress.done(); // if current page is dashboard will not trigger afterEach hook, so manually handle it
} else {
if (store.getters.roles.length === 0) {
store
.dispatch('GetInfo')
.then(res => {
// 拉取用户信息
let menus = res.data.menus;
let username = res.data.username;
next({ ...to, replace: true });
// store.dispatch('GenerateRoutes', { menus, username }).then(() => {
// // 生成可访问路由表
// router.addRoutes(store.getters.addRoutes); // 动态添加可访问路由表
// next({ ...to, replace: true });
// });
})
.catch(err => {
store.dispatch('FedLogOut').then(() => {
Message.error(err || 'Verification failed, please login again');
next({ path: '/' });
});
});
} else {
next();
}
}
} else {
console.log('无');
next();
// if (whiteList.indexOf(to.path) !== -1) {
// next();

View File

@ -73,6 +73,7 @@ const user = {
const avatar = !res.data.icon
? require('@/assets/image/profile.jpg')
: process.env.VUE_APP_BASE_API + user.icon;
console.log(avatar);
if (res.roles && res.roles.length > 0) {
// 验证返回的roles是否是一个非空数组
commit('SET_ROLES', res.roles);

View File

@ -36,11 +36,14 @@
<div class="content">
<!-- 头部 -->
<div class="header">
<div class="login">
<div class="login_btn" v-if="2 == 3">
<el-button type="text" @click="handlePage">登录</el-button>
<i class="mark">|</i>
<el-button type="text" @click="handlePage">注册</el-button>
</div>
<div class="avatar-wrapper" v-else>
<img :src="avatar" class="user-avatar" />
</div>
<div class="img2_box">
<img src="@/assets/image/02.png" alt="" />
<div class="search">
@ -130,6 +133,7 @@
</template>
<script>
import { mapGetters } from 'vuex';
export default {
name: 'home',
data() {
@ -168,6 +172,9 @@ export default {
path: this.$route.path == '/' ? '/home' : this.$route.path
};
},
computed: {
...mapGetters(['sidebar', 'avatar', 'device'])
},
methods: {
handlePage() {
this.$router.push({ path: '/login' });
@ -216,7 +223,8 @@ export default {
height: 206px;
padding: 0 100px;
background-image: url(../assets/image/01.png);
.login {
.login_btn {
height: 60px;
text-align: right;
.el-button {
font-size: 16px;
@ -228,11 +236,22 @@ export default {
margin: 0 14px;
}
}
.avatar-wrapper {
text-align: right;
.user-avatar {
vertical-align: middle;
cursor: pointer;
width: 60px;
height: 60px;
border-radius: 50%;
}
}
.img2_box {
display: flex;
justify-content: space-between;
height: 63px;
margin-top: 75px;
margin-top: 55px;
img {
width: 392px;
height: 100%;

View File

@ -185,8 +185,8 @@ export default {
count: '', // 初始化次数
timer: null,
loginForm: {
username: '',
password: '',
username: '19855383805',
password: '123456',
rememberMe: false
},
loginRules: {
@ -265,6 +265,7 @@ export default {
this.$store
.dispatch('Login', this.loginForm)
.then(() => {
// this.$router.go(-1);
this.$router.push({ path: this.redirect || '/' });
})
.catch(() => {
@ -274,8 +275,8 @@ export default {
this.$store
.dispatch('Register', this.loginForm)
.then(() => {
// this.$router.push({ path: this.redirect || '/' });
this.$router.go(-1);
this.$router.push({ path: this.redirect || '/' });
// this.$router.go(-1);
})
.catch(() => {
this.loading = false;