至今

src/components/FormUI/datePicker/index.vue

@@ -6,7 +6,7 @@
         ref="datepicker"
         :options="item.options || {}"
         locale="zh-CN"
-        :disabled="soFar || item.disabled || false"
+        :disabled="item.disabled || false"
         :range="item.range || false"
         :model-type="timestamp"
         :month-picker="month"
@@ -32,8 +32,8 @@
             variant="outlined"
             :density="item.dense || 'compact'"
             type="text"
-            :rules="soFar ? [] : rules"
-            :disabled="soFar || item.disabled"
+            :rules="rules"
+            :disabled="item.disabled"
             :style="{width: item.width}"
             :color="item.color || 'primary'"
             :label="item.label"
@@ -69,12 +69,14 @@ const emit = defineEmits(['update:modelValue', 'change'])
 const item = props.item
 
 const value = ref(props.modelValue)
-const soFar = ref(false)
 
-watch(() => item.value, (newVal) => {
-  value.value = newVal - 0
-  if (value.value) getFormatText()
-})
+watch(() => props.modelValue, 
+  (newVal) => {
+    modelValueUpDate(newVal)
+  },
+  // { immediate: true },
+  // { deep: true }
+)
 
 const timestamp = 'timestamp' // 固定不能变
 const formatText = ref('')
@@ -96,7 +98,15 @@ const handleClear = () => {
   emit('change', value.value)
 }
 
+
 const rules = ref(item.rules)
+watch(() => item.rules, 
+  (newVal) => {
+    rules.value = newVal
+  },
+  { immediate: true },
+  { deep: true }
+)
 const handleOpen = () => {
   rules.value = []
 }

src/views/recruit/personal/remuse/components/workExperience.vue

@@ -9,7 +9,23 @@
     <!-- 编辑-表单 -->
     <div v-if="isEdit" class="educExpItem-edit">
       <h4 class="color6 my-3 mx-2"> {{ titleStatus ? $t('common.edit') : $t('common.add') }}{{ $t('resume.workExperience') }}</h4>
-      <CtForm ref="CtFormRef" :items="formItems" style="width: 100%;"></CtForm>
+      <CtForm ref="CtFormRef" :items="formItems" style="width: 100%;">
+        <template #endTime="{ item }">
+          <div>
+            <v-checkbox-btn
+              v-model="item.soFar"
+              color="primary"
+              :label="$t('sys.soFar')"
+              class="ml-2"
+              :disabled="false"
+              :style="`line-height: ${item.dense === 'default' ? 56 : item.dense === 'comfortable' ? 48 : 40 }px;`"
+              style="width: 80px;"
+              hide-details
+              @update:modelValue="v => handleSoFarChange(v, item)"
+            ></v-checkbox-btn>
+          </div>
+        </template>
+      </CtForm>
       <div class="text-end mt-3">
         <v-btn class="half-button mr-3" variant="tonal" @click="isEdit = false">{{ $t('common.cancel') }}</v-btn>
         <v-btn color="primary" class="half-button" @click="handleSave">{{ $t('common.save') }}</v-btn>
@@ -83,6 +99,17 @@ const positionSearch = (name, init = '') => {
   item[item.itemTextName] = name
 }
 
+// 《至今》复选框事件
+const handleSoFarChange = (bool, item) => {
+  const opObj = formItems.value.options.find(e => e.key === item.key)
+  if (opObj) {
+    opObj.value = null
+    opObj.soFar = true
+    opObj.rules = bool ? [] : [v => !!v || '请选择结束时间']
+    opObj.disabled = bool ? true : false
+  }
+}
+
 const formItems = ref({
   options: [
     {
@@ -134,11 +161,11 @@ const formItems = ref({
     {
       type: 'datePicker',
       key: 'endTime',
+      slotName: 'endTime',
       dateType: 'month', // 时间类型 year month date time
       value: null,
       label: '结束时间 *',
       col: 6,
-      showSoFar: true,
       outlined: true,
       clearable: true,
       rules: [v => !!v || '请选择结束时间']
@@ -183,12 +210,24 @@ const handle = (item) => {
       if (e.canBeInputted) { // 特殊处理可输入下拉框
         dealCanBeInputtedValueAndLabel(e, item)
       }
+      else if (e.key === 'endTime') {
+        if (item[e.key]) {
+          e.value = item[e.key]; e.soFar = false; e.disabled = false; e.rules = [v => !!v || '请选择结束时间']
+        } else {
+          e.value = null; e.soFar = true; e.disabled = true; e.rules = []
+        }
+      }
       else if (e.type === 'datepicker') e.value = timesTampChange(item[e.key], 'Y-M')
       else if (item[e.key]) e.value = item[e.key]
     })
   } else { // 新增
     editId.value = null
-    formItems.value.options.forEach(e => e.value = e.default || null)
+    formItems.value.options.forEach(e => {
+      e.value = e.default || null
+      e.disabled = false
+      if (e.soFar) e.soFar = false
+      if (e.key === 'endTime') e.rules = [v => !!v || '请选择结束时间']
+    })
   }
   nextTick(() => {
     isEdit.value = true
@@ -204,7 +243,7 @@ const handleSave = async () => {
     if (e.canBeInputted) { // 特殊处理可输入下拉框
       dealCanBeInputtedSave(e, obj)
     }
-    else if (e.type === 'datepicker') obj[e.key] = getTimeStamp(e.value)
+    else if (e.type === 'datepicker' && e.value) obj[e.key] = getTimeStamp(e.value)
     else obj[e.key] = e.value
   })
   if (editId.value) obj.id = editId.value