<template>
    <div class="index-container">
      <!--标题-->
      <mt-header class="header" title="个人资料">
        <div slot="left">
          <mt-button icon="back" @click="$router.back(-1)"></mt-button>
        </div>
      </mt-header>
      <div class="listbody">
        <mt-cell title="用户名" :value="username"></mt-cell>
        <mt-cell title="真实姓名" :value="name"></mt-cell>
        <mt-cell title="所属部门" :value="deptName"></mt-cell>
        <mt-cell title="手机号" :value="phone"></mt-cell>
        <mt-cell title="修改密码" is-link to="/resetPwd"></mt-cell>
      </div>
      <div class="logout-div">
        <mt-button type="primary" @click="loginOut">退出登录</mt-button>
      </div>
    </div>
</template>

<script>
  import { MyLocalStorage } from 'assets/js/utils'
  import { LOGIN_FLAG, AD_FLAG, SLIDER_FLAG, USER_ACCOUNT, USER_PWD, TOKEN } from 'assets/js/storageConst'
  import { RSAencrypt } from '@/utils/security'
  import { Toast} from 'mint-ui'

  export default {
    name: "Information",
    data(){
      return {
        username: this.$store.getters.username,
        name: this.$store.getters.name,
        deptName: this.$store.getters.deptName,
        phone: this.$store.getters.phone
      }
    },
    methods:{
      loginOut () {
        this.$store.dispatch('LogOut').then(() => {
          MyLocalStorage.Cache.remove(TOKEN)
          MyLocalStorage.Cache.remove(USER_ACCOUNT)
          MyLocalStorage.Cache.remove(USER_PWD)
          MyLocalStorage.Cache.remove(AD_FLAG)
          MyLocalStorage.Cache.remove(LOGIN_FLAG)
          MyLocalStorage.Cache.remove(SLIDER_FLAG)
          Toast('登出成功')
          this.$router.push({name: 'login'})
        })
      }
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  .mint-cell-title {
    margin-left: 5px !important
  }
  .logout-div{
    position: fixed
    bottom:5px
    .mint-button{
      width 98vw
      margin:1vw
      background-color #1d55c6
    }
  }
</style>