summaryrefslogtreecommitdiff
path: root/src/Entry.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/Entry.jsx')
-rw-r--r--src/Entry.jsx36
1 files changed, 26 insertions, 10 deletions
diff --git a/src/Entry.jsx b/src/Entry.jsx
index e554050..c486680 100644
--- a/src/Entry.jsx
+++ b/src/Entry.jsx
@@ -4,7 +4,7 @@ import {AdapterDayjs} from '@mui/x-date-pickers/AdapterDayjs';
import 'dayjs/locale/id';
-function Entry({propDate, propStart, propFinish}) {
+function Entry({propId, propDate, propStart, propFinish, handleEntryChange}) {
const [date, setDate] = useState(propDate);
const [start, setStart] = useState(propStart);
const [finish, setFinish] = useState(propFinish);
@@ -12,15 +12,31 @@ function Entry({propDate, propStart, propFinish}) {
return (
<LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale='id'>
<div style={{display: 'flex', gap: '5px'}}>
- <DatePicker label="Tanggal Lembur" value={date}
- onAccept={(newDate) => setDate(newDate)}/>
- <TimePicker label="Mulai" ampm={false} value={start} maxTime={finish} onAccept={(newStart) => {
- setStart(newStart)
- }}/>
- <TimePicker label="Selesai" ampm={false} value={finish} minTime={start} onAccept={(newFinish) => {
- setFinish(newFinish);
- console.log(newFinish)
- }}/>
+ <DatePicker label="Tanggal Lembur"
+ value={date}
+ onAccept={(newDate) => {
+ setDate(newDate);
+ handleEntryChange({id: propId, date: newDate}, 'date')
+ }}
+ />
+ <TimePicker label="Mulai"
+ ampm={false}
+ value={start}
+ maxTime={finish}
+ onAccept={(newStart) => {
+ setStart(newStart);
+ handleEntryChange({id: propId, start: newStart}, 'start')
+ }}
+ />
+ <TimePicker label="Selesai"
+ ampm={false}
+ value={finish}
+ minTime={start}
+ onAccept={(newFinish) => {
+ setFinish(newFinish);
+ handleEntryChange({id: propId, finish: newFinish}, 'finish')
+ }}
+ />
</div>
</LocalizationProvider>
)