Scheduler 日程调度
月视图日程组件:日格内渲染事件芯片(标题 + 色条),events 读/写通道 + addEvent / updateEvent / removeEvent CRUD 方法;点事件芯片派发 oas-event-click、点日格派发 oas-day-click(宿主接编辑器),数据经 CRUD 方法变更时派发 oas-events-change(外部 setAttribute('events', …) 写入不派发)。
基础用法
周起始与本地化(first-day-of-week + locale)
月视图 + 事件芯片(标题/色条/+N 合并)
周 / 日视图
周视图(时刻表 + 定时事件块;全天行进顶部)
日视图(单列时刻表)+ 视图切换 oas-view-change
周/日视图为时刻表(start-hour / end-hour 限幅,默认 8–20 点):带 start/end 的事件按时间绝对定位成块,无 start 的事件进顶部全天行;视图按钮切换派发 oas-view-change。事件块支持拖拽移动(拖到目标列/时刻改 date + start,保持时长)与底缘拖拽缩放(改 end,15 分钟步进),落定回写并派发 oas-events-change。
重复规则与提醒
重复规则(RRULE 子集:daily/weekly/monthly + interval + until)
repeat 按 freq × interval 从 date 起展开(daily 按天数间隔、weekly 按周、monthly 按同日),until 截止(含当日);el.events 仍只读原始条目(展开只发生在渲染层)。
提醒(remind 分钟,到点派发 oas-remind)
带 remind(分钟)的事件,组件在「start − remind 分钟」到点派发 oas-remind(detail: { id, event };无 start 按当日 00:00 计)。过期/已删/断开连接均不再派发。
时区与日程视图
日程视图(agenda:锚点起 28 天时序清单)
view="agenda" 从锚点起 28 天按日分组列出事件(重复事件已展开):定时事件带 start–end 时间、无 start 标「全天」;点事件行派发 oas-event-click、点日头派发 oas-day-click。
时区(timezone:影响标题/列头与「今天」标记)
timezone 接受 IANA 时区名(如 Asia/Shanghai / America/New_York / UTC),影响标题/列头的日期格式化与「今天」标记(经 Intl timeZone);非法时区回落本地。
CRUD(方法通道)
addEvent / updateEvent / removeEvent + oas-events-change 反馈
事件反馈(点击联动)
oas-event-click / oas-day-click 宿主联动
点击事件芯片派发 oas-event-click(detail: { id, event },且不触发日格点击);点空白日格派发 oas-day-click(detail: { date })——宿主据此打开编辑器/表单,组件不内置编辑表单。
API
oas-scheduler
属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
end-hour | 时间轴结束小时(>start-hour 且 <=24,默认 20) | string | 20 |
events | 日程事件(JSON):[{ id?, date: YYYY-MM-DD, title, color?, start?, end? }]——日格渲染事件芯片(标题+色条),>2 合并 +N 条 | SchedulerEvent[] | [] |
first-day-of-week | 周起始日(0-6);缺省按 locale 推导 | string | — |
locale | 本地化(覆盖 config-provider 注入与全局 locale) | string | — |
page-show-date | 面板月锚点(受控):yyyy-MM-dd,变化时重锚定显示月份 | string | — |
start-hour | 时间轴起始小时(0-23,默认 8) | string | 8 |
timezone | 时区(IANA,如 Asia/Shanghai;空串=本地):影响标题/列头日期格式化与「今天」标记(经 Intl timeZone);非法时区回落本地 | string | — |
view | 视图:month(默认)/ week / day / agenda;周/日视图为时刻表 + 事件块定位,无 start 的事件进全天行;agenda 为 28 天时序清单 | SchedulerView | month |
Property(JS property;是否写回 attribute 见各行说明)
| Property | 说明 | 类型 | 默认值 |
|---|---|---|---|
events | 日程事件(SchedulerEvent[]):el.events 读(含自动 id 的拷贝);el.events = [...] 写(同步 events 属性 + 重渲染 + 派发 oas-events-change) | SchedulerEvent[] | [] |
事件
| 事件 | 说明 |
|---|---|
oas-day-click | 点击空白日格时派发,detail: { date }——宿主接新增表单 |
oas-event-click | 点击事件芯片时派发,detail: { id, event }(不触发日格点击) |
oas-events-change | events 数据变化(set/addEvent/updateEvent/removeEvent)时派发,detail: |
oas-remind | 事件提醒到点时派发,detail: { id, event }(start - remind 分钟,组件内置定时器) |
oas-view-change | 视图切换(month/week/day/agenda)时派发,detail: { view };属性首次吸收不派发 |