f(zddcb):表单验证1

@@ -21,6 +21,8 @@
 				<tr>
 					<td colspan="2">行政区</td>
 					<td colspan="2">
+						<el-form :rules="rules" ref="ruleForm" :inline="true" >
+							<el-form-item prop="xzq">
 								<el-select
 										class="formSelect"
 										v-model="formData.xzqbsm"
@@ -34,6 +36,8 @@
 									>
 									</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,13 +470,19 @@ 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;
+
+
+            this.$refs['ruleForm'].validate((valid) => {
+                debugger
+                if (valid) {
+                    alert('submit!');
                     updateQjZdjbxx(this.formData)
                         .then((res) => {
                             if (res.code == 200) {
@@ -467,6 +501,12 @@ export default {
                             }
                         })
                         .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("提交完成！")