<template>
  <section>
    <header><span class="fxcol">首页</span></header>
    <section class="content" style="margin-bottom: 0">
      <div class="userInfo">
        <div class="fxcol">
          <p class="p1">{{$store.getters.userInfo !== '' ? JSON.parse($store.getters.userInfo).nick_name : ''}}</p>
          <p class="p2">欢迎进入永裕手持系统！</p>
        </div>
        <div class="exit" @click="Quit">
          <i class="icon-exit"></i>
          <span class="exit-text">退出</span>
        </div>
      </div>
    </section>
    <div class="con">
      <ul>
        <li v-for="e in menuList" :key="e.menu_id" @click="toPage(e)">{{e.name}}</li>
        <!-- <li @click="goInner('/TaskManage')">任务管理</li>
        <li @click="goInner('/ZlManage')">指令管理</li>
        <li @click="goInner('/Password')">修改密码</li>
        <li @click="goInner('/SendMater')">送料</li>
        <li @click="goInner('/EquipCallMater')">设备叫料</li>
        <li @click="goInner('/SendEmptyPallet')">送空托盘</li>
        <li @click="goInner('/CallEmptyPallet')">呼叫空托盘</li>
        <li @click="goInner('/BindPalletPoint')">托盘点位绑定</li>
        <li @click="goInner('/CheckManage')">盘点管理</li>
        <li @click="goInner('/ConveyorLine')">入窑输送线规则</li>
        <li @click="goInner('/BindMaterPoint')">托盘物料绑定</li> -->
      </ul>
    </div>
  </section>
</template>

<script>
import {authority} from '@config/getData2.js'
export default {
  name: 'Home',
  data () {
    return {
      menuList: [],
      show: false,
      secM: []
    }
  },
  mounted () {
    document.getElementsByTagName('body')[0].className = 'bgwhite'
    this.$store.dispatch('receiveMaterObj', {})
  },
  created () {
    this._authority()
  },
  methods: {
    toPage (e) {
      let name = e.path.substr(2)
      if (name === 'CheckManage' || name === 'ConveyorLine') {
        this.$store.dispatch('setKeepAlive', [name])
      }
      this.$router.push(e.path.substr(2))
    },
    /** 获取菜单 */
    async _authority () {
      let accountId = this.$store.getters.userInfo !== '' ? JSON.parse(this.$store.getters.userInfo).account_id : ''
      let res = await authority(accountId)
      if (res.code === '1') {
        this.menuList = [...res.result.sonTree]
      } else {
        this.Dialog(res.desc)
      }
    },
    Quit () {
      this.$store.dispatch('setSignOut')
      this.$router.push('/login')
    },
    goInner (path) {
      let name = path.substr(1)
      if (name === 'CheckManage') {
        this.$store.dispatch('setKeepAlive', [name])
      }
      this.$router.push(path)
    }
  }
}
</script>

<style lang="stylus" scoped>
@import '~@style/mixin'
>>>header
  background-color #ffffff
  span
    color #444444
.userInfo
  _fj()
  padding .46rem .31rem .41rem .31rem
  background-color $red
  _bis('../../images/bg2.png',auto,100%,right,bottom)
  border-radius: .08rem
  color #fff
  align-items center
.p1
  _font(.34rem,1,#fff)
  padding-bottom .18rem
.p2
  _font(.26rem,1,#fff)
.exit
  flex 0 0 1.2rem
  _fj()
  height .47rem
  padding 0 .15rem
  border 1px solid #FF967C
  border-radius .235rem
.icon-exit
  flex 0 0 .22rem
  height .22rem
  _bis('../../images/exit.png',.22rem)
.exit-text
  flex 1
  _font(.24rem,.47rem,#fff,,right)
.con
  display flex
  font-size .3rem
  text-align center
  justify-content center
  align-items flex-start
  height 6rem
  ul
    width 7rem
    li
      color #e74f1a
      width 1.9rem
      height 1.2rem
      line-height 1.2rem
      float left
      font-size 0.26rem
      margin 0.2rem
      border 1px solid #e74f1a
      border-radius 5px
</style>
