antd的RangePicker时间组件,当天之后的时间不能选择,选择范围30天


import React, { Component } from 'react'
import { DatePicker} from 'antd';
import moment from 'moment';
import 'moment/locale/zh-cn';
import locale from 'antd/lib/date-picker/locale/zh_CN';
const { RangePicker } = DatePicker;

export default class App extends Component {

    state = {
        selectDate: null,
    }

  // 时间选择相关

  /* 控制下单时间选择范围30天 */
   disabledTaskDate = (current) => {

    if (this.state.selectDate) {
      const offsetV = 2592000000 //30天转换成ms
      const selectV = this.state.selectDate.valueOf()
      const currentV = current.valueOf()
      if (this.calcAdd(currentV, offsetV) > moment().valueOf()) {
        return this.calcMinus(currentV, offsetV) >= selectV || current > moment().endOf('day')
          ? true
          : false
      } else {
        return this.calcMinus(currentV, offsetV) >= selectV || this.calcAdd(currentV, offsetV) <= selectV
          ? true
          : false
      }
    } else {
      return current && current > moment().endOf('day') // 当天以后的时间不能选择
    }
  }

  /* 选择任务时间变化 */
   onDateChange = (dates) => {
    if (!dates || !dates.length) return
    this.setSelectDate(dates[0])
  }

   onDateOpenChange = () => {
    this.setSelectDate(null)
    
  }

  setSelectDate = (args) => {
      this.setState({
        selectDate: args,
      })
  }


    /* 两个浮点数相减 */
  calcMinus = (num1, num2) => {
    num1 = Number(num1);
    num2 = Number(num2);
    if (isNaN(num1) || isNaN(num2)) return 0;
  
    const num1Digits = (num1.toString().split(".")[1] || "").length;
    const num2Digits = (num2.toString().split(".")[1] || "").length;
    const baseNum = Math.pow(10, Math.max(num1Digits, num2Digits));
    return (this.calcMulti(num1, baseNum) - this.calcMulti(num2, baseNum)) / baseNum;
  };

  calcAdd = (num1, num2) => {
    num1 = Number(num1);
    num2 = Number(num2);
    if (isNaN(num1) || isNaN(num2)) return 0;
  
    const num1Digits = (num1.toString().split(".")[1] || "").length;
    const num2Digits = (num2.toString().split(".")[1] || "").length;
    const baseNum = Math.pow(10, Math.max(num1Digits, num2Digits));
    return (this.calcMulti(num1, baseNum) + this.calcMulti(num2, baseNum)) / baseNum;
  }
  
    /* 两个浮点数相乘 */
    calcMulti = (num1, num2) => {
        num1 = Number(num1);
        num2 = Number(num2);
        if (isNaN(num1) || isNaN(num2)) return 0;

        const num1String = num1.toString();
        const num2String = num2.toString();
        const num1Digits = (num1String.split(".")[1] || "").length;
        const num2Digits = (num2String.split(".")[1] || "").length;
        const baseNum = Math.pow(10, num1Digits + num2Digits);
        return (
            (Number(num1String.replace(".", "")) *
            Number(num2String.replace(".", ""))) /
            baseNum
        );
    };


    render() {

        return (
            <div>
                <RangePickerdisabledDate={this.disabledTaskDate}
                    onCalendarChange={this.onDateChange}
                    onOpenChange={this.onDateOpenChange}
                    locale={locale}
                />
                
            </div>
        )
    }
}

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM