Merge branch 'seoyeon' into develop0725

frontend/src/SurveyRouter.tsx

@@ -9,6 +9,8 @@ import { Profile } from "./profile";
 import { EditResultButton } from "./survey";
 import { EditSurvey } from "./survey/EditSurvey";
 import { ResultSurvey } from "./survey/ResultSurvey";
+import { CompleteSurvey } from "./survey/CompleteSurvey";
+import { SameSurvey } from "./survey/SameSurvey";
 
 export const SurveyRouter = () => {
   return (
@@ -23,6 +25,8 @@ export const SurveyRouter = () => {
             <Route path="result" element={<ResultSurvey />} />
           </Route>
           <Route path="survey/:surveyId" element={<AnswerSurveyForm />} />
+          <Route path="survey/complete" element={<CompleteSurvey />} />
+          <Route path="survey/same" element={<SameSurvey />} />
           <Route
             path="profile"
             element={

frontend/src/answers/ACheckboxForm.tsx

@@ -37,7 +37,7 @@ export const ACheckboxForm = ({ element, answerQuestion }: Props) => {
       {element.content.choices.map((choice) => (
         <div key={choice.value}>
           <input
-            className="mr-2"
+            className="mr-2 w-4 h-4"
             type="checkbox"
             value={choice.text}
             onChange={handleChange}

frontend/src/answers/AnswerSurveyForm.tsx

@@ -8,7 +8,6 @@ import { AQuestion } from "./AQuestion";
 export const AnswerSurveyForm = () => {
   let { surveyId } = useParams<{ surveyId: string }>();
   const [files, setFiles] = useState<{ questionId: string; file: File }[]>([]);
-  const [requiredErrorMessage, setRequiredErrorMessage] = useState("");
   const [error, setError] = useState("");
   const [loading, setLoading] = useState(false);
   const [success, setSuccess] = useState(false);
@@ -33,13 +32,12 @@ export const AnswerSurveyForm = () => {
     ansSurvey();
   }, [surveyId]);
 
-  // const isSurvey = localStorage.getItem(`survey_${surveyId}`);
+  const isSurvey = localStorage.getItem(`survey_${surveyId}`);
 
-  // if (isSurvey) {
-  //   console.log("object", isSurvey);
-  //   alert("제출한 설문조사입니다");
-  //   navigate("/");
-  // }
+  if (isSurvey) {
+    console.log("object", isSurvey);
+    navigate("/survey/same");
+  }
 
   const addFiles = (oneFile: { questionId: string; file: File }) => {
     if (!files.find((a) => a.questionId === oneFile.questionId)) {
@@ -91,7 +89,7 @@ export const AnswerSurveyForm = () => {
         const newAnswer: AnswerType = await answerApi.saveAnswers(formData);
         console.log(newAnswer);
         localStorage.setItem(`survey_${surveyId}`, surveyId ?? "");
-        // alert("제출되었습니다");
+        navigate("/survey/complete");
 
         setSuccess(true);
         setError("");

frontend/src/auth/Login.tsx

@@ -37,7 +37,7 @@ export const Login = () => {
 
   return (
     <div className="flex flex-col items-center mt-5">
-      <div className="text-2xl mt-5">로그인</div>
+      <div className="text-2xl mt-20">로그인</div>
       <form onSubmit={handleSubmit} className="flex flex-col mt-3 w-80">
         <label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
           이메일

frontend/src/auth/SignUp.tsx

@@ -68,7 +68,7 @@ export const SignUp = () => {
 
   return (
     <div className="flex flex-col items-center mt-5">
-      <div className="text-2xl mt-5">회원가입</div>
+      <div className="text-2xl mt-20">회원가입</div>
       <form onSubmit={handleSubmit} className="flex flex-col mt-3 w-80">
         <label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
           이름

frontend/src/commons/constants.ts

@@ -5,6 +5,5 @@ export const QUESTION_TYPES = new Map([
   ["checkbox", "체크박스"],
   ["file", "파일"],
   ["rating", "선형"],
-  ["grid", "그리드"],
   ["date", "날짜"],
 ]);

frontend/src/home/Home.tsx

 import React, { FormEvent } from "react";
 import { useAuth } from "../auth/auth.context";
+import SurveyImg from "../icons/surveyimg.png";
 
 export const Home = () => {
   const { user } = useAuth();
@@ -20,10 +21,10 @@ export const Home = () => {
         가장 쉽게 설문지를 만드세요!
       </div>
       <div className="flex flex-col place-items-center container">
-        <div className="flex h-14 w-28 items-center border-2 border-themeColor font-bold text-black bg-gray-200 hover:bg-themeColor rounded-lg ">
+        <div className="flex h-14 w-28 items-center border-2 font-bold text-black bg-gray-200 hover:bg-themeColor rounded-lg ">
           <button
             type="button"
-            className="text-center h-full w-28 font-bold text-black place-items-center"
+            className="text-center text-xl h-full w-28 font-bold hover:text-white place-items-center"
             onClick={clickHome}
           >
             +
@@ -32,10 +33,7 @@ export const Home = () => {
         <p className="text-center text-xl text-black mt-3">Create now!</p>
       </div>
       <div className="flex justify-center">
-        <img
-          src="https://3hbgf23vu0wr11wkpae5igwe-wpengine.netdna-ssl.com/wp-content/uploads/2021/04/SurveyExample_v3.jpg"
-          className="object-scale-down justify-center"
-        />
+        <img src={SurveyImg} className="object-scale-down justify-center" />
       </div>
     </div>
   );

frontend/src/survey/CompleteSurvey.tsx

+import React from "react";
+import { useNavigate } from "react-router-dom";
+
+export const CompleteSurvey = () => {
+  const navigate = useNavigate();
+  return (
+    <div className="flex flex-col place-items-center mt-24">
+      <div className="flex flex-col container place-items-center place-content-center space-y-5 space-x-2 w-full h-56">
+        <p className="text-3xl font-bold">설문조사가 제출되었습니다</p>
+        <p>응답이 완료되었습니다</p>
+        <button
+          className="flex place-content-start rounded-lg bg-themeColor w-20 h-10 text-center py-2 px-4 text-white"
+          type="button"
+          onClick={() => navigate("/")}
+        >
+          홈으로
+        </button>
+      </div>
+    </div>
+  );
+};

frontend/src/survey/ResultSurvey.tsx

@@ -36,7 +36,6 @@ export const ResultSurvey = () => {
       setLoading(false);
     }
   }
-
   return (
     <div className="flex flex-col place-items-center">
       <div className="flex flex-col container place-items-center mt-4">

frontend/src/survey/SameSurvey.tsx

+import React from "react";
+import { useNavigate } from "react-router-dom";
+
+export const SameSurvey = () => {
+  const navigate = useNavigate();
+  return (
+    <div className="flex flex-col place-items-center mt-24">
+      <div className="flex flex-col container place-items-center place-content-center space-y-5 space-x-2 w-full h-56">
+        <p className="text-3xl font-bold px-3">이미 제출된 설문조사입니다</p>
+        <button
+          className="flex place-content-start rounded-lg bg-themeColor w-20 h-10 text-center py-2 px-4 text-white"
+          type="button"
+          onClick={() => navigate("/")}
+        >
+          홈으로
+        </button>
+      </div>
+    </div>
+  );
+};