修改验证规则

src/views/HumanResources/form.vue

@@ -104,12 +104,6 @@
               </td>
             </tr>
             <tr class="description-tr">
-              <th class="description-label">评估结果</th>
-              <td class="description-content">
-                <el-form-item prop="assessmentResult">
-                  <el-input size="mini" v-model.trim="form.assessmentResult" placeholder="请输入评估结果"/>
-                </el-form-item>
-              </td>
               <th class="description-label">信息来源</th>
               <td class="description-content">
                 <el-form-item prop="sourceFrom">
@@ -125,8 +119,38 @@
                   </el-select>
                 </el-form-item>
               </td>
-              <th class="description-label">其他综合情况</th>
+              <th class="description-label">评估结果</th>
+              <td class="description-content" colspan="3">
+                <el-form-item prop="assessmentResult">
+                  <el-input size="mini" v-model.trim="form.assessmentResult" placeholder="请输入评估结果"/>
+                </el-form-item>
+              </td>
+            </tr>
+            <tr class="description-tr">
+              <th class="description-label">人员状态</th>
               <td class="description-content">
+                <el-form-item prop="status">
+                  <el-select size="mini" v-model.trim="form.status"
+                              clearable
+                              filterable
+                              placeholder="请选择人员状态">
+                    <el-option label="未录用"
+                                value="NOT_EMPLOYED"></el-option>
+                    <el-option label="面试中"
+                                value="INTERVIEWING"></el-option>
+                    <el-option label="储备"
+                                value="RESERVE"></el-option>
+                    <el-option label="全职"
+                                value="PART_TIME"></el-option>
+                    <el-option label="兼职"
+                                value="FULL_TIME"></el-option>
+                    <el-option label="离职"
+                                value="DIMISSION"></el-option>
+                  </el-select>
+                </el-form-item>
+              </td>
+              <th class="description-label">其他综合情况</th>
+              <td class="description-content" colspan="3">
                 <el-form-item prop="otherComment">
                   <el-input size="mini" v-model.trim="form.otherComment" placeholder="请输入其他综合情况"/>
                 </el-form-item>
@@ -145,7 +169,10 @@
             <tr class="description-tr">
               <th class="description-label">入职日期</th>
               <td class="description-content">
-                <el-form-item prop="entryDate">
+                <el-form-item
+                  prop="entryDate"
+                  :rules="{ required: propRequred, message: '请输入入职日期', trigger: 'blur' }"
+                >
                   <el-date-picker
                     type="date"
                     placeholder="选择入职日期"
@@ -156,7 +183,10 @@
               </td>
               <th class="description-label">职位</th>
               <td class="description-content">
-                <el-form-item prop="position">
+                <el-form-item
+                  prop="position"
+                  :rules="{ required: propRequred, message: '请输入职位', trigger: 'blur' }"
+                >
                   <el-select v-model.trim="form.position"
                             clearable
                             filterable
@@ -173,7 +203,10 @@
               </td>
               <th class="description-label">分部</th>
               <td class="description-content">
-                <el-form-item prop="organId">
+                <el-form-item
+                  prop="organId"
+                  :rules="{ required: propRequred, message: '请选择分部', trigger: 'blur' }"
+                >
                   <el-select v-model.trim="form.organId"
                       placeholder='请选择分部'
                       clearable
@@ -193,7 +226,10 @@
             <tr class="description-tr">
               <th class="description-label">员工类型</th>
               <td class="description-content">
-                <el-form-item prop="isProbationPeriod">
+                <el-form-item
+                  prop="isProbationPeriod"
+                  :rules="{ required: propRequred, message: '请选择员工类型', trigger: 'blur' }"
+                >
                   <el-select size="mini" v-model.trim="form.isProbationPeriod"
                               clearable
                               filterable
@@ -205,47 +241,12 @@
                   </el-select>
                 </el-form-item>
               </td>
