ant-design-vue组件中的<a-date-picker>选择器设置过去时间不能选择精准到小时

遇到了需求,就是,选择时间的时候已经过去的时间是不让选择的,只能选择未来时间。

我看了看官方文档,是有配置可以直接设置的,但是设置完后,遇到了几个问题就是你点击完日期后小时默认给的是现在时间的小时,但是如果现在是14:02,那么你给个14时明显不对,因为分钟和秒数自动补的是0,所以小时只能默认给15这样才对。

<a-date-picker
            style="width: 100%;"
            v-model:value="modalForm.next_follow_up_time"
            format="YYYY-MM-DD HH时"
            value-format="YYYY-MM-DD HH:00:00"
            allow-clear
            placeholder=""
            :disabled-date="disabledDate"
            :disabled-time="disabledTime"
            :showNow="false"
            :show-time="{
              defaultValue: defaultTime,
            }"
          />
function disabledDate(current) {
  if (!current) return false;
  const startOfToday = dayjs().startOf('day');
  return current.isBefore(startOfToday);
}
function disabledTime(currentDate) {
  const now = dayjs();
  if (!currentDate) {
    return {
      disabledHours: () => Array.from({ length: 24 }).map((_, index) => index),
    };
  }
  if (currentDate.isSame(now, 'day')) {
    const currentHour = now.hour() + 1;
    return {
      disabledHours: () => Array.from({ length: currentHour }).map((_, index) => index),
    };
  }
  return {};
}
const defaultTime = computed(() => {
  const now = dayjs();
  const nextHour = (now.hour() + 1) % 24;
  return dayjs().set('hour', nextHour).minute(0).second(0);
});

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值