diff --git a/src/components/Rotation/Calendar.tsx b/src/components/Rotation/Calendar.tsx index 4dda852..dce45f0 100644 --- a/src/components/Rotation/Calendar.tsx +++ b/src/components/Rotation/Calendar.tsx @@ -96,8 +96,8 @@ export default class Calendar extends React.Component { const { currentEvents, auth } = this.state; const title = auth?.id; - - if (title === null) { + + if (!title) { window.alert('로그인을 먼저 해주세요!'); return; } @@ -126,16 +126,17 @@ export default class Calendar extends React.Component { const { auth } = this.state; const title = auth?.id; - if (title === null) { + if (!title) { window.alert('로그인을 먼저 해주세요!'); info.revert(); return; } if (title !== info.event.title) { - window.alert('본인 일정만 변경이 가능합니다.'); - info.revert(); - return; + if (!window.confirm(`본인의 일정이 아닌 ${info.event.title}의 일정을 수정하는 것이 맞습니까?`)) { + info.revert(); + return; + } } /* revert를 사용하더라도 eventChange 훅이 동작한다. 따라서 훅을 이용하지 않고 직접 this.requestChange 함수를 호출하여 사용한다. */ @@ -150,7 +151,7 @@ export default class Calendar extends React.Component { const { auth } = this.state; const title = auth?.id; - if (title === null) { + if (!title) { window.alert('로그인을 먼저 해주세요!'); return; } @@ -215,8 +216,8 @@ export default class Calendar extends React.Component { data: { intraId: info.event.title, before: info.oldEvent.startStr, after: info.event.startStr }, headers: { Authorization: `Bearer ${getToken()}` }, }, - `사서 로테이션 일정<${info.oldEvent.startStr}>이 <${info.event.startStr}>으로 성공적으로 변경되었습니다.`, - `사서 로테이션 일정<${info.oldEvent.startStr}>을 <${info.event.startStr}>로 변경에 실패했습니다.`, + `${info.oldEvent.title}의 사서 로테이션 일정<${info.oldEvent.startStr}>이 <${info.event.startStr}>으로 성공적으로 변경되었습니다.`, + `${info.oldEvent.title}의 사서 로테이션 일정<${info.oldEvent.startStr}>을 <${info.event.startStr}>로 변경에 실패했습니다.`, ); }; } diff --git a/src/components/Rotation/Rotation.tsx b/src/components/Rotation/Rotation.tsx index 0dccb2d..c59e652 100644 --- a/src/components/Rotation/Rotation.tsx +++ b/src/components/Rotation/Rotation.tsx @@ -11,14 +11,13 @@ import 'react-calendar/dist/Calendar.css'; import '@css/Rotation/New_Rotation.scss'; import { createWeekdaysObject, - getKoreaDate, getFirstDateOfMonth, getLastDateOfMonth, getDaysInMonth, getFirstDayOfMonth, isWeekend, MONTH_IN_YEAR, - getFourthWeekPeriod, + getFourthWeekFromMondayToFridayPeriod, getNextAttendPeriodStrFunction, } from './rotation_utils'; @@ -108,9 +107,10 @@ const createUnavailableDates = (record: Record) => .map(([date_key, _]) => parseInt(date_key)); /** - * 사서 로테이션 신청 기간: ISO기준 4주차 월요일 ~ 일요일 + * 사서 로테이션 신청 기간: ISO기준 4주차 월요일 ~ 금요일 (23.06.27 업데이트 이전 월요일 ~ 일요일) */ -const getRotationApplicationPeriod = getFourthWeekPeriod; +// const getRotationApplicationPeriod = getFourthWeekPeriod; +const getRotationApplicationPeriod = getFourthWeekFromMondayToFridayPeriod; const calculateIsRotationApplicationPeriod = (curr: Date) => { const [startDate, endDate] = getRotationApplicationPeriod(curr); @@ -271,6 +271,7 @@ export const Rotate = () => { const isRotationApplicationPeriod = calculateIsRotationApplicationPeriod(currentDate); const [record, setRecord] = useState(() => ({ ...initialRecord })); const [isSubmit, setIsSumbit] = useState(false); + const [isLoading, setIsLoading] = useState(true); // pageReload 관련하여 추가, 아지 관련 기능 완전 업데이트 X const { mutate } = useSWRConfig(); /** @@ -307,6 +308,16 @@ export const Rotate = () => { const resetDates = () => setRecord({ ...initialRecord }); + const pageReload = () => { + if (!isLoading) { + window.location.reload(); + // 아래 코드는 추후 보완하여 업데이트 + // setRecord(() => ({ ...initialRecord })); + // setIsSumbit(false); + // setIsLoading(true); + } + }; + const onClickPostEvent = async () => { if (!checkIsPeriod() || !checkTokenAndRedirect()) { return; @@ -316,6 +327,7 @@ export const Rotate = () => { const res = await postAttend(intraId, record); alert('성공적으로 신청되었습니다'); mutate(`${getAddress()}/api/rotation/attend`); + pageReload(); } catch (error) { errorAlert(error); } @@ -330,6 +342,7 @@ export const Rotate = () => { try { const res = await deleteAttend(intraId); alert('성공적으로 신청 취소되었습니다'); + pageReload(); } catch (error) { errorAlert(error); } @@ -357,9 +370,12 @@ export const Rotate = () => { errorAlert(error); } } + setIsLoading(false); }; - fetchAttendLimit(intraId, currentDate); - }, []); + if (isLoading) { + fetchAttendLimit(intraId, currentDate); + } + }, [isLoading]); return (
diff --git a/src/components/Rotation/rotation_utils.ts b/src/components/Rotation/rotation_utils.ts index a72159a..5052d08 100644 --- a/src/components/Rotation/rotation_utils.ts +++ b/src/components/Rotation/rotation_utils.ts @@ -71,6 +71,12 @@ export const getFourthWeekPeriod = (date = new Date()) => { return [dateOfMondayOnFourthWeek, dateOfSundayOnFourthWeek]; }; +export const getFourthWeekFromMondayToFridayPeriod = (date = new Date()) => { + const [dateOfMondayOnFourthWeek, dateOfSundayOnFourthWeek] = getFourthWeekPeriod(date); + const dateOfFridayOnFourthWeek = dateOfSundayOnFourthWeek - 2; + return [dateOfMondayOnFourthWeek, dateOfFridayOnFourthWeek] +}; + export const getNextAttendPeriod = (curr: Date, getAttendPeriod: (date?: Date) => number[]) => { const currDate = curr.getDate(); const endDate = getAttendPeriod(curr)[1];