zm/tougao_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
xulu
2021-08-18 17:45:45 +08:00
parent e6b2a06061
commit a17aebd38c
34 changed files with 2449 additions and 1268 deletions
Download Patch File Download Diff File Expand all files Collapse all files

232
src/components/common/Lead.vue Normal file
View File

@@ -0,0 +1,232 @@
<template>
<div class="header">
<div style="width: 1280px;margin: 0 auto;">
<div class="logo">
<img src="../../assets/img/bit_bug.png" alt="" style="width: 80px;margin-right: 10px;">
<span style="color:#1c66c0" v-if="this.link_path == '/managing'">{{$t('charact.role1')}}</span>
<span style="color:#e26a2d" v-if="this.link_path == '/editorial'">{{$t('charact.role2')}}</span>
<span style="color:#4640c4" v-if="this.link_path == '/peerewer'">{{$t('charact.role3')}}</span>
<span style="color:#cc3646" v-if="this.link_path == '/youthed'">{{$t('charact.role4')}}</span>
</div>
<div class="group">
TMR Group System
</div>
<div class="header-right">
<div class="header-user-con">
<!-- 中英文切换 -->
<el-dropdown class="egch_lagu" trigger="click" @command="chengelang">
<span class="el-dropdown-link">
language
<i class="el-icon-caret-bottom"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="en">english</el-dropdown-item>
<el-dropdown-item command="zh">中文简体</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- 用户名下拉菜单 -->
<el-dropdown class="user-name" trigger="click" @command="handleCommand">
<span class="el-dropdown-link">
Master
<!-- {{username}} -->
<i class="el-icon-caret-bottom"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="loginout">退出登录</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- 期刊下拉菜单 -->
<el-dropdown class="link_jour" trigger="click" @command="handlejournal">
<span>
{{ this.cate_title }}<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu :default-active="onRoutes" router slot="dropdown">
<el-dropdown-item v-for="item in cate_jour" :command="item" :index="item.index">
<i :class="item.icon"></i>{{ item.title }}
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<div>
</div>
</div>
<br clear="both">
</div>
</div>
</template>
<script>
import bus from '../common/bus';
export default {
data() {
return {
name: 'linxin',
cate_title: '',
link_path: '',
rostage_name: '',
cate_jour: [{
icon: 'el-icon-collection',
id: '1',
index: 'compiler',
title: 'Gastroenterology & Hepatology Research'
}, {
icon: 'el-icon-setting',
id: '2',
index: 'moniting',
title: 'Microenvironment & Microecology Research'
}, {
icon: 'el-icon-news',
id: '3',
index: 'quality',
title: '333'
}, {
icon: 'el-icon-suitcase-1',
id: '4',
index: 'wages',
title: '444'
}]
};
},
computed: {
username() {
let username = localStorage.getItem('U_name');
return username ? username : this.name;
},
onRoutes() {
0
return this.$route.path.replace('/', '');
}
},
created() {
this.getData();
},
methods: {
getData() {
this.cate_title = this.cate_jour[0].title
localStorage.setItem('journal_title', this.cate_jour[0].title);
localStorage.setItem('journal_id', this.cate_jour[0].id);
this.$router.push({
path: this.link_path,
query: {
jour_id: this.cate_jour[0].id
}
});
},
// 期刊下拉菜单点击
handlejournal(command) {
this.cate_title = command.title;
localStorage.setItem('journal_title', command.title);
localStorage.setItem('journal_id', command.id);
this.$router.push({
path: this.link_path,
query: {
jour_id: command.id
}
});
},
//切换语言
chengelang(commond) {
localStorage.setItem('langs', commond);
this.$router.go(0);
},
// 用户名下拉菜单选择事件
handleCommand(command) {
if (command == 'loginout') {
// 二次确认
this.$confirm('确定要退出登录', '提示', {
type: 'warning'
})
.then(() => {
this.$router.push('/login');
})
.catch(() => {});
}
}
},
mounted() {},
watch: {
$route: {
handler: function(route) {
this.link_path = route.path
},
immediate: true
}
}
};
</script>
<style scoped>
.header {
position: relative;
box-sizing: border-box;
width: 100%;
height: 70px;
font-size: 22px;
color: #333;
border-bottom: 3px solid #000;
background-color: #fff !important;
}
.header>div {}
.collapse-btn {
float: left;
padding: 0 21px;
cursor: pointer;
line-height: 70px;
}
.header .logo {
float: left;
/* width: 400px; */
line-height: 70px;
}
.header .logo i {
margin-right: 10px;
}
.header .group {
float: left;
width: 600px;
text-align: right;
line-height: 60px;
font-weight: bolder;
}
.header-right {
float: right;
padding-right: 20px;
}
.header-user-con {
display: flex;
height: 70px;
align-items: center;
}
.link_jour {
font-weight: bold;
align-items: center;
cursor: pointer;
}
.egch_lagu {
margin-right: 20px;
}
.user-name {
margin-right: 20px;
}
.el-dropdown-link {
color: #333;
cursor: pointer;
}
</style>