kd-aiot-frontend/src/views/technology/production/components/workCenter-search.vue

<!-- 搜索表单 -->
<template>
    <el-form
      label-width="120px"
      class="ele-form-search"
      @keyup.enter.native="search"
      @submit.native.prevent
    >
      <el-row :gutter="24">

        <el-col v-bind="styleResponsive ? { sm: 10 } : { span: 10 }">
          <el-form-item label="工作中心编码:">
            <el-input clearable v-model.trim="where.code" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col v-bind="styleResponsive ? { sm: 10 } : { span: 10 }">
          <el-form-item label="工作中心名称:">
            <el-input clearable v-model.trim="where.name" placeholder="请输入" />
          </el-form-item>
        </el-col>
  

  
        <el-col v-bind="styleResponsive ? { sm: 4 } : { span: 4 }">
          <div class="ele-form-actions">
            <el-button
              type="primary"
              icon="el-icon-search"
              class="ele-btn-icon"
              @click="search"
            >
              查询
            </el-button>
            <el-button @click="reset">重置</el-button>
          </div>
        </el-col>
      </el-row>
    </el-form>
  </template>
  
  <script>
    export default {
      data() {
        // 默认表单数据
        const defaultWhere = {
          code: '',
          name: '',
    
        };
        return {
          // 表单数据
          where: { ...defaultWhere }
        };
      },
      props: {

      },
      computed: {
        // 是否开启响应式布局
        styleResponsive() {
          return this.$store.state.theme.styleResponsive;
        }
      },
      methods: {
        /* 搜索 */
        search() {
          this.$emit('search', this.where);
        },
        /*  重置 */
        reset() {
          this.where = { ...this.defaultWhere };
          this.search();
        }
      }
    };
  </script>