<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" disabled></el-input>
          </el-form-item>
          <el-form-item label="商品" prop="skuName">
            <el-input v-model="formData.skuName" disabled></el-input>
          </el-form-item>
          <el-form-item label="包装规格" prop="packDesc">
            <el-input v-model="formData.packDesc" disabled></el-input>
          </el-form-item>
          <el-form-item label="包装单位" prop="uomDesc">
            <el-input v-model="formData.uomDesc" disabled></el-input>
          </el-form-item>
          <el-form-item label="预收数" prop="qtyPlanUom">
            <el-input v-model="formData.qtyPlanUom" disabled></el-input>
          </el-form-item>
          <el-form-item label="预收数EA" prop="qtyPlanEa">
            <el-input v-model="formData.qtyPlanEa" disabled></el-input>
          </el-form-item>
          <el-form-item label="可收数" prop="currentQtyRcvUom">
            <el-input v-model="formData.currentQtyRcvUom" disabled></el-input>
          </el-form-item>
          <el-form-item label="可收数EA" prop="currentQtyRcvEa">
            <el-input v-model="formData.currentQtyRcvEa" disabled></el-input>
          </el-form-item>
          <el-form-item label="预收重量" prop="planWeight">
            <el-input v-model="formData.planWeight" disabled></el-input>
          </el-form-item>
          <el-form-item label="收货重量" prop="rcvWeight">
            <el-input v-model="formData.rcvWeight" @input="weightChange"></el-input>
          </el-form-item>
          <el-form-item label="商品重量" prop="skuWeight">
            <el-input v-model="formData.skuWeight" disabled></el-input>
          </el-form-item>
          <el-form-item label="单价" prop="price">
            <el-input v-model="formData.price" disabled></el-input>
          </el-form-item>
          <el-form-item label="收货库位" prop="toLoc">
            <el-input v-model="formData.toLoc" disabled></el-input>
          </el-form-item>
          <el-form-item label="收货跟踪号" prop="toId">
            <el-input v-model="formData.toId" disabled></el-input>
          </el-form-item>
          <el-form-item label="上架库位指定规则" prop="reserveCode">
            <el-select v-model="formData.reserveCode" >
              <el-option label="人工指定库位" value="MAN"></el-option>
              <el-option label="收货前计算库位-一步收货" value="B_RCV_ONE"></el-option>
              <el-option label="收货前计算库位-两步收货" value="B_RCV_TWO"></el-option>
              <el-option label="收货时计算库位" value="RCV"></el-option>
              <el-option label="上架时计算库位" value="PA"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="上架库位" prop="paRule">
            <PublicQuery title="上架库位" single :rowData.sync="paRuleData" baseUrl="/inb_web/inbweb" cfgKey="inbWmsPaRule" :valueField.sync="formData.paRule" :textField.sync="formData.paRuleName">
            </PublicQuery>
          </el-form-item>
          <el-form-item label="收货时间" prop="rcvTime">
            <el-input v-model="formData.rcvTime" disabled></el-input>
          </el-form-item>
          <el-form-item label="收货人" prop="rcvOp">
            <PublicQuery title="收货人" single :rowData.sync="rcvOpData" baseUrl="/inb_web/inbweb" cfgKey="inbWmsOperator" :valueField.sync="formData.rcvOp" :textField.sync="formData.rcvName">
            </PublicQuery>
          </el-form-item>
          <el-form-item label="码盘跟踪号" prop="planId">
            <el-input v-model="formData.planId" disabled></el-input>
          </el-form-item>
          <el-form-item label="工单号" prop="workNo">
            <el-input v-model="formData.workNo"></el-input>
          </el-form-item>
          <el-form-item label="承运商" prop="carrierCode">
            <PublicQuery title="承运商" single :rowData.sync="carrierData" baseUrl="/inb_web/inbweb" cfgKey="Inb_TRANSPORT_SUPPLIER" :valueField.sync="formData.carrierCode" :textField.sync="formData.carrierName">
            </PublicQuery>
          </el-form-item>
          <el-form-item label="车牌号" prop="vehicleNo">
            <el-input v-model="formData.vehicleNo"></el-input>
          </el-form-item>
          <el-form-item label="驾驶员" prop="driver">
            <el-input v-model="formData.driver"></el-input>
          </el-form-item>
          <el-form-item label="身份证号" prop="identificationNo">
            <el-input v-model="formData.identificationNo"></el-input>
          </el-form-item>
        </div>

        <div>
          <el-collapse v-model="activeNames">
            <el-collapse-item title="批次属性" name="1">
              <LotAttrs
                :formData="formData"
                :queryParams="lotAttrsParams"
              ></LotAttrs>
            </el-collapse-item>
          </el-collapse>
        </div>
      </el-form>
      <div class="mrg-t">
        <el-button
          v-if="!(formData.status==='90'||formData.status==='99')"
         v-auth="50200020310" type="primary" @click="handleConfirm">收货确认</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import keys from '@/config/keys'
export default {
  data () {
    return {
      activeNames: ['1'],
      formData: {},
      lotAttrsParams: {},
      rcvOpData: {}, // 收货人
      carrierData: {}, // 承运商
      paRuleData: {}, // 上架库位
      rules: {
        uomDesc: [
          { required: true, message: '包装单位必填', trigger: 'change' }
        ],
        currentQtyRcvUom: [
          { required: true, message: '可收数必填', trigger: 'change' }
        ],
        currentQtyRcvEa: [
          { required: true, message: '可收数EA必填', trigger: 'change' }
        ],
        rcvWeight: [
          { required: true, message: '收货重量必填', trigger: 'change' }
        ],
        reserveCode: [
          { required: true, message: '上架库位指定规则必填', trigger: 'change' }
        ],
        toLoc: [
          { required: true, message: '收货库位必填', trigger: 'change' }
        ],
        lotAtt05: [
          { required: true, message: '品质必填', trigger: 'change' }
        ],
        lotAtt06: [
          { required: true, message: '等级必填', trigger: 'change' }
        ],
        lotAtt07: [
          { required: true, message: '榨季必填', trigger: 'change' }
        ]
      }
    }
  },
  props: {
    goodsFormVisible: Boolean,
    code: String,
    currentRow: {
      type: Object,
      default: () => ({})
    },
    rowIndex: '',
    editBool: Boolean
  },
  mounted () {
  },
  methods: {
    close () {
      this.$emit('close')
    },

    // 确认
    handleConfirm () {
      let data = { ...this.formData }
      this.$refs.goodsForm.validate((valid) => {
        if (valid) {
          this.$emit('handleConfirm', data)
          this.$refs.goodsForm.resetFields()
        }
      })
    },

    // 收货重量变化
    weightChange () {
      if (!this.formData.rcvWeight) return
      let newVal = parseFloat(this.formData.rcvWeight) / parseFloat(this.formData.skuWeight)
      console.log(newVal, this.formData.currentQtyRcvUom)
      this.formData.currentQtyRcvUom = newVal
      this.formData.currentQtyRcvEa = newVal
    },
  },

  watch: {
    rcvOpData: {
      handler (item) {

      },
      deep: true
    },
    paRuleData: {
      handler (item) {

      }
    },
    carrierData: {
      handler (item) {

      }
    },
    currentRow: {
      handler (item) {
        this.formData = { ...item }
        this.lotAttrsParams = {
          skuCode: item.skuCode,
          ownerCode: item.ownerCode
        }
      },
      deep: true
    }
  }
}
</script>
 <style lang="scss">

.mrg-t {
  margin-top: 20px;
}

</style>
