<template>
  <div class="ls-search-form">
    <el-row  :gutter="20" class="search-style">
      <el-col :span="5">
        <label >模块名称</label>
        <common-select v-model="queryParam.moduleId"  dict-type="CRM_Module_Code"   >
        </common-select>
      </el-col>
      <el-col :span="5">
        <label class="label-row" >模板名称</label>
        <el-input v-model="queryParam.templateName"  @keyup.enter.native="handleQuery"
             size="mini"     placeholder="请输入" />
      </el-col>
      <el-col :span="5">
        <label >模板分类</label>
        <el-input v-model="queryParam.templateType"  @keyup.enter.native="handleQuery"
             size="mini"     placeholder="请输入" />
      </el-col>
      <el-col :span="5">
        <label  >字段名称</label>
        <el-input v-model="queryParam.fieldName"  @keyup.enter.native="handleQuery"
             size="mini"     placeholder="请输入" />
      </el-col>
      <el-col :span="4">
        <label  >操作类型</label>
        <el-select v-model="queryParam.operationType"
          placeholder="请选择" clearable  size="mini" >
          <el-option
             v-for="item in operTypeList"
             :key="item.key"
             :label="item.key"
             :value="item.vaule" >
          </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="mini" >查询</el-button>
        <el-button @click="reSet"     type="info"  icon="el-icon-refresh-left" plain size="mini" >重置</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(1);
        },

    },
    props: ['operTypeList'],
    data () {
      return {
        queryParam: {
          moduleName: '',
          templateName: '',
          templateType: '',
          fieldName: '',
          operationType: '',
        },
      };
    },
  }
</script>

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