DatePicker
Used to select a specific date or a range of dates.
Usage scenario
When a date input is required;
When a date range input is required;
Mostly used for date input in forms, or for entering date conditions in data filtering criteria;
Currently commonly used for data filtering in querying order history, asset/fund records, profit and loss analysis, etc.
Select a time point
Filtering by specific time, day, week, month, quarter, and year
Select time period
Specific time - time, day - day, week - week, month - month, quarter - quarter, year - year
Quick selection
Quick filter range labels for today, yesterday, the last three days, the last seven days, and the last fifteen days.
Note example
Start date
End date
Funding records
Do
2023-05-16
2023-05-16
May
2023
Su
Mo
You
We
Th
Fr
Sa
27
28
29
30
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
1
2
3
4
5
6
7
June
2023
Su
Mo
You
We
Th
Fr
Sa
27
28
29
30
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
1
2
3
4
5
6
7
最近7天
Last 3 days
Yesterday
Today
Do
May
2023
Su
Mo
You
We
Th
Fr
Sa
27
28
29
30
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
1
2
3
4
5
6
7
00:00:00
00
01
02
03
04
05
06
00
00
01
02
03
04
05
06
00
00
01
02
03
04
05
06
00
2023-05-16 00:00:00
2023-05-20 00:00:00
Do
Start date
End date
Funding records
Caution
2023-05-16
2023-05-16
May
2023
Su
Mo
You
We
Th
Fr
Sa
27
28
29
30
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
1
2
3
4
5
6
7
June
2023
Su
Mo
You
We
Th
Fr
Sa
27
28
29
30
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
1
2
3
4
5
6
7
Last 7 days bills
Last 3 days bills
Yesterday bills
Today bills
Caution
May
2023
Su
Mo
You
We
Th
Fr
Sa
27
28
29
30
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
1
2
3
4
5
6
7
June
2023
Su
Mo
You
We
Th
Fr
Sa
27
28
29
30
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
1
2
3
4
5
6
7
00:00:00
00
01
02
03
04
05
06
00
00
01
02
03
04
05
06
00
00
01
02
03
04
05
06
00
2023-05-16 00:00:00
2023-05-20 00:00:00
Caution
The position of the date picker should generally be at the top of the page or module, rather than at the bottom. The behavior for filtering data ranges should be conducted in the table header, corresponding to changes in the form.
When configuring shortcut filter text, the text configuration should pay attention to semantic clarity, avoiding unexpected recognition of data dimensions.
When using a date range, avoid having a time filter within the date range filter to prevent confusion for users about which specific day's time they are selecting.