feat: 활성화 전 이벤트만 편집 가능

softeerbootcamp4th · Aug 12, 2024 · 9fa7b3c · 9fa7b3c
1 parent d1f52e8
commit 9fa7b3c
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 3 deletions.
diff --git a/admin/src/components/DatePicker/index.tsx b/admin/src/components/DatePicker/index.tsx
@@ -2,10 +2,11 @@ import { ChangeEvent } from "react";
 
 interface DatePickerProps {
     date: string;
+    disabled?: boolean;
     onChangeDate: (date: string) => void;
 }
 
-export default function DatePicker({ date, onChangeDate }: DatePickerProps) {
+export default function DatePicker({ date, disabled = false, onChangeDate }: DatePickerProps) {
     const handleChange = (e: ChangeEvent<HTMLInputElement>) => {
         onChangeDate(e.target.value);
     };
@@ -17,6 +18,7 @@ export default function DatePicker({ date, onChangeDate }: DatePickerProps) {
             </div>
             <input
                 type="date"
+                disabled={disabled}
                 value={date}
                 onChange={handleChange}
                 className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5"

diff --git a/admin/src/components/TimePicker/index.tsx b/admin/src/components/TimePicker/index.tsx
@@ -2,10 +2,11 @@ import { ChangeEvent } from "react";
 
 interface TimePickerProps {
     time: string;
+    disabled?: boolean;
     onChangeTime: (time: string) => void;
 }
 
-export default function TimePicker({ time, onChangeTime }: TimePickerProps) {
+export default function TimePicker({ time, disabled = false, onChangeTime }: TimePickerProps) {
     const handleChange = (e: ChangeEvent<HTMLInputElement>) => {
         onChangeTime(e.target.value);
     };
@@ -31,6 +32,7 @@ export default function TimePicker({ time, onChangeTime }: TimePickerProps) {
                 <input
                     type="time"
                     id="time"
+                    disabled={disabled}
                     className="bg-gray-50 border leading-none border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5"
                     min="09:00"
                     max="18:00"

diff --git a/admin/src/features/Rush/EventList.tsx b/admin/src/features/Rush/EventList.tsx
@@ -5,7 +5,7 @@ import Button from "@/components/Button";
 import DatePicker from "@/components/DatePicker";
 import Table from "@/components/Table";
 import TimePicker from "@/components/TimePicker";
-import { STATUS_MAP } from "@/constants/common";
+import { EVENT_STATUS, STATUS_MAP } from "@/constants/common";
 import { EVENT_LIST_HEADER, QUERY_OPTION } from "@/constants/rush";
 import useFetch from "@/hooks/useFetch";
 import useRushEventDispatchContext from "@/hooks/useRushEventDispatchContext";
@@ -42,35 +42,42 @@ export default function EventList() {
 
     const getTableData = () => {
         return rushList.map((item, idx) => {
+            const canEdit = item.status !== EVENT_STATUS.BEFORE;
             return [
                 item.rushEventId,
                 <DatePicker
+                    disabled={canEdit}
                     date={item.eventDate}
                     onChangeDate={(date) => handleChangeItem("eventDate", idx, date)}
                 />,
                 <TimePicker
+                    disabled={canEdit}
                     time={item.openTime}
                     onChangeTime={(time) => handleChangeItem("openTime", idx, time)}
                 />,
                 <TimePicker
+                    disabled={canEdit}
                     time={item.closeTime}
                     onChangeTime={(time) => handleChangeItem("closeTime", idx, time)}
                 />,
                 getTimeDifference(item.openTime, item.closeTime),
                 <Button
+                    disabled={canEdit}
                     buttonSize="sm"
                     onClick={() => navigate(`/rush?q=${QUERY_OPTION.OPTION}`, { state: { idx } })}
                 >
                     선택지 관리
                 </Button>,
                 <Button
+                    disabled={canEdit}
                     buttonSize="sm"
                     onClick={() => navigate(`/rush?q=${QUERY_OPTION.PRIZE}`, { state: { idx } })}
                 >
                     경품 관리
                 </Button>,
                 <div className="flex w-full border-b">
                     <input
+                        disabled={canEdit}
                         value={item.winnerCount}
                         onChange={(e) =>
                             handleChangeItem("winnerCount", idx, parseInt(e.target.value) || 0)