Skip to content

Commit

Permalink
use event date
Browse files Browse the repository at this point in the history
  • Loading branch information
BlueHorn07 committed May 13, 2024
1 parent d4fe758 commit deb6cf1
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 71 deletions.
23 changes: 7 additions & 16 deletions components/board/calendar/calendar.table.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,29 +7,22 @@ const CalendarTable = ({ calendars }) => {
<Table celled selectable textAlign={'center'}>
<Table.Header>
<Table.Row>
<Table.HeaderCell width={4}>제목</Table.HeaderCell>
<Table.HeaderCell width={6}>기간</Table.HeaderCell>
<Table.HeaderCell width={1}>D-Day</Table.HeaderCell>
<Table.HeaderCell width={6}>제목</Table.HeaderCell>
<Table.HeaderCell width={4}>날짜</Table.HeaderCell>
<Table.HeaderCell width={2}>D-Day</Table.HeaderCell>
</Table.Row>
</Table.Header>
<Table.Body>
{calendars.map((calendar) => {
const isActive = moment().isBetween(
moment(calendar.start_date),
moment(calendar.end_date),
);
const duration = moment(calendar.end_date).diff(
moment(calendar.start_date),
'days',
);
const dDay = moment(calendar.start_date).diff(moment(), 'days');
const isDisabled = moment().isAfter(moment(calendar.event_date));
const dDay = moment(calendar.event_date).diff(moment(), 'days');

return (
<Link
href={`/board/calendar/update/${calendar.id}`}
key={calendar.id}
>
<Table.Row key={calendar.id} positive={isActive}>
<Table.Row key={calendar.id} disabled={isDisabled}>
<Table.Cell>
{calendar.link ? (
<a
Expand All @@ -44,9 +37,7 @@ const CalendarTable = ({ calendars }) => {
)}
</Table.Cell>
<Table.Cell>
{moment(calendar.start_date).format('YYYY-MM-DD')} ~{' '}
{moment(calendar.end_date).format('YYYY-MM-DD')} ({duration}
일)
{calendar.event_date}
</Table.Cell>
<Table.Cell>{dDay ? `D-${dDay}` : 'D-Day'}</Table.Cell>
</Table.Row>
Expand Down
30 changes: 2 additions & 28 deletions pages/board/calendar/create.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,27 +13,15 @@ const CalendarCreatePage = () => {

const [title, setTitle] = useState('');
const [start_date, setStartDate] = useState();
const [end_date, setEndDate] = useState();

const duration = moment(end_date).diff(moment(start_date), 'days');
const dDay = moment(event_date).diff(moment(), 'days');

const handleSubmit = async () => {
const body = {
title: title,
start_date: start_date,
end_date: end_date,
};

if (!start_date || !end_date) {
alert('시작 일자와 종료 일자를 입력해주세요.');
return;
}

if (start_date > end_date) {
alert('시작 일자가 종료 일자보다 늦을 수 없습니다.');
return;
}

PoPoAxios.post('/calendar', body, { withCredentials: true })
.then(() => {
alert('학사일정이 등록 되었습니다!');
Expand Down Expand Up @@ -68,23 +56,9 @@ const CalendarCreatePage = () => {
dateFormat="yyyy-MM-dd"
/>
</div>
<div className={'required field'}>
<label>종료 날짜</label>
<ReactDatePicker
selected={end_date ? moment(end_date).toDate() : null}
onChange={(date) => setEndDate(moment(date).format('YYYY-MM-DD'))}
onKeyDown={(e) => e.preventDefault()}
dateFormat="yyyy-MM-dd"
minDate={moment(start_date).toDate()}
/>
</div>
</div>
<Message>
{!start_date || !end_date
? '행사 시작 날짜와 종료 날짜를 입력해주세요.'
: start_date > end_date
? '시작 날짜가 종료 날짜보다 늦을 수 없습니다.'
: `행사 기간: ${start_date} ~ ${end_date} (${duration}일)`}
{!event_date ? '게시 시작 날짜와 종료 날짜를 입력해주세요.' : `D-${dDay}`}
</Message>

<Form.Button type={'submit'}>생성</Form.Button>
Expand Down
33 changes: 6 additions & 27 deletions pages/board/calendar/update/[id].jsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,23 +16,16 @@ const CalendarUpdatePage = ({ calendarInfo }) => {

const id = calendarInfo.id;
const [title, setTitle] = useState(calendarInfo.title);
const [start_date, setStartDate] = useState(calendarInfo.start_date);
const [end_date, setEndDate] = useState(calendarInfo.end_date);
const [event_date, setEventDate] = useState(calendarInfo.event_date);

const duration = moment(end_date).diff(moment(start_date), 'days');
const dDay = moment(event_date).diff(moment(), 'days');

const handleSubmit = async () => {
const body = {
title: title,
start_date: start_date,
end_date: end_date,
event_date: event_date,
};

if (start_date > end_date) {
alert('시작 일자가 종료 일자보다 늦을 수 없습니다.');
return;
}

PoPoAxios.put(`/calendar/${id}`, body, { withCredentials: true })
.then(() => {
alert('학사일정이 업데이트 되었습니다!');
Expand Down Expand Up @@ -60,31 +53,17 @@ const CalendarUpdatePage = ({ calendarInfo }) => {
<div className={'required field'}>
<label>시작 날짜</label>
<ReactDatePicker
selected={start_date ? moment(start_date).toDate() : null}
selected={event_date ? moment(event_date).toDate() : null}
onChange={(date) =>
setStartDate(moment(date).format('YYYY-MM-DD'))
setEventDate(moment(date).format('YYYY-MM-DD'))
}
onKeyDown={(e) => e.preventDefault()}
dateFormat="yyyy-MM-dd"
/>
</div>
<div className={'required field'}>
<label>종료 날짜</label>
<ReactDatePicker
selected={end_date ? moment(end_date).toDate() : null}
onChange={(date) => setEndDate(moment(date).format('YYYY-MM-DD'))}
onKeyDown={(e) => e.preventDefault()}
dateFormat="yyyy-MM-dd"
minDate={moment(start_date).toDate()}
/>
</div>
</div>
<Message>
{!start_date || !end_date
? '게시 시작 날짜와 종료 날짜를 입력해주세요.'
: start_date > end_date
? '시작 날짜가 종료 날짜보다 늦을 수 없습니다.'
: `게시 기간: ${start_date} ~ ${end_date} (${duration}일)`}
{!event_date ? '게시 시작 날짜와 종료 날짜를 입력해주세요.' : `D-${dDay}`}
</Message>

<Form.Group>
Expand Down

0 comments on commit deb6cf1

Please sign in to comment.