<template>
    <div>
        <el-dialog
          title="商品拣货位"
          v-if="goodsFormVisible"
          :visible.sync="goodsFormVisible"
          :before-close="close"
          width="66%">
          <el-form
            inline
            ref="goodsForm"
            label-position="top"
            :model="formData"
            :rules="rules">
            <div>
              <el-form-item
                label="行号"
                prop="lineNo">
                <el-input v-model="formData.lineNo"></el-input>
              </el-form-item>
              <el-form-item
                label="子件编码"
                prop="subSkuCode">
                <PublicQuery
                title="子件编码"
                single
                :rowData.sync="subSkuData"
                cfgKey="kitWmsSubSkuCode"
                baseUrl="/kit_web/kitweb"
                :valueField.sync="formData.subSkuCode"
                :textField.sync="formData.subSkuCode"
              ></PublicQuery>
              </el-form-item>
              <el-form-item
                label="子件名称"
                prop="subSkuName">
                <el-input v-model="formData.subSkuName" disabled></el-input>
              </el-form-item>
              <el-form-item
                label="包装规格"
                prop="packDesc">
                <PublicQuery
                title="包装规格"
                single
                :rowData.sync="packData"
                cfgKey="kitWmsPackage"
                baseUrl="/kit_web/kitweb"
                :valueField.sync="formData.packDesc"
                :textField.sync="formData.packDesc"
              ></PublicQuery>
              </el-form-item>
              <el-form-item
                label="包装单位"
                prop="uomDesc">
                <PublicQuery
                title="包装单位"
                single
                cfgKey="kitWmsUom"
                baseUrl="/kit_web/kitweb"
                :valueField.sync="formData.uomDesc"
                :textField.sync="formData.uomDesc"
              ></PublicQuery>
              </el-form-item>
              <el-form-item
                label="子件类型"
                prop="subSkuType">
                <el-select v-model="formData.subSkuType">
                  <el-option label="普通" value="COMMON"></el-option>
                  <el-option label="辅料" value="ACC"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                label="数量"
                prop="qty">
                <el-input v-model="formData.qty" @input="qtyChange"></el-input>
              </el-form-item>
              <el-form-item
                label="数量EA"
                prop="qtyEa">
                <el-input v-model="formData.qtyEa" disabled></el-input>
              </el-form-item>
              <el-form-item
                label="备注"
                prop="remark">
                <el-input v-model="formData.remark  "></el-input>
              </el-form-item>
            </div>
          </el-form>
          <div class="more-query-btn">
            <el-button v-auth="50300030101" type="primary" @click="handleConfirm">确认</el-button>
            <el-button v-auth="50300030101" type="primary" @click="handleConfirmAdd">确认并添加</el-button>
          </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
  data () {
    return {
      activeNames: ['1', '2'],
      formData: {},
      subSkuData: {},
      packData: {},
      rules: {
        lineNo: [{ required: true, message: '行号必填', trigger: 'change' }],
        subSkuCode: [{ required: true, message: '子件编码必填', trigger: 'change' }],
        packDesc: [{ required: true, message: '包装规格必填', trigger: 'change' }],
        uomDesc: [{ required: true, message: '包装单位必填', trigger: 'change' }],
        subSkuType: [{ required: true, message: '子件类型必填', trigger: 'change' }],
        qty: [{ required: true, message: '数量必填', trigger: 'change' }],
      }
    }
  },
  props: {
    goodsFormVisible: Boolean,
    currentRow: {
      type: Object,
      default: () => ({})
    },
    rowIndex: '',
    editBool: Boolean
  },
  mounted () {

  },
  methods: {
    close () {
      this.$emit('close')
      this.$refs.goodsForm.resetFields()
    },

    // 数量改变
    qtyChange () {
      this.formData.qtyEa = this.formData.qty
    },

    // 确认
    handleConfirm () {
      let data = Object.assign({ isChecked: 'false' }, this.formData)
      if (this.editBool) {
        this.$emit('editOK', data, this.rowIndex)
        this.$refs.goodsForm.resetFields()
      } else {
        this.$refs.goodsForm.validate((valid) => {
          if (valid) {
            this.$emit('handleConfirm', data)
            this.$refs.goodsForm.resetFields()
          }
        })
      }
    },

    // 确认并添加
    handleConfirmAdd () {
      let data = Object.assign({ isChecked: 'false' }, this.formData)
      if (this.editBool) {
        this.$emit('editOK', data, this.rowIndex)
        this.$refs.goodsForm.resetFields()
      } else {
        this.$refs.goodsForm.validate((valid) => {
          if (valid) {
            this.$emit('handleConfirmAdd', data)
            this.$refs.goodsForm.resetFields()
          }
        })
      }
    },
  },

  watch: {
    subSkuData: {
      handler (item) {
        this.formData.subSkuName = item.skuName
        this.formData.packDesc = item.packDesc
        this.formData.uomDesc = item.uomDesc
        this.formData.packCode = item.packCode
        this.formData.uom = item.printUom
        this.formData.uomQty = item.uomQty
        this.formData.formatCode = item.formatCode
      },
      deep: true
    },
    packData: {
      handler (item) {
        this.formData.packCode = item.cdpaCode
        this.formData.uom = item.unit
      },
      deep: true
    },
    currentRow: {
      handler (item) {
        this.formData = { ...item }
      },
      deep: true
    }
  }
}
</script>
