<template>
  <div class="more">
    <div class="head"></div>
    <div class="main" ref="main" @scroll="scroll">
      <MorePanel title="常用功能">
        <div class="item" @click="jumpPage('qddk')" v-if="false">
          <img src="@/assets/mobile/more/qddk.png" />
          <span>签到打卡</span>
        </div>
        <div class="item" @click="jumpPage('gcxc')" v-if="false">
          <img src="@/assets/mobile/more/gcxc.png" />
          <span>工程巡查</span>
        </div>
        <div class="item" @click="jumpPage('jrrw')" v-if="false">
          <img src="@/assets/mobile/more/jrrw.png" />
          <span>今日任务</span>
        </div>
        <div class="item" @click="jumpPage('spjk')" v-if="false">
          <img src="@/assets/mobile/more/spjk.png" />
          <span>视频监控</span>
        </div>
        <div class="item" @click="jumpPage('fxwz')" v-if="false">
          <img src="@/assets/mobile/more/fxwz.png" />
          <span>防汛物资</span>
        </div>
        <div class="item" @click="jumpPage('syx')" v-if="false">
          <img src="@/assets/mobile/more/syx.png" />
          <span>试运行</span>
        </div>
        <div class="item" @click="jumpPage('xctz')">
          <img src="@/assets/mobile/more/xctz.png" />
          <span>巡查台账</span>
        </div>
        <div class="item" @click="jumpPage('jctz')">
          <img src="@/assets/mobile/more/jctz.png" />
          <span>检查台账</span>
        </div>
      </MorePanel>
      <MorePanel title="水库信息">
        <div class="item" @click="jumpPage('skjs')">
          <img src="@/assets/mobile/more/skjs.png" />
          <span>水库介绍</span>
        </div>
        <div class="item" @click="jumpPage('dbBIM')" v-if="false">
          <img src="@/assets/mobile/more/dbBIM.png" />
          <span>大坝BIM</span>
        </div>
        <div class="item" @click="jumpPage('sygq')" v-if="false">
          <img src="@/assets/mobile/more/sygq.png" />
          <span>水雨工情</span>
        </div>
        <div class="item" @click="jumpPage('sbxx')">
          <img src="@/assets/mobile/more/sbxx.png" />
          <span>设备信息</span>
        </div>
        <div class="item" @click="jumpPage('glzd')">
          <img src="@/assets/mobile/more/glzd.png" />
          <span>管理制度</span>
        </div>
        <div class="item" @click="jumpPage('ryxx')">
          <img src="@/assets/mobile/more/ryxx.png" />
          <span>人员信息</span>
        </div>
        <div class="item" @click="jumpPage('jypx')">
          <img src="@/assets/mobile/more/jypx.png" />
          <span>教育培训</span>
        </div>
        <div class="item" @click="jumpPage('dzda')">
          <img src="@/assets/mobile/more/dzda.png" />
          <span>电子档案</span>
        </div>
        <div class="item" @click="jumpPage('zzda')">
          <img src="@/assets/mobile/more/zzda.png" />
          <span>纸质档案</span>
        </div>
      </MorePanel>
      <MorePanel title="调度数据">
        <div class="item" @click="jumpPage('ddqk')">
          <img src="@/assets/mobile/more/ddqk.png" />
          <span>调度情况</span>
        </div>
        <div class="item" @click="jumpPage('ssgq')">
          <img src="@/assets/mobile/more/ssgq.png" />
          <span>实时工情</span>
        </div>
        <div class="item" @click="jumpPage('gsgl')">
          <img src="@/assets/mobile/more/gsgl.png" />
          <span>供水管理</span>
        </div>
        <div class="item" @click="jumpPage('kyjh')">
          <img src="@/assets/mobile/more/kyjh.png" />
          <span>控运计划</span>
        </div>
        <div class="item" @click="jumpPage('zmcz')">
          <img src="@/assets/mobile/more/zmcz.png" />
          <span>闸门操作</span>
        </div>
      </MorePanel>
      <MorePanel title="大坝安全">
        <div class="item" @click="jumpPage('dbjc')">
          <img src="@/assets/mobile/more/dbjc.png" />
          <span>大坝监测</span>
        </div>
        <div class="item" @click="jumpPage('yjtx')">
          <img src="@/assets/mobile/more/yjtx.png" />
          <span>预警提醒</span>
        </div>
      </MorePanel>
      <MorePanel title="应急管理">
        <div class="item" @click="jumpPage('yjya')">
          <img src="@/assets/mobile/more/yjya.png" />
          <span>应急预案</span>
        </div>
        <div class="item" @click="jumpPage('yjyl')">
          <img src="@/assets/mobile/more/yjyl.png" />
          <span>应急演练</span>
        </div>
        <div class="item" @click="jumpPage('xqxx')">
          <img src="@/assets/mobile/more/xqxx.png" />
          <span>险情信息</span>
        </div>
        <div class="item" @click="jumpPage('yjxy')">
          <img src="@/assets/mobile/more/yjxy.png" />
          <span>应急响应</span>
        </div>
      </MorePanel>
      <MorePanel title="维修养护">
        <div class="item" @click="jumpPage('wyzj')">
          <img src="@/assets/mobile/more/wyzj.png" />
          <span>维养资金</span>
        </div>
        <div class="item" @click="jumpPage('wyjh')">
          <img src="@/assets/mobile/more/wyjh.png" />
          <span>维养计划</span>
        </div>
        <div class="item" @click="jumpPage('wsbj')" v-if="false">
          <img src="@/assets/mobile/more/wsbj.png" />
          <span>卫生保洁</span>
        </div>
        <div class="item" @click="jumpPage('zhxm')" v-if="false">
          <img src="@/assets/mobile/more/zhxm.png" />
          <span>综合项目</span>
        </div>
        <div class="item" @click="jumpPage('zxxm')" v-if="false">
          <img src="@/assets/mobile/more/zxxm.png" />
          <span>专项项目</span>
        </div>
        <div class="item" @click="jumpPage('lhyh')" v-if="false">
          <img src="@/assets/mobile/more/lhyh.png" />
          <span>绿化养护</span>
        </div>
        <div class="item" @click="jumpPage('jsjg')" v-if="false">
          <img src="@/assets/mobile/more/jsjg.png" />
          <span>金属结构</span>
        </div>
        <div class="item" @click="jumpPage('jdsb')" v-if="false">
          <img src="@/assets/mobile/more/jdsb.png" />
          <span>机电设备</span>
        </div>
        <div class="item" @click="jumpPage('tj')" v-if="false">
          <img src="@/assets/mobile/more/tj.png" />
          <span>土建</span>
        </div>
        <div class="item" @click="jumpPage('wyhgl')">
          <img src="@/assets/mobile/more/wyhgl.png" />
          <span>物业化管理</span>
        </div>
      </MorePanel>
      <MorePanel title="统计分析">
        <div class="item" @click="jumpPage('xcjl')">
          <img src="@/assets/mobile/more/xcjl.png" />
          <span>巡查记录</span>
        </div>
        <div class="item" @click="jumpPage('bzxj')">
          <img src="@/assets/mobile/more/bzxj.png" />
          <span>班组巡检</span>
        </div>
        <div class="item" @click="jumpPage('xctj')">
          <img src="@/assets/mobile/more/xctj.png" />
          <span>巡查统计</span>
        </div>
        <div class="item" @click="jumpPage('xcdw')">
          <img src="@/assets/mobile/more/xcdw.png" />
          <span>巡查点位</span>
        </div>
      </MorePanel>
    </div>
  </div>
</template>

<script>
import MorePanel from './components/panel'
export default {
  name: 'More',
  components: {
    MorePanel
  },
  activated () {
    this.$refs.main.scrollTop = this.$store.state.mobile.scrollTop
  },
  data () {
    return {
      timer: 0
    }
  },
  methods: {
    scroll () {
      this.timer && clearTimeout(this.timer)
      this.timer = setTimeout(() => {
        this.$store.commit('mobile/setScrollTop', this.$refs.main.scrollTop)
      }, 50)
    },
    // 跳转页面
    jumpPage (str) {
      this.$store.commit('mobile/setScrollTop', this.$refs.main.scrollTop)
      switch (str) {
        // 实时工情
        case 'ssgq':
          window.location.href = './h5/index.html#/pages/ssgq/index'
          break
        // 调度管理
        case 'ddqk':
          window.location.href = './h5/index.html#/pages/ddgl/index'
          break
        // 设备管理 / 设备信息
        case 'sbxx':
          window.location.href = './h5/index.html#/pages/sbgl/index'
          break
        // 维养资金
        case 'wyzj':
          window.location.href = './h5/index.html#/pages/wyzj/index'
          break
        // 供水管理
        case 'gsgl':
          window.location.href = './h5/index.html#/pages/gsgl/index'
          break
        // 应急预案
        case 'yjya':
          window.location.href = './h5/index.html#/pages/yjya/index'
          break
        // 应急演练
        case 'yjyl':
          window.location.href = './h5/index.html#/pages/yjyl/index'
          break
        // 预警提醒
        case 'yjtx':
          window.location.href = './h5/index.html#/pages/yjtx/index'
          // this.$router.push('/mobile-terminal/yjtx')
          break
        // 大坝监测
        case 'dbjc':
          //  window.location.href = './h5/index.html#/pages/dbaqjc/index'
          this.$router.push('/mobile-terminal/dacj')
          break
        // 巡查台账
        case 'xctz':
          window.location.href = './h5/index.html#/pages/xctz/index'
          break
        // 水库介绍
        case 'skjs':
          window.location.href = './h5/index.html#/pages/skjs/index'
          break
        // 制度管理
        case 'glzd':
          window.location.href = './h5/index.html#/pages/zdgl/index'
          break
        // 人员信息
        case 'ryxx':
          window.location.href = './h5/index.html#/pages/ryxx/index'
          break
        // 教育培训
        case 'jypx':
          window.location.href = './h5/index.html#/pages/jypx/index'
          break
        // 电子档案
        case 'dzda':
          window.location.href = './h5/index.html#/pages/dzda/index'
          break
        // 纸质档案
        case 'zzda':
          window.location.href = './h5/index.html#/pages/zzda/index'
          break
        // 控运计划
        case 'kyjh':
          window.location.href = './h5/index.html#/pages/kyjh/index'
          break
        // 险情信息
        case 'xqxx':
          window.location.href = './h5/index.html#/pages/xqxx/index'
          break
        // 应急响应
        case 'yjxy':
          window.location.href = './h5/index.html#/pages/yjxy/index'
          break
        // 维养计划
        case 'wyjh':
          window.location.href = './h5/index.html#/pages/wyjh/index'
          break
        // 检查台账
        case 'jctz':
          window.location.href = './h5/index.html#/pages/jctz/index'
          break
        // 闸门操作
        case 'zmcz':
          window.location.href = './h5/index.html#/pages/zmcz/index'
          break
        // 物业化管理
        case 'wyhgl':
          window.location.href = './h5/index.html#/pages/wyhgl/index'
          break
        default:
          this.$message('开发中')
          break
      }
    }
  }

}
</script>

<style lang="scss" scoped>
.more {
  width: 100%;
  height: 100%;
  background-color: #f7f7f7;
  .head {
    height: 76px;
    background: url("~@/assets/mobile/more_head.png") no-repeat top center /
      cover;
  }
  .main {
    height: 541px;
    padding: 3px 14px 20px;
    overflow: auto;
  }
}
</style>
