• EN

日期区间组件支持快捷选择“上午”、“下午”、“全天”

作者:eteams2025-04-15 17:37

概述

增加全局的上下午时间设置,支持在日期区间组件里快捷选择上下午和全天时间,减少用户操作步骤。

后台设置

入口【后台管理中心】-【全局基础】-【通用设置】-【日期时间设置】,如图1所示:

 

1

说明:

1、【全天时段】用于控制【日期区间】字段打开时的默认开始时间和结束时间,默认为08:00~18:00兼容历史。

2、【启用“上午/下午”选项】开关默认不启用,启用后,可通过设置【上午、下午分界点】或【午休时间】,来控制日期区间字段默认的“上午”时间段和“下午”时间段,结合全天时段设置,可快捷选择“上午”、“下午”及“全天”时段,如图2所示;不启用时,默认时间段读取“全天时段”,日期区间面板无“上午/下午/全天”选项:

 

2

3、设置后可在预览区查看预览效果,如图3所示:

 

3

前台组件效果

1. PC端交互说明

1)【启用“上午/下午”选项】关闭时

选择日期后,时间填充为后台设置的全天时段,如图4所示:

 

4

快捷选择日期范围或在面板拖动点选跨天日期,默认开始时间和结束时间也保持【全天时段】,如图5所示:

 

5

用户可继续修改时间,最终面板里的【开始时间】、【结束时间】输入框内容为准。

2)【启用“上午/下午”选项】开关打开后

日期区间字段打开时底部有【上午】、【下午】和【全天】选项,默认均不选中,如图6所示:

 

6

选择【上午】【下午】【全天】时,以后台设定的上午/下午/全天时间段填充【开始时间】和【结束时间】。

快捷日期范围点击后填充【开始日期】和【结束日期】字段,不关闭面板,需要确认时间后再关闭,如图7所示:

 

7

 

2. 移动端交互说明

1)【启用“上午/下午”选项】关闭时

开始日期时间、结束日期时间里的【开始时间】、【结束时间】默认为设置的【全天时段】;

快捷选择日期范围或在面板滑动选择跨天日期,默认开始时间和结束时间也保持【全天时段】,用户可继续修改时间,最终以用户选择的时间为准。

 

 8

2)【启用“上午/下午”选项】开关打开后

【启用“上午/下午”选项】启用后,打开【开始日期时间】或【结束日期时间】面板,底部均有【上午】、【下午】和【全天】选项;

选择【上午】【下午】【全天】时,以后台设定的上午/下午/全天时间段填充【开始时间】和【结束时间】:

 

9

3)不管是否启用“上午/下午”选项,快捷日期范围点击后都是关闭快捷选择,默认用“全天”时间范围填充开始时间和结束时间

 

10

 

前台表单字段效果

表单统一读取全局设置,不额外增加配置项,但是需要考虑与【默认值】功能一起用的情况。

3. PC端交互说明

1)日期区间不设置默认值时

如【启用“上午/下午”选项】关闭,则选择日期后时间默认填充为后台设置的【全天时段】,用户可继续修改时间,最终以【开始时间】、【结束时间】输入框的内容为准,如图11所示:

 

 

11

如【启用“上午/下午”选项】启用,则同上述公共组件交互,选择日期后可根据底部“上午/下午/全天”选项填充开始时间和结束时间,用户可继续修改时间,最终以【开始时间】、【结束时间】输入框的内容为准,如图12所示:

 

 

12

2)日期区间设置默认值时

【启用“上午/下午”选项】关闭时,由于字段有默认值,打开后自动以字段设置的默认值填充【开始日期】、【开始时间】、【结束日期】、【结束时间】;清空字段内容后,可恢复读取后台全局【全天时段】,如图13所示:

 

 

13

【启用“上午/下午”选项】启用时,由于字段有默认值,打开后自动以字段设置的默认值填充【开始日期】、【开始时间】、【结束日期】、【结束时间】,此时点击“上午/下午/全天”选项,可根据设定的全天时段和上下午分界点,重新填充【开始时间】、【结束时间】;清空字段内容后,优先以后台【默认时间段设置】,如图14所示:

 

 

14

1. 移动端交互说明

1)日期区间不设置默认值时

如【启用“上午/下午”选项】关闭,则选择日期后时间默认填充为后台设置的【全天时段】,用户可继续修改时间,最终以【开始时间】、【结束时间】输入框的内容为准,如图15所示:

 

15

如【启用“上午/下午”选项】打开,则同上述公共组件交互,选择日期后可根据底部“上午/下午/全天”选项填充开始时间和结束时间,用户可继续修改时间,最终以用户选定的时间为准,如图16所示:

 

 

16

 

2)日期区间设置默认值时

如【启用“上午/下午”选项】关闭,由于字段有默认值,打开后自动以字段设置的默认值填充【开始日期】、【开始时间】、【结束日期】、【结束时间】;清空字段内容后,可恢复读取后台全局【全天时段】,如图17、图18所示:

 

17

 

18

如【启用“上午/下午”选项】打开,由于字段有默认值,打开后自动以字段设置的默认值填充【开始日期】、【开始时间】、【结束日期】、【结束时间】,此时点击“上午/下午/全天”选项,可根据设定的全天时段和上下午分界点,重新填充【开始时间】、【结束时间】,如图19、图20所示:

 

19

 

20


Download Log in Enable for free

Scan with WeChat to register and install

在线咨询
  • WeCom service group

    另存
  • Pre-sales consultant

    另存
  • QQ group

    413040701

    Join

Follow us

021-50388680

sales@eteams.cn

Live