255 lines
6.5 KiB
Vue
255 lines
6.5 KiB
Vue
<!-- 首页 -->
|
||
<template>
|
||
<div class="home">
|
||
<div class="home_header">
|
||
<div class="logo">
|
||
<span class="logo_title"></span>
|
||
</div>
|
||
<div class="user_exit">
|
||
<span>您好，{{ $store.getters.userInfo.uName }}</span>
|
||
|
||
<span class="exit" @click="logout">退出</span>
|
||
</div>
|
||
</div>
|
||
<div class="home_main">
|
||
<div class="left_wrapper">
|
||
<search-group></search-group>
|
||
<div class="main-tabs">
|
||
<div class="main-left-wrap">
|
||
<el-button type="text" class="more" @click="MORE">MORE</el-button>
|
||
<el-tabs
|
||
v-model="activeName"
|
||
class="home-tabs"
|
||
@tab-click="handleTabClick"
|
||
>
|
||
<!-- <el-tab-pane label="外部会议资料" name="conferenceMaterials">-->
|
||
<!-- <conference-materials></conference-materials>-->
|
||
<!-- </el-tab-pane>-->
|
||
<!-- <el-tab-pane label="会议通知" name="noticeOfMeeting">-->
|
||
<!-- <notice-of-meeting></notice-of-meeting>-->
|
||
<!-- </el-tab-pane>-->
|
||
<el-tab-pane label="标准征求意见" name="solicitOpinions">
|
||
<solicitOpinions></solicitOpinions>
|
||
</el-tab-pane>
|
||
<el-tab-pane label="标准发布" name="release">
|
||
<release></release>
|
||
</el-tab-pane>
|
||
<!-- <el-tab-pane label="外部资讯" name="realTimeInfo">-->
|
||
<!-- <realTimeInfo></realTimeInfo>-->
|
||
<!-- </el-tab-pane>-->
|
||
</el-tabs>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="right_wrapper">
|
||
<nav-menu></nav-menu>
|
||
<todo-list></todo-list>
|
||
</div>
|
||
</div>
|
||
<div calss="home_footer">
|
||
<div class="footer">
|
||
<Empennage></Empennage>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import searchGroup from './components/searchGroup'
|
||
import realTimeInfo from './components/realtimeinfo'
|
||
import release from './components/release'
|
||
import navMenu from './components/navMenu'
|
||
import solicitOpinions from './components/solicitopinions'
|
||
import todoList from './components/todoList'
|
||
import Empennage from "./components/empennage"
|
||
import noticeOfMeeting from "./components/noticeOfMeeting"
|
||
import conferenceMaterials from "./components/conferenceMaterials"
|
||
|
||
export default {
|
||
name: 'Home',
|
||
components: {
|
||
Empennage,
|
||
searchGroup,
|
||
solicitOpinions,
|
||
realTimeInfo,
|
||
release,
|
||
navMenu,
|
||
todoList,
|
||
noticeOfMeeting,
|
||
conferenceMaterials,
|
||
},
|
||
mixins: [],
|
||
data() {
|
||
return {
|
||
activeName: 'solicitOpinions',
|
||
}
|
||
},
|
||
computed: {},
|
||
watch: {},
|
||
mounted() {},
|
||
methods: {
|
||
handleTabClick(tab, event) {},
|
||
//退出登录
|
||
logout(){
|
||
this.$confirm('您确认要退出吗?', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning',
|
||
confirmButtonClass: 'common-button-primary',
|
||
roundButton: false
|
||
}).then(() => {
|
||
this.$store.commit('setTypeFlag', 'loginOut')
|
||
this.$http.get('logout', {}, {
|
||
_this: this
|
||
}, res => {
|
||
this.$store.dispatch('logout')
|
||
this.$router.push('/login')
|
||
}, e => {})
|
||
}).catch(() => {
|
||
})
|
||
},
|
||
MORE() {
|
||
switch (this.activeName) {
|
||
case 'solicitOpinions':
|
||
this.$router.push({name: 'standardForComments'})
|
||
break
|
||
case 'release':
|
||
this.$confirm('请选择国内/海外标准', {
|
||
confirmButtonText: '国内标准',
|
||
cancelButtonText: '海外标准',
|
||
type: 'warning',
|
||
center: true
|
||
}).then(() => {
|
||
this.$router.push({name: 'domesticStandardsAndRegulations'})
|
||
}).catch(() => {
|
||
this.$router.push({name: 'foreignStandardsAndRegulations'})
|
||
});
|
||
break
|
||
default:
|
||
break
|
||
}
|
||
}
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.home {
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding: 1.1vh 3.51vw 4.9vh;
|
||
//background: url('../../assets/images/home/BG.png') no-repeat;
|
||
background: url("../../assets/images/shangqi/home/BG.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
.home_header {
|
||
position: relative;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
height: 9.1vh;
|
||
margin-bottom: 2.7vh;
|
||
.logo {
|
||
width: 500px;
|
||
height: 70px;
|
||
margin-top: 20px;
|
||
background: url("../../assets/images/shangqi/home/logo3.png") no-repeat;
|
||
.logo_title {
|
||
height: 50px;
|
||
margin-top: 50px;
|
||
margin-left: 35%;
|
||
font-size: 25px;
|
||
font-weight: bold;
|
||
line-height: 50px;
|
||
color: #fff;
|
||
}
|
||
}
|
||
.user_exit {
|
||
span {
|
||
display: inline-block;
|
||
margin-top: 50px;
|
||
color: #fff;
|
||
}
|
||
.user,
|
||
.exit {
|
||
height: 50px;
|
||
margin: 5px;
|
||
font-size: 14px;
|
||
line-height: 50px;
|
||
color: #fff;
|
||
cursor: pointer;
|
||
&:hover {
|
||
color: #ecce38;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.home_main {
|
||
display: flex;
|
||
flex: 1;
|
||
overflow: hidden;
|
||
.left_wrapper {
|
||
display: flex;
|
||
flex: 1;
|
||
flex-direction: column;
|
||
width: 60vw;
|
||
height: 100%;
|
||
margin-right: 10px;
|
||
.more {
|
||
float: right;
|
||
color: #FFFFFF;
|
||
margin: 0px 15px;
|
||
&:hover {
|
||
color: red;
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
.home-tabs {
|
||
margin-left: 2.34vw;
|
||
::v-deep.el-tabs__header{
|
||
margin: 0 70px 15px 0px
|
||
}
|
||
::v-deep {
|
||
.el-tabs__item {
|
||
font-size: 16px;
|
||
font-weight: 500;
|
||
color: #ffffff;
|
||
}
|
||
.el-tabs__nav-wrap::after {
|
||
background-color: transparent;
|
||
}
|
||
}
|
||
}
|
||
.main-tabs {
|
||
display: flex;
|
||
flex: 1;
|
||
flex-direction: column;
|
||
width: 60vw;
|
||
height: 67.7vh;
|
||
margin-right: 10px;
|
||
background: rgba(182, 213, 255, 0.22);
|
||
}
|
||
}
|
||
.right_wrapper {
|
||
display: flex;
|
||
flex-direction: column;
|
||
width: 32.2vw;
|
||
height: 100%;
|
||
}
|
||
.search-condition {
|
||
display: block;
|
||
.el-input {
|
||
width: 300px;
|
||
}
|
||
}
|
||
}
|
||
.footer {
|
||
height: 5.2vh;
|
||
margin-top: 1.3vh;
|
||
line-height: 5.2vh;
|
||
background: rgba(182, 213, 255, 0.22);
|
||
}
|
||
}
|
||
</style>
|
||
|