yujialong 2 years ago
parent 23437d52c2
commit 61bb8931f0
  1. BIN
      src/assets/images/exp/1.png
  2. BIN
      src/assets/images/exp/2.png
  3. BIN
      src/assets/images/exp/3.png
  4. BIN
      src/assets/images/exp/4.png
  5. BIN
      src/assets/images/exp/5.png
  6. BIN
      src/assets/images/exp/6.png
  7. BIN
      src/assets/images/exp/7.png
  8. 259
      src/layouts/header/index.vue
  9. 232
      src/router/modules/column.js

Binary file not shown.

Before

Width:  |  Height:  |  Size: 436 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 266 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 270 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 604 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 219 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 285 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 256 KiB

@ -2,27 +2,35 @@
<div class="header">
<div class="group">
<img src="@/assets/images/group.png">
<breadcrumb v-if="crumbRefresh" ref="breadcrumb" :data="crumbs"></breadcrumb>
<breadcrumb v-if="crumbRefresh"
ref="breadcrumb"
:data="crumbs"></breadcrumb>
</div>
<div class="user-tool">
<template v-if="inContent">
<div class="site cp" @click="toIndex">
<div class="site cp"
@click="toIndex">
<img src="@/assets/images/index.png">
当前站点首页
</div>
<el-dropdown class="site-switch cp" @command="siteCommand">
<el-dropdown class="site-switch cp"
@command="siteCommand">
<span class="el-dropdown-link">
切换站点<i class="el-icon-caret-bottom el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item v-for="(site, i) in sites" :key="i" :command="site">{{ site.siteName }}</el-dropdown-item>
<el-dropdown-item v-for="(site, i) in sites"
:key="i"
:command="site">{{ site.siteName }}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
<!-- <img class="cp" src="@/assets/images/notice.png"> -->
<el-dropdown class="user-wrap" @command="userCommand">
<el-dropdown class="user-wrap"
@command="userCommand">
<div class="user">
<el-avatar :size="36" :src="avatar"></el-avatar>
<el-avatar :size="36"
:src="avatar"></el-avatar>
<span class="username">{{userName}}</span>
</div>
<el-dropdown-menu slot="dropdown">
@ -39,139 +47,140 @@ import breadcrumb from '@/components/breadcrumb'
import Setting from '@/setting'
import Util from '@/libs/util'
export default {
data() {
return {
sites: [],
crumbRefresh: true,
inContent: false, //
sitePath: ['/page', '/column', '/article']
};
data () {
return {
sites: [],
crumbRefresh: true,
inContent: false, //
sitePath: ['/page', '/column', '/article']
};
},
components: {
breadcrumb
},
computed: {
...mapState('user', [
'avatar', 'userName', 'crumbs'
]),
...mapState('auth', [
'btns'
])
},
watch: {
crumbs () {
this.crumbRefresh = false
this.$nextTick(() => {
this.crumbRefresh = true
})
},
components: {
breadcrumb
'$route' () {
this.setContent()
}
},
mounted () {
this.btns.includes('/site/list') && this.getSite()
this.setContent()
},
methods: {
...mapActions("user", [
'logout'
]),
...mapMutations('content', [
'setSite'
]),
//
getSite () {
this.$post(this.api.site, {
page: 1,
limit: 1000,
siteName: ''
}).then(({ data }) => {
this.sites = Util.getSite(data.records)
}).catch(e => { })
},
computed: {
...mapState('user', [
'avatar', 'userName', 'crumbs'
]),
...mapState('auth', [
'btns'
])
//
setContent () {
const { path } = this.$route
this.inContent = !!this.sitePath.find(e => path.includes(e))
},
watch: {
crumbs() {
this.crumbRefresh = false
this.$nextTick(() => {
this.crumbRefresh = true
})
},
'$route'() {
this.setContent()
}
//
toIndex () {
const { site } = this.$store.state.content
window.open((Setting.isDev ? `http://${location.hostname}:8097/` : site.domainName) + `#/column?siteId=${site.id}`)
},
mounted() {
this.btns.includes('/site/list') && this.getSite()
this.setContent()
//
siteCommand (e) {
this.setSite(e)
this.$route.path === '/column/list' || this.$router.push('/column')
location.reload()
},
methods: {
...mapActions("user", [
'logout'
]),
...mapMutations('content', [
'setSite'
]),
//
getSite() {
this.$post(this.api.site, {
page: 1,
limit: 1000,
siteName: ''
}).then(({ data }) => {
this.sites = Util.getSite(data.records)
}).catch(e => {})
},
//
setContent() {
const { path } = this.$route
this.inContent = !!this.sitePath.find(e => path.includes(e))
},
//
toIndex() {
const { site } = this.$store.state.content
window.open((Setting.isDev ? `http://${location.hostname}:8095/` : site.domainName) + `#/column?siteId=${site.id}`)
},
//
siteCommand(e) {
this.setSite(e)
this.$route.path === '/column/list' || this.$router.push('/column')
location.reload()
},
//
userCommand(command) {
if (command == 'person') {
this.$router.push('/setting')
} else {
this.logout()
}
},
}
//
userCommand (command) {
if (command == 'person') {
this.$router.push('/setting')
} else {
this.logout()
}
},
}
};
</script>
<style lang="scss" scoped>
.header {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
height: 64px;
padding: 0 25px;
color: #333;
background-color: #fff;
box-shadow: 0px 1px 4px 0px rgba(0,21,41,0.1200);
.group {
display: inline-flex;
align-items: center;
span {
margin-left: 13px ;
font-size: 14px;
color: #333;
}
}
.cp {
cursor: pointer;
}
.user-tool {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}
.site, .user-wrap {
display: inline-flex;
align-items: center;
}
.site {
img {
margin-right: 4px;
}
}
.site-switch {
margin: 0 60px 0 54px;
height: 64px;
padding: 0 25px;
color: #333;
i {
color: #000;
background-color: #fff;
box-shadow: 0px 1px 4px 0px rgba(0, 21, 41, 0.12);
.group {
display: inline-flex;
align-items: center;
span {
margin-left: 13px;
font-size: 14px;
color: #333;
}
}
}
.user-wrap {
margin-left: 26px;
.user {
display: inline-flex;
align-items: center;
cursor: pointer;
.username {
margin-left: 8px;
.cp {
cursor: pointer;
}
.user-tool {
display: flex;
align-items: center;
}
.site,
.user-wrap {
display: inline-flex;
align-items: center;
}
.site {
img {
margin-right: 4px;
}
}
.site-switch {
margin: 0 60px 0 54px;
color: #333;
font-size: 14px;
}
i {
color: #000;
}
}
.user-wrap {
margin-left: 26px;
.user {
display: inline-flex;
align-items: center;
cursor: pointer;
.username {
margin-left: 8px;
color: #333;
font-size: 14px;
}
}
}
}
}
</style>

@ -25,231 +25,11 @@ export default {
component: () => import('@/pages/column/add'),
meta: { title: '添加栏目' }
},
{
name: `${pre}home`,
path: `home`,
component: () => import('@/pages/column/page/home'),
meta: { title: 'HOME' }
},
{
name: `${pre}about`,
path: `about`,
component: () => import('@/pages/column/page/about'),
meta: { title: 'ABOUT' }
},
{
name: `${pre}careers`,
path: `careers`,
component: () => import('@/pages/column/page/careers'),
meta: { title: 'CAREERS' }
},,
{
name: `${pre}edu`,
path: `edu`,
component: () => import('@/pages/column/page/edu'),
meta: { title: 'EDUCATION & COLLABORATION' }
},
{
name: `${pre}news`,
path: `news`,
component: () => import('@/pages/column/page/news'),
meta: { title: 'NEWS&Events' }
},
{
name: `${pre}newsPress`,
path: `newsPress`,
component: () => import('@/pages/column/page/newsPress'),
meta: { title: 'NEWS&Events-press room' }
},
{
name: `${pre}newsProcurement`,
path: `newsProcurement`,
component: () => import('@/pages/column/page/newsProcurement'),
meta: { title: 'NEWS&Events-procurement' }
},
{
name: `${pre}research`,
path: `research`,
component: () => import('@/pages/column/page/research'),
meta: { title: 'RESEARCH' }
},
{
name: `${pre}application`,
path: `application`,
component: () => import('@/pages/column/page/application'),
meta: { title: 'APPLICATION' }
},
{
name: `${pre}science`,
path: `science`,
component: () => import('@/pages/column/page/science'),
meta: { title: '科普之窗' }
},
{
name: `${pre}talent`,
path: `talent`,
component: () => import('@/pages/column/page/talent'),
meta: { title: '人才队伍' }
},
{
name: `${pre}userSharing`,
path: `userSharing`,
component: () => import('@/pages/column/page/userSharing'),
meta: { title: '用户共享' }
},
{
name: `${pre}exp`,
path: `exp`,
component: () => import('@/pages/column/page/exp'),
meta: { title: '装置介绍-实验站' }
},
{
name: `${pre}deviceIntroBeam`,
path: `deviceIntroBeam`,
component: () => import('@/pages/column/page/deviceIntroBeam'),
meta: { title: '装置介绍-光束线' }
},
{
name: `${pre}deviceIntroLayout`,
path: `deviceIntroLayout`,
component: () => import('@/pages/column/page/deviceIntroLayout'),
meta: { title: '装置介绍-整体布局' }
},
{
name: `${pre}deviceIntroLinear`,
path: `deviceIntroLinear`,
component: () => import('@/pages/column/page/deviceIntroLinear'),
meta: { title: '装置介绍-超导直线加速器' }
},
{
name: `${pre}overviewTrailer`,
path: `overviewTrailer`,
component: () => import('@/pages/column/page/overviewTrailer'),
meta: { title: '概况-宣传片' }
},
{
name: `${pre}overviewLocation`,
path: `overviewLocation`,
component: () => import('@/pages/column/page/overviewLocation'),
meta: { title: '概况-地理位置' }
},
{
name: `${pre}overviewSetup`,
path: `overviewSetup`,
component: () => import('@/pages/column/page/overviewSetup'),
meta: { title: '概况-机构设置' }
},
{
name: `${pre}overviewDevHistory`,
path: `overviewDevHistory`,
component: () => import('@/pages/column/page/overviewDevHistory'),
meta: { title: '概况-发展历程' }
},
{
name: `${pre}overviewIntro`,
path: `overviewIntro`,
component: () => import('@/pages/column/page/overviewIntro'),
meta: { title: '概况-介绍' }
},
{
name: `${pre}sfel`,
path: `sfel`,
component: () => import('@/pages/column/page/sfel'),
meta: { title: 'SFEL' }
},
{
path: `estate/index`,
component: () => import('@/pages/column/page/estate/index'),
meta: { title: '产业光源-首页' }
},
{
path: `estate/event`,
component: () => import('@/pages/column/page/estate/event'),
meta: { title: '产业光源-大事记' }
},
{
path: `estate/location`,
component: () => import('@/pages/column/page/estate/location'),
meta: { title: '产业光源-地理位置' }
},
{
path: `estate/orgSetup`,
component: () => import('@/pages/column/page/estate/orgSetup'),
meta: { title: '产业光源-机构设置' }
},
{
path: `estate/survey`,
component: () => import('@/pages/column/page/estate/survey'),
meta: { title: '产业光源-深圳产业光源' }
},
{
path: `talentCenter`,
component: () => import('@/pages/column/page/talentCenter'),
meta: { title: '人才中心' }
},
{
path: `governance`,
component: () => import('@/pages/column/page/governance'),
},
{
path: `org`,
component: () => import('@/pages/column/page/org'),
},
{
path: `devHistory`,
component: () => import('@/pages/column/page/devHistory'),
},
{
path: `overview`,
component: () => import('@/pages/column/page/overview'),
meta: { title: '概况' }
},
{
path: `mission`,
component: () => import('@/pages/column/page/mission'),
meta: { title: '关于IASF-使命愿景价值观' }
},
{
path: `scientific`,
component: () => import('@/pages/column/page/scientific'),
},
{
path: `industrial`,
component: () => import('@/pages/column/page/industrial'),
},
{
path: `researchTeam`,
component: () => import('@/pages/column/page/researchTeam'),
},
{
path: `speech`,
component: () => import('@/pages/column/page/speech'),
meta: { title: '关于IASF-院长致辞' }
},
{
path: `talentCentre`,
component: () => import('@/pages/column/page/talentCentre'),
meta: { title: '人才中心' }
},
{
path: `contactUs`,
component: () => import('@/pages/column/page/contactUs'),
meta: { title: '联系我们' }
},
{
path: `lightSources`,
component: () => import('@/pages/column/page/lightSources'),
meta: { title: '全球先进光源' }
},
{
path: `team`,
component: () => import('@/pages/column/page/team'),
meta: { title: '关于IASF-核心团队' }
},
{
path: `iasf`,
component: () => import('@/pages/column/page/iasf'),
meta: { title: 'IASF中文首页' }
},
// {
// name: `${pre}home`,
// path: `home`,
// component: () => import('@/pages/column/page/home'),
// meta: { title: 'HOME' }
// },
]
}

Loading…
Cancel
Save