f(zddcb):表单验证1

@@ -21,19 +21,23 @@
 				<tr>
 					<td colspan="2">行政区</td>
 					<td colspan="2">
-						<el-select
-							class="formSelect"
-							v-model="formData.xzqbsm"
-							@change="changeXzq(formData.xzqbsm)"
-						>
-							<el-option
-								v-for="item in $store.state.xzqList"
-								:key="item.bsm"
-								:label="item.mc"
-								:value="item.bsm"
-							>
-							</el-option>
-						</el-select>
+						<el-form :rules="rules" ref="ruleForm" :inline="true" >
+							<el-form-item prop="xzq">
+								<el-select
+										class="formSelect"
+										v-model="formData.xzqbsm"
+										@change="changeXzq(formData.xzqbsm)"
+								>
+									<el-option
+											v-for="item in $store.state.xzqList"
+											:key="item.bsm"
+											:label="item.mc"
+											:value="item.bsm"
+									>
+									</el-option>
+								</el-select>
+							</el-form-item>
+						</el-form>
 					</td>
 					<td colspan="2">地籍区</td>
 					<td colspan="2">
@@ -337,7 +341,7 @@
 			</table>
 
 			<div style="min-height: 40px;text-align: center;margin-top: 10px">
-				<el-button type="success" @click="updateZDxx">保存</el-button>
+				<el-button type="success" @click="updateZDxx()">保存</el-button>
 				<el-button type="primary" @click="submitZDxx">提交</el-button>
 			</div>
 		</div>
@@ -369,6 +373,30 @@ export default {
 	props: {},
 	data() {
 		return {
+            rules: {
+                hdmc: [
+                    { required: true, message: '请输入活动名称', trigger: 'blur' },
+                    { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
+                ],
+                xzq: [
+                    { required: true, message: '请选择活行政区', trigger: 'change' }
+                ],
+                date1: [
+                    { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
+                ],
+                date2: [
+                    { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
+                ],
+                type: [
+                    { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
+                ],
+                resource: [
+                    { required: true, message: '请选择活动资源', trigger: 'change' }
+                ],
+                desc: [
+                    { required: true, message: '请填写活动形式', trigger: 'blur' }
+                ]
+            },
 			rjl:'',
 			jzmd:'',
 			jzxg:'',
@@ -442,31 +470,43 @@ export default {
 				.catch((error) => {});
 		},
 		//修改宗地基本信息
-		updateZDxx() {
+		updateZDxx(formData) {
 			//获取权利性质数据
 			this.formData.list = this.$refs.qlxzModule.getQlxzDataList();
 			//判断容密高是否为区间值，如果是区间值，则将输入框的值赋予
 			this.formData.jyrjl = this.isInterval(this.formData.jyrjl) ? this.rjl : this.formData.jyrjl;
 			this.formData.jyjzmd = this.isInterval(this.formData.jyjzmd) ? this.jzmd : this.formData.jyjzmd;
 			this.formData.jyjzxg = this.isInterval(this.formData.jyjzxg) ? this.jzxg : this.formData.jyjzxg;
-			updateQjZdjbxx(this.formData)
-				.then((res) => {
-					if (res.code == 200) {
-						console.log(res);
-						this.$message({
-							message: '保存成功',
-							type: "success",
-						});
-						// 保存成功再次查询
-						this.getZdjbxxData();
-					} else {
-						this.$message({
-							message: res.message,
-							type: "warning",
-						});
-					}
-				})
-				.catch((error) => {});
+
+
+            this.$refs['ruleForm'].validate((valid) => {
+                debugger
+                if (valid) {
+                    alert('submit!');
+                    updateQjZdjbxx(this.formData)
+                        .then((res) => {
+                            if (res.code == 200) {
+                                console.log(res);
+                                this.$message({
+                                    message: '保存成功',
+                                    type: "success",
+                                });
+                                // 保存成功再次查询
+                                this.getZdjbxxData();
+                            } else {
+                                this.$message({
+                                    message: res.message,
+                                    type: "warning",
+                                });
+                            }
+                        })
+                        .catch((error) => {});
+                } else {
+                    alert("error submit")
+                    return false;
+                }
+            });
+
 		},
 		//提交宗地基本信息
 		submitZDxx(){
@@ -475,6 +515,7 @@ export default {
 				status:1,
 				type:"zd"
 			}
+
 			submit(data).then((res)=>{
 				if(res.code===200){
 					this.$message.success("提交完成！")