<template>
  <div class="ls-search-form">
    <el-row  :gutter="20" class="search-style">
      <el-col :span="5">
        <label >级联层数</label>
        <el-select v-model="queryParam.date"
            placeholder="请选择" filterable clearable size="small">
           <el-option
             v-for="(item, i) in starList"
             :key="i"
             :label="item.label"
             :value="item.value">
           </el-option>
         </el-select>
      </el-col>
      <el-col :span="5">
        <label class="label-row" >级联名称</label>
        <el-select v-model="queryParam.date"
            placeholder="请选择" filterable clearable size="small">
           <el-option
             v-for="(item, i) in starList"
             :key="i"
             :label="item.label"
             :value="item.value">
           </el-option>
         </el-select>
      </el-col>
      <el-col :span="5">
        <label >字段名</label>
        <el-input v-model="queryParam.date"  @keyup.enter.native="handleQuery"
             size="small"     placeholder="请输入" />
      </el-col>
      <el-col :span="5">
        <label >状态</label>
        <el-select v-model="queryParam.date"
            placeholder="请选择" filterable clearable size="small">
           <el-option
             v-for="(item, i) in starList"
             :key="i"
             :label="item.label"
             :value="item.value">
           </el-option>
         </el-select>
      </el-col>
    </el-row>
    <div style="text-align: center;">
      <div >
        <el-button @click="handleQuery"  type="warning" icon="el-icon-search" size="small" >查询</el-button>
        <el-button @click="reSet"     type="info"  icon="el-icon-refresh-left" plain size="small" >重置</el-button>
     </div>
    </div>

  </div>
</template>

<script>

  export default {
      name: 'search',

      created () {

      },
      mounted () {

      },
      methods: {
          //查询
          handleQuery () {
            this.$emit('query', 1);
          },
          //重置
          reSet () {
            Object.keys(this.queryParam).forEach(key => { this.queryParam[key] = '' });

             this.handleQuery();
          },

      },

      data () {
          return {

            queryParam: {
               date: ''

            },

            starList: [
              {
                label: '一颗星',
                value: '1',
              },
              {
                label: '两颗星',
                value: '2',
              },

            ]

          };
      },
  }
</script>

<style type="text/css" scoped lang="scss">
</style>