-              <th class="description-label">人员状态</th>
-              <td class="description-content">
-                <el-form-item prop="status">
-                  <el-select size="mini" v-model.trim="form.status"
-                              clearable
-                              filterable
-                              placeholder="请选择人员状态">
-                    <el-option label="未录用"
-                                value="NOT_EMPLOYED"></el-option>
-                    <el-option label="面试中"
-                                value="INTERVIEWING"></el-option>
-                    <el-option label="储备"
-                                value="RESERVE"></el-option>
-                    <el-option label="全职"
-                                value="PART_TIME"></el-option>
-                    <el-option label="兼职"
-                                value="FULL_TIME"></el-option>
-                    <el-option label="离职"
-                                value="DIMISSION"></el-option>
-                  </el-select>
-                </el-form-item>
-              </td>
-              <th class="description-label">离职日期</th>
-              <td class="description-content">
+              <th class="description-label">证件号码</th>
+              <td class="description-content" colspan="3">
                 <el-form-item
-                  prop="resignationDate"
-                  :rules="{ required: form.status === 'DIMISSION', message: '请选择离职日期', trigger: 'blur' }"
+                  prop="idCard"
+                  :rules="{ required: propRequred, message: '请输入证件号码', trigger: 'blur' }"
                 >
-                  <el-date-picker
-                    type="date"
-                    placeholder="选择离职日期"
-                    size="mini"
-                    v-model="form.resignationDate"
-                  />
-                </el-form-item>
-              </td>
-            </tr>
-            <tr class="description-tr">
-              <th class="description-label">证件号码</th>
-              <td class="description-content" colspan="5">
-                <el-form-item prop="idCard">
                   <el-input size="mini" v-model="form.idCard" placeholder="请输入证件号码"/>
                 </el-form-item>
               </td>
@@ -253,13 +254,19 @@
             <tr class="description-tr">
               <th class="description-label">年龄</th>
               <td class="description-content">
-                <el-form-item prop="age">
+                <el-form-item
+                  prop="age"
+                  :rules="{ required: propRequred, message: '请输入年龄', trigger: 'blur' }"
+                >
                   <el-input v-model="form.age" size="mini" placeholder="请输入年龄"/>
                 </el-form-item>
               </td>
               <th class="description-label">性别</th>
-              <td class="description-content" colspan="3">
-                <el-form-item prop="gender">
+              <td class="description-content">
+                <el-form-item
+                  prop="gender"
+                  :rules="{ required: propRequred, message: '请选择性别', trigger: 'blur' }"
+                >
                   <el-select size="mini" v-model.trim="form.gender"
                               clearable
                               filterable
@@ -271,17 +278,37 @@
                   </el-select>
                 </el-form-item>
               </td>
+              <th class="description-label">离职日期</th>
+              <td class="description-content">
+                <el-form-item
+                  prop="resignationDate"
+                  :rules="{ required: form.status === 'DIMISSION', message: '请选择离职日期', trigger: 'blur' }"
+                >
+                  <el-date-picker
+                    type="date"
+                    placeholder="选择离职日期"
+                    size="mini"
+                    v-model="form.resignationDate"
+                  />
+                </el-form-item>
+              </td>
             </tr>
             <tr class="description-tr">
               <th class="description-label">开户行</th>
               <td class="description-content">
-                <el-form-item prop="bankAddress">
+                <el-form-item
+                  prop="bankAddress"
+                  :rules="{ required: propRequred, message: '请输入开户行', trigger: 'blur' }"
+                >
                   <el-input size="mini" v-model="form.bankAddress" placeholder="请输入开户行"/>
                 </el-form-item>
               </td>
               <th class="description-label">银行卡号</th>
               <td class="description-content" colspan="3">
-                <el-form-item prop="bankCardNo">
+                <el-form-item
+                  prop="bankCardNo"
+                  :rules="{ required: propRequred, message: '请输入银行卡号', trigger: 'blur' }"
+                >
                   <el-input size="mini" v-model="form.bankCardNo" placeholder="请输入银行卡号"/>
                 </el-form-item>
               </td>
@@ -289,19 +316,31 @@
             <tr class="description-tr">
               <th class="description-label">紧急联系人姓名</th>
               <td class="description-content">
