<template>
    <div class="order-wraper">
        <div class="search-confirm-wrap">
            <div class="search-wrap">
                <div class="search-item">
                    <div class="search-label">包装机编号</div>
                    <div class="filter_input_wraper">
                        <input type="text" class="filter-input" v-model="val1">
                    </div>
                </div>
                <div class="search-item_2 flexend">
                    <button class="button button--primary" :disabled="disabled1" :class="{'button--defalut': !this.pkId}" @click="_confirmIn">确认上料</button>
                </div>
            </div>
        </div>
        <div class="grid_wraper">
            <table class="filter-table">
                <thead>
                    <tr>
                        <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.sale_code}" @click="toRadio(e)">
                        <td>{{i + 1}}</td>
                        <td>{{e.device_code}}</td>
                        <td>{{e.workorder_code}}</td>
                        <td>{{e.plan_qty}}</td>
                        <td>{{e.material_spec}}</td>
                        <td>{{e.material_code}}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</template>

<script>
import { confirmIn } from '../../../config/getData1.js'
export default {
  name: 'letterbufferselect',
  data () {
    return {
      val1: '',
      dataList: [],
      // dataList: [{material_code: '24007845L', material_spec: '23xcds', material_name: '垫片活接直通\DPHJS22\EHJA0703009B', sale_qty: '1000', sale_code: '0022060927', remark: '222'}],
      pkId: '',
      pkObj: {},
      disabled1: false
    }
  },
  beforeRouteLeave (to, from, next) {
    if (to.path === '/home' || to.path === '/login') {
      this.$store.dispatch('setKeepAlive', [])
    }
    next()
  },
  created () {
    this._outgetAll()
  },
  methods: {
    async _confirmIn () {
      this.disabled1 = true
      if (!this.pkId) {
        this.disabled1 = false
        return
      }
      try {
        let res = await confirmIn(this.pkObj)
        this.toast(res.message)
        this.disabled1 = false
        this.pkId = ''
        this.pkObj = {}
        this._outgetAll()
      } catch (e) {
        this.disabled1 = false
      }
    },
    toSelect () {
      this.$router.push('/finishedinstoresearch')
    },
    toRadio (e) {
      this.pkId = this.pkId === e.sale_code ? '' : e.sale_code
      this.pkObj = this.pkId === e.sale_code ? e : {}
    }
  }
}
</script>

<style lang="stylus" scoped>
.grid_wraper
    height calc(100% - 1.1rem)
.filter_input_wraper_1
    width calc(100% - 45px)
.search-label_1
    width 45px
.filter-table th, .filter-table td
    line-height 22px
.input
    width auto
    text-indent 0
    text-align center
</style>
