Skip to content

T
ty_patentSys
Commit 7dadbb5e by liudx
Options

添加头部个人信息设置

parent 225627a7
Showing with 171 additions and 51 deletions
src/components/HeaderCon.vue
......@@ -5,56 +5,107 @@
<span>专利成果转化智能推荐系统</span>
</div>
<div class="header_right">
<!-- <img src="" alt=""> -->
<span class="portrait "></span>
<span class="tel">{{ username }}</span>
<!-- <img src="" alt=""> -->
<span class="portrait"></span>
<a-popover overlayClassName="portrait_set">
<template #content>
<div class="portrait_btn" @mouseenter="hover($event, '1')">
<span v-if="hover_num == 1" @click="toset">
<img src="@/static/common/icon-yhsz-hover.png" alt="" />&nbsp;
<span :class="[hover_num == 1 ? 'active' : '']">用户设置</span>
</span>
<span v-else>
<img src="@/static/common/icon-yhsz.png" alt="" />&nbsp;
<span :class="[hover_num == 1 ? '' : 'active']">用户设置</span>
</span>
</div>
<br />
<div class="portrait_btn" @mouseenter="hover($event, '2')">
<span v-if="hover_num == 2" @click="exit">
<img src="@/static/common/icon-tcdl-hover.png" alt="" />&nbsp;
<span :class="[hover_num == 2 ? 'active' : '']">退出登录</span>
</span>
<span v-else>
<img src="@/static/common/icon-tcdl.png" alt="" />&nbsp;
<span :class="[hover_num == 2 ? '' : 'active']">退出登录</span>
</span>
</div>
</template>
<span class="tel">{{ username }}</span>
</a-popover>
</div>
</div>
</template>
<script>
export default {
name: "HeaderCon",
props:{
'username':{
type:String,
props: {
username: {
type: String,
},
},
data() {
return {
hover_num: "",
};
},
methods: {
hover(e, num) {
// console.log(num)
this.hover_num = num;
},
toset(){
},
exit(){
}
}
},
};
</script>
<style lang="less" scoped>
.header {
height: 65px;
background-color: #fff;
box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.1);
display: flex;
justify-content: space-between;
.header_left {
padding: 10px 29px;
span {
color: #002d70;
font-family: "jiangcheng";
padding: 0 15px;
height: 65px;
background-color: #fff;
box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.1);
display: flex;
justify-content: space-between;
.header_left {
padding: 10px 29px;
span {
color: #002d70;
font-family: "jiangcheng";
padding: 0 15px;
}
}
.header_right {
padding: 0 50px 30px;
// display: inline-block;
line-height: 60px;
.portrait {
display: inline-block;
border-radius: 50%;
width: 60px;
height: 60px;
background-color: pink;
.portrait_set {
.portrait_btn {
cursor: pointer !important;
.active {
color: #3e7bfa !important;
}
}
}
}
.header_right {
padding: 0 50px 30px;
// display: inline-block;
.tel {
padding: 0 15px;
color: #86909c;
font-family: "Microsoft YaHei-Bold";
line-height: 60px;
.portrait {
display: inline-block;
border-radius: 50%;
width: 60px;
height: 60px;
background-color: pink;
}
.tel {
padding: 0 15px;
color: #86909C;
font-family: "Microsoft YaHei-Bold";
line-height: 60px;
display: inline-block;
vertical-align: text-bottom;
}
display: inline-block;
vertical-align: text-bottom;
}
}
}
</style>
src/store/index.js
......@@ -2,9 +2,13 @@ import { createStore } from 'vuex'
export default createStore({
state: {
username:'123456'
username:'123456',
token:''
},
mutations: {
setTOKEN(str){
this.token = str
}
},
actions: {
},
......
src/utils/API.js
import { get, post } from './request'
//示例
export const login = p => post('/api/user/get_login', p);
export const login = p => post('/api/common/login', p);
// export const sendSms = p => post('/api/common/sendSms', p);
// export const sendSms = p => get('/api/home/homeWords',{});
src/utils/request.js
......@@ -2,11 +2,11 @@ import axios from 'axios';
import store from '../store/index'
// 环境的切换
axios.defaults.baseURL = 'http://192.168.110.15:5001/';
axios.defaults.baseURL = 'https://taiyuan-patent.mayanan.cn/';
// 请求超时时间
axios.defaults.timeout = 10000;
axios.defaults.timeout = 50000;
// post请求头
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';
axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8';
// 请求拦截器
axios.interceptors.request.use(
config => {
......@@ -14,7 +14,6 @@ axios.interceptors.request.use(
// 即使本地存在token，也有可能token是过期的，所以在响应拦截器中要对返回状态进行判断
// const token = store.state.token;
// token && (config.headers.Authorization = token);
console.log(config)
return config;
},
error => {
......
src/views/login/admin.vue
......@@ -72,6 +72,7 @@
type="primary"
html-type="submit"
class="login-form-button"
@click="login"
>
登录
</a-button>
......@@ -99,6 +100,9 @@
</div>
</template>
<script>
import { AES_Encrypt, AES_Decrypt } from "@/utils/aes_util.js";
import { login } from "@/utils/API";
import { message } from "ant-design-vue";
export default {
name: "AdminLogin",
data() {
......@@ -107,10 +111,35 @@ export default {
username: "",
password: "",
remember: true,
autologin: false,
},
};
},
methods:{
//账号登录
login(){
let param = AES_Encrypt(
JSON.stringify({
login_name:this.formState.username,
password:this.formState.password,
})
);
login({
param,
}).then((res) => {
console.log(res)
if(res.code == 0){
message.success('登录成功')
this.$store.commit('setTOKEN',res.data.token)
localStorage.setItem('token',res.data.token)
this.$router.push({
path:'/index'
})
}else{
message.error(res.msg)
}
});
},
}
};
</script>
<style lang="less" scoped>
......
src/views/login/index.vue
......@@ -72,6 +72,14 @@
>
登录
</a-button>
<!-- <a-button
type="primary"
html-type="submit"
class="login-form-button"
@click="send"
>
发送
</a-button> -->
</a-form-item>
<a-form-item>
<div class="admin_login" style="float: left">
......@@ -107,6 +115,7 @@
<script>
import { AES_Encrypt, AES_Decrypt } from "@/utils/aes_util.js";
import { login } from "@/utils/API";
import { message } from "ant-design-vue";
export default {
name: "login",
data() {
......@@ -121,13 +130,37 @@ export default {
},
mounted() {},
methods: {
// login() {
// login({
// ...parmas
// }).then((res) => {
// });
// },
//账号登录
login(){
let param = AES_Encrypt(
JSON.stringify({
login_name:this.formState.username,
password:this.formState.password,
})
);
login({
param,
}).then((res) => {
console.log(res)
if(res.code == 0){
message.success('登录成功')
this.$store.commit('setTOKEN',res.data.token)
localStorage.setItem('token',res.data.token)
this.$router.push({
path:'/index'
})
}else{
message.error(res.msg)
}
});
},
send() {
sendSms({phone:15313067271}).then(res=>{
})
},
},
};
</script>
......
vue.config.js
......@@ -18,7 +18,7 @@ module.exports = {
// 配置不同的后台API地址
proxy: {
'/api': {
target: 'http://192.168.110.15:5001/api',
target: 'https://taiyuan-patent.mayanan.cn',
ws: false,
changeOrigin: true,
pathRewrite: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment