时间网格

周视图与日视图共享同一套可配置的时间网格:可见小时范围、网格密度、拖拽吸附、营业时间与实时时间线。

6:00–22:00,营业时间,周数

2026/9/7 – 2026/9/13

第37周
周一
7
周二
8
周三
9
周四
10
周五
11
周六
12
周日
13
全天
7时
8时
9时
10时
11时
12时
13时
14时
15时
16时
17时
18时
19时
20时
21时
22时

选项

属性默认值作用
dayStartHour / dayEndHour0 / 24裁剪可见小时范围,范围外的事件被截断显示。
slotDuration30次级网格线的分钟间隔。
snapDuration15拖动、调整、框选时的吸附步长。
hourHeight48每小时的像素高度,相当于缩放级别。
scrollToHour7打开视图时自动滚动到的小时。
businessHoursnulltrue 表示周一至五 9–17,或传 { days, startHour, endHour }。非工作时段置灰。
nowIndicatortrue今日列上的红色当前时间线,每 30 秒刷新。
weekNumbersfalse在侧栏显示 ISO 周数。
hour12跟随 locale强制 12/24 小时制。

重叠事件

重叠事件按“碰撞簇”打包分列——与 Google、Apple 日历同族的算法。释放的列会被复用:一个长事件加两个前后相接的短事件只占两列。

约束

validRange 把导航与交互限制在一个日期窗口内(窗口外的日期置灰且不可交互,翻页自动钳制)。eventOverlap={false} 会拒绝与其他事件时间冲突的拖放、调整和快速新建——预约场景的利器。

仅限本周,禁止时间冲突

2026年9月

周一
周二
周三
周四
周五
周六
周日
31
9月 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
10月 1
2
3
4

键盘编辑

用 Tab 聚焦事件块后:Alt+↑/↓ 按吸附步长移动,Alt+←/→ 移动一天,Alt+Shift+↑/↓ 调整时长。所有变更都会通过 aria-live 区域向屏幕阅读器播报。

全天事件栏

全天与跨天事件渲染在网格上方的独立栏中,长条精确覆盖所跨日期;超出可见范围时切平边角以示延续。