本技术涉及计算机，尤其涉及一种时间范围选择方法、系统、电子设备及存储介质。
背景技术：
1、在web应用中，存在着许多需要选择时间范围的场景，以用来筛选特定时间范围内的数据。目前，对于时间范围的设置的处理方式都是基于输入框点击下拉展开时间面板的方式进行设置，在时间面板中分别选择起始的时间对应的年月日和结束时间对应的年月日。这种时间设置方式效率低下，例如需要精确到天的时间范围初始选择操作，一共需要点击5次才能完成一次时间范围设置：1、点击输入框打开时间面板；2、点击选择开始时间；3、点击确定(界面跳转至结束时间选择面板)；4、点击选择结束时间；5、点击确定完成时间范围设置。这种复杂的时间选择交互方式，导致时间范围选择效率低下，用户体验不佳。
技术实现思路
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、在一些实施例中，所述响应于对所述时间轴上的第二滑块的第二操作指令，确定结束时间并更新所述第二滑块在所述时间轴上的第二像素位置，包括以下步骤：
31、响应于对所述时间轴上的第二滑块的第二操作指令，确定操作点在前端页面的第二操作位置，并将所述时间轴的参考端相对前端页面的参考位置减去第二操作位置，得到第二滑块的第二像素位置；
32、根据所述第二像素位置与时间轴相对宽度值的占比，以及单个时间相对宽度值确定第二数组下标值；
33、根据所述第二数组下标值查询所述时间数组确定结束时间；
34、根据所述结束时间更新所述第二滑块在所述时间轴上的第二像素位置。
35、为实现上述目的，本技术实施例的另一方面提出了一种时间范围选择系统，包括：
36、第一模块，用于响应于时间范围选择指令，显示时间选择区域，其中，所述时间选择区域包括时间轴、第一滑块和第二滑块；
37、第二模块，用于响应于对所述时间轴上的第一滑块的第一操作指令，确定开始时间并更新所述第一滑块在所述时间轴上的第一像素位置；
38、第三模块，用于响应于对所述时间轴上的第二滑块的第二操作指令，确定结束时间并更新所述第二滑块在所述时间轴上的第二像素位置；
39、第四模块，用于根据所述开始时间和所述结束时间确定目标时间范围。
40、为实现上述目的，本技术实施例的另一方面提出了一种电子设备，所述电子设备包括存储器、处理器、存储在所述存储器上并可在所述处理器上运行的程序以及用于实现所述处理器和所述存储器之间的连接通信的数据总线，所述程序被所述处理器执行时实现上述实施例所述的方法。
41、为实现上述目的，本技术实施例的另一方面提出了一种存储介质，所述存储介质为计算机可读存储介质，用于计算机可读存储，所述存储介质存储有一个或者多个程序，所述一个或者多个程序可被一个或者多个处理器执行，以实现上述实施例所述的方法。
42、本技术提出的时间范围选择方法、系统、电子设备及存储介质，其响应于前端的快捷选择指令，在时间选择区域中显示相应时间区间的时间轴，然后响应于对时间轴上的第一滑块的第一操作指令，确定开始时间并更新第一滑块在时间轴上的第一像素位置，响应于对时间轴上的第二滑块的第二操作指令，确定结束时间并更新第二滑块在时间轴上的第二像素位置，根据开始时间和结束时间确定目标时间范围。本技术通过在前端交互页面上的时间选择区域中显示相应时间区间的时间轴，时间轴上分别设置第一滑块和第二滑块分别用于使用户定位开始时间和结束时间，并通过更新第一滑块和第二滑块在时间轴上的落点位置，以向用户展示后端识别的开始时间和结束时间，不仅能够准确进行时间选择，还能简化时间范围选择的交互方式，提高时间范围选择效率，提高用户体验。
1.一种时间范围选择方法，其特征在于，包括以下步骤：
2.根据权利要求1所述的时间范围选择方法，其特征在于，所述时间范围选择方法还包括以下步骤：
3.根据权利要求1所述的时间范围选择方法，其特征在于，所述响应于时间范围选择指令，显示时间选择区域，包括以下步骤：
4.根据权利要求3所述的时间范围选择方法，其特征在于，所述时间范围选择方法还包括以下步骤：
5.根据权利要求1所述的时间范围选择方法，其特征在于，所述时间轴所显示的时间参数存储于时间数组中；
6.根据权利要求5所述的时间范围选择方法，其特征在于，所述响应于对所述时间轴上的第一滑块的第一操作指令，确定开始时间并更新所述第一滑块在所述时间轴上的第一像素位置，包括以下步骤：
7.根据权利要求5所述的时间范围选择方法，其特征在于，所述响应于对所述时间轴上的第二滑块的第二操作指令，确定结束时间并更新所述第二滑块在所述时间轴上的第二像素位置，包括以下步骤：
8.一种时间范围选择系统，其特征在于，包括：
9.一种电子设备，其特征在于，所述电子设备包括存储器、处理器、存储在所述存储器上并可在所述处理器上运行的程序以及用于实现所述处理器和所述存储器之间的连接通信的数据总线，所述程序被所述处理器执行时实现如权利要求1至7任一项所述的方法的步骤。
10.一种存储介质，所述存储介质为计算机可读存储介质，用于计算机可读存储，其特征在于，所述存储介质存储有一个或者多个程序，所述一个或者多个程序可被一个或者多个处理器执行，以实现权利要求1至7中任一项所述的方法的步骤。
