校验优化

components/positionItem/components/requirement.vue

@@ -11,17 +11,17 @@
 			<uni-forms-item label="工作经验" name="expType" required>
 				<uni-data-picker popup-title="请选择工作经验" v-model="formData.expType" :localdata="dictObj?.exp_extend || []" :clear-icon="false" :map="{ text: 'label', value: 'value'}"></uni-data-picker>
 			</uni-forms-item>
-      <uni-forms-item label="最低薪资" name="payFrom" :required="!salaryDisabled" label-width="90px">
+      <uni-forms-item label="最低薪资" name="payFrom" :required="salary?.length === 0" label-width="90px">
 				<view class="d-flex">
-          <uni-number-box v-model="formData.payFrom" :disabled="salaryDisabled" :min="1" :max="999999999" :step="salaryStep" :width="100" @change="payChange"></uni-number-box>
+          <uni-number-box v-model="formData.payFrom" :disabled="salary?.length > 0" :min="1" :max="999999999" :step="salaryStep" :width="100" @change="payChange"></uni-number-box>
           <uni-data-checkbox v-model="salary" multiple :localdata="[{ text: '薪资面议', value: 1 }]" selectedColor="#00B760" class="ss-m-l-20" @change="salaryCheckboxChange"></uni-data-checkbox>
         </view>
 			</uni-forms-item>
-      <uni-forms-item label="最高薪资" name="payTo" :required="!salaryDisabled" label-width="90px">
-        <uni-number-box v-model="formData.payTo" :disabled="salaryDisabled" :min="payToMin" :max="999999999" :step="salaryStep" :width="100"></uni-number-box>
+      <uni-forms-item label="最高薪资" name="payTo" :required="salary?.length === 0" label-width="90px">
+        <uni-number-box v-model="formData.payTo" :disabled="salary?.length > 0" :min="payToMin" :max="999999999" :step="salaryStep" :width="100"></uni-number-box>
 			</uni-forms-item>
-			<uni-forms-item label="计薪时段" name="payUnit" :required="!salaryDisabled">
-				<uni-data-picker popup-title="请选择计薪时段" :placeholder="salaryDisabled ? '薪资面议' : '请选择'" v-model="formData.payUnit" :readonly="Boolean(salary?.length)" :localdata="dictObj?.payUnit || []" :clear-icon="false" :map="{ text: 'label', value: 'value'}"></uni-data-picker>
+			<uni-forms-item label="计薪时段" name="payUnit" :required="salary?.length === 0">
+				<uni-data-picker popup-title="请选择计薪时段" v-model="formData.payUnit" :placeholder="salary?.length > 0 ? '薪资面议' : '请选择'" :readonly="salary?.length > 0" :localdata="dictObj?.payUnit || []" :clear-icon="false" :map="{ text: 'label', value: 'value'}"></uni-data-picker>
 			</uni-forms-item>
       <uni-forms-item label="工作城市" name="areaId" required label-width="90px">
 				<uni-data-picker popup-title="请选择工作城市" v-model="formData.areaId" :localdata="dictObj?.areaTreeData_extend || []" :clear-icon="false" :map="{ text: 'name', value: 'id'}"></uni-data-picker>
@@ -54,7 +54,7 @@
 	</view>
 </template>
 <script setup>
-import { ref, unref, watch, computed } from 'vue'
+import { ref, unref, watch } from 'vue'
 import { dictObj } from '@/utils/position.js'
 import { getEnterprisePubJobTypePermission } from '@/api/new/position'
 import portrait from './portrait.vue'
@@ -82,18 +82,26 @@ watch(
   () => props.data, 
   (newVal) => {
     salary.value = newVal?.payUnit === null ? [1] : []
+    if (!salary.value?.length) {
+      formData.value.payFrom = null
+      formData.value.payTo = null
+      formData.value.payUnit = null
+    }
   },
   { immediate: true },
   { deep: true }
 )
 
-const salaryDisabled = computed(() => {
-  return Boolean(salary?.value.length)
-})
+// const salaryDisabled = computed(() => {
+//   return Boolean(salary?.value.length)
+// })
 
 const salaryCheckboxChange = (e) => {
-  // const bool = e.detail.value.length ? e.detail.value[0] : ''
-  // salary.value = bool ? [1] : []
+  const bool = e.detail.value.length ? e.detail.value[0] : ''
+  salary.value = bool ? [1] : []
+  formData.value.payFrom = null
+  formData.value.payTo = null
+  formData.value.payUnit = null
 }
 
 const rules = {
@@ -115,12 +123,11 @@ const rules = {
   // 薪资
 	payFrom: {
 		rules: [
-      {
-        required: true,
-        errorMessage: '请填写最低薪资',
-      },
       {
         validateFunction: function (rule, value, data, callback) {
+          if (!salary?.value.length) {
+            callback('请填写最低薪资')
+          }
           if (value < 1) {
             callback('数额不得小于1')
           }
@@ -140,14 +147,10 @@ const rules = {
 	},
 	payTo: {
 		rules: [
-      {
-        required: !salaryDisabled.value,
-        errorMessage: '请填写最高薪资',
-      },
       {
         validateFunction: function (rule, value, data, callback) {
-          if (salaryDisabled.value) {
-            return true
+          if (!salary?.value.length) {
+            callback('请填写最高薪资')
           }
           if (value < 1) {
             callback('数额不得小于1')
@@ -157,9 +160,6 @@ const rules = {
       },
       {
         validateFunction: function (rule, value, data, callback) {
-          if (salaryDisabled.value) {
-            return true
-          }
           if (!formData.value?.payFrom || (Number(value) > formData.value?.payFrom ? Number(formData.value?.payFrom) : 0)) {
             return true
           } else {
@@ -170,10 +170,21 @@ const rules = {
     ]
 	},
 	payUnit: {
-		rules: [{required: !salaryDisabled.value, errorMessage: '请选择计薪时段' }]
+		// rules: [{required: true, errorMessage: '请选择计薪时段' }]
+		rules: [
+      {
+        validateFunction: function (rule, value, data, callback) {
+          if (!salary?.value.length) {
+            callback('请选择计薪时段')
+          }
+          return true
+        }
+      }
+      
+    ]
 	}
 }
-
+// const salaryRules = {}
 
 const jobType = ref([])
 const getJobTypeList = async () => {