index.js 3.96 KB
/* eslint-disable */
import React, { useRef } from "react";
import moment from "moment";
import { Modal, DatePicker, message } from "antd";
import * as commonUtils from "@/utils/utils";

import styles from "./index.less";

const TBTimeModalComponent = props => {
  const { visible, title, value, record = {}, sName } = props;
  if (!visible) return "";

  const flag = useRef(null);

  return (
    <Modal
      width={600}
      style={{
        top: "calc(50% - 400px)"
      }}
      className="mesCommonModal"
      title={title}
      open={visible}
      onCancel={props.onCancel}
      footer={null}
    >
      <div className={styles.tbTime}>
        <DatePicker
          open={true} // 控制常驻显示
          showTime={{
            format: "HH:mm"
          }}
          allowClear={false}
          format="YYYY-MM-DD HH:mm"
          value={commonUtils.isEmpty(value) ? null : moment(value)}
          onCalendarChange={() => {}} // 必须提供一个空函数以避免警告
          style={{
            input: {
              display: "none"
            }
          }}
          onOk={() => {
            setTimeout(() => {
              if (!flag.current) {
                props.onCancel();
              }
            }, 100);
          }}
          onChange={(newValue, dateString) => {
            flag.current = true;
            if (
              commonUtils.isNotEmptyObject(dateString) &&
              sName === "tStartDate" &&
              commonUtils.isNotEmptyObject(record.tEndDate)
            ) {
              if (!newValue?.isBefore(moment(record.tEndDate))) {
                message.warning(
                  "开始时间不能大于结束时间, 请重新选择开始时间!",
                  3
                );
                return;
              }
            } else if (
              commonUtils.isNotEmptyObject(dateString) &&
              sName === "tEndDate" &&
              commonUtils.isNotEmptyObject(record.tStartDate)
            ) {
              if (!newValue?.isAfter(moment(record.tStartDate))) {
                message.warning(
                  "结束时间不能小于开始时间, 请重新选择开始时间!",
                  3
                );
                return;
              }
            }

            const userinfo = commonUtils.getAppData("userinfo");
            let currentShift = "早班";
            let startOfDay = moment()
              .startOf("day")
              .hours(8)
              .minutes(0)
              .seconds(0);
            let endOfDay = moment()
              .startOf("day")
              .hours(20)
              .minutes(0)
              .seconds(59);
            if (userinfo.sShift === 2 || userinfo.sShift === "2") {
              currentShift = "晚班";
              startOfDay = moment()
                .startOf("day")
                .hours(20)
                .minutes(0)
                .seconds(0);
              endOfDay = moment()
                .add(1, "day")
                .startOf("day")
                .hours(8)
                .minutes(0)
                .seconds(59);
            }

            // if (newValue.isBefore(startOfDay) || newValue.isAfter(endOfDay)) {
            //   message.warning(
            //     `当前是${currentShift},${
            //       sName === "tStartDate" ? "起始时间" : "结束时间"
            //     }只能在${
            //       currentShift === "早班"
            //         ? "【当天8:00-20:00】之间"
            //         : "【当天20:00-次日08:00】之间"
            //     }!`,
            //     3
            //   );
            //   return;
            // }

            let dateStringNew = dateString;
            if (dateString) {
              dateStringNew = `${dateString}:00`;
            }
            props.handleSelectOptionEvent(newValue, dateStringNew);
            props.onCancel();
          }} /*   数据改变回带到父组件   */
        />
      </div>
    </Modal>
  );
};

export default TBTimeModalComponent;