<template>
  <div>
    <el-dialog
      title="高级查询"
      width="80%"
      :visible.sync="dialogVisible"
      :before-close="handleClose">
      <el-form
          inline
          ref="formData"
          label-position="top"
          :model="formData">
          <div v-if="tabIndex===0">
            <el-form-item
            label="入库单号"
            prop="asnNo">
            <el-input v-model="formData.asnNo"></el-input>
          </el-form-item>
          <el-form-item
            label="货主"
            prop="ownerName">
            <PublicQuery
            title="货主"
            baseUrl="/doc_web/docweb"
            cfgKey="docWmsCustomer"
            :valueField.sync="formData.ownerCode"
            :textField.sync="formData.ownerName">
            </PublicQuery>
          </el-form-item>
          <el-form-item label="承运商" prop="lssuSupplierName">
            <PublicQuery title="承运商" baseUrl="/doc_web/docweb" cfgKey="DOC_TRANSPORT_SUPPLIER" :valueField.sync="formData.supplierCode" :textField.sync="formData.lssuSupplierName">
            </PublicQuery>
          </el-form-item>
          <el-form-item label="状态" prop="headerStatus">
            <el-select multiple @change="statusChange" v-model="statusResults">
              <template v-for="item in $keys.stockOut.status">
                <el-option :key="item.id" :value="item.key" :label="item.name"></el-option>
              </template>
            </el-select>
          </el-form-item>
           <el-form-item label="入库单类型" prop="asnType">
            <el-select multiple v-model="asnTypeResults" @change="asnTypeChange">
              <template v-for="item in $keys.stockIn.asnType">
                <el-option :key="item.id" :value="item.key" :label="item.name"></el-option>
              </template>
            </el-select>
          </el-form-item>
          <el-form-item
            label="物流单号"
            prop="logisticNo">
            <el-input v-model="formData.logisticNo"></el-input>
          </el-form-item>
          <el-form-item label="优先级别">
            <el-select v-model="formData.priority" filterable placeholder="请选择">
              <el-option label="最高" value="1"></el-option>
              <el-option label="普通+" value="2"></el-option>
              <el-option label="普通" value="3"></el-option>
              <el-option label="普通-" value="4"></el-option>
              <el-option label="最低" value="5"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="是否预约月台" prop="isAppointDock">
            <el-select v-model="formData.isAppointDock">
              <el-option label="是" value="Y"></el-option>
              <el-option label="否" value="N"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            label="订单时间">
            <el-date-picker
              v-model="date"
              type="datetimerange"
              format="yyyy-MM-dd HH:mm"
              value-format="yyyy-MM-dd HH:mm:ss"
              :default-time="['00:00:00', '23:59:59']"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :picker-options="pickerOptions2"
              @change="getSTime">
            </el-date-picker>
          </el-form-item>
          </div>

          <div v-if="tabIndex===1">
            <el-form-item
            label="装车单号"
            prop="ldNo">
            <el-input v-model="formData.ldNo"></el-input>
          </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="soStatus">
            <el-select v-model="formData.soStatus" filterable placeholder="请选择">
              <el-option label="创建" value="00"></el-option>
              <el-option label="部分预配" value="10"></el-option>
              <el-option label="完全预配" value="20"></el-option>
              <el-option label="部分分配" value="30"></el-option>
              <el-option label="完全分配" value="40"></el-option>
              <el-option label="部分拣货" value="50"></el-option>
              <el-option label="完全拣货" value="60"></el-option>
              <el-option label="部分发运" value="70"></el-option>
              <el-option label="完全发运" value="80"></el-option>
              <el-option label="取消订单" value="90"></el-option>
              <el-option label="关闭订单" value="99"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            label="装车单类型"
            prop="ldType">
            <el-select v-model="formData.ldType" filterable placeholder="请选择">
              <el-option label="无限制" value="FREE"></el-option>
              <el-option label="按承运商" value="CARRIER"></el-option>
              <el-option label="按路线" value="LINE"></el-option>
              <el-option label="按收货人" value="CONSIGNEE"></el-option>
            </el-select>
          </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="vehichleType">
            <el-select multiple v-model="vehichleType" filterable placeholder="请选择" @change="vehichleTypeChange">
              <el-option label="牵引车" value="TR"></el-option>
              <el-option label="大型车辆" value="VE"></el-option>
              <el-option label="小型车辆" value="HI"></el-option>
            </el-select>
          </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="isAppointDock">
            <el-select v-model="formData.isAppointDock" filterable placeholder="请选择">
              <el-option label="是" value="Y"></el-option>
              <el-option label="否" value="N"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            label="修改时间">
            <el-date-picker
              v-model="date"
              type="datetimerange"
              format="yyyy-MM-dd HH:mm"
              value-format="yyyy-MM-dd HH:mm:ss"
              :default-time="['00:00:00', '23:59:59']"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :picker-options="pickerOptions2"
              @change="getTime2">
            </el-date-picker>
          </el-form-item>
          </div>
        </el-form>
        <el-button type="primary"  @click="handelConform">确认</el-button>
        <el-button type="primary" @click="handelResetForm('formData')">重置</el-button>
    </el-dialog>
  </div>
</template>
<script>
import { time } from 'apec-fe-utils'
import { today, yesterday, week, month, twoMonths, threeMonths } from '@/config/shortcuts'
export default {
  data () {
    return {
      formData: {
        lssuSupplierName: '',
        supplierCode: '',
        orderTimeFm: time.formatTime(new Date(new Date() - 3600 * 1000 * 24 * 7)),
        orderTimeTo: time.formatTime(new Date()),
        isAppointDock: '',
        priority: '',
        logisticNo: '',
        asnType: '',
        status: '',
        ownerName: '',
        ownerCode: '',
        asnNo: ''
      },
      statusResults: [],
      pickerOptions2: {
        shortcuts: [today, yesterday, week, month, twoMonths, threeMonths]
      },
      asnTypeResults: [],
      date: [new Date(), new Date((new Date() - 3600 * 1000 * 24 * 29))],
      rules: {
        date: [
          { required: true, message: '请选择日期', trigger: 'change' }
        ],
      },
      vehichleType: []
    }
  },
  props: {
    dialogVisible: Boolean,
    tabIndex: Number
  },
  methods: {
    statusChange (val) {
      this.formData.status = val.join(',')
    },
    vehichleTypeChange (val) {
      this.formData.vehichleType = val.join(',')
    },
    // 获得生效时间
    getSTime (val) {
      this.formData.orderTimeFm = val ? val[0] : ''
      this.formData.orderTimeTo = val ? val[1] : ''
    },
    getTime2 (val) {
      this.formData.modifyTimeFm = val ? val[0] : ''
      this.formData.modifyTimeTo = val ? val[1] : ''
    },
    handelResetForm () {
      this.statusResults = ''
      this.asnTypeResults = ''
      this.$refs['formData'].resetFields()
    },
    handleClose () {
      this.statusResults = ''
      this.asnTypeResults = ''
      this.$refs['formData'].resetFields()
      this.$emit('handleClose')
    },
    // 入库单多选变化
    asnTypeChange (val) {
      this.formData.asnType = val.join(',')
    },
    handelConform () {
      let url
      if (this.tabIndex === 0) {
        url = this.$API.platform.DockDispatchList.getAsnList
      } else {
        url = this.$API.platform.DockDispatchList.getLdList
      }
      const param = this.formData
      this.$https.post(url, param).then(res => {
        this.$emit('handleTable', res.rows)
        this.$emit('handleClose')
      })
      console.log(this.formData)
    }
  }
}
</script>
