排班接口对接

zhangwencui

2 天以前 f7258ebfaa7775f89c727a5356b851030a61ea37

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

@@ -18,7 +18,7 @@
                        placeholder="请选择部门"
                        check-strictly
                        style="width: 100%"
                        :disabled="operationType === 'view'" />
                        :disabled="['edit', 'view'].includes(operationType)" />
      </el-form-item>
      <!-- 地点信息 -->
      <!-- <el-form-item label="地点名称"
@@ -28,6 +28,18 @@
                  :disabled="operationType === 'view'" />
      </el-form-item> -->
      <!-- 打卡范围 -->
      <el-form-item label="班次"
                    prop="shift">
        <el-select v-model="form.shift"
                   placeholder="请选择班次"
                   :disabled="operationType === 'view'"
                   style="width: 100%">
          <el-option v-for="item in shifts_list"
                     :key="item.value"
                     :label="item.label"
                     :value="item.value" />
        </el-select>
      </el-form-item>
      <el-form-item label="打卡范围(m)"
                    prop="radius">
        <el-input-number v-model="form.radius"
@@ -43,13 +55,13 @@
        <div class="map-container">
          <div class="map-header"
               style="margin-bottom: 10px">
            <el-button @click="getCurrentLocation">
            <!-- <el-button @click="getCurrentLocation">
              <el-icon>
                <Position />
              </el-icon>
              当前位置
            </el-button>
            <span style="margin-left: 10px; color: #909399;font-size: 12px;">点击地图选择位置</span>
            </el-button> -->
            <!-- <span style="margin-left: 10px; color: #909399;font-size: 12px;">点击地图选择位置</span> -->
          </div>
          <div id="map-container"
               class="map"
@@ -89,6 +101,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>
@@ -112,6 +127,7 @@
  import { Position } from "@element-plus/icons-vue";
  import { deptTreeSelect } from "@/api/system/user.js";
  import { addAttendanceRule } from "@/api/personnelManagement/attendanceRules.js";
  import { useDict } from "@/utils/dict";

  const props = defineProps({
    modelValue: {
@@ -127,6 +143,7 @@
      default: () => ({}),
    },
  });
  // const pickerOptions = ref({ minTime: form.value.startAt });

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

@@ -136,10 +153,13 @@
  });

  const dialogTitle = computed(() => {
    if (props.operationType === "add") return "新增打卡规则";
    if (props.operationType === "edit") return "编辑打卡规则";
    return "查看打卡规则";
    if (props.operationType === "add") return "新增班次";
    if (props.operationType === "edit") return "编辑班次";
    return "查看班次";
  });

  // 获取班次字典值
  const { shifts_list } = useDict("shifts_list");

  // 表单数据
  const formRef = ref();
@@ -152,6 +172,7 @@
    radius: 100,
    startAt: "09:00",
    endAt: "18:00",
    shift: "",
  });

  // 表单验证规则
@@ -162,9 +183,31 @@
    ],
    longitude: [{ required: true, message: "请选择打卡位置", trigger: "blur" }],
    latitude: [{ required: true, message: "请选择打卡位置", trigger: "blur" }],
    shift: [{ required: true, message: "请选择班次", trigger: "change" }],
    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 +398,16 @@
    }
  );

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

  // 监听弹窗显示
  watch(
    () => dialogVisible.value,
@@ -370,6 +423,7 @@
          radius: 100,
          startAt: "09:00",
          endAt: "18:00",
          shift: "",
        });

        // 如果是编辑或查看，填充数据