diff --git a/docs/ACS작업일지.md b/docs/ACS작업일지.md index d9c4e48..ce92117 100644 --- a/docs/ACS작업일지.md +++ b/docs/ACS작업일지.md @@ -795,3 +795,12 @@ - `npm.cmd run typecheck` 성공. - `npm.cmd test` 성공. - `npm.cmd run build` 성공. + +- 2026-07-16 출입신청 일시 선택 UI 재수정: + - 운영 서버에서 출입일시 캘린더 `[입력]` 버튼 흐름이 다시 막히는 현상 확인. + - 달력 팝업 내부 확정 버튼이 브라우저/라이브러리 이벤트와 충돌할 가능성이 있어 `[입력]` 버튼 의존 구조 제거. + - 날짜/시간 선택 즉시 `visitFrom`/`visitTo` 입력값에 반영되도록 단순화. + - 검증: + - `npm.cmd run typecheck` 성공. + - `npm.cmd run build` 성공. + - `npm.cmd test` 성공. diff --git a/frontend/src/components/DateTimePicker.tsx b/frontend/src/components/DateTimePicker.tsx index fb0dd2b..58581e2 100644 --- a/frontend/src/components/DateTimePicker.tsx +++ b/frontend/src/components/DateTimePicker.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react'; +import React from 'react'; import DatePicker, { registerLocale } from 'react-datepicker'; import { ko } from 'date-fns/locale'; import 'react-datepicker/dist/react-datepicker.css'; @@ -22,46 +22,22 @@ function fromLocalString(value: string): Date | null { return value ? new Date(value) : null; } -export const DateTimePicker: React.FC = ({ value, onChange, placeholder }) => { - const [open, setOpen] = useState(false); - const [draft, setDraft] = useState(fromLocalString(value)); - - useEffect(() => { - setDraft(fromLocalString(value)); - }, [value]); - - const confirm = () => { - if (draft) { - onChange(toLocalString(draft)); - } - setOpen(false); - }; - - return ( - setDraft(d)} - open={open} - onInputClick={() => setOpen(true)} - onCalendarOpen={() => setOpen(true)} - onClickOutside={() => setOpen(false)} - showTimeSelect - timeIntervals={5} - timeCaption="시간" - timeFormat="a h:mm" - dateFormat="yyyy.MM.dd (eee) a h:mm" - dateFormatCalendar="yyyy.MM" - locale="ko" - shouldCloseOnSelect={false} - placeholderText={placeholder ?? '날짜와 시간을 선택하세요'} - className="dt-input" - popperClassName="acs-datepicker" - > -
- -
-
- ); -}; +export const DateTimePicker: React.FC = ({ value, onChange, placeholder }) => ( + { + if (d) onChange(toLocalString(d)); + }} + showTimeSelect + timeIntervals={5} + timeCaption="시간" + timeFormat="a h:mm" + dateFormat="yyyy.MM.dd (eee) a h:mm" + dateFormatCalendar="yyyy.MM" + locale="ko" + shouldCloseOnSelect={false} + placeholderText={placeholder ?? '날짜와 시간을 선택하세요'} + className="dt-input" + popperClassName="acs-datepicker" + /> +);