<template>
  <div class="index-container">
    <!--标题-->
    <mt-header class="header" title="关于我们" fixed>
      <div slot="left">
        <mt-button icon="back" @click="$router.back(-1)"></mt-button>
      </div>
    </mt-header>
    <div class="listbody">
      <div class="logo-div">
        <img src="@/assets/image/logo.png">
      </div>
      <div class="logo-name">
        智能闸井管理助手
      </div>
      <div class="content-body">
        <p>版本信息 : {{version}}</p>
        <p>客服电话 : <a :href="telTelephone">{{telephone}}</a></p>
      </div>
    </div>
  </div>
</template>

<script>
  import { MyLocalStorage } from 'assets/js/utils'
  import { LOGIN_FLAG, AD_FLAG, SLIDER_FLAG, USER_ACCOUNT, USER_PWD } from 'assets/js/storageConst'

  export default {
    name: "AboutUs",
    data(){
      return {
        telephone:'010-68387447',
        version:'V 1.0.0'
      }
    },
    computed:{
      telTelephone(){
        return 'tel:'+this.telephone
      }
    },
    methods:{
      loginOut () {
        this.$store.dispatch('LogOut').then(() => {
          MyLocalStorage.Cache.remove(AD_FLAG)
          MyLocalStorage.Cache.remove(LOGIN_FLAG)
          MyLocalStorage.Cache.remove(USER_ACCOUNT)
          MyLocalStorage.Cache.remove(USER_PWD)
          location.reload() // 为了重新实例化vue-router对象 避免bug
        })
      }
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  .mint-cell-title {
    margin-left: 5px !important
  }
  .listbody{
    padding:1rem
    background-color white
    margin-top 40px
    height calc( 100vh - 40px )
    overflow scroll
    .logo-div{
      margin-top 20%
      text-align center
      img{
        width 60px
        height 60px
        margin 0 auto
      }
    }
    .logo-name{
      margin-top 20px
      text-align center
      font-weight bold
    }
    .content-body{
      margin 1rem
      margin-top 5rem
      line-height 1.5rem
      text-align center
    }
  }
</style>