加上校验规则

src/features/examwork/ExamManagement/ExamEdit.vue

@@ -2,9 +2,15 @@
   <div>
     <el-tabs v-model="activeName" type="card">
       <el-tab-pane label="考试规则设置" name="first">
-        <el-form :model="form" label-width="170px" inline>
-          <el-row>
-            <el-form-item label="考试模式">
+        <el-form
+          ref="form1"
+          :model="form"
+          :rules="rules"
+          label-width="170px"
+          inline
+        >
+          <el-row>
+            <el-form-item label="考试模式" prop="mode">
               <ExamTypeSelect v-model="form.mode"></ExamTypeSelect>
             </el-form-item>
           </el-row>
@@ -159,7 +165,13 @@
       </el-tab-pane>
 
       <el-tab-pane label="监考设置" name="second">
-        <el-form :model="form" label-width="180px" inline>
+        <el-form
+          ref="form2"
+          :model="form"
+          :rules="rules"
+          label-width="180px"
+          inline
+        >
           <el-row>
             <h2>开考检测</h2>
             <el-form-item label="">
@@ -234,7 +246,10 @@
             </el-form-item>
           </el-row>
           <el-row v-if="form.inProcessLivenessVerify">
-            <el-form-item label="活体验证弹出时间段">
+            <el-form-item
+              label="活体验证弹出时间段"
+              prop="inProcessLivenessFixedRange"
+            >
               <MinuteInput
                 v-model.trim="form.inProcessLivenessFixedRange[0]"
                 style="width: 150px;"
@@ -343,6 +358,7 @@
 import ExamTypeSelect from "@/components/ExamTypeSelect";
 import MinuteInput from "@/components/MinuteInput";
 import { saveExam, getExamDetail } from "@/api/examwork-exam";
+import { isNumber } from "lodash-es";
 
 export default {
   name: "ExamEdit",
@@ -442,10 +458,41 @@ export default {
         monitorVideoSource: [],
         ipAllow: "",
       },
+      rules: {
+        mode: { required: true, message: "必填" },
+        inProcessLivenessFixedRange: {
+          validator: (rule, value) => {
+            return new Promise((resolve, reject) => {
+              const isNull = value === null;
+              if (
+                isNull ||
+                (value.length === 2 &&
+                  isNumber(value[0]) &&
+                  isNumber(value[1]) &&
+                  value[0] < value[1])
+              ) {
+                resolve(); // reject with error message
+              } else {
+                reject("reject");
+              }
+            });
+          },
+          message: "格式错误",
+        },
+      },
     };
   },
   methods: {
     async save() {
+      try {
+        await this.$refs.form1.validate();
+        await this.$refs.form2.validate();
+        // await this.$refs.form3.validate();
+      } catch (error) {
+        console.log(error);
+        return;
+      }
+
       await saveExam(this.form);
       this.$notify({ title: "保存成功", type: "success" });
       this.$router.back();