在 Salesforce 中打造日历时间段选择器
Salesforce 提供日期选择器和时间字段,但不提供可选择时间段的网格。下面说明一个真正的 Salesforce 时间段选择器需要什么,以及如何无需自建就能获得。
时间段选择器是一种特定的界面:先在日历上选一天,下方的网格把这一天划分成可预订的时间段,已占用的时间段明显标为不可用。人人都认得它,因为网上每个预约网站都在用。Salesforce 却没有自带。
Salesforce 实际提供了什么
标准的日期/时间字段显示为一个日期输入框加一个时间下拉列表。它只是一个表单控件,完全不知道还有哪些已被预订。没有任何机制阻止用户选择已被占用的时间段,因为字段并不知道其他记录的存在。这项检查要到后面才会发生,在验证规则或 Flow 中,而那时用户已经做出了选择。
这就是差距所在。时间段选择器会在用户做选择之前查询已有记录,只提供空闲的时间段。
一个真正的时间段选择器必须做到什么
| 要求 | 标准字段 | 使用 MultiDatePick |
|---|---|---|
| 把一天划分为时间段 | 没有时间段的概念 | 任意间隔(常见为 15、30 或 60 分钟) |
| 了解工作时间 | 任何时间都有效 | 最早和最晚时间,或每个资源各自的营业时间 |
| 显示已占用的时段 | 什么都不显示 | 已有预订直接显示在网格上 |
| 每个时间段多人预订 | 无法表达 | 容量,并实时显示“已预订占容量”标记 |
| 不同日期使用不同时间 | 一个字段,一个值 | 允许每个日期使用不同时间 |
| 保存时阻止冲突 | 只能靠自定义逻辑 | 冲突行为:阻止、跳过或允许 |
为什么自己构建比看上去更费工夫
界面渲染是最简单的部分。下面这些才是没人估算进去的:
查询预订
要高效,不能在有人打开双月视图时突破调控器限制 (governor limits)。
重叠计算
一旦预订时长各不相同,就会变得非常繁琐。
时区
当前用户的时区和记录的时区并不总是一致。
竞态条件
两个人在同一时刻看着同一个空闲时间段。
字段级安全性
组件必须遵守当前用户可以看到的范围。
无障碍
一个由可单击 div 组成的网格,默认无法用键盘导航。
无障碍最需要用心。时间段网格需要正确的 ARIA 网格语义、方向键导航,以及不只依靠颜色传达的状态。这是大多数自建方案会省略的部分,也正是采购审查会问到的部分。
给时间段分组,让人一眼就能看清
朝九晚五、按 15 分钟划分,一天就是 32 个时间段。平铺成一个列表就是一堵墙。按时段(上午、下午、晚上)分组后,就变成三个短小的区块。当选择的人是用手机操作的客户时,这一点帮助最大。
完全不需要日历的时候
有时日期已经确定。在一条已有日期的预约记录页面上,月历就是多余的。“仅时间网格”会去掉日历,只显示这一天的时间段网格;日期取自宿主记录上的字段,或直接设置。
构成选择器的设置
每一项都是设置向导中的一个字段。这里没有任何内容需要代码。
| 设置项 | 作用 | API 名称 |
|---|---|---|
| 时间段间隔(分钟)(Time Slot Interval (Minutes)) | 每个时间段的长度。任意分钟数。 | timeInterval |
| 最早时间 / 最晚时间(Earliest Time / Latest Time) | Date Time 组件上网格覆盖的时间范围。 | minTime、maxTime |
| 营业时间开始 / 结束字段(Business Hours Start / End Field) | Booking 组件上每个资源各自的工作时间。 | businessHoursStartField |
| 容量字段 | 每个资源在每个时间段可容纳的预订数。 | capacityField |
| 按时段对时间段分组(Group Time Slots by Period) | 上午、下午和晚上三个分区。 | groupTimeSlotsByPeriod |
| 冲突行为(Conflict Behavior) | 保存时阻止、跳过或允许冲突。 | conflictBehavior |
| 仅时间网格 | 只显示时间段网格,用于一个已确定的日期。 | timeGridOnly |
常见问题
什么是日历时间段选择器?
一种先选日期的日历,下方的网格把这一天划分成可预订的时间段。已被占用的时间段显示为不可用,因此用户只会选到空闲的时间。
Salesforce 有时间段选择器吗?
自定义对象上没有。标准的日期/时间字段只是一个日期输入框加一个时间下拉列表,看不到其他记录。MultiDatePick 提供的时间段选择器会在日历加载时读取已有预订,只提供空闲的时间段。
时间段可以设为任意长度吗?
可以。时间段间隔可以是任意分钟数。常见的是 15、30 或 60 分钟,45 分钟的面试时间段同样适用。
添加时间段选择器需要 Apex 或开发人员吗?
不需要。设置向导会生成配置,只需设置 Config Name(配置名称),就能把组件放到记录页面、应用程序页面、Experience Cloud 站点或屏幕 Flow(Screen Flow)中。无需编写任何代码。