<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="请选择" @change="changeValue">
                          <el-option
                              v-for="item in options1"
                              :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">
                        <el-select v-model="value2" filterable clearable placeholder="请选择" @change="changeValue">
                          <el-option
                              v-for="item in options2"
                              :key="item.device_code"
                              :label="item.device_name"
                              :value="item.device_code">
                          </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_spec" 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_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_name" 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="deviceinstor_weight" disabled>
                    </div>
                </div>
                <!-- <div class="search-item">
                    <div class="search-label">重量(g)</div>
                    <div class="filter_input_wraper filter_input_wraper_1">
                        <input type="text" class="filter-input" v-model="deviceinstor_weight" disabled>
                    </div>
                    <div class="filter_button">
                        <button class="button button--primary" :disabled="disabled1" @click="_washweighing">称重</button>
                    </div>
                </div> -->
                <div class="search-item_2">
                    <button class="button button--primary" :disabled="disabled1" @click="_washweighing">称重</button>
                    <button class="button button--primary" :disabled="disabled2" :class="{'button--defalut': value1 === '' || value2 === '' || material_spec === '' || material_code === '' || material_name === ''}" @click="toSure">确认</button>
                    <button class="button button--primary" @click="toCancel">取消</button>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import {dictall, washdevicelist, washquery, washweighing, washweighingFinish} from '@config/getData1.js'
export default {
  name: 'manpour',
  data () {
    return {
      options1: [],
      value1: '',
      options2: [],
      value2: '',
      material_id: '',
      material_spec: '',
      material_code: '',
      material_name: '',
      deviceinstor_weight: '',
      disabled1: false,
      disabled2: false
    }
  },
  beforeRouteLeave (to, from, next) {
    if (to.path === '/home' || to.path === '/login') {
      this.$store.dispatch('setKeepAlive', [])
    }
    next()
  },
  activated () {
    console.log(this.$store.getters.materObj, 666)
    if (this.$store.getters.materObj !== '') {
      this.material_spec = JSON.parse(this.$store.getters.materObj).material_spec
      this.material_code = JSON.parse(this.$store.getters.materObj).material_code
      this.material_name = JSON.parse(this.$store.getters.materObj).material_name
    }
  },
  created () {
    this._dictall()
    this._washdevicelist()
  },
  methods: {
    // 车间下拉框
    async _dictall () {
      let res = await dictall()
      if (res.code === 200) {
        this.options1 = [...res.content]
      } else {
        this.toast(res.msg)
      }
    },
    // 设备下拉框
    async _washdevicelist () {
      let res = await washdevicelist('1535144552481034240')
      if (res.code === 200) {
        this.options2 = [...res.content]
      } else {
        this.toast(res.msg)
      }
    },
    changeValue () {
      if (this.value1 && this.value2) {
        this._washquery()
      }
    },
    // 1.2根据设备列表获取物料信息
    async _washquery () {
      let res = await washquery(this.value1, this.value2)
      if (res.code === 200) {
        this.material_spec = res.content[0].material_spec
        this.material_code = res.content[0].material_code
        this.material_name = res.content[0].material_name
      } else {
        this.toast(res.msg)
      }
    },
    // 称重
    async _washweighing () {
      this.disabled1 = true
      let list = []
      list.push(this.value2)
      try {
        let res = await washweighing(list)
        if (res.code === 200) {
          this.deviceinstor_weight = res.content[0].deviceinstor_weight
        }
        this.disabled1 = false
      } catch (e) {
        this.disabled1 = false
      }
    },
    // 确认
    async toSure () {
      this.disabled2 = true
      if (this.value1 === '' || this.value2 === '' || this.material_spec === '' || this.material_code === '' || this.material_name === '') {
        this.disabled2 = false
        return
      }
      try {
        let res = await washweighingFinish(this.value1, this.value2, this.material_spec, this.material_code, this.material_name)
        if (res.code === 200) {
          this.toast(res.msg)
          this.value1 = ''
          this.value2 = ''
          this.material_spec = ''
          this.material_code = ''
          this.material_name = ''
          this.$store.dispatch('setMaterObj', '')
        }
        this.disabled2 = false
      } catch (e) {
        this.disabled2 = false
      }
    },
    searchMater () {
      this.$store.dispatch('setMaterObj', '')
      this.$router.push('/selectmater')
    },
    toCancel () {
      this.$router.push('/home')
    }
  }
}
</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>