-                <el-form-item prop="emergencyContactName">
+                <el-form-item
+                  prop="emergencyContactName"
+                  :rules="{ required: propRequred, message: '请输入紧急联系人姓名', trigger: 'blur' }"
+                >
                   <el-input size="mini" v-model.trim="form.emergencyContactName" placeholder="请输入紧急联系人姓名"/>
                 </el-form-item>
               </td>
               <th class="description-label">紧急联系人关系</th>
               <td class="description-content">
-                <el-form-item prop="emergencyContactRelation">
+                <el-form-item
+                  prop="emergencyContactRelation"
+                  :rules="{ required: propRequred, message: '请输入紧急联系人关系', trigger: 'blur' }"
+                >
                   <el-input size="mini" v-model.trim="form.emergencyContactRelation" placeholder="请输入紧急联系人关系"/>
                 </el-form-item>
               </td>
               <th class="description-label">紧急联系人电话</th>
               <td class="description-content">
-                <el-form-item prop="emergencyContactPhone">
+                <el-form-item
+                  prop="emergencyContactPhone"
+                  :rules="[
+                    { required: propRequred, message: '请输入紧急联系人电话', trigger: 'blur' },
+                    { min: 11, max: 11, message: '请输入正确的手机号码', trigger: 'blur' }
+                  ]"
+                >
                   <el-input size="mini" v-model.trim="form.emergencyContactPhone" minlength="11" maxlength="11" placeholder="请输入紧急联系人电话"/>
                 </el-form-item>
               </td>
@@ -360,53 +399,24 @@ export default {
         educations: [{level: '', school: '', year: ''}]
       },
       rules: {
-        age: [
-          { required: true, message: '请输入年龄', trigger: 'blur' },
-        ],
-        bankAddress: [
-          { required: true, message: '请输入开户行', trigger: 'blur' },
-        ],
-        bankCardNo: [
-          { required: true, message: '请输入卡号', trigger: 'blur' },
-        ],
         birthdate: [
           { required: true, message: '请输入生日', trigger: 'blur' },
         ],
         sourceFrom: [
           { required: true, message: '请输入信息来源', trigger: 'blur' },
         ],
-        emergencyContactName: [
-          { required: true, message: '请输入紧急联系人姓名', trigger: 'blur' },
-        ],
-        emergencyContactPhone: [
-          { required: true, message: '请输入紧急联系人电话', trigger: 'blur' },
-        ],
-        emergencyContactRelation: [
-          { required: true, message: '请输入紧急联系人关系', trigger: 'blur' },
-        ],
-        entryDate: [
-          { required: true, message: '请输入入职日期', trigger: 'blur' },
-        ],
-        gender: [
-          { required: true, message: '请选择性别', trigger: 'blur' },
-        ],
-        idCard: [
-          { required: true, message: '请输入证件号码', trigger: 'blur' },
-        ],
         intentionCity: [
           { required: true, message: '请输入工作意向', trigger: 'blur' },
         ],
         status: [
           { required: true, message: '请选择员工状态', trigger: 'blur' },
         ],
-        isProbationPeriod: [
-          { required: true, message: '请选择员工类型', trigger: 'blur' },
-        ],
         liveCity: [
           { required: true, message: '请输入所在城市', trigger: 'blur' },
         ],
         mobileNo: [
           { required: true, message: '请输入手机号', trigger: 'blur' },
+          { min: 11, max: 11, message: '请输入正确的手机号码', trigger: 'blur' }
         ],
         otherComment: [
           { required: true, message: '请输入其他综合情况', trigger: 'blur' },
@@ -420,12 +430,6 @@ export default {
         subjectIdList: [
           { required: true, message: '请选择声部', trigger: 'blur' },
         ],
-        organId: [
-          { required: true, message: '请选择分部', trigger: 'blur' },
-        ],
-        // assessmentResult: [
-        //   { required: true, message: '请输入评估结果', trigger: 'blur' },
-        // ],
       }
     }
   },
@@ -437,6 +441,11 @@ export default {
   mounted() {
     this.updateData()
   },
+  computed: {
+    propRequred() {
+      return this.form.status === 'PART_TIME' || this.form.status === 'FULL_TIME' || this.form.status === 'DIMISSION'
+    }
+  },
   methods: {
     updateData() {
       if (this.detail) {