<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="dockCode">
          <el-input v-model="formData.dockCode"></el-input>
        </el-form-item>
        <el-form-item label="月台名称" prop="dockName">
          <el-input v-model="formData.dockName"></el-input>
        </el-form-item>
        <el-form-item  label="使用类型" prop="dockUseType">
          <el-select multiple v-model="formData.dockUseType">
            <el-option label="装" value="LOAD"></el-option>
            <el-option label="卸" value="UNLOAD"></el-option>
            <el-option label="装+卸" value="LU"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="作业区域" prop="areaCode">
          <PublicQuery
            title="作业区域"
            single
            baseUrl="/doc_web/docweb"
            cfgKey="docWmsArea"
            :valueField.sync="formData.areaCode"
            :textField.sync="formData.areaName"
          ></PublicQuery>
        </el-form-item>
        <el-form-item label="使用车型" prop="vehicleType">
          <el-select multiple v-model="formData.vehicleType">
            <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="isEnable">
          <el-select  v-model="formData.isEnable">
            <el-option label="是" value="Y"></el-option>
            <el-option label="否" value="N"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div class="more-query-btn">
        <el-button  type="primary" @click="submitForm">查询</el-button>
        <el-button  @click="resetForm('queryForm')">重置</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data () {
    return {
      formData: {
        dockUseType: [],
        vehicleType: [],
      },
    }
  },
  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>
