<template>
  <div class="left">
    <a href="javascript: void(0);" @click="goCenter(1)">
      <img src="@/assets/images/link1.png" alt="">
    </a>
    <a href="javascript: void(0);" @click="goCenter(3)">
      <img src="@/assets/images/link2.png" alt="">
    </a>
    <a href="javascript: void(0);" @click="goCenter(4)">
      <img src="@/assets/images/link3.png" alt="">
    </a>
    <a href="javascript: void(0);" @click="goCenter(5)">
      <img src="@/assets/images/link4.png" alt="">
    </a>
  </div>
</template>

<script>
export default {
    name: '',
    components: {},
    data () {
        return {
          token: window.sessionStorage.getItem('token'),
        }
    },
    methods: {
      goCenter: function (tab) {
        var self = this
        if (this.token) {
          this.$router.push({path: '/center', query:{tab: tab}})
        } else {
          this.$layer.msg('请先登录')
          setTimeout(function () {
            self.$router.push('/login')
          }, 1500)
        }
      }
    },
    mounted: function () {}
}
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
.left
  overflow hidden
  margin 30px 0
  a
    display block
    margin-bottom 5px
    float left
    width 285px
    margin-right 20px
    &:last-child
      margin-right 0
    img
      width 100%
</style>
