a-date-picker时间组件时间不可选,精确到时分秒

需求:格式 YYYY-MM-DD HH:mm:ss 时间默认填充 00:00:00;不可选在当前时间以前
的日期时间,举例:当前时间 2024 年 2 月 2 日 16:40:01 ,如提交日期为 2024 年 2 月 2 日00:00:00,属于不可提交当前时间之前的日期时间。

实现效果
在这里插入图片描述

<a-date-picker
  format="YYYY-MM-DD HH:mm:ss"
  valueFormat="YYYY-MM-DD HH:mm:ss"
  :disabled-date="disabledDate"
  :disabled-time="disabledDateTime"
  :show-time="true"
  :disabled="!!id"
  @panelChange="handlePanelChange"
  @change="handleDateChange"
  v-decorator="['effectiveTime', {rules:[{required: true,message:'请选择申报限重申报日期'}]}]"
  placeholder="请选择申报限重申报日期"
/>
range(start, end) {
      const result = []
      for (let i = start; i < end; i++) {
        result.push(i)
      }
      return result
    },
    disabledDate(current) {
      // 不能选当前时间以前的时间
      return current && current < moment()
    },
    disabledDateTime() {
      // 判断已选日期是否是今天,如果是今天,设置时分秒可选范围为当前的时间,否则都可选
      const today = moment().format('YYYY-MM-DD')
      let h = 0
      let m = 0
      let s = 0
      // 判断已选时间是否为今天
      if (this.currentDate && moment(this.currentDate.valueOf()).format('YYYY-MM-DD') === today) {
        // 所选小时
        const ch = moment(this.currentDate.valueOf()).hour()
        // 所选分钟
        const cm = moment(this.currentDate.valueOf()).minute()
        // 今天的当前小时
        h = moment().hour()
        if (ch === h) {
          m = moment().minute()
        }
        if (ch === h && cm === m) {
          s = moment().second()
        }
      }
      return {
        disabledHours: () => this.range(0, h),
        disabledMinutes: () => this.range(0, m),
        disabledSeconds: () => this.range(0, s)
      }
    },
    // 面板变更时记录下所选时间
    handlePanelChange(value, mode) {
      this.currentDate = value
    },
    // 时间发生变化时回调
    handleDateChange (value, mode) {
      this.currentDate = value
    },
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

前端李易安

打赏1元鼓励作者

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值