|
@@ -1,9 +1,9 @@
|
|
|
<template>
|
|
|
<el-card class="login-card">
|
|
|
<div class="login-welcome">
|
|
|
- <img v-if="this.user.userVO.photo != null && this.user.userVO.photo != ''" :src="this.user.userVO.photo" alt="welcome-img" class="pull-left welcome-img">
|
|
|
+ <img v-if="user.userVO&&user.userVO.photoUrl" :src="user.userVO&&user.userVO.photoUrl" alt="welcome-img"
|
|
|
+ class="pull-left welcome-img">
|
|
|
<img v-else src="../../assets/img/logo-project.png" alt="welcome-img" class="pull-left welcome-img">
|
|
|
-
|
|
|
<div style="margin-left: 46px">
|
|
|
<div class="welcome-title">
|
|
|
hi,欢迎使用群智众测平台
|
|
@@ -13,8 +13,12 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="welcome-btn">
|
|
|
- <a :href="loginUrl"><el-button type="primary" size="mini" class="pull-left login-btn" v-if="!isLogin">登录</el-button></a>
|
|
|
- <el-button type="danger" size="mini" class="pull-right cancel-btn" v-if="isLogin" @click.native="userLogout()">登出</el-button>
|
|
|
+ <a :href="loginUrl">
|
|
|
+ <el-button type="primary" size="mini" class="pull-left login-btn" v-if="!isLogin">登录</el-button>
|
|
|
+ </a>
|
|
|
+ <el-button type="danger" size="mini" class="pull-right cancel-btn" v-if="isLogin" @click.native="userLogout()">
|
|
|
+ 登出
|
|
|
+ </el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-card>
|
|
@@ -24,72 +28,83 @@
|
|
|
import Http from '@/js/http.js'
|
|
|
import Apis from '@/js/api.js'
|
|
|
import {storageGet} from '@/js/index.js'
|
|
|
+
|
|
|
export default {
|
|
|
name: "LoginCard",
|
|
|
- data(){
|
|
|
- return {
|
|
|
- isLogin: false,
|
|
|
- user: {},
|
|
|
- loginUrl: process.env.LOGIN_URL,
|
|
|
- }
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isLogin: false,
|
|
|
+ user: {},
|
|
|
+ loginUrl: process.env.LOGIN_URL,
|
|
|
+ }
|
|
|
},
|
|
|
methods: {
|
|
|
- loadData() {
|
|
|
- this.showLoading();
|
|
|
- if (storageGet('user') != null) {
|
|
|
- this.isLogin = true;
|
|
|
- this.user = storageGet('user');
|
|
|
- }
|
|
|
- },
|
|
|
- userLogout () {
|
|
|
- this.isLogin = false
|
|
|
- logout().then((res) => {
|
|
|
- location.reload();
|
|
|
- this.$router.push('/home')
|
|
|
- })
|
|
|
+ loadData() {
|
|
|
+ if (storageGet('user') != null) {
|
|
|
+ this.isLogin = true;
|
|
|
+ this.user = storageGet('user');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ userLogout() {
|
|
|
+ this.isLogin = false
|
|
|
+ logout().then((res) => {
|
|
|
+ location.reload();
|
|
|
+ this.$router.push('/home')
|
|
|
+ })
|
|
|
|
|
|
- },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.loadData();
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="less">
|
|
|
-.login-card {
|
|
|
- margin-bottom: 15px;
|
|
|
- .welcome-img {
|
|
|
- width: 40px;
|
|
|
- height: 40px;
|
|
|
- display: inline-block;
|
|
|
- margin: 2px 0;
|
|
|
- }
|
|
|
- .welcome-title {
|
|
|
- font-size:14px;
|
|
|
- font-family:Source Han Sans CN;
|
|
|
- font-weight:bold;
|
|
|
- color:rgba(0,0,0,1);
|
|
|
- }
|
|
|
- .welcome-content {
|
|
|
- font-size:13px;
|
|
|
- font-family:Source Han Sans CN;
|
|
|
- font-weight:400;
|
|
|
- color:rgba(0,0,0,1);
|
|
|
- }
|
|
|
- .welcome-btn {
|
|
|
- width: 100%;
|
|
|
- height: 28px;
|
|
|
- margin-top: 25px;
|
|
|
- .login-btn {
|
|
|
- background-color: rgba(0, 118, 203,1);
|
|
|
- &:hover {
|
|
|
- background-color: rgba(0, 118, 203,0.8);
|
|
|
- }
|
|
|
+ .login-card {
|
|
|
+ margin-bottom: 15px;
|
|
|
+
|
|
|
+ .welcome-img {
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 2px 0;
|
|
|
}
|
|
|
- .cancel-btn {
|
|
|
- background-color:rgba(217,92,93,1);
|
|
|
- &:hover {
|
|
|
- background-color:rgba(217,92,93,0.8);
|
|
|
+
|
|
|
+ .welcome-title {
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Source Han Sans CN;
|
|
|
+ font-weight: bold;
|
|
|
+ color: rgba(0, 0, 0, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .welcome-content {
|
|
|
+ font-size: 13px;
|
|
|
+ font-family: Source Han Sans CN;
|
|
|
+ font-weight: 400;
|
|
|
+ color: rgba(0, 0, 0, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .welcome-btn {
|
|
|
+ width: 100%;
|
|
|
+ height: 28px;
|
|
|
+ margin-top: 25px;
|
|
|
+
|
|
|
+ .login-btn {
|
|
|
+ background-color: rgba(0, 118, 203, 1);
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ background-color: rgba(0, 118, 203, 0.8);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .cancel-btn {
|
|
|
+ background-color: rgba(217, 92, 93, 1);
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ background-color: rgba(217, 92, 93, 0.8);
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</style>
|