three

src/views/production/data/index.vue

 <template>
-  <div class="app-container" style="padding-top: 60px;">
-
-
+  <div class="app-container" style="padding-top: 60px">
     <div style="width: 60%; margin-left: 80px; padding-left: 8.6%">
       <el-form
-      ref="queryForm"
-      :model="queryParams"
-      :inline="true"
-      label-width="60px"
-    >
+        :rules="rules"
+        ref="queryForm"
+        :model="queryParams"
+        :inline="true"
+        label-width="60px"
+      >
         <el-form-item style="flex-basis: 50%" prop="ptype">
           <el-input
-            v-model="queryParams.ptype"
+            v-model.trim="queryParams.ptype"
             placeholder="请输入工序"
             clearable
             :maxlength="100"
@@ -19,18 +18,19 @@
             style="width: 350px"
             @keyup.enter.native="handleQuery"
           >
-          <template slot="prepend">工序</template></el-input>
+            <template slot="prepend">工序</template></el-input
+          >
         </el-form-item>
-      <el-form-item>
-        <el-button
-          type="primary"
-          size="small"
-          icon="el-icon-search"
-          @click="handleQuery"
-          >查询</el-button
-        >
-      </el-form-item>
-    </el-form>
+        <el-form-item>
+          <el-button
+            type="primary"
+            size="small"
+            icon="el-icon-search"
+            @click="handleQuery"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
       <el-table
         :gutter="40"
         v-loading="loading"
@@ -72,7 +72,11 @@
       <el-row style="padding-left: 8.6%; padding-top: 1%">
         <el-col :span="12">
           <el-form-item style="flex-basis: 50%">
-            <el-button type="primary" @click="onSubmit">提交</el-button>
+            <el-button
+              type="primary"
+              @click="onSubmit"
+              >提交</el-button
+            >
           </el-form-item>
         </el-col>
       </el-row>
@@ -94,6 +98,9 @@ export default {
       dictSelection: [],
       queryParams: {
         ptype: ''
+      },
+      rules: {
+        ptype: [{ required: true, message: '请输入工序', trigger: 'blur' }]
       }
     }
   },
@@ -111,18 +118,25 @@ export default {
     },
     //提交按钮
     onSubmit() {
-      console.log(this.dictSelection)
-      submit(this.dictSelection).then(res => {
-        if (res.code === 200) {
-          this.$message.success('提交成功')
-          this.$refs.dictTable.clearSelection()
-          this.queryParams.ptype = ''
+      this.$refs.queryForm.validate(valid => {
+        if (valid) {
+          console.log(this.dictSelection)
+          submit(this.dictSelection).then(res => {
+            if (res.code === 200) {
+              this.$message.success('提交成功')
+              this.$refs.dictTable.clearSelection()
+              this.queryParams.ptype = ''
+            }
+          })
+        } else {
+          return false
         }
       })
     },
     //查询
     handleQuery() {
-      this.$refs.dictTable.clearSelection()
+      //清空
+      /*  this.$refs.dictTable.clearSelection() */
       if (this.queryParams.ptype == '') {
         return
       }