style:材料信息

 <!--
  * @Description: 
  * @Autor: renchao
- * @LastEditTime: 2023-05-09 09:20:10
+ * @LastEditTime: 2023-07-18 08:55:31
 -->
 <template>
   <dialogBox title="新建材料信息" width="20%" isMain v-model="myValue" @closeDialog="closeDialog" @submitForm="handleSubmit"
     :isFullscreen="false">
-    <el-form :model="ruleForm" ref="ruleForm" label-width="70px">
+    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="80px">
       <el-row>
         <el-col :span="24">
-          <el-form-item label="材料类型">
+          <el-form-item label="材料类型" prop="cllx">
             <el-select v-model="ruleForm.cllx" class="width100" placeholder="请选择">
               <el-option v-for="item in dictData['A40']" :key="item.dcode" :label="item.dname" :value="item.dcode">
               </el-option>
@@ -19,7 +19,7 @@
       </el-row>
       <el-row :gutter="20">
         <el-col :span="24">
-          <el-form-item label="材料名称">
+          <el-form-item label="材料名称" prop="clmc">
             <el-input v-model="ruleForm.clmc"></el-input>
           </el-form-item>
         </el-col>
@@ -41,7 +41,15 @@
           cllx: "",
           clmc: "",
         },
-      };
+        rules: {
+          cllx: [
+            { required: true, message: '请选择材料类型', trigger: 'change' }
+          ],
+          clmc: [
+            { required: true, message: '请输入材料名称', trigger: 'blur' }
+          ]
+        }
+      }
     },
     computed: {
       ...mapGetters(["dictData"]),
@@ -60,14 +68,21 @@
         }
       },
       handleSubmit () {
+        debugger
+        this.$refs['ruleForm'].validate((valid) => {
+          if (valid) {
             this.$parent.addSave(this.ruleForm);
             this.ruleForm = {
               cllx: "",
               clmc: "",
             }
             this.$emit("input", false);
-      },
-    },
+          } else {
+            return false;
+          }
+        })
+      }
+    }
   };
 </script>
 <style scoped lang="scss">