|
|
@ -1,5 +1,5 @@ |
|
|
|
<template> |
|
|
|
<template> |
|
|
|
<div :class="['header', { channel: isHome }]"> |
|
|
|
<div :class="['header', { channel: isHome, estate: isEstate }]"> |
|
|
|
<a class="logo" @click="toIndex"> |
|
|
|
<a class="logo" @click="toIndex"> |
|
|
|
<template v-if="!$store.getters.getModelType"> |
|
|
|
<template v-if="!$store.getters.getModelType"> |
|
|
|
<img :src="require('@/assets/images/logo-black.png')" alt=""> |
|
|
|
<img :src="require('@/assets/images/logo-black.png')" alt=""> |
|
|
@ -11,7 +11,7 @@ |
|
|
|
</a> |
|
|
|
</a> |
|
|
|
<!-- pc端 --> |
|
|
|
<!-- pc端 --> |
|
|
|
<template v-if="$store.getters.getModelType"> |
|
|
|
<template v-if="$store.getters.getModelType"> |
|
|
|
<navbar ref="nav" :isHome.sync="isHome"></navbar> |
|
|
|
<navbar ref="nav" :isHome.sync="isHome" :isEstate.sync="isEstate"></navbar> |
|
|
|
<div class="tools"> |
|
|
|
<div class="tools"> |
|
|
|
<img class="search" :src="require('@/assets/images/search' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleSearch"> |
|
|
|
<img class="search" :src="require('@/assets/images/search' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleSearch"> |
|
|
|
<img :src="require('@/assets/images/cn' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleLang"> |
|
|
|
<img :src="require('@/assets/images/cn' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleLang"> |
|
|
@ -42,12 +42,14 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
<script> |
|
|
|
<script> |
|
|
|
|
|
|
|
import Util from '@/libs/util' |
|
|
|
import { mapMutations } from 'vuex' |
|
|
|
import { mapMutations } from 'vuex' |
|
|
|
import navbar from '../navbar' |
|
|
|
import navbar from '../navbar' |
|
|
|
export default { |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
return { |
|
|
|
isHome: this.$route.path === '/home' || this.$route.path === '/sfel', |
|
|
|
isHome: true, |
|
|
|
|
|
|
|
isEstate: false, |
|
|
|
showSearch: false, |
|
|
|
showSearch: false, |
|
|
|
title: '', |
|
|
|
title: '', |
|
|
|
searchTimer: null, |
|
|
|
searchTimer: null, |
|
|
@ -63,9 +65,14 @@ export default { |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
watch: { |
|
|
|
watch: { |
|
|
|
'$route'() { |
|
|
|
'$route.path': { |
|
|
|
this.isHome = this.$route.path === '/home' || this.$route.path === '/sfel' |
|
|
|
handler() { |
|
|
|
|
|
|
|
this.isHome = Util.isIndex() |
|
|
|
|
|
|
|
this.isEstate = this.$route.path === '/estate/index' |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
deep: true, |
|
|
|
|
|
|
|
immediate: true |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
beforeDestroy () { |
|
|
|
beforeDestroy () { |
|
|
|
window.removeEventListener('scroll', this.handleScroll) |
|
|
|
window.removeEventListener('scroll', this.handleScroll) |
|
|
@ -86,10 +93,11 @@ export default { |
|
|
|
}, |
|
|
|
}, |
|
|
|
// 获取页面滚动距离(home长页专用) |
|
|
|
// 获取页面滚动距离(home长页专用) |
|
|
|
handleScroll () { |
|
|
|
handleScroll () { |
|
|
|
if (this.$route.path === '/home' || this.$route.path === '/sfel') { |
|
|
|
if (Util.isIndex()) { |
|
|
|
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop |
|
|
|
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop |
|
|
|
if (this.isHome == scrollTop > 907) { |
|
|
|
if (this.isHome == scrollTop > 907) { |
|
|
|
this.isHome = !(scrollTop > 907) |
|
|
|
this.isHome = !(scrollTop > 907) |
|
|
|
|
|
|
|
this.isEstate = !(scrollTop > 907) && this.$route.path === '/estate/index' |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
@ -143,6 +151,9 @@ $height: 90px; |
|
|
|
background-color: #fff; |
|
|
|
background-color: #fff; |
|
|
|
border-bottom: 1px solid #f7f7f7; |
|
|
|
border-bottom: 1px solid #f7f7f7; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
&.estate { |
|
|
|
|
|
|
|
background-color: rgba(0, 0, 0, .15); |
|
|
|
|
|
|
|
} |
|
|
|
.logo{ |
|
|
|
.logo{ |
|
|
|
position: absolute; |
|
|
|
position: absolute; |
|
|
|
top: 0; |
|
|
|
top: 0; |
|
|
|