FE_huoran_client/src/layouts/home/index.vue

<template>
  <div :class="['main', { channel: isHome, 'site-en': handleClass() }]">
    <v-head ref="header"></v-head>
    <div class="layout">
      <transition name="move"
                  mode="out-in">
        <router-view class="view"></router-view>
      </transition>
      <el-backtop target=".layout"></el-backtop>
      <v-footer ref="footer"></v-footer>
    </div>
  </div>
</template>

<script>
import Util from '@/libs/util'
import Setting from '@/setting'
import vHead from '../header'
import vFooter from '../footer'
import { mapMutations } from 'vuex'
export default {
  data () {
    return {
      enSite: [1, 4, 6] // 英文站点id
    };
  },
  components: {
    vHead,
    vFooter
  },
  computed: {
    isHome () {
      return Util.isIndex()
    },
  },
  mounted () {
    this.$route.query.siteId && this.setSite(this.$route.query.siteId)
    document.body.onclick = e => {
      e.stopPropagation()
      this.$refs.header.showSearch = false
    }

    // seo信息
    this.$get(this.api.seoList, {
      siteId: +this.$route.query.siteId || this.$store.state.content.site
    }).then(({ data }) => {
      if (data.length) {
        document.querySelector('meta[name="keywords"]').setAttribute('content', data[0].keyword)
        document.querySelector('meta[name="description"]').setAttribute('content', data[0].description)
        document.querySelector('title').innerHTML = data[0].title
      }
    }).catch(err => { })
  },
  methods: {
    ...mapMutations('content', [
      'setSite'
    ]),
    handleClass () {
      return this.enSite.includes(+this.$route.query.siteId || this.$store.state.content.site)
    },
    // 长时间未操作,自动退出登录
    autoLogout () {
      let lastTime = new Date().getTime();
      document.onmousedown = () => {
        lastTime = new Date().getTime();
      };

      setInterval(() => {
        if (Util.local.get(Setting.tokenKey) && (new Date().getTime() - lastTime) > Setting.autoLogoutTime) {
          Util.errorMsg("用户登录过期，请重新登录");
          setTimeout(this.logout, 1500);
        }
      }, 1000);
    }
  }
};
</script>
<style lang="scss" scoped>
.main {
    min-width: 1050px;
}
.main:not(.channel) {
    min-height: calc(100% - 90px);
    .layout {
        padding-top: 90px;
    }
}
</style>