diff --git a/admin/src/apis/rushAPI.ts b/admin/src/apis/rushAPI.ts index df35e0bb..1cae7fb5 100644 --- a/admin/src/apis/rushAPI.ts +++ b/admin/src/apis/rushAPI.ts @@ -5,7 +5,6 @@ import { GetRushParticipantListParams, GetRushParticipantListResponse, GetRushWinnerListParams, - PutRushEventParams, PutRushEventResponse, } from "@/types/rushApi"; import { fetchWithTimeout } from "@/utils/fetchWithTimeout"; @@ -110,7 +109,7 @@ export const RushAPI = { throw error; } }, - async putRush(body: PutRushEventParams): Promise { + async putRush(body: FormData[]): Promise { try { return new Promise((resolve) => resolve([])); const response = await fetchWithTimeout(`${baseURL}`, { diff --git a/admin/src/components/FileInput/index.tsx b/admin/src/components/FileInput/index.tsx index 82cba5ed..a9f652b3 100644 --- a/admin/src/components/FileInput/index.tsx +++ b/admin/src/components/FileInput/index.tsx @@ -2,7 +2,7 @@ import { useEffect, useState } from "react"; interface FileInputProps { selectedFile: File | string | null; - setSelectedFile: (file: File | null) => void; + setSelectedFile: (file: File) => void; } export default function FileInput({ selectedFile, setSelectedFile }: FileInputProps) { diff --git a/admin/src/features/Rush/EventList.tsx b/admin/src/features/Rush/EventList.tsx index 9bc81c3f..4f3affb9 100644 --- a/admin/src/features/Rush/EventList.tsx +++ b/admin/src/features/Rush/EventList.tsx @@ -24,7 +24,7 @@ export default function EventList() { const dispatch = useRushEventDispatchContext(); const { isSuccess: isSuccessPutRush, fetchData: putRush } = useFetch(() => - RushAPI.putRush([]) + RushAPI.putRush(getFormData()) ); useEffect(() => { @@ -36,7 +36,34 @@ export default function EventList() { const getFormData = () => { return rushList.map((rush) => { const formData = new FormData(); - // formData.append("image", selectedFile); + + formData.append("rushEventId", rush.rushEventId.toString()); + formData.append("eventDate", rush.eventDate); + formData.append("openTime", rush.openTime); + formData.append("closeTime", rush.closeTime); + formData.append("winnerCount", rush.winnerCount.toString()); + formData.append("prizeDescription", rush.prizeDescription); + formData.append("status", rush.status); + + formData.append("prizeImageUrl", rush.prizeImageUrl); + + formData.append("leftOption[rushOptionId]", rush.leftOption.rushOptionId.toString()); + formData.append("leftOption[mainText]", rush.leftOption.mainText); + formData.append("leftOption[subText]", rush.leftOption.subText); + formData.append("leftOption[resultMainText]", rush.leftOption.resultMainText); + formData.append("leftOption[resultSubText]", rush.leftOption.resultSubText); + + formData.append("leftOption[imageUrl]", rush.leftOption.imageUrl); + + formData.append("rightOption[rushOptionId]", rush.rightOption.rushOptionId.toString()); + formData.append("rightOption[mainText]", rush.rightOption.mainText); + formData.append("rightOption[subText]", rush.rightOption.subText); + formData.append("rightOption[resultMainText]", rush.rightOption.resultMainText); + formData.append("rightOption[resultSubText]", rush.rightOption.resultSubText); + + formData.append("rightOption[imageUrl]", rush.rightOption.imageUrl); + + return formData; }); }; diff --git a/admin/src/features/Rush/RushPrizeForm.tsx b/admin/src/features/Rush/RushPrizeForm.tsx index d5500b64..04d678d6 100644 --- a/admin/src/features/Rush/RushPrizeForm.tsx +++ b/admin/src/features/Rush/RushPrizeForm.tsx @@ -1,6 +1,7 @@ import { useEffect, useState } from "react"; import { useLocation, useNavigate } from "react-router-dom"; import Button from "@/components/Button"; +import FileInput from "@/components/FileInput"; import SelectForm from "@/components/SelectForm"; import TextField from "@/components/TextField"; import useRushEventDispatchContext from "@/hooks/useRushEventDispatchContext"; @@ -47,7 +48,13 @@ export default function RushPrizeForm() { }; const option = [ - ["이미지", ], + [ + "이미지", + setPrizeState({ ...prizeState, prizeImageUrl: file })} + />, + ], [ "경품 이름 (20자 이내)", ([]); - const [selectedFile, setSelectedFile] = useState<(File | string | null)[]>([]); useEffect(() => { if (rushIdx !== undefined) { setSelectOptionState([rushList[rushIdx].leftOption, rushList[rushIdx].rightOption]); - setSelectedFile([ - rushList[rushIdx].leftOption.imageUrl, - rushList[rushIdx].rightOption.imageUrl, - ]); } }, [rushList]); @@ -53,7 +48,7 @@ export default function RushSelectForm() { showToast(); }; - const handleChangeItem = (key: string, changeIdx: number, text: string) => { + const handleChangeItem = (key: string, changeIdx: number, text: string | File) => { const updatedItem = selectOptionState.map((item, idx) => { if (idx === changeIdx) { return { ...item, [key]: text }; @@ -64,16 +59,6 @@ export default function RushSelectForm() { setSelectOptionState(updatedItem); }; - const handleSelectFile = (idx: number, file: File | null) => { - const updatedSelectedFile = selectedFile.map((selected, selectedIdx) => { - if (selectedIdx === idx) { - return file; - } - return selected; - }); - setSelectedFile(updatedSelectedFile); - }; - const getSelectOption = (idx: number) => { if (selectOptionState.length >= 2) { return [ @@ -101,8 +86,8 @@ export default function RushSelectForm() { [ "이미지", handleSelectFile(idx, file)} + selectedFile={selectOptionState[idx].imageUrl} + setSelectedFile={(file) => handleChangeItem("imageUrl", idx, file)} />, ], [ diff --git a/admin/src/types/rush.ts b/admin/src/types/rush.ts index 31b38d41..93493e6d 100644 --- a/admin/src/types/rush.ts +++ b/admin/src/types/rush.ts @@ -8,7 +8,7 @@ export interface RushEventType { openTime: string; closeTime: string; winnerCount: number; - prizeImageUrl: string; + prizeImageUrl: File | string; prizeDescription: string; status: RushEventStatusType; leftOption: RushOptionType; @@ -21,11 +21,11 @@ export interface RushOptionType { subText: string; resultMainText: string; resultSubText: string; - imageUrl: string; + imageUrl: File | string; } export interface RushPrizeType { - prizeImageUrl: string; + prizeImageUrl: File | string; prizeDescription: string; } @@ -57,12 +57,3 @@ export interface RushParticipantType { createdAt: string; rank: number; } - -export interface RushOptionType { - rushOptionId: number; - mainText: string; - subText: string; - resultMainText: string; - resultSubText: string; - imageUrl: string; -}