Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
C
canifa_note
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Vũ Hoàng Anh
canifa_note
Commits
2730b905
Unverified
Commit
2730b905
authored
May 19, 2023
by
Athurg Gooth
Committed by
GitHub
May 19, 2023
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: highlight the DatePicker's date (#1669)
Co-authored-by:
Athurg Feng
<
athurg@gooth.org
>
parent
34913cfc
Changes
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
17 additions
and
1 deletion
+17
-1
DatePicker.tsx
web/src/components/kit/DatePicker.tsx
+17
-1
No files found.
web/src/components/kit/DatePicker.tsx
View file @
2730b905
import
{
useEffect
,
useState
}
from
"react"
;
import
{
useEffect
,
useState
}
from
"react"
;
import
{
useTranslation
}
from
"react-i18next"
;
import
{
useTranslation
}
from
"react-i18next"
;
import
{
DAILY_TIMESTAMP
}
from
"@/helpers/consts"
;
import
{
DAILY_TIMESTAMP
}
from
"@/helpers/consts"
;
import
{
getMemoStats
}
from
"@/helpers/api"
;
import
{
getDateStampByDate
}
from
"@/helpers/datetime"
;
import
{
useUserStore
}
from
"@/store/module"
;
import
Icon
from
"../Icon"
;
import
Icon
from
"../Icon"
;
import
"@/less/common/date-picker.less"
;
import
"@/less/common/date-picker.less"
;
...
@@ -14,11 +17,24 @@ const DatePicker: React.FC<DatePickerProps> = (props: DatePickerProps) => {
...
@@ -14,11 +17,24 @@ const DatePicker: React.FC<DatePickerProps> = (props: DatePickerProps) => {
const
{
t
}
=
useTranslation
();
const
{
t
}
=
useTranslation
();
const
{
className
,
datestamp
,
handleDateStampChange
}
=
props
;
const
{
className
,
datestamp
,
handleDateStampChange
}
=
props
;
const
[
currentDateStamp
,
setCurrentDateStamp
]
=
useState
<
DateStamp
>
(
getMonthFirstDayDateStamp
(
datestamp
));
const
[
currentDateStamp
,
setCurrentDateStamp
]
=
useState
<
DateStamp
>
(
getMonthFirstDayDateStamp
(
datestamp
));
const
[
countByDate
,
setCountByDate
]
=
useState
(
new
Map
());
useEffect
(()
=>
{
useEffect
(()
=>
{
setCurrentDateStamp
(
getMonthFirstDayDateStamp
(
datestamp
));
setCurrentDateStamp
(
getMonthFirstDayDateStamp
(
datestamp
));
},
[
datestamp
]);
},
[
datestamp
]);
const
currentUserId
=
useUserStore
().
getCurrentUserId
();
useEffect
(()
=>
{
getMemoStats
(
currentUserId
).
then
(({
data
:
{
data
}
})
=>
{
const
m
=
new
Map
();
for
(
const
record
of
data
)
{
const
date
=
getDateStampByDate
(
record
*
1000
);
m
.
set
(
date
,
true
);
}
setCountByDate
(
m
);
});
},
[
currentUserId
]);
const
firstDate
=
new
Date
(
currentDateStamp
);
const
firstDate
=
new
Date
(
currentDateStamp
);
const
firstDateDay
=
firstDate
.
getDay
()
===
0
?
7
:
firstDate
.
getDay
();
const
firstDateDay
=
firstDate
.
getDay
()
===
0
?
7
:
firstDate
.
getDay
();
const
dayList
=
[];
const
dayList
=
[];
...
@@ -89,7 +105,7 @@ const DatePicker: React.FC<DatePickerProps> = (props: DatePickerProps) => {
...
@@ -89,7 +105,7 @@ const DatePicker: React.FC<DatePickerProps> = (props: DatePickerProps) => {
return
(
return
(
<
span
<
span
key=
{
d
.
datestamp
}
key=
{
d
.
datestamp
}
className=
{
`day-item ${d.datestamp === datestamp ? "current" : ""}`
}
className=
{
`day-item ${
countByDate.has(d.datestamp) && "font-bold"} ${
d.datestamp === datestamp ? "current" : ""}`
}
onClick=
{
()
=>
handleDateItemClick
(
d
.
datestamp
)
}
onClick=
{
()
=>
handleDateItemClick
(
d
.
datestamp
)
}
>
>
{
d
.
date
}
{
d
.
date
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment