<template>
    <div class="order-wraper">
        <div class="search-confirm-wrap">
            <div class="search-wrap">
                <div class="search-item_3">
                    <button class="button button--primary" @click="_devicemaintenancemstByuser">查询</button>
                    <button class="button button--primary" :class="{'button--defalut': pkId === ''}" @click="toDetail">查看明细</button>
                </div>
            </div>
        </div>
        <div class="grid_wraper" v-infinite-scroll="loadMore" infinite-scroll-disabled="busy" infinite-scroll-distance="0" infinite-scroll-immediate-check="false">
            <table class="filter-table">
                <thead>
                    <tr>
                        <th>序号</th>
                        <th>设备号</th>
                        <th>单据编码</th>
                        <th>单据状态</th>
                        <th>计划开始时间</th>
                        <th>单据类型</th>
                        <th>操作人</th>
                        <th>创建人</th>
                        <th>创建时间</th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="(e, i) in dataList" :key="i" :class="{'selected_icon': pkId === e.repair_id}" @click="toRadio(e)">
                        <td>{{ i+1 }}</td>
                        <td>{{e.device_code}}</td>
                        <td>{{e.repair_code}}</td>
                        <td>{{ e.invstatus === '99' ? '完毕' : ['生成', '提交', '开始', '结束'][Number(e.invstatus) - 1] }}</td>
                        <td>{{e.plan_start_date}}</td>
                        <td>{{ ['计划', '临时'][Number(e.maintenancecycle) - 1] }}</td>
                        <td>{{ e.update_optname }}</td>
                        <td>{{e.input_optname}}</td>
                        <td>{{ e.input_time }}</td>
                    </tr>
                </tbody>
            </table>
            <div class="loading-tips">{{desc}}</div>
        </div>
    </div>
</template>

<script>
import {devicemaintenancemstByuser} from '@config/getData2.js'
export default {
  name: 'maintainorder',
  data () {
    return {
      dataList: [],
      pkId: '',
      page: 1,
      size: '30',
      busy: false,
      desc: ''
    }
  },
  beforeRouteLeave (to, from, next) {
    if (to.path === '/home' || to.path === '/login') {
      this.$store.dispatch('setKeepAlive', [])
    }
    next()
  },
  activated () {
  },
  created () {
    this._devicemaintenancemstByuser()
  },
  methods: {
    // grid
    async _devicemaintenancemstByuser () {
      this.page = 1
      this.busy = false
      this.desc = ''
      this.pkId = ''
      let res = await devicemaintenancemstByuser(this.page + '', this.size)
      this.dataList = []
      this.dataList = [...res.content]
      if (res.content.length < 30) {
        this.busy = true
        this.desc = '已加载全部数据'
      }
    },
    async loadMore () {
      this.busy = true
      this.page++
      let res = await devicemaintenancemstByuser(this.page + '', this.size)
      this.dataList = [...this.dataList, ...res.content]
      if (res.content.length < 30) {
        this.busy = true
        this.desc = '已加载全部数据'
      } else {
        this.busy = false
      }
    },
    toDetail () {
      if (this.pkId) {
        this.$router.push({
          path: '/maintainorderdetail',
          query: {id: this.pkId}
        })
      }
    },
    toRadio (e) {
      this.pkId = this.pkId === e.repair_id ? '' : e.repair_id
    }
  }
}
</script>

<style lang="stylus" scoped>
</style>
