证件管理表单校验

src/views/system/modules/AddCertificateManagement.vue

@@ -10,57 +10,57 @@
     :visible="visible"
   >
       <div class="table-page-search-wrapper">
-        <a-form-model layout="inline" ref="form">
+        <a-form-model layout="inline" ref="form" :model="formState" :rules="validatorRules">
           <a-row :gutter="24">
             <a-col :md="8" :sm="8">
-              <a-form-item label="证件名称" >
+              <a-form-model-item label="证件名称" prop="name">
                 <a-input   placeholder="请输入"  v-model="formState.name" />
-              </a-form-item>
+              </a-form-model-item>
             </a-col>
             <a-col :md="8" :sm="8">
-              <a-form-item label="证件所有人"  >
+              <a-form-model-item label="证件所有人"  prop="userId">
                 <a-input placeholder="请输入" v-model="formState.userId"/>
-              </a-form-item>
+              </a-form-model-item>
            </a-col>
             <a-col :md="8" :sm="8">
-              <a-form-item label="证件编号"  >
+              <a-form-model-item label="证件编号"  prop="code">
                  <a-input placeholder="请输入" v-model="formState.code"/>
-               </a-form-item>
+               </a-form-model-item>
             </a-col>
             <a-col :md="8" :sm="8">
-              <a-form-item label="起始日期"  >
+              <a-form-model-item label="起始日期"  >
                 <a-date-picker
                  style="width: 100%"
                  placeholder="请选择起始时间"
                 v-model="beDate"
                />
-               </a-form-item>
+               </a-form-model-item>
             </a-col>
             <a-col :md="8" :sm="8">
-              <a-form-item label="到期时间"  >
+              <a-form-model-item label="到期时间"  >
                 <a-date-picker
                  style="width: 100%"
                   placeholder="请选择到期时间"
                   v-model="enDate"
                  />
-               </a-form-item>
+               </a-form-model-item>
             </a-col>
             <a-col :md="8" :sm="8">
-              <a-form-item label="管理人"  >
+              <a-form-model-item label="管理人"  >
                 <a-input placeholder="请输入" v-model="formState.manageId"/>
-               </a-form-item>
+               </a-form-model-item>
             </a-col>
             <a-col :md="8" :sm="8">
-              <a-form-item label="提前通知时间/月"  >
+              <a-form-model-item label="提前通知时间/月"   prop="noticeMonth">
                 <a-input placeholder="请输入" v-model="formState.noticeMonth"/>
-               </a-form-item>
+               </a-form-model-item>
             </a-col>
           </a-row>
           <a-row :gutter="24">
               <a-col :md="24" :sm="8"> 
-               <a-form-item label="备注信息" :labelCol="labelCol" :wrapperCol="wrapperCol" class="nresume" style="height:100px !important">
+               <a-form-model-item label="备注信息" :labelCol="labelCol" :wrapperCol="wrapperCol" class="nresume" style="height:100px !important">
                  <a-input type="textarea" placeholder="请输入" v-model="formState.remarks"/>
-               </a-form-item>
+               </a-form-model-item>
               </a-col>
             </a-row>
           </a-form-model>
@@ -91,7 +91,13 @@ export default {
             },
             confirmLoading: false,
             enDate:'',
-            beDate:''
+            beDate:'',
+            validatorRules: {
+              name:[{required: true, message: '证件名称不能为空!'}],
+              userId:[{required: true, message: '证件所有人不能为空!'}],
+              noticeMonth:[ { pattern: new RegExp(/^([0-9]{1,2}|100)$/, "g"), message: '只能输入正整数!'}],
+              code:[{required: true, message: '使用者不能为空!'}],
+        },
         }
     },
     created () {
@@ -109,11 +115,20 @@ export default {
        this.beDate=''
      },
     handleSubmit(){
-      this.$nextTick(() => {
-        this.formState.beginDate = moment(this.beDate).format('YYYY-MM-DD');
-        this.formState.endDate = moment(this.enDate).format('YYYY-MM-DD');
-        if(this.defult == 'add'){
-           managementAdd(this.formState).then(res => {
+       this.$refs.form.validate(valid => {
+         if(valid){
+          if(this.beDate == '' || !this.beDate){
+            this.$message.error('请选择起始时间');
+            return;
+          }
+          if(this.enDate == '' || !this.enDate){
+            this.$message.error('请选择结束时间');
+            return;
+          }
+          this.formState.beginDate = moment(this.beDate).format('YYYY-MM-DD');
+          this.formState.endDate = moment(this.enDate).format('YYYY-MM-DD');
+          if(this.defult == 'add'){
+            managementAdd(this.formState).then(res => {
                     if (res.success) {
                        this.$message.success('新增成功');
                        this.close()
@@ -122,8 +137,8 @@ export default {
                       this.$message.error(res.message);
                     }
             })
-        }else {
-          managementEdit(this.formState).then(res => {
+          }else {
+            managementEdit(this.formState).then(res => {
                     if (res.success) {
                       this.$message.success('编辑成功');
                        this.close()
@@ -133,10 +148,12 @@ export default {
                        this.$message.error(res.message);
                     }
             })
-        }
+           }
+         }
+       })
+
                 
                
-      })
     }
     }
 }

src/views/system/modules/AddMaterialRegistration.vue

@@ -333,7 +333,7 @@ export default {
      },
     handleSubmit(){
          this.$refs.formRef.validate(valid => {
-          if(this.buyTime == ''){
+          if(this.buyTime == '' || !this.buyTime){
             this.$message.error('请选择购买时间');
             return;
           }