React Native预约时段筛选问题:排除重叠可用时间
问题分析与解决方案
你的代码核心问题有两个:
- 时间重叠的判断逻辑混乱,完全没正确识别出冲突时段
- 没有考虑90分钟的服务时长——你需要确保从当前可选时段开始的整个服务周期都不会和已有预约重叠,而不是只检查当前时间点是否在某个预约区间内
修正后的代码
const updateAvailableTimes = ( bookings: Array<{ stDate: string; enDate: string }>, availables: Array<string>, currDate: string, ) => { const newAvailables: string[] = []; const serviceLengthInMinutes = 90; // 服务时长1小时30分钟 for (const ava of availables) { const currStart = moment(`${currDate} ${ava}`, 'YYYY-MM-DD HH:mm'); const currEnd = moment(currStart).add(serviceLengthInMinutes, 'minutes'); let isConflict = false; for (const booking of bookings) { const bookingStart = moment(booking.stDate, 'YYYY-MM-DD HH:mm'); const bookingEnd = moment(booking.enDate, 'YYYY-MM-DD HH:mm'); // 判断两个时间区间是否重叠:当前服务区间与已有预约区间有交集 const isOverlap = currStart.isBefore(bookingEnd) && currEnd.isAfter(bookingStart); if (isOverlap) { isConflict = true; break; } } if (!isConflict) { newAvailables.push(ava); } } return newAvailables; };
关键逻辑说明
- 计算服务结束时间:对每个可选时段,计算该时段开始后90分钟的结束时间(注意用
moment(currStart)复制对象,避免修改原时间变量) - 区间重叠判断:两个时间区间重叠的核心判断条件是:
当前服务的开始时间 < 已有预约的结束时间 且 当前服务的结束时间 > 已有预约的开始时间
这个逻辑能覆盖所有重叠场景:比如当前服务在预约中间开始、在预约中间结束、完全包含预约、完全被预约包含等情况 - 过滤冲突时段:只要和任意已有预约重叠,就标记为不可用,否则加入可用列表
测试验证
用你提供的测试数据:
- 可选时段
12:00:结束时间是13:30,和已有预约13:30-15:00刚好衔接,无重叠,所以保留 - 可选时段
12:15:结束时间是13:45,和13:30-15:00的预约重叠,被排除 - 可选时段
16:30:结束时间是18:00,之后无预约,保留 - 最终结果会和你预期的
[12:00, 16:30, 16:45, 17:00]完全一致
内容的提问来源于stack exchange,提问作者Shay Kitoff
相关产品推荐
相关产品推荐

