<template>
  <div class="nav-bgcolor">
    <div class="auto">
      <tools-page  :need-back="!isMenu" :title="titleName" @back="back('返回')" @paperinfo="paperinfo" > </tools-page>
      <p style="height: 45px"></p>
      <div v-show="isMenu">
        <img src="../../assets/高密公告.png" style="width: 100%;height: 200px;border-radius:5%;padding: 1%">
        <scroller :lists="list" class="scrollContainer" ></scroller>
      </div>
      <div class="row">
        <route v-ref:route> </route>
      </div>
    </div>
  </div>

</template>

<script scoped>

import  * as Util from '../../Util'
export default {
  title: '99999',
  data () {
    return {
      usercenter:{fige:true},
      list: ["豪佳燃气欢迎您","豪佳燃气欢迎您","豪佳燃气欢迎您","豪佳燃气欢迎您"],
      titleName:'主界面',
      isMenu:true,
      tabs: Util.f.functions,
      text: '导航组件this',
      beforeName:'主界面',
      beforetabs:[],
      backthis:'',
      safe:false,
      systemsetup:'',
      isTrue:false,
      iftabbar:''
    }
  },
  ready () {
     this.$refs.route.init('nav-bottom')
  },
  methods: {
    imgback(val){
      return require('../../assets/'+val+'竖屏3.png')
    },
    back(flag){
      if(this.safe && flag == '返回' ){
        this.$showMessage('此返回所录入内容将无法找回！', ['confirm', 'cancel']).then((res) => {
          if (res === 'confirm') {
            this.safe = false
            this.delback()
            this.backthis.$back()
          }
        })
      }else{
        this.delback()
        this.safe = false
        this.backthis.$back()
      }
    },
    paperinfo(param){
      // this.$dispatch('usercenter')
       console.log('systemSetup的值 = '+param)
      // //this.gotopage(param,'个人中心')
      // //this.$refs.route.gotopage(param,'个人中心')
      this.systemsetup=param
      this.isTrue=!this.isTrue

    },
    delback(){
      // 先确认出 前一个组件的名字
      var title = this.beforeName
      var beforetitle = '主界面'
      var j = -1
      for(var i = 0;i<this.beforetabs.length;i++){
        if(this.beforetabs[i].titleName == title){
          beforetitle = this.beforetabs[i].beforeName
          this.backthis =this.beforetabs[i].backthis
          this.safe  = this.beforetabs[i].safe
          j = i
          break;
        }
      }
      this.beforetabs.splice(j + 1, 1)
      this.beforeName = beforetitle
      this.titleName = title
      // 判断是否 显示底层导航
      if(this.iftabbar ==  this.titleName){
        this.isMenu = true
      }
    },
    gotopage(param,title) {
      if(title == '退出系统'){
        this.$showMessage('即将返回登陆界面！', ['confirm', 'cancel']).then((res) => {
          if (res === 'confirm') {
            this.$androidUtil.setPreference('f_repairman_id', 'x')
            this.$androidUtil.setPreference('f_repairman_name', 'x')
            this.$back()
          }
        })
      }else{
        this.isMenu=false
        if(this.beforeName == title){
          return
        }
        this.titleName = title
        this.beforeName = title
        let data = {
          sourcet: '竖屏'
        }
        if(title == '待办工单'){
          param = param+'V'
        }
        this.$refs.route.init(param,data)
        // if (param !== 'text-chat-pane') {
        //   this.notified('false')
        // } else {
        //   this.notified('true')
        // }
      }
    },
    mute () {
      HostApp.mute()
    }
  },
  events: {
    'usercenter': function () {
      this.usercenter.fige = false
    },
    'gotoson': function (prpdata) {
      // 事件回调内的 `this` 自动绑定到注册它的实例上
      // safe 返回事件是否进行判断后再返回
      // 每进入一次，beforetabs 数组添加  返回  删除
      this.backthis = prpdata._this
      this.safe = prpdata.safe
      this.isMenu = false
      // 记录本次跳转
      var beforedata = {
        beforeName: this.titleName,
        titleName: prpdata.title,
        backthis:prpdata._this,
        safe:prpdata.safe
      }
      this.beforetabs.push(beforedata)
      if( this.beforetabs.length == 1){
        this.iftabbar = beforedata.beforeName
      }
      // 写入跳转后 前后组件名字
      this.beforeName = this.titleName
      this.titleName = prpdata.title

      console.log('进入子组件，通知外层组件，我已经进入')
    },
    'confirm': function () {
      // 提交处理返回事件
      this.back('提交')
    },
    'backarrdel': function () {
      this.delback()
    },
    'gologin': function () {
      this.beforetabs = []
      this.$back()
    }
  }
}
</script>
<style lang="less">
.tab-befor-img  {
  content: '';
  background-size: 30px;
  display: inline-block;
  margin-right: 8px;
  height: 30px;
  width: 30px;
  vertical-align: -35%;
}
.manbiankuang{
  width: 44%;
  margin-top: 15px;
  margin-left: 4%;
  border:1px solid #e3e3e3;
  border-radius:10px 10px 10px 10px;
  text-align: center;
  background-color: #ffffff;
}
.navimagesfoot{
  font-size: 14px;
  color: #666666;
  /*    font-family: "Pingfhs";*/
}
.nav-bgcolor{
  background-color: #f0f0ef;
}
img[src=""],img:not([src]){
  opacity: 0;
  border:none;
  visibility: hidden;
  max-width: none;
}
/* .repair-mute-class {
   &::before {
     .tab-befor-img("../../assets/guanbishengyin.png")
   }
 }*/
.butt {margin-left: 20%;  margin-right: 20%;  margin-top: 15%;  height: 20%;  width: 20%;  border-radius: 5%;  text-align: center;align-items:center;}
.butt div.content {line-height:320%;  height: 100%;  font-size: 48px;  color: white;  text-align:center;}
.butt span{ width: 100%;  font-size: 48px;  color: white;  text-align: center;}
</style>
