上下班时间限制校验

zhangwencui

昨天 ab8c184a629b4e92f7b472e2e5cbb870120afee4

上下班时间限制校验

 src/views/personnelManagement/attendanceCheckin/checkinRules/components/form.vue

@@ -89,6 +89,9 @@
        <el-time-picker v-model="form.endAt"
                        format="HH:mm"
                        value-format="HH:mm"
                        :picker-options="{
      minTime: form.startAt
    }"
                        placeholder="请选择下班时间"
                        :disabled="operationType === 'view'" />
      </el-form-item>
@@ -127,6 +130,7 @@
      default: () => ({}),
    },
  });
  // const pickerOptions = ref({ minTime: form.value.startAt });

  const emit = defineEmits(["update:modelValue", "close"]);

@@ -164,7 +168,28 @@
    latitude: [{ required: true, message: "请选择打卡位置", trigger: "blur" }],
    radius: [{ required: true, message: "请输入打卡范围", trigger: "blur" }],
    startAt: [{ required: true, message: "请选择上班时间", trigger: "change" }],
    endAt: [{ required: true, message: "请选择下班时间", trigger: "change" }],
    endAt: [
      { required: true, message: "请选择下班时间", trigger: "change" },
      {
        validator: (rule, value, callback) => {
          if (form.startAt && value) {
            const startParts = form.startAt.split(":");
            const endParts = value.split(":");
            const startTime =
              parseInt(startParts[0]) * 60 + parseInt(startParts[1]);
            const endTime = parseInt(endParts[0]) * 60 + parseInt(endParts[1]);
            if (endTime <= startTime) {
              callback(new Error("下班时间不能早于上班时间"));
            } else {
              callback();
            }
          } else {
            callback();
          }
        },
        trigger: "change",
      },
    ],
  };

  // 部门选项
@@ -355,6 +380,16 @@
    }
  );

  // 监听上班时间变化，触发下班时间校验
  watch(
    () => form.startAt,
    () => {
      if (formRef.value && form.endAt) {
        formRef.value.validateField("endAt");
      }
    }
  );

  // 监听弹窗显示
  watch(
    () => dialogVisible.value,