<template>
  <div class="auto">
    <div style="text-align:center">欢迎</div>
    <div style="text-align:center">
      <span>{{orgCrumb}}</span>
      <img src="../../assets/mute.png" width="32" height="32" @click="mute"></img>
    </div>
    <route :comp="{name: 'void-page'}" name="repairman-router"></route>
    <footer class="navbar-default navbar-fixed-bottom">
    <div class="container-fluid">
      <table width="100%" height="30px">
        <tr>
          <td @click="go2('phone-state', 'repair')">维修员状态<td>
          <td @click="go2('repair-area-list')">维修单<td>
          <td @click="go2('system-setting')">系统设置<td>
          <td @click="go2('check-notice')">通知公告<td>
          <td @click="go2('phone-book')">通讯录<td>
        </tr>
      </table>
    </div>
    </footer>
  </div>
</template>

<script>
import Vue from 'vue'

export default {
  title: '维修员界面',
  data() {
    return {
      orgs : Vue.orgs
    }
  },
  computed: {
    orgCrumb: function() {
      let oc = []
      if(this.orgs) {
        this.orgs.filter((item) => {
          return item.level != 5
        }).forEach(function(org) {
            oc.push(org.name)
        })
      }
      return oc.join('--')
    }
  },
  ready() {
    this.go2('phone-state', 'repair')
  },
  methods: {
    go2: function(widget, param) {
      this.$goto(widget, {role: param}, 'repairman-router')
    },
    mute: function() {
      HostApp.mute()
    },
  },
}
</script>
