Merge branch 'CC-167' into CC-174

softeerbootcamp4th · Aug 21, 2024 · f43baae · f43baae
2 parents 95a4bb4 + 074ef65
commit f43baae
Show file tree

Hide file tree

Showing 8 changed files with 242 additions and 154 deletions.
diff --git a/Caecae/src/components/PhoneNumberOverlay/PhoneNumberOverlay.tsx b/Caecae/src/components/PhoneNumberOverlay/PhoneNumberOverlay.tsx
@@ -1,15 +1,18 @@
 import { ChangeEventHandler, useEffect, useState } from "react";
 import { action } from "../../jobs/Overlay/OverlayWork";
-import { store } from "../../shared/Hyundux";
+import { Action, store } from "../../shared/Hyundux";
 
 interface PhoneNumberOverlayProps {
   type: "findCasper" | "raceCasper";
-  onClick?: (phoneNumber: string) => void;
+  submitNumber?: (
+    phoneNumber: string,
+    action: (amount: number) => Action
+  ) => void;
 }
 
 const PhoneNumberOverlay = ({
   type,
-  onClick = () => {},
+  submitNumber = () => {},
 }: PhoneNumberOverlayProps) => {
   const [timeLeft, setTimeLeft] = useState(3 * 60); // 3분을 초 단위로 변환
   const [phoneNumber, setPhoneNumber] = useState("");
@@ -159,8 +162,7 @@ const PhoneNumberOverlay = ({
         <div
           onClick={() => {
             const parameter = phoneNumber.replace(/-/g, "");
-            onClick(parameter);
-            store.dispatch(action.nextPage());
+            submitNumber(parameter, action.nextPage);
           }}
           className="bg-[#002C5F] h-[12%] flex items-center justify-center hover:cursor-pointer"
         >

diff --git a/Caecae/src/jobs/Overlay/OverlayWork.tsx b/Caecae/src/jobs/Overlay/OverlayWork.tsx
@@ -23,10 +23,13 @@ const overlayReducer: Reducer<OverlayPayLoad> = {
     const payLoad = state.payload;
     switch (action.actionName) {
       case "toggleOverlay": {
-        return makePayLoad(state, { isShowing: !payLoad.isShowing });
+        return makePayLoad(state, { isShowing: !payLoad.isShowing, index: 0 });
       }
       case "nextPage": {
-        return makePayLoad(state, { index: payLoad.index + 1 });
+        const actionPayload = action.payload as { amount: number };
+        return makePayLoad(state, {
+          index: payLoad.index + actionPayload.amount,
+        });
       }
       default:
         return state;
@@ -41,10 +44,13 @@ const action = {
       actionName: "toggleOverlay",
     };
   },
-  nextPage: (): Action => {
+  nextPage: (amount: number = 1): Action => {
     return {
       type: WORK_NAME,
       actionName: "nextPage",
+      payload: {
+        amount: amount,
+      },
     };
   },
 };

diff --git a/Caecae/src/pages/Admin/AdminPage.tsx b/Caecae/src/pages/Admin/AdminPage.tsx
@@ -2,6 +2,8 @@ import { ChangeEvent, useState } from "react";
 import PictureGameBoard from "../../components/common/PictureGameBoard";
 import huynxios from "../../shared/Hyunxios";
 import findMeToDTO from "./FindMeToDTO";
+import Response from "../../utils/Response";
+import { WinnerDTO } from "./WinnerDTO";
 
 export interface FindMe {
   day: number;
@@ -60,6 +62,7 @@ const AdminPage = () => {
   const [day, setDay] = useState(0);
   const [answer, setAnswer] = useState<FindMeAnswer>(defaultFindMeAnswer);
   const [mode, setMode] = useState("findme");
+  const [winnders, setWinnders] = useState<WinnerDTO[]>([]);
 
   function changeQuestionURL(url: string) {
     const newFindme = [...findmes];
@@ -77,6 +80,24 @@ const AdminPage = () => {
     });
   }
 
+  const winnerData = winnders.map((winner) => {
+    return (
+      <tr>
+        <td>{winner.ranking}</td>
+        <td>{winner.phone}</td>
+        <td>{winner.distance}</td>
+        <td>{winner.selection}</td>
+      </tr>
+    );
+  });
+  async function getWinners() {
+    const response = await huynxios.post<Response<WinnerDTO[]>>(
+      "/api/admin/racing/winners",
+      {}
+    );
+    setWinnders(response.data);
+  }
+
   const tableData = findmes[day].answers.map((eachAnswer) => {
     return (
       <tr>
@@ -297,12 +318,25 @@ const AdminPage = () => {
             placeholder="Enter text here"
           />
           <div className="w-[30px]"></div>
-          <div className="bg-slate-300 flex justify-center items-center w-[200px] h-[40px]">
+          <div
+            className="bg-slate-300 flex justify-center items-center w-[200px] h-[40px]"
+            onClick={() => getWinners()}
+          >
             <p>let's 당첨</p>
           </div>
         </div>
+        <table className="w-full mt-[30px]">
+          <thead className="bg-slate-200">
+            <td className="border border-gray-600">랭킹</td>
+            <td className="border border-gray-600">전화번호</td>
+            <td className="border border-gray-600">거리</td>
+            <td className="border border-gray-600">옵션</td>
+          </thead>
+          <tbody>{winnerData}</tbody>
+        </table>
       </div>
     );
+
   <div className="flex items-center">
     <p className="text-[14px]">당첨 인원</p>
     <div className="w-[30px]"></div>
@@ -313,6 +347,7 @@ const AdminPage = () => {
     />
     <p className="text-[14px]">명</p>
   </div>;
+
   return (
     <div className="flex flex-col p-[24px]">
       <div className="flex justify-between justify-center items-center">

diff --git a/Caecae/src/pages/Admin/WinnerDTO.tsx b/Caecae/src/pages/Admin/WinnerDTO.tsx
@@ -0,0 +1,6 @@
+export interface WinnerDTO {
+  ranking: number;
+  phone: string;
+  distance: number;
+  selection: number;
+}
diff --git a/Caecae/src/pages/FindingGame/FindingGamePage.tsx b/Caecae/src/pages/FindingGame/FindingGamePage.tsx
@@ -39,11 +39,12 @@ const FindingGamePage = () => {
           element={
             <PhoneNumberOverlay
               type="findCasper"
-              onClick={async (phoneNumber) => {
+              submitNumber={async (phoneNumber, action) => {
                 await huynxios.post("/api/finding/register", {
                   ticketId: gameState.ticketId,
                   phone: phoneNumber,
                 });
+                store.dispatch(action(1));
               }}
             />
           }