<template>
  <div>
    <el-dialog title="高级查询" :visible="moreQueryVisible" @close="close" width="66%">
      <el-form inline ref="queryForm" label-position="top" :model="formData">
        <el-form-item label="货主" prop="ownerCode">
          <PublicQuery
            title="货主"
            baseUrl="/crd_web/crdweb"
            cfgKey="crdWmsCustomer"
            :valueField.sync="formData.ownerCode"
            :textField.sync="formData.ownerName"
          ></PublicQuery>
        </el-form-item>
        <el-form-item label="商品" prop="skuCode">
          <PublicQuery
            title="商品"
            baseUrl="/crd_web/crdweb"
            cfgKey="crdWmsSkus"
            :valueField.sync="formData.skuCode"
            :textField.sync="formData.skuName"
          ></PublicQuery>
        </el-form-item>
        <el-form-item label="入库单号" prop="asnNo">
          <el-input v-model="formData.asnNo"></el-input>
        </el-form-item>
        <el-form-item label="入库单类型" prop="asnType">
          <el-select multiple v-model="formData.asnType">
            <el-option label="普通入库" value="PI"></el-option>
            <el-option label="调拨入库" value="AI"></el-option>
            <el-option label="退货入库" value="RI"></el-option>
            <el-option label="换货入库" value="EI"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="预计到货时间从开始" prop="fmEtaFm">
          <el-date-picker
            v-model="formData.fmEtaFm"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="预计到货时间从结束" prop="fmEtaTo">
          <el-date-picker
            v-model="formData.fmEtaTo"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="预计到货时间到开始" prop="toEtaFm">
          <el-date-picker
            v-model="formData.toEtaFm"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="预计到货时间到结束" prop="toEtaTo">
          <el-date-picker
            v-model="formData.toEtaTo"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="出库单号" prop="soNo">
          <el-input v-model="formData.soNo"></el-input>
        </el-form-item>
        <el-form-item label="出库单类型" prop="soType">
          <el-select multiple v-model="formData.soType">
            <el-option label="普通出库" value="PO"></el-option>
            <el-option label="调拨出库" value="AO"></el-option>
            <el-option label="退厂出库" value="RO"></el-option>
            <el-option label="换货出库" value="EO"></el-option>
            <el-option label="排序出库" value="OO"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="预计发货时间从开始" prop="fmEtdFm">
          <el-date-picker
            v-model="formData.fmEtdFm"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="预计发货时间从结束" prop="fmEtdTo">
          <el-date-picker
            v-model="formData.fmEtdTo"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="预计发货时间到开始" prop="toEtdFm">
          <el-date-picker
            v-model="formData.toEtdFm"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="预计发货时间到结束" prop="toEtdTo">
          <el-date-picker
            v-model="formData.toEtdTo"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="发货明细行总数(>=)" prop="soLineNum">
          <el-input v-model="formData.soLineNum"></el-input>
        </el-form-item>
        <el-form-item label="订货总数(>=)" prop="qtySoEa">
          <el-input v-model="formData.qtySoEa"></el-input>
        </el-form-item>
      </el-form>
      <div class="more-query-btn">
        <el-button v-auth="50800010104" type="primary" @click="submitForm">查询</el-button>
        <el-button v-auth="50800010103" @click="resetForm('queryForm')">重置</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data () {
    return {
      formData: {
        asnType: [],
        soType: []
      },
    }
  },
  mounted () {
  },
  props: {
    moreQueryVisible: Boolean
  },
  methods: {

    // 关闭弹窗
    close () {
      this.$emit('close')
    },

    // 提交表单
    submitForm () {
      this.format()
      this.$emit('toGetList', this.formData)
      this.$refs['queryForm'].resetFields()
    },

    // 重置表单
    resetForm () {
      this.$refs['queryForm'].resetFields()
    },

    // 格式化对象数据
    format () {
      for (const key in this.formData) {
        if (this.formData.hasOwnProperty(key)) {
          const element = this.formData[key]
          if (Array.isArray(element)) {
            this.formData[key] = element.join(',')
          }
        }
      }
      return this.formData
    }
  }
}
</script>
