<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">
                        <el-select v-model="value1" filterable clearable placeholder="请选择">
                          <el-option
                              v-for="item in options1"
                              :key="item.stor_id"
                              :label="item.stor_name"
                              :value="item.stor_id">
                          </el-option>
                        </el-select>
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">单据类型</div>
                    <div class="filter_input_wraper">
                        <el-select v-model="value2" filterable clearable placeholder="请选择">
                          <el-option
                              v-for="item in options2"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value">
                          </el-option>
                        </el-select>
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">物料</div>
                    <div class="filter_input_wraper pointer" @click="searchMater">
                        <input type="text" class="filter-input" v-model="material_code" disabled>
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">规格</div>
                    <div class="filter_input_wraper">
                        <input type="text" class="filter-input" v-model="material_spec" disabled>
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">重量(g)</div>
                    <div class="filter_input_wraper">
                        <input type="number" class="filter-input" v-model="total_qty">
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">单重(g)</div>
                    <div class="filter_input_wraper">
                        <input type="number" class="filter-input" v-model="unit_weight">
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">数量</div>
                    <div class="filter_input_wraper">
                        <input type="number" class="filter-input" v-model="qty" disabled>
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">入库点</div>
                    <div class="filter_input_wraper">
                        <el-select v-model="value3" filterable clearable placeholder="请选择">
                          <el-option
                              v-for="item in options3"
                              :key="item.point_code"
                              :label="item.point_name"
                              :value="item.point_code">
                          </el-option>
                        </el-select>
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">载具号</div>
                    <div class="filter_input_wraper filter_input_wraper_1">
                        <input type="text" class="filter-input" v-model="storagevehicle_code">
                    </div>
                    <div class="filter_button">
                        <button class="button button--primary" :disabled="disabled1" @click="_callVehicle">呼叫空载具</button>
                    </div>
                </div>
                <div class="search-item">
                    <div class="search-label">备注</div>
                    <div class="filter_input_wraper">
                        <input type="text" class="filter-input" v-model="remark">
                    </div>
                </div>
                <div class="search-item_2">
                    <button class="button button--primary" :disabled="disabled2" :class="{'button--defalut': value1 === '' || value2 === '' || value3 === '' || material_code === '' || total_qty === '' || unit_weight === '' || storagevehicle_code === ''}" @click="toSure">确认入库</button>
                    <button class="button button--primary" @click="toJumpSearch">作业查询</button>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import {getBcpStor, getBillType, getPoint, callVehicle, createIn} from '@config/getData2.js'
import {accDiv} from '@config/utils.js'
export default {
  name: 'semifinishedinstore',
  data () {
    return {
      options1: [],
      value1: '',
      options2: [],
      value2: '',
      options3: [],
      value3: '',
      material_id: '',
      material_code: '',
      material_spec: '',
      total_qty: '',
      unit_weight: '',
      storagevehicle_code: '',
      remark: '',
      disabled1: false,
      disabled2: false
    }
  },
  computed: {
    qty () {
      let res = ''
      res = accDiv(this.total_qty, this.unit_weight)
      res = Number(res).toFixed(3)
      return res
    }
  },
  watch: {
    total_qty () {
      this.total_qty = this.total_qty.indexOf('.') > -1 ? this.total_qty.slice(0, this.total_qty.indexOf('.') + 4) : this.total_qty
    },
    unit_weight () {
      this.unit_weight = this.unit_weight.indexOf('.') > -1 ? this.unit_weight.slice(0, this.unit_weight.indexOf('.') + 4) : this.unit_weight
    }
  },
  beforeRouteLeave (to, from, next) {
    if (to.path === '/home' || to.path === '/login') {
      this.$store.dispatch('setKeepAlive', [])
    }
    next()
  },
  activated () {
    if (this.$store.getters.materObj !== '') {
      this.material_id = JSON.parse(this.$store.getters.materObj).material_id
      this.material_code = JSON.parse(this.$store.getters.materObj).material_code
      this.material_spec = JSON.parse(this.$store.getters.materObj).material_spec
      this.unit_weight = Number(JSON.parse(this.$store.getters.materObj).net_weight).toFixed(3)
    }
  },
  created () {
    this._getBcpStor()
    this._getBillType()
    this._getPoint()
  },
  methods: {
    // 仓库下拉框
    async _getBcpStor () {
      let res = await getBcpStor()
      this.options1 = [...res.data]
    },
    // 单据类型下拉框
    async _getBillType () {
      let res = await getBillType()
      this.options2 = [...res.data]
    },
    // 入库点下拉框
    async _getPoint () {
      let res = await getPoint()
      this.options3 = [...res.data]
    },
    // 呼叫空载具
    async _callVehicle () {
      this.disabled1 = true
      try {
        let res = await callVehicle()
        this.toast(res.message)
        this.disabled1 = false
      } catch (e) {
        this.disabled1 = false
      }
    },
    // 确认入库
    async toSure () {
      this.disabled2 = true
      if (this.value1 === '' || this.value2 === '' || this.value3 === '' || this.material_code === '' || this.total_qty === '' || this.unit_weight === '' || this.storagevehicle_code === '') {
        this.disabled2 = false
        return
      }
      try {
        let from = {
          stor_id: this.value1,
          bill_type: this.value2,
          material_id: this.material_id,
          material_code: this.material_code,
          material_spec: this.material_spec,
          total_qty: this.total_qty,
          unit_weight: this.unit_weight,
          qty: this.qty,
          point_code: this.value3,
          storagevehicle_code: this.storagevehicle_code,
          remark: this.remark
        }
        let res = await createIn(from)
        this.toast(res.message)
        this.value1 = ''
        this.value2 = ''
        this.value3 = ''
        this.material_id = ''
        this.material_code = ''
        this.material_spec = ''
        this.total_qty = ''
        this.unit_weight = ''
        this.storagevehicle_code = ''
        this.remark = ''
        this.disabled2 = false
        this.$store.dispatch('setMaterObj', '')
      } catch (e) {
        this.disabled2 = false
      }
    },
    searchMater () {
      this.$store.dispatch('setMaterObj', '')
      this.$router.push('/semifinishedinmatersearch')
    },
    toJumpSearch () {
      this.$router.push('/semifinishedinstoresearch')
    },
    handleBlur ($event) {
      $event.target.value = Number($event.target.value).toFixed(3)
    }
  }
}
</script>

<style lang="stylus" scoped>
.search-item
    width 49%
    &:nth-child(3n+2)
        margin-left 0
        margin-right 0
    &:nth-child(2n)
        margin-left 2%
.search-item_2
    width 100%
    margin-left 0
.filter_button
    width 96px
    height 30px
.filter_input_wraper_1
    width calc(100% - 156px)
    padding-right 10px
</style>
