<template lang="html">
  <div id="login" style="height:100%;">
    <x-header
      :left-options="{showBack: false}"
      :title="title">
    </x-header>
    <router-view style="margin-top: 3rem"></router-view>
  </div>
</template>

<script>
import { XHeader } from 'vux'
import { mapState } from 'vuex'
export default {
  components: { XHeader },
  data () {
    return {
      isIndex: true,
      showMore: true
    }
  },
  computed: {
    ...mapState({
      title: state => state.title
    })
  },
  watch: {
    $route: 'fetchData'
  },
  mounted () {
  },
  methods: {
    fetchData () {
      if (this.$route.meta.isIndex) {
        this.isIndex = true
      } else {
        this.isIndex = false
      }
    }
  }
}
</script>

<style lang="less">
  @import '~vux/src/styles/reset.less';
  @import '~vux/src/styles/1px.less';
  @import '~vux/src/styles/close.less';
  html, body {
    font-family: '微软雅黑', Microsoft YaHei;
    height: 100%;
    width: 100%;
    overflow-x: hidden;
    background-color: #F0EFF5;
    #login {
      .vux-header {
        width: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 100;
        background: #333;
        .vux-header-title {
          color: #fff;
        }
      }
    }
  }
</style>