校验补充完善

src/views/fillIn.vue

@@ -21,7 +21,7 @@
           </el-col>
           <el-col :span="12">
             <el-form-item label="手机号码" prop="mobilePhone">
-              <el-input placeholder="请输入手机号码" v-model="form.mobilePhone" type="number" min="1"></el-input>
+              <el-input placeholder="请输入手机号码" v-model="form.mobilePhone"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -36,12 +36,14 @@
           </el-col>
           <el-col :span="12">
             <el-form-item class="el-form-pack-12" label="访客部门" prop="intervieweeDepartId">
-              <el-input placeholder="请选择访客部门" v-model="form.intervieweeDepartId"></el-input>
+              <el-select v-model="form.intervieweeDepartId" placeholder="请选择" style="width:100%">
+                <el-option v-for="item in departData" :key="item.departCode" :label="item.departName" :value="item.departCode" />
+              </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="被访人手机号码" prop="intervieweeMobile">
-              <el-input placeholder="请输入被访人手机号码" v-model="form.intervieweeMobile" type="number" min="1"></el-input>
+              <el-input placeholder="请输入被访人手机号码" v-model="form.intervieweeMobile"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="16">
@@ -59,8 +61,8 @@
           </el-col>
         </el-row>
       </el-form>
-      <el-button type="primary" style="width: 20%; margin: 20px 40% 0" size="large">
-        <span @click="submitForm()">提 交</span>
+      <el-button type="primary" style="width: 20%; margin: 20px 40% 0" size="large"  @click="submitForm()">
+        <span>提 交</span>
       </el-button>
     </div>
   </div>
@@ -82,20 +84,31 @@ const { proxy } = getCurrentInstance();
 
 /*----------------------------------变量声明-----------------------------------*/
 const formRef = ref(null); //refs
+const departData = ref([
+  {
+    departCode: 1,
+    departName: "部门1",
+  },
+  {
+    departCode: 2,
+    departName: "部门2",
+  },
+]);
 const data = reactive({
   form: {
     idType: 0,
     visitorRegisterType: 0,
     reservedField1: 1,
-    visitorStartTime: "2022-01-01 00:00:00",
-    vistorEndTime: "2022-01-02 00:00:00",
+    visitorStartTime: '',
+    vistorEndTime: '',
   },
   rules: {
     // set: [{ required: true, message: "请选择性别", trigger: "blur" }],
-    // visitorName: [{ required: true, message: "请输入访客名称", trigger: "blur" }],
-    // identityCardNo: [{ required: true, message: "请输入访客身份证号码", trigger: "blur" }],
+    visitorName: [{ required: true, message: "请输入访客名称", trigger: "blur" }],
+    identityCardNo: [{ required: true, message: "请输入访客身份证号码", trigger: "blur" }],
     // mobilePhone: [{ required: true, message: "请输入访客手机号码", trigger: "blur" }],
-    intervieweeMobile: [{ required: true, message: "请输入被访人手机号码", trigger: "blur" }],
+    mobilePhone: proxy.regex.Phone(true, "请输入手机号码"),
+    intervieweeMobile: proxy.regex.Phone(true, "请输入被访人手机号码"),
     intervieweeDepartId: [{ required: true, message: "请选择被访部门", trigger: "change" }],
   },
   dateRange: [],
@@ -120,11 +133,11 @@ function getData() {
   }, 1000);
 }
 
-
 function submitForm() {
+  console.log(form.value)
   proxy.$refs["formRef"].validate((valid) => {
     if (valid) {
-      alert(1)
+  console.log(form.value)
       // var param = {};
       // Object.keys(form.value).forEach((key) => {
       //   param[key] = form.value[key];
@@ -153,8 +166,6 @@ function submitForm() {
   });
 }
 
-
-
 onMounted(() => {
   getData();
 });
@@ -186,13 +197,13 @@ onUnmounted(() => {
 <style>
 .fillIn .el-form .el-form-item__label {
   font-size: 1.6rem;
-  line-height: 4vh;
+  /* line-height: 4vh; */
 }
 .fillIn .el-input__inner {
   font-size: 1.6rem;
 }
 .fillIn .el-input__wrapper {
-  height: 4vh;
+  /* height: 4vh; */
   width: 60% !important;
 }
 .fillIn .el-form-item {